:root{--bg:oklch(0.98 0.005 250);--surface:oklch(1 0 0);--ink:oklch(0.22 0.02 260);
--muted:oklch(0.5 0.02 260);--brand:oklch(0.62 0.17 250);--line:oklch(0.9 0.01 260);
--radius:clamp(10px,1.4vw,16px);--space:clamp(16px,3vw,40px);
--font-display:"Space Grotesk",ui-sans-serif,system-ui,sans-serif;
--font-body:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
--shadow:0 1px 2px oklch(0.2 0.02 260/.06),0 8px 30px oklch(0.2 0.02 260/.08)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);line-height:1.6}
.wrap{max-width:1120px;margin:0 auto;padding:var(--space)}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-0.02em;margin:0 0 .4em}
h1{font-size:clamp(1.8rem,4vw,2.6rem)}a{color:var(--brand);text-decoration:none}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space);box-shadow:var(--shadow)}
.grid{display:grid;gap:var(--space);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.stat{font-size:clamp(2rem,5vw,3rem);font-weight:700;font-family:var(--font-display)}
.muted{color:var(--muted)}.pill{display:inline-block;font-size:.75rem;padding:.2em .7em;border-radius:999px;
border:1px solid color-mix(in oklch,var(--brand) 40%,transparent);color:var(--brand)}
.nav{display:flex;justify-content:space-between;align-items:center;padding:1em var(--space);border-bottom:1px solid var(--line);gap:1em}
.btn{display:inline-flex;padding:.6em 1.2em;border-radius:999px;font-weight:600;background:var(--brand);color:#fff;border:0;cursor:pointer}
#login{max-width:360px;margin:calc(var(--space)*2) auto}.row{margin:.6em 0}
input{padding:.7em .9em;width:100%;border:1px solid var(--line);border-radius:10px;font:inherit}
.appgrid{display:grid;gap:1em;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-top:var(--space)}
.app{border:1px solid var(--line);border-radius:var(--radius);padding:1.1em;background:var(--surface);box-shadow:var(--shadow)}
.app h3{font-size:1.1rem;margin-bottom:.2em}.app .meta{font-size:.82rem;color:var(--muted);margin-bottom:.8em}
.app .nums{display:flex;gap:1.2em;margin:.6em 0}.app .nums b{font-family:var(--font-display);font-size:1.4rem;display:block}
.app .links a{font-size:.82rem;margin-right:1em}.warn{color:oklch(0.6 0.18 30)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:2.2em;height:2.2em;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;font-size:1.1rem;margin-left:auto}
.icon-btn:hover{border-color:var(--brand)}
:root[data-theme="dark"]{--bg:oklch(0.17 0.012 260);--surface:oklch(0.23 0.015 260);--ink:oklch(0.95 0.01 260);--muted:oklch(0.72 0.02 260);--brand:oklch(0.72 0.16 250);--line:oklch(0.33 0.015 260);--shadow:0 1px 2px oklch(0 0 0/.4),0 8px 30px oklch(0 0 0/.5)}