:root{--blue:#0F85DB;--green:#3CC261;--paper:#F2EEE2;--ink:#18222d;--mute:#5b6773;--card:#fff;--line:#ddd6c3}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#10181f;--ink:#eef2f5;--mute:#9fb0be;--card:#18232d;--line:#2b3a47}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 Montserrat,system-ui,sans-serif}
main{max-width:920px;margin:0 auto;padding:20px 16px 90px}
h1{font-size:1.6rem;margin:.2em 0}h2{font-size:1.2rem;margin:1.2em 0 .4em}
.sub{color:var(--mute);margin:0 0 14px}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0;font-size:.85rem}
.crumbs button{background:none;border:0;color:var(--blue);cursor:pointer;font:inherit;padding:2px 0;text-decoration:underline}
.crumbs span.cur{font-weight:700}.crumbs i{color:var(--mute);font-style:normal}
input[type=search]{width:100%;padding:12px 14px;border:2px solid var(--line);border-radius:10px;font:inherit;background:var(--card);color:var(--ink)}
input[type=search]:focus{outline:none;border-color:var(--blue)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.chip{border:1.5px solid var(--blue);background:var(--card);color:var(--blue);border-radius:99px;padding:6px 12px;font:600 .8rem Montserrat,sans-serif;cursor:pointer}
.chip.on{background:var(--blue);color:#fff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:10px}
.card{background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:14px;text-align:left;cursor:pointer;color:var(--ink);font:inherit;display:block;width:100%}
.card:hover,.card:focus-visible{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px #0f85db33}
.card b{display:block}.card small{color:var(--mute);display:block;margin-top:4px}
.tag{display:inline-block;font-size:.7rem;font-weight:700;border-radius:99px;padding:1px 8px;margin-top:6px;background:#3cc26126;color:#1f7a39}
.tag.grow{background:#0f85db22;color:var(--blue)}
.ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:10px 0}
.step{background:var(--card);border:2px solid var(--line);border-radius:12px;padding:12px;cursor:pointer;text-align:left;font:inherit;color:var(--ink)}
.step.here{border-color:var(--blue)}.step.b{border-color:var(--green)}
.step em{font-style:normal;font-size:.75rem;font-weight:700;color:var(--mute)}
.pts{background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:6px 18px}
table{border-collapse:collapse;width:100%;background:var(--card);border-radius:12px;overflow:hidden;font-size:.85rem}
th,td{padding:8px;border-bottom:1px solid var(--line);text-align:center}th:first-child,td:first-child{text-align:left}
th.here,td.here{background:#0f85db18}
td b{display:inline-block;min-width:1.6em;border-radius:6px;padding:1px 4px}
td b.R,td b.D{background:var(--blue);color:#fff}td b.A{background:var(--green);color:#10341a}
td b.S{background:#ddd}td b.I{color:var(--mute);font-weight:400}
.cta{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:12px 16px;display:flex;justify-content:center}
.cta button{background:var(--blue);color:#fff;border:0;border-radius:10px;font:700 1rem Montserrat,sans-serif;padding:12px 28px;cursor:pointer}
.note{font-size:.78rem;color:var(--mute);margin-top:18px}
.hide{display:none}
@media (max-width:480px){main{padding-top:12px}}