:root { --bg:#fbfcfe; --fg:#1a1c1e; --muted:#5d6166; --line:#dde1e6; --accent:#1f6f5c; --card:#fff; }
@media (prefers-color-scheme: dark) { :root { --bg:#111416; --fg:#e2e3e5; --muted:#a3a8ad; --line:#2c3135; --accent:#7fd8bf; --card:#1a1d20; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:15px/1.5 system-ui, sans-serif; }
header { display:flex; align-items:center; justify-content:space-between; padding:16px 24px; border-bottom:1px solid var(--line); }
h1 { font-size:20px; margin:0; } h2 { font-size:17px; margin:24px 0 8px; } h3 { font-size:14px; color:var(--muted); }
main { max-width:1000px; margin:0 auto; padding:16px 24px 48px; }
nav { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
a { color:var(--accent); } a[aria-current=page] { font-weight:700; text-decoration:none; }
.total { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px 20px; }
.big { font-size:32px; font-weight:700; margin:0 0 4px; }
table { width:100%; border-collapse:collapse; background:var(--card); }
th, td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
td.num { text-align:right; white-space:nowrap; }
.msgs { list-style:none; padding:0; } .msgs li { padding:4px 0; border-bottom:1px solid var(--line); }
time { color:var(--muted); font-variant-numeric:tabular-nums; margin-right:8px; }
.login { display:grid; gap:12px; max-width:320px; } .login input { width:100%; padding:8px; }
button { padding:8px 14px; border-radius:20px; border:1px solid var(--line); background:var(--card); color:var(--fg); cursor:pointer; }
.err { color:#b3261e; } .empty { color:var(--muted); }