:root{
  --bg:#f5f6f8; --card:#fff; --ink:#1b1f29; --muted:#667085; --line:#e4e7ec; --soft:#f0f2f5;
  --brand:#4f46e5; --brand-soft:#eef2ff;
  --physics:#2563eb; --chemistry:#d97706; --botany:#16a34a; --zoology:#db2777;
  --good:#16a34a; --mid:#d97706; --bad:#dc2626; --info:#0284c7;
  --r:12px; --shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{line-height:1.25;margin:0 0 .5em}
h1{font-size:1.6rem} h2{font-size:1.25rem} h3{font-size:1.05rem}
.muted{color:var(--muted)} .small{font-size:.85rem} .tiny{font-size:.75rem}
.wrap{max-width:1180px;margin:0 auto;padding:20px 16px 60px}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.between{justify-content:space-between}
.grow{flex:1}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr))}
.grid>*{min-width:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:var(--shadow)}
.card h2,.card h3{margin-top:0}
.stack>*+*{margin-top:12px}

/* top bar */
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar .in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:0 16px;height:56px}
.logo{font-weight:800;color:var(--ink);font-size:1.1rem;white-space:nowrap}
.logo span{color:var(--brand)}
.nav{display:flex;gap:4px;overflow-x:auto;flex:1;scrollbar-width:none}
.nav a{padding:8px 12px;border-radius:8px;color:var(--muted);font-weight:600;white-space:nowrap}
.nav a:hover{background:var(--soft);text-decoration:none;color:var(--ink)}
.nav a.on{background:var(--brand-soft);color:var(--brand)}
.who{font-size:.85rem;color:var(--muted);white-space:nowrap}

/* buttons & forms */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--ink);
  padding:8px 14px;border-radius:9px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none!important;line-height:1.2}
