@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/ibm-plex-sans-latin-300-normal.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/ibm-plex-sans-latin-400-italic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2')}
/* ─── SITE FOOTER ─── */
.site-footer{border-top:1px solid var(--border);margin-top:64px;padding:38px 0 46px;background:var(--surface-1)}
.site-footer .ftin{max-width:960px;margin:0 auto;padding:0 48px}
.site-footer .ft-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:26px;margin-bottom:22px}
.site-footer .ft-h{font-size:.6875rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.site-footer p{font-size:.8125rem;color:var(--text-secondary);line-height:1.65}
.site-footer a{color:var(--primary);text-decoration:underline}
.site-footer a:hover{text-decoration:none}
.site-footer .ft-base{font-size:.75rem;color:var(--text-muted);border-top:1px solid var(--border);padding-top:16px;line-height:1.6}
@media(max-width:640px){.site-footer .ftin{padding:0 20px}}
/* ─── TOKENS ─────────────────────────────────────────────── */
:root{
  --font-sans:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',Menlo,monospace;
}
[data-theme="light"]{
  --bg:#f4f1ea; --surface:#ffffff; --surface-1:#eae6dd; --surface-2:#dcd7cc;
  --border:#e0dcd2; --border-strong:#161616;
  --text:#161616; --text-secondary:#525252; --text-muted:#595959;
  --hover:#f4f4f4;
  --primary:#0043ce; --primary-bg:#0f62fe; --primary-fg:#ffffff; --primary-hover:#0050e6; --primary-faint:#edf5ff;
  --blue:#0f62fe; --purple:#8a3ffc; --orange:#a04200; --green:#0e6e2e; --red:#a2191f; --yellow:#6b5000;
  --footer-bg:#161616; --footer-surface:#262626; --footer-ink:#ffffff; --footer-ink-muted:#c6c6c6;
}
[data-theme="dark"]{
  --bg:#161616; --surface:#262626; --surface-1:#2e2e2e; --surface-2:#393939;
  --border:#393939; --border-strong:#f4f4f4;
  --text:#f4f4f4; --text-secondary:#c6c6c6; --text-muted:#a0a0a0;
  --hover:#333333;
  --primary:#78a9ff; --primary-bg:#0f62fe; --primary-fg:#ffffff; --primary-hover:#0353e9; --primary-faint:#1c2a41;
  --blue:#78a9ff; --purple:#be95ff; --orange:#ff832b; --green:#42be65; --red:#ff8389; --yellow:#f1c21b;
  --footer-bg:#0b0b0b; --footer-surface:#262626; --footer-ink:#ffffff; --footer-ink-muted:#c6c6c6;
}

/* ─── REDUCED MOTION ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ─── RESET / BASE ───────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--font-sans);background:var(--bg);color:var(--text);line-height:1.5;letter-spacing:.16px;-webkit-font-smoothing:antialiased}
img{max-width:100%}
button{font-family:inherit}
a{color:var(--primary)}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--primary-bg);color:#fff;padding:10px 16px;z-index:1000}
.skip-link:focus{left:0}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* ─── LAYOUT ─────────────────────────────────────────────── */
#app{display:flex;min-height:100vh;min-height:100dvh}
#main{flex:1;min-width:0;height:100vh;height:100dvh;overflow-y:auto}
.page{animation:fadeUp .22s ease-out}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.wrap{max-width:960px;margin:0 auto;padding:0 48px}
@media(max-width:640px){.wrap{padding:0 20px}}

/* ─── SIDE NAV ───────────────────────────────────────────── */
#sidenav{width:264px;flex-shrink:0;height:100vh;position:sticky;top:0;background:var(--bg);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:50}
.nav-brand{padding:20px 16px;border-bottom:1px solid var(--border);position:relative}
.nav-brand .t1{font-weight:600;font-size:.9375rem;color:var(--text);line-height:1.3}
.nav-brand .t2{font-size:.75rem;color:var(--text-muted);margin-top:3px;letter-spacing:.32px}
.nav-scroll{flex:1;overflow-y:auto;padding:4px 0 8px}
.nav-divider{padding:18px 16px 6px;font-size:.6875rem;font-weight:500;letter-spacing:.6px;text-transform:uppercase;color:var(--text-muted);border-top:1px solid var(--border);margin-top:8px}
.nav-divider:first-child{border-top:none;margin-top:0}
.nav-item{display:flex;align-items:center;gap:11px;width:100%;min-height:38px;padding:8px 16px;border:none;cursor:pointer;font-size:.875rem;letter-spacing:.16px;background:transparent;color:var(--text-secondary);border-left:3px solid transparent;text-align:left;transition:background .11s,color .11s;text-decoration:none}
.nav-item:hover{background:var(--hover);color:var(--text)}
.nav-item.active{background:var(--surface-1);color:var(--text);font-weight:600;border-left-color:var(--primary)}
.nav-dot{width:9px;height:9px;flex-shrink:0}
.nav-check{margin-left:auto;font-size:.6875rem;color:var(--green);letter-spacing:.32px}
.theme-toggle{padding:13px 16px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:transparent;border-left:none;border-right:none;border-bottom:none;cursor:pointer;width:100%}
.theme-toggle:hover{background:var(--hover)}
.theme-toggle .lab{font-size:.875rem;color:var(--text-secondary)}
.toggle-track{width:32px;height:16px;border:1px solid var(--border-strong);position:relative;flex-shrink:0}
.toggle-knob{position:absolute;top:2px;left:2px;width:11px;height:11px;background:var(--border-strong);transition:left .15s}
[data-theme="dark"] .toggle-knob{left:17px}

/* ─── SCHOOL SWITCH (AHS / BHS) ──────────────────────────── */
.school-switch{display:flex;gap:0;padding:10px 16px;border-bottom:1px solid var(--border)}
.school-btn{flex:1;padding:7px 8px;font-size:.8125rem;font-weight:600;letter-spacing:.32px;color:var(--text-secondary);background:transparent;border:1px solid var(--border-strong);cursor:pointer;transition:background .11s,color .11s}
.school-btn + .school-btn{border-left:none}
.school-btn:hover{background:var(--hover);color:var(--text)}
.school-btn.active{background:var(--primary-bg);color:var(--primary-fg);border-color:var(--primary-bg)}
.school-btn:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}
.school-btn.active:focus-visible{outline-color:var(--primary-fg)}

