@charset "UTF-8";
@font-face{font-family:SUIT;src:url(fonts/SUIT-Variable.woff2) format('woff2');font-weight:100 900;font-display:swap}
:root{color-scheme:dark;--bg:#111214;--panel:#191b1e;--panel-raised:#232b35;--surface:#242930;--line:#343b44;--text:#f0f0f2;--muted:#a9b0ba;--accent:#b8d0e6;--soft:#283543;--tone:#a8c7e5;--tone-rgb:168,199,229;--tone-surface:#1d252d;--tone-hover:#26333f;--shadow-soft:0 4px 16px #0003;--shadow-card:0 3px 10px #0003,inset 0 1px 0 #ffffff04;--header-height:52px;--heading-space-scale:1;--sidebar-width:200px;font-family:SUIT,"Pretendard Variable",Pretendard,"Noto Sans KR","Segoe UI",sans-serif;font-size:14px;font-synthesis:none}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{height:100dvh;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{min-height:40px;cursor:pointer;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 12px;line-height:1.4}
button:hover:not(:disabled){background:#303b46;border-color:#647e96}
button:disabled{opacity:.45;cursor:default}
button[aria-pressed=true]{color:#d7e8f8;border-color:#6785a0;background:var(--soft)}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
input,select,textarea{background:#131518;border:1px solid #41454d;border-radius:7px;padding:10px 11px;min-width:0;min-height:40px}
input,textarea{width:100%}
textarea{resize:vertical;line-height:1.8}
select{max-width:100%;text-overflow:ellipsis}
small{font-size:12px;color:var(--muted)}
[hidden]{display:none!important}
.app-header{height:var(--header-height);padding:0 max(22px,env(safe-area-inset-right)) 0 max(22px,env(safe-area-inset-left));display:flex;gap:24px;align-items:center;border-bottom:1px solid var(--line);background:#1b1f25;box-shadow:0 2px 10px #0002}
.back{display:flex;align-items:center;min-height:40px;font-size:12px;color:var(--muted);white-space:nowrap}
.brand{font-size:21px;font-weight:850;letter-spacing:-.75px;white-space:nowrap;line-height:1}
.header-home{background:transparent;font-size:12px;border-color:transparent;color:#c7cad0}
.sync{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);min-width:0}
.sync button{font-size:12px;padding:7px 9px;white-space:nowrap}
.sync [data-error=true]{color:#f3b0a6}
.shell{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);height:calc(100dvh - var(--header-height));padding-bottom:env(safe-area-inset-bottom)}
.sidebar{--nav-spacing:.42;border-right:1px solid var(--line);padding:calc(25px * var(--nav-spacing)) 8px calc(16px * var(--nav-spacing));overflow:auto;overscroll-behavior:contain;background:#15171a;scrollbar-width:thin;scrollbar-color:#444851 transparent}
.nav-label{font-size:10px;font-weight:650;letter-spacing:1.9px;color:#858a94;padding:0 8px calc(18px * var(--nav-spacing))}
#topics{display:flex;flex-direction:column;gap:calc(3px * var(--nav-spacing))}
.nav-group{display:flex;align-items:center;gap:8px;font-size:11px;line-height:1.4;letter-spacing:1px;font-weight:780;color:#c5d7e9;margin:calc(25px * var(--nav-spacing)) 8px calc(8px * var(--nav-spacing));white-space:nowrap}
.nav-group::after{content:"";height:1px;min-width:8px;flex:1;background:currentColor;opacity:.28}
.nav-group[data-group=training]{color:#ddbd94}
.nav-group[data-group=race]{color:#cbbce8}
.sidebar-resources .nav-group{color:#cbbce8;font-size:10px;letter-spacing:.7px}
.topic{display:flex;align-items:center;gap:6px;border:1px solid transparent;background:transparent;text-align:left;font-size:13px;padding:calc(10px * var(--nav-spacing)) 6px;min-height:28px;border-radius:7px;line-height:1.4}
.topic span:first-child{font-size:11px;font-variant-numeric:tabular-nums;width:16px;color:#888e98;flex-shrink:0}
.topic span:nth-child(2){min-width:0;white-space:nowrap;flex-shrink:0}
.topic:is([data-topic=run],[data-topic=compromised],[data-topic=strength],[data-topic=warmup],[data-topic=nutrition],[data-topic=recovery],[data-topic=supplemental]),.course-group:has(.course-card[data-course=run]){--tone:#ddbd94;--tone-rgb:221,189,148;--tone-surface:#27231f;--tone-hover:#383027}
.topic:is([data-topic=general],[data-topic=open],[data-topic=pro],[data-topic=doubles],[data-topic=relay],[data-topic=raceweek]),.course-group:has(.course-card[data-course=general]){--tone:#c4b9dc;--tone-rgb:196,185,220;--tone-surface:#25222c;--tone-hover:#342d3e}
.topic.selected{background:var(--tone-surface);border-color:rgba(var(--tone-rgb),.28);color:var(--text);box-shadow:inset 2px 0 var(--tone)}
.topic.selected span:first-child{color:var(--tone)}
.topic small{margin-left:auto;font-size:11px;color:#9297a1;font-variant-numeric:tabular-nums;flex-shrink:0}
.sidebar-foot{font-size:11px;line-height:1.8;color:var(--muted);margin:calc(32px * var(--nav-spacing)) 8px 0;padding-top:calc(20px * var(--nav-spacing));border-top:1px solid var(--line)}
.sidebar-foot span{color:#7e848d}
main{min-height:0;min-width:0;display:flex;flex-direction:column;padding:calc(20px * var(--heading-space-scale)) 24px 20px;position:relative;overflow:hidden}
.topic-heading{display:flex;flex-wrap:wrap;gap:calc(10px * var(--heading-space-scale)) 16px;align-items:center;margin-bottom:calc(16px * var(--heading-space-scale));flex-shrink:0;min-width:0}
.topic-heading .eyebrow{margin-bottom:calc(5px * var(--heading-space-scale))}
body[data-screen=study]{--heading-space-scale:.49}
.topic-title-group{display:flex;align-items:center;gap:12px;min-width:0}
.topic-title-group>div{min-width:0}
#back-courses{flex-shrink:0;font-size:19px;padding:7px;width:40px;background:transparent}
.eyebrow{display:block;color:#aac4dc;font-size:10px;font-weight:650;letter-spacing:1.8px;margin-bottom:5px}
h1{font-size:25px;letter-spacing:-.9px;margin:0;font-weight:730;line-height:1.25}
.division-label{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);min-width:0}
.division-label>span{white-space:nowrap}
.division-label select{font-size:12px;max-width:230px;color:var(--text)}
#mobile-topic{display:none}


.study-controls{display:flex;align-items:center;gap:12px;flex-shrink:0}
#study-progress{font-size:12px;color:#c1c5cd;white-space:nowrap;font-variant-numeric:tabular-nums}
#next-unseen{font-size:12px;min-height:40px;padding:8px 11px;background:transparent}
body[data-screen=home] #back-courses,body[data-screen=home] .study-controls,body[data-screen=home] .workspace{display:none}
body[data-screen=home] .topic-heading{display:grid;grid-template-columns:minmax(150px,1fr) auto auto;gap:8px 16px;padding:0 0 14px;margin-bottom:0;border-bottom:1px solid var(--line)}
body[data-screen=home] .topic-title-group{grid-column:1;grid-row:1;align-self:center}
body[data-screen=home] .topic-heading .eyebrow{color:#b9a486;letter-spacing:1.8px;font-size:9px;margin-bottom:7.2px}
body[data-screen=home] .division-label{grid-column:2;grid-row:1;margin:0;justify-self:end}

.home-learning{display:none}
body[data-screen=home] .home-learning{grid-column:2/4;grid-row:2;display:flex;justify-content:flex-end;align-items:center;gap:12px;min-width:0}
.topic-heading .history-launch{display:none}
body[data-screen=home] .topic-heading .history-launch{display:flex;grid-column:3;grid-row:1;margin:0;justify-self:end}
.home-learning #home-progress{font-size:11px;font-weight:450;color:var(--muted);line-height:1.5;flex-shrink:0}
.home-learning #continue-learning{min-width:0;max-width:300px;margin:0;min-height:40px;font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-screen=home] .course-group:first-child{margin-top:16px}
body[data-screen=study] #home-view{display:none}
#home-view{overflow:auto;overscroll-behavior:contain;flex:1;min-height:0;padding:4px 2px 28px;scrollbar-width:thin;scrollbar-color:#444851 transparent}






#home-progress{font-size:16px;font-weight:600;line-height:1.6;overflow-wrap:anywhere}
#continue-learning{margin-top:4px;display:flex;justify-content:space-between;gap:16px;align-items:center;background:var(--accent);color:#191b1f;border-color:var(--accent);text-align:left;font-size:13px;font-weight:650;min-height:44px}
#continue-learning:hover:not(:disabled){background:#d3e5f5;border-color:#d3e5f5}
#continue-learning span{font-size:19px;font-weight:400}
.course-group{margin:26px 0 32px}
.course-group-heading{display:flex;align-items:baseline;gap:12px;margin-bottom:14px;color:#e7e8ec;font-size:18px;letter-spacing:-.5px;font-weight:700}
.course-group-heading h2,.course-group-heading h3{font-size:18px;line-height:1.4;margin:0;font-weight:700;color:var(--tone)}
.course-group-heading p,.course-group-heading small,.course-group-heading span{font-size:12px;letter-spacing:0;color:var(--muted);font-weight:450;margin:0}
.course-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.course-card{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);align-content:start;gap:7px 8px;width:100%;min-width:0;min-height:152px;padding:17px;text-align:left;border:1px solid rgba(var(--tone-rgb),.19);border-radius:11px;background:var(--tone-surface);overflow:hidden;box-shadow:var(--shadow-card)}
.course-card::before{content:'';position:absolute;inset:0 auto 0 0;width:2px;background:rgba(var(--tone-rgb),.48);pointer-events:none}
.course-card:hover:not(:disabled){background:var(--tone-hover);border-color:rgba(var(--tone-rgb),.55);transform:translateY(-2px);box-shadow:0 6px 16px #0004,inset 0 1px 0 #ffffff08}
.course-number{grid-column:1;grid-row:span 2;font-size:11px;color:var(--tone);font-weight:700;letter-spacing:.4px;padding-top:4px;font-variant-numeric:tabular-nums}
.course-title{grid-column:2;font-size:16px;font-weight:700;line-height:1.45;letter-spacing:-.4px;color:#e9ebef}
.course-description{grid-column:2;font-size:12px;font-weight:400;color:#b0b6bf;line-height:1.65;overflow-wrap:anywhere}
.course-thumb{grid-column:1/-1;width:calc(100% + 34px);max-width:none;height:105px;object-fit:cover;margin:-17px -17px 8px;filter:saturate(.75)}
.course-progress{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin-top:14px;font-size:11px;color:#a3aab4;line-height:1.3}
.course-progress progress{appearance:none;-webkit-appearance:none;flex:1;width:100%;min-width:20px;height:3px;border:0;border-radius:2px;overflow:hidden;background:#3a3f47}
.course-progress progress::-webkit-progress-bar{background:#3a3f47;border-radius:2px}
.course-progress progress::-webkit-progress-value{background:var(--tone);border-radius:2px}
.course-progress progress::-moz-progress-bar{background:var(--tone);border-radius:2px}
.course-progress>span{white-space:nowrap}
.workspace{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(370px,1.06fr);gap:18px;min-width:0}
.watch{min-width:0;min-height:0;display:flex;flex-direction:column}
.video-picker{display:flex;align-items:center;gap:6px;flex-shrink:0;margin-bottom:8px;min-width:0}
.video-picker select{flex:1;width:0;min-height:40px;padding:8px 10px;font-size:12px}
.video-picker>button{padding:8px;width:40px;flex-shrink:0;min-height:40px;font-size:17px;background:transparent}
.player{flex-shrink:0;width:100%;aspect-ratio:16/9;background:#08090a;border:1px solid #414f5d;border-radius:9px;overflow:hidden;position:relative;max-height:46dvh;box-shadow:var(--shadow-soft)}
.player iframe{display:block;border:0;width:100%;height:100%}
.player-empty{display:grid;place-items:center;height:100%;color:var(--muted);font-size:13px}
.poster{width:100%;height:100%;border:0;border-radius:0;padding:0;background:#08090a;position:relative;overflow:hidden}
.poster img{width:100%;height:100%;object-fit:cover;opacity:.8}
.play-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:linear-gradient(transparent,rgba(0,0,0,.5));text-shadow:0 1px 4px #000;font-size:12px}
.play-icon{background:#d2e2f1;color:#181b20;width:58px;height:58px;display:grid;place-items:center;border-radius:50%;font-size:20px;text-shadow:none;padding-left:3px;box-shadow:0 3px 20px #0006}
.watch-detail{overflow:auto;overscroll-behavior:contain;flex:1;min-height:0;padding:16px 2px 4px;scrollbar-width:thin;scrollbar-color:#444851 transparent}
.video-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:11px;color:var(--muted);line-height:1.5}
.video-meta a{margin-left:auto;font-size:11px;min-height:24px;display:flex;align-items:center}
.pill{color:#c2d9ee;background:#283746;padding:4px 7px;font-size:10px;border-radius:4px}
h2{font-size:22px;letter-spacing:-.65px;line-height:1.5;margin:12px 0 8px;font-weight:700}
.watch-detail h2{font-size:20px;line-height:1.5;margin:10px 0 7px}
.muted{color:var(--muted);font-size:12px;line-height:1.75;margin:7px 0}
.warning{font-size:12px;color:#d4c8af;background:#2a2722;border-left:2px solid #92866f;line-height:1.75;padding:10px 12px;margin:10px 0}
.watch-actions{display:flex;gap:7px;margin:15px 0 10px;flex-wrap:wrap}
.watch-actions button{font-size:12px;min-height:40px}
.watch-actions button:last-child{margin-left:auto}
#favorite[aria-pressed=true]{color:#f0d4ad;background:#393026;border-color:#8e7353}
.library{min-height:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;background:var(--panel);overflow:hidden;min-width:0;box-shadow:var(--shadow-soft)}
.tabs{display:flex;flex-shrink:0;border-bottom:1px solid var(--line);padding:0 8px;gap:2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#4b505a transparent;min-height:49px;background:#1d232a}
.tabs button{flex:1 0 auto;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:12px 10px;color:#a8aeb8;font-size:12px;white-space:nowrap;font-weight:550;min-height:47px}
.tabs button:hover:not(:disabled){background:#24282e}
.tabs [aria-selected=true]{border-bottom-color:#a8c7e5;color:#dbeafa;background:#293643}
.tabs span{font-size:10px;margin-left:4px;color:#969da8;font-weight:450}
.tab-panel{display:flex;flex-direction:column;min-height:0;min-width:0;flex:1;overflow:hidden}
#summary-frame{display:block;width:100%;height:100%;flex:1;min-height:0;border:0;background:#171719}
.library-controls{padding:13px 14px 12px;border-bottom:1px solid var(--line);flex-shrink:0}
.library-controls>summary{cursor:pointer;min-height:40px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;list-style:none}
.library-controls>summary::-webkit-details-marker{display:none}
.library-controls>summary::before{content:'›';font-size:19px;font-weight:400;width:12px;line-height:1;text-align:center;transform-origin:center}
.library-controls[open]>summary::before{transform:rotate(90deg)}
.library-controls>summary>span{font-size:11px;font-weight:400;color:var(--muted);margin-left:auto}
.library-controls[open]>summary{margin-bottom:8px}
.division-scope{display:flex;align-items:center;gap:9px;min-height:40px;margin-top:5px;font-size:11px;line-height:1.5;color:var(--muted);cursor:pointer}
.division-scope input{width:17px;height:17px;min-height:17px;flex:0 0 17px;margin:0;padding:0;accent-color:var(--accent);cursor:pointer}
.search{display:flex;align-items:center;gap:9px}
.search>span{font-size:25px;line-height:1;color:#9aa2ae}
.search input{font-size:12px;padding:9px 10px}
.filters{display:flex;gap:5px;margin-top:9px;flex-wrap:wrap;align-items:center}
.filters button{font-size:11px;padding:8px 10px;border-radius:6px;min-height:40px;background:transparent}
.filters button[aria-pressed=true]{background:#283543;border-color:#6785a0;color:#d7e8f8}
#result-count{font-size:11px;color:var(--muted);margin-left:auto;font-variant-numeric:tabular-nums}
.summary-batch{display:flex;gap:10px;justify-content:space-between;align-items:center;padding:8px 14px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted);flex-shrink:0}
.summary-batch>span{min-width:0;line-height:1.6}
.summary-batch button{font-size:11px;padding:8px 10px;white-space:nowrap;min-height:40px}
.summary-badge{color:#d0d4dc}
.scroll{overflow:auto;overscroll-behavior:contain;min-height:0;flex:1;scrollbar-width:thin;scrollbar-color:#4b505a transparent}
#panel-videos:has(.library-controls[open]){overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#4b505a transparent}
#panel-videos:has(.library-controls[open]) #video-list{flex:none;overflow:visible}
.video-card{display:grid;grid-template-columns:116px minmax(0,1fr);width:100%;gap:13px;text-align:left;border:0;border-bottom:1px solid #30343b;background:transparent;border-radius:0;padding:15px;position:relative;align-items:start}
.video-card:hover:not(:disabled){background:#25292f}
.video-card.active{background:#26333f;box-shadow:inset 3px 0 #a8c7e5}
.thumb{width:116px;aspect-ratio:16/9;border-radius:5px;object-fit:cover;background:#111}
.video-info{display:flex;flex-direction:column;gap:5px;min-width:0}
.video-info strong{font-weight:650;font-size:13px;line-height:1.55;overflow-wrap:anywhere}
.video-info small{font-size:11px;line-height:1.6}
.card-tags{display:flex;flex-wrap:wrap;gap:5px 8px;font-size:10px;color:#a1a9b5}
.card-tags b{color:#dbdfe6;font-weight:500}
.lesson-number{font-size:11px;letter-spacing:.5px;font-variant-numeric:tabular-nums;color:#a0a8b5}
.video-card>.lesson-number{position:absolute;top:19px;left:19px;padding:2px 5px;background:#111c;border-radius:3px;color:#eceef1}
.card-progress{font-size:11px;color:#c5d9e9;line-height:1.6}
.empty{padding:26px;color:var(--muted);line-height:1.9;font-size:13px}
.lesson,.journal{padding:22px}
.notice{font-size:11px;color:var(--muted);line-height:1.8;padding:12px 0;border-bottom:1px solid var(--line);margin:0 0 20px}
.lesson h2{font-size:25px;margin:8px 0 12px;line-height:1.4}
.lesson h3{font-size:15px;font-weight:700;margin:24px 0 10px}
.lesson p,.lesson li{font-size:14px;line-height:1.9;overflow-wrap:anywhere}
.lesson ol,.lesson ul{padding-left:22px}
.lesson li{margin-bottom:9px;padding-left:3px}
.lesson-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 20px}
.lesson-levels button{font-size:12px;line-height:1.4;word-break:keep-all;min-height:42px;white-space:normal;padding:8px 6px}
.lesson-levels .active,.lesson-levels [aria-pressed=true]{background:#b8d0e6;color:#192430;border-color:#b8d0e6;box-shadow:0 2px 8px #0002}
.lesson-summary{font-size:14px;line-height:1.9;padding-bottom:15px;color:#bdc3cd}
.lesson-summary p{margin:0 0 10px}
.lesson-section{border-top:1px solid var(--line);padding:0;margin:0}
.lesson-section>summary{cursor:pointer;min-height:54px;padding:15px 3px;font-size:14px;font-weight:650;list-style-position:inside;line-height:1.7}
.lesson-section[open]>summary{color:#c9dff3}
.lesson-section>summary::marker{font-size:11px;color:#8f97a3}
.lesson-section>p,.lesson-section>ul,.lesson-section>ol{margin-top:0}
.division-guide,.level-drill,.rule-box{padding:16px 18px;background:#24303b;border-left:2px solid #8cabca;border-radius:0 6px 6px 0;margin:18px 0;box-shadow:0 2px 8px #0002}
.level-drill{background:#302a23;border-left-color:#c3a177}
.rule-box{background:#2a2632;border-left-color:#ad9ac9}
.division-guide strong,.level-drill strong,.rule-box strong{color:#e8ebef;font-size:14px;font-weight:650}
.division-guide p,.level-drill p,.rule-box p{margin:6px 0 0;font-size:13px;color:#b8c0cc;line-height:1.8}
.division-guide h3,.level-drill h3{margin:0 0 8px}
.mistake{margin:15px 0}
.mistake strong{font-size:14px;font-weight:650}
.mistake p{margin:5px 0;color:#aeb7c3}
.source-list{border-top:1px solid var(--line);padding-top:16px;margin-top:24px}
.source-list small{font-size:11px;line-height:1.7}
.source-list a{display:block;font-size:11px;color:var(--muted);padding:7px 0;line-height:1.7;overflow-wrap:anywhere}
.journal-heading h2{font-size:23px;margin:10px 0}
.journal-heading p{font-size:13px;color:var(--muted);line-height:1.9;margin:0 0 25px}
#note-editor{padding:0;min-width:0}
.note-label{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-bottom:10px}
#note-editor label{font-size:13px;font-weight:600}
#insert-timestamp{font-size:11px;min-height:40px;padding:8px 10px;white-space:nowrap}
#note{min-height:220px;font-size:14px;line-height:1.9;max-height:none;resize:vertical;padding:15px;background:#14171b}
#note-editor>small{display:block;font-size:11px;line-height:1.8;margin-top:10px}
.note-timestamps{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.note-timestamps:empty{display:none}
.note-timestamps button{font-size:11px;min-height:40px;padding:8px 10px;background:transparent}
.reference-header{padding:18px;border-bottom:1px solid var(--line);font-size:14px;flex-shrink:0}
.reference-header p{font-size:12px;color:var(--muted);line-height:1.8;margin:7px 0 11px}
.reference-header input{font-size:12px;margin-top:12px;padding:9px 10px}
.archive-button{display:flex;gap:10px;align-items:center;padding:11px 12px;background:#2a2f36;border:1px solid #4c5561;border-radius:6px;color:#dce1e8;font-size:12px;min-height:42px}
.archive-button span{margin-left:auto;font-size:11px;white-space:nowrap;color:#acb4c0}
.reference{padding:18px;border-bottom:1px solid var(--line)}
.reference .kicker{color:#b2bbc8;font-size:10px;letter-spacing:1px;text-transform:uppercase}
.reference h3{font-size:14px;line-height:1.75;margin:9px 0;overflow-wrap:anywhere}
.reference p{font-size:12px;color:var(--muted);line-height:1.9;margin:9px 0;overflow-wrap:anywhere}
.reference details{font-size:11px;color:var(--muted);line-height:1.8;margin-top:12px}
.reference summary{cursor:pointer;min-height:40px;padding:9px 0}
.file-link{display:inline-flex;align-items:center;min-height:40px;font-size:11px;padding:8px 10px;border:1px solid var(--line);border-radius:5px;margin:5px 5px 0 0}
.hash{overflow-wrap:anywhere;font:10px/1.8 ui-monospace,monospace;margin:5px 0 10px}
.error{position:absolute;bottom:18px;right:24px;left:24px;background:#352522;color:#f4ccc6;padding:15px;font-size:13px;border:1px solid #8b5d56;border-radius:8px;z-index:5;max-height:30%;overflow:auto}
@media(min-width:1600px){:root{--sidebar-width:218px}main{padding:calc(24px * var(--heading-space-scale)) 34px 24px}.workspace{gap:24px;grid-template-columns:minmax(0,1.12fr) minmax(420px,1fr)}.course-cards{gap:16px}.course-card{padding:21px}.course-thumb{width:calc(100% + 42px);margin:-21px -21px 8px;height:135px}.video-card{grid-template-columns:145px minmax(0,1fr)}.thumb{width:145px}}
@media(max-width:1200px){:root{--sidebar-width:174px}.app-header{gap:18px}main{padding:calc(17px * var(--heading-space-scale)) 17px 17px}.workspace{gap:14px;grid-template-columns:minmax(0,1fr) minmax(330px,1fr)}.division-label>span{display:none}.course-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.watch-detail h2{font-size:18px}.video-card{grid-template-columns:96px minmax(0,1fr);padding:13px;gap:10px}.thumb{width:96px}.tabs{padding:0 5px}.tabs button{padding-left:9px;padding-right:9px}.study-controls{gap:8px}}
@media(max-width:960px){:root{--header-height:49px}.sidebar{display:none}.shell{grid-template-columns:minmax(0,1fr)}.app-header{gap:16px;padding-right:max(16px,env(safe-area-inset-right));padding-left:max(16px,env(safe-area-inset-left))}.brand{font-size:20px}main{padding:calc(14px * var(--heading-space-scale)) 14px 14px}.workspace{grid-template-columns:minmax(0,1fr) minmax(320px,1.05fr);gap:12px}.course-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.course-group-heading{flex-wrap:wrap;gap:5px 12px}.topic-heading{gap:calc(8px * var(--heading-space-scale)) 12px;margin-bottom:calc(12px * var(--heading-space-scale))}.video-info strong{font-size:12px}.video-card{grid-template-columns:89px minmax(0,1fr);gap:10px}.thumb{width:89px}.lesson,.journal{padding:18px}.tabs button{font-size:12px}.watch-actions{gap:5px}.watch-actions button{padding:8px 9px;font-size:11px}.sync{font-size:11px}}
@media(max-width:760px){body[data-screen=study] .topic-title-group>div{display:none}body[data-screen=study] #mobile-topic{display:block;flex:1;min-width:70px;font-size:12px;width:0}.topic-heading{gap:calc(8px * var(--heading-space-scale)) 8px}.topic-title-group{gap:0}.division-label select{max-width:182px;font-size:12px}#study-progress{font-size:11px}#next-unseen{font-size:11px;padding:8px;min-height:40px}.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.watch-detail h2{font-size:17px}.video-meta a{margin-left:0}.course-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.header-home{padding:8px;font-size:11px}.brand{font-size:18px}.app-header{gap:12px}.sync{font-size:10px;line-height:1.5}.reference-header{padding:14px}.reference-header p{font-size:11px}.summary-batch{padding:7px 10px}.summary-batch button{padding:8px;font-size:10px}.library-controls{padding:10px}.filters{gap:4px}.filters button{font-size:10px;padding:8px}.video-card{grid-template-columns:80px minmax(0,1fr);padding:11px;gap:9px}.thumb{width:80px}.watch-actions button:last-child{margin-left:0}.video-picker select{padding:8px;font-size:11px}.watch-detail{padding-top:12px}.watch-actions{margin-top:10px}}
@media(max-width:600px){:root{--header-height:48px}.app-header{gap:11px;padding-right:max(12px,env(safe-area-inset-right));padding-left:max(12px,env(safe-area-inset-left))}.back{font-size:10px}.brand{font-size:17px;letter-spacing:-.5px}.header-home{display:none}.sync{font-size:10px;max-width:112px;text-align:right;gap:4px}.sync button{font-size:10px;padding:5px}main{padding:calc(9px * var(--heading-space-scale)) 9px 10px}.topic-heading{margin-bottom:calc(9px * var(--heading-space-scale));gap:calc(7px * var(--heading-space-scale)) 7px}h1{font-size:23px}.division-label{max-width:46%}.division-label select{width:100%;max-width:170px;font-size:11px;padding:8px}body[data-screen=study] #mobile-topic{font-size:11px;padding:8px}.study-controls{gap:7px}#next-unseen{font-size:10px;padding:8px 7px}#study-progress{font-size:10px}.workspace{display:flex;flex-direction:column;gap:9px}.watch{flex:0 0 auto;min-height:0}.video-picker{margin-bottom:6px}.video-picker select{font-size:12px;min-height:40px}.video-picker>button{font-size:17px}.player{aspect-ratio:16/9;max-height:26dvh;border-radius:7px}.watch-detail{flex:none;max-height:111px;padding:7px 1px 0}.watch-detail h2{font-size:14px;line-height:1.55;margin:5px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-meta{font-size:10px;gap:5px}.video-meta a{font-size:10px;min-height:18px;margin-left:auto}.pill{font-size:9px;padding:2px 5px}.watch-detail .muted{font-size:11px;line-height:1.65}.watch-actions{margin:7px 0 4px;gap:6px}.watch-actions button{font-size:11px;padding:8px 10px;min-height:40px}.watch-actions button:last-child{margin-left:auto}.library{flex:1;min-height:0;border-radius:8px}.tabs{min-height:45px;gap:1px;padding:0 4px}.tabs button{padding:10px 10px;font-size:12px;min-height:43px}.video-card{grid-template-columns:104px minmax(0,1fr);padding:12px;gap:12px}.thumb{width:104px}.video-info strong{font-size:13px}.video-info small{font-size:11px}.library-controls{padding:9px 11px}.filters{margin-top:7px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}.filters button{white-space:nowrap;flex-shrink:0;font-size:11px;padding:8px 9px}.filters #result-count{white-space:nowrap;flex-shrink:0}.summary-batch{font-size:10px;padding:6px 11px}.summary-batch button{font-size:10px;min-height:40px;padding:8px}.lesson,.journal{padding:18px 16px}.lesson h2{font-size:23px}.lesson p,.lesson li{font-size:13px}.journal-heading h2{font-size:22px}.journal-heading p{font-size:12px;margin-bottom:20px}#note{font-size:13px;min-height:230px}.note-label{gap:8px}#note-editor label{font-size:12px}#insert-timestamp{font-size:10px}.reference-header{padding:13px}.reference-header strong{font-size:13px}.reference-header p{margin:7px 0;font-size:11px}.reference-header input{margin-top:9px}.archive-button{font-size:11px;padding:9px 10px}.reference{padding:16px}.reference h3{font-size:13px}.reference p{font-size:12px}.play-icon{width:48px;height:48px;font-size:17px}.play-overlay{font-size:11px;gap:8px}.error{bottom:10px;left:9px;right:9px;font-size:12px}#home-progress{font-size:15px}#continue-learning{font-size:12px;min-height:44px}.course-group{margin:23px 0 27px}.course-group-heading{font-size:18px;gap:6px;margin-bottom:12px}.course-group-heading h2,.course-group-heading h3{font-size:18px}.course-group-heading p,.course-group-heading small,.course-group-heading span{font-size:11px;width:100%}.course-cards{gap:9px}.course-card{padding:13px;grid-template-columns:23px minmax(0,1fr);gap:5px 5px;min-height:144px;border-radius:9px}.course-number{font-size:10px;padding-top:3px}.course-title{font-size:14px;letter-spacing:-.3px}.course-description{font-size:11px;line-height:1.7}.course-progress{font-size:10px;margin-top:13px;gap:6px;flex-wrap:wrap}.course-thumb{width:calc(100% + 26px);height:88px;margin:-13px -13px 7px}.course-progress progress{flex-basis:100%;height:3px}.course-progress>span{font-size:10px}#home-view{padding-bottom:25px}}
@media(max-height:550px) and (min-width:601px){:root{--header-height:44px}.app-header{gap:16px}.brand{font-size:18px}.shell{min-height:0}main{padding:calc(7px * var(--heading-space-scale)) 10px 8px}.topic-heading{margin-bottom:calc(7px * var(--heading-space-scale));gap:calc(5px * var(--heading-space-scale)) 10px}.topic-heading h1{font-size:19px}.topic-heading .eyebrow{display:none}.topic-title-group{gap:8px}#back-courses{min-height:40px;height:40px;width:40px;font-size:17px}.topic-heading select{padding:7px 9px;min-height:40px}#study-progress{font-size:10px}#next-unseen{min-height:40px;font-size:10px;padding:5px 8px}.study-controls{gap:8px}.player{max-height:calc(100dvh - 245px);border-radius:6px}.video-picker{margin-bottom:5px}.video-picker>button,.video-picker select{min-height:40px;height:40px;padding:6px 8px}.video-picker>button{width:40px}.watch-detail{padding:6px 1px;min-height:0}.watch-detail h2{font-size:14px;margin:4px 0}.video-meta,.video-meta a{font-size:10px}.watch-actions{margin:8px 0}.watch-actions button{min-height:40px;font-size:10px}.tabs{min-height:43px}.tabs button{min-height:41px;font-size:11px;padding:9px}.library-controls{padding:7px 10px}.search input{min-height:40px;padding:6px 9px;font-size:11px}.filters{margin-top:5px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.filters button{min-height:40px;font-size:10px;padding:6px 8px;white-space:nowrap;flex-shrink:0}#result-count{white-space:nowrap}.summary-batch{padding:4px 10px;font-size:10px}.summary-batch button{min-height:40px;padding:6px 8px;font-size:10px}.reference-header{padding:9px 12px}.reference-header p{display:none}.archive-button{padding:6px 9px;min-height:40px;margin-top:7px;font-size:11px}.reference-header input{min-height:40px;margin-top:7px;padding:6px 9px}.lesson,.journal{padding:16px}#home-progress{font-size:14px}.course-group{margin:20px 0}}
@media(max-width:360px){.app-header{gap:9px}.brand{font-size:15px}.sync{max-width:86px;font-size:9px}.back{font-size:9px}#next-unseen{font-size:9px;padding:8px 5px}.study-controls{gap:5px}.division-label{max-width:44%}.video-card{grid-template-columns:86px minmax(0,1fr);gap:9px}.thumb{width:86px}.course-card{padding:11px;grid-template-columns:20px minmax(0,1fr)}.course-thumb{width:calc(100% + 22px);margin:-11px -11px 6px}.course-title{font-size:13px}.course-description{font-size:10px}.watch-actions button{font-size:10px;padding:8px}}
@media(prefers-reduced-motion:no-preference){button,a{transition:background-color .14s,border-color .14s,color .14s}.course-card{transition:transform .16s,background-color .16s,border-color .16s}}

/* The source library is a top-level destination, including on narrow screens. */
.sidebar-resources{margin-top:calc(25px * var(--nav-spacing));border-top:1px solid var(--line)}
.resource-nav{width:100%;display:flex;align-items:center;gap:8px;text-align:left;font-size:13px;min-height:32px;padding:5px 8px;background:transparent;border-color:transparent}
.resource-nav span{font-size:16px;color:#b5aacb}
.resource-nav[aria-current=true]{background:#292532;border-color:#574c69;box-shadow:inset 2px 0 #baaad7}
body[data-screen=references]{--heading-space-scale:.49}
@media(max-width:960px){#mobile-topic,body[data-screen=study] #mobile-topic{display:block;font-size:12px;max-width:190px;min-width:100px;flex:1;margin-left:auto}body[data-screen=home] #mobile-topic,body[data-screen=references] #mobile-topic{flex:0 1 170px}body[data-screen=home] .division-label{width:auto;max-width:none}body[data-screen=references] .topic-title-group>div{display:block}}
@media(max-width:600px){body[data-screen=home] #mobile-topic,body[data-screen=references] #mobile-topic{flex-basis:120px;max-width:140px;font-size:11px}body[data-screen=references] h1{font-size:21px}body[data-screen=references] .topic-title-group{gap:8px}}

/* The home title, selectors and progress share one header. */
@media(max-width:1100px){
  body[data-screen=home] .topic-heading{grid-template-columns:minmax(140px,1fr) auto auto;gap:8px 12px}
  body[data-screen=home] .topic-title-group{grid-row:1}
  body[data-screen=home] .home-learning{grid-column:1/-1;justify-content:space-between}
}
@media(max-width:960px){
  body[data-screen=home] .topic-heading{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}
  body[data-screen=home] .topic-title-group{grid-column:1/3;grid-row:1}
  body[data-screen=home] .topic-heading .history-launch{grid-column:3;grid-row:1}
  body[data-screen=home] #mobile-topic{grid-column:1;grid-row:2;width:100%;max-width:none;margin:0;min-width:0}
  body[data-screen=home] .division-label{grid-column:2/4;grid-row:2;justify-self:stretch}
  body[data-screen=home] .division-label select{flex:1;max-width:none}
  body[data-screen=home] .home-learning{grid-column:1/-1;grid-row:3}
}
@media(max-width:600px){
  body[data-screen=home] .topic-heading{padding-bottom:10px;gap:8px}
  body[data-screen=home] .topic-heading .eyebrow{display:none}
  body[data-screen=home] .topic-heading h1{font-size:23px}
  body[data-screen=home] .division-label>span{display:none}
  .home-learning #home-progress{font-size:10px;flex:1;min-width:0}
  .home-learning #continue-learning{max-width:48%;font-size:10px}
}

/* Progress shares the video toolbar: no separate fixed status row. */
.video-picker .study-controls{gap:7px;flex:none;margin-left:3px;padding-left:9px;border-left:1px solid var(--line)}
.video-picker #study-progress{font-size:11px}
.video-picker #next-unseen{width:auto;font-size:11px;min-height:40px;padding:8px;white-space:nowrap}
@container (max-width:500px){
  .video-picker .study-controls{gap:5px;padding-left:5px;margin-left:0}
  .video-picker #next-unseen{width:40px;font-size:17px;padding:8px}
  .video-picker .next-unseen-label{display:none}
}
@media(min-width:1400px){
  body[data-screen=home] .topic-heading{grid-template-columns:minmax(150px,1fr) minmax(200px,auto) auto auto;gap:12px}
  body[data-screen=home] .home-learning{grid-column:2;grid-row:1;flex-direction:column;align-items:flex-end;gap:3px}
  body[data-screen=home] .division-label{grid-column:3;grid-row:1}
  body[data-screen=home] .topic-heading .history-launch{grid-column:4;grid-row:1}
}

/* Keep the existing type size; halve empty leading and vertical block gaps. */
.lesson{padding:11px 22px}
.lesson h2{margin:4px 0 6px}
.lesson p,.lesson li{line-height:1.45}
.lesson li{margin-bottom:4.5px}
.lesson-levels{margin-bottom:10px}
.lesson-summary{line-height:1.45;padding-bottom:7.5px;margin-block:7px}
.lesson-summary p{margin-bottom:5px}
.lesson-section>summary{min-height:40px;padding:7.5px 3px;line-height:1.4}
.lesson .division-guide,.lesson .level-drill,.lesson .rule-box{padding:8px 18px;margin:9px 0}
.lesson .division-guide p,.lesson .level-drill p,.lesson .rule-box p{margin-top:3px;line-height:1.4}
.lesson .mistake{margin:7.5px 0}
.lesson .mistake p{margin:2.5px 0}
.lesson .source-list{padding-top:8px;margin-top:12px}
.posture-frame{margin:8px 0 12px;max-width:640px}
.posture-seek{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--panel)}
.posture-seek img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.posture-frame figcaption{display:flex;flex-direction:column;gap:3px;padding:5px 0;font-size:12px;line-height:1.4}
.posture-frame small{color:var(--muted);font-size:11px}
.watch-actions{flex-wrap:wrap}
#video-library-open{white-space:nowrap}
#total-videos{font-size:11px;color:var(--muted);margin-left:4px}
#video-library-dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:0;width:min(720px,calc(100vw - 24px));max-height:85dvh;overflow:hidden}
#video-library-dialog::backdrop{background:#0008}
.video-library-head{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;border-bottom:1px solid var(--line)}
.video-library-head h2{font-size:16px;margin:0}
.video-library-head button{min-width:40px;min-height:40px;font-size:24px;padding:0}
#video-library-content{display:flex;flex-direction:column;max-height:calc(85dvh - 58px);min-height:0}
#video-library-content .library-controls{flex:none}
#video-library-content .summary-batch{flex:none}
#video-library-content #video-list{overflow:auto;min-height:0;overscroll-behavior:contain}
@media(max-width:600px){.watch-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.lesson{padding:10px 14px}.posture-frame figcaption{font-size:12px}}
