/* TrueHeading design system: soft, round and bold. Fredoka for headings, Nunito for text. */
@font-face{font-family:"Fredoka";font-weight:500;font-style:normal;font-display:swap;src:url(fredoka-500.woff2) format("woff2")}
@font-face{font-family:"Fredoka";font-weight:600;font-style:normal;font-display:swap;src:url(fredoka-600.woff2) format("woff2")}
@font-face{font-family:"Fredoka";font-weight:700;font-style:normal;font-display:swap;src:url(fredoka-700.woff2) format("woff2")}
@font-face{font-family:"Nunito";font-weight:600;font-style:normal;font-display:swap;src:url(nunito-600.woff2) format("woff2")}
@font-face{font-family:"Nunito";font-weight:700;font-style:normal;font-display:swap;src:url(nunito-700.woff2) format("woff2")}
@font-face{font-family:"Nunito";font-weight:800;font-style:normal;font-display:swap;src:url(nunito-800.woff2) format("woff2")}
@font-face{font-family:"Nunito";font-weight:900;font-style:normal;font-display:swap;src:url(nunito-900.woff2) format("woff2")}
@font-face{font-family:"THRupee";font-weight:100 800;font-style:normal;font-display:swap;src:url(rupee-700.woff2) format("woff2");unicode-range:U+20B9}
@font-face{font-family:"THRupee";font-weight:900;font-style:normal;font-display:swap;src:url(rupee-900.woff2) format("woff2");unicode-range:U+20B9}

:root{
  --bg:#f4f6fb;--bg2:#e9eef9;--panel:#ffffff;--ink:#1e2a47;--mute:#667290;--line:#e1e7f3;--map:#e8eefa;
  --acc:#4f7cf7;--acc2:#3a63d8;--acc-ink:#ffffff;--accs:rgba(79,124,247,.12);
  --ok:#25a578;--bad:#df5570;--warn:#e29a35;--card:#243257;--cardink:#eaf0ff;
  --gold:#ffb43d;--gold2:#f59b17;--gold-ink:#3a2600;
  --c-nav:#4f7cf7;--c-met:#1db3bb;--c-reg:#8d6af0;--c-tec:#f08a3c;--c-rt:#ee6a9a;
  --sh1:0 1px 2px rgba(30,42,71,.05),0 10px 26px -14px rgba(30,42,71,.2);
  --sh2:0 2px 4px rgba(30,42,71,.06),0 22px 44px -18px rgba(30,42,71,.3);
  --glow1:rgba(79,124,247,.16);--glow2:rgba(255,180,61,.14);
  --r:24px;--r2:18px;--r3:12px;
  --f-body:"Nunito","THRupee","Varela Round",ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold","Hiragino Maru Gothic ProN",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-disp:"Fredoka","THRupee","Nunito","Varela Round",ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold",system-ui,sans-serif;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#0f1529;--bg2:#141c36;--panel:#192242;--ink:#e6ebf8;--mute:#95a1c2;--line:#2a3560;--map:#101830;
  --acc:#8ca8ff;--acc2:#a9bfff;--acc-ink:#0e1530;--accs:rgba(140,168,255,.16);
  --ok:#5bd3a5;--bad:#ff8399;--warn:#f5c068;--card:#0b1126;--cardink:#e8ecf8;
  --gold:#ffc35c;--gold2:#f8a826;--gold-ink:#3a2600;
  --c-nav:#8ca8ff;--c-met:#5fd2d8;--c-reg:#b49cf6;--c-tec:#f5ab72;--c-rt:#f592b8;
  --sh1:0 1px 2px rgba(0,0,0,.28),0 10px 26px -14px rgba(0,0,0,.6);
  --sh2:0 2px 4px rgba(0,0,0,.32),0 22px 44px -18px rgba(0,0,0,.75);
  --glow1:rgba(140,168,255,.12);--glow2:rgba(255,195,92,.06);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font:600 16.5px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden;
  background-image:radial-gradient(900px 480px at 8% -6%,var(--glow1),transparent 70%),radial-gradient(760px 420px at 100% 0,var(--glow2),transparent 70%);background-repeat:no-repeat}
img,svg,canvas{max-width:100%}
a{color:var(--acc);text-decoration:none;font-weight:800}
a:hover{text-decoration:underline;text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--f-disp);font-weight:600;line-height:1.18;margin:0 0 .5em;letter-spacing:.005em}
h1{font-size:clamp(32px,5.2vw,56px);font-weight:700}
h2{font-size:clamp(25px,3.4vw,38px)}
h3{font-size:clamp(19px,2.2vw,23px)}
p{margin:0 0 1em}
b,strong{font-weight:800}
small{font-size:.86em}
ul,ol{padding-left:1.2em;margin:0 0 1em}
li{margin:.25em 0}
hr{border:0;border-top:2px dashed var(--line);margin:28px 0}
code,kbd{font:800 .88em ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--bg2);padding:.12em .45em;border-radius:8px}
kbd{border:1.5px solid var(--line);border-bottom-width:3px}
.mute{color:var(--mute)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.sec{padding:54px 0}
.sec.tight{padding:30px 0}
.ctr{text-align:center}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px;border-radius:10px}
::selection{background:var(--accs)}
.hide{display:none!important}
[hidden]{display:none!important}

/* ---------- buttons ---------- */
button,.btn{font:800 15.5px/1.2 var(--f-disp);letter-spacing:.01em;color:var(--ink);background:var(--panel);border:2px solid var(--line);border-radius:999px;padding:11px 20px;cursor:pointer;transition:transform .12s,border-color .15s,background .15s,box-shadow .15s;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none!important;white-space:nowrap;font-weight:600}
button:hover,.btn:hover{border-color:var(--acc)}
button:active,.btn:active{transform:translateY(1px)}
button:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:default;pointer-events:none}
.btn{background:var(--acc);color:var(--acc-ink);border-color:var(--acc);box-shadow:0 4px 0 var(--acc2),0 12px 22px -10px var(--glow1)}
.btn:hover{background:var(--acc);filter:brightness(1.05);border-color:var(--acc)}
.btn:active{box-shadow:0 1px 0 var(--acc2);transform:translateY(3px)}
.btn.soft{background:var(--accs);color:var(--acc);border-color:transparent;box-shadow:none}
:root[data-theme=dark] .btn.soft{color:var(--ink)}
.btn.soft:hover{border-color:var(--acc)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line);box-shadow:none}
.btn.ghost:hover{border-color:var(--acc);color:var(--acc)}
.btn.gold{background:var(--gold);color:var(--gold-ink);border-color:var(--gold);box-shadow:0 4px 0 var(--gold2),0 14px 26px -12px rgba(245,155,23,.6)}
.btn.gold:active{box-shadow:0 1px 0 var(--gold2)}
.btn.sm{padding:7px 14px;font-size:14px;box-shadow:none}
.btn.sm:active{transform:none}
.btn.lg{padding:15px 30px;font-size:18px}
.btn.block{display:flex;width:100%}
.btn svg,button svg{flex:none}
.cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.cta.ctr{justify-content:center}

/* ---------- forms ---------- */
label{font-weight:800;font-size:14.5px}
select,input[type=text],input[type=search],input[type=number],input[type=email],input[type=password],input[type=tel],textarea{font:700 16px var(--f-body);color:var(--ink);background:var(--panel);border:2px solid var(--line);border-radius:16px;padding:11px 15px;width:100%;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;min-height:90px}
select:focus,input:focus,textarea:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 4px var(--accs)}
input[type=range]{flex:1;accent-color:var(--acc);min-width:0;height:28px}
input[type=checkbox],input[type=radio]{accent-color:var(--acc);width:19px;height:19px;flex:none;margin:0}
::placeholder{color:var(--mute);opacity:.75}
.fld{margin:0 0 16px}
.fld label{display:block;margin:0 0 6px}
.fld small{display:block;color:var(--mute);margin-top:5px;font-weight:700}
.fld .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.msg{padding:12px 16px;border-radius:16px;margin:0 0 16px;font-weight:800;background:color-mix(in srgb,var(--ok) 14%,var(--panel));color:var(--ink);border:2px solid color-mix(in srgb,var(--ok) 45%,transparent)}
.msg.err{background:color-mix(in srgb,var(--bad) 13%,var(--panel));border-color:color-mix(in srgb,var(--bad) 45%,transparent)}
.msg.info{background:var(--accs);border-color:transparent}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}

