:root { color-scheme: light; --bg:#f1f5f9; --card:#fff; --fg:#17243a; --muted:#526179; --border:#cbd5e1; --accent:#1654b6; }
:root[data-theme=dark] { color-scheme:dark; --bg:#0b1220; --card:#142035; --fg:#edf4ff; --muted:#afbdd2; --border:#364964; --accent:#96bfff; }
@media(prefers-color-scheme:dark) {
    :root:not([data-theme]) { color-scheme:dark; --bg:#0b1220; --card:#142035; --fg:#edf4ff; --muted:#afbdd2; --border:#364964; --accent:#96bfff; }
}
* {box-sizing:border-box}
body {margin:0;background:var(--bg);color:var(--fg);font:1rem/1.6 system-ui,sans-serif}
header {display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem max(1rem,calc((100% - 56rem)/2));background:var(--card);border-bottom:1px solid var(--border)}
a {color:var(--accent);text-decoration:none;white-space:nowrap}
main {max-width:56rem;margin:auto;padding:2rem 1rem}
h1 {font-size:clamp(2rem,6vw,3.25rem);line-height:1.15;margin:0 0 1.5rem}
h2 {font-size:1.2rem;margin:0 0 .8rem}
.card {background:var(--card);border:1px solid var(--border);border-radius:1.15rem;padding:clamp(1rem,4vw,2rem);margin-bottom:1rem}
.address,.entry,.score {display:flex;align-items:center;gap:.65rem;flex-wrap:wrap}
output {font:700 clamp(1.1rem,4vw,2rem) ui-monospace,monospace;overflow-wrap:anywhere;min-width:0}
input,button,select {font:inherit;border-radius:.6rem;padding:.45rem .65rem;border:1px solid var(--border);background:var(--card);color:var(--fg)}
input {flex:1;min-width:min(12rem,100%)}
button {cursor:pointer;border-color:var(--accent);color:var(--accent);font-weight:650}
button:disabled {opacity:.6;cursor:wait}
:focus-visible {outline:2px solid var(--accent);outline-offset:3px}
p {color:var(--muted);margin:.8rem 0 0}
.score strong {font-size:2.4rem;color:var(--accent)}
dl {display:grid;grid-template-columns:minmax(6rem,1fr) 2fr;gap:.4rem 1rem}
dd {margin:0;overflow-wrap:anywhere}