:root{color:#18202b;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:0;background:#f5f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html{background:#f5f7fb;min-width:320px}body{min-width:320px;min-height:100svh;margin:0}button,input,select,textarea,audio{font:inherit}button,a{-webkit-tap-highlight-color:transparent}#root{min-height:100svh}.app-shell{--accent:#2563eb;--accent-soft:#dbeafe;--accent-strong:#1746a2;--surface:#fff;--surface-muted:#eef3f8;--line:#d7dfeb;--ink:#18202b;--muted:#64748b;--danger:#c2410c;min-height:100svh;color:var(--ink);background:linear-gradient(90deg,#2563eb14,#16a34a12,#d9770612),#f5f7fb;grid-template-rows:auto 1fr auto;display:grid}.theme-red{--accent:#dc2626;--accent-soft:#fee2e2;--accent-strong:#991b1b}.theme-green{--accent:#15803d;--accent-soft:#dcfce7;--accent-strong:#14532d}.theme-gold{--accent:#d97706;--accent-soft:#fef3c7;--accent-strong:#92400e}.topbar,.statusbar{border-color:var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffe6;border-style:solid}.topbar{border-width:0 0 1px;justify-content:space-between;align-items:center;gap:18px;min-height:64px;padding:10px 22px;display:flex}.brand-lockup{align-items:center;gap:12px;min-width:0;display:flex}.brand-mark{color:#fff;background:#111827;border-radius:8px;place-items:center;width:54px;height:42px;font-size:15px;font-weight:800;display:inline-grid}.brand-title{color:var(--ink);white-space:nowrap;font-size:16px;font-weight:700}.recording-dock{justify-content:flex-end;align-items:center;gap:10px;display:flex}.recording-status{border:1px solid var(--line);background:var(--surface);height:40px;color:var(--ink);font-variant-numeric:tabular-nums;border-radius:8px;align-items:center;gap:8px;padding:0 12px;font-weight:800;display:inline-flex}.pulse-dot{background:#94a3b8;border-radius:999px;width:9px;height:9px}.recording-status.recording .pulse-dot,.status-pill.recording{color:#fff;background:#ef4444}.recording-status.recording .pulse-dot{animation:1s ease-in-out infinite recordingPulse}.audio-player{width:280px;height:38px}.workspace{grid-template-columns:54px minmax(0,1fr) 54px;gap:16px;min-height:0;padding:14px 22px;display:grid}.slide-nav,.control-rail{flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex}.slide-dot,.icon-button{border:1px solid var(--line);color:var(--ink);cursor:pointer;background:#ffffffdb;border-radius:8px;place-items:center;transition:transform .16s,border-color .16s,background .16s,color .16s,box-shadow .16s;display:inline-grid}.slide-dot{font-variant-numeric:tabular-nums;width:40px;height:40px;font-size:14px;font-weight:800}.icon-button{width:44px;height:44px}.icon-button:hover,.slide-dot:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 10px 24px #0f172a17}.icon-button:focus-visible,.slide-dot:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 28%, transparent);outline-offset:3px}.slide-dot.active,.icon-button.primary,.play-button{border-color:var(--accent);background:var(--accent);color:#fff}.icon-button.primary.is-recording{background:#ef4444;border-color:#ef4444}.deck-stage{align-items:center;min-width:0;min-height:0;display:grid}.slide-frame{border:1px solid var(--line);background:#fffffff5;border-radius:8px;flex-direction:column;width:100%;max-width:1180px;height:min(760px,100svh - 138px);min-height:520px;margin:0 auto;animation:.26s both slideEnter;display:flex;overflow:auto;box-shadow:0 24px 70px #0f172a21}.slide-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:18px;padding:16px 34px 10px;display:flex}.slide-header h1{color:var(--ink);letter-spacing:0;margin:0;font-size:34px;font-weight:850;line-height:1.04}.progress-ring{border:1px solid var(--line);background:linear-gradient(var(--surface), var(--surface)) padding-box, conic-gradient(var(--accent), var(--accent-soft)) border-box;width:64px;height:64px;color:var(--ink);font-variant-numeric:tabular-nums;border-radius:50%;flex:none;place-items:center;display:grid}.progress-ring span,.progress-ring small{grid-area:1/1}.progress-ring span{margin-top:-12px;font-size:21px;font-weight:900}.progress-ring small{color:var(--muted);margin-top:26px;font-size:13px;font-weight:800}.slide-content{gap:20px;padding:16px 34px 18px;display:grid}.slide-content.two-column{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.study-section{border:1px solid var(--line);background:linear-gradient(180deg, var(--accent-soft), #fff0 112px), #fff;border-radius:8px;min-width:0;overflow:hidden}.section-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:10px 16px;display:flex}.section-heading span{color:var(--accent-strong);white-space:nowrap;font-size:21px;font-weight:900}.section-heading strong{color:var(--ink);text-align:right;font-size:17px;font-weight:850}.phonics-grid{gap:8px;padding:10px;display:grid}.phonics-row{gap:8px;display:grid}.sound-cell{color:#0000;letter-spacing:0;opacity:0;background:0 0;border:1px solid #0000;border-radius:8px;place-items:center;min-width:0;height:38px;font-size:22px;font-weight:850;transition:opacity .22s,transform .22s,color .22s,background .22s,border-color .22s;display:grid;transform:translateY(10px)scale(.98)}.sound-cell.visible{border-color:color-mix(in srgb, var(--accent) 20%, var(--line));color:var(--ink);opacity:1;background:#fff;transform:translateY(0)scale(1)}.sound-cell.active,.vocab-card.active{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent);animation:.26s both popFocus}.sound-cell:empty{box-shadow:none;background:0 0;border-color:#0000}.vocab-grid{grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;padding:10px;display:grid}.wide-vocab .vocab-grid{grid-template-columns:repeat(auto-fit,minmax(132px,1fr))}.vocab-card{color:#0000;opacity:0;background:0 0;border:1px solid #0000;border-radius:8px;align-content:center;gap:5px;min-width:0;min-height:58px;padding:8px;transition:opacity .22s,transform .22s,color .22s,background .22s,border-color .22s;display:grid;transform:translateY(10px)scale(.98)}.vocab-card.visible{border-color:color-mix(in srgb, var(--accent) 20%, var(--line));color:var(--ink);opacity:1;background:#fff;transform:translateY(0)scale(1)}.vocab-count{background:var(--surface-muted);width:max-content;color:var(--muted);font-variant-numeric:tabular-nums;border-radius:999px;padding:1px 7px;font-size:10px;font-weight:900}.vocab-card strong{overflow-wrap:anywhere;min-width:0;color:inherit;font-size:20px;font-weight:900;line-height:1.08}.vocab-card span:last-child{overflow-wrap:anywhere;min-width:0;color:var(--muted);font-size:12px;font-weight:750}.statusbar{border-width:1px 0 0;grid-template-columns:minmax(0,1fr) minmax(220px,34%);align-items:center;gap:18px;min-height:46px;padding:8px 22px;display:grid}.status-copy{min-width:0;color:var(--muted);align-items:center;gap:10px;font-size:13px;font-weight:700;display:flex}.status-pill{background:var(--accent-soft);height:30px;color:var(--accent-strong);text-transform:uppercase;border-radius:999px;align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:900;display:inline-flex}.progress-track{background:#e2e8f0;border-radius:999px;height:8px;overflow:hidden}.progress-track span{border-radius:inherit;background:var(--accent);height:100%;transition:width .22s;display:block}@keyframes slideEnter{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}@keyframes popFocus{0%{transform:translateY(0)scale(.96)}to{transform:translateY(0)scale(1)}}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(1.7)}}@media (width<=980px){.topbar{flex-direction:column;align-items:flex-start}.recording-dock{flex-wrap:wrap;justify-content:flex-start;width:100%}.audio-player{flex:220px;width:100%}.workspace{grid-template-columns:1fr}.slide-nav,.control-rail{flex-direction:row}.slide-nav{order:-1}.control-rail{order:2}.slide-frame{min-height:auto;max-height:none}.slide-content.two-column{grid-template-columns:1fr}}@media (width<=640px){.topbar,.workspace,.statusbar{padding-inline:14px}.brand-title{white-space:normal}.slide-header{padding:22px 18px 16px}.slide-header h1{font-size:32px}.slide-subtitle{font-size:16px}.progress-ring{width:62px;height:62px}.progress-ring span{font-size:20px}.slide-content{padding:18px}.section-heading{flex-direction:column;align-items:flex-start}.section-heading strong{text-align:left}.phonics-grid,.vocab-grid{gap:9px;padding:14px}.phonics-row{gap:9px}.sound-cell{height:50px;font-size:23px}.vocab-grid{grid-template-columns:repeat(auto-fit,minmax(118px,1fr))}.statusbar{grid-template-columns:1fr}}