/* ---------- cards & chips ---------- */
.card,.box{background:var(--panel);border:2px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--sh1)}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;background:var(--accs);color:var(--acc);font:700 14px var(--f-disp);border:0;white-space:nowrap}
:root[data-theme=dark] .chip{color:var(--ink)}
a.chip:hover{text-decoration:none;filter:brightness(.96)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip.nav{--c:var(--c-nav)}.chip.met{--c:var(--c-met)}.chip.reg{--c:var(--c-reg)}.chip.tec{--c:var(--c-tec)}.chip.rt{--c:var(--c-rt)}
.chip.s{background:color-mix(in srgb,var(--c) 16%,var(--panel));color:var(--ink)}
.tag{display:inline-flex;align-items:center;gap:4px;font:700 12px var(--f-disp);letter-spacing:.04em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:var(--accs);color:var(--acc)}
:root[data-theme=dark] .tag{color:var(--ink)}
.tag.free{background:color-mix(in srgb,var(--ok) 18%,var(--panel));color:var(--ok)}
.tag.pro{background:color-mix(in srgb,var(--gold) 28%,var(--panel));color:#9a5d00}
:root[data-theme=dark] .tag.pro{color:var(--gold)}
.pill-lock{display:inline-flex;align-items:center;gap:6px}
.dot{width:10px;height:10px;border-radius:50%;background:var(--c,var(--acc));display:inline-block;flex:none}
.bar{height:12px;border-radius:99px;background:var(--bg2);overflow:hidden}
.bar>i{display:block;height:100%;border-radius:99px;background:var(--c,var(--acc));transition:width .5s}
.sub-nav{--c:var(--c-nav)}.sub-met{--c:var(--c-met)}.sub-reg{--c:var(--c-reg)}.sub-tec{--c:var(--c-tec)}.sub-rt{--c:var(--c-rt)}

/* ---------- header ---------- */
.site-hdr{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom:2px solid var(--line)}
.hdr-in{max-width:1280px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:8px}
.brand{display:flex;align-items:center;gap:10px;font:700 24px var(--f-disp);color:var(--ink)!important;text-decoration:none!important;margin-right:10px;flex:none}
.brand svg{width:40px;height:40px;flex:none}
.brand i{font-style:normal;color:var(--acc)}
nav.nav{display:flex;align-items:center;gap:2px;flex:1;min-width:0}
nav.nav>a,nav.nav .dd>button{font:600 16px var(--f-disp);white-space:nowrap;color:var(--ink);padding:9px 13px;border-radius:999px;border:0;background:transparent;box-shadow:none;display:inline-flex;align-items:center;gap:6px;text-decoration:none!important;cursor:pointer;transition:background .15s}
nav.nav>a:hover,nav.nav .dd>button:hover{background:var(--accs);border:0}
nav.nav>a.on,nav.nav .dd.on>button{background:var(--accs);color:var(--acc)}
:root[data-theme=dark] nav.nav>a.on,:root[data-theme=dark] nav.nav .dd.on>button{color:var(--ink)}
.dd{position:relative}
.dd-menu{display:none;position:absolute;left:0;top:calc(100% + 10px);background:var(--panel);border:2px solid var(--line);border-radius:22px;box-shadow:var(--sh2);padding:12px;min-width:300px;max-height:min(76vh,640px);overflow:auto;z-index:60}
.dd.open .dd-menu{display:block}
.dd-wide .dd-menu{width:min(920px,94vw);left:-120px;columns:3;column-gap:12px;padding:16px}
.dd-g{break-inside:avoid;margin:0 0 14px}
.dd-h{font:700 12.5px var(--f-disp);letter-spacing:.07em;text-transform:uppercase;color:var(--c,var(--mute));padding:4px 10px 6px;display:flex;align-items:center;gap:8px}
.dd-menu a{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:14px;color:var(--ink);font-weight:800;font-size:15px;text-decoration:none!important}
.dd-menu a:hover,.dd-menu a.on{background:var(--accs)}
.dd-menu a .tag{margin-left:auto}
.hdr-r{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
.ic-btn{width:42px;height:42px;padding:0;border-radius:50%;border:2px solid var(--line);background:var(--panel);box-shadow:none;color:var(--ink)}
.ic-btn:hover{border-color:var(--acc);color:var(--acc)}
.th-sun{display:none}.th-moon{display:block}
:root[data-theme=dark] .th-sun{display:block}:root[data-theme=dark] .th-moon{display:none}
.hdr-r .btn{padding:9px 18px;font-size:15px}
.burger{display:none}
.acct{position:relative}
.acct>button{padding:4px 12px 4px 4px;gap:8px;font-size:15px}
.acct .av{width:34px;height:34px;border-radius:50%;background:var(--acc);color:var(--acc-ink);display:grid;place-items:center;font:700 16px var(--f-disp);text-transform:uppercase}
.acct-menu{display:none;position:absolute;right:0;top:calc(100% + 10px);background:var(--panel);border:2px solid var(--line);border-radius:22px;box-shadow:var(--sh2);padding:10px;min-width:230px;z-index:60}
.acct.open .acct-menu{display:block}
.acct-menu a,.acct-menu button{display:flex;width:100%;border:0;background:transparent;box-shadow:none;border-radius:14px;padding:9px 12px;color:var(--ink);font:700 15.5px var(--f-body);justify-content:flex-start;text-decoration:none!important}
.acct-menu a:hover,.acct-menu button:hover{background:var(--accs)}
.acct-menu .who{padding:8px 12px 10px;border-bottom:2px dashed var(--line);margin-bottom:6px}
.acct-menu .who b{display:block;font:600 17px var(--f-disp)}
.in-only{display:none!important}.is-in .in-only{display:inline-flex!important}.is-in .out-only{display:none!important}
.is-pro .free-only{display:none!important}
@media(max-width:1180px){
  .burger{display:inline-flex}
  nav.nav{position:fixed;left:0;right:0;top:62px;background:var(--bg);border-bottom:2px solid var(--line);flex-direction:column;align-items:stretch;padding:12px 16px 18px;gap:4px;display:none;max-height:calc(100vh - 62px);overflow:auto;box-shadow:var(--sh2)}
  nav.nav.open{display:flex}
  nav.nav>a,nav.nav .dd>button{width:100%;justify-content:space-between;font-size:18px}
  .dd-menu,.dd-wide .dd-menu{position:static;width:auto;columns:1;box-shadow:none;border:0;padding:4px 4px 8px;max-height:none;background:transparent}
  .hdr-r .btn.hdr-cta{display:none}
}
@media(max-width:700px){.hide-m{display:none!important}.acct>button{padding:3px;gap:0}.acct>button svg{display:none}}
@media(max-width:520px){.hdr-r{gap:6px}.ic-btn{width:38px;height:38px}.acct .av{width:32px;height:32px}.hdr-in{padding:8px 12px}.brand{font-size:20px}.brand svg{width:34px;height:34px}.hdr-r .login-btn{display:none}}

@media(max-width:380px){.brand{font-size:18px;gap:6px}.brand svg{width:30px;height:30px}.ic-btn{width:34px;height:34px}.hdr-r{gap:4px}.acct .av{width:30px;height:30px}.hdr-in{padding:8px 10px}}
/* ---------- search overlay ---------- */
#ov{position:fixed;inset:0;background:rgba(10,16,38,.55);backdrop-filter:blur(4px);z-index:100;display:none;align-items:flex-start;justify-content:center;padding:9vh 16px 0}
#ov.on{display:flex}
.ov-box{width:min(640px,100%);background:var(--panel);border-radius:26px;border:2px solid var(--line);box-shadow:var(--sh2);overflow:hidden}
.ov-box input{border:0;border-bottom:2px solid var(--line);border-radius:0;padding:18px 22px;font-size:18px;background:transparent}
.ov-box input:focus{box-shadow:none}
.ov-res{max-height:52vh;overflow:auto;padding:8px}
.ov-h{font:700 12px var(--f-disp);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);padding:10px 14px 4px}
.ov-res a{display:flex;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:14px;color:var(--ink);text-decoration:none!important}
.ov-res a small{color:var(--mute);font-weight:700}
.ov-res a.sel,.ov-res a:hover{background:var(--accs)}

/* ---------- footer ---------- */
.ft{margin-top:60px;border-top:2px solid var(--line);background:var(--bg2);padding:44px 0 28px}
.ft-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px}
.ft-b p{color:var(--mute);max-width:36ch;margin-top:12px}
.ft-c b{display:block;font:600 17px var(--f-disp);margin-bottom:10px}
.ft-c a{display:block;color:var(--mute);padding:3px 0;font-weight:700}
.ft-c a:hover{color:var(--acc);text-decoration:none}
.ft-n{grid-column:1/-1;border-top:2px dashed var(--line);padding-top:18px;color:var(--mute);font-size:14px;display:flex;gap:14px;justify-content:space-between;flex-wrap:wrap}
@media(max-width:820px){.ft-in{grid-template-columns:1fr 1fr}.ft-b{grid-column:1/-1}}

/* ---------- hero & landing ---------- */
.hero{padding:44px 0 30px;position:relative}
.hero-g{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center}
.hero h1{margin:14px 0 16px}
.hero h1 em{font-style:normal;color:var(--acc);position:relative;white-space:nowrap}
.hero h1 em::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-.06em;height:.26em;background:var(--gold);opacity:.55;border-radius:99px;z-index:-1}
.hero .lead{font-size:clamp(17px,2vw,20px);color:var(--mute);max-width:56ch}
.price-pill{flex-wrap:wrap;display:inline-flex;align-items:center;gap:12px;background:var(--panel);border:2px solid var(--line);border-radius:999px;padding:8px 20px 8px 10px;margin:6px 0 20px;box-shadow:var(--sh1)}
.price-pill .off{background:var(--ok);color:#fff;font:700 13px var(--f-disp);padding:5px 11px;border-radius:99px}
.price-pill b{font:700 26px var(--f-disp)}
.price-pill s{color:var(--mute);font-weight:800}
.price-pill small{color:var(--mute);font-weight:800}
.hero-art{position:relative;min-height:490px}
.fcard{position:absolute;background:var(--panel);border:2px solid var(--line);border-radius:26px;box-shadow:var(--sh2);padding:18px 20px}
.fq{left:0;top:6px;width:min(420px,90%);z-index:2}
.fq .q{font:600 17px/1.35 var(--f-disp);margin:8px 0 12px}
.fq .o{display:flex;gap:10px;align-items:center;padding:9px 13px;border:2px solid var(--line);border-radius:16px;margin:7px 0;font-weight:800;font-size:15px}
.fq .o b{width:26px;height:26px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;font-size:13px;flex:none}
.fq .o.ok{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 13%,var(--panel))}
.fq .o.ok b{background:var(--ok);color:#fff}
.fq .lk{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.fs{right:0;top:150px;width:min(250px,56%);z-index:3;text-align:center;transform:rotate(3deg)}
.fs svg{width:100%;height:auto;display:block}
.fs small{display:block;color:var(--mute);font-weight:800;margin-top:4px}
.ff{left:24px;bottom:0;width:min(280px,64%);z-index:1;transform:rotate(-3deg);background:var(--gold);border-color:var(--gold);color:var(--gold-ink)}
.ff b{display:block;font:600 19px var(--f-disp);margin:2px 0 4px}
.ff small{font-weight:800;opacity:.8}
.float{animation:fl 6s ease-in-out infinite}
.float.b{animation-delay:-2s}.float.c{animation-delay:-4s}
@keyframes fl{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media(prefers-reduced-motion:reduce){.float{animation:none}*{scroll-behavior:auto!important}}
@media(max-width:900px){.hero-g{grid-template-columns:1fr}.hero-art{min-height:400px;max-width:480px;margin:0 auto;width:100%}}
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:26px}
.stats-strip div{background:var(--panel);border:2px solid var(--line);border-radius:22px;padding:16px 12px;text-align:center;box-shadow:var(--sh1)}
.stats-strip b{display:block;font:700 clamp(26px,3.6vw,38px)/1.1 var(--f-disp);color:var(--acc)}
.stats-strip small{color:var(--mute);font-weight:800}
@media(max-width:640px){.stats-strip{grid-template-columns:1fr 1fr}}
.sec-h{margin-bottom:28px}
.sec-h h2{margin:0 0 8px}
.sec-h p{color:var(--mute);font-size:18px;max-width:60ch;margin:0}
.sec-h.ctr p{margin:0 auto}
.kicker{display:inline-block;font:700 13px var(--f-disp);letter-spacing:.1em;text-transform:uppercase;color:var(--acc);margin-bottom:8px}
:root[data-theme=dark] .kicker{color:var(--gold)}
.loop{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:stretch}
.loop .step{background:var(--panel);border:2px solid var(--line);border-radius:26px;padding:22px;box-shadow:var(--sh1)}
.loop .step .ico{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:color-mix(in srgb,var(--c,var(--acc)) 18%,var(--panel));color:var(--c,var(--acc));margin-bottom:12px}
.loop .arrow{align-self:center;color:var(--mute)}
@media(max-width:860px){.loop{grid-template-columns:1fr}.loop .arrow{transform:rotate(90deg);justify-self:center}}
.subj-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.subj{display:flex;flex-direction:column;gap:6px;background:var(--panel);border:2px solid var(--line);border-radius:26px;padding:20px;color:var(--ink);text-decoration:none!important;box-shadow:var(--sh1);transition:transform .15s,border-color .15s;position:relative;overflow:hidden}
.subj::before{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:var(--c);opacity:.14}
.subj:hover{transform:translateY(-3px);border-color:var(--c)}
.subj .ico{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 20%,var(--panel));color:var(--c)}
.subj h3{margin:8px 0 0;font-size:21px}
.subj p{margin:0;color:var(--mute);font-size:15px;line-height:1.45}
.subj .meta{margin-top:auto;padding-top:10px;display:flex;gap:10px;flex-wrap:wrap;font:700 13.5px var(--f-disp);color:var(--c)}
:root[data-theme=dark] .subj .meta{color:var(--ink)}
.sim-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.simc{background:var(--panel);border:2px solid var(--line);border-radius:26px;overflow:hidden;color:var(--ink);text-decoration:none!important;display:flex;flex-direction:column;box-shadow:var(--sh1);transition:transform .15s,border-color .15s;position:relative}
.simc:hover{transform:translateY(-3px);border-color:var(--c,var(--acc))}
.simc .pv{aspect-ratio:16/10;background:var(--map);position:relative;overflow:hidden;border-bottom:2px solid var(--line)}
.simc .pv img{width:100%;height:100%;object-fit:cover;display:block}
.simc .pv .tag{position:absolute;left:12px;top:12px}
.simc .tx{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;flex:1}
.simc h3{font-size:19px;margin:0}
.simc p{margin:0;color:var(--mute);font-size:14.5px;line-height:1.45}
.simc .lk{margin-top:auto;padding-top:8px;display:flex;gap:6px;flex-wrap:wrap}
.simc .lk span{font:700 12.5px var(--f-disp);color:var(--c);display:inline-flex;gap:5px;align-items:center}
:root[data-theme=dark] .simc .lk span{color:var(--ink)}
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:var(--panel);border:2px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:var(--sh1)}
.cmp th,.cmp td{padding:14px 18px;text-align:left;border-bottom:2px solid var(--line);vertical-align:middle}
.cmp tr:last-child td{border-bottom:0}
.cmp thead th{font:600 18px var(--f-disp);background:var(--bg2)}
.cmp td:nth-child(n+2),.cmp th:nth-child(n+2){text-align:center;width:24%}
.cmp .y{color:var(--ok);font-weight:900}.cmp .n{color:var(--mute)}
.cmp .hl{background:color-mix(in srgb,var(--gold) 14%,var(--panel))}
@media(max-width:640px){.cmp th,.cmp td{padding:10px 8px;font-size:14px}}
.price-card{max-width:520px;margin:0 auto;background:var(--panel);border:3px solid var(--acc);border-radius:34px;padding:30px;box-shadow:var(--sh2);position:relative;text-align:center}
.price-card .ribbon{position:absolute;top:-16px;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--gold-ink);font:700 14px var(--f-disp);padding:6px 18px;border-radius:99px;white-space:nowrap}
.price-card .amt{font:700 clamp(54px,9vw,76px)/1 var(--f-disp);color:var(--ink);margin:12px 0 2px}
.price-card .amt s{font-size:.38em;color:var(--mute);font-weight:600;margin-right:10px}
.price-card ul{list-style:none;padding:0;margin:20px 0;text-align:left}
.price-card li{display:flex;gap:10px;align-items:flex-start;padding:6px 0}
.price-card li svg{color:var(--ok);flex:none;margin-top:3px}
.faq details{background:var(--panel);border:2px solid var(--line);border-radius:22px;padding:4px 20px;margin:0 0 12px;box-shadow:var(--sh1)}
.faq summary{cursor:pointer;font:600 18px var(--f-disp);padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:700 26px var(--f-disp);color:var(--acc);flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--mute);margin:0 0 14px}
.final{background:linear-gradient(135deg,var(--acc),#7a63f0);color:#fff;border-radius:38px;padding:clamp(28px,5vw,56px);text-align:center;position:relative;overflow:hidden}
.final h2{color:#fff}
.final p{opacity:.92;font-size:18px;max-width:52ch;margin:0 auto 22px}
.final::before,.final::after{content:"";position:absolute;border-radius:50%;background:#fff;opacity:.08}
.final::before{width:260px;height:260px;left:-80px;top:-100px}
.final::after{width:340px;height:340px;right:-120px;bottom:-170px}
:root[data-theme=dark] .final{background:linear-gradient(135deg,#34479a,#4c3a99)}

/* ---------- page headers ---------- */
.pg-t{padding:34px 0 10px}
.pg-t h1{font-size:clamp(30px,4.4vw,46px);margin:0 0 8px}
.pg-t h1 .ti{display:inline-grid;place-items:center;vertical-align:-6px;margin-right:10px;width:52px;height:52px;border-radius:18px;background:color-mix(in srgb,var(--c,var(--acc)) 18%,var(--panel));color:var(--c,var(--acc))}
.pg-t p{color:var(--mute);margin:0;max-width:66ch;font-size:18px}
.crumbs{display:flex;gap:8px;flex-wrap:wrap;color:var(--mute);font-weight:800;font-size:14.5px;padding:18px 0 0}
.crumbs a{color:var(--mute)}
.crumbs b{color:var(--ink)}

/* ---------- sim pages (legacy class support) ---------- */
.grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start;padding:8px 0 10px}
@media(min-width:960px){.grid{grid-template-columns:minmax(0,1.9fr) minmax(320px,1fr)}}
.grid>*{min-width:0}
.grid>.box{padding:18px}
.hint{color:var(--mute);font-size:14px;margin:10px 2px 0;line-height:1.5}
.read{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 0}
.read div{background:var(--bg);border-radius:18px;padding:10px 8px;text-align:center;border:2px solid var(--line)}
.read b{display:block;font:600 19px var(--f-disp);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.read small{display:block;line-height:1.2;color:var(--mute);font-size:12px;font-weight:800;margin-bottom:2px}
.ctl{margin:14px 0}
.ctl label{display:flex;justify-content:space-between;font-size:14.5px;font-weight:800;color:var(--mute);margin-bottom:6px;gap:10px}
.ctl label output{color:var(--ink);font-weight:900;font-variant-numeric:tabular-nums}
.ctl label.ck{justify-content:flex-start;gap:8px;color:var(--ink)}
.row{display:flex;gap:8px;align-items:center}
.btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.btns button,.row button,.ctl button{padding:8px 14px;font-size:14.5px;font-family:var(--f-body);font-weight:800}
.pair{display:flex;gap:10px;flex-wrap:wrap}
.pair svg{flex:1 1 260px;max-width:340px;margin:auto;display:block}
.tt{font:600 18px var(--f-disp);margin:0 0 10px}
.tie{margin:26px 0 0;padding:20px 24px;border-radius:26px;background:var(--accs);display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.tie p{margin:0}
canvas{touch-action:none;width:100%;display:block;border-radius:18px;background:var(--map)}
.simwrap #map{aspect-ratio:4/3;max-height:88vh}
.wrap-c{position:relative}
.sim-lead{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 6px}
.ck{display:flex;gap:10px;align-items:flex-start;margin:4px 0;padding:6px 8px;border-radius:12px;cursor:pointer}
.ck:hover{background:var(--accs)}
.ck input{margin-top:3px;flex:none}
.ck small{font-weight:700}
.seg{display:inline-flex;background:var(--bg2);border-radius:999px;padding:4px;gap:2px;flex-wrap:wrap}
.seg button{border:0;background:transparent;box-shadow:none;padding:7px 14px;font-size:14.5px;font-family:var(--f-disp);color:var(--mute)}
.seg button.on{background:var(--panel);color:var(--ink);box-shadow:var(--sh1)}
.seg button:hover{color:var(--ink);border:0}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.tabs button{padding:8px 16px;font-size:15px}
.tabs button.on{background:var(--acc);color:var(--acc-ink);border-color:var(--acc)}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl th,.tbl td{padding:9px 10px;border-bottom:2px solid var(--line);text-align:left;vertical-align:top}
.tbl th{font:600 13.5px var(--f-disp);color:var(--mute);text-transform:uppercase;letter-spacing:.05em}
.good{color:var(--ok)}.badc{color:var(--bad)}.warnc{color:var(--warn)}
.score-bar{height:14px;border-radius:99px;background:var(--bg2);overflow:hidden}
.score-bar i{display:block;height:100%;background:var(--ok);border-radius:99px;width:0;transition:width .4s}
.tray{display:flex;gap:8px;flex-wrap:wrap}
.tk{padding:8px 14px;border-radius:14px;border:2px solid var(--line);background:var(--bg);font-weight:800;cursor:grab;user-select:none}
.tk.drag{opacity:.4}
.feed{background:var(--bg);border:2px solid var(--line);border-radius:18px;padding:12px 14px;min-height:56px;font-weight:700}
.feed.ok{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 11%,var(--panel))}
.feed.no{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,var(--panel))}

/* sim paywall */
.simwrap{position:relative}
.simlock{position:relative;border-radius:var(--r);overflow:hidden;border:2px solid var(--line);background:var(--panel);box-shadow:var(--sh1);margin:8px 0 10px}
.simlock .pvimg{width:100%;aspect-ratio:16/8;object-fit:cover;filter:blur(7px) saturate(.9);opacity:.55;display:block;background:var(--map)}
.simlock .lk{position:absolute;inset:0;display:grid;place-items:center;padding:20px}
.simlock .lkc{background:var(--panel);border:2px solid var(--line);border-radius:30px;padding:26px 28px;max-width:470px;text-align:center;box-shadow:var(--sh2)}
.simlock h2{font-size:26px;margin:6px 0 8px}
.simlock p{color:var(--mute);margin:0 0 16px}
.lock-ic{width:58px;height:58px;border-radius:20px;background:color-mix(in srgb,var(--gold) 30%,var(--panel));color:#9a5d00;display:grid;place-items:center;margin:0 auto}
:root[data-theme=dark] .lock-ic{color:var(--gold)}

/* linked learning panel */
.links{margin:22px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.links .lc{background:var(--panel);border:2px solid var(--line);border-radius:24px;padding:16px 18px;box-shadow:var(--sh1)}
.links .lc h3{font-size:18px;margin:0 0 8px;display:flex;gap:8px;align-items:center}
.links .lc a.it{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:12px;color:var(--ink);font-weight:800}
.links .lc a.it:hover{background:var(--accs);text-decoration:none}
.links .lc a.it small{color:var(--mute);font-weight:800;white-space:nowrap}
.tie2{margin:16px 0 0}

/* ---------- prose / SEO pages ---------- */
.prose{max-width:820px}
.prose h2{margin-top:1.4em;font-size:clamp(24px,3vw,32px)}
.prose h3{margin-top:1.2em}
.prose p,.prose li{font-size:17.5px;line-height:1.7}
.prose table{border-collapse:collapse;width:100%;margin:0 0 1.2em;font-size:16px}
.prose th,.prose td{border:2px solid var(--line);padding:9px 12px;text-align:left}
.prose th{background:var(--bg2);font-family:var(--f-disp);font-weight:600}
.sp-hero{display:grid;grid-template-columns:1.3fr .7fr;gap:24px;align-items:center;padding:12px 0 8px}
.sp-art{background:color-mix(in srgb,var(--c,var(--acc)) 14%,var(--panel));border:2px solid var(--line);border-radius:32px;padding:18px;display:grid;place-items:center}
.sp-art svg{width:100%;height:auto;max-height:200px}
@media(max-width:820px){.sp-hero{grid-template-columns:1fr}}
.kcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,400px),1fr));gap:16px}
.kc{background:var(--panel);border:2px solid var(--line);border-radius:26px;padding:20px;box-shadow:var(--sh1)}
.kc h3{font-size:19px}
.kc .ans{margin-bottom:.7em}
.kc .tip{background:color-mix(in srgb,var(--gold) 20%,var(--panel));border-radius:14px;padding:8px 12px;font-size:15px}
.kc .fm{overflow-x:auto;padding:4px 0;font-size:.92em}
.kc .fm .katex-display{margin:.4em 0;text-align:left}
.kc .fm .katex-display>.katex{text-align:left}
.kc figure{margin:10px 0 0}
.qa{background:var(--panel);border:2px solid var(--line);border-radius:26px;padding:20px;margin:0 0 14px;box-shadow:var(--sh1)}
.qa h3{font-size:19px;line-height:1.35}
.qa .qn{display:inline-block;background:var(--accs);color:var(--acc);border-radius:99px;padding:1px 11px;margin-right:8px;font-size:14px}
:root[data-theme=dark] .qa .qn{color:var(--ink)}
.qo{padding-left:0;list-style:none;counter-reset:o;margin:10px 0}
.qo li{counter-increment:o;display:flex;gap:10px;padding:7px 12px;border:2px solid var(--line);border-radius:14px;margin:6px 0}
.qo li::before{content:counter(o,upper-alpha);font:700 14px var(--f-disp);width:24px;height:24px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;flex:none;margin-top:2px}
.qa details summary{cursor:pointer;font:600 16px var(--f-disp);color:var(--acc)}
.qa details p{margin:8px 0 0}
.topics{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.tp{display:flex;justify-content:space-between;gap:8px;align-items:center;background:var(--panel);border:2px solid var(--line);border-radius:18px;padding:12px 16px;color:var(--ink);font-weight:800}
.tp:hover{border-color:var(--c,var(--acc));text-decoration:none}
.tp small{color:var(--mute);white-space:nowrap}
.locked-note{background:linear-gradient(135deg,color-mix(in srgb,var(--gold) 26%,var(--panel)),var(--panel));border:2px solid color-mix(in srgb,var(--gold) 55%,var(--line));border-radius:26px;padding:22px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.locked-note h3{margin:0 0 4px}
.locked-note p{margin:0;color:var(--mute)}

/* ---------- auth pages ---------- */
.auth{max-width:480px;margin:36px auto 10px}
.auth .card{padding:28px}
.auth h1{font-size:clamp(28px,4vw,36px);margin:0 0 6px}
.auth .alt{text-align:center;color:var(--mute);margin-top:16px}
.pw-wrap{position:relative}
.pw-wrap button{position:absolute;right:6px;top:50%;transform:translateY(-50%);padding:5px 10px;font-size:13px;box-shadow:none;border:0;background:var(--bg2);color:var(--mute)}
.perk-list{list-style:none;padding:0;margin:14px 0 0}
.perk-list li{display:flex;gap:10px;align-items:flex-start;font-weight:800}
.perk-list svg{color:var(--ok);flex:none;margin-top:4px}

/* ---------- practice ---------- */
.app{display:grid;grid-template-columns:320px minmax(0,1fr);gap:20px;align-items:start;padding:22px 0 20px}
.side{position:sticky;top:84px;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 100px);overflow:auto;padding:2px 4px 2px 2px}
.side .card{padding:16px}
.subj-tabs{display:flex;flex-wrap:wrap;gap:6px}
.subj-tabs button{padding:7px 14px;font-size:14.5px;border-width:2px}
.subj-tabs button.on{background:var(--c,var(--acc));border-color:var(--c,var(--acc));color:#fff}
:root[data-theme=dark] .subj-tabs button.on{color:#0e1530}
.tp-list{display:flex;flex-direction:column;gap:3px;max-height:44vh;overflow:auto;margin:10px -4px 0;padding:0 4px}
.tp-list button{justify-content:space-between;border:0;background:transparent;box-shadow:none;font:800 14.5px var(--f-body);padding:8px 12px;border-radius:14px;text-align:left;white-space:normal;color:var(--ink);gap:10px}
.tp-list button:hover{background:var(--accs)}
.tp-list button.on{background:color-mix(in srgb,var(--c,var(--acc)) 18%,var(--panel))}
.tp-list button small{color:var(--mute);font-weight:800;white-space:nowrap}
.tp-list button .pr{width:34px;height:6px;border-radius:9px;background:var(--bg2);overflow:hidden;display:inline-block;margin-left:4px;vertical-align:middle}
.tp-list button .pr i{display:block;height:100%;background:var(--c,var(--acc))}
.main-col{min-width:0}
.qcard{background:var(--panel);border:2px solid var(--line);border-radius:30px;padding:clamp(18px,3vw,30px);box-shadow:var(--sh1);position:relative}
.qhead{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px;color:var(--mute);font-weight:800;font-size:14.5px}
.qhead .sp{flex:1}
.qtext{font:600 clamp(19px,2.4vw,24px)/1.42 var(--f-disp);margin:0 0 18px;overflow-wrap:anywhere}
.qfig{margin:0 0 16px;background:var(--bg);border-radius:20px;padding:10px;text-align:center}
.qfig svg{max-width:420px;width:100%;height:auto}
.opts{display:flex;flex-direction:column;gap:10px}
.op{display:flex;gap:14px;width:100%;text-align:left;padding:14px 18px;border-radius:20px;align-items:flex-start;line-height:1.45;font:700 17px/1.45 var(--f-body);border:2px solid var(--line);background:var(--panel);box-shadow:none;justify-content:flex-start;white-space:normal;color:var(--ink)}
.op b{min-width:30px;height:30px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;font:700 14px var(--f-disp);flex:none}
.op:disabled{opacity:1;cursor:default;pointer-events:none}
.op:not(:disabled):hover{border-color:var(--acc);background:var(--accs)}
.op.sel{border-color:var(--acc);background:var(--accs)}
.op.sel b{background:var(--acc);color:var(--acc-ink)}
.op.ok{background:color-mix(in srgb,var(--ok) 15%,var(--panel));border-color:var(--ok)}
.op.ok b{background:var(--ok);color:#fff}
.op.no{background:color-mix(in srgb,var(--bad) 13%,var(--panel));border-color:var(--bad)}
.op.no b{background:var(--bad);color:#fff}
.expl{margin-top:18px;border-radius:22px;padding:16px 18px;background:var(--bg);border:2px dashed var(--line)}
.expl h4{font-size:17px;margin:0 0 6px;display:flex;gap:8px;align-items:center}
.expl p{margin:0 0 .6em}
.expl.good{border-color:var(--ok);border-style:solid;background:color-mix(in srgb,var(--ok) 8%,var(--panel))}
.expl.bad{border-color:var(--bad);border-style:solid;background:color-mix(in srgb,var(--bad) 7%,var(--panel))}
.qnav{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:20px;flex-wrap:wrap}
.relbox{margin-top:18px;padding-top:16px;border-top:2px dashed var(--line);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.relbox>b{font:600 15px var(--f-disp);color:var(--mute);margin-right:4px}
.relbox .chip{font-size:13.5px}
.lockq{text-align:center;padding:34px 20px;background:var(--panel);border:2px dashed var(--line);border-radius:30px}
.lockq h3{margin-bottom:6px}
.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.mini-stats div{background:var(--bg);border-radius:16px;padding:8px 4px}
.mini-stats b{display:block;font:700 20px var(--f-disp)}
.mini-stats small{color:var(--mute);font-weight:800;font-size:12px}
.filters{display:flex;flex-wrap:wrap;gap:6px}
.filters button{padding:6px 12px;font-size:13.5px}
.filters button.on{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.togl{display:flex;gap:10px;align-items:center;font-weight:800;font-size:14.5px;cursor:pointer;padding:4px 0}
@media(max-width:940px){.app{grid-template-columns:1fr}.app .side{order:2}.side{position:static;max-height:none;overflow:visible}.tp-list{max-height:30vh}}

/* ---------- mock ---------- */
.mock-top{position:sticky;top:67px;z-index:20;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(10px);padding:10px 0;border-bottom:2px solid var(--line);margin-bottom:16px}
.mock-top .in{display:flex;gap:14px;align-items:center}
.timer{font:700 22px var(--f-disp);font-variant-numeric:tabular-nums;padding:6px 16px;background:var(--panel);border:2px solid var(--line);border-radius:99px}
.timer.low{color:var(--bad);border-color:var(--bad)}
.mock-g{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:18px;align-items:start}
.pal{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;max-height:48vh;overflow:auto;padding:2px}
.pal button{padding:0;height:38px;border-radius:12px;font:700 14px var(--f-disp);border-width:2px}
.pal button.ans{background:color-mix(in srgb,var(--acc) 22%,var(--panel));border-color:var(--acc)}
.pal button.flag{box-shadow:inset 0 0 0 3px var(--gold)}
.pal button.cur{background:var(--acc);color:var(--acc-ink);border-color:var(--acc)}
.pal button.ok{background:color-mix(in srgb,var(--ok) 25%,var(--panel));border-color:var(--ok)}
.pal button.no{background:color-mix(in srgb,var(--bad) 22%,var(--panel));border-color:var(--bad)}
@media(max-width:900px){.mock-g{grid-template-columns:1fr}.pal{grid-template-columns:repeat(10,1fr);max-height:none}}
.ring{width:170px;height:170px;border-radius:50%;display:grid;place-items:center;margin:0 auto;background:conic-gradient(var(--c,var(--ok)) calc(var(--p)*1%),var(--bg2) 0)}
.ring>div{width:130px;height:130px;border-radius:50%;background:var(--panel);display:grid;place-items:center;font:700 38px var(--f-disp);text-align:center;line-height:1}
.ring small{display:block;font:700 13px var(--f-body);color:var(--mute);margin-top:4px}
.opt-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.opt-g button{font-family:var(--f-body);flex-direction:column;padding:14px 10px;border-radius:22px;height:auto;gap:2px}
.opt-g button b{font:600 20px var(--f-disp);overflow-wrap:anywhere}
.opt-g button small{color:var(--mute);font-weight:800;font-family:var(--f-body)}
.opt-g button.on{background:var(--accs);border-color:var(--acc)}
.opt-g button.lk{opacity:.6}

/* ---------- flashcards ---------- */
.fc-wrap{perspective:1400px}
.fc{position:relative;min-height:380px;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.3,.7,.3,1);cursor:pointer}
.fc.flip{transform:rotateY(180deg)}
.fc .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--panel);border:2px solid var(--line);border-radius:34px;box-shadow:var(--sh2);padding:clamp(20px,3.4vw,34px);display:flex;flex-direction:column;overflow:auto}
.fc .back{transform:rotateY(180deg);background:linear-gradient(160deg,color-mix(in srgb,var(--c,var(--acc)) 10%,var(--panel)),var(--panel))}
.fc .front{background:linear-gradient(160deg,var(--panel),color-mix(in srgb,var(--c,var(--acc)) 8%,var(--panel)))}
.fc .tagline{font:700 13px var(--f-disp);letter-spacing:.08em;text-transform:uppercase;color:var(--c,var(--acc));margin-bottom:10px}
:root[data-theme=dark] .fc .tagline{color:var(--ink)}
.fc .qq{font:600 clamp(22px,3.2vw,32px)/1.3 var(--f-disp);margin:auto 0}
.fc .hintf{margin-top:auto;color:var(--mute);font-weight:800;font-size:14px;text-align:center;padding-top:14px}
.fc .aa{font-size:18.5px;line-height:1.55}
.fc .aa ul{padding-left:1.1em;margin:.6em 0}
.fc .fm{margin:8px 0;overflow-x:auto}
.fc figure{margin:10px 0 0;text-align:center}
.fc figure svg{max-width:340px;width:100%;height:auto}
.fc .tipf{background:color-mix(in srgb,var(--gold) 22%,var(--panel));border-radius:16px;padding:9px 14px;font-size:15.5px;margin-top:10px}
.rate{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}
.rate button{padding:13px 8px;border-radius:20px;flex-direction:column;gap:0}
.rate button small{color:var(--mute);font:700 12px var(--f-body)}
@media(max-width:380px){.rate{gap:6px}.rate button{padding:12px 4px;min-width:0}.rate button small{font-size:11px;text-align:center}}
.rate .again{border-color:color-mix(in srgb,var(--bad) 50%,var(--line))}
.rate .good{border-color:color-mix(in srgb,var(--warn) 50%,var(--line));color:var(--ink)}
.rate .easy{border-color:color-mix(in srgb,var(--ok) 50%,var(--line));color:var(--ink)}
.rate button:hover{background:var(--accs)}
@media(max-width:560px){.fc{min-height:440px}}

/* ---------- dashboard / account ---------- */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.tile{background:var(--panel);border:2px solid var(--line);border-radius:26px;padding:18px;box-shadow:var(--sh1)}
.tile b{display:block;font:700 34px/1.1 var(--f-disp)}
.tile small{color:var(--mute);font-weight:800}
.tile .ico{width:40px;height:40px;border-radius:14px;background:color-mix(in srgb,var(--c,var(--acc)) 20%,var(--panel));color:var(--c,var(--acc));display:grid;place-items:center;margin-bottom:10px}
.subj-rows{display:flex;flex-direction:column;gap:14px}
.subj-row{display:grid;grid-template-columns:200px 1fr auto;gap:14px;align-items:center}
.subj-row .nm{font:600 17px var(--f-disp);display:flex;gap:8px;align-items:center}
.subj-row small{color:var(--mute);font-weight:800;white-space:nowrap}
@media(max-width:620px){.subj-row{grid-template-columns:1fr;gap:4px}}
.weak{display:flex;flex-direction:column;gap:8px}
.weak a.w{display:flex;justify-content:space-between;gap:10px;align-items:center;background:var(--bg);border-radius:18px;padding:10px 14px;color:var(--ink);border:2px solid var(--line)}
.weak a.w:hover{border-color:var(--bad);text-decoration:none}
.weak a.w small{color:var(--bad);font-weight:900;white-space:nowrap}
.spark{display:flex;gap:6px;align-items:flex-end;height:90px}
.spark i{flex:1;background:var(--acc);border-radius:8px 8px 4px 4px;min-height:6px;opacity:.85;position:relative}
.spark i.f{background:var(--bad)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:860px){.two{grid-template-columns:1fr}}
.upsell{background:linear-gradient(135deg,color-mix(in srgb,var(--gold) 30%,var(--panel)),color-mix(in srgb,var(--acc) 10%,var(--panel)));border:2px solid color-mix(in srgb,var(--gold) 55%,var(--line));border-radius:28px;padding:20px 24px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.upsell h3{margin:0 0 4px}
.upsell p{margin:0;color:var(--mute)}
.danger{border-color:color-mix(in srgb,var(--bad) 45%,var(--line))}
.reset-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.reset-g label{display:flex;gap:10px;align-items:center;padding:10px 14px;border:2px solid var(--line);border-radius:16px;cursor:pointer}
.reset-g label:hover{border-color:var(--bad)}
.plan-badge{display:inline-flex;gap:6px;align-items:center;font:700 14px var(--f-disp);padding:5px 14px;border-radius:99px;background:var(--bg2)}
.plan-badge.pro{background:var(--gold);color:var(--gold-ink)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(30px);background:var(--ink);color:var(--bg);padding:12px 22px;border-radius:99px;font-weight:800;opacity:0;pointer-events:none;transition:.3s;z-index:120;max-width:90vw;text-align:center}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.modal{position:fixed;inset:0;background:rgba(10,16,38,.6);backdrop-filter:blur(4px);z-index:110;display:none;align-items:center;justify-content:center;padding:16px}
.modal.on{display:flex}
.modal .card{max-width:480px;width:100%;padding:28px;text-align:center}
.modal .x{position:absolute}
.chk{text-align:left!important;max-height:calc(100vh - 32px);overflow:auto}
.chk h2{text-align:left}
.chk-rows{border:2px solid var(--line);border-radius:18px;padding:6px 16px;background:var(--bg)}
.chk-rows>div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-weight:800;border-bottom:2px dashed var(--line)}
.chk-rows>div[hidden]{display:none}
.chk-rows>div:last-child{border-bottom:0}
.chk-rows .tot{font-size:21px}
.chk-rows s{color:var(--mute)}
.chk-in{display:flex;gap:10px}
.chk-in input{flex:1;min-width:0;text-transform:uppercase;letter-spacing:.06em}
.chk-in input[readonly]{background:var(--accs)}
.chk-in .btn{flex:none}
.chk-m{min-height:20px;margin-top:8px;font-weight:800;font-size:15px;color:var(--mute)}
.chk-m.ok{color:var(--ok)}.chk-m.bad{color:var(--bad)}
.sync{font-size:13px;color:var(--mute);font-weight:800}
.dis{font-size:13.5px;color:var(--mute);font-weight:700;line-height:1.5}
.disclaimer{background:var(--bg2);border-radius:18px;padding:12px 16px;font-size:14px;color:var(--mute);font-weight:700}
.katex{font-size:1.08em}
.sk{background:linear-gradient(90deg,var(--bg2),var(--line),var(--bg2));background-size:200% 100%;animation:sk 1.2s linear infinite;border-radius:16px;min-height:20px}
@keyframes sk{to{background-position:-200% 0}}
@media print{.site-hdr,.ft,#ov,.toast{display:none!important}body{background:#fff}}


/* ===== streak, announcements, dashboard banner, exam calendar, weak areas, notes, sheets ===== */
.streak{align-items:center;gap:6px;padding:4px 6px;border:2px solid var(--line);border-radius:999px;background:var(--panel);font:700 14px var(--f-disp);color:var(--ink)!important;text-decoration:none!important;white-space:nowrap}
.streak:hover{border-color:var(--acc)}
.streak .st-s,.streak .st-m{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px}
.streak .st-s{color:var(--gold2);background:color-mix(in srgb,var(--gold) 18%,var(--panel))}
.streak .st-m{color:var(--acc);background:var(--accs)}
.streak b{color:var(--ink);font-weight:700}
.streak.pop{animation:stpop 1.1s ease 2}
@keyframes stpop{0%,100%{transform:scale(1)}40%{transform:scale(1.18);box-shadow:0 0 0 6px color-mix(in srgb,var(--gold) 35%,transparent)}}
@media(max-width:700px){.streak .st-m{display:none}}
@media(max-width:400px){.streak{padding:2px 3px}.streak .st-s{padding:2px 7px}.brand{font-size:17px;gap:5px}.brand svg{width:28px;height:28px}}
@media(max-width:380px){a.streak,a.streak.in-only,body a.streak{display:none!important}}

.ann-wrap{display:flex;flex-direction:column}
.ann{display:flex;align-items:center;gap:12px;padding:9px 16px;font:700 15px var(--f-body);justify-content:center;text-align:center;flex-wrap:wrap;border-bottom:2px solid var(--line);background:var(--accs);color:var(--ink)}
.ann.ok{background:color-mix(in srgb,var(--ok) 16%,var(--panel))}
.ann.warn{background:color-mix(in srgb,var(--gold) 28%,var(--panel))}
.ann.exam{background:linear-gradient(90deg,color-mix(in srgb,var(--c-reg) 18%,var(--panel)),color-mix(in srgb,var(--acc) 14%,var(--panel)))}
.ann-a{font-weight:800;text-decoration:underline;text-underline-offset:3px}
.ann-x{border:0;background:transparent;box-shadow:none;color:var(--mute);font-size:22px;line-height:1;padding:0 6px;cursor:pointer;border-radius:8px}
.ann-x:hover{color:var(--ink)}

.k{font:700 12.5px var(--f-disp);letter-spacing:.07em;text-transform:uppercase;color:var(--mute)}
.dhero{display:grid;grid-template-columns:1.25fr 1.1fr .9fr;gap:0;margin-top:20px;border:2px solid var(--line);border-radius:30px;background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 9%,var(--panel)),var(--panel) 60%);overflow:hidden;box-shadow:var(--sh1)}
.dhero>*{padding:22px 24px;min-width:0}
.dh-a{display:flex;gap:20px;align-items:center}
.dh-a .ring>div{font-size:30px}
.dh-big{font:700 30px/1.1 var(--f-disp)}.dh-big small{font:700 15px var(--f-body);color:var(--mute)}
.bar.big{height:12px;margin:10px 0 6px;border-radius:99px;background:var(--bg2);overflow:hidden}.bar.big i{display:block;height:100%;background:var(--acc);border-radius:99px}
.dh-b{border-left:2px dashed var(--line)}
.stk-row{display:flex;gap:26px;align-items:flex-end;flex-wrap:wrap}
.stk-n,.mi-n{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.stk-n{color:var(--gold2)}.mi-n{color:var(--acc)}
.stk-n b,.mi-n b{font:700 34px/1 var(--f-disp);color:var(--ink)}.stk-n small,.mi-n small{color:var(--mute);font-weight:800}
.wk{display:flex;gap:8px;margin:14px 0 12px}
.wk span{display:flex;flex-direction:column;align-items:center;gap:4px;font:700 12px var(--f-disp);color:var(--mute)}
.wk span i{width:30px;height:30px;border-radius:50%;border:2px dashed var(--line);display:grid;place-items:center;font-style:normal;font-size:15px;color:var(--gold-ink);line-height:1}
.wk span.on i{background:var(--gold);border:2px solid var(--gold2)}
.wk span.today i{box-shadow:0 0 0 3px var(--accs)}
.rank .rk-t b{font:700 18px var(--f-disp)}
.rk-bar{height:9px;border-radius:99px;background:var(--bg2);margin:7px 0 4px;overflow:hidden}.rk-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--c-reg));border-radius:99px}
.dh-c{display:flex;align-items:center;gap:16px;text-decoration:none!important;color:var(--ink);border-left:2px dashed var(--line);background:color-mix(in srgb,var(--c-reg) 8%,transparent)}
.dh-c:hover{background:color-mix(in srgb,var(--c-reg) 14%,transparent)}
.exn{text-align:center;min-width:76px}.exn b{display:block;font:700 46px/1 var(--f-disp);color:var(--c-reg)}.exn small{font:700 13px var(--f-disp);color:var(--mute);text-transform:uppercase}
.exn-t{font:600 18px/1.25 var(--f-disp)}
@media(max-width:1000px){.dhero{grid-template-columns:1fr}.dh-b,.dh-c{border-left:0;border-top:2px dashed var(--line)}}
@media(max-width:520px){.dh-a{flex-direction:column;align-items:flex-start}}
.queue{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.queue .qi{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:22px;border:2px solid var(--line);background:var(--bg);color:var(--ink);text-decoration:none!important}
.queue .qi b{font:700 34px/1 var(--f-disp)}.queue .qi span{color:var(--mute);font-weight:800;font-size:14.5px}
.queue .qi.hot{border-color:var(--acc);background:var(--accs)}
.queue .qi:hover{border-color:var(--acc)}
.dq-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}

.exhero{display:flex;gap:26px;align-items:center;border:2px solid var(--line);border-radius:30px;padding:24px 28px;margin-bottom:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 14%,var(--panel)),var(--panel) 70%);box-shadow:var(--sh1);flex-wrap:wrap}
.exhero .big{text-align:center;min-width:130px;padding:14px 18px;border-radius:26px;background:color-mix(in srgb,var(--c) 18%,var(--panel));color:var(--ink)}
.exhero .big b{display:block;font:700 68px/1 var(--f-disp);color:var(--c)}.exhero .big small{font:700 15px var(--f-disp);text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.exhero h2{margin:2px 0 4px;font-size:clamp(24px,3vw,34px)}.exhero p{margin:0;color:var(--mute)}
.exhero .plan{margin-top:10px;padding:10px 14px;border-radius:16px;background:var(--bg2);font-size:15px;color:var(--ink)}
.cal-g{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;align-items:start}
@media(max-width:900px){.cal-g{grid-template-columns:1fr}}
.cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cal-h b{font:600 22px var(--f-disp)}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .wd{text-align:center;font:700 12.5px var(--f-disp);color:var(--mute);padding:4px 0;text-transform:uppercase}
.cal .d{min-height:54px;border-radius:16px;border:2px solid var(--line);padding:5px 7px;background:var(--bg);display:flex;flex-direction:column;gap:3px}
.cal .d.e{border:0;background:transparent}
.cal .d span{font:700 14px var(--f-disp)}
.cal .d.today{border-color:var(--acc);background:var(--accs)}
.cal .d.has{cursor:pointer;background:var(--panel);box-shadow:var(--sh1)}
.cal .d.has:hover,.cal .d.has:focus-visible{border-color:var(--acc);outline:0}
.cal .d i{display:block;height:7px;border-radius:99px}
.cal-info{margin-top:14px;display:grid;gap:8px;font-weight:800}
.exl{display:flex;flex-direction:column;gap:12px}
.ex{display:flex;gap:14px;padding:12px;border-radius:22px;border:2px solid var(--line);background:var(--bg)}
.ex .n{min-width:64px;text-align:center;border-radius:18px;background:color-mix(in srgb,var(--c) 18%,var(--panel));padding:8px 6px;align-self:flex-start}
.ex .n b{display:block;font:700 30px/1 var(--f-disp);color:var(--c)}.ex .n small{font:700 11.5px var(--f-disp);text-transform:uppercase;color:var(--mute)}
.ex .t{display:flex;flex-direction:column;gap:5px;align-items:flex-start;min-width:0}.ex .t b{font:600 18px/1.25 var(--f-disp)}.ex .t small{color:var(--mute);font-weight:800}.ex .t p{margin:0;font-size:14.5px;color:var(--mute)}

.wk-list{display:flex;flex-direction:column;gap:10px}
.wk-r{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(90px,1fr) auto auto;gap:12px;align-items:center;padding:10px 14px;border-radius:20px;border:2px solid var(--line);background:var(--bg)}
.wk-r .nm{display:flex;gap:10px;align-items:center;flex-wrap:wrap;min-width:0}.wk-r .nm b{font:600 16px/1.25 var(--f-disp)}
.wk-r .bar{height:10px;border-radius:99px;background:var(--bg2);overflow:hidden}.wk-r .bar i{display:block;height:100%;border-radius:99px;background:var(--ok)}
.wk-r.bad .bar i{background:var(--bad)}.wk-r.mid .bar i{background:var(--warn)}
.wk-r small{color:var(--mute);font-weight:800;white-space:nowrap}
@media(max-width:760px){.wk-r{grid-template-columns:1fr auto}.wk-r .bar{grid-column:1/-1;order:3}.wk-r small{grid-column:1/2}}

.tools{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.tools .btn.on{border-color:var(--gold2);color:var(--gold2)}
#noteBox{max-width:560px;margin:10px auto 0}#noteBox textarea{width:100%}
.note-show{background:color-mix(in srgb,var(--gold) 16%,var(--panel));border:2px solid color-mix(in srgb,var(--gold) 45%,var(--line));border-radius:18px;padding:12px 16px;margin-top:14px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.note-show b{font:600 14px var(--f-disp);text-transform:uppercase;letter-spacing:.05em;color:var(--gold2)}.note-show p{margin:0;font-size:15.5px;white-space:normal}
.note-edit{margin-top:14px}.note-edit textarea{width:100%}
.sv-top{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:14px 0 6px}.sv-top select{width:auto;min-width:170px}
.sv-list{display:grid;gap:14px;margin-top:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr))}
.sv{background:var(--panel);border:2px solid var(--line);border-radius:26px;padding:16px 18px;box-shadow:var(--sh1);display:flex;flex-direction:column;gap:8px}
.sv-h{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sv-h .sp{flex:1}.sv-h .kd{font:700 12px var(--f-disp);text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.sv-t{margin:0;font-weight:800;font-size:16.5px}.sv-a{margin:0;color:var(--mute);font-size:15px}.sv .btns{margin-top:4px}

.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0 8px}.rules div{background:var(--bg2);border-radius:20px;padding:12px;text-align:center}.rules b{display:block;font:700 26px/1.1 var(--f-disp)}.rules small{color:var(--mute);font-weight:800}
.hist{display:grid;gap:8px;margin-top:10px}.hist div{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:8px 14px;border-radius:16px;background:var(--bg2);font-weight:800}.hist .ok{color:var(--ok)}.hist .bad{color:var(--bad)}

.sh-top{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.sh-tabs{display:flex;gap:6px;flex-wrap:wrap}.sh-tabs button{border-radius:999px;border:2px solid var(--line);background:var(--panel);box-shadow:none;padding:7px 16px;font:600 15px var(--f-disp);color:var(--ink)}
.sh-tabs button.on{background:color-mix(in srgb,var(--c) 18%,var(--panel));border-color:var(--c)}
.sheet{background:var(--panel);border:2px solid var(--line);border-radius:30px;padding:26px 28px;box-shadow:var(--sh1)}
.sheet-h{border-bottom:3px solid var(--c);margin-bottom:18px;padding-bottom:10px}.sheet-h h2{margin:0;font-size:clamp(24px,3vw,32px)}.sheet-h small{color:var(--mute);font-weight:800}
.sec-b{margin:0 0 26px;break-inside:avoid-page}.sec-b h3{font-size:20px;color:var(--c);margin:0 0 10px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:12px}
.fi{border:2px solid var(--line);border-radius:20px;padding:12px 14px;background:var(--bg);break-inside:avoid}.fi>b{font:600 15.5px/1.3 var(--f-disp)}.fi small{display:block;color:var(--mute);font-weight:700;margin-top:4px;font-size:13.5px}
.fx{overflow-x:auto;padding:4px 0}.fx .katex{font-size:1.08em}.ft{font-weight:800;padding:8px 0}
table.sheet-t{width:100%;border-collapse:collapse;font-size:15px}table.sheet-t th{text-align:left;font:600 12.5px var(--f-disp);text-transform:uppercase;letter-spacing:.05em;color:var(--mute);padding:8px 10px;border-bottom:2px solid var(--line);white-space:nowrap}
table.sheet-t td{padding:8px 10px;border-bottom:2px solid var(--line);vertical-align:top;font-weight:700}table.sheet-t tr:nth-child(even) td{background:color-mix(in srgb,var(--bg2) 55%,transparent)}
.sh-ls{margin:0;padding-left:1.2em}.sh-ls li{margin:.4em 0;font-weight:700}.sh-n{color:var(--mute);font-size:14px;margin:8px 0 0}
@media print{
 body{background:#fff!important;color:#000}.no-print,.ann-wrap{display:none!important}
 .sheet{border:0;box-shadow:none;padding:0;border-radius:0}.fi,.sec-b{break-inside:avoid}
 .wrap{max-width:none;padding:0}
}
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
@media print{.tw{overflow:visible}}
@media(max-width:340px){.brand{font-size:15px;gap:4px}.brand svg{width:24px;height:24px}.ic-btn{width:30px;height:30px}.hdr-r{gap:2px}.acct .av{width:28px;height:28px}.hdr-in{padding:8px 8px;gap:4px}}
/* exam readiness */
.rd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.rd-c{scroll-margin-top:90px}
.rd-top{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.rd-top h2{font-size:24px;margin:0 0 6px}
.rd-top .ring{margin:0;flex:none}
.rd-b{display:inline-block;padding:4px 12px;border-radius:999px;font:700 14px var(--f-disp);background:var(--bg2);color:var(--ink)}
.rd-b.go{background:color-mix(in srgb,var(--ok) 22%,var(--panel))}.rd-b.near{background:color-mix(in srgb,var(--gold) 30%,var(--panel))}.rd-b.build{background:var(--accs)}
.rd-d{margin-left:8px;font-weight:800;font-size:13.5px;color:var(--mute)}.rd-d.up{color:var(--ok)}.rd-d.dn{color:var(--bad)}
.rd-parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}
.rd-p .bar{margin:6px 0 4px}.rd-p small{color:var(--mute);font-weight:700;font-size:12.5px;line-height:1.3;display:block}
.rd-pl{display:flex;justify-content:space-between;gap:6px;font-size:14.5px}.rd-pl span{font-weight:800;color:var(--mute)}
.rd-tips{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rd-tips li{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 12px;border-radius:16px;background:var(--bg)}
.rd-tips li span{flex:1 1 200px;font-size:15px}
.rd-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.rd-mini{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.rd-m{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:12px 6px;border-radius:22px;background:var(--bg);color:var(--ink);text-decoration:none!important}
.rd-m .ring{width:76px;height:76px}.rd-m .ring>div{width:58px;height:58px;font-size:22px}
.rd-m b{font:700 14.5px var(--f-disp)}.rd-m small{color:var(--mute);font-weight:800;font-size:12.5px}
@media(max-width:860px){.rd-grid{grid-template-columns:minmax(0,1fr)}.rd-mini{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:480px){.rd-parts{grid-template-columns:minmax(0,1fr)}.rd-mini{grid-template-columns:repeat(2,minmax(0,1fr))}}
