:root{
  --bg:#f4f5f7;--card:#ffffff;--text:#1a1c20;--muted:#5f6670;--line:#e3e6ea;--stripe:#f8f9fb;
  --accent:#c8102e;--accent-text:#ffffff;--ok-bg:#e7f6ec;--ok-text:#1b5e2f;--warn-bg:#fff4e0;--warn-text:#7a4b00;
  --focus:#2f6fed;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#121417;--card:#1b1e23;--text:#e8eaed;--muted:#9aa2ad;--line:#2b3037;--stripe:#20242a;
    --ok-bg:#16301f;--ok-text:#9bd7ac;--warn-bg:#3a2a0f;--warn-text:#f2c97b;}
}
*{box-sizing:border-box}
html{color-scheme:light dark}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
main{margin:0 auto;padding:32px 16px 48px}
main.narrow{max-width:420px;padding-top:12vh}
main.wide{max-width:760px}
h1{font-size:22px;margin:0 0 4px;letter-spacing:-.01em}
h2{font-size:16px;margin:0}
.muted{color:var(--muted);margin:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.login{padding:28px}
.login h1{margin-bottom:6px}
.login form{display:flex;flex-direction:column;gap:10px;margin-top:20px}
label{font-weight:600;font-size:13px}
input[type=password]{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text)}
input:focus-visible,button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
button{font:inherit;font-weight:600;padding:10px 14px;border-radius:8px;border:1px solid transparent;background:var(--accent);color:var(--accent-text);cursor:pointer}
button.secondary{background:var(--card);color:var(--text);border-color:var(--line);padding:8px 12px}
button[disabled]{opacity:.5;cursor:not-allowed}
.error{color:var(--accent);margin:0;font-size:14px}
.bar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.notice{padding:10px 14px;border-radius:8px;margin:0 0 16px;font-size:14px}
.notice.warn{background:var(--warn-bg);color:var(--warn-text)}
.card-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 18px;border-bottom:1px solid var(--line)}
th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);position:sticky;top:0;background:var(--card)}
tbody tr:nth-child(even){background:var(--stripe)}
tbody tr:last-child td{border-bottom:0}
th.num,td.num{text-align:right;font-variant-numeric:tabular-nums;width:110px;white-space:nowrap}
th.rank,td.rank{width:48px;padding-right:0;color:var(--muted)}
td.id{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;width:140px;color:var(--muted)}
@media (max-width:480px){main{padding-top:20px}th,td{padding:9px 12px}td.id{width:100px}}
button.toggle{background:none;border:0;color:var(--muted);padding:0 6px 0 0;margin:0;font-size:12px;cursor:pointer;line-height:1;vertical-align:baseline}
tr.loc.open td{border-bottom:0}
tr.loc.open button.toggle{transform:rotate(90deg);display:inline-block}
tr.stations>td{padding:0 18px 14px 40px;background:var(--stripe)}
table.inner{width:100%;font-size:14px}
table.inner th{position:static;font-size:11px}
table.inner td{padding:6px 14px 6px 0;border-bottom:1px solid var(--line)}
table.inner tbody tr{background:transparent}
table.inner tbody tr:last-child td{border-bottom:0}
table.inner td.id{width:auto;padding-right:14px}
