:root{--bg: #0f172a;--panel: #111827;--card: #1f2937;--card-focus: #374151;--text: #e5e7eb;--accent: #60a5fa;--accent-weak: #93c5fd33}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,"Apple Color Emoji","Segoe UI Emoji"}.container{max-width:1096px;margin:0 auto;padding:16px;display:flex;flex-direction:column;min-height:100%;max-height:100%;gap:10px}.header{display:flex;align-items:center;justify-content:space-between;gap:12px}.header h1{font-size:1.25rem;margin:0}.clear{background:transparent;border:1px solid var(--accent);color:var(--text);padding:8px 12px;border-radius:8px;cursor:pointer}.clear:hover{background:var(--accent-weak)}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch}@media (min-width: 768px){.grid{grid-template-columns:repeat(6,minmax(0,1fr))}}.card{display:inline-flex;align-items:center;justify-content:center;padding:20px;border-radius:12px;border:1px solid #2b3443;background:var(--card);color:var(--text);font-weight:700;font-size:1.25rem;min-height:96px;cursor:pointer;outline:none}.card:hover{border-color:var(--accent)}.card.focused{background:var(--card-focus);box-shadow:0 0 0 3px var(--accent-weak)}.card.selected{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-weak)}.label{pointer-events:none}.footer{margin-top:auto;padding-top:12px;border-top:1px solid #253040;opacity:.9}.footer-select{padding:6px 10px;border-radius:8px;border:1px solid #2b3443;background:var(--panel);color:var(--text)}.footer-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.avatar-select{font-size:20px;line-height:1.2;padding:6px 12px}*{scrollbar-width:thin;scrollbar-color:#2b3443 #0b2433}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:#0b2433;border-radius:8px}*::-webkit-scrollbar-thumb{background:#2b3443;border-radius:8px;border:2px solid #0b2433}*::-webkit-scrollbar-thumb:hover{background:var(--accent)}select.footer-select::-webkit-scrollbar,select.avatar-select::-webkit-scrollbar{width:12px}select.footer-select::-webkit-scrollbar-thumb,select.avatar-select::-webkit-scrollbar-thumb{background:#3a485c}.join{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.join input[type=text],.join input:not([type]){padding:8px 10px;border-radius:8px;border:1px solid #2b3443;background:var(--panel);color:var(--text)}.join button{background:transparent;border:1px solid var(--accent);color:var(--text);padding:8px 12px;border-radius:8px;cursor:pointer}.avatar{border:1px solid #2b3443;background:var(--panel);color:var(--text);padding:6px 8px;border-radius:8px;line-height:1;cursor:pointer;position:relative}.avatar:hover{border-color:var(--accent)}.avatar:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.avatar.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-weak),0 0 0 6px #60a5fa22 inset}.avatar.selected:after{content:"✓";position:absolute;right:-6px;bottom:-6px;width:18px;height:18px;border-radius:999px;background:var(--accent);color:#0b2433;font-weight:900;font-size:12px;display:grid;place-items:center;border:2px solid #0b2433}.table-wrap{position:relative;height:700px;margin-top:12px;display:flex;align-items:center;justify-content:center;overflow:visible}.table{position:absolute;width:600px;height:360px;background:radial-gradient(ellipse at center,#0b6b4f,#0b3b2f 70%);border-radius:50%/40%;border:6px solid #2b3443;box-shadow:inset 0 0 60px #06251b}.donut{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.seat,.observer{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.seat.voted .avatar-bubble{box-shadow:0 0 0 3px var(--accent-weak)}.seat:not(.voted) .avatar-bubble:before{content:"";position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:999px;box-shadow:0 0 0 0 var(--accent-weak);animation:voted-pulse 2.4s ease-out infinite}.seat.voted .avatar-bubble:after{content:"✓";position:absolute;right:-4px;bottom:-4px;width:16px;height:16px;border-radius:999px;background:var(--accent);color:#0b2433;font-weight:900;font-size:12px;display:grid;place-items:center;border:2px solid #0b2433}.seat.highlight .avatar-bubble,.observer.highlight .avatar-bubble{box-shadow:0 0 0 3px #f59e0b88}.avatar-bubble{position:relative;width:48px;height:48px;border-radius:999px;background:#0b2433;border:2px solid #2b3443;display:grid;place-items:center;font-size:24px;cursor:pointer;-webkit-user-select:none;user-select:none;z-index:100}.avatar-bubble.small{width:36px;height:36px;font-size:18px;opacity:.8}.seat-name{font-size:12px;opacity:.9}.bubble{position:absolute;transform:translate(-50%,-50%);width:max-content;max-width:280px;background:#fff;color:#111827;border-radius:20px;padding:10px 12px;font-size:14px;line-height:1.3;filter:drop-shadow(2px 2px 0 #000) drop-shadow(-1px -1px 0 #000);z-index:200}.bubble .bubble-text{display:block;word-wrap:break-word;font-family:Lacquer,cursive;font-weight:400;font-style:normal}.bubble.speech:before,.bubble.speech:after,.bubble.thought:after{display:none}.bubble-tail{position:absolute;pointer-events:none;overflow:visible;z-index:201}.bubble.thought{border-radius:45%;padding:20px 26px}.pile{position:absolute;width:160px;height:160px;left:50%;top:50%;transform:translate(-50%,-50%);perspective:800px}.pile-card{position:absolute;left:50%;top:50%;width:64px;height:88px;transform-style:preserve-3d;transition:transform .4s ease}.card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;display:grid;place-items:center;border-radius:8px;border:1px solid #2b3443;font-weight:800}.card-back{background:#111827;color:#93c5fd}.card-front{background:#1f2937;color:var(--text);transform:rotateY(180deg)}.pile-card.highlight .card-face{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b55}.pile-card.returning{animation:return-to-seat .35s ease-in forwards}@keyframes return-to-seat{to{opacity:0;transform:translate(-50%,-50%) translate(var(--to-x),var(--to-y))}}.pile-card.arriving{animation:seat-to-vote .35s ease-out both}@keyframes seat-to-vote{0%{transform:translate(-50%,-50%) translate(var(--from-x),var(--from-y)) rotate(var(--from-rot, 0deg)) rotateY(var(--from-flip-deg, 0deg));opacity:.9}10%{opacity:1}}@keyframes voted-pulse{0%{box-shadow:0 0 0 0 var(--accent-weak)}70%{box-shadow:0 0 0 10px transparent}to{box-shadow:0 0 0 0 transparent}}.selector{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(72px,1fr);gap:8px}.selector .card{min-height:72px}.bubble-input{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;margin-top:10px}.bubble-input textarea{grid-column:1 / -1;width:100%;min-height:64px;padding:8px 10px;border-radius:8px;border:1px solid #2b3443;background:var(--panel);color:var(--text);resize:vertical}.bubble-actions{display:inline-flex;align-items:center;gap:8px}.char-count{opacity:.7;font-size:12px;margin-right:6px}.projectiles{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none;z-index:100}.projectile{position:absolute;width:32px;height:32px;display:grid;place-items:center;transform-origin:center;animation:projectile-hit-bounce 2s linear forwards}.projectile.emoji .emoji-glyph{font-size:28px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.3))}@keyframes projectile-hit-bounce{0%{transform:translate(-50%,-50%) translate(var(--x0),var(--y0)) rotate(var(--theta1)) scale(.5);opacity:0;animation-timing-function:ease-out}10%{opacity:1}30%{transform:translate(-50%,-50%) translate(var(--xm),var(--ym)) rotate(var(--theta1)) scale(1.1);animation-timing-function:ease-in}48%{transform:translate(-50%,-50%) translate(var(--x1),var(--y1)) rotate(var(--theta2)) scale(1)}50%{transform:translate(-50%,-50%) translate(var(--x1),var(--y1)) rotate(var(--theta2)) scale(1.4,.6);opacity:1;animation-timing-function:ease-out}70%{transform:translate(-50%,-50%) translate(calc(var(--x1) + (var(--x0) - var(--x1)) * .25),calc(var(--y1) - 180px + (var(--y0) * .4))) rotate(calc(var(--theta2) + var(--fallRot))) scale(1);animation-timing-function:cubic-bezier(.75,.05,.85,.05)}to{transform:translate(-50%,-50%) translate(calc(var(--x1) + (var(--x0) - var(--x1)) * .3 + (var(--fallRot) * .5px)),calc(var(--y1) + 400px)) rotate(calc(var(--theta2) + (var(--fallRot) * 8))) scale(.8);opacity:0}}