/* ─── FIRST-VISIT SCHOOL CHOOSER ─────────────────────────── */
.school-chooser{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);padding:20px}
.school-chooser .sc-box{background:var(--surface);border:1px solid var(--border-strong);max-width:520px;width:100%;padding:30px 30px 26px}
.school-chooser .sc-title{font-size:1.3rem;font-weight:600;letter-spacing:-.2px;margin-bottom:10px;color:var(--text)}
.school-chooser .sc-sub{font-size:.9rem;color:var(--text-secondary);line-height:1.55;margin-bottom:22px}
.school-chooser .sc-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.school-chooser .sc-card{display:flex;flex-direction:column;gap:6px;text-align:left;padding:16px;background:var(--surface-1);border:1px solid var(--border-strong);cursor:pointer;transition:background .11s,border-color .11s}
.school-chooser .sc-card:hover{background:var(--primary-faint);border-color:var(--primary)}
.school-chooser .sc-k{font-size:1.05rem;font-weight:600;color:var(--text)}
.school-chooser .sc-d{font-size:.78rem;color:var(--text-muted);line-height:1.5}
.school-chooser .sc-note{font-size:.75rem;color:var(--text-muted);margin-top:16px}
.school-chooser .sc-card:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
@media(max-width:520px){.school-chooser .sc-cards{grid-template-columns:1fr}}

/* ─── MOBILE NAV ─────────────────────────────────────────── */
.mobile-bar{display:none;position:fixed;top:0;left:0;right:0;z-index:100;height:50px;background:var(--bg);border-bottom:1px solid var(--border);padding:0 14px;align-items:center;justify-content:space-between}
.mobile-bar .t1{font-weight:600;font-size:.9rem}
.burger{background:none;border:1px solid var(--border-strong);color:var(--text);font-size:1rem;padding:5px 12px;cursor:pointer}
@media(max-width:840px){
  #sidenav{position:fixed;left:0;top:50px;height:calc(100vh - 50px);transform:translateX(-100%);transition:transform .2s;box-shadow:4px 0 16px rgba(0,0,0,.15)}
  #sidenav.open{transform:translateX(0)}
  .mobile-bar{display:flex}
  #main{height:auto;min-height:100vh;padding-top:50px}
  .nav-overlay{position:fixed;inset:50px 0 0 0;background:rgba(0,0,0,.4);z-index:40}
}

/* ─── TYPO BLOCKS ────────────────────────────────────────── */
.page-head{padding:52px 0 0;border-bottom:1px solid var(--border)}
.page-head .inner{max-width:960px;margin:0 auto;padding:0 48px}
@media(max-width:640px){.page-head .inner{padding:0 20px}}
.eyebrow{font-size:.875rem;letter-spacing:.16px;color:var(--text-secondary);margin-bottom:14px;display:flex;align-items:center;gap:10px}
h1.title{font-weight:400;font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.18;letter-spacing:-.4px;margin-bottom:12px}
.lead{font-size:1.125rem;color:var(--text-secondary);max-width:620px;line-height:1.55;margin-bottom:30px}
/* H2-level section heading: clearly larger and heavier than body/lead text */
.section-label{font-size:1.3rem;font-weight:600;letter-spacing:-.2px;line-height:1.3;color:var(--text);margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--border)}
/* H3-level sub heading for inner groups (phrase categories etc.) */
.sub-label{font-size:.8125rem;font-weight:500;letter-spacing:.4px;text-transform:uppercase;color:var(--text-muted);margin-bottom:11px}
.gap{height:56px}
.gap-s{height:28px}

