
:root{--bg:#F4F4F1;--surface:#FFFFFF;--ink:#111113;--muted:#55555F;--line:#111113;--soft:#E2E2DC;--accent:#C8F031;--on-accent:#111113;--shadow:4px 4px 0 #111113;--field:#FFFFFF;--danger:#B42318;--danger-bg:#FFE4DF;--wait-bg:#FFE8B0;--wait-ink:#6B4100;--live-bg:#DDF5C8;--live-ink:#1D5410;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--bg:#0E0E11;--surface:#18181D;--ink:#F3F3EF;--muted:#A6A6B0;--line:#3A3A44;--soft:#2A2A32;--shadow:4px 4px 0 #000000;--field:#0E0E11;--danger:#FF8A7A;--danger-bg:#3A1410;--wait-bg:#3D2C06;--wait-ink:#FFD36B;--live-bg:#203D12;--live-ink:#BDF294}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.5;-webkit-text-size-adjust:100%}
a{color:inherit;text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{text-decoration-color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
code{font-family:var(--mono);font-size:.9em;overflow-wrap:anywhere}
.muted{color:var(--muted)}

header.top{background:var(--surface);border-bottom:2px solid var(--line)}
.top-inner{max-width:70rem;margin:0 auto;padding:.75rem 1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.05rem;text-decoration:none;margin-right:auto}
.mark{width:2rem;height:2rem;flex:none;border-radius:.55rem;background:var(--accent);border:2px solid var(--line);color:#111113;display:grid;place-items:center}
nav.main{display:flex;flex-wrap:wrap;gap:.25rem}
nav.main a{font-weight:700;padding:.6rem 1rem;min-height:2.75rem;display:inline-flex;align-items:center;border-radius:.6rem;text-decoration:none}
nav.main a:hover{background:var(--soft)}
nav.main a[aria-current=page]{background:var(--ink);color:var(--bg)}
.who{font-size:.875rem;color:var(--muted);overflow-wrap:anywhere}

main{max-width:70rem;margin:0 auto;padding:2.5rem 1.5rem 4rem;display:flex;flex-direction:column;gap:1.75rem}
h1{margin:0;font-size:clamp(2.25rem,5vw,3.25rem);font-weight:900;letter-spacing:-.03em;line-height:1;overflow-wrap:anywhere}
h2{margin:0;font-size:1.375rem;font-weight:800;letter-spacing:-.01em}
p{margin:0}
.page-head{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}
.page-head h1{margin-right:auto}
.stack{display:flex;flex-direction:column;gap:.75rem}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem}
.back{font-size:.875rem;font-weight:700;color:var(--muted);text-decoration:none}
.live-url{font-family:var(--mono);font-weight:600;text-decoration-color:var(--accent);text-decoration-thickness:3px;overflow-wrap:anywhere}

.pill{display:inline-flex;align-items:center;font-size:.875rem;font-weight:700;padding:.3rem .75rem;border-radius:999px;border:2px solid var(--line);white-space:nowrap}
.badge{display:inline-flex;align-items:center;font-size:.8rem;font-weight:800;padding:.2rem .65rem;border-radius:999px;background:var(--soft);white-space:nowrap}
.badge strong{font-weight:inherit}
.badge.accent{background:var(--accent);color:var(--on-accent)}
.badge.wait{background:var(--wait-bg);color:var(--wait-ink)}
.badge.live{background:var(--live-bg);color:var(--live-ink)}
.badge.bad{background:var(--danger-bg);color:var(--danger)}
.chip{display:inline-flex;font-size:.8rem;font-weight:600;padding:.2rem .6rem;border-radius:.5rem;background:var(--soft)}

.card{background:var(--surface);border:2px solid var(--line);border-radius:1.25rem;padding:1.25rem;display:flex;flex-direction:column;gap:1rem;min-width:0}
.card.flush{padding:0;gap:0;overflow:hidden}
.card.flush>h2,.card.flush>p{padding:1.25rem 1.25rem .5rem}
.card.flush details>p{padding:0 1.25rem 1.25rem}
.empty{border:2px dashed var(--line);border-radius:1.25rem;padding:1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}
.empty strong{font-size:1.05rem}

.sites{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr));gap:1.25rem}
.site{position:relative;background:var(--surface);border:2px solid var(--line);border-radius:1.25rem;box-shadow:var(--shadow);padding:1.5rem;display:flex;flex-direction:column;gap:1rem;min-width:0;transition:transform .12s,box-shadow .12s}
.site:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--line)}
.site-name{display:flex;align-items:center;gap:.75rem}
.site-name a{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;text-decoration:none;margin-right:auto;overflow-wrap:anywhere}
.site-name a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.site-urls{position:relative;z-index:1;font-family:var(--mono);font-size:.875rem;color:var(--muted);overflow-wrap:anywhere}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}

nav.sections{display:flex;flex-wrap:wrap;gap:.5rem}
nav.sections a{font-size:.875rem;font-weight:700;padding:.55rem 1rem;min-height:2.75rem;display:inline-flex;align-items:center;border-radius:999px;border:2px solid var(--line);background:var(--surface);text-decoration:none}
nav.sections a:hover{background:var(--accent);color:var(--on-accent)}

