@font-face{font-family:"Antarctican Headline";src:url("/fonts/antarctican-book.otf") format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:"Antarctican Headline";src:url("/fonts/antarctican-medium.otf") format("opentype");font-weight:500;font-display:swap}
@font-face{font-family:"Antarctican Headline";src:url("/fonts/antarctican-black.otf") format("opentype");font-weight:900;font-display:swap}

:root{
  --ink:#313131; --ink-2:#5a5a5a; --paper:#f6f6f6; --card:#ffffff; --line:#e0ddd8;
  --yellow:#ffb45a; --yellow-dark:#bf752b; --red:#e62a30; --green:#5f8485; --green-dark:#4a6a6b;
  --head:"Antarctican Headline",Impact,"Arial Narrow",sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 var(--body)}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin-inline:auto;padding-inline:max(16px,env(safe-area-inset-left))}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.masthead{background:var(--ink);color:var(--paper);padding-block:calc(28px + env(safe-area-inset-top)) 40px}
.logo{display:block;width:max-content;margin-inline:auto}
.logo img{width:132px;height:auto}
h1{font:900 clamp(44px,9vw,96px)/.92 var(--head);text-transform:uppercase;color:var(--yellow);margin:22px 0 14px;letter-spacing:.005em}
.lede{max-width:60ch;margin:0 0 26px;font-size:17px;color:#dcdcdc}
.checker{display:flex;flex-wrap:wrap;gap:10px}
.checker input{flex:1 1 380px;min-width:0;font:15px/1.2 var(--mono);padding:15px 16px;border-radius:6px;border:2px solid transparent;background:var(--paper);color:var(--ink)}
.checker input:focus{outline:none;border-color:var(--yellow)}
.btn{font:500 18px/1 var(--head);text-transform:uppercase;letter-spacing:.04em;padding:15px 24px;border-radius:6px;border:2px solid var(--yellow);cursor:pointer}
.btn.primary{background:var(--yellow);color:var(--ink)}
.btn.primary:hover{background:#ffc47a}
.btn.ghost{background:transparent;color:var(--yellow)}
.btn.ghost:hover{background:rgba(255,180,90,.12)}
.btn:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.hint{margin:12px 0 0;font-size:13.5px;color:#a9a9a9;max-width:70ch}

main{padding-block:32px 56px;min-height:30vh}
.status{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:18px}
.status .count{font:900 clamp(30px,5vw,48px)/1 var(--head);text-transform:uppercase}
.status .count b{color:var(--red);font-weight:900}
.status .who{font:13.5px var(--mono);color:var(--ink-2);overflow-wrap:anywhere}
.status .share{font-size:14px;color:var(--green-dark);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-family:var(--body)}
.status.error .count{color:var(--red)}

.notes{display:grid;gap:10px;margin-bottom:22px}
.note{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--green);border-radius:6px;padding:12px 16px;max-width:80ch}
.note.warn{border-left-color:var(--yellow-dark)}
.note strong{display:block;font:500 17px/1.2 var(--head);text-transform:uppercase;letter-spacing:.03em;margin-bottom:3px}
.note p{margin:0;font-size:15px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.card{background:var(--card);border-radius:8px;overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column}
.card img{width:100%;height:auto;aspect-ratio:1;background:#8c8c8c}
.card .body{padding:12px 14px 14px;display:grid;gap:3px}
.card h3{font:500 21px/1.1 var(--head);margin:0;text-transform:uppercase;letter-spacing:.02em;overflow-wrap:anywhere}
.card .ids{margin:0;font:12.5px var(--mono);color:var(--ink-2)}
.card .fam{margin:0;font-size:14px;color:var(--ink-2)}
.card .tag{display:inline-block;font:600 11px/1 var(--body);letter-spacing:.04em;text-transform:uppercase;padding:4px 7px;border-radius:99px;margin-top:4px;justify-self:start}
.tag.stolen{background:#fde3e3;color:#a3161b}
.tag.volt{background:#e2ecec;color:#3d5a5b}
details{margin-top:6px;font-size:14px}
summary{cursor:pointer;color:var(--green-dark);font-weight:600}
dl{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:8px 0 0}
dt{color:var(--ink-2)} dd{margin:0}

.placeholder{position:relative;padding-block:8px 24px}
.ph-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.ph-card{background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden;display:grid;gap:8px;padding-bottom:14px}
.ph-card img{width:100%;height:auto;aspect-ratio:1;filter:grayscale(1);opacity:.28}
.ph-card i{display:block;height:10px;margin-inline:14px;border-radius:5px;background:#ebe8e3}
.ph-card i:first-of-type{width:70%;height:14px}
.ph-card i:last-of-type{width:45%}
.ph-msg{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:16px;
  background:radial-gradient(closest-side,rgba(246,246,246,.96),rgba(246,246,246,.75) 60%,rgba(246,246,246,0))}
.ph-msg p{margin:0;color:var(--ink-2)}
.ph-title{font:900 clamp(28px,4.4vw,44px)/1 var(--head)!important;text-transform:uppercase;color:var(--ink)!important;margin-bottom:8px!important}

@media (max-width:720px){.ph-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ph-card:nth-child(n+5){display:none}.btn{flex:1 1 auto}.grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.card h3{font-size:18px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