/* ─── TABS ───────────────────────────────────────────────── */
.tabs{display:flex;gap:0;flex-wrap:wrap}
.tab{padding:13px 18px;border:none;background:none;cursor:pointer;font-size:.875rem;letter-spacing:.16px;color:var(--text-secondary);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .11s}
.tab:hover{color:var(--text)}
.tab.active{color:var(--text);font-weight:600;border-bottom-color:var(--primary)}

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:12px;justify-content:space-between;padding:11px 16px;border-radius:0;font-size:.875rem;font-weight:400;letter-spacing:.16px;line-height:1.29;cursor:pointer;border:1px solid transparent;transition:background .11s,color .11s,border-color .11s;text-align:left;text-decoration:none}
.btn-primary{background:var(--primary-bg);color:var(--primary-fg)}
.btn-primary:hover{background:var(--primary-hover)}
.btn-ghost{background:transparent;color:var(--primary);border-color:var(--primary)}
.btn-ghost:hover{background:var(--primary-faint)}
.btn-sm{padding:6px 12px;font-size:.8125rem}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* ─── CARDS / GRIDS ──────────────────────────────────────── */
.grid{display:grid;gap:1px;background:var(--border);border:1px solid var(--border)}
.grid>*{background:var(--surface)}
.g-auto-150{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.g-auto-220{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.g-auto-240{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.g-auto-280{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.g-2{grid-template-columns:1fr 1fr}
@media(max-width:680px){.g-2{grid-template-columns:1fr}}
.card{padding:22px 24px;text-align:left}
.card.link{cursor:pointer;border:none;font-family:inherit;transition:background .11s;position:relative;display:block;width:100%}
.card.link:hover{background:var(--surface-1)}
.stat-v{font-weight:300;font-size:2.1rem;letter-spacing:-.4px;line-height:1;margin-bottom:8px}
.stat-l{font-size:.875rem;color:var(--text-muted);letter-spacing:.16px}
.go{font-size:.875rem;color:var(--primary);display:flex;align-items:center;gap:8px;margin-top:14px}

/* ─── TIPS / CALLOUTS ────────────────────────────────────── */
.tip{border-left:3px solid var(--primary);background:var(--surface-1);padding:15px 19px;font-size:.9375rem;color:var(--text-secondary);line-height:1.55}
.tip.warn{border-left-color:var(--red)}
.tip.good{border-left-color:var(--green)}
.tip strong{color:var(--text);font-weight:600}
.tip+.tip{margin-top:12px}

/* ─── TABLES ─────────────────────────────────────────────── */
.tbl-wrap{overflow-x:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:.875rem;min-width:560px}
.tbl th{padding:13px 14px;text-align:left;font-weight:600;color:var(--text);background:var(--surface-1);border-bottom:1px solid var(--border);letter-spacing:.16px}
.tbl td{padding:12px 14px;border-bottom:1px solid var(--border);color:var(--text-secondary);vertical-align:top}
.tbl td:first-child{font-weight:600;color:var(--text)}
.tbl tr.rowlink{cursor:pointer}
.tbl tr.rowlink:hover{background:var(--surface-1)}
.cell-yes{color:var(--green)!important}
.cell-no{color:var(--text-muted)!important}

/* ─── LAYOUT BOX (text-type skeleton) ────────────────────── */
.layout-box{border:1px solid var(--border);border-left-width:3px;padding:18px 22px;font-family:var(--font-mono);font-size:.8125rem;line-height:2.1;background:var(--surface-1)}
.layout-box .part{color:var(--text);font-weight:500}
.layout-box .note{color:var(--text-muted);font-family:var(--font-sans);margin-left:10px}

/* ─── DO / DON'T ─────────────────────────────────────────── */
.dd-col{padding:20px 24px}
.dd-col.do{border-top:3px solid var(--green)}
.dd-col.dont{border-top:3px solid var(--red)}
.dd-col h3{font-size:.875rem;font-weight:600;margin-bottom:13px}
.dd-col ul{margin:0;padding-left:18px;font-size:.875rem;color:var(--text-secondary);line-height:1.75}
.dd-col li{margin-bottom:5px}

/* ─── MODEL TEXT ANNOTATIONS ─────────────────────────────── */
.model-box{border:1px solid var(--border)}
.model-head{padding:13px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;background:var(--surface-1)}
.legend{display:flex;gap:16px;flex-wrap:wrap}
.legend span{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--text-muted);letter-spacing:.16px}
.legend i{width:10px;height:10px;display:inline-block}
.model-body{padding:26px 30px;font-size:.9375rem;line-height:2.05;background:var(--surface)}
.model-body p{margin-bottom:16px;white-space:pre-line;color:var(--text-secondary)}
mark.ann{padding:1px 2px;color:var(--text);cursor:help;position:relative;background:var(--ann-bg,rgba(141,180,226,.20));border-bottom:2px solid var(--ann-c)}
mark.ann .bub{display:none;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--text);color:var(--bg);font-size:.6875rem;padding:4px 9px;white-space:nowrap;z-index:10;pointer-events:none;letter-spacing:.16px}
mark.ann:hover .bub,mark.ann:focus .bub,.show-labels mark.ann .bub{display:block}
@media(max-width:680px){mark.ann .bub{white-space:normal;min-width:160px}.model-body{padding:18px 16px}}

/* ─── PHRASE CHIPS ───────────────────────────────────────── */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text-secondary);font-size:.8125rem;font-family:var(--font-mono);cursor:pointer;transition:border-color .11s;text-align:left}
.chip:hover{border-color:var(--border-strong);color:var(--text)}
.chip .ic{font-size:.72rem;color:var(--text-muted)}
.chip.copied{border-color:var(--green);color:var(--green)}
.chip.copied .ic{color:var(--green)}
.copied-btn{border-color:var(--green)!important;color:var(--green)!important}

