/* Recognition-first navigation and explicit review workflow. */
section[id],div[id]{scroll-margin-top:24px}
.hero{max-width:960px;margin:58px auto 44px;padding:0 24px;text-align:center}
.hero h1{font-size:clamp(38px,5.4vw,68px);line-height:1.14;letter-spacing:-2px;margin:22px 0}
.hero h1 em{margin:0}.hero>p{max-width:620px;margin:0 auto;font-size:17px;line-height:1.7;color:#bec7bf}
.hero-actions{display:flex;justify-content:center;align-items:center;gap:24px;margin:26px 0}.hero-actions button{font-size:16px;padding:16px 26px}.hero-actions a,.vocabulary-tiers a{color:#d5e6b9;text-underline-offset:4px}
.signing-flow{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:0;margin:30px auto;max-width:800px;text-align:left}
.signing-flow li{counter-increment:step;border-top:1px solid #4b5947;padding:14px 6px;font-size:13px;line-height:1.6;color:#aeb8ae}.signing-flow li::before{content:'0' counter(step);display:block;color:#d5e6b9;font-size:11px;margin-bottom:8px}.signing-flow b{color:#eef3e9;font-size:15px}
.hero .privacy-note{font-size:12px;line-height:1.6;max-width:620px;margin:auto}
.vocabulary-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:28px 0}.vocabulary-tiers article{padding:24px;border:1px solid #414a3c;border-radius:10px;background:#111511}.vocabulary-tiers h3{font-size:22px;margin:18px 0}.vocabulary-tiers p{font-size:14px;line-height:1.65;color:#bdc5bc}.vocabulary-tiers a{font-size:13px}.tier-badge{font-size:11px;color:#d5e6b9}.tier-badge.preview{color:#efd09c}.tier-badge.personal{color:#b5c9ee}
.recognition-feedback{grid-column:1/-1;margin:0;padding:14px 18px;border-top:1px solid #394432;background:#171e15;color:#e0edcc;font-size:14px;line-height:1.5;min-height:50px}
.word-controls{grid-column:1/-1;padding:22px;border:1px solid #384133;border-radius:8px;margin-top:16px}.word-controls .motion-grid{display:block}.word-controls .trainer-card{margin-top:16px}.word-controls p{line-height:1.6}.ai-section>.sentence-tools,.ai-section>.optional-training{grid-column:1/-1;width:100%}.ai-section>.sentence-tools{padding:24px;border:1px solid #414a3c;border-radius:8px}
.site-header nav{display:flex;gap:18px}.site-header nav a{white-space:nowrap}.site-header nav a[href='#workspace']{color:#d5e6b9;font-weight:700}
:focus-visible{outline:2px solid #d5e6b9;outline-offset:5px}
@media(max-width:1050px){.site-header{height:auto;min-height:90px;display:grid;grid-template-columns:1fr auto;gap:18px;padding:18px 20px}.site-header nav{grid-column:1/-1;grid-row:2;flex-wrap:wrap;justify-content:center;gap:14px 20px}.account-actions{grid-column:2;grid-row:1}.vocabulary-tiers{grid-template-columns:1fr}}
@media(max-width:480px){.hero{margin:30px auto;padding:0 18px}.hero h1{font-size:38px}.hero>p{font-size:15px}.hero-actions{gap:16px;flex-direction:column}.signing-flow{grid-template-columns:1fr 1fr;gap:8px 20px}.hero .privacy-note{font-size:11px}.word-controls{padding:16px}.site-header nav a{font-size:12px}.recognition-feedback{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero h1 br{display:block}.hero-actions .primary-button{flex:none;width:auto;min-width:190px}
.daily-words{margin:28px 0;padding:22px;border:1px solid #414a3c;border-radius:10px}.daily-words>p{line-height:1.65;color:#bdc5bc}.daily-words .vocabulary-cards{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.daily-words [data-daily-status]{font-size:13px;line-height:1.6}.daily-words h3{font-size:23px}.daily-words h4{font-size:20px}@media(max-width:480px){.daily-words{padding:16px}.daily-words .vocabulary-cards{grid-template-columns:1fr}}
#signExampleEmbed{width:100%;aspect-ratio:16/9;min-height:220px;border:0;background:#000}#signExampleLesson{display:block;margin:12px 0;font-size:13px;line-height:1.6}
/* Guided views and readable practice instructions. */
[hidden]{display:none!important}
.practice-picker{grid-column:1/-1;padding:18px;background:#171e15;border-bottom:1px solid #44513b;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.practice-picker p{flex-basis:100%;margin:0;line-height:1.65;font-size:15px}.practice-picker select{padding:10px;max-width:100%}
#cameraLesson{grid-column:1/-1;min-width:0;border:1px solid #44513b;border-radius:8px;padding:20px}#cameraLesson #sign-examples{margin:0;padding:0;border:0}#cameraLesson .example-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.camera-tip,.face-controls,.face-controls small,#signExampleHelp,.hero .privacy-note{font-size:14px;line-height:1.65;color:#c4cec0}.mode-picker select{font-size:14px}.site-header nav a{font-size:14px}.site-header nav a.active{color:#e2f2c9;text-decoration:underline;text-underline-offset:7px}.site-header nav a:not(.active){font-weight:400;color:#c4cec0}
.measured-results{grid-column:1/-1;padding:24px;border:1px solid #657257;border-radius:10px}.measured-results p{line-height:1.7}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:12px;border-bottom:1px solid #53604b}caption{text-align:left;margin:15px 0;color:#c4cec0}.model-hash{overflow-wrap:anywhere}.output-card>.sentence-tools{grid-column:1/-1;width:100%;padding:20px;border-top:1px solid #44513b}#interpretResult{display:grid;grid-template-columns:1fr 1fr;gap:12px}#interpretResult h4,#interpretResult p{margin:0}#interpretOriginal{grid-column:1;grid-row:2}#interpretSuggestion{grid-column:2;grid-row:2}#interpretNote{grid-column:1/-1}.sign-visual{font-size:48px}.sign-card a{font-size:14px;color:#d5e6b9}
@media(min-width:1200px){.workspace:has(#cameraLesson:not([hidden])){display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:18px}.workspace:has(#cameraLesson:not([hidden]))>.camera-card{grid-column:1}.workspace #cameraLesson{grid-column:2;grid-row:1}.workspace #cameraLesson .example-layout{display:block}.workspace #cameraLesson .example-words{max-height:130px;overflow:auto}.workspace>.output-card,.workspace>.workflow-strip{grid-column:1/-1}}
@media(max-width:700px){#cameraLesson .example-layout{grid-template-columns:1fr}.practice-picker{align-items:stretch;flex-direction:column}#interpretResult{display:block}#interpretResult h4{margin-top:16px}.measured-results{padding:16px}.site-header nav{gap:16px}.camera-stage .live-result small{font-size:12px}}
.workspace:has(#cameraLesson:not([hidden]))>.camera-card{display:block;min-width:0;align-self:start}.workspace:has(#cameraLesson:not([hidden])) .mode-picker{display:flex;flex-wrap:wrap;padding:12px 18px}.workspace:has(#cameraLesson:not([hidden])) .mode-picker select{max-width:100%}.workspace:has(#cameraLesson:not([hidden])) .camera-stage{width:100%;aspect-ratio:4/3}.workspace:has(#cameraLesson:not([hidden])) .camera-actions{display:flex;flex-wrap:wrap;padding:16px;gap:10px}.workspace:has(#cameraLesson:not([hidden])) .camera-actions button{flex:0 1 auto;min-height:44px;font-size:13px}.workspace:has(#cameraLesson:not([hidden])) .speech-option{padding:10px 16px}.workspace:has(#cameraLesson:not([hidden])) .camera-card>.camera-tip{font-size:14px;white-space:normal}.practice-picker{overflow-wrap:anywhere}.practice-picker p{min-width:0}#cameraLesson{align-self:start}#cameraLesson #signExampleVideo{max-height:320px;width:100%;object-fit:contain}#cameraLesson #sign-examples>p{display:none}#cameraLesson .section-title{margin-bottom:16px}#cameraLesson .example-words{margin:12px 0}#cameraLesson .example-words button{min-height:40px}.camera-card>.card-heading h2{font-size:16px}.status-pill{font-size:12px}

.camera-diagnostics{grid-column:1/-1;padding:16px;border-top:1px solid #44513b;min-width:0}.camera-diagnostics p{font-size:14px;line-height:1.6}.camera-diagnostics pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.5;max-height:340px;overflow:auto;color:#d5e6b9}

/* Calm recognition workspace: primary actions first, secondary controls on demand. */
.workspace{gap:20px;margin-top:28px}
.camera-card{grid-template-columns:minmax(0,1fr) auto}
.camera-card>.card-heading{padding:18px 22px}
.camera-card>.mode-picker{padding:12px 22px}
.camera-card>.camera-actions{padding:16px 22px;gap:12px}
.camera-card>.camera-actions button{font-size:13px;min-height:44px}
.camera-card>.camera-tip{padding:4px 22px 14px;font:13px/1.6 'DM Sans',sans-serif;color:#aeb8ae}
.camera-card>.speech-option,.camera-card>.example-camera-link{padding:8px 22px;font-size:13px}
.camera-card>.capture-detail{display:none}
.camera-stage .capture-telemetry,.camera-stage .capture-transcript,.camera-stage .capture-bottomline,.camera-stage .frame-guide{display:none}
.camera-stage .capture-topline{opacity:.65}
.camera-stage .live-result{padding:14px 24px;gap:7px;max-width:70%;border-radius:10px;background:rgba(16,21,15,.94);border-color:#536348}
.camera-stage .live-result>span{font-size:9px;letter-spacing:.08em}
.camera-stage .live-result strong{font-size:30px}
.camera-stage .live-result small{font:12px/1.5 'DM Sans',sans-serif;color:#b7c2ad}
.camera-stage #liveWordAccuracy{color:#deedc8}
.workspace-disclosure{grid-column:1/-1;min-width:0;margin:0;border-top:1px solid #344030}
.workspace-disclosure>summary{padding:16px 20px;cursor:pointer;font-size:14px;font-weight:500;color:#d4decb;line-height:1.5}
.workspace-disclosure>summary span{font-size:12px;color:#afbb9e;margin-left:10px;font-weight:400}
.workspace-disclosure[open]>summary{border-bottom:1px solid #344030}
.workspace-disclosure>p{margin:12px 20px}
.practice-disclosure{order:-1;background:#151b12;border:0;border-bottom:1px solid #344030}
.practice-disclosure .practice-picker{background:transparent;border:0;padding:18px 20px}
.camera-settings .face-controls{border:0;padding:18px 20px;font-size:13px;gap:18px}
.camera-settings .camera-diagnostics{border:0;padding:4px 20px 16px}
.camera-settings #cameraHelp{padding:0 20px 18px;text-align:left}
.workspace>.workflow-strip{display:none}
.word-controls{margin:0;padding:0;background:#111710;overflow:hidden}
.word-review-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px}
.word-review-bar h3{font-size:16px;margin:0 0 5px}.word-review-bar p{font-size:13px;color:#aeb8ae;margin:0}
.word-settings>*:not(summary){margin:16px 20px}.word-settings .trainer-card{padding:18px}
.word-settings #standardWordOptions{padding:0 0 12px}
.output-card{display:flex;flex-direction:column;padding:24px;gap:20px}
.output-card>.card-heading h2{font-size:20px}
.output-card .message-box{min-height:90px;padding:18px;background:#171e14;border:1px solid #344030;border-radius:8px}
.output-card>.sentence-tools{padding:20px 0 0;border-top:1px solid #344030}
.output-card>.sentence-tools h3{margin:0 0 12px;font-size:17px}
.output-card .camera-tip{text-align:left;font-size:13px;line-height:1.6;max-width:780px}
.output-card .speech-option{font-size:14px;line-height:1.6}
.output-card .sentence-word-buttons{padding:12px 18px;gap:8px}
.output-card .workspace-disclosure{margin-top:16px;border:1px solid #344030;border-radius:8px}
.output-actions{gap:10px}
.output-actions button{min-height:44px;font-size:14px}
#interpretButton{margin-top:14px;min-height:44px}
@media(max-width:700px){
 .workspace{gap:16px;padding:0 14px;margin-top:18px}
 .camera-card{display:block}.camera-card>.mode-picker{display:flex;align-items:center;justify-content:space-between;font-size:12px;gap:12px;padding:12px 18px}
 .camera-card>.mode-picker select{font-size:12px;max-width:70%}
 .camera-card>.card-heading,.camera-card>.camera-actions{padding:14px 18px}
 .camera-stage .live-result{max-width:88%;padding:10px 16px;bottom:18px}
 .camera-stage .live-result>span{font-size:8px}.camera-stage .live-result strong{font-size:26px}.camera-stage .live-result small{font-size:11px}
 .workspace-disclosure>summary{padding:14px 18px}
 .word-review-bar{padding:18px;flex-wrap:wrap;gap:12px}
 .output-card{padding:18px;gap:16px}.output-actions button{font-size:13px}
}
/* The docked lesson uses the practice selector instead of repeating its word grid. */
#cameraLesson .example-words{display:none}
#cameraLesson #signExampleVideo{max-height:280px}

/* Compact sentence assistant with consistent inner spacing. */
.output-card>.interpretation-panel{padding:24px;margin:0;border:1px solid #344030;background:#141a12;border-radius:12px}
.interpret-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.output-card .interpret-heading h3{margin:0;font-size:18px}
.interpret-badge{font-size:11px;color:#c4d8ab;padding:5px 9px;border:1px solid #465538;border-radius:20px;white-space:nowrap}
.interpretation-panel>.camera-tip{margin:12px 0}
.interpretation-panel>.speech-option{margin:18px 0 10px;align-items:center}
.interpretation-panel #interpretStatus{padding:12px 14px;background:#1b2417;border-radius:8px;color:#c6d6b5;max-width:none}
.interpretation-panel #interpretResult{margin-top:18px}
.interpretation-panel>.workspace-disclosure{margin-top:18px;background:transparent}
@media(max-width:700px){.output-card>.interpretation-panel{padding:18px}.output-card .interpret-heading h3{font-size:17px}}
.sentence-progress{margin:0;font-size:14px;color:#dcefc5;padding:12px 14px;background:#1b2516;border-radius:8px;line-height:1.6}
.sentence-chips{display:flex;gap:8px;flex-wrap:wrap;min-width:0}.sentence-chips>span{color:#a8b59b;font-size:13px}.word-chip{padding:9px 14px;background:#26331e;border:1px solid #60744d;border-radius:24px;color:#e4efdc;font-size:14px;overflow-wrap:anywhere;max-width:100%}.word-chip:hover{background:#354729}
.feature-dialog{background:#141c11;color:#e5efdd;border:1px solid #647954;border-radius:16px;padding:28px;max-width:520px;width:calc(100% - 40px);max-height:85vh;overflow:auto}.feature-dialog::backdrop{background:#000b}.feature-dialog h2{font-size:24px;margin:16px 0}.feature-dialog p{line-height:1.8}.feature-dialog input{width:100%;margin:10px 0;padding:12px}.feature-dialog button{margin:8px 6px 0 0}.dialog-actions{display:flex;gap:8px;flex-wrap:wrap}
.accessibility-controls label{display:inline-flex;align-items:center;gap:12px;padding:14px}.accessibility-controls p{font-size:13px;line-height:1.7}.accessibility-controls select{padding:8px;background:#1e2719;color:#e5efdd;border:1px solid #526044}
.match-feedback{padding:12px 20px;border-top:1px solid #344030;font-size:13px;line-height:1.6}.match-feedback form{margin-top:14px}.match-feedback input:not([type=checkbox]){max-width:100%;padding:10px}.match-feedback .speech-option{margin:14px 0}.match-feedback p:empty{display:none}
.recorded-checks{grid-column:1/-1;border:1px solid #45543b;border-radius:10px;padding:22px;min-width:0}.recorded-checks p{font-size:14px;line-height:1.7;color:#bdc9b5}
body.large-text{font-size:18px}.large-text .camera-tip,.large-text .speech-option,.large-text .workspace-disclosure>summary,.large-text .sentence-progress,.large-text .word-chip,.large-text .output-actions button,.large-text .site-header nav a{font-size:17px!important}.large-text .message-box p{font-size:28px}.large-text .camera-stage .live-result small{font-size:15px}
.admin-panel label{display:block;margin:14px 0}.admin-panel textarea,.admin-panel select,.admin-panel input:not([type=checkbox]){max-width:100%;padding:10px}.admin-panel textarea{width:100%;min-height:100px}.admin-feedback-actions{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:700px){.feature-dialog{padding:20px}.account-actions{gap:4px}.account-actions #openTutorial{font-size:12px}.recorded-checks{padding:16px}.large-text .site-header nav{gap:10px}}
