/* page reset (the claude.ai artifact wrapper used to supply this) */
*,*::before,*::after{box-sizing:border-box}
:root{color-scheme:light;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0;font-size:14px;font-family:system-ui,sans-serif}
img{max-width:100%}
[hidden]{display:none!important}

/* Layout: a test-driver shell — navy header, gray ground, white question panel, right-hand Index rail. Modeled on the digital ACT testing screen. */
:root{
  --hdr:#1c3245; --hdr-fg:#e9ecef; --hdr-dim:#c9cfd4; --hdr-btn:rgba(233,236,239,.08);
  --ground:#e9ecef; --panel:#ffffff; --ink:#212529; --ink-2:#4a4f54; --ink-3:#6e757c;
  --rule:#dee2e6; --line:rgba(0,0,0,.15); --row:#f8f9fa;
  --idx-head:#e8eef5; --idx-cur:#fff2cf; --idx-done:#bbcde1;
  --flag:#c62828; --ok:#1e7a3c; --ok-bg:#e6f4ea; --bad:#b3261e; --bad-bg:#fdecea;
  --hl:#ffe36e; --reader:rgba(28,50,69,.72);
  --focus:#2f6db5;
  --font:Calibri, Carlito, Arial, "Helvetica Neue", sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --hdr:#0f1c27; --hdr-fg:#e9ecef; --hdr-dim:#aab3bb; --hdr-btn:rgba(233,236,239,.1);
  --ground:#14191e; --panel:#1d242b; --ink:#e7eaed; --ink-2:#c3c9cf; --ink-3:#9aa3ab;
  --rule:#2e3842; --line:rgba(255,255,255,.14); --row:#232c34;
  --idx-head:#26323d; --idx-cur:#4a4128; --idx-done:#2b4560;
  --flag:#ff7b72; --ok:#6fd38f; --ok-bg:#183323; --bad:#ff8a80; --bad-bg:#3a1f1d;
  --hl:#6b5a12; --reader:rgba(0,0,0,.72); --focus:#7fb0ef; color-scheme:dark}}
:root[data-theme="dark"]{
  --hdr:#0f1c27; --hdr-fg:#e9ecef; --hdr-dim:#aab3bb; --hdr-btn:rgba(233,236,239,.1);
  --ground:#14191e; --panel:#1d242b; --ink:#e7eaed; --ink-2:#c3c9cf; --ink-3:#9aa3ab;
  --rule:#2e3842; --line:rgba(255,255,255,.14); --row:#232c34;
  --idx-head:#26323d; --idx-cur:#4a4128; --idx-done:#2b4560;
  --flag:#ff7b72; --ok:#6fd38f; --ok-bg:#183323; --bad:#ff8a80; --bad-bg:#3a1f1d;
  --hl:#6b5a12; --reader:rgba(0,0,0,.72); --focus:#7fb0ef; color-scheme:dark}
[hidden]{display:none!important}
html,body{height:100%}
body{background:var(--ground);color:var(--ink);font:16px/1.5 var(--font);display:flex;flex-direction:column}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--hdr)}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:1px solid transparent;border-radius:4px}
button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
button[disabled]{cursor:default;opacity:.45}

/* header */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--hdr);color:var(--hdr-fg);height:56px;display:flex;align-items:center;gap:12px;
  padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
