:root{--font-body:"Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;--font-display:"Avenir Next", "Arial Narrow", system-ui, sans-serif;--paper:#f4f1e8;--ink:#18201d;--muted:#6e746f;--line:#18201d24;--coral:#ed765d;--acid:#d8ef67;--cream:#fffdf7;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}*{box-sizing:border-box}html{background:#d8d5cc}body{color:var(--ink);font-family:var(--font-body), sans-serif;background:var(--paper);margin:0}button,input,textarea,select{font:inherit}button{color:inherit}.app-shell{width:min(100%,760px);min-height:100dvh;padding:calc(22px + var(--safe-top)) calc(18px + var(--safe-right)) calc(112px + var(--safe-bottom)) calc(18px + var(--safe-left));margin:0 auto;overflow:hidden}.topbar{grid-template-columns:48px 1fr 44px;align-items:center;gap:12px;margin-bottom:22px;display:grid}.brand-mark{border:1px solid var(--ink);width:48px;height:48px;font:700 13px var(--font-display);letter-spacing:.06em;border-radius:50%;place-items:center;display:grid}.topbar h1{letter-spacing:-.04em;margin:3px 0 0;font-size:18px}.eyebrow{font:700 10px var(--font-display);letter-spacing:.14em;text-transform:uppercase;margin:0}.avatar{background:var(--acid);border:0;border-radius:50%;width:44px;height:44px;font-weight:800}.hero-card{background:var(--ink);min-height:236px;color:var(--cream);border-radius:28px;padding:26px 24px;position:relative;overflow:hidden}.hero-card:after{content:"";border:36px solid var(--coral);opacity:.9;border-radius:50%;width:180px;height:180px;position:absolute;bottom:-100px;right:-76px}.hero-copy h2{font:600 clamp(32px, 9vw, 54px)/.98 var(--font-display);letter-spacing:-.055em;margin:20px 0 14px}.hero-copy h2 em{color:var(--acid);font-style:normal}.hero-copy>p{color:#afb8b3;font-size:13px}.pill{border:1px solid #ffffff4d;border-radius:999px;padding:7px 12px;font-size:11px;font-weight:700;display:inline-flex}.progress-orbit{background:conic-gradient(var(--acid) var(--progress,0%), #39423f 0);width:64px;height:64px;box-shadow:inset 0 0 0 7px var(--ink);text-align:center;z-index:1;border-radius:50%;place-content:center;display:grid;position:absolute;top:25px;right:24px}.progress-orbit strong{font:700 19px var(--font-display);line-height:.9}.progress-orbit span{color:#bfc6c2;font-size:9px}.focus-grid{grid-template-columns:1.3fr .9fr;gap:12px;margin:12px 0 34px;display:grid}.focus-card{border-radius:22px;min-height:152px;padding:18px}.focus-card.coral{background:var(--coral)}.focus-card.coral h3{font:600 21px/1.05 var(--font-display);letter-spacing:-.03em;margin:22px 0 8px}.focus-card.coral>p:last-child{margin:0;font-size:11px;line-height:1.5}.focus-card.ink{color:#fff;background:#29322e;flex-direction:column;display:flex}.focus-card.ink strong{margin-top:11px;font-size:13px}.focus-card.ink span{color:var(--acid);margin-top:3px;font-size:10px}.focus-card.ink button{color:#fff;background:0 0;border:0;justify-content:space-between;align-items:center;margin-top:auto;padding:0;font-size:10px;display:flex}.section-heading{justify-content:space-between;align-items:end;margin-bottom:15px;display:flex}.section-heading h2{font:600 25px var(--font-display);letter-spacing:-.045em;margin:5px 0 0}.section-heading>span{color:var(--muted);font-size:11px}.routine-list{border-top:1px solid var(--ink)}.routine-row{border-bottom:1px solid var(--line);grid-template-columns:30px 48px 1fr 44px;align-items:center;gap:12px;min-height:94px;display:grid}.step-number{font:600 10px var(--font-display);color:var(--muted);align-self:start;padding-top:18px}.routine-icon{background:#e5e1d6;border-radius:50%;place-items:center;width:48px;height:48px;display:grid}.routine-row.done .routine-icon{background:var(--acid)}.routine-row div p{font:600 10px var(--font-display);color:var(--coral);margin:0 0 2px}.routine-row div h3{margin:0 0 4px;font-size:15px}.routine-row div span{color:var(--muted);font-size:11px}.routine-row>button{border:1px solid var(--line);background:0 0;border-radius:50%;width:44px;height:44px}.bottom-nav{z-index:10;left:50%;bottom:calc(10px + var(--safe-bottom));width:min(calc(100% - 28px - var(--safe-left) - var(--safe-right)), 704px);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#18201df0;border:1px solid #ffffff1f;border-radius:22px;grid-template-columns:repeat(5,1fr);padding:9px 8px;display:grid;position:fixed;transform:translate(-50%);box-shadow:0 15px 45px #14191738}.bottom-nav button{color:#8e9692;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:15px;min-height:52px;font-size:10px;font-weight:700;transition:color .22s,background-color .22s,transform .14s}.bottom-nav button svg{margin:0 auto 3px;display:block}.bottom-nav button span{display:block}.bottom-nav button:active{transform:scale(.92)}.bottom-nav button.active{background:var(--acid);color:var(--ink);animation:.32s cubic-bezier(.2,.8,.2,1) tab-button-settle}.bottom-nav button.active svg{animation:.34s cubic-bezier(.16,1.35,.35,1) tab-icon-pop}.tab-viewport{min-height:calc(100dvh - 190px);position:relative}.tab-scene{will-change:transform, opacity}.tab-scene-forward{animation:.28s cubic-bezier(.22,.8,.3,1) both tab-scene-forward-in}.tab-scene-back{animation:.28s cubic-bezier(.22,.8,.3,1) both tab-scene-back-in}@keyframes tab-scene-forward-in{0%{opacity:0;transform:translate(26px)scale(.992)}to{opacity:1;transform:translate(0,0)scale(1)}}@keyframes tab-scene-back-in{0%{opacity:0;transform:translate(-26px)scale(.992)}to{opacity:1;transform:translate(0,0)scale(1)}}@keyframes tab-button-settle{50%{transform:translateY(-2px)}}@keyframes tab-icon-pop{50%{transform:translateY(-2px)scale(1.16)}}.view-stack{gap:34px;display:grid}.view-title{padding:18px 4px 0}.view-title h2{font:650 clamp(32px, 9vw, 52px)/.98 var(--font-display);letter-spacing:-.055em;margin:8px 0}.view-title>span,.view-title>p:last-child{color:var(--muted);font-size:13px}.offline-banner,.error-banner{background:#fff0c9;border-radius:12px;align-items:center;gap:8px;margin:-10px 0 16px;padding:10px 13px;font-size:12px;display:flex}.error-banner{color:#8d2f20;background:#ffe2dd}.center-state{min-height:100dvh;padding:calc(30px + var(--safe-top)) calc(30px + var(--safe-right)) calc(30px + var(--safe-bottom)) calc(30px + var(--safe-left));text-align:center;background:var(--paper);place-content:center;justify-items:center;gap:16px;display:grid}.pulse-logo{color:#fff;background:var(--ink);width:70px;height:70px;font:700 18px var(--font-display);border-radius:50%;place-items:center;animation:1.4s ease-in-out infinite pulse;display:grid}@keyframes pulse{50%{opacity:.72;transform:scale(.94)}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.muted-copy{color:var(--muted);font-size:13px}
.primary-button,.secondary-button,.small-button{border:1px solid var(--ink);cursor:pointer;border-radius:14px;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:0 17px;font-size:12px;font-weight:800;display:inline-flex}.primary-button{color:#fff;background:var(--ink)}.primary-button:disabled{opacity:.45;cursor:not-allowed}.secondary-button{background:0 0}.small-button{background:var(--acid);border-radius:12px;min-height:40px}.wide{width:100%}.text-button{background:0 0;border:0;align-items:center;gap:7px;min-height:44px;font-size:12px;font-weight:700;display:inline-flex}.text-button.danger{color:#a24334}.button-grid{grid-template-columns:repeat(2,1fr);gap:9px;display:grid}.button-grid.two{grid-template-columns:repeat(2,1fr)}.warning-card,.security-note{background:#fff0c9;border-radius:18px;align-items:flex-start;gap:12px;padding:16px;display:flex}.warning-card p,.security-note p{margin:0;font-size:12px;line-height:1.6}.warning-card svg,.security-note svg{flex:none}.save-message{color:#374612;background:#edf9b9;border-radius:12px;padding:11px 13px;font-size:12px}.empty-state{background:#ffffff59;border:1px dashed #9fa39e;border-radius:22px;justify-items:start;gap:10px;padding:28px;display:grid}.empty-state h2,.empty-state p{margin:0}.empty-state p{color:var(--muted);font-size:13px;line-height:1.6}.empty-state.compact{padding:22px}.expression-strip{overflow:hidden}.expression-scroll{scroll-snap-type:x mandatory;scrollbar-width:none;grid-auto-columns:minmax(230px,73%);grid-auto-flow:column;gap:10px;padding-bottom:6px;display:grid;overflow-x:auto}.expression-chip{border:1px solid var(--line);scroll-snap-align:start;background:#ffffff70;border-radius:20px;flex-direction:column;min-height:136px;padding:17px;display:flex}.expression-chip>span{color:var(--coral);font:700 10px var(--font-display)}.expression-chip strong{font:600 18px/1.15 var(--font-display);margin:auto 0 8px}.expression-chip small{color:var(--muted);font:700 9px var(--font-display);letter-spacing:.08em}.coach-actions{background:#e4e0d5;border-radius:24px;gap:18px;padding:24px;display:grid}.coach-actions h2{font:650 25px var(--font-display);margin:5px 0}.coach-actions p{color:var(--muted);margin:0;font-size:12px}
.mode-tabs{background:#e5e1d6;border-radius:17px;grid-template-columns:repeat(5,1fr);gap:7px;padding:6px;display:grid}.youtube-practice{gap:18px;display:grid}.youtube-practice-head{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.youtube-practice-head h2{font:650 28px/1.04 var(--font-display);letter-spacing:-.045em;margin:7px 0 10px}.youtube-practice-head>div>p:last-child{max-width:470px;color:var(--muted);margin:0;font-size:11px;line-height:1.6}.youtube-practice-head>span{color:#fff;background:#d94b3d;border-radius:999px;flex:none;align-items:center;gap:6px;padding:8px 10px;font-size:9px;font-weight:800;display:inline-flex}.youtube-url-form{border:1px solid var(--line);background:#ffffff7a;border-radius:17px;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:6px;display:grid}.youtube-url-form input{min-width:0;color:var(--ink);background:0 0;border:0;outline:0;padding:0 11px;font-size:11px}.youtube-url-form button{color:#fff;background:var(--ink);border:0;border-radius:12px;justify-content:center;align-items:center;gap:6px;min-height:42px;padding:0 14px;font-size:10px;font-weight:800;display:inline-flex}.youtube-url-form button:disabled{opacity:.55}.youtube-frame{aspect-ratio:16/9;background:#0f1512;border-radius:22px;position:relative;overflow:hidden;box-shadow:0 16px 35px #18201d29}.youtube-frame iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.youtube-frame>div{width:100%;height:100%}.youtube-source{justify-content:space-between;align-items:center;gap:12px;display:flex}.youtube-source strong,.youtube-source small{display:block}.youtube-source strong{font-size:12px}.youtube-source small{color:var(--muted);margin-top:4px;font-size:9px}.youtube-source a{color:var(--ink);flex:none;align-items:center;gap:5px;font-size:10px;font-weight:800;display:inline-flex}.youtube-error{color:#8c332b;background:#fff0eb;border:1px solid #c2463a2e;border-radius:14px;padding:13px 15px;font-size:11px;line-height:1.5}.youtube-loop-settings{border:1px solid var(--line);background:#ffffff52;border-radius:16px;flex-wrap:wrap;justify-content:space-between;gap:10px;padding:12px;display:flex}.youtube-loop-settings>div{align-items:center;gap:5px;display:flex}.youtube-loop-settings span{color:var(--muted);margin-right:3px;font-size:9px;font-weight:800}.youtube-loop-settings button{border:1px solid var(--line);min-width:42px;height:30px;color:var(--muted);background:0 0;border-radius:999px;padding:0 9px;font-size:9px;font-weight:800}.youtube-loop-settings button.active{border-color:var(--ink);color:#fff;background:var(--ink)}.youtube-loading{border:1px dashed var(--line);min-height:220px;color:var(--muted);background:#fffdf766;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:24px;display:flex}.youtube-progress-ring{justify-content:center;align-items:center;width:100px;height:100px;margin-bottom:4px;display:flex;position:relative}.youtube-progress-percent{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.youtube-progress-percent span{font-family:var(--font-display);color:var(--ink);letter-spacing:-.5px;font-size:22px;font-weight:700}.youtube-loading strong{color:var(--ink);font-size:13px}.youtube-loading span{font-size:11px}.spin{animation:.85s linear infinite youtube-spin}@keyframes youtube-spin{to{transform:rotate(360deg)}}.youtube-empty-state{text-align:center;border:1px dashed var(--line);min-height:120px;color:var(--muted);border-radius:22px;justify-content:center;align-items:center;padding:24px;font-size:13px;display:flex}.youtube-shadowing{color:#fff;background:var(--ink);border-radius:23px;gap:12px;padding:22px;display:grid}.youtube-shadowing>.eyebrow{color:var(--acid)}.youtube-shadowing h3{font:600 clamp(24px, 7vw, 36px)/1.15 var(--font-display);letter-spacing:-.035em;margin:0}.youtube-shadowing>p:not(.eyebrow){color:#b7c0bb;margin:0;font-size:11px}.youtube-shadow-actions{grid-template-columns:1fr 48px;gap:8px;margin-top:5px;display:grid}.youtube-shadow-actions .primary-button{color:var(--ink);border-color:var(--acid);background:var(--acid);justify-content:center;align-items:center;gap:7px;display:flex}.youtube-shadow-actions .icon-toggle{color:#fff;border-color:#52605a}.youtube-shadow-actions .icon-toggle:disabled{opacity:.35}.youtube-transcript-list{gap:12px;display:grid}.youtube-transcript-head{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.youtube-transcript-head p{margin-bottom:4px}.youtube-transcript-head strong{font-size:13px}.youtube-transcript-head small{color:var(--muted);font-size:9px}.youtube-transcript-list ol{overscroll-behavior:contain;gap:6px;max-height:420px;margin:0;padding:0 3px 0 0;list-style:none;display:grid;overflow-y:auto}.youtube-scene-label{color:var(--muted);font:750 9px var(--font-display);letter-spacing:.12em;text-transform:uppercase;margin:10px 4px 5px}.youtube-transcript-list li:first-child .youtube-scene-label{margin-top:2px}.youtube-transcript-list button{border:1px solid var(--line);width:100%;color:var(--ink);text-align:left;background:#ffffff4d;border-radius:14px;grid-template-columns:42px minmax(0,1fr) 18px;align-items:center;gap:9px;padding:12px;display:grid}.youtube-transcript-list button.active{border-color:var(--ink);background:#fff;box-shadow:0 8px 22px #18201d14}.youtube-transcript-list time{color:var(--coral);font:750 9px var(--font-display)}.youtube-transcript-list span{font-size:11px;line-height:1.45}.youtube-transcript-list svg{color:var(--muted)}.youtube-copyright{color:var(--muted);margin:0;font-size:9px;line-height:1.55}.mode-tabs button{min-height:50px;color:var(--muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:12px;place-items:center;gap:2px;font-size:10px;font-weight:800;transition:color .2s,background-color .2s,transform .14s;display:grid}.mode-tabs button:active{transform:scale(.94)}.mode-tabs button.active{color:#fff;background:var(--ink)}.mode-tabs button.active svg{animation:.34s cubic-bezier(.16,1.35,.35,1) tab-icon-pop}.learning-mode-scene{will-change:transform, opacity;gap:34px;display:grid}.learning-mode-scene.mode-scene-forward{animation:.25s cubic-bezier(.22,.8,.3,1) both mode-scene-forward-in}.learning-mode-scene.mode-scene-back{animation:.25s cubic-bezier(.22,.8,.3,1) both mode-scene-back-in}@keyframes mode-scene-forward-in{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:translate(0,0)}}@keyframes mode-scene-back-in{0%{opacity:0;transform:translate(-18px)}to{opacity:1;transform:translate(0,0)}}.player-card,.speaking-card,.library-view{gap:20px;display:grid}.player-head{justify-content:space-between;gap:14px;display:flex}.player-head h2{font:650 27px/1.05 var(--font-display);letter-spacing:-.04em;margin:5px 0}.player-head p:last-child{color:var(--muted);margin:0;font-size:12px}.icon-toggle{border:1px solid var(--line);background:0 0;border-radius:50%;min-width:48px;height:48px}.icon-toggle.active{background:var(--acid)}.media-notice{color:#64531c;background:#fff0c9;border-radius:12px;padding:12px 14px;font-size:12px}.sentence-stage{color:#fff;background:var(--ink);border-radius:26px;flex-direction:column;justify-content:center;min-height:265px;padding:26px;display:flex}.sentence-count{color:var(--acid);font:700 10px var(--font-display);letter-spacing:.12em}.sentence-stage h3{font:550 clamp(25px, 7vw, 38px)/1.17 var(--font-display);letter-spacing:-.03em;margin:auto 0}.sentence-stage mark{color:var(--ink);background:var(--acid);padding:0 3px}.meaning{color:#bdc4c0;margin:12px 0;font-size:13px;line-height:1.55}.transcript-locked{color:#afb7b2;text-align:center;justify-items:center;gap:10px;margin:auto 0;font-size:13px;display:grid}.segment-progress{background:#3f4844;border-radius:3px;height:3px;overflow:hidden}.segment-progress span{background:var(--acid);height:100%;transition:width .25s;display:block}.main-controls{justify-content:center;align-items:center;gap:22px;display:flex}.main-controls button{background:0 0;border:0;border-radius:50%;place-items:center;width:52px;height:52px;display:grid}.main-controls button:disabled{opacity:.28}.main-controls .play-button{width:78px;height:78px;color:var(--ink);background:var(--acid);box-shadow:0 12px 26px #4b58192e}.player-options{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.player-options>button,.player-options label{border:1px solid var(--line);background:#ffffff59;border-radius:13px;justify-content:center;align-items:center;gap:5px;min-height:52px;padding:4px;font-size:10px;font-weight:700;display:flex}.player-options>button.active{background:var(--acid)}.player-options select{background:0 0;border:0;outline:0;font-size:10px;font-weight:700}.reveal-controls{grid-template-columns:1fr 1fr;gap:8px;display:grid}.reveal-controls button{border:1px solid var(--line);background:0 0;border-radius:13px;justify-content:center;align-items:center;gap:7px;min-height:48px;font-size:11px;font-weight:750;display:flex}.comprehension-card{background:#e5e1d6;border-radius:18px;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:18px;display:grid}.comprehension-card>div>strong{font-size:12px;display:block}.comprehension-card>div>span{color:var(--muted);font-size:9px}.score-picker{gap:5px;display:flex}.score-picker button{border:1px solid var(--line);background:var(--cream);width:34px;height:34px;font:700 11px var(--font-display);border-radius:50%}.score-picker button.active{border-color:var(--ink);color:#fff;background:var(--ink)}.shadow-button{border:1px solid var(--line);text-align:left;background:0 0;border-radius:18px;justify-content:space-between;align-items:center;min-height:72px;padding:0 19px;display:flex}.shadow-button span strong,.shadow-button span small{display:block}.shadow-button span small{color:var(--muted);margin-top:3px;font-size:10px}.shadow-button b{font:700 20px var(--font-display)}.shadow-button.ready{background:var(--acid)}.timer-line{color:var(--muted);font:700 10px var(--font-display);letter-spacing:.07em;justify-content:space-between;display:flex}.prompt-card{background:var(--coral);border-radius:22px;padding:24px}.prompt-card h3{font:600 26px/1.12 var(--font-display);letter-spacing:-.035em;margin:18px 0 9px}.prompt-card>p:last-child{margin:0;font-size:11px}.target-list{gap:7px;display:grid}.target-list>p{margin-bottom:5px}.target-list button{border:1px solid var(--line);text-align:left;min-height:48px;font:600 12px var(--font-display);background:#ffffff59;border-radius:13px;justify-content:space-between;align-items:center;padding:0 14px;display:flex}.target-list button span{font-size:18px}.field-block{color:var(--muted);gap:7px;font-size:11px;font-weight:700;display:grid;position:relative}.field-block input,.field-block textarea,.inline-form input,.inline-form textarea,.settings-form input,.settings-form textarea,.settings-form select,.login-card input,.login-card select{border:1px solid var(--line);width:100%;min-height:48px;color:var(--ink);background:var(--cream);resize:vertical;border-radius:13px;outline:none;padding:13px}.field-block textarea{min-height:150px;padding-bottom:48px}.field-block input:focus,.field-block textarea:focus,.inline-form input:focus,.settings-form input:focus,.login-card input:focus,.login-card select:focus{border-color:var(--ink);box-shadow:0 0 0 3px #d8ef6799}.field-block .blurred{filter:blur(7px);-webkit-user-select:none;user-select:none}.field-action{background:#e8e4d9;border:0;border-radius:9px;align-items:center;gap:6px;min-height:34px;font-size:10px;font-weight:700;display:flex;position:absolute;bottom:9px;right:9px}.speaking-timer{color:#fff;background:var(--ink);border-radius:20px;grid-template-columns:1fr auto 52px 52px;align-items:center;gap:8px;padding:18px;display:grid}.speaking-timer strong{font:650 35px var(--font-display);font-variant-numeric:tabular-nums;margin-top:4px;display:block}.timer-presets{background:#343d39;border-radius:10px;padding:3px;display:flex}.timer-presets button{color:#aeb6b1;background:0 0;border:0;border-radius:8px;height:34px;font-size:10px}.timer-presets button.active{color:var(--ink);background:var(--acid)}.round-action{background:var(--acid);border:0;border-radius:50%;place-items:center;width:48px;height:48px;display:grid}.round-action.muted{color:#fff;background:#3c4641}.recording-panel{border:1px solid var(--line);border-radius:18px;gap:10px;padding:16px;display:grid}.recording-panel>button{background:#e5e1d6;border:0;border-radius:13px;justify-content:center;align-items:center;gap:8px;min-height:48px;font-weight:700;display:flex}.recording-panel>button.recording{color:#fff;background:#b54838}.recording-panel audio{width:100%;height:42px}.recording-panel label{color:var(--muted);align-items:center;gap:8px;font-size:10px;display:flex}.self-scores{background:#e5e1d6;border-radius:18px;gap:15px;padding:18px;display:grid}.self-scores>div{justify-content:space-between;align-items:center;display:flex}.review-priority{border-left:4px solid var(--coral);background:#e5e1d6;padding:16px}.review-priority strong{margin-top:6px;font-size:12px;line-height:1.55;display:block}.library-list{gap:9px;display:grid}.library-list article{border:1px solid var(--line);background:#ffffff59;border-radius:17px;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;padding:14px;display:grid}.content-icon{background:var(--acid);border-radius:50%;place-items:center;width:48px;height:48px;display:grid}.library-list p,.library-list h3{margin:0}.library-list p{color:var(--muted);font-size:9px}.library-list p span{color:var(--coral);font-weight:800}.library-list h3{margin:4px 0;font-size:13px}.library-list small{color:var(--muted);font-size:9px}.library-actions{flex-direction:column;gap:4px;display:flex}.library-actions button,.library-actions a{width:38px;height:38px;color:var(--ink);background:#e5e1d6;border:0;border-radius:10px;place-items:center;display:grid}.inline-form{background:#e5e1d6;border-radius:20px;gap:12px;padding:18px;display:grid}.inline-form label,.settings-form label,.login-card label{color:var(--muted);gap:6px;font-size:10px;font-weight:700;display:grid}.segmented{background:#e5e1d6;border-radius:12px;padding:4px;display:inline-flex}.segmented button{min-height:36px;color:var(--muted);background:0 0;border:0;border-radius:9px;align-items:center;gap:5px;padding:0 12px;font-size:10px;font-weight:700;display:flex}.segmented button.active{color:#fff;background:var(--ink)}
.review-card{color:#fff;background:var(--ink);border-radius:25px;gap:20px;min-height:340px;padding:24px;display:grid}.review-card-top{color:var(--acid);font:700 9px var(--font-display);letter-spacing:.09em;justify-content:space-between;display:flex}.review-card>p{color:#aeb6b1;margin:12px 0 -8px;font-size:11px}.review-card>h3{font:600 29px/1.14 var(--font-display);margin:0}.review-card .secondary-button{color:#fff;border-color:#65706a}.answer-reveal{color:var(--ink);background:var(--acid);border-radius:15px;padding:17px}.answer-reveal strong{font:650 19px var(--font-display)}.answer-reveal p{margin-bottom:0;font-size:11px}.review-grades{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.review-grades button{color:#fff;background:0 0;border:1px solid #505b55;border-radius:11px;min-height:46px;font-size:9px}.compact-list,.correction-list{border-top:1px solid var(--ink);display:grid}.compact-list article{border-bottom:1px solid var(--line);align-items:center;gap:11px;min-height:68px;display:flex}.status-dot{background:var(--muted);border-radius:50%;width:10px;height:10px}.status-dot.warning{background:var(--coral)}.compact-list strong,.compact-list small{display:block}.compact-list strong{font:600 13px var(--font-display)}.compact-list small{color:var(--muted);margin-top:4px;font-size:9px}.correction-list article{border-bottom:1px solid var(--line);gap:6px;padding:16px 0;display:grid}.correction-list p{color:#975447;margin:0;font-size:12px}.correction-list strong{align-items:start;gap:7px;font-size:13px;display:flex}.correction-list small{color:var(--muted);font-size:10px}.report-title{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.metric-grid{grid-template-columns:1fr 1fr;gap:9px;display:grid}.metric-card{border:1px solid var(--line);background:#ffffff5c;border-radius:20px;flex-direction:column;min-height:155px;padding:17px;display:flex}.metric-card:first-child{background:var(--acid)}.metric-card:nth-child(4){color:#fff;background:var(--ink)}.metric-card p{margin:12px 0 3px;font-size:10px;font-weight:700}.metric-card>strong{font:650 32px var(--font-display)}.metric-card>strong small{margin-left:3px;font-size:12px}.metric-card>span{color:var(--muted);margin-top:auto;font-size:9px}.metric-card:nth-child(4)>span{color:#aeb6b1}.routine-chart{background:#e5e1d6;border-radius:22px;padding:20px}.bar-row{grid-template-columns:54px 1fr 40px;align-items:center;gap:10px;margin:13px 0;font-size:10px;display:grid}.bar-row>div{background:#cbc7bd;border-radius:5px;height:8px;overflow:hidden}.bar-row i{background:var(--coral);border-radius:5px;height:100%;display:block}.bar-row strong{text-align:right;font-size:10px}.weakness-list{gap:9px;display:grid}.weakness-list article{border:1px solid var(--line);border-radius:16px;grid-template-columns:1fr auto;gap:5px 10px;padding:16px;display:grid}.weakness-list p{color:var(--muted);margin:5px 0 0;font-size:10px}.weakness-list small{color:var(--muted);font-size:9px}.trend{align-self:start;align-items:center;gap:3px;font-size:8px;font-weight:800;display:flex}.trend svg{width:14px}.trend.improving{color:#517012}.trend.worsening{color:#b34837}.latest-report{color:#fff;background:var(--ink);border-radius:22px;padding:22px}.latest-report>p{color:#c4cbc7;font-size:12px;line-height:1.65}.latest-report h3{color:var(--acid);margin-top:24px;font-size:11px}.report-scores{grid-template-columns:repeat(4,1fr);gap:5px;margin:18px 0;display:grid}.report-scores span{text-align:center;border:1px solid #3f4944;border-radius:10px;padding:10px 4px}.report-scores small,.report-scores strong{display:block}.report-scores small{color:#aeb6b1;font-size:8px}.report-scores strong{font:600 14px var(--font-display);margin-top:4px}.report-correction{background:#303a35;border-radius:12px;gap:5px;margin-bottom:12px;padding:12px;font-size:11px;display:grid}.report-correction s{color:#cf8b7e}.latest-report li{color:#c7cec9;margin-bottom:7px;font-size:11px}
.settings-form{gap:12px;display:grid}.settings-form section{border:1px solid var(--line);background:#ffffff52;border-radius:22px;gap:14px;padding:20px;display:grid}.settings-heading{gap:12px;display:flex}.settings-heading>span{background:var(--acid);width:35px;height:35px;font:700 9px var(--font-display);border-radius:50%;place-items:center;display:grid}.settings-heading h3,.settings-heading p{margin:0}.settings-heading h3{font:650 17px var(--font-display)}.settings-heading p{color:var(--muted);margin-top:4px;font-size:9px}.settings-tools{gap:8px;display:grid}.settings-tools>button{border:1px solid var(--line);text-align:left;background:0 0;border-radius:16px;align-items:center;gap:13px;min-height:70px;padding:14px;display:flex}.settings-tools>button>svg{background:#e5e1d6;border-radius:50%;width:44px;height:44px;padding:10px}.settings-tools strong,.settings-tools small{display:block}.settings-tools strong{font-size:12px}.settings-tools small{color:var(--muted);margin-top:3px;font-size:9px}.settings-tools>button.danger{color:#9e3f30}.action-key-panel{color:#fff;background:var(--ink);border-radius:13px;gap:7px;padding:13px;display:grid}.action-key-panel code{overflow-wrap:anywhere;color:var(--acid);-webkit-user-select:all;user-select:all;font-size:9px;line-height:1.5}.action-key-panel small{color:#b9c1bc;font-size:9px;line-height:1.45}
html.splash-active,html.splash-active body{overscroll-behavior:none;background:var(--ink);width:100%;height:100%;overflow:hidden}.splash-page{z-index:100;overscroll-behavior:none;touch-action:none;width:100%;height:100%;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);color:#fff;background:var(--ink);place-items:center;display:grid;position:fixed;inset:0;overflow:hidden}.splash-center{z-index:2;text-align:center;justify-items:center;display:grid;position:relative}.splash-logo{width:92px;height:92px;color:var(--ink);background:var(--acid);border:1px solid #ffffff57;border-radius:50%;place-items:center;margin-bottom:27px;animation:.72s cubic-bezier(.16,1.3,.3,1) both splash-logo-in,1.2s ease-in-out .72s infinite splash-logo-pulse;display:grid;box-shadow:0 0 #d8ef6742}.splash-logo span{font:750 21px var(--font-display);letter-spacing:.08em}.splash-center .eyebrow{color:var(--coral);animation:.45s .25s both splash-copy-in}.splash-center h1{font:650 clamp(38px, 11vw, 58px)/1 var(--font-display);letter-spacing:-.055em;margin:9px 0 7px;animation:.45s .34s both splash-copy-in}.splash-center>p:last-child{color:#b8c0bc;margin:0;font-size:12px;animation:.45s .43s both splash-copy-in}.splash-orbit{border:1px solid #ffffff17;border-radius:50%;animation:.8s cubic-bezier(.22,.8,.3,1) both splash-orbit-in;position:absolute}.splash-orbit-outer{aspect-ratio:1;width:min(90vw,490px)}.splash-orbit-outer:after{content:"";background:var(--coral);border-radius:50%;width:15px;height:15px;position:absolute;top:18%;right:13%;box-shadow:0 0 0 9px #ed765d1f}.splash-orbit-inner{aspect-ratio:1;border-style:dashed;width:min(62vw,330px);animation-delay:.1s}.splash-loader{left:50%;bottom:calc(42px + var(--safe-bottom));background:#35403b;border-radius:999px;width:min(180px,46vw);height:3px;position:absolute;overflow:hidden;transform:translate(-50%)}.splash-loader span{border-radius:inherit;background:var(--acid);transform-origin:0;width:100%;height:100%;animation:1.35s cubic-bezier(.2,.75,.25,1) 80ms both splash-loading;display:block}@keyframes splash-logo-in{0%{opacity:0;transform:scale(.55)rotate(-9deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes splash-logo-pulse{50%{transform:scale(.96);box-shadow:0 0 0 15px #d8ef6700}}@keyframes splash-copy-in{0%{opacity:0}to{opacity:1}}@keyframes splash-orbit-in{0%{opacity:0;transform:scale(.78)rotate(-20deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes splash-loading{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.login-page{background:var(--paper);grid-template-rows:minmax(320px,45vh) 1fr;min-height:100dvh;display:grid}.login-brand{padding:calc(30px + var(--safe-top)) calc(24px + var(--safe-right)) 30px calc(24px + var(--safe-left));color:#fff;background:var(--ink);position:relative;overflow:hidden}.login-brand:after{content:"";border:45px solid var(--coral);border-radius:50%;width:230px;height:230px;position:absolute;bottom:-130px;right:-80px}.brand-mark.inverse{border-color:#fff;margin-bottom:45px}.login-brand h1{font:650 clamp(45px, 13vw, 72px)/.9 var(--font-display);letter-spacing:-.06em;margin:10px 0}.login-brand h1 em{color:var(--acid);font-style:normal}.login-brand>p:last-child{color:#b9c0bc;max-width:410px;font-size:12px;line-height:1.6}.login-card{width:min(100%,480px);padding:30px calc(24px + var(--safe-right)) calc(50px + var(--safe-bottom)) calc(24px + var(--safe-left));align-self:center;gap:17px;margin:auto;display:grid}.login-card h2{font:650 26px var(--font-display);margin:4px 0 0}.auth-switch{background:#e5e1d6;border-radius:15px;grid-template-columns:1fr 1fr;gap:5px;padding:5px;display:grid}.auth-switch button{min-height:44px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:11px;font-size:11px;font-weight:800}.auth-switch button.active{color:#fff;background:var(--ink)}.auth-fields{gap:13px;animation:.24s cubic-bezier(.22,.8,.3,1) both tab-scene-forward-in;display:grid}.login-card label{color:var(--muted);gap:6px;font-size:10px;font-weight:700;display:grid}.password-hint{color:var(--muted);margin:-4px 2px 0;font-size:9px;line-height:1.5}.form-error{color:#a03929;margin:0;font-size:11px}.form-note{color:var(--muted);margin:0;font-size:9px;line-height:1.55}
@media (min-width:760px){.login-page{grid-template-rows:1fr;grid-template-columns:1.1fr .9fr}.login-brand{min-height:100dvh;padding:calc(8vw + var(--safe-top)) calc(8vw + var(--safe-right)) calc(8vw + var(--safe-bottom)) calc(8vw + var(--safe-left));flex-direction:column;justify-content:center;display:flex}.login-card{padding:calc(50px + var(--safe-top)) calc(50px + var(--safe-right)) calc(50px + var(--safe-bottom)) calc(50px + var(--safe-left))}.coach-actions{grid-template-columns:1fr 1.3fr;align-items:center}.player-card,.speaking-card{padding:10px 40px 40px}}@media (min-width:700px){.app-shell{padding-top:34px}.hero-card{min-height:280px}.focus-grid{grid-template-columns:1.65fr 1fr}}@media (max-width:390px){.focus-grid{grid-template-columns:1fr}.focus-card{min-height:130px}.routine-row{grid-template-columns:24px 44px 1fr 44px;gap:8px}.button-grid{grid-template-columns:1fr}.speaking-timer{grid-template-columns:1fr auto 48px}.speaking-timer .round-action.muted{display:none}.report-title{display:block}.report-title .segmented{margin-top:14px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