.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%}
.table-wrap table{min-width:34rem}
th{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;text-align:left;padding:.6rem 1.25rem;border-bottom:2px solid var(--soft);white-space:nowrap}
td{padding:.75rem 1.25rem;border-bottom:1px solid var(--soft);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
td code{font-size:.875rem}

details>summary{padding:1.25rem;cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .75rem}
details>summary::-webkit-details-marker{display:none}
details>summary::before{content:"+";font-weight:900;font-size:1.25rem;width:1rem}
details[open]>summary::before{content:"\2212"}
details>summary h2{display:inline}

.banner{display:flex;gap:.75rem;align-items:center;padding:.85rem 1rem;border-radius:.9rem;font-weight:700}
.banner svg{flex:none}
.banner.ok{background:var(--accent);color:var(--on-accent)}
.banner.warn{background:var(--wait-bg);color:var(--wait-ink)}
.error{background:var(--danger-bg);color:var(--danger);border:2px solid var(--danger);padding:.85rem 1rem;border-radius:.9rem;font-weight:600}
.error a{color:inherit}
.notice{background:var(--surface);color:var(--ink);border:2px solid var(--line);padding:.85rem 1rem;border-radius:.9rem;font-weight:600}
.check{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem}

.rules{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}
.rule{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.25rem .5rem;padding:.3rem .3rem .3rem .9rem;border-radius:1.4rem;border:2px solid var(--line);font-weight:700;font-size:.875rem;max-width:100%}
.rule .muted{font-weight:500}
.rule form{display:inline}
.rule button{min-height:2rem;padding:.2rem .8rem;border-radius:999px;border:0;background:var(--soft);color:var(--ink);font-weight:700;font-size:.8rem}
.rule button:hover{background:var(--danger);color:var(--bg)}

.forms{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1.25rem}
form.field{display:flex;flex-direction:column;gap:.5rem;min-width:0}
form.field>label,.label{font-weight:700}
.inputs{display:flex;flex-wrap:wrap;gap:.5rem}
.inputs input,.inputs select{flex:1 1 10rem;min-width:0}
.hint{font-size:.8rem;color:var(--muted)}
form.inline{display:inline-flex;flex-wrap:wrap;gap:.5rem;align-items:center}

input,select,button{font:inherit;color:inherit}
input[type=text],input[type=password],select{min-height:2.75rem;padding:.55rem .85rem;border-radius:.75rem;border:2px solid var(--line);background:var(--field);color:var(--ink)}
select{padding-right:2rem}
input::placeholder{color:var(--muted)}
button{min-height:2.75rem;padding:.55rem 1.1rem;border-radius:.75rem;border:2px solid var(--line);background:var(--ink);color:var(--bg);font-weight:800;cursor:pointer}
button:hover{background:var(--accent);color:var(--on-accent);border-color:var(--line)}
button.ghost{background:transparent;color:var(--ink)}
button.ghost:hover{background:var(--accent);color:var(--on-accent)}
button.primary{background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow)}
button.primary:hover{transform:translate(-1px,-1px)}

.versions{display:flex;flex-direction:column}
.version{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;padding:.75rem 0;border-top:1px solid var(--soft)}
.version .num{font-weight:900;font-size:1.25rem;min-width:3rem}
.version .what{flex:1 1 14rem;min-width:0}
.version .when{font-size:.875rem;color:var(--muted)}
.version .act{min-width:6.5rem;display:flex;justify-content:flex-end}

.danger{border:2px solid var(--danger);background:var(--danger-bg);border-radius:1.25rem;padding:1.25rem;display:flex;flex-direction:column;gap:.75rem}
.danger h2{color:var(--danger)}
.danger input[type=text]{border-color:var(--danger);flex:0 1 18rem}
.danger button{background:var(--danger);border-color:var(--danger);color:var(--bg)}
.danger button:hover{background:var(--ink);border-color:var(--ink)}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1.25rem}
.stat{background:var(--surface);border:2px solid var(--line);border-radius:1.25rem;padding:1.25rem;display:flex;flex-direction:column;gap:.6rem}
.stat .big{font-size:2rem;font-weight:900;letter-spacing:-.02em;line-height:1.1}
progress{appearance:none;-webkit-appearance:none;width:100%;height:.75rem;border:2px solid var(--line);border-radius:999px;background:var(--soft);overflow:hidden}
progress::-webkit-progress-bar{background:var(--soft)}
progress::-webkit-progress-value{background:var(--accent)}
progress::-moz-progress-bar{background:var(--accent)}

.claims{display:grid;gap:1.25rem}
.records td:first-child{font-weight:800;width:5rem}

@media (max-width:40rem){
  .top-inner{padding:.75rem 1rem}
  main{padding:1.75rem 1rem 3rem;gap:1.25rem}
  nav.main{width:100%}
  nav.main a{flex:1;justify-content:center}
  .who{font-size:.8rem}
  td,th{padding-left:1rem;padding-right:1rem}
}

main.login{max-width:28rem;padding-top:3rem}
.login .brand{margin:0 auto 0 0}
.login h1{font-size:clamp(2rem,6vw,2.5rem)}
.login .card{gap:1.25rem}
.login form{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.login form>label{font-weight:700}
.login input[type=email],.login input[type=text]{width:100%;min-height:2.75rem;padding:.55rem .85rem;border-radius:.75rem;border:2px solid var(--line);background:var(--field);color:var(--ink)}
.login .code{font-family:var(--mono);font-size:1.25rem;letter-spacing:.3em}
.login button{width:100%}
.login button.primary{font-size:1.0625rem;min-height:3.25rem;border-radius:.9rem}
.or{display:flex;align-items:center;gap:.75rem;color:var(--muted);font-size:.875rem;font-weight:700}
.or::before,.or::after{content:"";flex:1;border-top:1px solid var(--soft)}
.links{display:flex;flex-wrap:wrap;gap:.5rem 1rem;font-size:.875rem}