/* ─── HONEST MODEL ───────────────────────────────────────── */
.hm-grid{display:grid;grid-template-columns:1fr;gap:22px}
@media(min-width:900px){.hm-grid{grid-template-columns:3fr 2fr}}
.hm-text p{font-size:.95rem;line-height:1.7;color:var(--text);margin-bottom:12px}
.hm-mark{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;margin:0 2px;padding:0 3px;background:var(--primary-faint);color:var(--primary);border:1px solid var(--primary);font-size:.6875rem;font-family:var(--font-mono);cursor:pointer;vertical-align:super;line-height:1}
.hm-mark:hover{background:var(--primary-bg);color:var(--primary-fg)}
.hm-notes{list-style:none;margin:0;padding:0;border-left:1px solid var(--border);padding-left:18px}
.hm-notes li{position:relative;font-size:.8125rem;color:var(--text-secondary);line-height:1.6;margin-bottom:13px;padding-left:26px}
.hm-num{position:absolute;left:0;top:1px;display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;background:var(--primary-faint);color:var(--primary);border:1px solid var(--primary);font-size:.6875rem;font-family:var(--font-mono)}
@media(max-width:899px){.hm-notes{border-left:none;padding-left:0;border-top:1px solid var(--border);padding-top:16px}}

/* ─── SELF-RATING (SRDP-Raster) ──────────────────────────── */
.rate-row{border:1px solid var(--border);background:var(--surface);padding:16px 18px;margin-bottom:10px}
.rate-name{font-weight:600;font-size:.9375rem;margin-bottom:10px}
.rate-seg{display:inline-flex;border:1px solid var(--border-strong)}
.rate-btn{min-width:44px;min-height:44px;padding:9px 0;background:var(--surface);border:none;border-right:1px solid var(--border);color:var(--text-secondary);font-family:var(--font-mono);font-size:.875rem;cursor:pointer}
.rate-btn:last-child{border-right:none}
.rate-btn:hover{background:var(--hover);color:var(--text)}
.rate-btn.sel{background:var(--primary-bg);color:var(--primary-fg)}
.rate-desc{margin-top:10px;font-size:.8125rem;color:var(--text-secondary);line-height:1.55;min-height:20px;max-width:680px}
.rate-note{margin-top:6px;font-size:.75rem;color:var(--yellow)}
.rate-sum{font-size:.875rem;color:var(--text)}
@media(max-width:480px){.rate-btn{min-width:44px}}

/* ─── COUNTDOWN PLAN ─────────────────────────────────────── */
.cd-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:space-between;margin-top:22px;padding:12px 18px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:.875rem;text-decoration:none;border-left:3px solid var(--primary)}
.cd-bar:hover{background:var(--hover)}
.cd-bar.green{border-left-color:var(--green)}
.cd-bar.subtle{border-color:var(--border);border-left:3px solid var(--border-strong)}
.cd-bar .cd-link{color:var(--primary);white-space:nowrap}
.cd-bar .cd-prog{font-size:.8125rem;color:var(--text-muted)}
.plan-date{font-size:.9375rem;margin-bottom:4px}
.plan-datecard{max-width:520px}
.plan-day{border:1px solid var(--border);background:var(--surface);padding:16px 18px;margin-bottom:10px}
.plan-day.today{border-color:var(--primary);border-left:3px solid var(--primary)}
.plan-day.done{opacity:.72}
.plan-day-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.plan-day-num{font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted);letter-spacing:.32px}
.plan-today-badge{margin-left:8px;background:var(--primary-bg);color:var(--primary-fg);font-size:.6875rem;padding:2px 7px;letter-spacing:.4px}
.plan-day-title{font-weight:600;font-size:.9375rem}
.plan-day-min{margin-left:auto;font-size:.75rem;color:var(--text-muted)}
.plan-task{display:flex;gap:10px;align-items:flex-start;padding:7px 0;font-size:.875rem;color:var(--text-secondary);line-height:1.55;cursor:pointer}
.plan-task input{margin-top:3px;accent-color:var(--primary);width:16px;height:16px;flex-shrink:0;cursor:pointer}
.plan-task:hover{color:var(--text)}
.plan-task a{color:var(--primary)}

