:root { --ink:#1d2530; --muted:#5b6773; --line:#d9dee4; --accent:#0b5fa5; --ok:#1a7f4e; --warn:#b3541e; --bg:#f6f8fa; }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.5 system-ui, "Segoe UI", sans-serif; color:var(--ink); background:var(--bg); }
main { max-width:960px; margin:1.5rem auto; padding:0 1rem; }
.top { display:flex; justify-content:space-between; align-items:center; padding:.6rem 1rem; background:#fff; border-bottom:1px solid var(--line); }
.top .brand { font-weight:700; color:var(--ink); text-decoration:none; }
.top nav { display:flex; gap:1rem; align-items:center; }
a { color:var(--accent); }
.flash { max-width:960px; margin:1rem auto 0; padding:.5rem 1rem; background:#e7f2ec; border:1px solid var(--ok); border-radius:6px; }
.card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:1rem; margin-bottom:1rem; }
.cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1rem; }
table { border-collapse:collapse; width:100%; font-variant-numeric:tabular-nums; }
th, td { text-align:left; padding:.35rem .5rem; border-bottom:1px solid var(--line); }
th { color:var(--muted); font-weight:600; }
form.stack label { display:block; margin:.6rem 0 .2rem; color:var(--muted); }
input[type=text], input[type=email], input[type=password], input[type=url], select, textarea { width:100%; padding:.45rem; border:1px solid var(--line); border-radius:6px; font:inherit; }
button { padding:.45rem .9rem; border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:6px; cursor:pointer; font:inherit; }
button.quiet { background:#fff; color:var(--accent); }
button.linklike { background:none; border:none; color:var(--accent); padding:0; text-decoration:underline; }
form.inline { display:inline; }
.muted { color:var(--muted); }
.error { color:#a4262c; margin:.5rem 0; }
.arrow-up { color:var(--ok); } .arrow-down { color:#a4262c; } .arrow-flat { color:var(--muted); }
.grid-cell { display:inline-block; min-width:3.2rem; text-align:center; }
mark { background:#ffe9a8; }
.tag { display:inline-block; padding:0 .4rem; border:1px solid var(--line); border-radius:10px; font-size:.85em; color:var(--muted); }
.banner { background:#a4262c; color:#fff; padding:.6rem 1rem; }
.banner .linklike { color:#fff; text-decoration:underline; }
.pill { display:inline-block; padding:.1rem .5rem; border-radius:999px; font-size:.8rem; }
.pill.ok { background:#e7f2ec; color:var(--ok); }
.pill.warn { background:#f8e2c8; color:var(--warn); }
.plans .plan.recommended { outline:2px solid var(--accent); }
.plans .price { font-size:1.2rem; }
.meter { list-style:none; padding:0; display:flex; gap:1.5rem; }