:root{--bg: #f5f5f4;--bg-soft: #efefee;--surface: #ffffff;--surface-muted: #fafaf9;--text: #1f1f1f;--text-muted: #66635f;--line: #dfddda;--line-strong: #cbc7c2;--shadow-sm: 0 10px 24px rgba(20, 20, 20, .05);--shadow-md: 0 18px 40px rgba(20, 20, 20, .09);--focus: rgba(41, 37, 36, .14);--danger: #b42318;--danger-soft: #fff1f1;font-family:Manrope,Segoe UI,Inter,sans-serif;color:var(--text)}:root[data-theme=dark]{--bg: #16181d;--bg-soft: #1b1e24;--surface: #20242b;--surface-muted: #262b33;--text: #f4f4f4;--text-muted: #b5b2ad;--line: #343a45;--line-strong: #444b58;--shadow-sm: 0 10px 28px rgba(0, 0, 0, .35);--shadow-md: 0 18px 42px rgba(0, 0, 0, .45);--focus: rgba(255, 255, 255, .14);--danger: #ff7a7a;--danger-soft: #341818}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 4% 0%,var(--bg-soft) 0,var(--bg-soft) 20%,transparent 21%),radial-gradient(circle at 98% 100%,var(--bg-soft) 0,var(--bg-soft) 18%,transparent 19%),linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 100%);color:var(--text)}.app-shell{max-width:1160px;margin:0 auto;padding:24px 14px 36px}.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px}.topbar h1{margin:0;font-size:clamp(2rem,4vw,2.45rem);line-height:1.03;letter-spacing:-.02em}.topbar-subtitle{margin:8px 0 0;color:var(--text-muted);font-size:.97rem;max-width:660px}.topbar-meta{display:grid;gap:8px;justify-items:end}.topbar-actions{display:flex;gap:8px;align-items:center}.stats{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;font-weight:700}.stats span{border-radius:999px;padding:7px 12px;border:1px solid var(--line);background:var(--surface)}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:20px 12px}.auth-card{width:min(460px,100%)}.auth-card h1{margin:0;font-size:clamp(2rem,6vw,2.8rem)}.auth-card h2{margin:14px 0 10px;font-size:1.2rem}.auth-form{display:grid;gap:10px}.google-auth{margin-top:14px}.google-placeholder{width:min(320px,100%)}.auth-divider{position:relative;margin:12px 0;text-align:center}.auth-divider:before{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--line)}.auth-divider span{position:relative;background:var(--surface);padding:0 10px;color:var(--text-muted);font-size:.86rem}.auth-mode-text{margin:14px 0 0;color:var(--text-muted)}.auth-resend-row{margin-top:10px}.mode-link{border:0;background:transparent;color:var(--text);font-weight:700;text-decoration:underline;cursor:pointer;padding:0}.theme-switcher{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--text-muted)}.theme-switcher select{min-width:96px;border-radius:8px;padding:7px 10px}.panel{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:16px;margin-bottom:14px;box-shadow:var(--shadow-sm)}.nav-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border-color:var(--line-strong);background:var(--surface-muted)}.nav-tile{border:1px solid var(--line);border-radius:11px;background:var(--surface);padding:11px;display:flex;align-items:center;gap:10px;justify-content:center;font-size:.98rem;font-weight:700;color:var(--text);cursor:pointer;transition:all .2s ease}.nav-tile img{width:30px;height:30px}.nav-tile:hover{transform:translateY(-1px);border-color:var(--line-strong)}.nav-tile.active{border-color:#292524;box-shadow:inset 0 0 0 1px #29252426}:root[data-theme=dark] .nav-tile.active{border-color:#f3f3f2;box-shadow:inset 0 0 0 1px #fff3}:root[data-theme=dark] .token,:root[data-theme=dark] .option{background:#21262e;border-color:#47505f}:root[data-theme=dark] .token:hover,:root[data-theme=dark] .option:hover{border-color:#7f8da3}:root[data-theme=dark] .token.selected,:root[data-theme=dark] .option.selected{background:#2f4057;border-color:#8ab4f8;color:#f4f8ff;box-shadow:inset 0 0 0 1px #8ab4f83d}:root[data-theme=dark] .primary-button{background:linear-gradient(180deg,#f4f4f3,#dad9d6);color:#1f1f1f;box-shadow:0 8px 18px #00000059}:root[data-theme=dark] .primary-button:hover:not(:disabled){background:linear-gradient(180deg,#fff,#ecebe9);color:#111;box-shadow:0 11px 22px #0000006b}.daily-panel,.hero-card,.quick-strip{background:var(--surface-muted)}.daily-headline{display:flex;justify-content:space-between;align-items:center;gap:12px}.daily-headline h2{margin:0;font-size:1.12rem}.daily-goal-bar{margin-top:12px;background:#dfddd9;border-radius:999px;overflow:hidden;height:10px}.daily-goal-bar>div{height:100%;background:linear-gradient(90deg,#000,#555)}.status{padding:12px 14px;border-radius:11px;border:1px solid var(--line);background:var(--surface-muted);margin-bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.hero-card{display:grid;grid-template-columns:1.25fr 1fr;gap:16px;align-items:center}.eyebrow{margin:0 0 8px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.hero-copy h2{margin:0;line-height:1.2}.hero-copy p{margin:10px 0;color:var(--text-muted)}.hero-art{width:100%;max-height:260px;object-fit:contain;display:block}.hero-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}.categories .subtitle,.settings-panel .subtitle,.stats-panel .subtitle{margin-top:2px;color:var(--text-muted)}.category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}.category-card{display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line);border-radius:12px;padding:13px;gap:12px;background:var(--surface)}.category-card h3{margin:0 0 8px}.category-card p{margin:3px 0;color:var(--text-muted)}.category-card.locked{border-style:dashed;background:var(--surface-muted)}.lock-note{color:var(--text-muted);font-size:.9rem}.quick-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quick-strip>div{border:1px solid var(--line);border-radius:11px;padding:11px;display:grid;gap:4px;background:var(--surface)}.quick-strip span{color:var(--text-muted)}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}label{display:grid;gap:6px;font-size:.93rem;font-weight:700;color:var(--text)}.wide-label{grid-column:1 / -1}select,input,textarea,button{font:inherit}select,input,textarea{border:1px solid var(--line-strong);border-radius:10px;padding:10px 11px;color:var(--text);background:var(--surface);transition:border-color .2s ease,box-shadow .2s ease}select:focus,input:focus,textarea:focus{outline:none;border-color:#292524;box-shadow:0 0 0 4px var(--focus)}textarea{min-height:110px;resize:vertical}.setup-preview{margin-top:12px;border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--surface-muted)}.setup-preview h3{margin:0 0 8px}.setup-preview p{margin:3px 0;color:var(--text-muted)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:12px}.stat-card{border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--surface)}.stat-card h3{margin:0 0 6px;font-size:.95rem;color:var(--text-muted)}.stat-card strong{font-size:1.72rem;letter-spacing:-.02em;color:var(--text)}.stat-card p{margin:7px 0 0;color:var(--text-muted)}.category-table-wrap{overflow-x:auto}.category-table{width:100%;min-width:520px;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}.category-table th,.category-table td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left}.category-table tr:last-child td{border-bottom:0}.category-table th{color:var(--text-muted);background:var(--surface-muted)}.primary-button,.ghost-button,.speak-button,.option,.token{transition:border-color .2s ease,background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease}.primary-button,.ghost-button{border-radius:10px;padding:10px 16px;font-weight:700;cursor:pointer;border:1px solid transparent}.primary-button{background:linear-gradient(180deg,#57534e,#44403c);color:#fff;box-shadow:0 8px 18px #29252438}.primary-button:hover:not(:disabled){background:linear-gradient(180deg,#3b3734,#292524);transform:translateY(-1px);box-shadow:0 11px 22px #29252447}.primary-button:disabled{opacity:.52;cursor:not-allowed;box-shadow:none}.ghost-button{border-color:var(--line-strong);background:var(--surface);color:var(--text)}.ghost-button:hover{border-color:#646464;background:#262e39;color:#fff}.lesson-player{box-shadow:var(--shadow-md)}.lesson-player .lesson-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.challenge-badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px;font-weight:700}.challenge-badges span{background:var(--surface-muted);border:1px solid var(--line);border-radius:999px;padding:5px 10px;color:var(--text)}.meter{flex:1;background:#dfddd9;border-radius:999px;overflow:hidden;height:10px}.meter>div{height:100%;background:linear-gradient(90deg,#000,#555)}.options{display:grid;gap:8px;margin:12px 0}.option-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:stretch}.option{border:1px solid var(--line-strong);border-radius:10px;padding:12px;text-align:left;background:var(--surface);color:var(--text);cursor:pointer}.option:hover{border-color:#292524}.option.selected{border-color:#292524;background:var(--surface-muted)}.speak-button{border:1px solid var(--line-strong);background:var(--surface);border-radius:10px;padding:0 12px;cursor:pointer;font-weight:700;color:var(--text)}.speak-button:hover{border-color:#292524;background:var(--surface-muted)}.speech-error{margin:6px 0 0;color:var(--danger);font-size:.9rem}.build-hints{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 6px}.build-target{min-height:56px;border:1px dashed var(--line-strong);border-radius:10px;padding:10px;margin:10px 0;background:var(--surface-muted);font-weight:600}.built-words{display:flex;flex-wrap:wrap;gap:8px}.built-word-chip{display:inline-flex;align-items:center;border:1px solid var(--line-strong);border-radius:999px;background:var(--surface);padding:8px 12px;cursor:grab;-webkit-user-select:none;user-select:none}.built-word-chip:hover{border-color:#292524;background:var(--surface-muted)}.built-word-chip:active{transform:scale(.99);cursor:grabbing}.built-word-chip[draggable=true]{touch-action:none}.tokens{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}.token{border:1px solid var(--line-strong);background:var(--surface);color:var(--text);border-radius:999px;padding:8px 11px;cursor:pointer}.token:hover{border-color:#292524}.token.selected{border-color:#292524;background:var(--surface-muted)}.feedback{display:grid;gap:4px;margin:8px 0 12px;padding:10px 12px;border-radius:10px;border:1px solid #efc4c4;background:var(--danger-soft);color:var(--danger)}.feedback span{font-size:.92rem}.expected-option{margin-top:6px;font-size:.92rem}.option.correct-answer{margin-top:6px;border-color:#8fc58f;background:#f0f9f0;color:#225526}.expected-words{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px}.expected-word{border-radius:999px;padding:5px 9px;border:1px solid var(--line-strong);background:var(--surface-muted);font-size:.88rem}.expected-word.matched{border-color:#9bcf9d;background:#f0f9f0;color:#225526}.expected-word.missing{border-color:#f1c2c2;background:#fff4f4;color:#8f2d2d}:root[data-theme=dark] .expected-word{border-color:#5a667b;background:#2a313c;color:#e6ebf3}:root[data-theme=dark] .expected-word.matched{border-color:#6ecf96;background:#173a2a;color:#d7f8e4}:root[data-theme=dark] .expected-word.missing{border-color:#e08f8f;background:#472426;color:#ffd8d8}@media(max-width:860px){.hero-card{grid-template-columns:1fr}.hero-art{max-height:220px}}@media(max-width:720px){.app-shell{padding:18px 12px 28px}.topbar{flex-direction:column}.topbar-meta{justify-items:start;width:100%}.stats{justify-content:flex-start}.nav-strip,.quick-strip,.option-row{grid-template-columns:1fr}}