/* ─── FLASHCARDS ─────────────────────────────────────────── */
.fcard{display:block;width:100%;min-height:280px;background:none;border:none;padding:0;cursor:pointer;perspective:1200px;margin-top:18px;text-align:center;font-family:inherit}
.fc-inner{position:relative;display:block;width:100%;min-height:280px;transition:transform .45s;transform-style:preserve-3d}
.fcard.flipped .fc-inner{transform:rotateY(180deg)}
.fc-face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px;border:1px solid var(--border-strong);background:var(--surface);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.fc-back{transform:rotateY(180deg)}
.fc-word{font-size:clamp(1.4rem,4vw,2rem);font-weight:600;color:var(--text);line-height:1.3}
.fc-hint{font-size:1rem;color:var(--text-secondary);line-height:1.6;max-width:480px}
.fc-small{font-family:var(--font-mono);font-size:.8125rem;color:var(--primary)}
.fc-tap{font-size:.75rem;color:var(--text-muted);letter-spacing:.32px}
.fc-btns{display:flex;gap:8px;justify-content:center;margin-top:20px;flex-wrap:wrap}
.fc-btns kbd{margin-left:8px;font-family:var(--font-mono);font-size:.6875rem;border:1px solid currentColor;padding:1px 5px;opacity:.7}
.fc-swipehint{margin-top:14px;text-align:center;font-size:.75rem;color:var(--text-muted)}
.fc-end{padding-top:10px}
@media (prefers-reduced-motion: reduce){.fc-inner{transition:none}}
@media(max-width:640px){.fcard,.fc-inner{min-height:320px}}

/* ─── GLOBAL SEARCH ──────────────────────────────────────── */
.search-overlay{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.4);display:flex;align-items:flex-start;justify-content:center;padding:10vh 16px 16px}
.search-panel{width:640px;max-width:100%;background:var(--surface);border:1px solid var(--border-strong);box-shadow:0 8px 32px rgba(0,0,0,.25);display:flex;flex-direction:column;max-height:72vh}
.search-panel input{border:none;border-bottom:1px solid var(--border);background:var(--surface);color:var(--text);padding:16px 18px;font-size:1rem;font-family:inherit;outline:none;flex-shrink:0}
.search-panel input:focus{border-bottom-color:var(--primary)}
.sr-results{overflow-y:auto}
.sr-group{padding:12px 18px 5px;font-size:.6875rem;letter-spacing:.5px;text-transform:uppercase;color:var(--text-muted)}
.sr-row{display:flex;align-items:stretch;border-bottom:1px solid var(--border)}
.sr-row:last-child{border-bottom:none}
.sr-main{flex:1;display:block;text-align:left;background:none;border:none;padding:10px 18px;cursor:pointer;color:var(--text);font-family:inherit;font-size:.875rem;line-height:1.4}
.sr-main .sub{display:block;font-size:.75rem;color:var(--text-muted);margin-top:2px}
.sr-row:hover{background:var(--hover)}
.sr-row.active{background:var(--primary-faint);box-shadow:inset 3px 0 0 var(--primary)}
.sr-copy{background:none;border:none;border-left:1px solid var(--border);padding:0 14px;cursor:pointer;color:var(--text-muted);font-size:.8rem}
.sr-copy:hover{color:var(--primary)}
.sr-empty{padding:28px 18px;color:var(--text-muted);font-size:.875rem}
.search-hit{outline:2px solid var(--primary);outline-offset:2px}
@media(max-width:640px){.search-overlay{padding:0}.search-panel{width:100%;height:100%;max-height:100%}}

