/* Apply inside the iframe: the iframe element is not its scrolling root. */
html,body{width:100%;max-width:100%;overflow-x:hidden;overscroll-behavior-x:none;touch-action:pan-y pinch-zoom}
/* Invisible radios must be contained by their own answer, not the viewport. */
.option{position:relative}
.option input[type=radio]{inset:0;width:100%;height:100%;min-width:0;min-height:0;margin:0;padding:0;border:0}
body{background:transparent;color:#253e38;font-family:'Avenir Next','PingFang TC',sans-serif}
.app-header{display:none}.page{min-height:0;padding:18px}.panel{background:rgba(255,255,255,.84);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.8);border-radius:8px;box-shadow:none}
.page-narrow{max-width:980px}.section-heading h2{font-weight:500}.eyebrow{color:#557266}.primary-button{background:#48695b;border-color:#48695b}.secondary-button,.segment,.language-segment{border-radius:4px}.segment.active,.language-segment.active{background:#48695b;color:white}
.client-page{max-width:1040px;margin:auto}.client-topbar{margin-bottom:12px}.client-topbar h2{font-size:22px;font-weight:500}.header-status{background:rgba(255,255,255,.8);color:#304d40}
.legend-panel{background:rgba(255,255,255,.78);border:0;border-radius:4px;padding:18px 24px}.option-legend{display:none}.legend-panel h3{font-size:16px}.legend-panel p{font-size:17px}
.question-list{display:block}.question-row{display:none;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.95);border-radius:8px;padding:32px;margin:22px 0 12px;box-shadow:0 12px 40px rgba(32,67,51,.05)}
.question-row.current{display:block;animation:arrive .65s ease both}.question-text{font-size:24px;line-height:1.8;font-weight:400;min-height:90px}.question-number{display:block;font-size:12px;color:#587164;margin-bottom:12px}.options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:28px}.option{width:auto;height:auto;min-height:70px;padding:12px;display:flex;flex-direction:column;gap:7px;justify-content:center;border-radius:4px;background:rgba(255,255,255,.75);font-size:14px}.option.selected{background:#48695b;color:white;border-color:#48695b}.option-label{font-size:14px;font-weight:400;line-height:1.5}.question-nav{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:16px 0}.question-nav button{min-width:100px;min-height:44px;background:rgba(255,255,255,.90);color:#2f5042;border:1px solid #bdccc3;border-radius:4px;padding:10px 18px}.question-nav button:disabled{opacity:.4}.question-progress{color:#314d40;font-size:14px}.pause-sheet{background:rgba(255,255,255,.94);padding:48px 24px;text-align:center;border-radius:8px;font-size:23px;line-height:1.8}.pause-sheet button{margin-top:24px}.client-page.paused .question-list,.client-page.paused .legend-panel,.client-page.paused .question-nav,.client-page.paused #submitButton{display:none!important}button:focus-visible,.option:focus-within{outline:3px solid #588c77;outline-offset:3px}
@keyframes arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.reduced-motion .question-row.current{animation:none}
@media(max-width:600px){.page{padding:8px}.question-row{padding:22px 16px}.question-text{font-size:20px;min-height:0}.options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.legend-panel{padding:14px}.question-nav{flex-wrap:wrap}.question-nav button{min-width:80px}.client-topbar{align-items:flex-start}.panel{padding:20px}.question-progress{order:-1;width:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){.question-row.current{animation:none}}
@media print{body{background:white}.question-nav,.pause-sheet{display:none}.print-report{background:white}}
.panel{background:rgba(255,255,255,.60);border:0;border-radius:0;box-shadow:none}
.client-topbar h2,.section-heading h2,.question-text{font-family:'Noto Serif TC','Songti TC',serif;font-weight:400}
.legend-panel{background:transparent;border:0;border-radius:0;padding-left:0;padding-right:0;box-shadow:none}
.question-row{background:rgba(250,253,250,.76);border:0;border-radius:0;box-shadow:none}
.option{background:transparent;border:0;border-bottom:1px solid #92a69b;border-radius:0}
.option.selected{background:rgba(69,105,88,.15);border-color:#335846;color:#254c3b}
.question-nav button{background:transparent;border:0;border-radius:0}.header-status{background:transparent;border:0;padding:8px 0}
.question-progress{font-variant-numeric:tabular-nums}.pause-sheet{border-radius:0;font-family:'Noto Serif TC','Songti TC',serif}
.question-row,.question-row.current{display:block;animation:none;scroll-margin:24px}
#completionStatus{display:none}
.question-nav{position:sticky;bottom:0;z-index:10;display:grid;grid-template-columns:auto minmax(90px,1fr) auto;gap:18px;margin:24px 0 0;padding:14px 18px calc(14px + env(safe-area-inset-bottom));background:rgba(247,251,249,.95);backdrop-filter:blur(18px);border-top:1px solid #cbdad2}
.question-progress{display:grid;gap:7px;text-align:center;order:initial;width:100%;font-size:14px}
.question-progress progress{display:block;width:100%;height:6px;border:0;border-radius:3px;overflow:hidden;accent-color:#416e59;background:#dce7e0}
.question-progress progress::-webkit-progress-bar{background:#dce7e0}
.question-progress progress::-webkit-progress-value{background:#416e59;transition:width .3s}
.question-progress progress::-moz-progress-bar{background:#416e59}
.question-nav button{cursor:pointer;transition:background .2s,box-shadow .2s,transform .2s}
.question-nav button[data-step="1"]{background:#365e4d;color:white;border:1px solid #365e4d;border-radius:4px;box-shadow:0 4px 12px #21483526;min-width:116px}
.question-nav button[data-step="1"]:hover{background:#244b3b;transform:translateY(-2px);box-shadow:0 7px 18px #21483540}
.question-nav button:active{transform:scale(.95)}
.question-nav button:disabled{cursor:default}
#submitButton{scroll-margin-bottom:110px}
.client-page{padding-bottom:120px}
.question-nav{position:fixed;left:50%;transform:translateX(-50%);width:min(calc(100% - 36px),1004px);box-sizing:border-box;margin:0}
@media(max-width:600px){.question-nav{padding:12px 8px calc(12px + env(safe-area-inset-bottom));gap:10px}.question-nav button{min-width:68px;padding:10px}.question-nav button[data-step="1"]{min-width:96px}}
@media(prefers-reduced-motion:reduce){.question-nav button,.question-progress progress::-webkit-progress-value{transition:none}.question-nav button:hover,.question-nav button:active{transform:none}}
@media print{.question-nav{display:none}}

/* Match the landscape's mist and stone tones; keep warning colors intact. */
:root{--ink:#344852;--muted:#596d78;--accent:#536f80;--accent-strong:#3d5868;--line:#cbd7de;--soft:#edf2f5}
body{color:var(--ink)}
.eyebrow,.question-number{color:var(--muted)}
.primary-button,.segment.active,.language-segment.active{background:var(--accent);border-color:var(--accent);color:#fff}
.primary-button:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.header-status,.question-progress,.question-nav button{color:var(--ink)}
.question-row{background:rgba(249,251,253,.78)}
.option{border-color:#9baeb9}
.option:hover{background:rgba(221,233,241,.6)}
.option.selected{background:rgba(201,220,233,.72);border-color:var(--accent);color:#304e60}
button:focus-visible,.option:focus-within{outline-color:#597e96}
.question-nav{background:rgba(244,248,251,.96);border-top-color:var(--line)}
.question-progress progress{accent-color:var(--accent);background:#dce5eb}
.question-progress progress::-webkit-progress-bar{background:#dce5eb}
.question-progress progress::-webkit-progress-value{background:var(--accent)}
.question-progress progress::-moz-progress-bar{background:var(--accent)}
.question-nav button[data-step="1"]{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 4px 12px #344f6226}
.question-nav button[data-step="1"]:hover{background:var(--accent-strong);box-shadow:0 7px 18px #344f6238}
.question-guide-toolbar{display:flex;justify-content:flex-end;max-width:1040px;margin:auto;padding:4px 18px}
.question-guide-toolbar button,#question-guide header button{display:grid;place-items:center;width:44px;height:44px;padding:10px;border:0;border-radius:6px;background:transparent;color:var(--accent);cursor:pointer}
.question-guide-toolbar button:hover,#question-guide header button:hover{background:rgba(225,235,242,.8)}
.question-guide-toolbar svg,#question-guide svg{width:22px;height:22px}
#question-guide{box-sizing:border-box;width:min(640px,calc(100% - 28px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid #d4e0e7;border-radius:8px;padding:24px;background:rgba(247,251,253,.98);color:var(--ink);box-shadow:0 16px 50px #344f6233}
#question-guide::backdrop{background:rgba(39,60,75,.3)}
#question-guide header{display:flex;align-items:center;justify-content:space-between;gap:12px}
#question-guide header button{flex:none}
#question-guide h2{font-size:23px;margin:0}#question-guide h3{font-size:18px;margin:0 0 8px}
#question-guide section{padding:18px 0;border-bottom:1px solid var(--line)}
#question-guide p{font-size:16px;line-height:1.85;margin:0}#question-guide .guide-note{font-size:14px;margin-top:18px;color:var(--muted)}
@media print{.question-guide-toolbar,#question-guide{display:none!important}}
.password-field-title{display:block;line-height:1.7;color:var(--ink)}
.password-field-title strong{color:#36586e;white-space:nowrap;text-decoration:underline;text-decoration-color:#a9bfce;text-underline-offset:4px}
/* A compact progress strip, with navigation handled by normal scrolling. */
.question-nav{display:block;padding:7px 12px calc(7px + env(safe-area-inset-bottom));backdrop-filter:none;-webkit-backdrop-filter:none}
.question-progress{grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:12px;font-size:12px;line-height:18px}
.question-progress progress{height:3px;border-radius:2px}
.question-progress span{text-align:right;white-space:nowrap}
.client-page{padding-bottom:64px}
#submitButton{scroll-margin-bottom:64px}

/* Quiet translucent surfaces without backdrop sampling of the moving scenery. */
.panel{background:rgba(247,251,253,.42);backdrop-filter:none;-webkit-backdrop-filter:none}
.question-row{background:rgba(247,251,253,.52);backdrop-filter:none;-webkit-backdrop-filter:none}
.panel input,.panel select,.panel textarea{background:rgba(250,253,254,.46)}
.panel input:focus,.panel select:focus,.panel textarea:focus{background:rgba(250,253,254,.64)}

/* Native date controls must not enlarge a grid's intrinsic minimum on Safari. */
.form-grid>label{min-width:0;grid-template-columns:minmax(0,1fr)}
.form-grid input,.form-grid select,.form-grid textarea{min-width:0;max-width:100%;box-sizing:border-box}
.date-selects{min-width:0;grid-template-columns:minmax(0,1.15fr) repeat(2,minmax(0,.9fr))}
#assessmentDate{display:block;appearance:none;-webkit-appearance:none;box-sizing:border-box;width:100%;min-width:0;max-width:100%;inline-size:100%;min-inline-size:0;max-inline-size:100%;height:46px;overflow:hidden}
#assessmentDate::-webkit-date-and-time-value{min-width:0;min-height:1.4em;text-align:left}
#assessmentDate::-webkit-datetime-edit{min-width:0;padding:0}
@media print{.panel,.question-row,.panel input,.panel select,.panel textarea{background:#fff}}

/* Four choices stay together, with full labels allowed to wrap within each. */
@media(max-width:700px){
  .client-page{width:100%;max-width:none;padding:8px 0 64px}
  .question-row{padding:20px 12px;margin:12px 0;scroll-margin:12px}
  .question-text{font-size:20px;line-height:1.65;min-height:0}
  .question-number{margin-bottom:8px}
  .options{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:20px}
  .option{min-width:0;min-height:88px;padding:10px 3px;gap:5px;justify-content:flex-start}
  .option-label{font-size:14px;line-height:1.5;overflow-wrap:anywhere}
  .question-nav{width:100%;padding:7px 12px;bottom:0}
  .question-guide-toolbar{padding:0 4px}
  .client-topbar,.legend-panel,#clientError{margin-left:12px;margin-right:12px}
  #submitButton{margin-left:12px;max-width:calc(100% - 24px)}
  .form-grid>*{min-width:0}
  input,select,textarea{font-size:16px;min-width:0;max-width:100%;box-sizing:border-box}
  input[type=date]{display:block;width:100%;min-width:0}
  input[type=date]::-webkit-date-and-time-value{text-align:left;min-height:1.4em}
}
/* Keep the setup action compact and stable when the software keyboard closes. */
#setupPage .single-action{display:flex;justify-content:flex-end;align-items:center}
#startButton{flex:0 0 auto;width:auto;max-width:100%;min-height:46px;height:46px;padding:10px 20px;font-size:16px;line-height:24px;white-space:nowrap;appearance:none;-webkit-appearance:none;box-sizing:border-box}

.option{touch-action:manipulation}
