@import"https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700&family=Plus+Jakarta+Sans:wght@400;500;600&family=DM+Mono:wght@400;500&display=swap";:root{color-scheme:light;--page: #faf7f2;--surface: #ffffff;--surface-strong: #ffffff;--ink: #3d3229;--muted: #6b5d4d;--soft: #9a8e7e;--line: rgba(61, 50, 41, .08);--line-strong: rgba(61, 50, 41, .16);--accent: #b8956a;--accent-dark: #9a7a52;--accent-light: #c9a86c;--story-accent: #6552ee;--green: #7a9e6b;--blue: #6b8db8;--danger: #b4624a;--dark: #11100f;--dark-soft: #1f1d1b;--shadow: 0 6px 24px rgba(61, 50, 41, .08);--cafe-cream: #f5f0e8;--cafe-tan: #ebe3d5;--cafe-brown: #8b7355;--cafe-dark: #3d3530;--cafe-sage: #7a8b6f;--sidebar-bg: #f5f0e8;--sidebar-text: #6b5d4d;--sidebar-active-bg: rgba(184, 149, 106, .12);--home-max-width: 1440px;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Arial,sans-serif}.app-error-boundary{min-height:100vh;display:grid;place-items:center;padding:32px;background:#f8f5ef;color:#2f2924}.app-error-boundary>div{max-width:520px;padding:32px;border-radius:18px;background:#fff;box-shadow:0 18px 54px #2f292424;text-align:center}.app-error-boundary button{margin-top:14px;padding:10px 18px;border:0;border-radius:10px;background:var(--accent, #b8956a);color:#fff;cursor:pointer}.story-practice-shell{--story-ink: #211f1d;--story-muted: #746f69;--story-line: rgba(111, 94, 69, .16);height:100vh;overflow:hidden;color:var(--story-ink);background:#fbfaf8}.story-practice-header{position:sticky;z-index:50;top:0;display:grid;grid-template-columns:auto auto minmax(360px,1fr) auto auto auto;align-items:center;min-height:70px;gap:24px;padding:0 24px;border-bottom:1px solid rgba(51,42,31,.1);background:#fffffff5;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.story-brand,.story-course-lockup,.story-primary-nav,.story-primary-nav button{display:flex;align-items:center}.story-brand{gap:9px;border:0;background:transparent;color:var(--story-ink);font-size:20px;cursor:pointer}.story-brand img{width:31px;height:31px;object-fit:contain}.story-course-lockup{gap:8px;padding-left:22px;border-left:1px solid var(--story-line);font-size:14px;font-weight:650;white-space:nowrap}.story-primary-nav{justify-content:center;gap:38px}.story-primary-nav button{position:relative;align-self:stretch;min-height:70px;border:0;background:transparent;color:#393531;font-size:14px;font-weight:650;cursor:pointer}.story-primary-nav button.active:after{position:absolute;right:22%;bottom:12px;left:22%;height:3px;border-radius:99px;background:var(--story-accent);content:""}.story-lang-select{height:38px;border:1px solid var(--story-line);border-radius:10px;background:#fff;color:#4f4a44;font-size:13px;font-weight:600;cursor:pointer;padding:0 8px;font-family:inherit;transition:border-color .15s}.story-lang-select:hover{border-color:var(--story-accent);color:var(--story-accent)}.story-lang-select:focus{outline:none;border-color:var(--story-accent)}.story-user-avatar{width:38px;height:38px;border:2px solid #fff;border-radius:50%;object-fit:cover;box-shadow:0 2px 12px #2a20151f}.story-resource-toggle{display:none;align-items:center;gap:6px;padding:8px 10px;border:1px solid var(--story-line);border-radius:9px;color:#4e4942;background:#fff;cursor:pointer}.story-practice-layout{display:grid;grid-template-columns:minmax(0,1fr) 314px;grid-template-rows:minmax(0,1fr);gap:14px;max-width:1458px;height:calc(100vh - 70px);margin:0 auto;padding:20px;overflow:hidden}.story-stage{position:relative;isolation:isolate;min-width:0;min-height:0;height:100%;overflow:hidden;border:1px solid rgba(158,128,90,.18);border-radius:16px;background-color:#e8d5b9;background-position:center;background-size:cover;box-shadow:0 12px 34px #4d392314}.story-stage-wash{position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,#fffaf1d6 0,#fff8ed2e 21%,#55351b0d 70%,#fffaf3f0),linear-gradient(90deg,rgba(255,246,232,.5),transparent 23%,transparent 77%,rgba(255,246,232,.45));pointer-events:none}.story-scene-heading{position:relative;z-index:7;max-width:620px;padding:22px 30px 8px}.story-scene-heading>span{display:inline-flex;padding:6px 13px;border-radius:99px;background:#fffaf2bd;color:#625b52;font-size:13px;font-weight:650}.story-scene-heading h1{margin:13px 0 7px;font-size:clamp(25px,2.2vw,34px);line-height:1.08;letter-spacing:-.03em}.story-scene-heading p{margin:0;color:#514c45;font-size:14px}.story-character{position:absolute;z-index:1;bottom:93px;width:36%;max-width:390px;min-width:180px;height:80%;margin:0;pointer-events:none}.story-character-left{left:-2%}.story-character-right{right:-2%}.story-character img{width:100%;height:100%;object-fit:contain;object-position:center bottom;transform:scale(1.12);transform-origin:center bottom;filter:drop-shadow(0 12px 18px rgba(43,27,13,.2))}.story-character figcaption{position:absolute;right:12%;bottom:19%;display:grid;padding:8px 12px;border-radius:10px;color:#fff;background:#261d1694;text-shadow:0 1px 2px #000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.story-character-left figcaption{right:auto;left:20%}.story-character figcaption strong{font-size:17px}.story-character figcaption span{margin-top:2px;font-size:11px;opacity:.9}.story-dialogue-scroll{position:absolute;z-index:5;inset:132px 18% 105px;display:flex;flex-direction:column;gap:10px;overflow:auto;padding:12px 7px 30px;scrollbar-width:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 4%,#000 93%,transparent);mask-image:linear-gradient(180deg,transparent,#000 4%,#000 93%,transparent)}.story-dialogue-scroll::-webkit-scrollbar{display:none}.story-bubble{position:relative;width:min(82%,520px);padding:14px 18px;border:1px solid rgba(93,71,45,.2);border-radius:18px;color:#211e1a;background:#fffdf8f0;box-shadow:0 8px 22px #3d28141f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer}.story-bubble.npc{align-self:flex-start}.story-bubble.player{align-self:flex-end}.story-bubble.current{border-color:#4e634080;background:#fbfff5f5}.story-bubble.completed{opacity:.83;transform:scale(.97)}.story-bubble.focused{opacity:1;transform:none}.story-bubble:after{position:absolute;bottom:-7px;left:24px;width:14px;height:14px;border-right:1px solid rgba(93,71,45,.2);border-bottom:1px solid rgba(93,71,45,.2);background:inherit;content:"";transform:rotate(45deg)}.story-bubble.player:after{right:24px;left:auto}.story-bubble-meta{display:flex;align-items:center;gap:8px;margin-bottom:7px;font-size:13px}.story-bubble-meta button{display:inline-grid;place-items:center;min-width:25px;height:25px;margin-left:auto;padding:0 6px;border:0;border-radius:50%;color:#5a544c;background:#6552ee14;cursor:pointer}.story-bubble-meta .story-edit-line{width:auto;border-radius:8px;font-size:10px}.story-bubble p{margin:0;font-size:16px;font-weight:650;line-height:1.45}.story-bubble>small{display:block;margin-top:5px;color:#6d675f;font-size:12px;line-height:1.4}.story-bubble .story-target-caption{color:#3f3b36}.story-playing-bar{position:absolute;right:15px;bottom:8px;left:15px;height:2px;overflow:hidden;border-radius:99px;background:#6552ee29}.story-playing-bar:after{display:block;width:45%;height:100%;border-radius:inherit;background:var(--story-accent);content:"";animation:story-playing 1s linear infinite alternate}@keyframes story-playing{to{transform:translate(120%)}}.story-composer{position:absolute;z-index:12;right:16px;bottom:16px;left:16px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;min-height:76px;padding:10px 14px;border:1px solid rgba(120,97,69,.22);border-radius:18px;background:#fffffff2;box-shadow:0 10px 30px #3f2a1424;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.story-language-toggle,.story-mode-switch button{display:flex;align-items:center;justify-content:center;border:1px solid var(--story-line);color:#4f4a44;background:#fff;cursor:pointer}.story-language-toggle{gap:7px;min-height:46px;padding:0 14px;border-radius:12px;font-size:12px;font-weight:650}.story-composer-main{position:relative;min-width:0}.story-composer-main .character-input-shell{position:relative;display:flex;align-items:center;min-height:50px;overflow:hidden;border:1px solid var(--story-line);border-radius:12px;background:#ffffffeb;box-shadow:none;cursor:text}.story-composer-main .character-input-shell:focus-within{border-color:#634aeb85}.story-composer-main .practice-code-input{width:100%;padding-right:52px}.story-composer-main .practice-code-input .cm-editor,.story-composer-main .practice-code-input .cm-scroller{min-height:48px}.story-composer-main .practice-code-input .cm-content{padding:14px 12px}.story-composer-main .practice-input-placeholder{position:absolute;top:50%;left:13px;color:#9a958f;transform:translateY(-50%);pointer-events:none}.cm-saynext-wrong{color:#b43a2f;background:#b43a2f2e;border-radius:3px}.cm-saynext-case{color:#9a6b1a;background:#e8b22a33;border-bottom:2px solid #e8b22a;border-radius:1px}.cm-saynext-extra{color:#c46a30;background:#e8622a29;text-decoration:line-through;text-decoration-color:#e8622a80;border-radius:3px}.story-composer-main .character-submit-button{position:absolute;z-index:2;top:50%;right:7px;display:grid;width:36px;height:36px;margin:0;padding:0;place-items:center;border:0;border-radius:9px;color:#fff;background:var(--story-accent);transform:translateY(-50%);cursor:pointer}.story-composer-main .character-submit-button:disabled{opacity:.38;cursor:not-allowed}.story-submit-hint{position:absolute;top:calc(100% + 2px);left:10px;color:#b84747}.story-mode-switch{display:flex;gap:5px}.story-mode-switch button{width:38px;height:38px;border-radius:10px}.story-mode-switch button.active{color:#fff;border-color:var(--story-accent);background:var(--story-accent)}.story-voice-composer,.story-listen-prompt{display:flex;align-items:center;width:100%;min-height:50px;gap:10px;padding:0 16px;border:1px solid var(--story-line);border-radius:12px;color:#6f6961;background:#fff}.story-voice-composer{display:flex;align-items:center;width:100%;min-height:50px;gap:12px;padding:0 16px;border:1px solid var(--story-line);border-radius:12px;color:#6f6961;background:#fff}.voice-record-btn{flex-shrink:0;width:44px;height:44px;border:0;border-radius:50%;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.voice-record-btn:disabled{opacity:.4;cursor:not-allowed}.voice-record-dot{width:20px;height:20px;border-radius:50%;background:#e8443a;box-shadow:0 0 0 3px #e8443a33;animation:voice-dot-pulse 2s ease-in-out infinite}.voice-record-btn.recording{background:#e8443a1a}.voice-stop-icon{width:16px;height:16px;border-radius:3px;background:#e8443a}@keyframes voice-dot-pulse{0%,to{box-shadow:0 0 0 3px #e8443a33}50%{box-shadow:0 0 0 6px #e8443a1a}}.voice-text-area{flex:1;min-height:24px;font-size:15px;line-height:1.5;color:#3a3530;word-break:break-word}.voice-text-area:empty:before{content:attr(data-placeholder);color:#aaa}.voice-submit-btn{flex-shrink:0;padding:8px 16px;border:0;border-radius:8px;background:var(--story-accent);color:#fff;font-size:14px;font-weight:600;cursor:pointer}.voice-submit-btn:disabled{opacity:.5;cursor:not-allowed}.story-return-current{position:absolute;z-index:15;right:24px;bottom:105px;padding:9px 13px;border:0;border-radius:99px;color:#fff;background:var(--story-accent);box-shadow:0 7px 16px #483bba40;cursor:pointer}.story-learning-panel{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:0;overflow-y:auto;scrollbar-width:thin;padding-right:2px}.story-learning-panel::-webkit-scrollbar{width:5px}.story-learning-panel::-webkit-scrollbar-track{background:transparent}.story-learning-panel::-webkit-scrollbar-thumb{background:#6f5e4533;border-radius:4px}.story-resource-card{overflow:hidden;border:1px solid rgba(92,74,54,.12);border-radius:14px;background:#fffffff5;box-shadow:0 8px 24px #3728190e}.story-resource-card>header{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:50px;padding:0 16px}.story-resource-card h2{margin:0;font-size:15px}.story-resource-card>header button{display:flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid var(--story-line);border-radius:9px;color:#514b44;background:#fff;font-size:11px;cursor:pointer}.story-card-header-actions{display:flex;align-items:center;gap:5px}.story-card-header-actions button.active{color:#b87916;border-color:#e8c87d;background:#fff7df}.story-empty-copy{margin:0;padding:2px 16px 16px;color:var(--story-muted);font-size:12px}.story-note-editor{display:grid;gap:8px;padding:0 12px 12px}.story-note-editor>div{display:flex;gap:5px}.story-note-editor>div button,.story-note-editor>button{padding:6px 8px;border:1px solid var(--story-line);border-radius:7px;background:#fff;font-size:10px;cursor:pointer}.story-note-editor>div button.active{color:#fff;background:var(--story-accent)}.story-note-editor textarea{min-height:64px;padding:9px;border:1px solid var(--story-line);border-radius:9px;resize:vertical}.story-note-editor>button{display:inline-flex;align-items:center;justify-content:center;gap:5px;color:#fff;background:var(--story-accent)}.story-note-preview{margin:0 12px 10px;padding:12px;border:1px solid rgba(190,150,84,.18);border-radius:10px;background:#fffaf0}.story-note-preview strong{display:block;font-size:12px;line-height:1.5}.story-note-preview time{display:block;margin-top:8px;color:var(--story-muted);font-size:10px}.story-resource-list{border-top:1px solid rgba(92,74,54,.08)}.story-source-item,.story-vocabulary-item{display:flex;width:100%;align-items:center;gap:8px;min-height:59px;padding:10px 13px;border:0;border-bottom:1px solid rgba(92,74,54,.08);color:var(--story-ink);background:transparent;text-align:left}.story-source-item{justify-content:space-between;cursor:pointer}.story-source-item>span{display:grid;gap:3px}.story-source-item strong{font-size:12px;line-height:1.35}.story-source-item small{color:var(--story-muted);font-size:10px}.story-source-item svg{flex:none;color:var(--story-accent)}.story-vocabulary-source{display:grid;flex:1;gap:3px;padding:0;border:0;color:inherit;background:transparent;text-align:left;cursor:pointer}.story-vocabulary-source strong{font-size:13px}.story-vocabulary-source span{color:var(--story-muted);font-size:10px}.story-vocabulary-save{display:grid;width:31px;height:31px;place-items:center;border:0;border-radius:50%;color:#6d685f;background:transparent;cursor:pointer}.story-vocabulary-save:hover{color:#b87916;background:#fff4d8}.story-view-all{display:flex;align-items:center;justify-content:center;width:100%;gap:5px;min-height:38px;border:0;color:var(--story-accent);background:transparent;font-size:11px;font-weight:650;cursor:pointer}.story-mastery-row{display:grid;grid-template-columns:74px 1fr 1fr;align-items:center;gap:8px;padding:4px 14px 16px}.story-mastery-ring{display:grid;width:66px;height:66px;place-items:center;border-radius:50%;background:radial-gradient(circle at center,#fff 57%,transparent 59%),conic-gradient(var(--story-accent) var(--mastery),#e8e5e1 0)}.story-mastery-ring strong{font-size:16px}.story-mastery-row>div:not(.story-mastery-ring){display:grid;gap:4px;text-align:center}.story-mastery-row span{color:var(--story-muted);font-size:10px}.story-mastery-row strong{font-size:16px}.story-progress-track{height:3px;background:#eeece9}.story-progress-track i{display:block;height:100%;background:var(--story-accent);transition:width .22s ease}.story-live-metrics{display:flex;align-items:center;gap:12px}.story-live-wpm,.story-live-accuracy{display:flex;flex-direction:column;align-items:center;line-height:1.1}.story-live-wpm strong,.story-live-accuracy strong{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}.story-live-wpm strong{color:var(--story-accent)}.story-live-accuracy strong{color:var(--story-ink)}.story-live-wpm span,.story-live-accuracy span{font-size:9px;color:var(--story-muted);text-transform:uppercase;letter-spacing:.4px}.story-info-toggle{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid var(--story-line);border-radius:50%;color:var(--story-muted);background:transparent;cursor:pointer;transition:color .15s ease,border-color .15s ease}.story-info-toggle:hover{color:var(--story-accent);border-color:var(--story-accent)}.story-scoring-info{padding:8px 14px 10px;border-top:1px solid rgba(92,74,54,.08);background:#6552ee0a}.story-scoring-info p{margin:0 0 4px;font-size:11px;color:var(--story-muted);line-height:1.5}.story-scoring-info p:last-child{margin-bottom:0}.story-scoring-info strong{color:var(--story-ink);font-weight:600;margin-right:4px}.story-line-toast{display:flex;align-items:center;gap:10px;padding:5px 14px;margin:0 16px 4px;border-radius:10px;background:#e8f5eceb;border:1px solid rgba(46,158,91,.2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:12px;animation:story-toast-in .22s ease-out}@keyframes story-toast-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.story-line-toast-accuracy{font-weight:700;color:#2e9e5b}.story-line-toast-delta{font-size:11px;font-weight:600}.story-line-toast-delta.up{color:#2e9e5b}.story-line-toast-delta.down{color:#d9534f}.story-line-toast-streak{font-size:11px;font-weight:600;color:#e8923a;padding:1px 7px;border-radius:8px;background:#e8923a1f}.story-sparkline{display:flex;align-items:flex-end;gap:2px;height:24px;padding:4px 14px 2px}.story-sparkline-bar{flex:1;min-width:3px;border-radius:2px 2px 0 0;background:#6552ee4d;transition:height .2s ease,background .2s ease}.story-sparkline-bar.latest{background:var(--story-accent)}.story-trend-extra{display:flex;flex-wrap:wrap;gap:6px 12px;padding:4px 14px 8px}.story-trend-extra>div{display:flex;flex-direction:column;gap:2px;text-align:center;flex:0 0 auto}.story-trend-extra span{font-size:9px;color:var(--story-muted)}.story-trend-extra strong{font-size:13px;font-variant-numeric:tabular-nums}.story-trend-extra strong.trend-up{color:#2e9e5b}.story-trend-extra strong.trend-down{color:#d9534f}.story-fatigue-warning{flex:1 1 100%}.story-fatigue-warning span{font-size:10px;color:#d9534f;font-weight:600}@media(max-width:1100px){.story-practice-header{grid-template-columns:auto 1fr auto auto auto}.story-course-lockup{display:none}.story-primary-nav{gap:24px}.story-resource-toggle{display:flex}.story-practice-layout{grid-template-columns:minmax(0,1fr)}.story-learning-panel{position:fixed;z-index:40;top:82px;right:12px;bottom:12px;width:min(330px,calc(100vw - 24px));overflow:auto;padding:8px;border-radius:16px;background:#f9f7f3f5;box-shadow:0 18px 46px #2e22162e;transform:translate(calc(100% + 24px));transition:transform .18s ease}.story-learning-panel.open{transform:translate(0)}}@media(max-width:720px){.story-practice-header{grid-template-columns:1fr auto auto auto;min-height:58px;gap:8px;padding:0 13px;-webkit-backdrop-filter:none;backdrop-filter:none}.story-brand strong{font-size:17px}.story-brand img{width:27px;height:27px}.story-user-avatar{width:32px;height:32px}.story-resource-toggle{display:grid;width:32px;height:32px;padding:0;place-items:center;font-size:0}.story-primary-nav{display:none}.story-practice-layout{min-height:calc(100vh - 58px);height:calc(100vh - 58px);padding:0;overflow:hidden}.story-stage{min-height:calc(100vh - 58px);height:calc(100vh - 58px);border:0;border-radius:0}.story-scene-heading{padding:17px 16px 6px}.story-scene-heading h1{margin-top:9px;font-size:24px}.story-scene-heading p{display:none}.story-character{bottom:100px;width:35%;height:48%;opacity:.7}.story-character-left{left:-8%}.story-character-right{right:-8%}.story-character figcaption{display:none}.story-dialogue-scroll{inset:105px 10px 99px;padding-right:0;padding-left:0}.story-bubble{width:min(88%,400px);padding:12px 14px}.story-bubble p{font-size:14px}.story-composer{right:8px;bottom:56px;left:8px;grid-template-columns:minmax(0,1fr) auto;min-height:68px;padding:8px}.story-language-toggle{position:absolute;right:5px;bottom:calc(100% + 6px);min-height:30px;padding:0 8px;background:#ffffffeb}.story-mode-switch{flex-direction:column}.story-mode-switch button{width:30px;height:25px}.story-learning-panel{top:64px;right:8px;bottom:56px;display:grid;width:calc(100vw - 16px)}}*{box-sizing:border-box}html{background:var(--page)}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:var(--page)}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled,textarea:disabled{cursor:not-allowed}.shell{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:24px 0 44px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.brand-lockup{display:inline-flex;align-items:center;gap:10px;min-height:40px;border:0;padding:0;color:var(--ink);background:transparent}.brand-mark{display:grid;width:34px;height:34px;place-items:center;border-radius:8px;color:#fff;background:var(--ink);font-weight:800}.brand-name{font-size:15px;font-weight:780}.app-header nav{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:8px;background:#fffdf8c7}.app-header nav button{min-height:32px;border:0;border-radius:6px;padding:0 13px;color:var(--muted);background:transparent;font-size:13px;font-weight:760}.app-header nav button[aria-current=true]{color:#fff;background:var(--ink)}.screen{min-height:calc(100vh - 116px)}.loading-screen{display:grid;place-items:center}.choose-layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:20px;align-items:start}.choose-main{min-width:0}.step-rail{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}.step-rail span{display:inline-flex;align-items:center;min-height:28px;border:1px solid var(--line);border-radius:999px;padding:0 10px;color:var(--muted);background:#fffdf89e;font-size:12px;font-weight:760}.step-rail span.active{border-color:#e8622a61;color:var(--accent-dark);background:#e8622a1c}.step-panel{padding:4px 0}.eyebrow{display:block;margin-bottom:10px;color:var(--accent-dark);font-size:12px;font-weight:800;text-transform:uppercase}h1,h2,h3,p{margin-top:0}.step-panel h1,.stats-header h1{max-width:760px;margin-bottom:12px;font-size:56px;line-height:1}.step-panel p,.stats-header p{max-width:660px;margin-bottom:22px;color:var(--muted);font-size:17px;line-height:1.55}.language-groups{display:grid;gap:18px;margin-bottom:18px}.option-grid,.scene-grid,.difficulty-grid,.dialogue-list,.history-stack{display:grid;gap:10px}.option-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.option-grid.two,.difficulty-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dialogue-card,.history-card,.setup-card,.stats-summary,.trend-card,.panel,.metric{border:1px solid var(--line);border-radius:8px;background:var(--surface);box-shadow:var(--shadow)}.dialogue-card,.history-card{min-width:0;padding:16px;text-align:left}.dialogue-card{display:grid;gap:7px}.dialogue-card strong{color:var(--ink);font-size:20px;line-height:1.16}.dialogue-card span,.dialogue-card small,.history-card span{color:var(--muted);font-size:13px;line-height:1.35}.dialogue-card small{color:var(--accent-dark);font-weight:780}.dialogue-card.active{border-color:#e8622ab8;box-shadow:0 16px 44px #b8401829}.history-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.history-card strong,.history-card span{display:block}.history-card>span{min-height:30px;border-radius:999px;padding:6px 10px;color:var(--green);background:#27855c1c;font-weight:820}.setup-card{position:sticky;top:18px;display:grid;gap:18px;padding:16px}.setup-empty strong,.setup-title h2{display:block;margin:0 0 8px;color:var(--ink);font-size:22px;line-height:1.15}.setup-empty p,.setup-title p,.audio-status,.setup-warning{margin:0;color:var(--muted);font-size:13px;line-height:1.45}.setup-warning{color:var(--danger);font-weight:760}.setup-label{display:block;margin-bottom:8px;color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase}.role-grid,.mode-grid{display:grid;gap:8px}.role-grid,.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.choice{display:grid;gap:3px;align-content:center;min-height:46px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;color:var(--ink);background:#ffffff94;font-size:14px;font-weight:760;text-align:center}.choice strong,.choice span{min-width:0}.choice span{color:var(--muted);font-size:11px;font-weight:680}.choice.active{border-color:var(--accent);color:#fff;background:var(--accent)}.choice.active span{color:#ffffffc7}.primary-action,.secondary-action,.text-button{border-radius:8px;font-weight:820}.primary-action{min-height:52px;border:0;padding:0 18px;color:#fff;background:var(--accent)}.primary-action:hover:not(:disabled){background:var(--accent-dark)}.primary-action:disabled{opacity:.48}.primary-action.wide{width:100%;max-width:280px}.primary-action.compact{min-height:42px}.secondary-action{min-height:44px;border:1px solid var(--line);padding:0 14px;color:var(--ink);background:#ffffffa8}.text-button{min-height:34px;border:0;margin-bottom:12px;padding:0;color:var(--accent-dark);background:transparent}.preview-screen{max-width:920px;margin:0 auto}.preview-top{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;align-items:center;margin-bottom:18px}.preview-top h1{margin-bottom:6px;font-size:42px;line-height:1}.preview-top p{margin:0;color:var(--muted);font-size:14px}.round-button{display:grid;width:40px;height:40px;place-items:center;border:0;border-radius:50%;color:#fff;background:#ffffff1c;font-weight:850}.round-button.dark{color:var(--ink);background:#1a191814}.dialogue-audio{width:100%;margin-bottom:16px}.preview-lines{display:grid;gap:10px}.preview-line{display:grid;gap:7px;border:1px solid var(--line);border-radius:8px;padding:15px;background:var(--surface)}.preview-line.active{border-color:#e8622ab8}.preview-line p{margin:0;color:var(--ink);font-size:24px;font-weight:760;line-height:1.22}.preview-line small{color:var(--muted);font-size:14px}.preview-modal-backdrop{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:28px;background:#1a191847;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.preview-modal{position:relative;width:min(100%,960px);max-height:min(88vh,820px);overflow:auto;border:1px solid rgba(255,255,255,.72);border-radius:24px;background:#fffcf8f5;box-shadow:0 30px 90px #1a191842}.preview-modal .preview-screen{padding:34px}.preview-modal-close{position:sticky;top:14px;z-index:2;display:grid;width:36px;height:36px;float:right;place-items:center;border:1px solid rgba(26,25,24,.1);border-radius:50%;margin:14px 14px 0 0;color:var(--ink);background:#ffffffdb;font-size:24px;line-height:1}.preview-modal.dialogue-detail-modal{width:min(100%,720px);max-height:min(88vh,760px);border-radius:22px;background:#fffcf8fa}.dialogue-detail-shell{display:grid;gap:14px;padding:26px 30px 30px}.dialogue-detail-header{display:grid;gap:8px;padding-right:46px}.dialogue-detail-header h1{margin:0;color:var(--ink);font-size:clamp(26px,3vw,34px);line-height:1.05}.dialogue-detail-meta{display:flex;flex-wrap:wrap;gap:6px 10px;margin:0;color:var(--muted);font-size:15px;line-height:1.25}.dialogue-detail-meta span+span:before{content:"·";margin-right:10px;color:#1a191842}.dialogue-detail-level{color:#47aa79;font-weight:760}.dialogue-detail-loading{display:grid;gap:8px;border-top:1px solid var(--line);padding:22px 0}.dialogue-detail-loading p{margin:0;color:var(--muted);font-size:15px}.dialogue-detail-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:560px}.dialogue-detail-options .choice{min-height:42px;border-radius:10px;font-size:14px}.dialogue-detail-options .role-choice{grid-template-columns:auto minmax(0,1fr);align-items:center;justify-content:start;gap:10px;min-height:52px;text-align:left}.role-choice-avatar{display:grid;width:34px;height:34px;place-items:center;overflow:hidden;border-radius:50%;color:var(--ink);background:#ffffffb8;font-size:13px;font-weight:820}.role-choice-avatar img{width:100%;height:100%;object-fit:cover}.role-choice strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dialogue-detail-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}.dialogue-detail-actions .secondary-action{min-height:38px;border-radius:999px;padding:0 15px;color:var(--accent-dark);background:#ffebe0b3;font-size:14px}.dialogue-detail-start{display:inline-flex;width:100%;min-height:54px;align-items:center;justify-content:center;gap:10px;border:0;border-radius:999px;color:#fff;background:var(--accent);font-size:17px;font-weight:850;box-shadow:0 14px 32px #e8622a29}.dialogue-detail-start:hover:not(:disabled){background:var(--accent-dark)}.dialogue-detail-start:disabled{color:#1a19186b;background:#1a19181f;box-shadow:none}.modal-preview-section{display:grid;gap:13px;border-top:1px solid var(--line);margin:8px -30px -30px;padding:22px 30px 28px}.modal-preview-kicker{margin:0;color:#1a19186b;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:12px;font-weight:700;letter-spacing:.16em}.modal-preview-lines{gap:16px}.modal-preview-lines .preview-line{border:0;border-radius:0;padding:0;background:transparent}.modal-preview-lines .preview-line.active{border-color:transparent}.modal-preview-lines .preview-line p{color:#1a1918c7;font-size:16px;font-weight:690;line-height:1.34}.modal-preview-lines .preview-line small{color:#1a191866;font-size:14px}.line-meta,.line-meta.light{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-height:24px}.line-meta span{color:#ffffff7a;font-size:10px;font-weight:850;text-transform:uppercase}.line-meta.light span{color:var(--muted)}.line-meta button{min-height:24px;border:0;border-radius:999px;padding:0 9px;color:#ffffffd6;background:#ffffff1f;font-size:11px;font-weight:760}.line-meta.light button{color:var(--accent-dark);background:#e8622a1c}.practice-screen{position:relative;width:min(860px,100%);min-height:calc(100vh - 128px);margin:0 auto;padding:18px 18px 310px;overflow:hidden;border-radius:8px;color:#fff;background:var(--dark);box-shadow:0 24px 64px #11100f47}.practice-top{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:12px;align-items:center;margin-bottom:16px}.practice-top h1{margin-bottom:4px;overflow-wrap:anywhere;text-align:center;font-size:24px;line-height:1.12}.practice-top span{display:block;color:#ffffff85;text-align:center;font-size:13px}.tiny-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:18px}.tiny-stats div,.practice-audio,.practice-input{border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#ffffff12}.tiny-stats div{min-height:48px;padding:8px}.tiny-stats strong,.tiny-stats span{display:block}.tiny-stats strong{font-size:15px}.tiny-stats span{margin-top:5px;color:#ffffff7a;font-size:10px}.practice-audio{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;margin-bottom:18px;padding:10px}.practice-audio audio{display:none}.practice-audio button{min-height:36px;border:0;border-radius:999px;padding:0 14px;color:#fff;background:var(--accent);font-size:13px;font-weight:820}.practice-audio span{min-width:0;color:#ffffff94;font-size:12px}.lyrics{display:grid;gap:16px;padding-bottom:24px}.lyric-line{position:relative;max-width:720px;color:#ffffff5c}.lyric-line.context-role{opacity:.72}.lyric-line.done{opacity:.56}.lyric-line.locked{opacity:.36}.lyric-line.current{color:#fff;opacity:1}.lyric-line p{margin:2px 0 0;overflow-wrap:anywhere;font-size:23px;font-weight:740;line-height:1.24}.lyric-line.current p{font-size:36px;line-height:1.12}.native-text{display:block;margin-top:8px;color:#ffffff94;font-size:14px;line-height:1.4}.practice-input{position:absolute;right:18px;bottom:20px;left:18px;display:grid;gap:12px;padding:14px;background:#171615f0;box-shadow:0 20px 54px #0000006b}.input-head,.textarea-row,.live-check{display:flex;align-items:center}.input-head{justify-content:space-between;gap:14px}.input-head span,.input-head strong{display:block}.input-head span{color:#ffffff80;font-size:11px;font-weight:760;text-transform:uppercase}.input-head strong{margin-top:2px;color:#fffffff0;font-size:15px}.live-check{flex-wrap:wrap;justify-content:flex-end;gap:7px}.live-check span{min-height:24px;border-radius:999px;padding:5px 9px;color:#ffffffbd;background:#ffffff14;font-size:11px;font-weight:760}.target-feedback{max-height:104px;overflow:auto;border-radius:8px;padding:13px;color:#ffffff6b;background:#ffffff12;font-size:22px;font-weight:760;line-height:1.45}.feedback-char{border-radius:4px}.feedback-char.correct{color:#d9f7e8;background:#27855c3d}.feedback-char.wrong{color:#ffd9d5;background:#b43a2f4d}.feedback-char.pending{color:#ffffff59}.feedback-char.extra{color:#fff;background:#e8622a5c}.textarea-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:stretch}.practice-input textarea{width:100%;min-width:0;min-height:104px;resize:vertical;border:0;border-radius:8px;padding:14px 15px;color:#fff;background:#ffffff1a;font-size:21px;line-height:1.35;outline:none}.practice-input textarea::placeholder{color:#ffffff57}.practice-input textarea:focus{box-shadow:inset 0 0 0 2px var(--accent)}.practice-input textarea:disabled{opacity:.58}.go-button,.voice-button{min-height:52px;border:0;border-radius:8px;color:#fff;background:var(--accent);font-weight:850}.go-button{align-self:end;width:60px}.go-button:disabled,.voice-button:disabled{opacity:.42}.voice-button{align-self:end;padding:0 14px}.voice-message{position:absolute;right:30px;bottom:86px;left:30px;color:#ffffffb8;font-size:13px}.nav-confirm-overlay{position:fixed;z-index:1100;inset:0;display:flex;align-items:center;justify-content:center;background:#14100c73;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.nav-confirm-modal{max-width:360px;padding:28px 24px 20px;border-radius:18px;background:#fff;box-shadow:0 20px 48px #1e140a38;text-align:center}.nav-confirm-modal h3{margin:0 0 8px;font-size:18px}.nav-confirm-modal p{margin:0 0 20px;color:#746f69;font-size:14px;line-height:1.5}.nav-confirm-actions{display:flex;gap:10px;justify-content:center}.nav-confirm-stay,.nav-confirm-leave{padding:10px 20px;border:0;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer}.nav-confirm-stay{background:#f0ede8;color:#4f4a44}.nav-confirm-leave{background:#e8443a;color:#fff}.completion-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:#17181f80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:completion-fade-in .3s ease}@keyframes completion-fade-in{0%{opacity:0}to{opacity:1}}.completion-modal{position:relative;width:90%;max-width:420px;background:var(--surface, #fff);border-radius:24px;box-shadow:0 20px 60px #0003;overflow:hidden;animation:completion-pop .4s cubic-bezier(.34,1.56,.64,1)}@keyframes completion-pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.confetti-container{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}.confetti-piece{position:absolute;top:-10px;width:8px;height:12px;border-radius:2px;animation:confetti-fall linear forwards}@keyframes confetti-fall{0%{transform:translateY(-10px) rotate(0);opacity:1}to{transform:translateY(500px) rotate(360deg);opacity:0}}.completion-content{position:relative;z-index:2;padding:36px 28px 28px;text-align:center}.completion-celebrate{font-size:48px;line-height:1;margin-bottom:12px;animation:completion-bounce .6s ease .2s both}@keyframes completion-bounce{0%{transform:scale(0)}60%{transform:scale(1.2)}to{transform:scale(1)}}.completion-title{font-family:var(--display-font, "Bricolage Grotesque", sans-serif);font-size:24px;font-weight:700;color:var(--ink, #17181f);margin:0 0 4px}.completion-subtitle{font-size:14px;color:var(--soft, #8a847e);margin:0 0 24px}.completion-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:28px}.completion-stat{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:64px}.completion-stat strong{font-size:22px;font-weight:700;color:var(--accent-dark, #8b6b3d);font-family:var(--mono-font, "DM Mono", monospace)}.completion-stat span{font-size:11px;color:var(--soft, #8a847e);text-transform:uppercase;letter-spacing:.03em}.completion-actions{display:flex;flex-direction:column;gap:10px;align-items:center}.completion-btn{font-size:14px;font-weight:600;border:none;border-radius:12px;padding:12px 32px;cursor:pointer;transition:all .2s ease;font-family:inherit;width:100%;max-width:280px}.completion-btn.primary{background:var(--accent, #b8956a);color:#fff}.completion-btn.primary:hover{background:var(--accent-dark, #8b6b3d);transform:translateY(-1px)}.completion-btn.secondary{background:transparent;color:var(--soft, #8a847e);border:1px solid var(--line-strong, rgba(23, 24, 31, .15))}.completion-btn.secondary:hover{background:var(--line, rgba(23, 24, 31, .05));color:var(--ink, #17181f)}.completion-no-next{font-size:13px;color:var(--soft, #8a847e);margin:0 0 4px}.completion-close{position:absolute;top:12px;right:12px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:transparent;color:var(--soft, #8a847e);font-size:20px;cursor:pointer;transition:all .15s ease;z-index:3}.completion-close:hover{background:var(--line, rgba(23, 24, 31, .08));color:var(--ink, #17181f)}.stats-screen{max-width:920px;margin:0 auto}.stats-header{max-width:720px;margin-bottom:20px}.stats-summary{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;align-items:center;padding:16px;margin-bottom:14px}.score-ring{display:grid;width:80px;height:80px;place-items:center;border-radius:50%;color:var(--accent-dark);background:radial-gradient(circle,var(--surface) 54%,transparent 55%),conic-gradient(var(--accent) 0 76%,rgba(26,25,24,.1) 76% 100%);font-size:27px;font-weight:880}.stats-summary strong,.stats-summary span{display:block}.stats-summary strong{margin-bottom:6px;font-size:19px}.stats-summary span{color:var(--muted);font-size:14px;line-height:1.4}.stats-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;margin-bottom:14px;padding:4px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.stats-tabs button{min-height:34px;border:0;border-radius:6px;color:var(--muted);background:transparent;font-weight:760}.stats-tabs button[aria-pressed=true]{color:#fff;background:var(--ink)}.trend-card{padding:16px;margin-bottom:14px}.trend-card>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.trend-card h2{margin:0;font-size:16px}.trend-card>div:first-child span{color:var(--accent-dark);font-size:13px;font-weight:850}.bars{display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:8px;height:92px}.bar{min-height:16px;border-radius:999px}.bar.orange{background:var(--accent)}.bar.green{background:var(--green)}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.metric{min-height:82px;padding:15px}.metric strong{display:block;font-size:24px}.metric span{display:block;margin-top:8px;color:var(--muted);font-size:12px}.panel{padding:8px 0;margin-bottom:14px}.panel h2{margin:0;padding:12px 16px 8px;font-size:17px}.history-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;min-height:62px;padding:12px 16px;border-top:1px solid var(--line)}.history-row strong,.history-row span{display:block}.history-row strong{margin-bottom:4px;font-size:14px}.history-row span{color:var(--muted);font-size:12px}.history-row>span{display:inline-flex;align-items:center;min-height:28px;border-radius:999px;padding:0 10px;color:var(--accent-dark);background:#e8622a1a;font-weight:800}.empty-state{margin:0;padding:12px 16px 16px;color:var(--muted);font-size:14px}@media(max-width:860px){.shell{width:min(100% - 24px,760px);padding-top:16px}.app-header{align-items:flex-start}.choose-layout{grid-template-columns:1fr}.setup-card{position:static}.step-panel h1,.stats-header h1{font-size:38px}.option-grid.four,.option-grid.two,.difficulty-grid,.metric-grid{grid-template-columns:1fr}.preview-top{grid-template-columns:42px minmax(0,1fr)}.preview-top .primary-action{grid-column:1 / -1}.practice-screen{min-height:calc(100vh - 96px);padding:14px 12px 340px}.practice-top{grid-template-columns:40px minmax(0,1fr) 40px}.tiny-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.lyric-line p{font-size:20px}.lyric-line.current p{font-size:29px}.practice-input{right:12px;bottom:12px;left:12px}.textarea-row{grid-template-columns:1fr}.go-button,.voice-button{width:100%}.stats-summary{grid-template-columns:1fr}}@media(max-width:520px){.shell{width:min(100% - 18px,520px)}.app-header{flex-direction:column}.app-header nav{width:100%}.app-header nav button{flex:1}.step-panel h1,.stats-header h1{font-size:32px}.dialogue-card strong{font-size:18px}.practice-screen{padding-bottom:370px}.input-head{align-items:flex-start;flex-direction:column}.live-check{justify-content:flex-start}.target-feedback{font-size:19px}.practice-input textarea{font-size:18px}}.app-header{position:sticky;top:0;z-index:20;height:72px;margin:0;padding:0 47px;border-bottom:1px solid var(--line);background:#f4f3efeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand-name{font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:34px;line-height:1;font-weight:700;letter-spacing:0}.app-header nav{display:flex;align-items:center;gap:12px;padding:0;border:0;background:transparent}.demo-switch{display:inline-flex;align-items:center;gap:4px;height:50px;padding:5px 9px;border:1px solid var(--line);border-radius:14px;background:#ffffff75}.demo-switch>span{padding:0 8px 0 2px;color:var(--muted);font-family:DM Mono,ui-monospace,monospace;font-size:15px}.demo-switch button,.app-header nav button{min-height:0}.demo-switch button{height:34px;border:0;border-radius:7px;padding:0 13px;color:var(--muted);background:transparent;font-size:19px;font-weight:600}.demo-switch button[aria-pressed=true]{color:var(--page);background:var(--ink)}.nav-progress,.icon-button{border:0;border-radius:9px;color:var(--muted);background:transparent}.icon-select{height:36px;border:1px solid var(--border);border-radius:9px;background:#fff;color:var(--ink);font-size:13px;font-weight:600;cursor:pointer;padding:0 6px;font-family:inherit}.icon-select:hover{border-color:var(--accent);color:var(--accent)}.icon-select:focus{outline:none;border-color:var(--accent)}.nav-progress{display:inline-flex;align-items:center;gap:9px;padding:0 10px;font-size:22px;font-weight:600}.nav-progress[aria-current=true]{color:var(--ink);background:transparent}.mini-bars{display:inline-flex;align-items:end;gap:3px;height:18px}.mini-bars i{display:block;width:2px;border-radius:999px;background:currentColor}.mini-bars i:nth-child(1){height:7px}.mini-bars i:nth-child(2){height:15px}.mini-bars i:nth-child(3){height:11px}.icon-button{display:grid;width:34px;height:34px;place-items:center;padding:0;font-size:25px}.choose-screen{width:min(100%,2048px);min-height:calc(100vh - 72px);margin:0 auto;padding:97px 47px 128px}.choose-layout{display:grid;grid-template-columns:220px minmax(0,1042px) 240px;gap:64px;align-items:start;justify-content:center}.chooser-left,.chooser-right,.choose-main{min-width:0}.panel-kicker{margin:0 0 28px;color:var(--muted);font-family:DM Mono,ui-monospace,monospace;font-size:17px;font-weight:500;letter-spacing:.14em}.how-it-works ol{display:grid;gap:27px;margin:0;padding:0;list-style:none}.how-it-works li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:20px;align-items:center}.how-it-works li span{display:grid;width:34px;height:34px;place-items:center;border-radius:999px;color:var(--muted);background:#edeceab8;font-family:DM Mono,ui-monospace,monospace;font-size:16px}.how-it-works li p,.popular-pairs p,.side-note p,.side-stack p{margin:0;color:var(--muted);font-size:22px;line-height:1.35}.side-stack{display:grid;gap:16px}.side-stack .panel-kicker{margin:0}.side-stat strong{display:block;color:var(--ink);font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:48px;line-height:1}.side-stat span{color:var(--muted);font-size:13px}.pair-preview{display:flex;align-items:center;gap:10px;font-size:26px}.pair-preview b{color:var(--muted);font-size:18px}.side-selection{color:var(--ink)!important;font-size:16px!important;font-weight:600}.popular-pairs .panel-kicker,.side-note .panel-kicker{margin-bottom:26px}.popular-pairs{padding-top:1px}.popular-pairs p:not(.panel-kicker){margin-bottom:20px;white-space:nowrap}.step-panel h1{max-width:none;margin-bottom:28px;color:var(--ink);font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:72px;font-weight:700;line-height:.96;letter-spacing:0}.step-panel p{max-width:none;margin-bottom:57px;color:var(--muted);font-size:25px;line-height:1.3}.language-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px}.language-panel .panel-kicker{margin-bottom:23px}.language-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.language-card{display:grid;grid-template-columns:40px minmax(0,1fr);gap:17px;align-items:center;min-height:96px;border:1px solid rgba(26,25,24,.1);border-radius:18px;padding:18px 22px;color:var(--ink);background:#fff;text-align:left;box-shadow:0 1px 2px #1a19180d;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.language-card:hover{border-color:#1a191847;box-shadow:0 8px 22px #1a191814;transform:translateY(-1px)}.language-card.unavailable{opacity:1}.language-card.unavailable:hover{border-color:#1a19181a;box-shadow:0 1px 2px #1a19180d;transform:none}.language-flag{font-size:28px;line-height:1}.language-card strong,.language-card small{display:block}.language-card strong{color:var(--ink);font-size:22px;line-height:1.08}.language-card small{margin-top:5px;color:var(--muted);font-size:18px;line-height:1.1}.scene-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.dialogue-card{border-radius:18px;padding:20px;background:#fff}.scene-grid .dialogue-card{min-height:150px}.scene-emoji{display:block;margin-bottom:12px;font-size:34px}.difficulty-grid .dialogue-card{position:relative;min-height:104px;padding-left:38px}.difficulty-stripe{position:absolute;top:18px;bottom:18px;left:18px;width:4px;border-radius:999px}.dialogue-tile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ui-card{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(26,25,24,.12);border-radius:16px;background:#ffffffd1;box-shadow:0 2px 3px #1a191808}.dialogue-tile{transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.dialogue-tile:hover,.dialogue-tile:focus-within{border-color:#e8622a73;box-shadow:0 18px 42px #1a19181a;transform:translateY(-2px)}.dialogue-tile.active{border-color:#e8622ab8;box-shadow:0 22px 58px #b8401821}.dialogue-tile-select{position:relative;display:grid;width:100%;min-height:128px;align-content:start;gap:6px;border:0;padding:18px 20px 52px;color:var(--ink);background:transparent;text-align:left}.dialogue-tile-kicker{color:var(--accent-dark);font-size:13px;font-weight:850;letter-spacing:.04em;text-transform:uppercase}.dialogue-tile-select strong{max-width:100%;overflow-wrap:anywhere;color:var(--ink);font-size:24px;font-weight:850;line-height:1.12}.dialogue-tile-select span:not(.dialogue-tile-kicker):not(.dialogue-hover-action),.dialogue-tile-select small{color:var(--muted);font-size:14px;line-height:1.35}.dialogue-hover-action{position:absolute;right:22px;bottom:16px;min-height:32px;border:1px solid rgba(232,98,42,.22);border-radius:999px;padding:6px 12px 0;color:var(--accent-dark);background:#ffebe0b8;font-size:13px;font-weight:850;opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease}.dialogue-tile:hover .dialogue-hover-action,.dialogue-tile:focus-within .dialogue-hover-action,.dialogue-tile.active .dialogue-hover-action{opacity:1;transform:translateY(0)}.dialogue-inline-setup{display:grid;gap:14px;border-top:1px solid rgba(26,25,24,.08);padding:16px 20px 20px;background:#fffcf8cc;animation:choiceStageIn .18s ease-out both}.dialogue-inline-setup .setup-title{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px}.dialogue-inline-setup .setup-title p,.dialogue-inline-setup .audio-status,.dialogue-inline-setup .setup-warning{font-size:14px}.dialogue-inline-setup .setup-label{margin-bottom:8px;font-size:12px}.dialogue-inline-setup .role-grid,.dialogue-inline-setup .mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dialogue-inline-setup .choice{min-height:48px;border-radius:10px;font-size:16px}.dialogue-inline-setup .secondary-action{min-height:42px;border-radius:10px;font-size:15px}.dialogue-inline-setup .eyebrow{color:var(--accent-dark);font-size:13px;font-weight:850}.setup-control-group{min-width:0}.setup-actions-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.history-add-button{display:inline-flex;align-items:center;gap:8px;min-height:42px;border:0;border-radius:999px;padding:0 18px;color:var(--page);background:var(--ink);font-size:14px;font-weight:700}.chooser-action-bar{position:fixed;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--line);padding:16px max(20px,calc((100vw - 1280px)/2 + 40px));background:#f4f3eff2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.chooser-action-bar p,.chooser-action-bar span{margin:0}.chooser-action-bar p{color:var(--ink);font-size:15px;font-weight:600}.chooser-action-bar p.muted{color:var(--muted)}.chooser-action-bar div>span{display:block;margin-top:3px;color:var(--muted);font-size:12px}.chooser-action-bar button{display:inline-flex;align-items:center;gap:6px;min-height:44px;border:0;border-radius:999px;padding:0 22px;color:var(--page);background:var(--ink);font-size:14px;font-weight:800}.chooser-action-bar button:disabled{color:var(--muted);background:var(--line)}.chooser-right .setup-card{position:sticky;top:96px;box-shadow:none}.preview-screen,.stats-screen{padding-top:48px}.practice-screen{margin-top:32px}@media(max-width:1180px){.choose-layout{grid-template-columns:180px minmax(0,1fr);gap:36px}.chooser-right{display:none}.step-panel h1{font-size:58px}.language-duo{gap:28px}}@media(max-width:860px){.app-header{height:auto;min-height:64px;padding:14px 18px}.app-header nav{gap:6px}.demo-switch{height:42px}.demo-switch button{height:30px;font-size:13px}.demo-switch>span,.nav-progress{display:none}.choose-screen{padding:36px 18px 118px}.choose-layout{grid-template-columns:1fr}.chooser-left{display:none}.step-panel h1{font-size:42px;margin-bottom:14px}.step-panel p{margin-bottom:28px;font-size:17px}.language-duo,.language-card-grid,.scene-grid{grid-template-columns:1fr}.chooser-action-bar{padding:13px 16px}}:root{--page: #faf7f2;--surface: #ffffff;--surface-strong: #ffffff;--ink: #3d3229;--muted: #6b5d4d;--soft: #9a8e7e;--line: rgba(61, 50, 41, .08);--line-strong: rgba(61, 50, 41, .16);--accent: #b8956a;--accent-dark: #9a7a52;--green: #7a9e6b;--blue: #6b8db8;--danger: #b4624a;--shadow: 0 6px 24px rgba(61, 50, 41, .08)}body{background:linear-gradient(rgba(23,24,31,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(23,24,31,.035) 1px,transparent 1px),var(--page);background-size:28px 28px}.app-header{border-bottom:2px solid rgba(23,24,31,.1);background:#f7f8fbe6}.dialogue-library-screen{min-height:calc(100vh - 56px);padding:38px max(20px,calc((100vw - 1280px)/2 + 40px)) 64px}.dialogue-library{display:grid;gap:28px;max-width:1180px;margin:0 auto}.dialogue-library-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,430px);gap:26px;align-items:end}.dialogue-library-hero h1{max-width:680px;margin:0 0 12px;color:var(--ink);font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:52px;font-weight:700;line-height:.98;letter-spacing:0}.dialogue-library-hero p{max-width:520px;margin:0;color:var(--muted);font-size:17px;line-height:1.55}.language-toolbar{display:grid;gap:10px;justify-items:stretch;border:2px solid rgba(23,24,31,.1);border-radius:18px;padding:12px;background:#ffffffd1;box-shadow:0 14px 38px #252c4414}.language-toolbar .selected-language-pair{margin:0;border:0;padding:4px;background:transparent;box-shadow:none}.language-change-button,.language-save-button{position:sticky;bottom:-1px;z-index:2;min-height:44px;border:0;border-radius:12px;color:#fff;background:var(--ink);font-size:14px;font-weight:850}.language-change-button:hover,.language-save-button:hover{background:var(--accent)}.library-content-grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px;align-items:start}.library-sidebar{display:grid;gap:18px;min-width:0}.library-filter-panel,.library-recent-panel{border:2px solid rgba(23,24,31,.1);border-radius:18px;padding:16px;background:#fffc;box-shadow:0 10px 28px #252c4412}.library-filter-panel .panel-kicker,.library-recent-panel .panel-kicker{margin:0 0 12px;color:var(--ink);font-size:11px}.scene-chip-list{display:grid;gap:8px}.scene-chip{display:flex;min-height:42px;align-items:center;justify-content:flex-start;gap:8px;border:1px solid rgba(23,24,31,.1);border-radius:12px;padding:0 12px;color:var(--ink);background:#fff;font-size:14px;font-weight:780;text-align:left}.scene-chip small{margin-left:auto;color:var(--soft);font-size:12px}.scene-chip.active{border-color:var(--ink);color:#fff;background:var(--ink)}.scene-chip.active small{color:#ffffffb8}.history-stack.compact{gap:8px}.history-stack.compact .history-card{border:1px solid rgba(23,24,31,.09);border-radius:12px;padding:10px;background:#fff;box-shadow:none}.library-dialogues{min-width:0}.dialogue-list-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.dialogue-list-header p,.dialogue-list-header span{margin:0}.dialogue-list-header p{color:var(--ink);font-size:20px;font-weight:850}.dialogue-list-header span{color:var(--muted);font-family:DM Mono,ui-monospace,monospace;font-size:12px;font-weight:500}.dialogue-tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.dialogue-tile{border:2px solid rgba(23,24,31,.1);border-radius:18px;background:#fff;box-shadow:0 10px 30px #252c4414}.dialogue-tile-select{grid-template-columns:104px minmax(0,1fr);min-height:148px;align-content:stretch;gap:14px;padding:14px 16px 46px 14px}.dialogue-cover-slot{display:grid;width:104px;min-height:120px;place-items:center;overflow:hidden;border:2px solid rgba(23,24,31,.12);border-radius:14px;background:linear-gradient(135deg,rgba(255,103,71,.18),transparent 48%),linear-gradient(45deg,rgba(37,99,235,.14),transparent 52%),#eef3ff}.dialogue-cover-slot img{width:100%;height:100%;object-fit:cover}.dialogue-cover-slot i{color:#17181f9e;font-size:36px;font-style:normal}.dialogue-tile-body{display:grid;min-width:0;align-content:start;gap:6px}.dialogue-tile-select strong{font-size:24px;line-height:1.08}.dialogue-hover-action{right:16px;bottom:12px;border-radius:10px;padding:6px 10px;color:var(--ink);background:#ffe85f}.language-modal-backdrop{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;background:#17181f61;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.language-modal{position:relative;display:grid;width:min(100%,880px);max-height:min(90vh,820px);gap:18px;overflow:auto;border:3px solid var(--ink);border-radius:22px;padding:26px;background:#fff;box-shadow:10px 10px #17181f29,0 30px 80px #17181f38}.language-modal-close{position:absolute;top:14px;right:14px;display:grid;width:36px;height:36px;place-items:center;border:2px solid var(--ink);border-radius:999px;color:var(--ink);background:#fff;font-size:22px;line-height:1}.language-modal-header{padding-right:42px}.language-modal-header h2{margin:0 0 8px;color:var(--ink);font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:38px;line-height:1}.language-modal-header p{max-width:580px;margin:0;color:var(--muted);font-size:15px;line-height:1.5}.modal-language-duo{gap:16px}.language-modal .language-card{min-height:78px;border-radius:14px;padding:13px 15px}.language-error{margin:0;color:var(--danger);font-size:14px;font-weight:800}body{font-family:Plus Jakarta Sans,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.shell{width:100%;margin:0;padding:0}.app-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;flex-direction:row;gap:12px;height:56px;min-height:56px;margin:0;border-bottom:1px solid var(--line);padding:0 max(20px,calc((100vw - 1280px)/2 + 40px));background:#f4f3efe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.brand-lockup{min-height:40px}.brand-name{font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:22px;line-height:1;font-weight:700;letter-spacing:0}.app-header nav{display:flex;align-items:center;width:auto;gap:2px;border:0;padding:0;background:transparent}.app-header nav button{flex:initial;min-height:32px;border:0;border-radius:8px;color:var(--muted);background:transparent;font-size:12px;font-weight:600}.nav-progress{display:inline-flex;align-items:center;gap:6px;padding:0 12px}.nav-progress[aria-current=true]{color:var(--ink);background:var(--line)}.mini-bars{height:14px;gap:2px}.mini-bars i{width:2px}.mini-bars i:nth-child(1){height:6px}.mini-bars i:nth-child(2){height:13px}.mini-bars i:nth-child(3){height:9px}.icon-button{display:grid;width:32px;height:32px;place-items:center;padding:0;font-size:17px}.choose-screen{width:min(100%,1280px);min-height:calc(100vh - 56px);margin:0 auto;padding:40px 20px 128px}.choose-layout{display:grid;grid-template-columns:220px minmax(0,1fr) 240px;gap:48px;align-items:start;justify-content:initial}.panel-kicker{margin:0 0 16px;color:var(--muted);font-family:DM Mono,ui-monospace,monospace;font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}.how-it-works ol{gap:16px}.how-it-works li{grid-template-columns:20px minmax(0,1fr);gap:12px;align-items:start}.how-it-works li span{width:20px;height:20px;margin-top:2px;font-size:10px}.how-it-works li p,.popular-pairs p,.side-note p,.side-stack p{font-size:12px;line-height:1.5}.side-stack{gap:28px}.side-stat strong{font-size:48px}.side-stat span{font-size:12px}.pair-preview{gap:8px;font-size:24px}.pair-preview b{font-size:14px}.side-selection{font-size:14px!important}.popular-pairs .panel-kicker,.side-note .panel-kicker{margin-bottom:16px}.popular-pairs p:not(.panel-kicker){margin-bottom:10px;white-space:nowrap}.step-panel h1{margin-bottom:10px;color:var(--ink);font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:44px;font-weight:700;line-height:1.12;letter-spacing:0}.step-panel p{margin-bottom:32px;color:var(--muted);font-size:14px;line-height:1.5}.selected-language-pair{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;margin-bottom:28px;border:1px solid rgba(26,25,24,.1);border-radius:14px;padding:14px 16px;background:#ffffffc7}.selected-language-pair-item{display:grid;gap:8px;min-width:0}.selected-language-pair-item.target{text-align:right}.selected-language-pair-label{color:var(--muted);font-family:DM Mono,ui-monospace,monospace;font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}.selected-language-pair-value{display:flex;align-items:center;gap:10px;min-width:0}.selected-language-pair-item.target .selected-language-pair-value{justify-content:flex-end}.selected-language-pair-flag{flex:none;font-size:24px;line-height:1}.selected-language-pair-value strong,.selected-language-pair-value small{display:block}.selected-language-pair-value strong{overflow-wrap:anywhere;color:var(--ink);font-size:16px;line-height:1.15}.selected-language-pair-value small{margin-top:2px;color:var(--muted);font-size:12px;line-height:1.2}.selected-language-pair-arrow{color:var(--accent);font-size:24px;font-weight:800;line-height:1}.language-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.language-panel .panel-kicker{margin-bottom:12px}.language-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.language-card{grid-template-columns:28px minmax(0,1fr);gap:10px;min-height:72px;border-radius:12px;padding:12px;box-shadow:none}.language-card:hover{box-shadow:0 2px 10px #1a19180f}.language-card.active{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.language-flag{font-size:20px}.language-card strong{font-size:12px;line-height:1.18}.language-card small{margin-top:2px;font-size:10px;line-height:1.2}.scene-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.choose-screen .dialogue-card{border-radius:16px;padding:16px;background:#fff;box-shadow:none}.choose-screen .dialogue-card:hover{border-color:#1a19184d;box-shadow:0 2px 12px #1a19180f}.choose-screen .dialogue-card.active{border-color:var(--ink);background:#edecea4d;box-shadow:0 0 0 1px var(--ink)}.choose-screen .dialogue-card strong{font-size:14px;line-height:1.25}.choose-screen .dialogue-card span,.choose-screen .dialogue-card small{font-size:12px;line-height:1.45}.staged-step-panel{display:grid;gap:28px}.choice-summary-stack{display:flex;flex-wrap:wrap;gap:10px;min-height:0}.choice-summary-card{display:grid;gap:3px;min-width:150px;border:1px solid rgba(26,25,24,.08);border-radius:14px;padding:11px 14px;background:#ffffffb8;box-shadow:0 1px 2px #1a19180a;font:inherit;text-align:left}button.choice-summary-card{cursor:pointer;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}button.choice-summary-card:hover,button.choice-summary-card:focus-visible{border-color:#e8622a57;box-shadow:0 12px 28px #1a191814;transform:translateY(-1px)}.choice-summary-card span,.choice-summary-card small{color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.02em}.choice-summary-card strong{color:var(--ink);font-size:15px;line-height:1.2}.choice-summary-card small{font-weight:600;letter-spacing:0}.choice-stage{display:grid;gap:18px;animation:choiceStageIn .18s ease-out both}.choice-stage h1{margin:0}.choice-stage>p{margin:-8px 0 8px}@keyframes choiceStageIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.scene-grid .dialogue-card{min-height:auto}.scene-emoji{margin-bottom:12px;font-size:30px}.difficulty-grid{grid-template-columns:1fr;gap:12px}.difficulty-grid .dialogue-card{min-height:82px;padding-left:34px}.difficulty-stripe{top:16px;bottom:16px;left:16px}.dialogue-list{gap:12px}.chooser-action-bar{padding:16px max(20px,calc((100vw - 1280px)/2 + 40px))}.chooser-action-left,.chooser-action-copy{min-width:0}.chooser-action-copy{flex:1;text-align:center}.chooser-action-bar p{font-size:14px}.chooser-action-bar .chooser-next-button,.chooser-action-bar .chooser-before-button{min-height:40px;padding:0 20px;font-size:14px}.chooser-action-bar .chooser-before-button{gap:5px;border:1px solid rgba(26,25,24,.12);color:var(--ink);background:#ffffffb8}.chooser-action-bar .chooser-before-button:hover{border-color:#1a19183d}.chooser-action-bar .chooser-before-button:disabled{color:var(--muted);background:#edeceab8}@media(min-width:1024px){.choose-screen{padding:56px 40px 128px}}@media(max-width:1180px){.choose-layout{grid-template-columns:220px minmax(0,1fr) 240px;gap:36px}.chooser-right{display:block}.step-panel h1{font-size:44px}}@media(max-width:1023px){.choose-layout{grid-template-columns:1fr}.chooser-left,.chooser-right{display:none}.dialogue-tile-grid{grid-template-columns:1fr}.choose-screen{padding:40px 20px 118px}}@media(max-width:860px){.app-header{height:56px;min-height:56px;padding:0 20px}.nav-progress{display:none}.step-panel h1{margin-bottom:10px;font-size:32px}.step-panel p{margin-bottom:28px;font-size:14px}.language-duo{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.selected-language-pair{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;padding:12px}.selected-language-pair-label{font-size:9px;letter-spacing:.1em}.selected-language-pair-value{gap:7px}.selected-language-pair-flag{font-size:18px}.selected-language-pair-value strong{font-size:13px}.selected-language-pair-value small{font-size:10px}.selected-language-pair-arrow{font-size:18px}.language-card-grid{grid-template-columns:1fr}.scene-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dialogue-tile-select{min-height:120px;padding:16px 16px 50px}.dialogue-tile-select strong{font-size:21px}.dialogue-inline-setup{padding:16px}.dialogue-inline-setup .role-grid,.dialogue-inline-setup .mode-grid{gap:10px}.dialogue-inline-setup .choice{min-height:46px;font-size:15px}.dialogue-inline-setup .secondary-action{min-height:42px;font-size:14px}.preview-modal-backdrop{padding:12px}.preview-modal .preview-screen{padding:24px 16px}.chooser-action-bar{padding:13px 16px}}.language-save-button{position:sticky;bottom:-1px;z-index:2}.home-layout.two-column{grid-template-columns:240px minmax(0,1fr)}.course-card-fav{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#ffffffe6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--soft);cursor:pointer;transition:color .15s,background .15s;z-index:1}.course-card-fav:hover{background:#fff;color:var(--accent)}.course-card-fav.active{color:var(--accent)}.progress-view{display:flex;flex-direction:column;gap:20px}.progress-header{display:flex;align-items:flex-start;justify-content:space-between}.progress-title{font-family:Bricolage Grotesque,sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:0}.progress-subtitle{font-size:14px;color:var(--muted);margin:4px 0 0}.progress-time-filter{padding:6px 12px;border:1px solid var(--line-strong);border-radius:8px;font-size:13px;font-family:inherit;background:var(--surface);color:var(--ink);cursor:pointer}.progress-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.progress-kpi-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:20px 12px;background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.progress-kpi-icon{color:var(--accent);margin-bottom:4px}.progress-kpi-value{font-family:Bricolage Grotesque,sans-serif;font-size:28px;font-weight:700;color:var(--ink)}.progress-kpi-label{font-size:12px;color:var(--muted)}.progress-card{background:var(--surface);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.progress-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.progress-card-title{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:600;color:var(--ink);margin:0 0 16px}.progress-card-header .progress-card-title{margin-bottom:0}.progress-trend-toggle{display:flex;gap:4px}.progress-trend-toggle button{padding:4px 12px;border:none;background:var(--cafe-cream);border-radius:8px;font-size:12px;font-weight:500;color:var(--soft);cursor:pointer;font-family:inherit}.progress-trend-toggle button.active{background:var(--accent);color:#fff}.progress-trend-chart{width:100%}.progress-trend-svg{width:100%;height:auto}.progress-empty-chart{padding:40px;text-align:center;font-size:14px;color:var(--soft)}.progress-bottom-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.progress-goal-display{margin:8px 0 4px}.progress-goal-current{font-family:Bricolage Grotesque,sans-serif;font-size:28px;font-weight:700;color:var(--accent)}.progress-goal-target{font-size:14px;color:var(--soft)}.progress-goal-days{font-size:12px;color:var(--muted);margin:0 0 12px}.progress-streak-calendar{display:flex;justify-content:space-between;margin-bottom:12px}.progress-streak-day{display:flex;flex-direction:column;align-items:center;gap:4px}.progress-streak-circle{width:28px;height:28px;border-radius:50%;border:2px solid var(--cafe-tan);display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff}.progress-streak-circle.completed{background:var(--accent);border-color:var(--accent)}.progress-streak-label{font-size:10px;color:var(--soft)}.progress-edit-goal,.progress-goal-save,.progress-goal-cancel{font-size:12px;font-weight:500;border:none;cursor:pointer;font-family:inherit;padding:4px 10px;border-radius:8px}.progress-edit-goal{display:flex;align-items:center;gap:4px;background:var(--cafe-cream);color:var(--accent)}.progress-goal-edit{display:flex;align-items:center;gap:6px}.progress-goal-input{width:60px;padding:4px 8px;border:1px solid var(--line-strong);border-radius:6px;font-size:13px;font-family:inherit}.progress-goal-save{background:var(--accent);color:#fff}.progress-goal-cancel{background:var(--cafe-cream);color:var(--muted)}.progress-character-list{display:flex;flex-direction:column;gap:8px}.progress-character-item{display:flex;align-items:center;gap:8px;padding:8px;border-radius:10px;background:var(--cafe-cream)}.progress-character-rank{font-size:14px;font-weight:700;color:var(--accent);width:20px}.progress-character-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover}.progress-character-name{flex:1;font-size:13px;font-weight:500;color:var(--ink)}.progress-character-count{font-size:12px;color:var(--soft)}.progress-empty-text{font-size:13px;color:var(--soft);text-align:center;padding:20px}.progress-recent-list{display:flex;flex-direction:column;gap:6px}.progress-recent-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--cafe-cream);cursor:pointer;transition:background .15s}.progress-recent-item:hover{background:var(--cafe-tan)}.progress-recent-title{flex:1;font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress-recent-date{font-size:11px;color:var(--soft)}.progress-recent-score{font-size:13px;font-weight:600;color:var(--accent)}.progress-recent-play{color:var(--accent)}.progress-story-card .progress-ring-container{margin:12px auto}.progress-story-title{font-size:14px;font-weight:600;color:var(--ink);text-align:center;margin:0}.progress-story-courses{font-size:12px;color:var(--muted);text-align:center;margin:4px 0 12px}.progress-view-courses{display:block;margin:0 auto;padding:8px 20px;background:var(--accent);border:none;border-radius:20px;font-size:13px;font-weight:600;color:#fff;cursor:pointer;font-family:inherit}.progress-view-courses:hover{background:var(--accent-dark)}.favorites-view{display:flex;flex-direction:column;gap:20px}.favorites-header{margin-bottom:4px}.favorites-title{font-family:Bricolage Grotesque,sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:0}.favorites-subtitle{font-size:14px;color:var(--muted);margin:4px 0 0}.favorites-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.favorites-tabs{display:flex;gap:4px}.favorites-tab{padding:6px 16px;border:none;background:var(--cafe-cream);border-radius:10px;font-size:13px;font-weight:500;color:var(--soft);cursor:pointer;font-family:inherit}.favorites-tab.active{background:var(--accent);color:#fff}.favorites-search-wrapper{position:relative;display:flex;align-items:center}.favorites-search-icon{position:absolute;left:10px;color:var(--soft);pointer-events:none}.favorites-search-input{padding:6px 32px 6px 30px;border:1px solid var(--line-strong);border-radius:10px;font-size:13px;font-family:inherit;background:var(--surface);color:var(--ink);width:200px}.favorites-search-clear{position:absolute;right:8px;background:none;border:none;color:var(--soft);cursor:pointer;padding:2px}.favorites-list{display:flex;flex-direction:column;gap:12px}.favorite-row{display:flex;align-items:center;gap:16px;padding:14px;background:var(--surface);border-radius:16px;box-shadow:var(--shadow);cursor:pointer;transition:box-shadow .15s,transform .1s}.favorite-row:hover{box-shadow:0 12px 36px #3d32291f;transform:translateY(-2px)}.favorite-item-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}.favorite-edit-btn,.favorite-remove-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:none;border:none;cursor:pointer;flex-shrink:0;transition:color .15s}.favorite-edit-btn{color:var(--muted)}.favorite-edit-btn:hover{color:var(--accent)}.favorite-remove-btn{color:var(--muted)}.favorite-remove-btn:hover{color:#e8443a}.my-course-line-translation{margin:2px 0 0;color:var(--muted);font-size:13px;line-height:1.4}.favorites-empty{padding:60px 20px;text-align:center;font-size:15px;color:var(--soft);background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.favorites-empty-illustration{font-size:48px;margin-bottom:16px}.favorites-empty-title{font-size:18px;font-weight:600;color:var(--ink);margin:0 0 8px}.favorites-empty-subtitle{font-size:14px;color:var(--muted);margin:0 0 20px;line-height:1.6}.favorites-empty-btn{padding:10px 24px;background:var(--accent);border:none;border-radius:20px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;font-family:inherit}.favorites-empty-btn:hover{background:var(--accent-dark)}.favorites-features{margin-top:8px}.favorites-features-title{font-size:15px;font-weight:600;color:var(--ink);margin:0 0 12px}.favorites-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.favorites-feature-card{padding:20px;background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.favorites-feature-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:#b8956a1a;color:var(--accent);margin-bottom:12px}.favorites-feature-card h4{font-size:14px;font-weight:600;color:var(--ink);margin:0 0 4px}.favorites-feature-card p{font-size:12px;color:var(--muted);margin:0;line-height:1.5}.notebook-view{display:flex;flex-direction:column;gap:20px}.notebook-header{display:flex;align-items:flex-start;justify-content:space-between}.notebook-title{font-family:Bricolage Grotesque,sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:0}.notebook-subtitle{font-size:14px;color:var(--muted);margin:4px 0 0}.notebook-new-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid var(--accent);background:none;border-radius:20px;font-size:13px;font-weight:500;color:var(--accent);cursor:pointer;font-family:inherit}.notebook-new-btn:hover{background:#b8956a14}.notebook-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.notebook-tabs{display:flex;gap:4px}.notebook-tab{padding:6px 14px;border:none;background:var(--cafe-cream);border-radius:10px;font-size:13px;font-weight:500;color:var(--soft);cursor:pointer;font-family:inherit}.notebook-tab.active{background:var(--accent);color:#fff}.notebook-search-wrapper{position:relative;display:flex;align-items:center}.notebook-search-icon{position:absolute;left:10px;color:var(--soft);pointer-events:none}.notebook-search-input{padding:6px 32px 6px 30px;border:1px solid var(--line-strong);border-radius:10px;font-size:13px;font-family:inherit;background:var(--surface);color:var(--ink);width:200px}.notebook-search-clear{position:absolute;right:8px;background:none;border:none;color:var(--soft);cursor:pointer;padding:2px}.notebook-list{display:flex;flex-direction:column;gap:10px}.notebook-item{padding:16px;background:var(--surface);border-radius:14px;box-shadow:var(--shadow)}.notebook-item-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.notebook-item-tag{padding:3px 10px;border-radius:10px;font-size:11px;font-weight:600}.notebook-item-tag.sentence{background:#b8956a26;color:var(--accent)}.notebook-item-tag.vocabulary{background:#7a9e6b26;color:var(--green)}.notebook-item-tag.note{background:#6b8db826;color:var(--blue)}.notebook-item-time{font-size:11px;color:var(--soft)}.notebook-item-content{font-size:14px;color:var(--ink);margin:0 0 8px;line-height:1.6}.notebook-item-footer{display:flex;justify-content:flex-end}.notebook-item-actions{display:flex;gap:8px;opacity:0;transition:opacity .15s}.notebook-item:hover .notebook-item-actions{opacity:1}.notebook-item-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--cafe-cream);border:none;border-radius:8px;font-size:12px;font-weight:500;color:var(--muted);cursor:pointer;font-family:inherit}.notebook-item-btn:hover{background:var(--cafe-tan);color:var(--ink)}.notebook-item-btn.delete:hover{color:var(--danger)}.notebook-empty{padding:60px 20px;text-align:center;background:var(--surface);border-radius:16px;box-shadow:var(--shadow);font-size:15px;color:var(--soft)}.notebook-empty-illustration{font-size:48px;margin-bottom:16px}.notebook-empty-title{font-size:18px;font-weight:600;color:var(--ink);margin:0 0 8px}.notebook-empty-subtitle{font-size:14px;color:var(--muted);margin:0 0 20px;line-height:1.6}.notebook-empty-actions{display:flex;flex-direction:column;align-items:center;gap:12px}.notebook-empty-btn{padding:10px 24px;background:var(--accent);border:none;border-radius:20px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;font-family:inherit}.notebook-empty-btn:hover{background:var(--accent-dark)}.notebook-empty-link{background:none;border:none;font-size:13px;font-weight:500;color:var(--accent);cursor:pointer;font-family:inherit}.notebook-features{margin-top:8px}.notebook-features-title{font-size:15px;font-weight:600;color:var(--ink);margin:0 0 12px}.notebook-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.notebook-feature-card{padding:20px;background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.notebook-feature-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:#b8956a1a;color:var(--accent);margin-bottom:12px}.notebook-feature-card h4{font-size:14px;font-weight:600;color:var(--ink);margin:0 0 4px}.notebook-feature-card p{font-size:12px;color:var(--muted);margin:0;line-height:1.5}.note-editor-modal{position:relative;width:100%;max-width:480px;background:var(--surface);border-radius:20px;padding:28px;box-shadow:0 24px 64px #3d322933}.note-editor-title{font-family:Bricolage Grotesque,sans-serif;font-size:20px;font-weight:700;color:var(--ink);margin:0 0 20px}.note-editor-field{margin-bottom:16px}.note-editor-label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:8px}.note-editor-type-grid{display:flex;gap:8px}.note-editor-textarea{width:100%;padding:12px;border:1px solid var(--line-strong);border-radius:12px;font-size:14px;font-family:inherit;background:var(--surface);color:var(--ink);resize:vertical;min-height:100px}.note-editor-textarea:focus{outline:none;border-color:var(--accent)}.note-editor-char-count{display:block;text-align:right;font-size:11px;color:var(--soft);margin-top:4px}.note-editor-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.note-editor-cancel{padding:8px 16px;background:var(--cafe-cream);border:none;border-radius:20px;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer;font-family:inherit}.note-editor-save{padding:8px 20px;background:var(--accent);border:none;border-radius:20px;font-size:13px;font-weight:600;color:#fff;cursor:pointer;font-family:inherit}.note-editor-save:hover:not(:disabled){background:var(--accent-dark)}.note-editor-save:disabled{opacity:.4;cursor:not-allowed}@media(max-width:768px){.progress-kpi-grid{grid-template-columns:repeat(2,1fr)}.progress-bottom-grid,.favorites-features-grid,.notebook-features-grid{grid-template-columns:1fr}}.home-back-btn{display:flex;align-items:center;gap:6px;padding:7px 14px;border:none;background:var(--cafe-cream);border-radius:20px;font-size:14px;font-weight:500;color:var(--ink);cursor:pointer;transition:background .15s;font-family:inherit}.home-back-btn:hover{background:var(--cafe-tan)}.my-courses-view{display:flex;flex-direction:column;gap:20px}.my-courses-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.my-courses-title{font-family:Bricolage Grotesque,sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:0}.my-courses-subtitle{font-size:14px;color:var(--muted);margin:4px 0 0}.my-courses-sort{display:flex;align-items:center;gap:6px}.my-courses-sort-label{font-size:13px;color:var(--soft)}.my-courses-sort-select{padding:6px 12px;border:1px solid var(--line-strong);border-radius:8px;font-size:13px;font-family:inherit;background:var(--surface);color:var(--ink);cursor:pointer}.my-courses-stats{display:flex;gap:12px}.my-courses-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:16px;background:var(--surface);border:none;border-radius:14px;cursor:pointer;transition:box-shadow .15s;box-shadow:var(--shadow);font-family:inherit}.my-courses-stat.active{box-shadow:0 0 0 2px var(--accent)}.my-courses-stat-value{font-family:Bricolage Grotesque,sans-serif;font-size:28px;font-weight:700;color:var(--accent)}.my-courses-stat-label{font-size:12px;color:var(--muted);font-weight:500}.my-courses-list{display:flex;flex-direction:column;gap:12px}.my-course-row{display:flex;align-items:center;gap:16px;padding:14px;background:var(--surface);border:none;border-radius:16px;cursor:pointer;transition:box-shadow .15s,transform .1s;box-shadow:var(--shadow)}.my-course-row:hover{box-shadow:0 12px 36px #3d32291f;transform:translateY(-2px)}.my-course-cover{width:80px;height:80px;border-radius:12px;overflow:hidden;flex-shrink:0;background:var(--cafe-cream)}.my-course-cover-img{width:100%;height:100%;object-fit:cover}.my-course-cover-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:28px}.my-course-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.my-course-title{font-size:15px;font-weight:600;color:var(--ink);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.my-course-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.my-course-meta-item{display:flex;align-items:center;gap:3px;font-size:12px;color:var(--soft)}.my-course-progress{display:flex;align-items:center;gap:8px}.my-course-progress-bar{flex:1;max-width:160px;height:6px;background:var(--cafe-tan);border-radius:3px;overflow:hidden}.my-course-progress-fill{height:100%;background:var(--accent);border-radius:3px}.my-course-progress-text{font-size:12px;color:var(--accent);font-weight:500;white-space:nowrap}.my-course-completed-date{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--green)}.my-course-action{display:flex;align-items:center;gap:6px;padding:8px 16px;background:var(--accent);border:none;border-radius:20px;font-size:13px;font-weight:600;color:#fff;cursor:pointer;transition:background .15s;white-space:nowrap;font-family:inherit;flex-shrink:0}.my-course-action:hover{background:var(--accent-dark)}.my-courses-empty{padding:60px 20px;text-align:center;font-size:15px;color:var(--soft);background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.characters-view{display:flex;flex-direction:column;gap:20px}.characters-hero{height:140px;border-radius:18px;background:linear-gradient(135deg,var(--accent) 0%,var(--accent-dark) 100%);display:flex;align-items:center;padding:0 28px;overflow:hidden}.characters-hero-content{color:#fff}.characters-hero-title{font-family:Bricolage Grotesque,sans-serif;font-size:26px;font-weight:700;margin:0 0 4px}.characters-hero-subtitle{font-size:14px;opacity:.85;margin:0}.characters-list{display:flex;flex-direction:column;gap:12px}.character-list-card{display:flex;align-items:flex-start;gap:16px;padding:16px;background:var(--surface);border:none;border-radius:16px;cursor:pointer;transition:box-shadow .15s,transform .1s;box-shadow:var(--shadow)}.character-list-card:hover{box-shadow:0 12px 36px #3d32291f;transform:translateY(-2px)}.character-list-avatar{width:72px;height:72px;border-radius:50%;overflow:hidden;flex-shrink:0}.character-list-avatar img{width:100%;height:100%;object-fit:cover}.character-list-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.character-list-name{font-size:16px;font-weight:600;color:var(--ink);margin:0}.character-list-role{font-size:13px;color:var(--accent);font-weight:500}.character-list-personality{font-size:13px;color:var(--muted);margin:2px 0 0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.character-list-footer{display:flex;align-items:center;justify-content:space-between;margin-top:6px}.character-list-courses{font-size:12px;color:var(--soft)}.character-list-view{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:500;color:var(--accent);background:none;border:none;cursor:pointer;font-family:inherit;padding:0}.character-detail-view{display:flex;flex-direction:column;gap:20px}.character-detail-header{display:flex;align-items:center;gap:20px;padding:24px;background:var(--surface);border-radius:18px;box-shadow:var(--shadow)}.character-detail-avatar{width:96px;height:96px;border-radius:50%;overflow:hidden;flex-shrink:0}.character-detail-avatar img{width:100%;height:100%;object-fit:cover}.character-detail-header-info{display:flex;flex-direction:column;gap:6px}.character-detail-name{font-family:Bricolage Grotesque,sans-serif;font-size:24px;font-weight:700;color:var(--ink);margin:0}.character-detail-occupation{font-size:14px;color:var(--accent);font-weight:500}.character-detail-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.character-detail-stats{display:flex;gap:12px}.character-detail-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:16px;background:var(--cafe-cream);border-radius:14px}.character-detail-stat-value{font-family:Bricolage Grotesque,sans-serif;font-size:24px;font-weight:700;color:var(--accent)}.character-detail-stat-label{font-size:11px;color:var(--muted)}.character-detail-section{display:flex;flex-direction:column;gap:10px;padding:20px;background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.character-detail-bio,.character-detail-personality{font-size:14px;color:var(--muted);line-height:1.7;margin:0}.character-detail-empty{font-size:14px;color:var(--soft);margin:0}.character-detail-courses{display:flex;flex-direction:column;gap:8px}.character-course-row{display:flex;align-items:center;gap:12px;padding:10px;background:var(--cafe-cream);border-radius:12px;cursor:pointer;transition:background .15s}.character-course-row:hover{background:var(--cafe-tan)}.character-course-cover{width:48px;height:48px;border-radius:8px;overflow:hidden;flex-shrink:0}.character-course-cover img{width:100%;height:100%;object-fit:cover}.character-course-info{flex:1;min-width:0}.character-course-title{font-size:14px;font-weight:600;color:var(--ink);margin:0 0 4px}.character-course-play{color:var(--accent);flex-shrink:0}.character-detail-not-found{display:flex;flex-direction:column;align-items:center;gap:12px;padding:60px 20px}.shell-home{width:100%;max-width:100%;margin:0;padding:0}.home-layout{display:grid;grid-template-columns:240px minmax(0,1fr) 320px;gap:24px;width:100%;max-width:100%;margin:0;padding:20px 32px;min-height:100vh;align-items:stretch}.home-left-sidebar{display:flex;flex-direction:column;gap:16px;position:sticky;top:20px;align-self:stretch;height:calc(100vh - 40px);background:var(--sidebar-bg);border-radius:18px;padding:20px 16px;overflow:hidden}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:4px 4px 16px;border-bottom:1px solid var(--line)}.sidebar-brand-logo{width:40px;height:40px;border-radius:10px;object-fit:cover}.sidebar-brand-text{display:flex;flex-direction:column}.sidebar-brand-name{font-family:Bricolage Grotesque,sans-serif;font-size:18px;font-weight:700;color:var(--ink);line-height:1.2}.sidebar-brand-sub{font-size:11px;color:var(--accent);letter-spacing:.02em;font-weight:500}.sidebar-nav{display:flex;flex-direction:column;gap:4px}.sidebar-nav-item{display:flex;align-items:center;gap:10px;padding:11px 14px;border:none;background:transparent;border-radius:10px;font-size:14px;font-weight:500;color:var(--sidebar-text);cursor:pointer;transition:background .15s,color .15s;text-align:left;font-family:inherit}.sidebar-nav-item:hover{background:#b8956a14;color:var(--ink)}.sidebar-nav-item.active{background:var(--sidebar-active-bg);color:var(--accent);font-weight:600}.sidebar-nav-item svg{flex-shrink:0}.sidebar-panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px}.sidebar-panel-header{font-size:12px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}.sidebar-panel-empty{font-size:13px;color:var(--soft);padding:12px 0;text-align:center}.sidebar-footer{margin-top:auto;border-radius:14px;overflow:hidden;position:relative;flex-shrink:0}.sidebar-footer-img{width:100%;height:100px;object-fit:cover;border-radius:14px}.sidebar-footer-text{font-size:11px;color:var(--cafe-brown);margin-top:8px;line-height:1.5;text-align:center;font-style:italic}.home-center{display:flex;flex-direction:column;gap:20px;min-width:0}.home-topnav{display:flex;align-items:center;justify-content:space-between;gap:16px}.home-tabs{display:flex;gap:2px;background:var(--cafe-cream);border-radius:24px;padding:4px}.home-tab{padding:7px 18px;border:none;background:transparent;border-radius:20px;font-size:14px;font-weight:500;color:var(--muted);cursor:pointer;transition:background .2s,color .2s;font-family:inherit}.home-tab:hover{color:var(--ink)}.home-tab.active{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 2px 8px #261e140f}.home-toolbar{display:flex;align-items:center;gap:10px}.toolbar-lang{display:flex;align-items:center;gap:4px;padding:7px 14px;border:1px solid var(--line);background:var(--surface);border-radius:20px;font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit}.toolbar-lang:hover{border-color:var(--accent);background:var(--cafe-cream)}.toolbar-notification{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line);background:var(--surface);border-radius:50%;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s}.toolbar-notification:hover{border-color:var(--accent);color:var(--accent)}.notification-dropdown{position:absolute;top:42px;right:0;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:12px 16px;min-width:200px;z-index:100}.notification-item{font-size:13px;color:var(--soft)}.toolbar-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;cursor:pointer}.home-banner-carousel{position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}.banner-slide{position:relative;height:320px;background-size:cover;background-position:center;display:flex;align-items:center}.banner-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(30,25,20,.82) 0%,rgba(30,25,20,.4) 50%,transparent 100%)}.banner-content{position:relative;z-index:1;padding:32px;max-width:480px}.banner-badge{display:inline-block;padding:4px 12px;background:var(--accent);color:#fff;font-size:11px;font-weight:600;border-radius:12px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:12px}.banner-title{font-family:Bricolage Grotesque,sans-serif;font-size:28px;font-weight:700;color:#fff;margin:0 0 8px;line-height:1.2}.banner-subtitle{font-size:14px;color:#ffffffd9;margin:0 0 20px;line-height:1.5}.banner-button{display:inline-flex;align-items:center;gap:8px;padding:10px 24px;background:var(--accent);border:none;border-radius:24px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;transition:background .15s,transform .1s;font-family:inherit}.banner-button:hover{background:var(--accent-dark)}.banner-button:active{transform:scale(.97)}.banner-indicators{position:absolute;bottom:16px;right:24px;display:flex;gap:6px;z-index:2}.banner-indicator{width:8px;height:8px;border-radius:50%;border:none;background:#fff6;cursor:pointer;transition:background .15s,width .15s;padding:0}.banner-indicator.active{background:#fff;width:24px;border-radius:4px}.course-catalog{display:flex;flex-direction:column;gap:16px}.catalog-header{display:flex;align-items:center;justify-content:space-between}.catalog-title{font-family:Bricolage Grotesque,sans-serif;font-size:20px;font-weight:600;color:var(--ink);margin:0}.catalog-view-all{font-size:13px;font-weight:500;color:var(--accent);background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:6px;transition:background .15s;font-family:inherit}.catalog-view-all:hover{background:var(--cafe-cream)}.course-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}.home-course-card{display:flex;flex-direction:row;background:var(--surface);border:none;border-radius:16px;overflow:hidden;cursor:pointer;transition:box-shadow .2s,transform .1s;padding:0;text-align:left;font-family:inherit;box-shadow:var(--shadow)}.home-course-card:hover{box-shadow:0 12px 36px #261e141f;transform:translateY(-2px)}.course-card-cover{position:relative;width:120px;min-height:110px;flex-shrink:0;overflow:hidden;background:var(--cafe-cream)}.course-card-img{width:100%;height:100%;object-fit:cover}.course-card-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:32px}.course-card-status{position:absolute;top:6px;left:6px;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.course-card-status.completed{background:#6b9e6be6}.course-card-status.learning{background:#b87d4be6}.course-card-status.not-started{background:#3c373299}.course-card-body{flex:1;padding:12px 14px;display:flex;flex-direction:column;justify-content:center;gap:6px;min-width:0}.course-card-title{font-size:14px;font-weight:600;color:var(--ink);line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.course-card-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.course-card-difficulty{font-size:11px;font-weight:600;padding:2px 8px;border-radius:8px}.course-card-difficulty.easy{background:#6b9e6b1f;color:var(--green)}.course-card-difficulty.medium{background:#b87d4b24;color:var(--accent)}.course-card-difficulty.hard{background:#b4624a1f;color:var(--danger)}.course-card-info{display:flex;align-items:center;gap:3px;font-size:12px;color:var(--soft)}.course-offline-action{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid rgba(120,97,69,.2);border-radius:50%;background:#fff9;color:var(--soft);cursor:pointer;transition:all .16s ease;flex-shrink:0}.course-offline-action:hover{background:#b87d4b1a;border-color:#b87d4b4d;color:var(--accent);transform:scale(1.08)}.course-offline-action.not-downloaded{color:var(--soft)}.course-offline-action.downloading{color:var(--accent);border-color:#b87d4b40;cursor:wait;opacity:.75}.course-offline-action.downloading:hover{transform:none}.course-offline-action.ready{border-color:#6b9e6b40;background:#6b9e6b14;color:var(--green)}.course-offline-action.ready:hover{background:#6b9e6b26;border-color:#6b9e6b66;color:var(--green)}.course-offline-action.update-available{color:#e8923a;border-color:#e8923a40;background:#e8923a14}.course-offline-action.update-available:hover{background:#e8923a26;border-color:#e8923a66}.course-offline-action.failed{color:#d9534f;border-color:#d9534f40;background:#d9534f14}.course-offline-action.failed:hover{background:#d9534f26;border-color:#d9534f66}.course-offline-action:disabled{cursor:wait;opacity:.6}.course-offline-action:disabled:hover{transform:none}.spin{animation:saynext-spin 1s linear infinite}@keyframes saynext-spin{to{transform:rotate(360deg)}}.offline-library-view{display:flex;flex-direction:column;gap:22px}.offline-library-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:22px;border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}.offline-library-header h1{margin:0 0 6px;color:var(--ink);font-size:25px}.offline-library-header p{margin:0 0 8px;color:var(--soft);font-size:14px}.offline-library-header span{color:var(--green);font-size:12px;font-weight:700}.offline-clear-button,.offline-course-actions button{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--border);border-radius:10px;background:transparent;color:var(--soft);font:600 12px/1.2 inherit;cursor:pointer}.offline-library-empty{display:grid;place-items:center;min-height:260px;padding:32px;border:1px dashed var(--border);border-radius:18px;color:var(--soft);text-align:center}.offline-library-list{display:flex;flex-direction:column;gap:12px}.offline-course-row{display:flex;align-items:center;gap:16px;padding:12px;border-radius:16px;background:var(--surface);box-shadow:var(--shadow)}.offline-course-main{flex:1;display:flex;align-items:center;gap:14px;min-width:0;padding:0;border:0;background:transparent;text-align:left;cursor:pointer}.offline-course-cover{width:92px;height:68px;flex:none;display:grid;place-items:center;overflow:hidden;border-radius:11px;background:var(--cafe-cream)}.offline-course-cover img{width:100%;height:100%;object-fit:cover}.offline-course-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.offline-course-copy strong{overflow:hidden;color:var(--ink);font-size:15px;text-overflow:ellipsis;white-space:nowrap}.offline-course-copy small{color:var(--soft)}.offline-course-copy>span{display:inline-flex;align-items:center;gap:5px;color:var(--green);font-size:12px;font-weight:650}.offline-course-actions{display:flex;align-items:center;gap:8px}@media(max-width:720px){.offline-library-header,.offline-course-row{align-items:stretch;flex-direction:column}.offline-course-actions{justify-content:flex-end}}.quick-learn-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;background:var(--surface);border:none;border-radius:16px;box-shadow:var(--shadow);margin-top:auto}.quick-learn-info{display:flex;flex-direction:column;gap:2px}.quick-learn-label{font-size:11px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.04em}.quick-learn-detail{font-size:14px;color:var(--ink);font-weight:500}.quick-learn-button{display:flex;align-items:center;gap:8px;padding:10px 20px;background:var(--accent);border:none;border-radius:24px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;transition:background .15s,transform .1s;white-space:nowrap;font-family:inherit}.quick-learn-button:hover{background:var(--accent-dark)}.quick-learn-button:active{transform:scale(.97)}.characters-page{display:flex;flex-direction:column;gap:20px}.characters-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.character-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px;background:var(--surface);border:none;border-radius:16px;transition:box-shadow .15s;cursor:pointer;box-shadow:var(--shadow)}.character-card:hover{box-shadow:0 12px 36px #261e141f}.character-card-avatar{width:80px;height:80px;border-radius:50%;object-fit:cover}.character-card-name{font-size:14px;font-weight:600;color:var(--ink)}.home-right-sidebar{display:flex;flex-direction:column;gap:16px;position:sticky;top:20px;align-self:start;max-height:calc(100vh - 40px);overflow-y:auto}.right-user-card{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--sidebar-bg);border-radius:16px}.right-user-avatar{width:44px;height:44px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line)}.right-user-info{display:flex;flex-direction:column;gap:2px;min-width:0}.right-user-name{font-size:14px;font-weight:600;color:var(--ink)}.right-user-level{font-size:12px;color:var(--accent);font-weight:500}.right-user-actions{display:flex;align-items:center;gap:6px;margin-top:2px}.right-user-lang{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:500;color:var(--accent);background:#b8956a1a;border:none;border-radius:12px;padding:3px 10px;cursor:pointer;transition:background .15s;font-family:inherit}.right-user-lang:hover{background:#b8956a33}.right-display-lang-select{height:24px;border:1px solid rgba(184,149,106,.3);border-radius:8px;background:#fff;color:var(--accent);font-size:12px;font-weight:600;cursor:pointer;padding:0 4px;font-family:inherit;transition:border-color .15s,color .15s}.right-display-lang-select:hover{border-color:var(--accent)}.right-display-lang-select:focus{outline:none;border-color:var(--accent)}.right-card{background:var(--surface);border:none;border-radius:16px;padding:18px;box-shadow:var(--shadow)}.right-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.right-card-title{font-size:14px;font-weight:600;color:var(--ink)}.right-card-edit{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--accent);background:none;border:none;cursor:pointer;padding:2px 6px;border-radius:6px;transition:background .15s;font-family:inherit}.right-card-edit:hover{background:var(--cafe-cream)}.right-card-action{display:flex;align-items:center;gap:4px;width:100%;justify-content:center;padding:8px;margin-top:12px;border:1px solid var(--line);background:transparent;border-radius:10px;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s;font-family:inherit}.right-card-action:hover{border-color:var(--accent);color:var(--accent)}.progress-ring-container{display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:18px;padding:8px 0}.progress-ring-label{position:absolute;display:flex;flex-direction:column;align-items:center;gap:2px}.progress-ring-percent{font-family:Bricolage Grotesque,sans-serif;font-size:24px;font-weight:700;color:var(--ink);line-height:1}.progress-ring-text{font-size:10px;color:var(--soft);letter-spacing:.02em}.circular-progress{display:block}.circular-progress-bg{stroke:var(--cafe-tan)}.circular-progress-fill{stroke:var(--accent);transition:stroke-dashoffset .3s ease}.progress-stats{display:flex;gap:10px;margin-bottom:4px}.progress-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 8px;background:var(--cafe-cream);border-radius:12px}.progress-stat-value{font-family:Bricolage Grotesque,sans-serif;font-size:20px;font-weight:700;color:var(--accent)}.progress-stat-label{font-size:10px;color:var(--muted);text-align:center;line-height:1.3}.weekly-edit{display:flex;align-items:center;gap:6px;margin-bottom:12px}.weekly-edit-input{width:60px;padding:4px 8px;border:1px solid var(--line-strong);border-radius:8px;font-size:14px;font-family:inherit;text-align:center}.weekly-edit-unit{font-size:13px;color:var(--muted)}.weekly-edit-save{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer}.weekly-time{font-size:13px;color:var(--muted);margin-bottom:8px}.weekly-time-current{font-family:Bricolage Grotesque,sans-serif;font-size:18px;font-weight:700;color:var(--accent)}.weekly-time-sep{color:var(--soft)}.weekly-time-target{font-weight:600;color:var(--ink)}.weekly-time-unit{font-size:12px;color:var(--soft);margin-left:2px}.weekly-progress-bar{width:100%;height:8px;background:var(--cafe-tan);border-radius:4px;overflow:hidden;margin-bottom:12px}.weekly-progress-fill{height:100%;background:var(--accent);border-radius:4px;transition:width .3s ease}.weekly-days{display:flex;align-items:center;justify-content:space-between;gap:10px}.weekly-days-text{font-size:12px;color:var(--muted)}.week-dots{display:flex;gap:5px}.week-dot{width:12px;height:12px;border-radius:50%;background:var(--cafe-tan);transition:background .15s}.week-dot.active{background:var(--accent)}.recommendation-card{display:flex;align-items:center;gap:12px;padding:10px;background:var(--cafe-cream);border-radius:10px;cursor:pointer;transition:background .15s}.recommendation-card:hover{background:var(--cafe-tan)}.recommendation-cover{width:56px;height:56px;border-radius:8px;object-fit:cover;flex-shrink:0}.recommendation-info{flex:1;min-width:0}.recommendation-title{font-size:13px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recommendation-meta{font-size:11px;color:var(--soft);margin-top:2px}.recommendation-start{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--accent);border:none;border-radius:50%;color:#fff;cursor:pointer;flex-shrink:0;transition:background .15s}.recommendation-start:hover{background:var(--accent-dark)}.character-row{display:flex;gap:8px;flex-wrap:wrap}.character-avatar{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer}.character-avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;transition:box-shadow .15s}.character-avatar:hover img{box-shadow:0 0 0 2px var(--accent)}.character-avatar-name{font-size:10px;color:var(--muted);text-align:center;max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:1200px){.home-layout{grid-template-columns:200px minmax(0,1fr) 280px;gap:16px}}@media(max-width:960px){.home-layout{grid-template-columns:1fr;gap:16px}.home-left-sidebar,.home-right-sidebar{display:none}}.preview-modal-backdrop{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:#3d322966;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:20px}.detail-modal{position:relative;width:100%;max-width:640px;max-height:calc(100vh - 40px);background:var(--surface);border-radius:20px;overflow:hidden;box-shadow:0 24px 64px #3d322933;display:flex;flex-direction:column}.detail-modal-close{position:absolute;top:14px;right:14px;z-index:10;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:#fff3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;color:#fff;cursor:pointer;transition:background .15s}.detail-modal-close:hover{background:#ffffff59}.detail-cover{position:relative;width:100%;height:200px;flex-shrink:0;overflow:hidden;background:var(--cafe-cream)}.detail-cover-img{width:100%;height:100%;object-fit:cover}.detail-cover-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:56px}.detail-cover-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(30,25,20,.85) 0%,rgba(30,25,20,.3) 60%,transparent 100%)}.detail-cover-content{position:absolute;bottom:0;left:0;right:0;padding:20px 24px;z-index:1}.detail-cover-badge{display:inline-block;padding:4px 12px;background:var(--accent);color:#fff;font-size:11px;font-weight:600;border-radius:12px;letter-spacing:.03em;margin-bottom:10px}.detail-cover-title{font-family:Bricolage Grotesque,sans-serif;font-size:24px;font-weight:700;color:#fff;margin:0 0 4px;line-height:1.2}.detail-cover-subtitle{font-size:13px;color:#fffc;margin:0;line-height:1.4}.detail-body{flex:1;overflow-y:auto;padding:20px 24px;display:flex;flex-direction:column;gap:20px}.detail-loading{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 20px;text-align:center}.detail-meta-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.detail-meta-item{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--muted);font-weight:500}.detail-meta-item svg{color:var(--accent)}.detail-section{display:flex;flex-direction:column;gap:10px}.detail-section-title{font-size:14px;font-weight:600;color:var(--ink);margin:0}.detail-tags{display:flex;flex-wrap:wrap;gap:8px}.detail-tag{display:flex;align-items:center;gap:4px;padding:5px 12px;background:#b8956a1a;color:var(--accent);font-size:13px;font-weight:500;border-radius:16px}.detail-tag svg{flex-shrink:0}.detail-role-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.detail-role-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px;background:var(--cafe-cream);border:2px solid transparent;border-radius:14px;cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit}.detail-role-card:hover{background:var(--cafe-tan)}.detail-role-card.selected{border-color:var(--accent);background:#b8956a14}.detail-role-check{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;color:var(--accent)}.detail-role-avatar{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;overflow:hidden;background:var(--cafe-tan);font-size:20px;font-weight:600;color:var(--accent)}.detail-role-avatar img{width:100%;height:100%;object-fit:cover}.detail-role-name{font-size:14px;font-weight:600;color:var(--ink)}.detail-role-desc{font-size:11px;color:var(--soft);text-align:center}.detail-role-context{font-size:12px;color:var(--muted);margin:4px 0 0;line-height:1.5}.detail-mode-grid{display:flex;gap:8px}.detail-mode-btn{flex:1;padding:10px;background:var(--cafe-cream);border:2px solid transparent;border-radius:12px;font-size:14px;font-weight:500;color:var(--muted);cursor:pointer;transition:all .15s;font-family:inherit}.detail-mode-btn:hover{background:var(--cafe-tan);color:var(--ink)}.detail-mode-btn.selected{border-color:var(--accent);background:#b8956a14;color:var(--accent);font-weight:600}.detail-audio-preview{display:flex;flex-direction:column;gap:12px}.detail-audio-preview .dialogue-audio{width:100%}.detail-preview-lines{display:flex;flex-direction:column;gap:6px;max-height:240px;overflow-y:auto}.detail-preview-line{padding:8px 12px;border-radius:10px;background:var(--cafe-cream);transition:background .15s}.detail-preview-line.active{background:#b8956a26}.detail-preview-line .line-meta{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--soft);margin-bottom:2px}.detail-preview-line .line-meta button{background:none;border:none;color:var(--accent);cursor:pointer;padding:2px;display:flex;align-items:center}.detail-preview-line p{font-size:13px;color:var(--ink);margin:0;line-height:1.4}.detail-preview-line.practice-role p{font-weight:500}.detail-hidden-audio{display:none}.detail-actions{display:flex;align-items:center;gap:12px;padding:16px 24px;border-top:1px solid var(--line);background:var(--surface);flex-shrink:0}.detail-listen-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;background:none;border:none;font-size:13px;font-weight:500;color:var(--accent);cursor:pointer;transition:opacity .15s;font-family:inherit}.detail-listen-btn:hover{opacity:.7}.detail-start-btn{display:flex;align-items:center;gap:8px;padding:11px 28px;margin-left:auto;background:var(--accent);border:none;border-radius:24px;font-size:15px;font-weight:600;color:#fff;cursor:pointer;transition:background .15s,transform .1s;font-family:inherit}.detail-start-btn:hover:not(:disabled){background:var(--accent-dark)}.detail-start-btn:active:not(:disabled){transform:scale(.97)}.detail-start-btn:disabled{opacity:.4;cursor:not-allowed}@media(max-width:600px){.detail-modal{max-width:100%;max-height:100vh;border-radius:0}.detail-role-grid{grid-template-columns:1fr}.detail-actions{flex-wrap:wrap}.detail-start-btn{margin-left:0;width:100%;justify-content:center}}.story-switcher{display:flex;flex-direction:column;gap:4px;padding:8px 12px;margin-bottom:8px}.story-switcher-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;border:1px solid transparent;background:transparent;color:var(--sidebar-text);cursor:pointer;transition:all .15s ease;font-size:13px;font-weight:500;width:100%;text-align:left}.story-switcher-item:hover{background:var(--sidebar-active-bg)}.story-switcher-item.active{background:var(--sidebar-active-bg);border-color:var(--story-item-accent, var(--accent));color:var(--ink)}.story-switcher-color-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.story-switcher-cover{width:38px;height:38px;border-radius:9px;object-fit:cover;flex-shrink:0;border:1px solid rgba(255,255,255,.72);box-shadow:0 2px 8px #281e142e}.story-switcher-item.active .story-switcher-color-dot{box-shadow:0 0 0 3px #fff9}.story-switcher-item.active .story-switcher-cover{box-shadow:0 0 0 2px var(--story-item-accent, var(--accent)),0 3px 10px #281e1433}.story-detail-view{padding:0}.story-detail-header{display:flex;align-items:center;gap:24px;padding:32px 28px;border-radius:16px;margin-bottom:24px}.story-detail-cover{width:80px;height:80px;border-radius:16px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow)}.story-detail-title{font-family:Bricolage Grotesque,sans-serif;font-size:28px;font-weight:700;color:var(--ink);margin:0 0 4px}.story-detail-subtitle{font-size:14px;color:var(--muted);margin:0 0 8px}.story-detail-desc{font-size:13px;color:var(--soft);line-height:1.6;margin:0}.story-chapter{margin-bottom:28px}.story-chapter-title{font-family:Bricolage Grotesque,sans-serif;font-size:18px;font-weight:600;color:var(--ink);margin:0 0 12px;display:flex;align-items:center;gap:8px}.story-chapter-progress{font-size:12px;color:var(--soft);font-weight:400}.story-chapter-dialogues{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}