/* ─── ON-THIS-PAGE TOC + BACK-TO-TOP ─────────────────────── */
.page-toc{position:sticky;top:0;z-index:40;background:var(--surface);border-bottom:1px solid var(--border)}
.page-toc .pt-in{max-width:960px;margin:0 auto;padding:0 48px;display:flex;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.page-toc .pt-in::-webkit-scrollbar{display:none}
.page-toc .pt-chip{flex:0 0 auto;padding:10px 12px;font-size:.75rem;letter-spacing:.32px;color:var(--text-secondary);text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap}
.page-toc .pt-chip:hover{color:var(--text)}
.page-toc .pt-chip.active{color:var(--primary);border-bottom-color:var(--primary)}
[data-toc-anchor]{scroll-margin-top:56px}
@media(max-width:640px){.page-toc .pt-in{padding:0 12px}}
@media(max-width:840px){.page-toc{top:50px}}
.backtop{position:fixed;right:22px;bottom:22px;z-index:60;width:44px;height:44px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:1.05rem;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .15s;box-shadow:0 2px 10px rgba(0,0,0,.14)}
.backtop.show{opacity:1;pointer-events:auto}
.backtop:hover{border-color:var(--border-strong)}

/* ─── QUIZ ───────────────────────────────────────────────── */
.quiz{max-width:640px}
.qbar{height:4px;background:var(--surface-2);margin-bottom:26px}
.qbar i{display:block;height:100%;background:var(--primary);transition:width .3s}
.qmeta{display:flex;justify-content:space-between;margin-bottom:10px;font-size:.875rem;color:var(--text-muted)}
.qq{font-size:1.2rem;margin-bottom:22px;line-height:1.45}
.qopts{display:flex;flex-direction:column;gap:1px;background:var(--border);border:1px solid var(--border)}
.qopt{padding:14px 16px;border:none;border-left:3px solid transparent;background:var(--surface);color:var(--text-secondary);text-align:left;cursor:pointer;font-size:.9375rem;line-height:1.5}
.qopt:hover:not([disabled]){background:var(--surface-1)}
.qopt b{font-weight:600;margin-right:10px;color:var(--text-muted)}
.qopt.right{border-left-color:var(--green);background:var(--surface-1);color:var(--text)}
.qopt.wrong{border-left-color:var(--red);background:var(--surface-1);color:var(--text)}
.qexpl{margin-top:16px;border-left:3px solid var(--primary);background:var(--surface-1);padding:14px 18px;font-size:.875rem;color:var(--text-secondary);line-height:1.55}
.qscore{font-weight:300;font-size:3.4rem;line-height:1;margin-bottom:8px}
.qmiss{border-left:3px solid var(--red);background:var(--surface-1);padding:15px 19px;margin-bottom:8px;font-size:.875rem;line-height:1.5}

/* ─── DRAG & DROP ────────────────────────────────────────── */
.dnd{display:flex;flex-direction:column;gap:1px;background:var(--border);border:1px solid var(--border)}
.dnd-item{padding:13px 14px;background:var(--surface);display:flex;align-items:flex-start;gap:10px;border-left:3px solid transparent;cursor:grab}
.dnd-item.dragging{opacity:.4}
.dnd-item.over{border-left-color:var(--primary)}
.dnd-item.right{border-left-color:var(--green)}
.dnd-item.wrong{border-left-color:var(--red)}
.dnd-grip{color:var(--text-muted);user-select:none;flex-shrink:0;margin-top:2px}
.dnd-text{font-size:.9375rem;color:var(--text-secondary);line-height:1.5;white-space:pre-line;flex:1}
.dnd-role{font-size:.8125rem;margin-top:6px}
.dnd-role.ok{color:var(--green)}
.dnd-role.no{color:var(--red)}
.dnd-btns{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.dnd-btns button{border:1px solid var(--border-strong);background:var(--surface);color:var(--text-secondary);cursor:pointer;font-size:1rem;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;line-height:1}
.dnd-btns button:hover{border-color:var(--border-strong);color:var(--text)}

/* ─── CHECKLIST ──────────────────────────────────────────── */
.cl-item{display:flex;align-items:flex-start;gap:12px;cursor:pointer;padding:14px 16px;border-top:1px solid var(--border);border-left:3px solid transparent;background:var(--surface)}
.cl-item:first-child{border-top:none}
.cl-item.checked{background:var(--surface-1);border-left-color:var(--green)}
.cl-item.flagged{border-left-color:var(--red)}
.cl-box{width:18px;height:18px;border:1px solid var(--border-strong);flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:#fff}
.cl-item.checked .cl-box{background:var(--green);border-color:var(--green)}
[data-theme="dark"] .cl-item.checked .cl-box{color:#161616}
.cl-text{font-size:.875rem;color:var(--text-secondary);line-height:1.5;flex:1}
.cl-item.checked .cl-text{color:var(--text)}
.hi-pri{margin-left:8px;font-size:.6875rem;color:var(--yellow);border:1px solid var(--yellow);padding:1px 6px;letter-spacing:.16px;white-space:nowrap}

/* ─── FORMS ──────────────────────────────────────────────── */
.field label{display:block;font-size:.75rem;color:var(--text-muted);margin-bottom:8px;letter-spacing:.32px}
.field input,.field select,.field textarea{width:100%;padding:11px 14px;border:none;border-bottom:1px solid var(--border-strong);background:var(--surface-1);color:var(--text);font-size:.9375rem;font-family:var(--font-sans);letter-spacing:.16px}
.field textarea{line-height:1.7;resize:vertical;font-size:.9375rem}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--primary);outline-offset:-2px}

/* ─── SELF-CHECK FINDINGS ────────────────────────────────── */
.finding{display:flex;gap:12px;padding:13px 16px;border-top:1px solid var(--border);font-size:.875rem;line-height:1.55;background:var(--surface)}
.finding:first-child{border-top:none}
.finding .fi{flex-shrink:0;width:18px;text-align:center;font-weight:600}
.finding.ok .fi{color:var(--green)}
.finding.warn .fi{color:var(--yellow)}
.finding.bad .fi{color:var(--red)}
.finding.info .fi{color:var(--primary)}
.finding .ft{color:var(--text-secondary)}
.finding .ft b{color:var(--text);font-weight:600}
.finding .ft code{font-family:var(--font-mono);font-size:.8125rem;background:var(--surface-1);padding:1px 5px}

/* ─── PEEL / PARAGRAPH ───────────────────────────────────── */
.peel-card{border:1px solid var(--border);border-top:2px solid var(--pc);padding:16px 18px;background:var(--surface)}
.peel-card .pn{font-size:1rem;color:var(--pc);margin-right:8px}
.peel-card .pl{font-size:.7rem;letter-spacing:.09em;color:var(--pc);font-weight:600}
.peel-card .pd{font-size:.84rem;color:var(--text-secondary);line-height:1.65;margin-top:8px}
mark.peel{padding:1px 3px;color:var(--text);margin-right:4px;background:var(--ann-bg,rgba(141,180,226,.20));border-bottom:1.5px solid var(--ann-c)}
.wa-row{border:1px solid var(--border);border-left:2px solid var(--pc);display:flex;background:var(--surface)}
.wa-side{width:118px;padding:12px 13px;border-right:1px solid var(--border);background:var(--surface-1);flex-shrink:0;display:flex;flex-direction:column;justify-content:center}
.wa-side .pn{font-size:.95rem;color:var(--pc)}
.wa-side .pl{font-size:.6rem;letter-spacing:.07em;color:var(--pc);font-weight:600;line-height:1.35;margin-top:3px}
.wa-row textarea{flex:1;background:transparent;border:none;color:var(--text);font-size:.875rem;font-family:var(--font-sans);line-height:1.6;padding:12px 15px;resize:vertical;outline:none;min-height:54px}
.wa-row textarea:focus{outline:2px solid var(--primary);outline-offset:-2px}
@media(max-width:560px){.wa-side{width:84px}}

/* ─── SPOT THE MISTAKES / MONO TEXT ──────────────────────── */
.mono-text{padding:20px 24px;font-family:var(--font-mono);font-size:.8125rem;line-height:1.9;white-space:pre-wrap;color:var(--text-secondary)}
.err-row{display:flex;gap:12px;padding:12px 16px;border-left:3px solid var(--red);background:var(--surface-1);margin-bottom:1px;font-size:.875rem;line-height:1.5}
.err-row .n{color:var(--red);font-weight:600;flex-shrink:0}
.err-row .m{font-family:var(--font-mono);color:var(--red)}
.err-row .f{color:var(--text-secondary)}

.day-row{display:grid;grid-template-columns:96px 1fr;border-top:1px solid var(--border)}
.day-row:first-child{border-top:none}
.day-row .d{padding:15px 16px;background:var(--surface-1);border-right:1px solid var(--border);font-weight:600;font-size:.875rem;display:flex;align-items:center}
.day-row .c{padding:15px 18px;font-size:.875rem;color:var(--text-secondary);line-height:1.6}

/* ─── ACCORDION ──────────────────────────────────────────── */
.acc{border:1px solid var(--border)}
.acc-head{width:100%;display:flex;align-items:center;gap:14px;padding:15px 22px;background:var(--surface);border:none;border-top:1px solid var(--border);cursor:pointer;text-align:left;font-size:.9375rem;font-weight:600;color:var(--text)}
.acc>div:first-child .acc-head{border-top:none}
.acc-head:hover{background:var(--surface-1)}
.acc-head .pm{color:var(--primary);font-size:1rem;transition:transform .15s;display:inline-block}
.acc-item.open .acc-head .pm{transform:rotate(45deg)}
.acc-head .sub{margin-left:auto;font-size:.75rem;color:var(--text-muted);font-weight:400}
.acc-body{display:none;padding:6px 24px 26px;background:var(--surface-1)}
.acc-item.open .acc-body{display:block}

/* ─── MISC ───────────────────────────────────────────────── */
.pair-row{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border)}
@media(max-width:640px){.pair-row{grid-template-columns:1fr}}
.pair-cell{background:var(--surface);padding:13px 16px;font-size:.875rem;line-height:1.6}
.pair-cell .lab{font-size:.6875rem;letter-spacing:.5px;font-weight:600;margin-bottom:5px}
.wrong-c{color:var(--red)}
.right-c{color:var(--green)}
.badge{font-size:.6875rem;color:var(--text-muted);border:1px solid var(--border);padding:2px 8px;letter-spacing:.32px;white-space:nowrap}
.kbd{font-family:var(--font-mono);font-size:.8125rem;background:var(--surface-1);border:1px solid var(--border);padding:1px 6px}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--surface-2)}
::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--text);color:var(--bg);padding:10px 18px;font-size:.875rem;z-index:500;opacity:0;transition:opacity .2s;pointer-events:none}
.toast.show{opacity:1}
.sw-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:520;display:flex;align-items:center;gap:14px;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);padding:12px 16px;font-size:.875rem;box-shadow:0 4px 16px rgba(0,0,0,.18);max-width:calc(100vw - 32px)}
.sw-toast .sw-toast-x{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:.9rem;padding:4px}
.sw-toast .sw-toast-x:hover{color:var(--text)}

