:root{--surface-1:#f5f4f0;--text-primary:#0b0b0b;--text-secondary:#52514e;--text-muted:#898781;--text-success:#0a7f0a;--text-warning:#a15c07;--text-danger:#b42318;--text-accent:#185fa5;--bg-accent:#e6f1fb;--border:rgba(11,11,11,.1);--border-strong:rgba(11,11,11,.25);--border-accent:#378add;--radius:8px;--bg:#fff}
@media (prefers-color-scheme:dark){:root{--surface-1:#1a1a19;--text-primary:#f0efec;--text-secondary:#c3c2b7;--text-success:#5cc75c;--text-warning:#fdb022;--text-danger:#f97066;--text-accent:#b5d4f4;--bg-accent:#0c447c;--border:rgba(255,255,255,.1);--border-strong:rgba(255,255,255,.25);--border-accent:#85b7eb;--bg:#121211}}
*{box-sizing:border-box}
body{margin:0 auto;max-width:900px;padding:16px;background:var(--bg);color:var(--text-primary);font-family:system-ui,sans-serif;line-height:1.5}
nav{display:flex;gap:16px;margin-bottom:16px;font-size:14px}
nav a{color:var(--text-secondary);text-decoration:none}
nav a:first-child{font-weight:600;color:var(--text-primary)}
h1{font-size:22px;font-weight:500;margin:0 0 4px}
.pieni{font-size:12px;color:var(--text-muted)}
.lahde{margin-top:24px}
.virhe{margin:12px 0;padding:12px;border:1px solid var(--text-danger);border-radius:var(--radius);color:var(--text-danger)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
button{font:inherit;background:transparent;color:var(--text-primary);border:0.5px solid var(--border-strong);border-radius:var(--radius);cursor:pointer}
.kortit{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:16px}
.kortti{display:block;background:var(--surface-1);border-radius:12px;padding:16px;color:inherit;text-decoration:none}
.kortti .iso{font-size:28px;font-weight:500;margin:4px 0}
.kortti .linkki{margin-top:12px;font-size:14px;color:var(--text-accent)}
.himmea{opacity:.6}
main>h1+div{margin-bottom:12px}