/* CortiX shared design system — Emerald/Teal (2026-06-03 reskin).
   Promoted from curriculum.css; new token names live here, curriculum.css keeps
   its --cm-* names at the same values for back-compat. Dark default, light via
   prefers-color-scheme. Fonts (Space Grotesk + JetBrains Mono) are linked in templates. */

:root{
  --bg:#081210; --bg2:#0b1815; --surface:#0f1f1a; --surface2:#15291f;
  --border:rgba(255,255,255,0.09); --border-bright:rgba(255,255,255,0.16);
  --text:#eef2ff; --dim:#9aa6c4; --faint:#6b7799;
  --accent:#10b981; --accent-bright:#34d399; --accent-deep:#0a7f5b; --accent-dim:rgba(16,185,129,0.16);
  --teal:#2dd4bf; --teal-deep:#0e9a8a; --teal-dim:rgba(45,212,191,0.14);
  --t-untried:#64748b; --t-untried-bg:rgba(100,116,139,0.16);
  --t-prog:#f59e0b;   --t-prog-bg:rgba(245,158,11,0.16);
  --t-prof:#3b82f6;   --t-prof-bg:rgba(59,130,246,0.16);
  --t-master:#fbbf24; --t-master-bg:rgba(251,191,36,0.16); --t-master-deep:#b8860b;
  --good:#34d399; --bad:#fb7185;
  --shadow:0 10px 26px rgba(0,0,0,0.35);
  --disp:'Space Grotesk',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#eaf3ee; --bg2:#e0ece6; --surface:#ffffff; --surface2:#f1f8f4;
    --border:rgba(15,23,42,0.10); --border-bright:rgba(15,23,42,0.18);
    --text:#0f172a; --dim:#475069; --faint:#7a85a3;
    --accent:#059669; --accent-bright:#10b981; --accent-deep:#047857; --accent-dim:rgba(16,185,129,0.13);
    --teal:#0d9488; --teal-deep:#0a7268; --teal-dim:rgba(13,148,136,0.12);
    --t-master:#ca8a04; --t-master-bg:rgba(202,138,4,0.14);
    --shadow:0 10px 26px rgba(15,23,42,0.10);
  }
}

/* palette-aware sparkline (overrides the hardcoded SVG colours in markup) */
.rhero-spark path{fill:color-mix(in srgb,var(--accent-bright) 26%,transparent);}
.rhero-spark polyline{stroke:var(--accent-bright);}
.rhero-spark circle{fill:var(--teal);}

/* chunky pressable button — the Duolingo feel, in CortiX emerald */
.btn3d{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--disp);font-weight:700;font-size:15px;
  color:#fff;background:var(--accent);border:0;border-radius:14px;padding:13px 20px;cursor:pointer;letter-spacing:-0.01em;
  box-shadow:0 4px 0 var(--accent-deep);transition:transform .05s,box-shadow .05s;}
.btn3d:active{transform:translateY(3px);box-shadow:0 1px 0 var(--accent-deep);}
.btn3d.cy{background:var(--teal);color:#06283a;box-shadow:0 4px 0 var(--teal-deep);}
.btn3d.gold{background:var(--t-master);color:#3a2a06;box-shadow:0 4px 0 var(--t-master-deep);}
.btn3d.block{width:100%;}

/* chess.com rating hero — big number + tier + live tick + sparkline */
.rhero{background:linear-gradient(160deg,var(--surface2),var(--surface));border:1px solid var(--border-bright);border-radius:18px;padding:16px 18px;box-shadow:var(--shadow);}
.rhero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.rhero-k{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);}
.rhero-num{font-family:var(--mono);font-weight:700;font-size:46px;line-height:.9;letter-spacing:-0.02em;margin-top:6px;display:flex;align-items:baseline;gap:10px;}
.rhero-delta{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--good);}
.rhero-tier{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--t-master);background:var(--t-master-bg);padding:5px 10px;border-radius:8px;white-space:nowrap;}
.rhero-spark{margin-top:12px;width:100%;height:46px;display:block;}
.rhero-foot{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--mono);font-size:11px;color:var(--faint);}
.rhero-foot b{color:var(--text);}

