:root{--ink:#17131c;--paper:#fffaf0;--pink:#ff5d73;--yellow:#ffd166;--blue:#75c9ff;--green:#74df9b;--purple:#b59cff;--muted:#756e7a;--shadow:5px 5px 0 var(--ink)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--paper)}
body{background-image:radial-gradient(#17131c18 1.3px,transparent 1.3px);background-size:20px 20px}.app{width:min(100%,520px);min-height:100vh;margin:auto;padding:18px 16px 32px}.splash{height:100vh;display:grid;place-content:center;text-align:center}.splash h1,.brand h1{font:32px 'Archivo Black';margin:10px 0}.logo-mark{display:grid;place-items:center;width:72px;height:72px;margin:auto;border:4px solid var(--ink);border-radius:22px;background:var(--pink);box-shadow:var(--shadow);font:44px 'Archivo Black';transform:rotate(-5deg)}
h1,h2,h3,p{margin-top:0}h2{font:25px 'Archivo Black';line-height:1.05}h3{font-size:15px;text-transform:uppercase}.brand{text-align:center;margin:24px 0 28px}.brand p{color:var(--muted);font-weight:700}.card{background:#fff;border:3px solid var(--ink);border-radius:18px;padding:18px;box-shadow:var(--shadow);margin-bottom:16px}.card.tint{background:#fff3c7}.card.pink{background:#ffd7dd}.card.blue{background:#dff3ff}.card.green{background:#dff9e7}.row{display:flex;gap:10px;align-items:center}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.grow{flex:1}.stack{display:grid;gap:12px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
button,input,select{font:inherit}button{cursor:pointer}.btn{border:3px solid var(--ink);border-radius:12px;padding:12px 14px;background:#fff;box-shadow:4px 4px 0 var(--ink);font-weight:900;text-transform:uppercase;letter-spacing:.02em;transition:.1s}.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--pink);color:#fff}.btn.yellow{background:var(--yellow)}.btn.green{background:var(--green)}.btn.blue{background:var(--blue)}.btn.dark{background:var(--ink);color:#fff}.btn.ghost{box-shadow:none;padding:8px 10px}.btn.danger{background:#ffccd4}.wide{width:100%}.small{font-size:12px;padding:8px 10px}
label{display:grid;gap:6px;font-size:12px;font-weight:900;text-transform:uppercase}input,select{width:100%;padding:12px;border:3px solid var(--ink);border-radius:10px;background:#fff;font-weight:700;outline:none}input:focus,select:focus{box-shadow:0 0 0 3px var(--yellow)}.tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:18px}.tabs button{border:0;border-bottom:4px solid #ddd;background:none;padding:10px;font-weight:900}.tabs button.active{border-color:var(--pink);color:#bd2942}.message{padding:10px;border:2px solid var(--ink);background:#ffd7dd;border-radius:10px;font-size:13px;font-weight:800}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.topbar .title{font:18px 'Archivo Black'}.badge{display:inline-flex;align-items:center;border:2px solid var(--ink);border-radius:99px;padding:5px 9px;background:var(--yellow);font-size:11px;font-weight:900}.muted{color:var(--muted);font-size:12px}.score{font:24px 'Archivo Black'}.player{display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center;padding:10px;border:2px solid var(--ink);border-radius:12px;background:#fff}.num{display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--ink);background:var(--yellow);border-radius:9px;font-weight:900}.inactive{opacity:.48;text-decoration:line-through}.game-list{display:grid;gap:10px}.game-item{cursor:pointer}.game-item:hover{background:#fff9dc}.hero{text-align:center;padding:30px 18px}.hero .avatar{display:grid;place-items:center;width:92px;height:92px;margin:0 auto 18px;border:4px solid var(--ink);border-radius:50%;background:var(--purple);box-shadow:var(--shadow);font:38px 'Archivo Black'}.secret{font:30px 'Archivo Black';text-transform:uppercase;overflow-wrap:anywhere}.role{font:22px 'Archivo Black';padding:8px;border:3px solid var(--ink);background:var(--green)}.role.impostor{background:var(--pink);color:#fff}.timer{display:grid;place-items:center;width:190px;height:190px;margin:22px auto;border:6px solid var(--ink);border-radius:50%;background:#fff;box-shadow:8px 8px 0 var(--ink);font:42px 'Archivo Black'}.timer.low{background:#ffd7dd}.order{counter-reset:item;display:grid;gap:8px}.order div{border:2px solid var(--ink);background:#fff;padding:9px;border-radius:9px;font-weight:800}.order div:before{counter-increment:item;content:counter(item) '. ';font-weight:900}.vote-target{width:100%;text-align:left}.result-row{display:grid;grid-template-columns:1fr 54px 54px;gap:8px;align-items:center;padding:9px;border-bottom:2px solid #eee}.points.pos{color:#11833b}.points.neg{color:#d12643}.ranking{width:100%;border-collapse:collapse;font-size:13px}.ranking th,.ranking td{text-align:left;padding:9px 5px;border-bottom:2px solid var(--ink)}.ranking th{font-size:10px;text-transform:uppercase}.ranking tr:first-child td{background:#fff1a8}.empty{text-align:center;padding:32px 10px;color:var(--muted)}.divider{height:3px;background:var(--ink);margin:15px 0}.language{width:auto;padding:6px 8px;font-size:12px}@media(max-width:380px){.grid2{grid-template-columns:1fr}.app{padding-inline:10px}.card{padding:14px}.btn{padding:11px 10px}}