:root{color-scheme:dark;--bg:#131313;--panel:#1b1b1b;--line:#393932;--text:#f8f5e9;--muted:#b9b6aa;--accent:#e6f55c;--ink:#191c08}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 "Instrument Sans",system-ui,sans-serif}
button,input{font:inherit}
a{color:inherit;text-underline-offset:.25em}
a:hover{color:var(--accent)}
.bar{min-height:66px;padding:0 max(22px,calc((100% - 780px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.bar>a:last-child{font-size:.85rem;color:var(--muted)}
.brand{display:flex;gap:12px;align-items:center;color:var(--text);font-weight:900;letter-spacing:.12em;text-decoration:none}
.record{width:24px;height:24px;border-radius:50%;background:repeating-radial-gradient(circle,var(--accent) 0 1px,transparent 1.5px 4px);border:1px solid var(--accent)}
main{max-width:824px;margin:auto;padding:0 22px 60px}
.hero{padding:clamp(32px,8vw,76px) 0 28px}
.hello{color:var(--muted);margin:0 0 .6rem}
h1,h2,h3,p{margin:0}
h1{font-size:clamp(3.25rem,11vw,7.3rem);letter-spacing:-.075em;line-height:.88;font-weight:900}
h1 em{color:var(--accent);font-style:normal}
h2{font-size:1.25rem;letter-spacing:-.025em}
h3{font-size:1rem}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:clamp(16px,4vw,26px);margin:14px 0}
.section-head,.line,.row,.actions{display:flex;align-items:center;gap:10px}
.section-head,.row{justify-content:space-between}
.line{align-items:end;flex-wrap:wrap;margin-top:12px}
.line label{flex:1 1 160px;min-width:0}
label,.subtle,small,.empty{color:var(--muted);font-size:.86rem}
input:not([type=checkbox]){width:100%;display:block;margin-top:4px;color:var(--text);background:var(--bg);border:1px solid #656258;border-radius:9px;padding:9px 11px;min-height:44px}
button{cursor:pointer;color:var(--text);background:#272722;border:1px solid #666358;border-radius:9px;min-height:44px;padding:8px 12px;font-weight:650}
button:hover:not(:disabled){border-color:var(--accent)}
button:disabled{opacity:.47;cursor:default}
.primary,button[aria-pressed=true]{color:var(--ink);background:var(--accent);border-color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.subtle{margin-top:7px}
.rows{list-style:none;padding:0;margin:8px 0 0}
.row{border-bottom:1px solid var(--line);padding:10px 0;flex-wrap:wrap}
.row:last-child{border-bottom:0}
.track{flex:1 1 128px;min-width:0;overflow-wrap:anywhere}
.track small{display:block}
.actions{flex-wrap:wrap}
.votes{gap:5px;flex-wrap:nowrap}
.votes button{min-width:42px;font-size:1.15rem}
.score{min-width:2ch;text-align:center;font-variant-numeric:tabular-nums}
.moderation{flex-basis:100%}
.moderation button{font-size:.8rem}
.muted{opacity:.62}
.empty{padding:14px 0}
details{margin-top:14px}
summary{color:var(--accent);cursor:pointer;width:fit-content}
.share-group{margin-top:12px}
.share-group h3{color:var(--muted)}
#browser{border-top:1px solid var(--line);margin-top:14px;padding-top:14px}
#browser>.actions{margin-top:10px}
.selectable{justify-content:start;cursor:pointer}
.selectable input{width:20px;height:20px;accent-color:var(--accent)}
#notice{position:sticky;top:8px;z-index:2;background:var(--accent);color:var(--ink);padding:10px 14px;border-radius:10px}
#notice.error{background:#ffb6a8;color:#38110a}
#admin-tools .actions{margin-top:12px}
#callback{overflow-wrap:anywhere}
#print-card{display:none}
@media(max-width:430px){.line button{min-width:96px}.votes button{padding-inline:8px}.bar{min-height:58px}}
@media print{
  body{background:white;color:black}
  .bar,main{display:none}
  #print-card{display:block;text-align:center;padding:25mm 0}
  #print-card h1{font-size:32pt;letter-spacing:-.04em;margin:8mm 0}
  #qr svg{width:75mm;height:75mm}
  #join-url{font-size:13pt;overflow-wrap:anywhere}
}