:root{--bg0:#e8eef5;--bg1:#f4f7fb;--ink:#0f2744;--ink-soft:#3d536b;--muted:#6b7c8f;--card:#ffffffd1;--line:#0f27441a;--accent:#1f6f8b;--accent-2:#e07a3d;--danger:#b42318;--shadow:0 18px 50px #0f27441f;--radius:22px;--font-display:"Noto Serif SC", "Songti SC", serif;--font-body:"DM Sans", "Noto Sans SC", sans-serif;color:var(--ink);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:radial-gradient(1200px 600px at 10% -10%, #d7e8f3 0%, transparent 55%), radial-gradient(900px 500px at 100% 0%, #f8e6d8 0%, transparent 45%), linear-gradient(180deg, var(--bg1), var(--bg0));min-height:100%;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100dvh}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.app-shell{width:min(480px,100%);min-height:100dvh;margin:0 auto;padding:18px 16px 36px}.page{flex-direction:column;gap:16px;animation:.35s both rise;display:flex}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.brand{font-family:var(--font-display);letter-spacing:.08em;color:var(--ink);margin:0;font-size:1.65rem}.brand-block h1,.home .progress-copy h1,.page h1{font-family:var(--font-display);margin:.2rem 0 .4rem;font-weight:600;line-height:1.25}.lead,.muted,.home-foot,.kp-hint{color:var(--muted)}.small{font-size:.85rem}.boot{text-align:center;place-content:center;gap:12px;min-height:80dvh;display:grid}.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow);padding:16px}.panel h2{color:var(--ink-soft);margin:0 0 10px;font-size:.95rem}.panel.danger{border-color:#b4231840}.btn{cursor:pointer;border:0;border-radius:14px;padding:12px 16px;transition:transform .15s,opacity .15s}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:linear-gradient(135deg, var(--accent), #2a8bab);color:#fff}.btn.ghost{color:var(--ink);background:#0f27440f}.btn.link{color:var(--accent);background:0 0;padding-left:0;padding-right:0}.btn.danger{color:var(--danger);background:#b423181a}.btn.wide{width:100%}.btn.sm{padding:8px 12px;font-size:.9rem}.btn.cta{text-align:center;padding:16px;font-size:1.05rem}.option-list{gap:10px;display:grid}.option{text-align:left;border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:16px;gap:4px;padding:12px 14px;display:grid}.option.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.option strong{font-size:.98rem}.option span{color:var(--muted);font-size:.86rem}.chip-grid{flex-wrap:wrap;gap:8px;display:flex}.chip-toggle{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:999px;padding:8px 14px}.chip-toggle.on{border-color:var(--accent);color:var(--accent);background:#1f6f8b1f}.range-value{margin:8px 0 0;font-weight:600}.home-header,.study-nav{justify-content:space-between;align-items:center;gap:8px;display:flex}.stage-line{color:var(--muted);margin:4px 0 0;font-size:.9rem}.icon-link{background:#0f27440f;border-radius:999px;padding:8px 12px}.quote-block{border-radius:var(--radius);background:linear-gradient(145deg,#1f6f8b1f,#e07a3d1f);padding:18px 16px;animation:.5s both fadein}@keyframes fadein{0%{opacity:0}to{opacity:1}}.quote-label{letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-size:.8rem}.quote-text{font-family:var(--font-display);margin:8px 0 0;font-size:1.2rem;line-height:1.55}.progress-hero{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);grid-template-columns:120px 1fr;align-items:center;gap:14px;padding:16px;display:grid}.ring{border-radius:50%;place-items:center;width:112px;height:112px;display:grid}.ring-inner{text-align:center;background:#fff;border-radius:50%;place-content:center;width:86px;height:86px;display:grid}.ring-inner strong{font-size:1.35rem}.ring-inner span,.ring-inner .ring-done-link{color:var(--muted);font-size:.8rem}.ring-inner .ring-done-link{text-underline-offset:2px;text-decoration:underline}.ring-inner .ring-done-link:hover{color:var(--accent)}.home-learned-entry{margin-top:6px!important}.progress-copy p{margin:4px 0}.update-banner{background:#fff7ed;border:1px solid #e07a3d59;border-radius:16px;padding:12px 14px}.row-actions{gap:8px;margin-top:8px;display:flex}.row-actions.wrap{flex-wrap:wrap}.kp-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-top:4px solid var(--accent);border-radius:28px;flex-direction:column;gap:10px;min-height:62dvh;padding:18px 16px 14px;display:flex}.kp-card__top{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.kp-progress-label{color:var(--muted);margin-left:auto;font-size:.85rem}.kp-chip{background:color-mix(in srgb, var(--accent) 16%, white);color:var(--accent);border-radius:999px;align-items:center;padding:4px 10px;font-size:.82rem;display:inline-flex}.kp-chip.mute{color:var(--ink-soft);background:#0f27440f}.kp-chip.soft{color:var(--ink-soft);background:#0f27440d}.kp-card__title{font-family:var(--font-display);margin:4px 0 0;font-size:1.45rem;line-height:1.3}.kp-card__module{color:var(--muted);margin:0;font-size:.9rem}.kp-meta{color:var(--ink-soft);align-items:center;gap:12px;font-size:.92rem;display:flex}.stars .star{color:#0f27442e}.stars .star.on{color:var(--accent-2)}.kp-reason{color:var(--accent);margin:0;font-size:.88rem}.kp-outcome{flex:1;margin:0;font-size:1.02rem;line-height:1.6}.kp-tags{flex-wrap:wrap;gap:6px;display:flex}.kp-actions{gap:8px;margin-top:auto;display:grid}.kp-hint{text-align:center;margin:4px 0 0;font-size:.8rem}.swipe-stage{touch-action:pan-y;position:relative;overflow:hidden}.swipe-item{width:100%}.back{color:var(--ink-soft);font-size:.95rem}.detail-kicker{color:var(--muted);margin:0}.kv{gap:8px;margin:0;padding:0;list-style:none;display:grid}.kv li{border-bottom:1px dashed var(--line);justify-content:space-between;gap:12px;padding-bottom:6px;display:flex}.simple-list{margin:0 0 10px;padding-left:18px}.toast{background:var(--ink);color:#fff;text-align:center;border-radius:12px;padding:10px 14px;position:sticky;bottom:12px}select,input[type=number]{border:1px solid var(--line);background:#fff;border-radius:12px;width:100%;padding:10px 12px}input[type=range]{width:100%}.home-cta-inline{width:fit-content;margin-top:14px;padding:14px 28px;display:none}.home-foot--tablet,.kp-hint--tablet{display:none}.study-nav__pager{gap:8px;display:flex}.detail-cta-bar{z-index:12;background:linear-gradient(to top, color-mix(in srgb, var(--bg0) 92%, transparent) 35%, transparent);margin-top:8px;padding:16px 0 4px;position:sticky;bottom:12px}.detail-cta-bar .detail-cta{width:100%;max-width:none;box-shadow:0 10px 28px #0f27442e}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.learned-header{margin-bottom:12px}.learned-header h1{margin-bottom:4px}.learned-search{margin-bottom:14px;display:block}.learned-search input{border:1px solid var(--line);background:#fff;border-radius:12px;width:100%;padding:10px 12px}.learned-empty{text-align:center;justify-items:center;gap:12px;display:grid}.learned-list{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);gap:0;margin:0;padding:0;list-style:none;display:grid;overflow:hidden}.learned-item{border-bottom:1px solid var(--line);grid-template-columns:1fr auto;align-items:center;gap:8px;padding:10px 12px;display:grid}.learned-item:last-child{border-bottom:none}.learned-item-main{text-align:left;cursor:pointer;color:inherit;background:0 0;border:none;gap:2px;min-width:0;padding:4px 0;display:grid}.learned-item-main:hover .learned-title{color:var(--accent,var(--ink))}.learned-subject{color:var(--accent,var(--ink-soft));font-size:.78rem;font-weight:600}.learned-title{text-overflow:ellipsis;white-space:nowrap;font-size:1rem;font-weight:600;line-height:1.35;overflow:hidden}.learned-time{color:var(--muted);font-size:.8rem}.learned-unlearn{white-space:nowrap;flex-shrink:0}.field-label{color:var(--ink-soft);margin-bottom:8px;font-size:.92rem;display:block}.unlock-form input{border:1px solid var(--line);background:#fff;border-radius:12px;width:100%;margin-bottom:12px;padding:12px 14px}.form-error{color:var(--danger);margin:0 0 12px;font-size:.92rem}.page.unlock{max-width:420px;margin:0 auto}.prereq-list a,.video-list a{color:var(--accent);text-underline-offset:3px;text-decoration:underline}.stage-banner{background:#eef7f4;border:1px solid #2d6a4f47;border-radius:16px;padding:12px 14px}.stage-banner p{margin:0}.modal-backdrop{z-index:40;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f274473;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-card{width:min(420px,100%);box-shadow:var(--shadow);background:#fff;border-radius:22px;padding:22px 20px 18px;animation:.25s both rise}.modal-kicker{letter-spacing:.08em;color:var(--accent);margin:0;font-size:.8rem}.modal-card h2{font-family:var(--font-display);margin:8px 0 10px;font-size:1.35rem;line-height:1.35}.modal-body{color:var(--ink-soft);margin:0 0 18px;line-height:1.55}.modal-error{color:#b42318;margin:-8px 0 14px;font-size:.9rem;line-height:1.4}.modal-actions{gap:8px;display:grid}@media (width>=768px){.app-shell{width:min(840px,94vw);padding:28px 32px 48px}.page{gap:20px}.brand{font-size:1.85rem}.btn{padding:14px 18px}.btn.sm{padding:10px 14px}.page.home{grid-template-columns:1.05fr .95fr;align-content:start;gap:18px 24px;display:grid}.page.home .home-header,.page.home .update-banner,.page.home .stage-banner{grid-column:1/-1}.page.home .home-quote{flex-direction:column;justify-content:center;min-height:240px;padding:26px 24px;display:flex}.page.home .quote-text{font-size:1.4rem;line-height:1.65}.page.home .home-progress{grid-template-columns:128px 1fr;gap:18px;min-height:240px;padding:22px}.page.home .home-cta-mobile{display:none}.page.home .home-cta-inline{display:inline-flex}.page.home .home-foot--phone{display:none}.page.home .home-foot--tablet{grid-column:1/-1;margin:0;display:block}.page.home .ring{width:120px;height:120px}.page.home .ring-inner{width:92px;height:92px}.page.study{gap:16px;min-height:calc(100dvh - 76px)}.kp-card{grid-template-columns:1.35fr .9fr;grid-template-areas:"top top""title actions""module actions""meta actions""reason actions""outcome actions""tags actions""hint hint";align-items:start;gap:8px 28px;min-height:min(62dvh,520px);padding:26px 28px 20px;display:grid}.kp-card__top{grid-area:top}.kp-card__title{grid-area:title;margin-top:8px;font-size:1.75rem}.kp-card__module{grid-area:module}.kp-meta{grid-area:meta}.kp-reason{grid-area:reason}.kp-outcome{grid-area:outcome;max-width:34em;font-size:1.08rem}.kp-tags{grid-area:tags}.kp-actions{border:1px solid var(--line);background:#0f27440a;border-radius:18px;grid-area:actions;align-self:center;margin-top:0;padding:18px}.kp-actions .btn{padding:14px 16px;font-size:1rem}.kp-hint{grid-area:hint;margin-top:8px}.kp-hint--phone{display:none}.kp-hint--tablet{display:block}.detail-hero h1{max-width:20em;font-size:1.85rem}.detail-grid{grid-template-columns:1fr 1fr;gap:16px 20px;display:grid}.detail-outcome{grid-column:1/-1}.detail-outcome p{max-width:42em;font-size:1.08rem;line-height:1.65}.detail-cta-bar{bottom:16px}.page.onboarding,.page.settings{grid-template-columns:1fr 1fr;align-content:start;gap:18px 22px;display:grid}.page.onboarding .brand-block,.page.onboarding>.btn.wide,.page.settings>.back,.page.settings>h1,.page.settings>.toast{grid-column:1/-1}.page.onboarding .brand-block h1{font-size:1.85rem}.page.onboarding .lead{max-width:36em}.page.settings h1{font-size:1.75rem}.modal-card{width:min(460px,100%)}}@media (width>=1100px){.app-shell{width:min(1120px,94vw);padding:32px 40px 52px}.page.home{gap:20px 28px;min-height:calc(100dvh - 84px)}.page.home .home-quote{min-height:300px;padding:32px 28px}.page.home .quote-text{font-size:1.6rem}.page.home .home-progress{grid-template-columns:140px 1fr;gap:22px;min-height:300px;padding:26px}.page.home .ring{width:132px;height:132px}.page.home .ring-inner{width:100px;height:100px}.kp-card{grid-template-columns:1.45fr .85fr;column-gap:36px;min-height:min(68dvh,560px);padding:28px 30px 22px}.kp-card__title{font-size:2rem}.kp-outcome{font-size:1.14rem}.detail-hero h1{font-size:2.15rem}.detail-grid{gap:18px 22px}.page.onboarding .brand-block h1{font-size:2.05rem}}@media (width>=1280px){.app-shell{width:min(1200px,92vw)}}