/* Math Lab Skill Score (ml-skill.1.js). Uses the site's own tokens so it follows both themes. */
:root{--mls-acc:#45dccb;--mls-acc-ink:#8af0e4;--mls-acc-bg:#1f4d55;--mls-pro:#8fb4ff;--mls-pro-bg:#263f72;--mls-pro-ink:#c8dbff;--mls-mas:#c6f432;--mls-mas-bg:#3c3a14;--mls-mas-ink:#e2fb8f;--mls-track:#2b3f63;--mls-down:#ff9aa6}
html[data-ml-theme=chalk],html[data-theme=light]{--mls-acc:#0b6e77;--mls-acc-ink:#0b5a62;--mls-acc-bg:#e2f4f2;--mls-pro:#2557c7;--mls-pro-bg:#e6eefc;--mls-pro-ink:#1d469f;--mls-mas:#5e7d00;--mls-mas-bg:#eef7d2;--mls-mas-ink:#465d00;--mls-track:#dbe3ee;--mls-down:#b4233a}
.mls-panel{display:grid;gap:14px}
.mls-top{display:flex;align-items:center;gap:18px}
.mls-ring{position:relative;width:92px;height:92px;flex:none}
.mls-ring svg{display:block}
.mls-ring .mls-track{fill:none;stroke:var(--mls-track);stroke-width:9}
.mls-ring .mls-fill{fill:none;stroke:var(--mls-acc);stroke-width:9;stroke-linecap:round;transition:stroke-dasharray .6s ease}
.mls-num{position:absolute;inset:0;display:grid;place-content:center;text-align:center;line-height:1}
.mls-num b{font:700 28px/1 "DM Sans",Arial,sans-serif;color:var(--ink)}
.mls-num span{font:400 11px/1.4 "DM Sans",Arial,sans-serif;color:var(--muted)}
.mls-side{display:grid;gap:6px;justify-items:start;min-width:0}
.mls-label{font:500 13px "DM Sans",Arial,sans-serif;color:var(--muted)}
.mls-next{margin:0;font:400 14px/1.45 "DM Sans",Arial,sans-serif;color:var(--ink)}
.mls-pill{display:inline-flex;align-items:center;border-radius:999px;padding:2px 10px;font:700 12px/1.5 "DM Sans",Arial,sans-serif;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.mls-pill.mls-att{border-color:var(--line);color:var(--ink)}
.mls-pill.mls-fam{background:var(--mls-acc-bg);border-color:var(--mls-acc);color:var(--mls-acc-ink)}
.mls-pill.mls-pro{background:var(--mls-pro-bg);border-color:var(--mls-pro);color:var(--mls-pro-ink)}
.mls-pill.mls-mas{background:var(--mls-mas-bg);border-color:var(--mls-mas);color:var(--mls-mas-ink)}
.mls-bar{position:relative;height:10px;border-radius:999px;background:var(--mls-track)}
.mls-bar i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--mls-acc);transition:width .6s ease}
.mls-bar em{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink);opacity:.8}
.mls-ticks{position:relative;height:16px;font:400 11px "DM Sans",Arial,sans-serif;color:var(--muted)}
.mls-ticks span{position:absolute;white-space:nowrap}
.mls-ticks span[style*="50%"],.mls-ticks span[style*="80%"]{transform:translateX(-50%)}
.mls-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;text-align:center}
.mls-stats div{background:var(--surface-raised);border-radius:10px;padding:8px 4px;display:grid}
.mls-stats b{font:700 17px "DM Sans",Arial,sans-serif;color:var(--ink)}
.mls-stats span{font:400 11px "DM Sans",Arial,sans-serif;color:var(--muted)}
.mls-how{margin:0;font:400 12px/1.5 "DM Sans",Arial,sans-serif;color:var(--muted)}
.mls-mini{display:flex;align-items:center;gap:8px;margin:2px 0 10px;width:100%;max-width:320px}
.mls-minibar{flex:1;height:6px;border-radius:999px;background:var(--mls-track);position:relative;min-width:40px}
.mls-minibar i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--mls-acc)}
.mls-mini b{font:700 13px "DM Sans",Arial,sans-serif;color:var(--ink);min-width:24px;text-align:right}
.mls-toast{margin:0 0 10px;justify-self:start;display:inline-block;border-radius:999px;padding:4px 12px;font:700 13px "DM Sans",Arial,sans-serif;background:var(--mls-acc-bg);color:var(--mls-acc-ink);border:1px solid var(--mls-acc);transition:opacity .5s ease}
.mls-toast.down{background:transparent;color:var(--mls-down);border-color:var(--mls-down)}
.mls-toast.same{background:transparent;color:var(--muted);border-color:var(--line)}
.mls-toast.out{opacity:0}
@media (max-width:420px){.mls-top{gap:14px}.mls-ticks{font-size:10px}}
@media (prefers-reduced-motion:reduce){.mls-ring .mls-fill,.mls-bar i,.mls-toast{transition:none}}
@media print{.mls-panel,.mls-toast,.mls-mini{display:none!important}}