.btn:hover{background:var(--soft)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{filter:brightness(1.08)}
.btn.good{background:var(--good);border-color:var(--good);color:#fff}
.btn.danger{color:var(--bad);border-color:#f3c2c2}
.btn.sm{padding:5px 10px;font-size:.85rem}
.btn.lg{padding:12px 22px;font-size:1.05rem}
.btn:disabled{opacity:.45;cursor:not-allowed}
input[type=text],input[type=search],input[type=tel],input[type=email],input[type=password],input[type=number],input[type=date],select,textarea{
  font:inherit;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;width:100%;color:var(--ink)}
textarea{min-height:90px;resize:vertical}
label{font-weight:600;font-size:.9rem;display:block;margin-bottom:4px}
.field{margin-bottom:14px}
.inline-form{display:inline}
.check{display:inline-flex;align-items:center;gap:6px;font-weight:500;margin-right:12px;cursor:pointer}

.flash{padding:10px 14px;border-radius:9px;margin-bottom:14px;border:1px solid}
.flash.ok{background:#ecfdf3;border-color:#abefc6;color:#067647}
.flash.error{background:#fef3f2;border-color:#fecdca;color:#b42318}

/* pills / badges */
.pill{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.75rem;font-weight:700;background:var(--soft);color:var(--muted);white-space:nowrap}
.pill.strong{background:#dcfce7;color:#166534}
.pill.average{background:#fef3c7;color:#92400e}
.pill.weak{background:#fee2e2;color:#991b1b}
.pill.physics{background:#dbeafe;color:#1e40af}
.pill.chemistry{background:#fef3c7;color:#92400e}
.pill.botany{background:#dcfce7;color:#166534}
.pill.zoology{background:#fce7f3;color:#9d174d}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}

/* tabs */
.tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:16px}
.tabs a,.tabs button{border:0;background:none;font:inherit;font-weight:700;color:var(--muted);padding:10px 14px;cursor:pointer;
  border-bottom:3px solid transparent;margin-bottom:-1px;text-decoration:none}
.tabs .on{color:var(--ink);border-bottom-color:var(--brand)}
.tabs .sep{flex:0 0 1px;background:var(--line);margin:8px 6px}

/* stats */
.stat{padding:14px 16px}
.stat .v{font-size:1.6rem;font-weight:800}
.stat .l{color:var(--muted);font-size:.85rem}
.bar{height:8px;background:var(--soft);border-radius:99px;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--brand);border-radius:99px}

/* tables */
table.t{width:100%;border-collapse:collapse}
table.t th,table.t td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
table.t th{font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:700}
table.t tr:hover td{background:#fafbfc}
.tscroll{overflow-x:auto}

/* home */
.hero-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.big-card{display:block;padding:22px;border-radius:var(--r);color:#fff!important;text-decoration:none!important;box-shadow:var(--shadow)}
.big-card h2{margin:0 0 4px;font-size:1.4rem}
.big-card.study{background:linear-gradient(135deg,#4f46e5,#7c3aed)}
.big-card.test{background:linear-gradient(135deg,#0ea5e9,#2563eb)}
.big-card.plan{background:linear-gradient(135deg,#16a34a,#0d9488)}
.task{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.task:last-child{border-bottom:0}
.task .k{font-size:.7rem;font-weight:800;text-transform:uppercase;padding:2px 7px;border-radius:6px;background:var(--soft);color:var(--muted);margin-top:2px}
.task .k.study{background:#e0e7ff;color:#3730a3}.task .k.test{background:#e0f2fe;color:#075985}
.task .k.mock{background:#fce7f3;color:#9d174d}.task .k.revise{background:#fef3c7;color:#92400e}
.task.done .title{text-decoration:line-through;color:var(--muted)}

/* study */
.chapter-list{display:grid;gap:10px}
.ch-row{display:flex;gap:14px;align-items:center;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:10px;color:var(--ink)!important;text-decoration:none!important}
.ch-row:hover{border-color:#c7cbd4}
.ch-num{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;font-weight:800;color:#fff;flex:none}
.study-layout{display:grid;grid-template-columns:270px 1fr;gap:20px;align-items:start}
.study-layout>*,.exam-layout>*{min-width:0}
.toc{position:sticky;top:72px;max-height:calc(100vh - 90px);overflow:auto;font-size:.9rem}
.toc a{display:flex;gap:6px;padding:5px 8px;border-radius:6px;color:var(--ink)}
.toc a:hover{background:var(--soft);text-decoration:none}
.toc .sub{padding-left:22px;color:var(--muted);font-size:.84rem}
.toc .tick{color:var(--good);font-weight:800;width:14px;flex:none}
.topic-block{scroll-margin-top:70px}
.topic-block+.topic-block{margin-top:16px}
.prose{font-size:1rem;line-height:1.7}
.prose img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:#fff;padding:6px;display:block;margin:12px auto}
.prose table{border-collapse:collapse;margin:10px 0;font-size:.93rem;display:block;overflow-x:auto;max-width:100%}
.prose th,.prose td{border:1px solid var(--line);padding:6px 9px;text-align:left}
.prose th{background:var(--soft)}
.prose blockquote{margin:12px 0;padding:10px 14px;background:#fffbeb;border-left:4px solid #f59e0b;border-radius:6px}
.prose code{background:var(--soft);padding:1px 5px;border-radius:4px}
.prose h3{margin-top:1.2em}
.empty-content{padding:14px;border:1px dashed var(--line);border-radius:9px;color:var(--muted);font-size:.9rem}

/* test selection */
.sel-layout{padding-bottom:150px}
.chap{border:1px solid var(--line);border-radius:10px;background:#fff;margin-bottom:8px}
.chap.on{border-color:#a5b4fc;box-shadow:0 0 0 3px #eef2ff}
.chap-head{display:flex;gap:12px;align-items:center;padding:12px 14px}
.chap-head .name{flex:1;font-weight:600}
.chap-head .meta{font-size:.8rem;color:var(--muted);white-space:nowrap}
.chap-head .exp{border:0;background:var(--soft);border-radius:7px;padding:5px 10px;font:inherit;font-size:.8rem;font-weight:700;color:var(--muted);cursor:pointer}
.chap-body{border-top:1px solid var(--line);padding:12px 14px 14px;display:none;background:#fcfcfd;border-radius:0 0 10px 10px}
.chap.open .chap-body{display:block}
.cbx{width:20px;height:20px;accent-color:var(--brand);cursor:pointer;flex:none}
.range-row{display:flex;gap:12px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.range-row input[type=range]{flex:1;min-width:180px;accent-color:var(--brand)}
.range-row .lbl{font-size:.85rem;color:var(--muted);min-width:220px}
.topic-line{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-top:1px dashed var(--line)}
.topic-line:first-of-type{border-top:0}
.topic-line .tn{flex:1}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.chip{border:1px solid var(--line);background:#fff;border-radius:99px;padding:3px 10px;font-size:.78rem;cursor:pointer;color:var(--muted);user-select:none}
.chip.on{background:var(--brand-soft);border-color:#a5b4fc;color:#3730a3;font-weight:600}
.qn{font-size:.75rem;color:var(--muted);white-space:nowrap}
.qn.zero{color:#c0c4cc}
.subj-group{margin-bottom:22px}
.subj-group>h3{display:flex;align-items:center;gap:8px}
.tray{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(0,0,0,.06);z-index:30}
.tray .in{max-width:1180px;margin:0 auto;padding:12px 16px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.tray .summary{flex:1;min-width:220px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{border:0;background:#fff;padding:8px 12px;font:inherit;font-size:.85rem;font-weight:700;color:var(--muted);cursor:pointer;border-right:1px solid var(--line)}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--brand);color:#fff}
.seg button small{display:block;font-weight:500;font-size:.7rem;opacity:.85}
.warn{color:#b45309;font-size:.82rem}

/* exam */
body.exam-mode{background:#eef0f4}
.exam-top{background:#1e1b4b;color:#fff;position:sticky;top:0;z-index:20}
.exam-top .in{max-width:1280px;margin:0 auto;padding:10px 16px;display:flex;gap:16px;align-items:center}
.timer{font-variant-numeric:tabular-nums;font-size:1.3rem;font-weight:800;background:rgba(255,255,255,.12);padding:4px 12px;border-radius:8px}
.timer.low{background:#dc2626}
.exam-layout{max-width:1280px;margin:0 auto;padding:16px;display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start}
.qcard{background:#fff;border-radius:var(--r);padding:22px;border:1px solid var(--line);min-height:420px}
.qhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;color:var(--muted);font-size:.9rem}
.qtext{font-size:1.08rem;line-height:1.65;margin-bottom:16px}
.qimg{max-width:100%;max-height:340px;display:block;margin:0 0 16px;border:1px solid var(--line);border-radius:8px;padding:6px;background:#fff}
.opt{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;margin-bottom:10px;cursor:pointer;background:#fff}
.opt:hover{border-color:#a5b4fc}
.opt .l{width:28px;height:28px;border-radius:50%;border:1.5px solid #c7cbd4;display:grid;place-items:center;font-weight:800;font-size:.85rem;flex:none}
.opt.sel{border-color:var(--brand);background:var(--brand-soft)}
.opt.sel .l{background:var(--brand);border-color:var(--brand);color:#fff}
.qactions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.palette{background:#fff;border-radius:var(--r);border:1px solid var(--line);padding:14px;position:sticky;top:70px;max-height:calc(100vh - 90px);overflow:auto}
.pal-sec{font-size:.78rem;font-weight:800;text-transform:uppercase;color:var(--muted);margin:10px 0 6px}
.pal-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.pq{aspect-ratio:1;border:1px solid var(--line);border-radius:7px;background:#f3f4f6;font:inherit;font-size:.8rem;font-weight:700;cursor:pointer;color:var(--ink);position:relative}
.pq.nv{background:#fff}
.pq.na{background:#fee2e2;border-color:#fca5a5;color:#991b1b}
.pq.ans{background:#16a34a;border-color:#16a34a;color:#fff}
.pq.mk{background:#7c3aed;border-color:#7c3aed;color:#fff;border-radius:50%}
.pq.mka{background:#7c3aed;border-color:#7c3aed;color:#fff;border-radius:50%}
.pq.mka::after{content:"";position:absolute;right:2px;bottom:2px;width:8px;height:8px;border-radius:50%;background:#22c55e;border:1.5px solid #fff}
.pq.cur{outline:3px solid #f59e0b;outline-offset:1px}
.legend{display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:.75rem;color:var(--muted);margin:10px 0}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:16px;height:16px;border-radius:4px;display:inline-block;border:1px solid var(--line)}
.sec-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.sec-tabs button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 12px;font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.sec-tabs button.on{background:#1e1b4b;color:#fff;border-color:#1e1b4b}
.modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.5);display:none;align-items:center;justify-content:center;z-index:50;padding:16px}
.modal-bg.show{display:flex}
.modal{background:#fff;border-radius:14px;padding:22px;max-width:440px;width:100%}

/* result */
.score-hero{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}
.ring{width:150px;height:150px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}
.kpi{background:var(--soft);border-radius:10px;padding:10px 12px}
.kpi .v{font-size:1.3rem;font-weight:800}
.kpi .l{font-size:.78rem;color:var(--muted)}
.lvl-strip{display:flex;height:12px;border-radius:99px;overflow:hidden;background:var(--soft)}
.lvl-strip i{display:block;height:100%}
.acc-bar{width:120px;height:8px;background:var(--soft);border-radius:99px;overflow:hidden;display:inline-block;vertical-align:middle}
.acc-bar i{display:block;height:100%}
.delta{font-weight:700;font-size:.82rem}
.delta.up{color:var(--good)} .delta.down{color:var(--bad)}
.spark{vertical-align:middle}
.review-q{border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:10px;background:#fff}
.review-q .o{padding:6px 10px;border-radius:7px;margin:4px 0;border:1px solid var(--line)}
.review-q .o.right{background:#ecfdf3;border-color:#86efac}
.review-q .o.wrong{background:#fef2f2;border-color:#fca5a5}
.expl{background:#f8fafc;border-left:3px solid var(--info);padding:8px 12px;margin-top:8px;border-radius:6px;font-size:.92rem}

/* planner */
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:10px}
.day{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px;min-height:110px;font-size:.8rem}
.day.today{border:2px solid var(--brand)}
.day.past{opacity:.75}
.day .d{font-weight:800;font-size:.78rem;color:var(--muted);margin-bottom:6px;display:flex;justify-content:space-between}
.day .it{padding:5px 6px;border-radius:6px;margin-bottom:4px;line-height:1.3;border-left:3px solid var(--line);background:var(--soft)}
.day .it.done{opacity:.55;text-decoration:line-through}
.day .it.study{border-left-color:#6366f1}.day .it.test{border-left-color:#0284c7}.day .it.mock{border-left-color:#db2777}.day .it.revise{border-left-color:#d97706}

/* admin */
.admin-nav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.editor{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.editor textarea{min-height:480px;font-family:ui-monospace,Consolas,monospace;font-size:.88rem}
.preview{border:1px solid var(--line);border-radius:9px;padding:14px;min-height:480px;max-height:70vh;overflow:auto;background:#fff}
.tree-ch{border:1px solid var(--line);border-radius:9px;margin-bottom:6px;background:#fff}
.tree-ch summary{padding:10px 12px;cursor:pointer;font-weight:600}
.tree-ch .body{padding:4px 12px 12px}
.cov{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:2px;background:#e5e7eb}
.cov.c{background:#16a34a}.cov.q{background:#2563eb}

@media (max-width:900px){
  .study-layout,.exam-layout,.editor{grid-template-columns:1fr}
  .toc,.palette{position:static;max-height:none}
  .week{grid-template-columns:1fr}
  .day{min-height:0}
  .score-hero{grid-template-columns:1fr;justify-items:center}
  .who{display:none}
  .tray .in{gap:10px;padding:10px 12px}
  .tray .summary{min-width:100%}
  #startBtn{flex:1;justify-content:center}
  .acc-bar{width:60px}
}

/* planner v2 kinds */
.task .k.learn{background:#e0e7ff;color:#3730a3}.task .k.diagnostic{background:#ede9fe;color:#5b21b6}
.task .k.weekly{background:#fce7f3;color:#9d174d}.task .k.deep{background:#fef3c7;color:#92400e}
.task .k.analysis{background:#f1f5f9;color:#475569}.task .k.event{background:#fee2e2;color:#991b1b}
.task.missed .title{color:var(--bad)}
.day .it.learn{border-left-color:#6366f1}.day .it.diagnostic{border-left-color:#7c3aed}.day .it.weekly{border-left-color:#db2777}
.day .it.deep{border-left-color:#d97706}.day .it.analysis{border-left-color:#94a3b8}.day .it.event{border-left-color:#dc2626;background:#fee2e2}
.day .it.missed{opacity:.6;text-decoration:line-through;border-left-color:var(--bad)}
.day.leave{background:repeating-linear-gradient(45deg,#f8fafc,#f8fafc 8px,#eef2f7 8px,#eef2f7 16px)}
.day .ev{font-size:.72rem;font-weight:700;color:#475569;margin-bottom:4px}
.dot.k-learn{background:#6366f1}.dot.k-test{background:#0284c7}.dot.k-revise{background:#d97706}.dot.k-diagnostic{background:#7c3aed}
.dot.k-weekly{background:#db2777}.dot.k-mock{background:#be185d}.dot.k-event{background:#dc2626}
details>summary.btn::-webkit-details-marker{display:none}

/* today's plan highlights on the chapter page */
.today-banner{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:#eef2ff;border:1px solid #c7d2fe;border-radius:12px;padding:12px 16px;margin-bottom:16px}
.tb-badge{display:inline-block;font-size:.75rem;font-weight:800;padding:2px 8px;border-radius:6px;margin-right:6px}
.tb-badge.learn{background:#4f46e5;color:#fff}.tb-badge.revise{background:#f59e0b;color:#fff}
.tb-link{font-weight:700}
.today-card.learn{border:2px solid #6366f1;box-shadow:0 0 0 4px #eef2ff}
.today-card.revise{border:2px solid #f59e0b;box-shadow:0 0 0 4px #fffbeb}
.today-tag{display:inline-block;font-size:.78rem;font-weight:800;padding:3px 10px;border-radius:99px;margin-bottom:8px}
.today-tag.learn{background:#4f46e5;color:#fff}.today-tag.revise{background:#f59e0b;color:#fff}
.toc a.toc-today.learn{background:#eef2ff;font-weight:700}.toc a.toc-today.revise{background:#fffbeb;font-weight:700}

/* open planner */
.day .it.mine{box-shadow:inset 0 0 0 1px #a5b4fc}
.day .it.mine::before{content:"✎ ";font-weight:700;color:#4f46e5}
.blk{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px;background:#fff}
.blk.study{border-left:5px solid #6366f1}.blk.revise{border-left:5px solid #f59e0b}
.blk .chips .chip.done{border-style:dashed}
.blk .chips .chip.done::after{content:" ✓";color:var(--good)}
.cap-bar{height:10px;background:var(--soft);border-radius:99px;overflow:hidden;display:flex}
.cap-bar i{display:block;height:100%}

details.partly{position:relative;display:inline-block}
details.partly>summary{list-style:none}
details.partly>summary::-webkit-details-marker{display:none}
.partly-box{position:absolute;right:0;top:110%;z-index:15;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:240px}

.review-card{border-left:5px solid #7c3aed;background:linear-gradient(180deg,#faf5ff,#fff 60%)}

/* syllabus completion status */
.cstat{display:flex;gap:14px;align-items:center;border-radius:12px;padding:12px 16px;margin-bottom:16px;border:1px solid;flex-wrap:wrap}
.cstat-dot{width:14px;height:14px;border-radius:50%;flex:none}
.cstat-title{font-size:1rem}
.cstat-sep{color:var(--muted);margin:0 4px}
.cstat.green{background:#ecfdf3;border-color:#86efac;color:#14532d}.cstat.green .cstat-dot{background:#16a34a}
.cstat.yellow{background:#fefce8;border-color:#fde047;color:#713f12}.cstat.yellow .cstat-dot{background:#eab308}
.cstat.red{background:#fef2f2;border-color:#fca5a5;color:#7f1d1d}.cstat.red .cstat-dot{background:#dc2626}
.cstat a{color:inherit;text-decoration:underline}
.cstat-scale span{display:inline-block;padding:2px 7px;border-radius:6px;margin-left:3px;font-weight:700;opacity:.55}
.cstat-scale .g{background:#bbf7d0}.cstat-scale .y{background:#fef08a}.cstat-scale .r{background:#fecaca}
.cstat.green .cstat-scale .g,.cstat.yellow .cstat-scale .y,.cstat.red .cstat-scale .r{opacity:1;outline:2px solid currentColor}

/* key dates */
.keydates{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:16px}
.kd{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;border-top:4px solid #94a3b8}
.kd-ico{font-size:1.4rem;line-height:1}
.kd-date{font-weight:800}
.kd-target{border-top-color:#16a34a}.kd-four{border-top-color:#dc2626}.kd-neet{border-top-color:#4f46e5}.kd-test{border-top-color:#db2777}
.kd-finish.green{border-top-color:#16a34a;background:#ecfdf3}.kd-finish.yellow{border-top-color:#eab308;background:#fefce8}.kd-finish.red{border-top-color:#dc2626;background:#fef2f2}
.day.keyday{box-shadow:0 0 0 2px #c7d2fe}
.day.kd-finish.green{box-shadow:0 0 0 3px #22c55e}.day.kd-finish.yellow{box-shadow:0 0 0 3px #eab308}.day.kd-finish.red{box-shadow:0 0 0 3px #ef4444}
.day.kd-four{box-shadow:0 0 0 2px #fca5a5}.day.kd-target{box-shadow:0 0 0 2px #86efac}.day.kd-neet{box-shadow:0 0 0 3px #4f46e5}
.kd-flag{font-size:.7rem;font-weight:800;padding:3px 6px;border-radius:6px;margin-bottom:5px;background:#eef2ff;color:#3730a3}
.kd-flag.kd-finish.green{background:#dcfce7;color:#14532d}.kd-flag.kd-finish.yellow{background:#fef9c3;color:#713f12}.kd-flag.kd-finish.red{background:#fee2e2;color:#7f1d1d}
.kd-flag.kd-four{background:#fee2e2;color:#991b1b}.kd-flag.kd-target{background:#dcfce7;color:#166534}.kd-flag.kd-test{background:#fce7f3;color:#9d174d}
.qtext table{border-collapse:collapse;margin:10px 0}.qtext th,.qtext td{border:1px solid var(--line);padding:6px 12px;text-align:left}

/* ===================== friendlier layout (Oct 2026) ===================== */
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.page-head h1{margin:0 0 2px}
.status-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:.85rem;font-weight:700;border:1px solid;white-space:nowrap}
.status-chip:hover{text-decoration:none;filter:brightness(.97)}
.status-chip.green{background:#ecfdf3;color:#067647;border-color:#abefc6}
.status-chip.yellow{background:#fffaeb;color:#b54708;border-color:#fedf89}
.status-chip.red{background:#fef3f2;color:#b42318;border-color:#fecdca}
.grid.split{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start}
@media (max-width:900px){.grid.split{grid-template-columns:1fr}}

/* "Up next" hero */
.next-up{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:0;
  background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff}
.next-up h2{margin:2px 0 4px;font-size:1.4rem;color:#fff}
.next-up .muted,.next-up .small.muted{color:#e0e7ff}
.next-up .eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:#c7d2fe}
.next-up .btn{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35);color:#fff}
.next-up .btn.primary{background:#fff;color:#4338ca;border-color:#fff}
.next-up.done{background:linear-gradient(135deg,#059669,#10b981)}

/* change-my-plan hub */
.hub{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--shadow)}
.hub-head h2{margin:0}
.hub-head{margin-bottom:10px}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(170px,100%),1fr));gap:8px}
.hub-tile{display:flex;flex-direction:column;gap:2px;text-align:left;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;
  background:#fff;color:var(--ink);cursor:pointer;font:inherit;transition:border-color .15s,background .15s}
.hub-tile:hover{border-color:#a5b4fc;background:var(--brand-soft);text-decoration:none}
.hub-tile .hi{font-size:1.3rem;line-height:1.1}
.hub-tile b{font-size:.92rem}
.hub-tile span:last-child{font-size:.76rem;color:var(--muted);line-height:1.35}
.hub.compact .hub-grid{grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr))}
.hub.compact .hub-tile span:last-child{display:none}

/* dialogs */
dialog.dlg{border:0;border-radius:16px;padding:22px;max-width:min(520px,calc(100vw - 24px));width:100%;box-shadow:0 20px 60px rgba(16,24,40,.25)}
dialog.dlg::backdrop{background:rgba(15,23,42,.45)}
dialog.dlg h3{margin:0 0 6px;font-size:1.2rem}
.dlg-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.pick{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.pick-o input{position:absolute;opacity:0;pointer-events:none}
.pick-o span{display:flex;flex-direction:column;align-items:center;min-width:76px;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;font-weight:800;cursor:pointer}
.pick-o small{font-weight:500;font-size:.7rem;color:var(--muted)}
.pick-o.wide span{align-items:flex-start;text-align:left;gap:2px}
.pick-o.wide small{font-size:.78rem}
.pick-o input:checked+span{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
.pick-o input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}

/* planner sub-tabs */
.subtabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);margin:0 0 16px;position:sticky;top:56px;background:var(--bg);z-index:10;padding-top:4px}
.subtabs a{padding:10px 14px;border-bottom:3px solid transparent;color:var(--muted);font-weight:700;white-space:nowrap;font-size:.92rem}
.subtabs a:hover{color:var(--ink);text-decoration:none}
.subtabs a.on{color:var(--brand);border-bottom-color:var(--brand)}
.subtabs .count{font-style:normal;background:var(--brand);color:#fff;border-radius:999px;font-size:.7rem;padding:1px 7px;margin-left:2px}
.subtabs .count.yellow{background:#f59e0b}.subtabs .count.red{background:var(--bad)}
.mode-card{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:14px;border:1.5px solid var(--line);border-radius:12px}
.mode-card.on{border-color:var(--brand);background:var(--brand-soft)}

/* quick stats strip */
.quick-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.quick-stats a{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;color:var(--ink);box-shadow:var(--shadow)}
.quick-stats a:hover{text-decoration:none;border-color:#a5b4fc}
.quick-stats b{display:block;font-size:1.35rem}
.quick-stats small{font-size:.8rem;color:var(--muted);font-weight:600}
.quick-stats span{font-size:.8rem;color:var(--muted)}
@media (max-width:600px){.quick-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* tips & help */
.tips{border-left:4px solid var(--brand);margin-bottom:16px}
.help-btn{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--line);font-weight:800;color:var(--muted);flex:none}
.help-btn:hover,.help-btn.on{border-color:var(--brand);color:var(--brand);text-decoration:none}
.faq{border-bottom:1px solid var(--line);padding:10px 0}
.faq summary{cursor:pointer;font-weight:700;list-style:none}
.faq summary::before{content:"＋ ";color:var(--brand)}
.faq[open] summary::before{content:"－ "}

/* mobile bottom navigation */
.bottomnav{display:none}
@media (max-width:760px){
  .topbar .nav{display:none}
  .topbar .in{justify-content:space-between}
  .bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--line);
    padding:4px 4px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -2px 10px rgba(16,24,40,.06)}
  .bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 0;font-size:.7rem;font-weight:700;color:var(--muted);border-radius:10px}
  .bottomnav a span{font-size:1.25rem;line-height:1}
  .bottomnav a.on{color:var(--brand);background:var(--brand-soft)}
  .bottomnav a:hover{text-decoration:none}
  .wrap{padding-bottom:90px}
  .subtabs{top:56px}
  .next-up .row{width:100%}
  .next-up .row .btn.lg{flex:1;justify-content:center}
  .next-up .row form{flex:1;display:flex}
  .next-up .row form .btn{width:100%;justify-content:center}
}
.mobile-only{display:none}
@media (max-width:600px){
  .mobile-only{display:inline}
  .task{flex-wrap:wrap}
  .task>.row{width:100%;justify-content:flex-end;padding-left:0}
}
.steps{display:flex;gap:6px;margin-bottom:10px}
.steps span{padding:4px 12px;border-radius:999px;background:var(--soft);color:var(--muted);font-size:.8rem;font-weight:700}
.steps span.on{background:var(--brand);color:#fff}
a.who{color:var(--muted)} a.who:hover{color:var(--brand);text-decoration:none}
@media (max-width:900px){ .topbar a.who{display:inline;font-size:1.2rem} .who-name{display:none} }

/* ---- exam calendar */
.ex-filter{margin-bottom:14px}
.ex-stats{margin-bottom:6px}
.ex-month{margin:22px 0 8px;font-size:1.05rem;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.ex-list{display:flex;flex-direction:column;gap:10px}
.ex-row{display:grid;grid-template-columns:64px 1fr 190px;gap:14px;align-items:start;padding:14px 16px}
.ex-row.soon{border-color:#dc2626;box-shadow:0 0 0 1px #dc2626 inset}
.ex-row.past{opacity:.92;background:var(--soft)}
.ex-date{text-align:center;border:1.5px solid var(--line);border-radius:10px;padding:6px 0;background:var(--card)}
.ex-date b{display:block;font-size:1.5rem;line-height:1.1}
.ex-date span{font-size:.75rem;color:var(--muted);text-transform:uppercase;font-weight:700}
.ex-syl{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.ex-syl .pill{min-width:74px;text-align:center;margin-right:6px}
.ex-side{text-align:right}
.ex-side .acc-bar{width:100px}
.ex-days{font-weight:800;font-size:1rem;margin-bottom:4px}
.ex-days.bad{color:#dc2626}
.ex-marks{font-size:1.6rem;font-weight:800;line-height:1}
.ex-marks span{font-size:.9rem;color:var(--muted);font-weight:600}
.ex-neet{margin-top:22px;border:2px solid var(--brand)}
.print-only{display:none}
@media (max-width:700px){
  .ex-row{grid-template-columns:52px 1fr;gap:10px}
  .ex-side{grid-column:1 / -1;text-align:left;border-top:1px dashed var(--line);padding-top:8px}
}
@media print{
  .noprint,.topbar,.tabbar,nav,header,footer,.flash{display:none !important}
  .print-only{display:block}
  body{background:#fff}
  .card{box-shadow:none;break-inside:avoid}
  .ex-row{grid-template-columns:56px 1fr 150px}
  .ex-row.past{background:#f6f6f6}
}

/* ---- test results */
.xp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.xp{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.xp-score{font-size:1.7rem;font-weight:800;line-height:1.1;margin-top:4px}
.xp-score span{font-size:.85rem;color:var(--muted);font-weight:600}
.xp-bar{height:8px;background:var(--soft);border-radius:99px;overflow:hidden;margin:6px 0}
.xp-bar i{display:block;height:100%;border-radius:99px}
.up{color:#15803d;font-weight:700}.down{color:#b91c1c;font-weight:700}
.chart-card .legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.8rem;color:var(--muted);margin-bottom:4px}
.chart-card .legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
svg.chart{width:100%;height:auto;display:block;overflow:visible}
svg.chart .grid{stroke:var(--line);stroke-width:1}
svg.chart .ax{font-size:11px;fill:var(--muted)}
svg.chart .ax.mut{font-size:10px;opacity:.8}
svg.chart .lbl{font-size:11px;fill:var(--ink, #111);font-weight:700}
svg.chart .hit{cursor:pointer}
.chart-tip{position:fixed;z-index:50;background:#111827;color:#fff;font-size:12px;padding:5px 8px;border-radius:6px;pointer-events:none;white-space:nowrap}
.res-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.res-top{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;margin:8px 0}
.res-marks{font-size:1.6rem;font-weight:800;line-height:1}
.res-marks span{font-size:.9rem;color:var(--muted);font-weight:600}
.res-marks em{font-style:normal;font-size:.9rem;color:var(--brand);margin-left:4px}
.res-scale{position:relative;height:16px;margin:0 8px}
.res-scale .track{position:absolute;left:0;right:0;top:5px;height:6px;border-radius:99px;background:var(--soft)}
.res-scale .mk{position:absolute;top:1px;width:14px;height:14px;margin-left:-7px;border-radius:50%;border:2px solid var(--card)}
.res-scale .mk.avg,.res-key i.avg{background:#9ca3af}
.res-scale .mk.top,.res-key i.top{background:#334155}
.res-scale .mk.you,.res-key i.you{background:var(--brand)}
.res-scale .mk.you{width:16px;height:16px;margin-left:-8px;top:0;z-index:2}
.res-key{display:flex;gap:12px;flex-wrap:wrap;font-size:.75rem;color:var(--muted);margin-top:4px}
.res-key i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px}
.res-key b{color:var(--ink, #111)}
.res-subj{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.82rem}
.res-subj i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px}
.res-ranks{display:flex;gap:0;margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.res-ranks div{flex:1;text-align:center;border-right:1px solid var(--line)}
.res-ranks div:last-child{border-right:0}
.res-ranks small{display:block;font-size:.7rem;color:var(--muted)}
.res-ranks b{font-size:1.05rem}
@media (max-width:800px){.xp-grid{grid-template-columns:repeat(2,1fr)}.res-list{grid-template-columns:1fr}}
@media (max-width:480px){.res-top{grid-template-columns:1fr}}

/* ---- home: exam countdown */
.cd-row{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:stretch;margin-bottom:16px}
.cd{display:flex;gap:14px;align-items:center;text-decoration:none;color:inherit;padding:14px 16px}
.cd:hover{border-color:var(--brand)}
.cd-num{min-width:74px;text-align:center;border-radius:12px;padding:8px 6px;background:var(--brand-soft);color:var(--brand)}
.cd-num b{display:block;font-size:2rem;line-height:1;font-weight:800}
.cd-num span{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px}
.cd-soon .cd-num{background:#fee2e2;color:#b91c1c}
.cd-title{font-weight:800;font-size:1.05rem}
.cd-all{align-self:center;white-space:nowrap}
@media (max-width:760px){.cd-row{grid-template-columns:1fr}.cd-all{justify-self:end}}
.cd .eyebrow{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--muted)}

/* ---- exam days in the planner calendar */
.week .day.examday{background:#fef2f2;border-color:#dc2626;box-shadow:inset 0 0 0 1px #dc2626}
.exam-flag{display:block;background:#b91c1c;color:#fff !important;font-weight:800;font-size:.72rem;border-radius:5px;padding:2px 6px;margin:2px 0 4px;text-decoration:none}

/* ---- PYQ */
.pyq-t td.n, .pyq-t th { text-align: center; }
.pyq-t th:first-child { text-align: left; }
.pyq-t .on { background: var(--brand-soft); }
.pyq-t .subj-row td { background: var(--soft); padding-top: 8px; }
.pyq-badge{display:inline-block;background:#fef3c7;color:#92400e;border:1px solid #f59e0b;font-weight:800;font-size:.78rem;border-radius:99px;padding:2px 10px;margin-bottom:8px}
.qimg.pyq{max-height:none;max-width:min(100%,820px);padding:4px}
.expl img{max-width:min(100%,820px);display:block;margin:6px 0;border:1px solid var(--line);border-radius:6px;background:#fff}
.pyq-t td.heat{background:rgba(79,70,229,calc(var(--h) * .85));color:#111;font-weight:700;min-width:44px}
.pyq-t td.heat.dk{color:#fff}
.share{display:inline-block;width:60px;height:7px;border-radius:99px;background:var(--soft);vertical-align:middle;overflow:hidden}
.share i{display:block;height:100%;background:var(--brand)}

/* PYQ bank (31 Oct 2026): figures / formulas inside question text and options */
.qtext img, .opt img, .rq img { max-width: 100%; height: auto; }
.qtext img[style*="display:block"] { background: #fff; border-radius: 6px; }
.opt img { background: #fff; }
.qtext sub, .qtext sup, .opt sub, .opt sup { font-size: .72em; line-height: 0; }
/* PYQ analysis (31 Oct 2026): wide chapter column stays visible while years scroll */
.pyq-t td:first-child, .pyq-t th:first-child { min-width: 230px; position: sticky; left: 0; background: var(--card, #fff); z-index: 1; }
.pyq-t tr.sub-row td:first-child { min-width: 230px; }
.pyq-t tr.sub-row td { padding-top: 3px; padding-bottom: 3px; }
/* learn / revision flags on the Study chapter list */
.flag{display:inline-block;font-size:.68rem;font-weight:700;padding:1px 6px;border-radius:4px;margin-left:4px;vertical-align:middle;letter-spacing:.02em}
.fl-learn{background:#2563eb;color:#fff}.fl-part{background:#dbeafe;color:#1e40af}
.fl-rev{background:#7c3aed;color:#fff}.fl-todo{background:transparent;color:#8b8fa3;border:1px dashed #b9bccb}

/* ---- colour presets & text size (Settings -> Appearance, 31 Oct 2026). Default = indigo. ---- */
html[data-theme="blue"]   { --brand:#2563eb; --brand-soft:#e8f0fe; --bg:#f3f7fc; }
html[data-theme="sky"]    { --brand:#0284c7; --brand-soft:#e0f2fe; --bg:#f2f8fb; }
html[data-theme="teal"]   { --brand:#0f766e; --brand-soft:#d5f5ef; --bg:#f2f8f7; }
html[data-theme="green"]  { --brand:#15803d; --brand-soft:#dcfce7; --bg:#f3f8f4; }
html[data-theme="purple"] { --brand:#7c3aed; --brand-soft:#f1e8ff; --bg:#f7f5fb; }
html[data-theme="rose"]   { --brand:#be123c; --brand-soft:#ffe4e9; --bg:#fbf5f6; }
html[data-theme="orange"] { --brand:#c2410c; --brand-soft:#ffedd5; --bg:#fbf7f3; }
html[data-theme="slate"]  { --brand:#334155; --brand-soft:#e2e8f0; --bg:#f4f5f7; }
html[data-theme] .chip.on { border-color: var(--brand); color: var(--brand); }
html[data-theme] .topbar  { border-bottom: 3px solid var(--brand); }
html[data-size="large"] body  { font-size: 17px; }
html[data-size="xlarge"] body { font-size: 19px; }
html[data-size="small"] body  { font-size: 14px; }
.theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.theme-opt { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 2px solid var(--line); border-radius: 10px; cursor: pointer; background: #fff; }
.theme-opt.on { border-color: var(--ink); }
.theme-opt input { position: absolute; opacity: 0; pointer-events: none; }
.theme-opt .sw { display: flex; height: 28px; border-radius: 6px; overflow: hidden; border: 1px solid var(--line); }
.theme-opt .sw i { flex: 1; }
.set-btn { font-size: 15px; }

/* =====================================================================================
   PlanMyPrep design system (Nov 2026)
   Ink blue = the only action colour · highlighter yellow = today / now only ·
   a task is ticked by filling its bubble, like an OMR sheet · Lexend type · 44 px tap targets
   ===================================================================================== */
:root{
  --bg:#F4F7FC; --card:#FFFFFF; --ink:#18203A; --muted:#5B6684; --line:#DCE3F0; --soft:#EEF2F9;
  --brand:#23308C; --brand-hover:#1A246B; --brand-soft:#EAEDF8; --ring:#D6DCF5;
  --hl:#FFE74C; --hl-soft:#FFF6B8; --hl-line:#E8D23A;
  --physics:#2F6FED; --chemistry:#E07B16; --botany:#1E9E5A; --zoology:#D6457A;
  --good:#18875A; --mid:#B7791F; --bad:#C53030; --info:#2F6FED;
  --r:16px; --shadow:none;
}
html[data-theme="indigo"]{ --brand:#4f46e5; --brand-soft:#eef2ff; --bg:#f5f6f8; }
html[data-theme] { --brand-hover: var(--brand); }
body{font:16px/1.55 Lexend,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.01em}
h1{font-size:1.85rem;letter-spacing:-.02em} h2{font-size:1.2rem} h3{font-size:1.05rem}
b,strong{font-weight:600}
a{color:var(--brand)}
a:hover{text-decoration:none;color:var(--brand-hover)}
:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:8px}
.wrap{max-width:1240px;padding:28px 20px 70px}
.card{border-radius:var(--r);padding:20px 22px;box-shadow:none}
.muted{color:var(--muted)}

/* ---- top bar */
.topbar{border-bottom:1px solid var(--line)}
.topbar .in{max-width:1240px;height:68px;gap:28px;padding:0 20px}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--brand);font-size:1.2rem;font-weight:600;letter-spacing:-.01em}
.logo:hover{color:var(--brand)}
.logo-mark{color:var(--brand);flex:none}
.nav{gap:4px}
.nav a{padding:10px 16px;border-radius:10px;font-weight:500;font-size:.95rem;color:var(--muted)}
.nav a:hover{background:var(--soft);color:var(--ink)}
.nav a.on{background:var(--brand-soft);color:var(--brand);font-weight:600}
.top-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.course-chip{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border:1.5px solid var(--line);border-radius:10px;color:var(--ink);font-size:.88rem;white-space:nowrap}
.course-chip:hover{border-color:var(--brand);color:var(--brand)}
.add-btn{height:44px}
.me-menu{position:relative}
.me-menu>summary{list-style:none;cursor:pointer}
.me-menu>summary::-webkit-details-marker{display:none}
.avatar{width:40px;height:40px;border-radius:50%;background:var(--hl);color:var(--brand);display:grid;place-items:center;font-weight:600}
.me-pop{position:absolute;right:0;top:calc(100% + 8px);z-index:45;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 32px rgba(24,32,58,.14);min-width:230px;padding:8px;display:flex;flex-direction:column}
.me-pop a{padding:11px 12px;border-radius:9px;color:var(--ink);font-size:.95rem}
.me-pop a:hover{background:var(--soft)}
.me-pop .me-name{padding:8px 12px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;display:flex;flex-direction:column}
.me-pop .me-out{color:var(--bad)}

/* ---- buttons, fields, chips */
.btn{min-height:44px;padding:0 18px;border:1.5px solid var(--brand);background:#fff;color:var(--brand);border-radius:12px;font-weight:500;gap:8px;justify-content:center}
.btn:hover{background:var(--brand-soft)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-hover);filter:none}
.btn.good{background:var(--good);border-color:var(--good);color:#fff}
.btn.danger{color:var(--bad);border-color:#E7B4B4;background:#fff}
.btn.danger:hover{background:#FBE9E9}
.btn.sm{min-height:36px;padding:0 12px;font-size:.88rem;border-radius:10px}
.btn.lg{min-height:52px;padding:0 24px;font-size:1.02rem;border-radius:14px}
.icon-btn{width:40px;height:40px;border-radius:50%;border:0;background:var(--soft);color:var(--ink);display:grid;place-items:center;cursor:pointer}
input[type=text],input[type=search],input[type=tel],input[type=email],input[type=password],input[type=number],input[type=date],input[type=time],select,textarea{
  min-height:46px;padding:10px 14px;border:1.5px solid var(--line);border-radius:12px;font-size:1rem}
textarea{min-height:100px}
input:focus,select:focus,textarea:focus{outline:3px solid var(--ring);border-color:var(--brand)}
label{font-weight:500}
.chip{border:1.5px solid var(--line);padding:6px 12px;font-size:.85rem;color:var(--ink)}
.chip.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:500}
.pick-o span{border-radius:12px;font-weight:600;min-height:52px;justify-content:center}
.pick-o input:checked+span{border-color:var(--brand);background:var(--brand);color:#fff}
.pick-o input:checked+span small{color:#E3E7FA}
.seg button.on{background:var(--brand)}
.tabs .on{border-bottom-color:var(--brand)}
.subtabs{top:68px}
.subtabs a{font-weight:500}
.subtabs a.on{font-weight:600}
.flash{border-radius:12px}
.flash.ok{background:#E3F3EC;border-color:#B6DEC9;color:#146B3D}
.flash.error{background:#FBE9E9;border-color:#F0C9C9;color:#B42828}
.pill{font-weight:500;padding:3px 10px}
.pill.physics{background:#EAF1FE;color:#1B4FB8}.pill.chemistry{background:#FDF0E3;color:#9A4F06}
.pill.botany{background:#E5F5EC;color:#146B3D}.pill.zoology{background:#FBE8EF;color:#A02A55}
.pill.strong{background:#E3F3EC;color:#146B3D}.pill.average{background:#FBF3E3;color:#8A5A0E}.pill.weak{background:#FBE9E9;color:#B42828}
table.t th{text-transform:none;letter-spacing:0;font-size:.82rem;font-weight:500}
.bar>i,.share i{background:var(--brand)}

/* ---- dialogs and the + Add sheet */
dialog.dlg{border-radius:20px;padding:24px}
dialog.dlg h3{font-weight:600}
dialog.sheet{max-width:min(620px,calc(100vw - 24px))}
.sheet-grip{display:none}
.add-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.add-tile{display:flex;flex-direction:column;gap:6px;padding:16px;border:1.5px solid var(--line);border-radius:16px;color:var(--ink);min-height:128px}
.add-tile:hover{border-color:var(--brand);background:#F6F7FD;color:var(--ink)}
.add-tile .ai{width:42px;height:42px;border-radius:12px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;margin-bottom:4px}
.add-tile:hover .ai{background:var(--brand);color:#fff}
.add-tile .ai svg{width:22px;height:22px}
.add-tile b{font-size:1rem}
.add-tile small{font-size:.82rem;color:var(--muted);line-height:1.35}
.add-fab{display:none}

/* ---- tasks: the OMR bubble */
.task{gap:14px;align-items:center;padding:14px 12px;margin:0 -12px;border-bottom:1px solid var(--line);border-radius:12px}
.task:last-child{border-bottom:0}
.task .title{font-size:1.02rem;font-weight:500}
.task .k{display:inline-block;font-size:.75rem;font-weight:500;text-transform:none;padding:1px 8px;border-radius:6px;margin:0 6px 3px 0;background:var(--soft);color:var(--muted)}
.task .k.learn,.task .k.study{background:#E3E7FA;color:var(--brand)}
.task .k.revise,.task .k.deep{background:#FBF3E3;color:#8A5A0E}
.task .k.test,.task .k.mock,.task .k.weekly,.task .k.diagnostic,.task .k.event{background:#EEF2F9;color:#3B4668;border:1px dashed #9AA6C3}
.bubble{width:32px;height:32px;border-radius:50%;border:2.5px solid var(--brand);background:#fff;color:#fff;cursor:pointer;flex:none;display:grid;place-items:center;padding:0;transition:background .12s}
.bubble:hover{background:var(--brand-soft)}
.bubble.test{border-style:dashed}
.bubble.miss{border-style:dashed;border-color:var(--bad)}
.bubble.on{background:var(--brand)}
.bubble.on svg{width:18px;height:18px}
.bubble:active{transform:scale(.92)}
.task.done{background:transparent}
.task.done .title{color:var(--muted);text-decoration:line-through;text-decoration-color:#9AA6C3}
.task.missed .title{color:var(--ink)}
.task.now{background:var(--hl-soft);border-bottom-color:transparent;box-shadow:inset 0 0 0 1.5px var(--hl-line)}
.now-tag{display:inline-block;font-size:.72rem;font-weight:600;padding:1px 8px;border-radius:99px;background:var(--hl);color:var(--brand);margin-bottom:3px}
.test-tag{display:inline-block;font-size:.78rem;font-weight:500;padding:2px 8px;border-radius:8px;border:1.5px solid var(--brand);color:var(--brand);margin:3px 6px 2px 0;background:#fff}

/* ---- home */
.today-h{margin:2px 0 4px;font-size:2.1rem}
.hl{background:linear-gradient(transparent 56%, var(--hl) 56%);padding:0 4px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.status-chip{font-weight:500;border-width:1.5px}
.status-chip:not(.green):not(.yellow):not(.red){background:#fff;border-color:var(--line);color:var(--ink)}
.next-up{background:var(--hl-soft);color:var(--ink);border:1.5px solid var(--hl-line)}
.next-up h2{color:var(--ink)}
.next-up .muted,.next-up .small.muted{color:#4A4A2A}
.next-up .eyebrow{color:#5B5418;text-transform:none;letter-spacing:0;font-weight:500;font-size:.85rem}
.next-up .btn{background:#fff;border-color:var(--brand);color:var(--brand)}
.next-up .btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.next-up.done{background:#E3F3EC;border-color:#B6DEC9}
.big-card.study,.big-card.test,.big-card.plan{background:var(--brand)}
/* exam countdown = admit-card ticket */
.cd{padding:0;overflow:hidden;gap:0;align-items:stretch}
.cd-num{border-radius:0;min-width:96px;background:var(--brand);color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;border-right:2px dashed #C9D2E6}
.cd-num b{font-size:2.2rem;font-weight:700}
.cd-num span{text-transform:none;letter-spacing:0;font-weight:400;font-size:.78rem}
.cd-soon .cd-num{background:var(--bad);color:#fff}
.cd-info{padding:14px 18px}
.cd-title{font-weight:600;font-size:1.1rem}
.cd .eyebrow{text-transform:none;letter-spacing:0;font-weight:500;font-size:.8rem}
.quick-stats a{border-radius:var(--r);box-shadow:none}
.quick-stats b{font-weight:700}
.hub{border-radius:var(--r);box-shadow:none}
.hub-tile{border-radius:12px;min-height:44px}
.hub-tile:hover{border-color:var(--brand);background:var(--brand-soft)}
.tips{border-left:4px solid var(--hl)}
.help-btn:hover,.help-btn.on{border-color:var(--brand);color:var(--brand)}

/* ---- planner calendar */
.day{border-radius:12px}
.day.today{border:2px solid var(--brand);background:var(--hl-soft)}
.day .it{border-radius:8px}
.day .it.learn,.day .it.study{border-left-color:var(--brand)}
.day .it.revise,.day .it.deep{border-left-color:#B7791F}
.day .it.mine::before{color:var(--brand)}
.today-banner{background:var(--hl-soft);border-color:var(--hl-line)}
.tb-badge.learn,.today-tag.learn{background:var(--brand)}
.today-card.learn{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
.kd-neet{border-top-color:var(--brand)}
.ex-neet{border-color:var(--brand)}

/* ---- exam mode keeps its own dark bar, in ink */
.exam-top{background:#1A246B}
.sec-tabs button.on{background:var(--brand);border-color:var(--brand)}

/* ---- section tabs used by Practice and Progress */
.sect-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}
.sect-tabs a{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:99px;border:1.5px solid var(--line);background:#fff;color:var(--ink);font-size:.92rem}
.sect-tabs a:hover{border-color:var(--brand);color:var(--brand)}
.sect-tabs a.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* ---- phone */
@media (max-width:760px){
  .topbar .in{height:60px;gap:10px;padding:0 14px}
  .logo-word{display:none}
  .add-btn{display:none}
  .course-chip{height:36px;font-size:.8rem;padding:0 10px}
  .avatar{width:36px;height:36px}
  .bottomnav{padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .bottomnav a{font-size:.72rem;font-weight:500;gap:3px;padding:6px 0}
  .bottomnav a svg{width:22px;height:22px}
  .bottomnav a.on{background:transparent;color:var(--brand);font-weight:600}
  .bottomnav a.on svg circle:first-child{fill:var(--brand-soft)}
  .add-fab{display:inline-flex;align-items:center;gap:8px;position:fixed;right:16px;bottom:86px;z-index:35;height:54px;padding:0 22px;border:0;border-radius:16px;
    background:var(--brand);color:#fff;font:600 16px Lexend,system-ui,sans-serif;box-shadow:0 6px 18px rgba(35,48,140,.3);cursor:pointer}
  dialog.sheet{margin:auto 0 0;max-width:100vw;width:100vw;border-radius:24px 24px 0 0;padding:12px 16px calc(24px + env(safe-area-inset-bottom))}
  .sheet-grip{display:block;width:44px;height:5px;border-radius:99px;background:var(--line);margin:0 auto 12px}
  .add-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .add-tile{min-height:112px;padding:14px}
  .wrap{padding:18px 14px 150px}
  h1{font-size:1.5rem}
  .today-h{font-size:1.65rem}
  .subtabs{top:60px}
  .task{margin:0 -8px;padding:12px 8px}
}
@media print{
  .add-fab,.bottomnav,.me-menu,.course-chip,.add-btn{display:none!important}
  .task.now{background:#fff;box-shadow:none}
  .hl{background:none}
  .bubble{border-color:#000}
}
.review-card{border-left:4px solid var(--brand);background:#fff}
.upnext-link{display:flex;align-items:center;gap:10px;padding:12px 14px;margin:0 0 8px;border:1.5px solid var(--line);border-radius:12px;color:var(--ink)}
.upnext-link span{color:var(--muted);font-size:.9rem}
.upnext-link em{margin-left:auto;font-style:normal;color:var(--brand);font-weight:500;font-size:.9rem}
.upnext-link:hover{border-color:var(--brand);color:var(--ink)}
.page-head{align-items:flex-end}
/* hidden must win over display:grid / flex set by classes (fixes Study subject tabs and class filter) */
[hidden]{display:none!important}
.subj-head{display:flex;align-items:center;gap:8px;margin:18px 0 4px}
.chapter-list.subj+.chapter-list.subj .subj-head{margin-top:26px}

/* ---- timetable (study times drawn like meetings in a calendar) ---- */
.tl{--gut:58px;font-size:.85rem}
.tl-head{display:grid;grid-template-columns:var(--gut) repeat(7,minmax(0,1fr));gap:6px;margin-bottom:6px}
.tl-head span{text-align:center;font-weight:500;color:var(--muted);padding:6px 0;border-radius:10px}
.tl-head span.today{background:var(--hl);color:var(--brand);font-weight:600}
.tl-body{position:relative;display:grid;grid-template-columns:var(--gut) repeat(var(--ncol,1),minmax(0,1fr));gap:6px}
.tl-week .tl-body{--ncol:7}
.tl-hours{position:relative}
.tl-hours span{position:absolute;right:8px;transform:translateY(-50%);font-size:.75rem;color:var(--muted);white-space:nowrap}
.tl-hours span:first-child{transform:none}
.tl-col{position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;min-width:0}
.tl-col.today{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.tl-col.off{background:repeating-linear-gradient(45deg,#fff,#fff 8px,#F1F4FA 8px,#F1F4FA 16px)}
.tl-offtag{position:absolute;top:8px;left:8px;font-size:.78rem;color:var(--muted)}
.tl-line{position:absolute;left:0;right:0;border-top:1px dashed #E6EBF4}
.tl-slot{position:absolute;left:0;right:0;background:#F3F6FD;border-top:2px solid #C9D2E6}
.tl-ev{position:absolute;left:5px;right:5px;display:flex;gap:8px;align-items:flex-start;padding:6px 8px;border-radius:10px;
  background:#EEF1FB;border-left:4px solid var(--brand);overflow:hidden;line-height:1.3;box-shadow:0 1px 0 rgba(24,32,58,.06)}
.tl-ev.sub-physics{background:#EAF1FE;border-left-color:#2F6FED}.tl-ev.sub-chemistry{background:#FDF0E3;border-left-color:#E07B16}
.tl-ev.sub-botany{background:#E5F5EC;border-left-color:#1E9E5A}.tl-ev.sub-zoology{background:#FBE8EF;border-left-color:#D6457A}
.tl-ev.k-test,.tl-ev.k-diagnostic,.tl-ev.k-weekly,.tl-ev.k-mock,.tl-ev.k-event{background:#fff;border:1.5px dashed #9AA6C3;border-left:4px solid var(--brand)}
.tl-ev.done{opacity:.55}
.tl-ev.done .tl-title{text-decoration:line-through}
.tl-ev.over{border-left-color:var(--bad);background:#FBE9E9}
.tl-txt{min-width:0;flex:1}
.tl-time{font-size:.74rem;color:var(--muted)}
.tl-title{font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-sub{font-size:.76rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-ev.short{padding:2px 8px;align-items:center}
.tl-ev.short .tl-time,.tl-ev.short .tl-sub{display:none}
.tl-go{margin-top:4px;min-height:30px}
.tl-week .tl-ev{left:3px;right:3px;padding:4px 6px;gap:5px}
.tl-week .tl-title{font-size:.78rem;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tl-week .tl-sub{white-space:normal}
.bubble.sm{width:22px;height:22px;border-width:2px}
.bubble.sm svg{width:13px;height:13px}
.tl-now{position:absolute;left:0;right:0;height:2px;background:var(--bad);z-index:3}
.tl-now::before{content:"";position:absolute;left:-1px;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--bad)}
.tl-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
/* study-time editor */
.slot-day{display:grid;grid-template-columns:70px 1fr auto;gap:10px;align-items:start;padding:12px 0;border-bottom:1px solid var(--line)}
.slot-day:last-of-type{border-bottom:0}
.slot-day .dn{font-weight:600;padding-top:10px}
.slot-list{display:flex;flex-wrap:wrap;gap:8px}
.slot-row{display:inline-flex;align-items:center;gap:6px;background:var(--soft);border-radius:12px;padding:4px 6px}
.slot-row input[type=time]{width:auto;min-height:38px;padding:4px 8px;border-radius:9px}
.slot-row .x{border:0;background:none;color:var(--muted);font-size:1.1rem;cursor:pointer;width:30px;height:30px;border-radius:50%}
.slot-row .x:hover{background:#fff;color:var(--bad)}
.slot-tot{padding-top:10px;font-weight:600;color:var(--brand);white-space:nowrap}
@media (max-width:760px){
  .tl-week{overflow-x:auto}
  .tl-week .tl-head,.tl-week .tl-body{min-width:760px}
  .slot-day{grid-template-columns:1fr auto}
  .slot-day .slot-list{grid-column:1 / -1}
}
@media print{ .tl-now{display:none} .tl-ev{background:#fff!important;border:1.2px solid #000!important} .tl-slot{background:#fff;border-top:1px solid #000} }
.tl-tshort{display:none;color:var(--muted);font-weight:400}
.tl-ev.short .tl-tshort{display:inline}
.tl-ev.short .tl-go{display:none}
.tl-ev.short .tl-title{white-space:nowrap!important;display:block!important}
.tl-ev.short .bubble.sm{width:18px;height:18px}

/* ---- profile v2 (2 Nov 2026): one field per row, section menu, subject marks tables */
.req{color:var(--bad);font-weight:600}
.pf-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;align-items:start}
.pf-nav{position:sticky;top:84px;display:flex;flex-direction:column;gap:2px}
.pf-nav a{padding:8px 12px;border-radius:10px;color:var(--muted);font-size:.9rem;border-left:3px solid transparent}
.pf-nav a:hover{background:var(--soft);color:var(--ink);text-decoration:none}
.pf-nav a.on{color:var(--brand);background:var(--brand-soft);border-left-color:var(--brand);font-weight:600}
.pf-main{max-width:860px;min-width:0}
.pf-sec{scroll-margin-top:84px}
.pf-sec h2{margin-bottom:14px}
.pf-note{margin:-6px 0 12px}
.pf-sub{font-size:.95rem;color:var(--muted);margin:14px 0 4px;font-weight:600}
.frow{display:grid;grid-template-columns:230px minmax(0,1fr);gap:6px 20px;padding:12px 0;border-top:1px solid var(--line);align-items:start}
.pf-sec>.frow:first-of-type,.pf-sec h2+.frow,.pf-sec .pf-note+.frow,.pf-sec .pf-sub+.frow{border-top:0}
.frow .fl label{margin:12px 0 0;font-weight:600}
.frow .fl .tiny{margin-top:2px}
.frow .fc{max-width:480px}
.frow .fc .pick{margin:0}
.frow-inline{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.frow-inline label{margin:0}
.pf-more{margin:8px 0;border-top:1px solid var(--line);padding-top:10px}
.pf-more>summary{cursor:pointer;font-weight:600;color:var(--brand);padding:6px 0}
.consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;padding:10px 12px;border-radius:12px;margin:0 0 6px;cursor:pointer}
.consent input{margin-top:4px;width:18px;height:18px;flex:none}
.consent.need{background:var(--hl-soft,#FFF6B8)}
.savebar{position:sticky;bottom:0;z-index:5;background:linear-gradient(transparent,var(--bg) 30%);padding:18px 0 14px;display:flex;gap:10px}
.meter-box{min-width:220px}
.meter{height:8px;border-radius:99px;background:var(--line);overflow:hidden;margin:4px 0}
.meter i{display:block;height:100%;background:var(--brand);border-radius:99px}
.photo-tip{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--brand-soft);border-radius:12px;padding:10px 14px;margin:0 0 6px;font-size:.9rem}
.mtable .fc,.frow .fc .mtable{max-width:none}
.frow .fc:has(.mtable){max-width:560px}
.mt-head,.mt-row{display:grid;grid-template-columns:minmax(0,1fr) 84px 84px 70px 40px;gap:8px;align-items:center}
.mt-head{padding:0 2px 4px}
.mt-row{margin-bottom:8px}
.mt-row input{min-height:42px;padding:8px 10px}
.mt-row .icon-btn{width:36px;height:36px;font-size:.85rem;color:var(--muted)}
.sheet{border-top:1px solid var(--line);padding:14px 0}
.subj-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.schip{display:inline-flex;gap:8px;align-items:baseline;border:1px solid var(--line);border-radius:10px;padding:5px 10px;font-size:.85rem}
.schip span{color:var(--muted)}
.schip i{font-style:normal;font-weight:400;color:var(--muted);font-size:.8rem}
@media (max-width:900px){.pf-layout{grid-template-columns:1fr}.pf-nav{position:static;flex-direction:row;overflow-x:auto;gap:4px;scrollbar-width:none}
  .pf-nav a{white-space:nowrap;border-left:0;border-bottom:3px solid transparent}.pf-nav a.on{border-bottom-color:var(--brand)}}
@media (max-width:640px){.frow{grid-template-columns:1fr;gap:4px}.frow .fl label{margin-top:0}.frow .fc{max-width:none}
  .mt-head,.mt-row{grid-template-columns:minmax(0,1fr) 64px 64px 36px}.mt-head span:nth-child(4),.mt-row input[name$=s_grade]{display:none}}

/* ---- Admin -> Usage (2 Nov 2026) */
.ugrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:12px}
.ustat{padding:16px 18px}.ustat-v{font-size:1.8rem;font-weight:600;line-height:1.2;margin:4px 0 2px;color:var(--ink)}
.uchart{width:100%;height:auto;display:block;overflow:visible}
.uchart .ug{stroke:var(--line);stroke-width:1}.uchart .ut{fill:var(--muted);font-size:11px}
.uchart .uline{fill:none;stroke:var(--brand);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.uchart .udot{fill:var(--brand)}.uchart .unew{fill:var(--hl-line,#E8D23A)}
.lg-line,.lg-bar{display:inline-block;width:14px;height:3px;background:var(--brand);vertical-align:middle;margin:0 4px 0 10px;border-radius:2px}
.lg-bar{width:6px;height:10px;background:var(--hl-line,#E8D23A)}
.ubar{margin:8px 0}
.ubar .meter{margin-top:4px}
.uheat{display:inline-block;min-width:46px;text-align:center;padding:3px 6px;border-radius:8px;font-size:.85rem;
  background:color-mix(in srgb,var(--brand) calc(var(--a) * 85%),#fff);color:var(--ink)}
.ucoh td{padding-top:6px;padding-bottom:6px}
.uhours{display:grid;grid-template-columns:repeat(24,1fr);gap:2px;height:110px;align-items:end;margin:6px 0}
.uhours div{height:100%;display:flex;align-items:end}.uhours i{display:block;width:100%;background:var(--brand);border-radius:3px 3px 0 0;opacity:.85}
.uheat.hi{color:#fff}
.ustrip{display:grid;grid-template-columns:repeat(35,1fr);gap:3px;margin:8px 0}
.ustrip i{display:block;aspect-ratio:1;border-radius:3px;background:var(--line)}
.ustrip i.b{background:color-mix(in srgb,var(--brand) 35%,#fff)}
.ustrip i.on{background:var(--brand)}
@media (max-width:760px){.savebar{bottom:70px;padding-bottom:10px}}

/* ---- compact sizes on laptops / desktops (2 Nov 2026): about 10% smaller than the base design.
   Phones keep 44 px tap targets. Settings -> Look -> Large / Extra large still enlarge everything. */
@media (min-width:641px){
  body{font-size:15px}
  h1{font-size:1.65rem} h2{font-size:1.12rem}
  .topbar .in{height:60px;gap:22px}
  .nav a{padding:8px 13px;font-size:.93rem}
  input[type=text],input[type=search],input[type=tel],input[type=email],input[type=password],input[type=number],input[type=date],input[type=time],select,textarea{
    min-height:40px;padding:7px 12px;border-radius:10px;font-size:.95rem}
  textarea{min-height:84px}
  .btn{min-height:40px;padding:0 16px;border-radius:10px}
  .btn.lg{min-height:46px;padding:0 20px;font-size:.98rem;border-radius:12px}
  .icon-btn{width:34px;height:34px}
  .frow{padding:9px 0}
  .frow .fl label{margin-top:9px}
}

.pf-sec[hidden],.pf-nav a[hidden]{display:none !important}
.meter-box{min-width:220px;max-width:300px}
.meter-box .tiny{white-space:normal}

/* ---- shared page layout (profile style) for every form / settings page - 2 Nov 2026 */
.pf-head{margin-bottom:14px}
.pf-nav a .ico{display:inline-block;width:1.3em}
.pf-nav a .count{font-style:normal;background:var(--brand);color:#fff;border-radius:99px;padding:0 7px;font-size:.72rem;margin-left:4px}
.pf-sec .pf-note{margin:-6px 0 6px}
/* older ".field" blocks (shared partials) inside a profile-style card line up as label-left rows */
.pf-sec .grid.g3,.pf-sec .grid.g2:has(> .field){display:block}
.pf-sec .field{display:grid;grid-template-columns:230px minmax(0,1fr);gap:4px 20px;padding:9px 0;margin:0;border-top:1px solid var(--line);align-items:start}
.pf-sec h2+.field,.pf-sec h2+.grid>.field:first-child,.pf-sec .pf-note+.field{border-top:0}
.pf-sec .field>label:first-child{grid-column:1;margin:9px 0 0}
.pf-sec .field>:not(label:first-child){grid-column:2;max-width:480px}
.pf-sec .danger-zone{border-left:4px solid var(--bad)}
@media (max-width:640px){.pf-sec .field{grid-template-columns:1fr}.pf-sec .field>*{grid-column:1 !important}.pf-sec .field>label:first-child{margin-top:0}}

/* ---- badges (2 Nov 2026) */
.bg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.bg-card{border:1px solid var(--line);border-radius:16px;padding:16px 12px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;background:#fff}
.bg-card.off{border-style:dashed;background:var(--bg)}
.bg-name{font-weight:600;margin-top:6px}
.bg-x{font-size:.8rem;background:var(--hl);border-radius:99px;padding:1px 8px;margin-left:2px}
.bg-prog{width:100%;height:7px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:8px}
.bg-prog i{display:block;height:100%;background:var(--brand)}
dialog.badge-pop{max-width:440px;width:calc(100% - 32px);border:0;border-radius:22px;padding:30px 26px 18px;text-align:center;overflow:hidden}
dialog.badge-pop::backdrop{background:rgba(24,32,58,.55)}
.bp-eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bp-medal{margin:10px 0 4px;animation:bpIn .6s cubic-bezier(.2,1.4,.4,1)}
@keyframes bpIn{from{transform:scale(.4) rotate(-20deg);opacity:0}to{transform:none;opacity:1}}
.badge-pop h2{margin:4px 0 6px;font-size:1.6rem}
.bp-x{font-size:1rem;background:var(--hl);border-radius:99px;padding:2px 10px;vertical-align:middle}
.bp-text{margin:0 0 4px;font-weight:600}
.bp-rule{margin:0 0 16px;color:var(--muted);font-size:.9rem}
.bp-actions{display:flex;gap:10px;flex-wrap:wrap}
.bp-actions .btn{flex:1 1 160px}
.bp-share{border-color:#1E9E5A;color:#157A45}
.bp-close{border:0;background:none;font:inherit;color:var(--muted);margin-top:8px;padding:10px;min-height:44px;cursor:pointer}
.bp-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.bp-confetti i{position:absolute;top:-12px;width:8px;height:12px;border-radius:2px;animation:bpFall 2.4s ease-in forwards;opacity:.9}
@keyframes bpFall{to{transform:translateY(520px) rotate(540deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.bp-medal,.bp-confetti i{animation:none}.bp-confetti{display:none}}