/* streak week + XP/level ring — the dopamine strip */
.gstrip{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;}
.gtile{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:13px 14px;}
.gtile-k{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);}
.streak-big{display:flex;align-items:center;gap:9px;margin-top:6px;}
.streak-n{font-family:var(--mono);font-weight:700;font-size:24px;}
.streak-week{display:flex;gap:4px;margin-top:9px;}
.sd{flex:1;height:7px;border-radius:3px;background:rgba(255,255,255,0.08);}
@media (prefers-color-scheme: light){ .sd{background:rgba(15,23,42,0.08);} }
.sd.on{background:var(--t-prog);} .sd.today{background:var(--accent-bright);}
.xp-row{display:flex;align-items:center;gap:11px;margin-top:6px;}
.xp-ring{width:42px;height:42px;flex:0 0 auto;border-radius:50%;background:conic-gradient(var(--accent-bright) calc(var(--p,0)*1%),rgba(255,255,255,0.08) 0);display:grid;place-items:center;}
@media (prefers-color-scheme: light){ .xp-ring{background:conic-gradient(var(--accent) calc(var(--p,0)*1%),rgba(15,23,42,0.08) 0);} }
.xp-ring>i{width:32px;height:32px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;font-family:var(--mono);font-weight:700;font-size:13px;font-style:normal;}
.xp-meta{font-family:var(--mono);font-size:11px;color:var(--faint);}
.xp-meta b{color:var(--text);font-size:15px;}

/* recommend / train-next — with a chunky GO */
.recommend{display:flex;align-items:center;gap:13px;padding:14px;border-radius:16px;margin-top:12px;text-decoration:none;color:inherit;
  border:1px solid color-mix(in srgb,var(--accent) 50%,transparent);background:linear-gradient(125deg,var(--accent-dim),var(--teal-dim));box-shadow:0 8px 24px var(--accent-dim);}
.recommend .rico{width:46px;height:46px;flex:0 0 auto;border-radius:13px;display:grid;place-items:center;background:var(--bg2);font-size:22px;}
.recommend .rk{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);}
.recommend .rn{font-weight:700;font-size:16px;margin-top:1px;}
.recommend .rw{font-size:11.5px;color:var(--dim);margin-top:2px;}

/* resume / pick-up-where-you-left-off banner */
.resume{display:flex;align-items:center;gap:13px;padding:13px 14px;border-radius:16px;margin-bottom:14px;text-decoration:none;color:inherit;
  border:1px solid color-mix(in srgb,var(--teal) 45%,transparent);background:linear-gradient(120deg,var(--teal-dim),var(--surface) 78%);box-shadow:0 8px 22px var(--teal-dim);}
.resume .ric{width:44px;height:44px;flex:0 0 auto;border-radius:13px;display:grid;place-items:center;background:var(--bg2);font-size:21px;}
.resume .rk{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);}
.resume .rn{font-weight:700;font-size:15.5px;margin-top:1px;letter-spacing:-0.01em;}
.resume .rprog{display:flex;align-items:center;gap:8px;margin-top:6px;}
.resume .rbar2{height:6px;border-radius:99px;background:rgba(255,255,255,0.1);overflow:hidden;width:92px;}
@media (prefers-color-scheme: light){ .resume .rbar2{background:rgba(15,23,42,0.1);} }
.resume .rbar2>i{display:block;height:100%;width:58%;background:linear-gradient(90deg,var(--teal),var(--accent-bright));border-radius:99px;}
.resume .rstep{font-family:var(--mono);font-size:10.5px;color:var(--faint);}
/* keep the Resume button inside the card on a narrow frame */
.resume>span{min-width:0;}
.resume .rn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.resume .btn3d{flex:0 0 auto;padding:11px 16px;}

/* know-yourself entry card (links to its own page) */
.ky-entry{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;margin-top:10px;text-decoration:none;color:inherit;background:var(--surface);border:1px dashed var(--border-bright);}
.ky-entry .kico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:20px;background:var(--bg2);flex:0 0 auto;}
.ky-entry .kn{font-weight:600;font-size:15px;}
.ky-entry .kd{font-size:11.5px;color:var(--faint);margin-top:2px;}
.ky-entry .karrow{margin-left:auto;color:var(--faint);font-size:20px;}