/* ─── GUIDED TOUR ────────────────────────────────────────── */
.tour-catch{position:fixed;inset:0;z-index:7999;display:none}
.tour-spot{position:fixed;z-index:8000;border-radius:0;box-shadow:0 0 0 3px var(--primary),0 0 0 9999px rgba(0,0,0,.55);pointer-events:none;transition:top .2s,left .2s,width .2s,height .2s;display:none}
.tour-card{position:fixed;z-index:8001;width:330px;max-width:calc(100vw - 32px);background:var(--surface);border:1px solid var(--border-strong);box-shadow:0 14px 44px rgba(0,0,0,.32);padding:20px 22px;display:none}
.tour-card .tc-step{font-size:.75rem;letter-spacing:.32px;text-transform:uppercase;color:var(--text-muted);margin-bottom:9px}
.tour-card .tc-title{font-size:1.05rem;font-weight:600;color:var(--text);margin-bottom:9px;line-height:1.3}
.tour-card .tc-text{font-size:.9rem;color:var(--text-secondary);line-height:1.55;margin-bottom:18px}
.tour-card .tc-btns{display:flex;align-items:center;gap:8px}
.tour-card .tc-skip{margin-left:auto;background:none;border:none;color:var(--text-muted);font-size:.8125rem;cursor:pointer;text-decoration:underline;padding:4px}
body.tour-on{overflow:hidden}
.nav-help{background:none;border:1px solid var(--border-strong);color:var(--text-secondary);width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:.8125rem;line-height:1;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}
.nav-help:hover{background:var(--hover);color:var(--text)}
.nav-help.pulse{border-color:var(--primary);color:var(--primary);animation:helpPulse 1.5s ease-out 3}
@keyframes helpPulse{0%{box-shadow:0 0 0 0 rgba(15,98,254,.45)}70%{box-shadow:0 0 0 9px rgba(15,98,254,0)}100%{box-shadow:0 0 0 0 rgba(15,98,254,0)}}
.nav-hint{position:absolute;top:54px;right:14px;z-index:60;background:var(--primary-bg);color:#fff;font-size:.75rem;line-height:1.4;padding:9px 12px;max-width:185px;box-shadow:0 8px 24px rgba(0,0,0,.28);cursor:pointer;animation:hintIn .25s ease-out}
.nav-hint::after{content:"";position:absolute;top:-6px;right:12px;border:6px solid transparent;border-bottom-color:var(--primary-bg);border-top:0}
.nav-hint b{display:block;font-weight:600;margin-bottom:1px}
@keyframes hintIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
/* ─── PRINT ──────────────────────────────────────────────── */
.print-note{display:none}
@media print{
  :root,[data-theme="dark"]{
    --bg:#f4f1ea; --surface:#ffffff; --surface-1:#eae6dd; --surface-2:#dcd7cc;
    --border:#e0dcd2; --border-strong:#161616;
    --text:#161616; --text-secondary:#525252; --text-muted:#595959;
    --hover:#f4f4f4;
    --primary:#0043ce; --primary-bg:#0f62fe; --primary-fg:#ffffff; --primary-hover:#0050e6; --primary-faint:#edf5ff;
    --blue:#0f62fe; --purple:#8a3ffc; --orange:#a04200; --green:#0e6e2e; --red:#a2191f; --yellow:#6b5000;
    --footer-bg:#161616; --footer-surface:#262626; --footer-ink:#ffffff; --footer-ink-muted:#c6c6c6;
  }
  #sidenav,.mobile-bar,.no-print,.tabs,#tourCatch,#tourSpot,#tourCard,.toast,.school-chooser,.school-switch,.chip .ic{display:none!important}
  body{background:#fff;color:#000;font-size:10.5pt}
  #app{display:block}
  #main{height:auto;overflow:visible}
  .page-head{padding-top:0}
  mark.ann .bub{display:none!important}
  .print-note{display:block!important;text-align:center;font-size:9pt;color:#444;margin:18px 20px 0;padding-top:10px;border-top:1px solid #bbb}
  .acc-body{display:block!important}
}

/* ─── Exam timer / mock countdown ─────────────────────────── */
.mock-card{border:1px solid var(--border);padding:26px 22px;text-align:center;max-width:520px}
.mock-meta{font-size:.72rem;letter-spacing:.32px;text-transform:uppercase;color:var(--text-muted);margin-bottom:10px}
.mock-clock{font-family:var(--font-mono);font-size:3.75rem;line-height:1;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:1px}
.mock-clock.is-low,.mock-clock.is-done{color:var(--red)}
.mock-bar{height:6px;background:var(--border);margin:18px 0 20px;overflow:hidden;border-radius:0}
.mock-bar-fill{height:100%;background:var(--primary);width:0;transition:width .5s linear}
.mock-btns{display:flex;gap:10px;justify-content:center}
.mock-lead{font-size:.9375rem;color:var(--text-secondary);line-height:1.6;max-width:640px;margin-bottom:14px}
.mock-plan{list-style:none;padding:0;margin:0;max-width:520px}
.mock-plan li{display:flex;gap:14px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--border)}
.mp-min{font-family:var(--font-mono);font-size:.8125rem;color:var(--primary);min-width:62px;font-weight:600;flex-shrink:0}
.mp-lab{font-size:.9375rem;color:var(--text);line-height:1.5}
@media (prefers-reduced-motion: reduce){.mock-bar-fill{transition:none}}
@media print{.mock-btns{display:none}}