:root{color-scheme:light;--bg:#f8fafc;--text:#172b49;--muted:#475569;--line:#d7e2ef;--accent:#1d4ed8}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 0,#e9f2ff,transparent 45%),var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,sans-serif}header,main{max-width:1168px;margin:auto;padding:16px}header{display:flex;align-items:center;gap:24px;flex-wrap:wrap;border-bottom:1px solid var(--line)}nav{display:flex;gap:16px;flex-wrap:wrap}.brand{font-weight:900;text-decoration:none;color:var(--text)}.brand span{color:#1d4ed8}a{color:#1d4ed8}header .cfy-global-controls{margin-left:auto}main{padding-top:32px}.panel{padding:24px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 8px 28px #172b4909;margin-bottom:24px}.welcome{max-width:720px;margin:32px auto;padding:clamp(24px,6vw,64px);text-align:center}.welcome .lede{font-size:1.125rem;max-width:38ch;margin:0 auto 32px}.welcome h1{font-size:clamp(2.2rem,6vw,3.5rem);line-height:1.12;letter-spacing:-.04em}h1,h2,h3,p{margin:0 0 16px}h2{font-size:clamp(1.5rem,3vw,2rem);line-height:1.2}h3{font-size:1.15rem}h1,h2,h3,p,legend{overflow-wrap:anywhere}.eyebrow,.exercise-type{font-size:.75rem;font-weight:800;letter-spacing:.08em;color:#1e40af}.muted,.audio-state,.pronunciation-guide,.shortcut-help,footer{color:var(--muted);font-size:.9rem}.badge{display:inline-flex;padding:4px 10px;background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;border-radius:999px;font-size:.75rem}.section-heading{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}button,select,input,textarea{font:inherit}button{min-height:48px;padding:12px 16px;border:1px solid #94a3b8;border-radius:12px;background:#fff;color:#1e40af;font-weight:700;cursor:pointer}button:hover:not(:disabled){background:#eff6ff;border-color:#2563eb}button:disabled{color:#64748b;background:#f1f5f9;border-color:#cbd5e1;cursor:not-allowed}.primary{color:white;background:var(--accent);border-color:var(--accent)}.primary:hover:not(:disabled){background:#1e3a8a;color:white}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #1d4ed8;outline-offset:3px}input[type=text],textarea,select{width:100%;min-height:48px;padding:12px;border:1px solid #94a3b8;border-radius:12px;color:var(--text);background:#fff}label{display:block;margin:8px 0;font-weight:650}textarea{overflow-wrap:anywhere}input[type=radio],input[type=checkbox]{accent-color:#1d4ed8;width:20px;height:20px;flex-shrink:0}.language-grid,.goal-grid,.phrase-grid,.path-grid{display:grid;grid-template-columns:1fr;gap:16px;margin:24px 0}.language-card{display:flex;flex-direction:column;text-align:left;gap:8px;color:var(--text);padding:16px;border-color:#d7e2ef}.native-greeting{font-size:1.3rem;font-weight:750}.language-card span:last-child{font-size:.85rem;color:#475569}.tone-0{background:#eff6ff}.tone-1{background:#f0fdf4}.tone-2{background:#fff7ed}.tone-3{background:#f0fdfa}.tone-4{background:#fff1f2}.language-card[aria-pressed=true],[data-goal][aria-pressed=true]{outline:2px solid #1d4ed8;outline-offset:1px;box-shadow:0 0 0 5px #2563eb16}[data-goal]{display:flex;flex-direction:column;gap:8px;text-align:left;color:var(--text)}[data-goal] small{font-weight:400;color:var(--muted)}.availability{min-height:48px;margin:16px 0}#build-path{width:100%}.lesson-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:24px 0}.lesson-nav button{padding:12px 6px;min-width:0;font-size:.8rem;display:flex;flex-direction:column;gap:4px;color:#475569;background:#f8fafc}.lesson-nav button[aria-current=step]{border-color:var(--accent);background:#eff6ff;color:var(--accent);box-shadow:inset 0 -3px var(--accent)}.lesson-nav button[data-complete=true]{border-color:#94a3b8;background:#f1f5f9}.lesson-nav button[data-phase=dialogue][aria-current=step]{color:#166534;background:#f0fdf4;border-color:#166534;box-shadow:inset 0 -3px #166534}.lesson-nav button[data-phase=practice][aria-current=step]{color:#92400e;background:#fffbeb;border-color:#92400e;box-shadow:inset 0 -3px #92400e}#lesson[data-lesson-phase=dialogue]{--accent:#166534}#lesson[data-lesson-phase=practice]{--accent:#92400e}#results{--accent:#0f766e}.phase-intro{color:#475569}.phrase,.path-card,.review-card{padding:16px;border:1px solid var(--line);border-radius:16px;background:#f8fafc}.target{font-size:1.4rem;font-weight:750;line-height:1.5;margin:16px 0 8px}.pronunciation-guide{margin:8px 0 16px;overflow-wrap:anywhere}.phrase details{margin-top:16px}summary{cursor:pointer;min-height:44px;font-weight:750;color:#1e40af}.playback-settings{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:16px;background:#f1f5f9;border-radius:12px}.playback-settings select{width:auto}.playback-settings p{margin:0}.audio-slot{margin:12px 0}.audio-state{margin:8px 0 0}.culture,.grammar-card{padding:16px;border:1px solid #bfdbfe;background:#eff6ff;border-radius:16px;margin:24px 0}.grammar-card p:last-child{margin-bottom:0}.dialogue-line{border-left:3px solid #166534;padding:16px;margin:16px 0;background:#f0fdf4;border-radius:0 12px 12px 0}.dialogue-line small{color:#166534;font-weight:750}.dialogue-line p{margin:4px 0}.stage-direction{font-style:italic;color:#475569;margin:24px 0}.phase-next{margin-top:24px}.answer{display:flex;align-items:flex-start;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:400}.choice-copy{display:flex;flex-direction:column;gap:8px;min-width:0}.choice-copy small{color:#475569}.answer:has(input:checked){border-color:#92400e;background:#fffbeb}fieldset{min-width:0;border:1px solid var(--line);border-radius:16px;padding:16px;margin:24px 0}legend{font-weight:750;max-width:100%;padding:0 8px}.exercise-type{display:block;margin:8px 0 16px;color:#92400e}.feedback{margin:16px 0 0;color:#334155}.correct{border-color:#15803d;background:#f0fdf4}.correct .feedback{color:#166534}.incorrect{border-color:#b91c1c;background:#fff7f7}.correct-answer{border-color:#15803d;background:#dcfce7}.tokens,.actions{display:flex;gap:8px;flex-wrap:wrap}.token-answer{min-height:48px;padding:12px;border:1px dashed #94a3b8;background:#fff}.read-fallback{padding:12px;background:#fff;border:1px solid var(--line);border-radius:12px}.read-fallback small{display:block}.result-progress{display:flex;gap:8px;list-style:none;padding:0;flex-wrap:wrap}.result-progress li{flex:1 1 100px;text-align:center;padding:10px;border:1px solid #99f6e4;color:#115e59;background:#f0fdfa;border-radius:12px}.review-due{color:#115e59;background:#f0fdfa}.review-card{margin:16px 0}.review-card button{margin:8px 8px 8px 0}.save-row{margin:24px 0}.account-sync{margin:24px 0}footer{margin-top:24px}.skip{position:absolute;top:-100px;left:16px;padding:12px;background:white;z-index:20}.skip:focus{top:10px}[hidden]{display:none!important}.first-visit .shortcut-help,.first-visit footer{display:none}@media(min-width:600px){main,header{padding:24px}.language-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.goal-grid,.phrase-grid,.path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.panel{padding:24px}.lesson-nav button{flex-direction:row;font-size:.9rem}#build-path{width:auto}}@media(min-width:950px){.language-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.goal-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.panel{padding:32px}}@media(prefers-reduced-motion:no-preference){button,.phrase{transition:background .18s,box-shadow .18s,transform .18s}.phrase:hover{transform:translateY(-2px);box-shadow:0 8px 24px #172b4910}.is-speaking button{animation:pulse 1.2s ease-in-out infinite}.correct{animation:flash .5s}.incorrect{animation:shake .25s}#results-title{animation:celebrate .4s}@keyframes pulse{50%{box-shadow:0 0 0 5px #2563eb22}}@keyframes flash{50%{background:#dcfce7}}@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes celebrate{from{transform:scale(.97);opacity:.6}to{transform:scale(1);opacity:1}}}@media print{header,#welcome,#workspace,#path,#progress,button,.lesson-nav{display:none!important}.panel{box-shadow:none}body{background:#fff}}


.language-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.language-card{min-width:0}.language-card strong{overflow-wrap:anywhere}.result-progress button{width:100%;border:0;background:transparent;color:#115e59;padding:0;min-height:44px}@media(min-width:950px){.language-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