.brand{display:flex;align-items:baseline;gap:8px;min-width:0;background:none;border:0;padding:4px 2px;color:var(--hdr-fg)}
.brand b{font-size:22px;letter-spacing:.02em;white-space:nowrap}
.brand span{font-size:13px;color:var(--hdr-dim);white-space:nowrap}
.hdr-mid{flex:1;display:flex;justify-content:center;gap:8px}
.hbtn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 10px;font-weight:700;font-size:15px;letter-spacing:.04em;color:var(--hdr-fg)}
.hbtn.tint{background:var(--hdr-btn)}
.hbtn:hover{background:rgba(233,236,239,.14)}
.hbtn svg{width:16px;height:16px;flex:none}
.hdr-right{display:flex;align-items:center;gap:14px;font-size:15px}
.stat{display:flex;gap:6px;white-space:nowrap}
.stat .k{color:var(--hdr-dim);letter-spacing:.04em}
.stat .v{font-variant-numeric:tabular-nums}
.stat.warn .v{color:#ffd166;font-weight:700}
.endbtn{font-size:14px}
.pausebtn[aria-pressed="true"]{background:rgba(233,236,239,.18)}
.pausescrim{top:calc(56px + env(safe-area-inset-top,0px));background:var(--ground)}
.drop{position:relative}
.menu{position:absolute;top:44px;left:0;min-width:256px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:4px;box-shadow:0 8px 24px rgba(0,0,0,.18);padding:8px 0;z-index:40}
.menu button{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:6px 16px;border-radius:0;font-weight:400}
.menu button:hover{background:var(--row)}
.menu .chk{width:18px;text-align:center;color:var(--focus);font-weight:700}
.menu small{display:block;color:var(--ink-3);font-size:13px;padding:6px 16px 2px}

/* body grid */
.shell{flex:1;display:flex;min-height:0}
.panel{flex:1;min-width:0;margin:10px;background:var(--panel);display:flex;flex-direction:column;border-radius:2px}
.rail{width:110px;flex:none;display:flex;flex-direction:column;align-items:center;padding-block:10px;gap:8px}
.railbtn{display:flex;flex-direction:column;align-items:center;gap:6px;width:100px;padding:10px 0;font-size:11px;font-weight:700;color:var(--ink-3);letter-spacing:.06em}
.railbtn svg{width:20px;height:20px}
.railbtn:hover{background:rgba(0,0,0,.05)}
.page-hdr{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:0 10px}
.landmark{font-size:16px;color:var(--ink-2);margin:0;font-weight:400}
.flagbtn{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--ink-2);padding:8px 10px;letter-spacing:.04em}
.flagbtn svg{width:14px;height:14px}
.flagbtn[aria-pressed="true"]{color:var(--flag)}
.page-body{flex:1;overflow:auto;padding:16px max(16px,env(safe-area-inset-left,0px)) 24px 16px;position:relative}
.page-body.zoom-2{font-size:19px}.page-body.zoom-3{font-size:22px}
.page-ftr{display:flex;align-items:center;gap:8px;border-top:1px solid var(--rule);min-height:54px;padding:0 10px}
.page-ftr .sp{flex:1}
.navbtn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 12px;font-weight:700;color:var(--ink-2);letter-spacing:.04em}
.navbtn svg{width:16px;height:16px}
.navbtn:hover:not([disabled]){background:var(--row)}
.navbtn.primary{background:var(--hdr);color:#fff}
.navbtn.primary:hover{background:#2a4862}
.idx-mobile{display:none}

/* content */
.measure{max-width:70ch}
.stem p{margin:0 0 16px}
.stem strong{font-weight:700}
.passage{border:1px solid var(--rule);background:var(--row);padding:14px 16px;margin:0 0 18px;max-width:70ch}
.passage h3{margin:0 0 8px;font-size:1em}
.passage p{margin:0 0 10px}
.tbl{overflow-x:auto;margin:0 0 16px}
table{border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:.95em}
th,td{border:1px solid var(--line);padding:4px 10px;text-align:center}
th{background:var(--idx-head);font-weight:700}
caption{caption-side:top;text-align:left;font-weight:700;padding:0 0 4px}
.mcq{border:0;margin:0;padding:0;display:grid;gap:8px;max-width:70ch}
.opt{display:flex;align-items:flex-start;gap:12px;padding:4px 6px;border-radius:4px;position:relative}
.opt label{display:flex;align-items:flex-start;gap:12px;flex:1;cursor:pointer;padding:3px 0}
.opt input{margin:5px 0 0;width:15px;height:15px;accent-color:var(--hdr)}
.opt .lt{min-width:1.4em}
.opt.sel{background:var(--row)}
.opt.struck .tx,.opt.struck .lt{text-decoration:line-through;color:var(--ink-3)}
.opt .elim{display:none;width:30px;height:30px;align-items:center;justify-content:center;color:var(--ink-3);flex:none}
.tool-elim .opt .elim{display:inline-flex}
.opt .elim svg{width:18px;height:18px}
.opt.right{background:var(--ok-bg)} .opt.wrong{background:var(--bad-bg)}
.opt .mark{font-size:13px;font-weight:700;margin-left:auto;align-self:center;white-space:nowrap}
.opt.right .mark{color:var(--ok)} .opt.wrong .mark{color:var(--bad)}
.explain{margin-top:18px;border-left:4px solid var(--hdr);padding:8px 14px;background:var(--row);max-width:70ch}
.explain .tag{font-size:13px;color:var(--ink-3);margin-top:6px}
mark.hl{background:var(--hl);color:inherit}
.reader{position:fixed;left:0;right:0;pointer-events:none;z-index:15;display:none}
.reader .top,.reader .bot{position:fixed;left:0;right:0;background:var(--reader)}
.tool-reader .reader{display:block}

.lesson h2,.home h2{font-size:1.35em;margin:0 0 6px;text-wrap:balance}
.eyebrow{font-size:13px;letter-spacing:.08em;color:var(--ink-3);font-weight:700;text-transform:uppercase}
.lesson ul{padding-left:22px;margin:10px 0 16px}
.lesson li{margin:0 0 8px}
.callout{border:1px solid var(--line);border-radius:4px;padding:10px 14px;background:var(--row);max-width:70ch}
.steps{margin:14px 0 0;padding:12px 16px 12px 36px;background:var(--ok-bg);border-radius:4px;max-width:70ch}
.steps li{margin:0 0 6px}
.lvl{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:3px;background:var(--idx-head);color:var(--ink-2);text-transform:uppercase}
.src{font-size:14px;color:var(--ink-3)}
.src a{color:var(--focus)}
.reveal{margin-top:14px}
.mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:0 0 16px}
.mode-card{display:block;border:2px solid var(--line);border-radius:4px;padding:12px 14px;cursor:pointer;background:var(--panel)}
.mode-card.on{border-color:var(--hdr);background:var(--row)}
.mode-top{display:flex;align-items:center;gap:10px;font-size:1.05em}
.mode-top input{width:16px;height:16px;accent-color:var(--hdr);margin:0}
.mode-card ul{margin:8px 0 0;padding-left:20px;font-size:.95em;color:var(--ink-2)}
.mode-card li{margin:0 0 4px}
.chip.mode-strict{background:var(--hdr);color:#fff;border-color:transparent}
.chip.mode-practice{background:var(--idx-cur);color:var(--ink);border-color:transparent}
.bar i.m-practice{background:#c99a1e}
.help{margin-top:18px;max-width:70ch;display:grid;gap:12px}
.help-bar{display:flex;flex-wrap:wrap;gap:8px}
.hint{border:1px solid var(--line);border-radius:4px;padding:10px 14px;background:var(--row)}
.hint p{margin:6px 0 0}
.hint .xsteps{padding-left:22px;margin:6px 0 0}
.past{margin-right:14px;white-space:nowrap}
.linkbtn{color:var(--focus);text-decoration:underline;padding:0;border:0;font-weight:700}
body.locked #homeBtn,body.locked #planRail,body.locked #histRail{pointer-events:none;opacity:.35}

.steps li{padding-left:4px;line-height:1.55}
.xsteps{background:transparent;padding:4px 0 0 22px;margin:8px 0 0}
.whynot{margin-top:14px;max-width:70ch;border:1px solid var(--line);border-radius:4px;padding:10px 14px}
.whynot ul{margin:6px 0 0;padding-left:20px}.whynot li{margin:0 0 6px}

/* index drawer */
.idx{position:fixed;top:calc(56px + env(safe-area-inset-top,0px));right:0;bottom:0;width:min(560px,100%);background:var(--panel);border-left:1px solid var(--line);box-shadow:-8px 0 24px rgba(0,0,0,.15);z-index:25;display:flex;flex-direction:column}
.idx-top{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--rule)}
.idx-top select{font:inherit;height:38px;padding:0 10px;border-radius:4px;background:var(--ink-2);color:#fff;border:0;font-weight:700;letter-spacing:.03em}
.idx-list{list-style:none;margin:0;padding:12px 16px;overflow:auto;display:grid;gap:12px}
.idx-entry{border:1px solid var(--line);background:var(--row);border-radius:2px}
.idx-entry button{display:block;width:100%;text-align:left;padding:0;border-radius:0}
.idx-entry .h{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--idx-head);font-weight:700}
.idx-entry.cur .h{background:var(--idx-cur)}
.idx-entry .b{padding:10px 16px;font-size:14px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.idx-entry.done .b{background:var(--idx-done)}
.idx-entry .st{font-size:13px;font-weight:700;color:var(--ink-3)}
.idx-entry .st.f{color:var(--flag)}

/* dialog */
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:50;display:flex;align-items:center;justify-content:center;padding:16px}
.dlg{background:var(--panel);color:var(--ink);border-radius:4px;max-width:440px;width:100%;box-shadow:0 12px 40px rgba(0,0,0,.3)}
.dlg h2{margin:0;padding:14px 18px;background:var(--hdr);color:#fff;font-size:17px;border-radius:4px 4px 0 0}
.dlg p{margin:0;padding:16px 18px}
.dlg .row{display:flex;justify-content:flex-end;gap:8px;padding:0 18px 16px}
.btn{height:38px;padding:0 16px;font-weight:700;border:1px solid var(--line);border-radius:4px;letter-spacing:.03em}
.btn.pri{background:var(--hdr);color:#fff;border-color:var(--hdr)}

/* home / plan / history */
.home{display:grid;gap:22px;max-width:960px}
.today{border:1px solid var(--line);border-radius:4px;overflow:hidden}
.today .h{background:var(--idx-head);padding:10px 16px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-weight:700}
.today .b{padding:16px;display:grid;gap:10px}
.today .b h3{margin:0;font-size:1.25em;text-wrap:balance}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:13px;font-weight:700;padding:2px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink-2)}
.chip.Math{background:#dbe7f5;color:#1c3245;border-color:transparent}
.chip.Science{background:#dcefe4;color:#17452b;border-color:transparent}
.chip.Reading{background:#f3e3cf;color:#5a3a12;border-color:transparent}
.chip.English{background:#eadff3;color:#3d2457;border-color:transparent}
:root[data-theme="dark"] .chip{filter:brightness(.85)}
.banner{border:1px solid #e0b84a;background:var(--idx-cur);padding:10px 14px;border-radius:4px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.box{border:1px solid var(--line);border-radius:4px;padding:12px 14px;min-width:0}
.box h4{margin:0 0 8px;font-size:15px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3)}
.big{font-size:30px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.cal{width:100%;min-width:520px}
.cal td,.cal th{text-align:left}
.cal tr.now td{background:var(--idx-cur)}
.cal td.sc{font-variant-numeric:tabular-nums;white-space:nowrap}
.bar{height:10px;background:var(--row);border:1px solid var(--line);border-radius:2px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--hdr)}
.sec-row{display:grid;grid-template-columns:80px 1fr 56px;gap:10px;align-items:center;margin:6px 0;font-size:15px}
.empty{color:var(--ink-3);padding:24px 0}
.score{display:flex;gap:28px;flex-wrap:wrap;align-items:flex-end}
.score .big{font-size:40px}
.rv{width:100%;min-width:440px}
.rv td{text-align:left}
.rv .ok{color:var(--ok);font-weight:700}.rv .no{color:var(--bad);font-weight:700}
a{color:var(--focus)}


/* ---- learning dashboard (light, Khan-style) ---- */
:root{--k-bg:#f7f8fa;--k-card:#ffffff;--k-ink:#21242c;--k-sub:#5b6170;--k-line:#e3e5ea;--k-blue:#1865f2;--k-blue-ink:#ffffff;--k-hover:#eef3fe;
  --m0:#ffffff;--m0b:#b8bcc6;--m1:#fde3cf;--m1b:#e58b4a;--m2:#ffc94d;--m2b:#d99a00;--m3:#9b7cf8;--m3b:#7854f7;--m4:#4f2bb8;--m4b:#3a1f8f}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--k-bg:#14171c;--k-card:#1c2027;--k-ink:#e8eaee;--k-sub:#a3a9b5;--k-line:#2d333d;--k-blue:#5b93ff;--k-blue-ink:#0d1220;--k-hover:#20283a;--m0:#1c2027;--m0b:#5d6472;--m1:#4a3222;--m1b:#e58b4a;--m2:#5c4a14;--m2b:#ffc94d;--m3:#3d2f6e;--m3b:#9b7cf8;--m4:#6a48e0;--m4b:#b49cff}}
:root[data-theme="dark"]{--k-bg:#14171c;--k-card:#1c2027;--k-ink:#e8eaee;--k-sub:#a3a9b5;--k-line:#2d333d;--k-blue:#5b93ff;--k-blue-ink:#0d1220;--k-hover:#20283a;--m0:#1c2027;--m0b:#5d6472;--m1:#4a3222;--m1b:#e58b4a;--m2:#5c4a14;--m2b:#ffc94d;--m3:#3d2f6e;--m3b:#9b7cf8;--m4:#6a48e0;--m4b:#b49cff}
.khnav{display:none;gap:4px}
body.kh{background:var(--k-bg)}
body.kh .khnav{display:flex}
body.kh #toolsBtn,body.kh #toolsBtn+.menu{display:none}
body.kh .hdr-mid{justify-content:flex-end}
.khnav button{color:var(--hdr-fg);font-weight:700;height:38px;padding:0 12px;font-size:15px}
.khnav button:hover{background:rgba(233,236,239,.14)}
body.kh .rail,body.kh .page-hdr,body.kh .page-ftr{display:none}
body.kh .panel{background:transparent;margin:0}
body.kh .page-body{padding-top:20px;color:var(--k-ink)}
.kgrid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;max-width:1180px;margin:0 auto}
.kwrap{max-width:1000px;margin:0 auto}
.kh2{margin:0 0 4px}
.kside{position:sticky;top:0;align-self:start;display:grid;gap:14px}
.kcourse{padding:4px 4px 0}.kct{font-size:22px;font-weight:700}
.ksecs{display:grid;gap:2px;background:var(--k-card);border:1px solid var(--k-line);border-radius:8px;padding:6px}
.ksec{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:6px;text-align:left;font-weight:700;color:var(--k-ink)}
.ksec:hover{background:var(--k-hover)}.ksec.on{background:var(--k-hover);color:var(--k-blue);box-shadow:inset 3px 0 0 var(--k-blue)}
.kp{font-size:13px;color:var(--k-sub);font-weight:700;font-variant-numeric:tabular-nums}
.kmain{display:grid;gap:18px;min-width:0}
.kcard{background:var(--k-card);border:1px solid var(--k-line);border-radius:8px;padding:18px 20px;min-width:0}
.kbanner{background:var(--idx-cur);border:1px solid #e0b84a;border-radius:8px;padding:10px 14px;color:var(--ink)}
.upnext{border-top:4px solid var(--k-blue)}
.upnext h2{margin:6px 0 4px;font-size:1.45em;text-wrap:balance}
.unrow{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.unl{min-width:0;flex:1 1 320px}
.ks{font-size:14px;color:var(--k-sub)}
.kbtns{display:flex;gap:8px;flex:none}
.kb{height:40px;padding:0 18px;border-radius:6px;font-weight:700;border:2px solid var(--k-blue)}
.kb.pri{background:var(--k-blue);color:var(--k-blue-ink)}
.kb.ghost{color:var(--k-blue);background:var(--k-card)}
.kb:hover{filter:brightness(1.08)}
.soon{font-size:13px;color:var(--k-sub);white-space:nowrap}
.kmh{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.kbig{font-size:34px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.mbar{display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--k-bg);border:1px solid var(--k-line);margin:12px 0 10px}
.mbar i{display:block;height:100%}
.mbar i.l1{background:var(--m1b)}.mbar i.l2{background:var(--m2)}.mbar i.l3{background:var(--m3)}.mbar i.l4{background:var(--m4)}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--k-sub);align-items:center}
.legend span{display:inline-flex;align-items:center;gap:4px}
.sq{display:inline-block;width:16px;height:16px;border-radius:3px;border:2px solid var(--m0b);background:var(--m0);flex:none;vertical-align:middle}
.sq.big{width:22px;height:22px}
.sq.l1{background:var(--m1);border-color:var(--m1b)}.sq.l2{background:var(--m2);border-color:var(--m2b)}.sq.l3{background:var(--m3);border-color:var(--m3b)}.sq.l4{background:var(--m4);border-color:var(--m4b)}
.ktabs{display:flex;gap:4px;border-bottom:2px solid var(--k-line)}
.ktabs button{padding:10px 16px;font-weight:700;color:var(--k-sub);border-radius:0;margin-bottom:-2px;border-bottom:3px solid transparent}
.ktabs button.on{color:var(--k-blue);border-bottom-color:var(--k-blue)}
.kunits{display:grid;gap:18px}
.kunit-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.kunit-h h3{margin:0;font-size:1.25em}
.kunit{border-top:1px solid var(--k-line);padding-top:12px;margin-top:12px}
.kuh{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.kut{font-weight:700;color:var(--k-sub);font-size:14px;letter-spacing:.03em;text-transform:uppercase}
.sqs{display:flex;gap:4px;flex-wrap:wrap}
.krows{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:2px}
.krow{display:flex;align-items:center;gap:14px;padding:10px 8px;border-radius:6px}
.krow:hover{background:var(--k-hover)}
.krow.now{background:var(--k-hover);box-shadow:inset 3px 0 0 var(--k-blue)}
.kname{flex:1;min-width:0}
.kt{font-weight:700}
.about ul{margin:10px 0 0;padding-left:20px}.about li{margin:0 0 6px}
.about summary{cursor:pointer}
body.kh .box,body.kh .tbl table{background:var(--k-card)}

.cal{padding:16px}
.calhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.calhead h3{margin:0;font-size:1.25em}
.calnav{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--k-line);border-radius:6px;color:var(--k-ink)}
.calnav svg{width:16px;height:16px}
.calgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--k-line);border-left:1px solid var(--k-line)}
.cdow{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--k-sub);padding:6px 8px;border-right:1px solid var(--k-line);border-bottom:1px solid var(--k-line);background:var(--k-bg)}
.cday{box-sizing:border-box;width:100%;border-top:0!important;border-left:0!important;min-height:104px;padding:6px;border-right:1px solid var(--k-line);border-bottom:1px solid var(--k-line);border-radius:0;text-align:left;display:flex;flex-direction:column;gap:4px;align-items:stretch;justify-content:flex-start;background:var(--k-card);color:var(--k-ink);min-width:0;overflow:hidden}
.cday.out{background:var(--k-bg)}
.cday:not(.out):hover{background:var(--k-hover)}
.cday.past .cnum span{color:var(--k-sub)}
.cday.sel{box-shadow:inset 0 0 0 2px var(--k-blue)}
.cnum{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.cday.today .cnum span{background:var(--k-blue);color:var(--k-blue-ink);border-radius:999px;min-width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px}
.cles{border-radius:4px;padding:3px 6px;font-size:12px;line-height:1.3;border-left:3px solid;min-width:0}
.cles .csec{display:block;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.cles .cskill{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.s-Math{background:#dbe7f5;border-color:#1c3245;color:#1c3245}
.s-Science{background:#dcefe4;border-color:#1e6b3c;color:#17452b}
.s-Reading{background:#f3e3cf;border-color:#a8641a;color:#5a3a12}
.s-English{background:#eadff3;border-color:#6b3fa0;color:#3d2457}
.cev{font-size:11px;font-weight:700;border-radius:3px;padding:2px 6px;line-height:1.3}
.cev.deadline{background:#fde2e1;color:#9b1c1c}
.cev.full{background:#fff2cf;color:#6b4e00}
.cev.act{background:#1c3245;color:#fff}
.cday.ev-act{box-shadow:inset 0 0 0 2px #1c3245}
.ldot{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:4px;border-left:3px solid}
.ldot.ev-full{background:#fff2cf;border-color:#e0b84a}.ldot.ev-deadline{background:#fde2e1;border-color:#d64545}.ldot.ev-act{background:#1c3245;border-color:#1c3245}
.cdetail{margin-top:14px;border-top:1px solid var(--k-line);padding-top:12px}
@media (max-width:760px){
  .cal{padding:12px 8px}
  .cday{min-height:58px;padding:4px 3px;gap:3px}
  .cnum{font-size:12px}.cnum .sq{width:10px;height:10px;border-width:1px}
  .cday.today .cnum span{min-width:20px;height:20px}
  .cles{padding:0;height:6px;border-left:0;border-radius:3px;font-size:0}
  .cles .csec,.cles .cskill{display:none}
  .s-Math.cles{background:#1c3245}.s-Science.cles{background:#1e6b3c}.s-Reading.cles{background:#a8641a}.s-English.cles{background:#6b3fa0}
  .cev{font-size:0;padding:0;height:6px}
  .cev.deadline{background:#d64545}.cev.full{background:#e0b84a}
  .cdetail .cev{font-size:11px;padding:2px 6px;height:auto}
  .cdow{padding:4px 2px;font-size:10px;text-align:center}
}

@media (max-width:760px){
  .kgrid{grid-template-columns:1fr}
  .kside{position:static}
  .ksecs{display:flex;overflow-x:auto;padding:4px}
  .ksec{white-space:nowrap;gap:8px}
  .krow{flex-wrap:wrap}.kbtns{width:100%;justify-content:flex-end}
  body.kh .khnav button{padding:0 8px;font-size:14px}
  body.kh .brand b{font-size:16px}
}

@media (max-width:760px){
  .brand span,.hbtn .lbl,.stat .k{display:none}
  .hdr{gap:4px}.hdr-right{gap:6px;font-size:14px}
  .brand{overflow:hidden;flex:0 1 auto}.brand b{font-size:17px;overflow:hidden;text-overflow:ellipsis}
  .hdr-mid{flex:1 0 auto;justify-content:flex-end;gap:0}.hbtn{padding:0 7px}
  .score .big{font-size:30px}
  .rail{display:none}
  .idx-mobile{display:inline-flex}
  .panel{margin:0}
  .page-body{padding-right:max(16px,env(safe-area-inset-right,0px))}
  .menu{left:auto;right:-60px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Profile (top right). Dashboard pages only: test screens keep the real ACT header. */
.profile{display:none}
body.kh .profile{display:block}
.profbtn{position:relative;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0}
.profbtn:hover{background:rgba(233,236,239,.14)}
.avatar{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--k-blue);color:var(--k-blue-ink);font-weight:700;font-size:15px;flex:none}
.avatar svg{width:18px;height:18px}
.avatar.guest{background:transparent;color:var(--hdr-fg);box-shadow:inset 0 0 0 1.5px rgba(233,236,239,.6)}
.avatar.big{width:44px;height:44px;font-size:19px}
.avatar.big.guest{color:var(--ink-2);box-shadow:inset 0 0 0 1.5px var(--line)}
.avatar.big svg{width:24px;height:24px}
/* Sync dot: green when scores sync to your account, amber when they stay on this device. */
.profbtn::after{content:"";position:absolute;right:3px;bottom:3px;width:10px;height:10px;border-radius:50%;background:#e0a92e;box-shadow:0 0 0 2px var(--hdr)}
.profbtn.in::after{background:#3fb37f}
.menu.profmenu{left:auto;right:0;min-width:296px;max-width:calc(100vw - 16px);padding:0;overflow:hidden}
.prof-head{display:flex;gap:12px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.prof-name{font-weight:700;overflow-wrap:anywhere}
.prof-sub{font-size:13px;color:var(--ink-3);margin-top:2px}
.prof-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.prof-stats div{background:var(--panel);padding:10px 16px}
.prof-stats b{display:block;font-size:20px;font-variant-numeric:tabular-nums}
.prof-stats span{font-size:12px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.prof-goal{padding:10px 16px;font-size:14px;color:var(--ink-2);border-bottom:1px solid var(--line)}
.profmenu>button{padding:10px 16px;font-weight:700}
.prof-foot{padding:12px 16px;border-top:1px solid var(--line);display:flex;justify-content:flex-end}
.prof-foot .btn{text-decoration:none;display:inline-flex;align-items:center}
.prof-foot .btn.pri{background:var(--k-blue);border-color:var(--k-blue);color:var(--k-blue-ink)}
/* Phone: the logo already goes to the dashboard, so Home gives up its spot for the profile button. */
@media (max-width:760px){body.kh #navHome{display:none}.profbtn{width:36px;height:36px}}
@media (max-width:360px){body.kh .khnav button{padding:0 6px;font-size:13px}}