/* Train / Test segmented control */
.seg{display:flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--border);border-radius:12px;margin:14px 0 4px;}
.seg button{flex:1;font-family:var(--mono);font-size:12px;font-weight:600;padding:9px;border:0;border-radius:9px;background:transparent;color:var(--dim);cursor:pointer;}
.seg button.on{background:var(--accent);color:#fff;}
.seg button.on.test{background:var(--teal);color:#06283a;}

/* ===== the winding PATH (amped curriculum.css .cm-path) ===== */
.path{position:relative;padding:18px 0 8px;display:flex;flex-direction:column;align-items:center;}
.pnode{position:relative;display:flex;flex-direction:column;align-items:center;}
.pconn{width:5px;height:26px;border-radius:3px;background:repeating-linear-gradient(var(--border-bright) 0 7px,transparent 7px 13px);}
.pnode.donelink .pconn{background:var(--t-master);}
.pnode[data-off="l"]{transform:translateX(-72px);}
.pnode[data-off="r"]{transform:translateX(72px);}
.pnode[data-off="L"]{transform:translateX(-104px);}
.pnode[data-off="R"]{transform:translateX(104px);}
.disc{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;position:relative;border:3px solid transparent;}
.disc .gly{font-size:26px;} .disc .nm{font-family:var(--mono);font-weight:700;font-size:22px;}
.pnode.mastered .disc{background:var(--t-master-bg);border-color:var(--t-master);box-shadow:0 6px 16px -6px var(--t-master),inset 0 2px 0 rgba(255,255,255,.12);}
.pnode.mastered .gly,.pnode.mastered .nm{color:var(--t-master);}
.pnode.prof .disc{background:var(--t-prof-bg);border-color:var(--t-prof);} .pnode.prof .gly{color:var(--t-prof);}
.pnode.current .disc{background:var(--surface2);border-color:var(--accent-bright);animation:pulsering 2s ease-out infinite;}
.pnode.current .gly,.pnode.current .nm{color:var(--accent-bright);}
.pnode.locked .disc{background:var(--surface);border-color:var(--border-bright);border-style:dashed;}
.pnode.locked .gly{color:var(--faint);opacity:.7;}
.pnode.chest .disc{background:linear-gradient(150deg,var(--t-master-bg),var(--surface2));border-color:var(--t-master);}
@keyframes pulsering{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent-bright) 50%,transparent);}70%{box-shadow:0 0 0 15px color-mix(in srgb,var(--accent-bright) 0%,transparent);}100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent-bright) 0%,transparent);}}
@media (prefers-reduced-motion:reduce){.pnode.current .disc{animation:none;}}
.crowns{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);display:flex;gap:1px;background:var(--bg);border:1px solid var(--t-master);border-radius:999px;padding:1px 5px;}
.crowns i{font-size:9px;font-style:normal;filter:grayscale(1) brightness(1.7);opacity:.4;}
.crowns i.on{filter:none;opacity:1;}
.start-bub{position:absolute;top:-38px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-weight:700;font-size:10px;letter-spacing:.08em;background:var(--accent-bright);color:#fff;padding:5px 11px;border-radius:8px;white-space:nowrap;box-shadow:0 4px 0 var(--accent-deep);}
.path .here{position:absolute;top:-34px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-weight:700;font-size:9px;letter-spacing:.1em;color:var(--teal);white-space:nowrap;}
.plabel{margin-top:13px;text-align:center;max-width:150px;}
.plabel .pl{font-weight:600;font-size:13px;letter-spacing:-0.01em;}
.plabel .pstars{margin-top:3px;}
.stars{display:inline-flex;gap:1px;} .st{font-size:11px;color:var(--t-untried);} .st.on{color:var(--t-master);}
.plabel .preps{font-family:var(--mono);font-size:10px;color:var(--faint);margin-top:2px;}
.pnode.locked .plabel .pl{color:var(--faint);}

/* know-yourself page cards */
.disc-card{background:linear-gradient(160deg,var(--surface2),var(--surface));border:1px solid var(--border-bright);border-radius:16px;padding:15px;box-shadow:var(--shadow);}
.disc-card .dt{font-weight:700;font-size:15px;}.disc-card .dd{font-size:12.5px;color:var(--dim);line-height:1.55;margin-top:6px;}
.disc-badge{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t-prog);background:var(--t-prog-bg);padding:4px 9px;border-radius:6px;display:inline-block;margin-top:10px;}
.benchcard{display:flex;align-items:center;gap:13px;padding:13px;border-radius:14px;margin-top:10px;background:var(--surface);border:1px solid var(--border);}
.benchcard .bico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:20px;background:var(--bg2);flex:0 0 auto;}
.benchcard .bn{font-weight:600;font-size:14.5px;}.benchcard .bd{font-size:11.5px;color:var(--faint);margin-top:2px;line-height:1.45;}
.benchcard .bb{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 7px;border-radius:5px;margin-top:7px;display:inline-block;color:var(--faint);border:1px solid var(--border-bright);}
