:root{font-family:Arial,Helvetica,sans-serif;color:#fff;background:#0d172b;font-synthesis:none;text-rendering:optimizeLegibility;--page: #0d172b;--row: #45466f;--green: #00be8b;--orange: #fc7938;--pink: #f00088;--guess-face: .3s;--recent-guess: 10s}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:var(--page)}body{margin:0;min-width:320px;min-height:100vh;background:var(--page)}button,a{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #ffffff;outline-offset:3px}.control-shell{min-height:100vh}.control-shell .game-page{min-height:0}.streamer-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;padding:12px 20px;border-bottom:1px solid #2b3750;background:#101b31}.streamer-toolbar strong{display:block;margin-top:2px}.toolbar-label{display:block;color:#8e9bb1;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.overlay-url{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:min(100%,420px);flex:1}.overlay-url code{overflow:hidden;max-width:100%;padding:6px 8px;border-radius:6px;color:#d5def0;background:#1a2740;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.overlay-url button,.sign-out-button{padding:7px 11px;border:1px solid #394762;border-radius:8px;color:#fff;background:#202d46;font-size:13px;font-weight:700;cursor:pointer}.overlay-url button:hover,.sign-out-button:hover{background:#2a3956}.toolbar-error{margin:12px 20px 0}.auth-panel{width:min(420px,100%);margin:12vh auto 0;padding:28px;border:1px solid #343f58;border-radius:14px;background:#141f34;text-align:center}.auth-panel p{color:#c0c8d7;font-size:15px;line-height:1.55}.game-page{min-height:100vh;padding:16px 20px 72px;background:var(--page)}.game-column{width:min(520px,100%);margin:0 auto}.game-header{display:flex;justify-content:center}.brand{text-align:center}.brand h1{margin:0;font-size:20px;font-weight:900;letter-spacing:-.02em;line-height:1}.brand strong{display:block;margin-top:4px;font-size:10px;letter-spacing:.04em}.game-stats{display:flex;justify-content:center;gap:25px;margin:10px 0 22px;font-size:14px;font-weight:600}.guess-list{display:grid;gap:6px;perspective:520px}.guess-row{transform-origin:50% 50%;animation:guess-face-in var(--guess-face) ease-out}.recent-list .guess-row{animation:guess-face-in var(--guess-face) ease-out,guess-face-out var(--guess-face) ease-in calc(var(--recent-guess) - var(--guess-face)) forwards}@keyframes guess-face-in{0%{opacity:0;transform:rotateX(-78deg)}to{opacity:1;transform:rotateX(0)}}@keyframes guess-face-out{0%{opacity:1;transform:rotateX(0)}to{opacity:0;transform:rotateX(78deg)}}.recent-list{margin-bottom:54px}.rank-pill{--fill: 0%;position:relative;display:flex;align-items:center;height:44px;overflow:hidden;border-radius:7px;background:var(--row);font-size:18px;font-variant-numeric:tabular-nums;isolation:isolate}.rank-pill:before{position:absolute;z-index:-2;top:0;right:0;bottom:0;left:0;background:var(--row);content:""}.rank-fill{position:absolute;z-index:-1;inset:0 auto 0 0;width:var(--fill);border-radius:inherit;background:var(--pink)}.rank-green .rank-fill{background:var(--green)}.rank-yellow .rank-fill{background:var(--orange)}.guess-owner,.guess-word,.guess-rank{position:absolute;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guess-word,.guess-rank{text-shadow:-1px -1px 0 #11182a,1px -1px 0 #11182a,-1px 1px 0 #11182a,1px 1px 0 #11182a}.guess-owner{left:10px;max-width:calc(50% - 80px);font-size:14px;font-weight:800}.guess-word{left:50%;max-width:42%;transform:translate(-50%);text-align:center}.guess-rank{right:10px;overflow:visible;max-width:none;text-align:right;text-overflow:clip}.start-round-button{display:block;width:100%;margin:0 0 28px;padding:13px 18px;border:1px solid #ffffff;border-radius:7px;color:#fff;background:#202d46;font-size:16px;font-weight:800;cursor:pointer}.start-round-button:hover:not(:disabled){background:#2c3b58}.start-round-button:disabled{opacity:.4;cursor:not-allowed}.empty-message{margin:64px 0;color:#9ca7bd;font-size:14px;text-align:center}.answer-banner,.error-banner{margin:0 0 20px;padding:13px 16px;border-radius:7px;text-align:center}.answer-banner{display:grid;gap:3px;border:1px solid rgba(0,190,139,.65);background:#00be8b24}.answer-banner span{color:#a9ead6;font-size:12px}.answer-banner strong{font-size:24px;text-transform:capitalize}.error-banner{border:1px solid rgba(240,0,136,.55);color:#ffd2eb;background:#f000881f;font-size:13px}.modal-backdrop{position:fixed;z-index:10;display:grid;place-items:center;top:0;right:0;bottom:0;left:0;padding:20px;background:#030812c2;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-panel{position:relative;width:min(420px,100%);padding:28px;border:1px solid #343f58;border-radius:14px;background:#141f34;box-shadow:0 22px 70px #0000008c}.modal-close{position:absolute;top:12px;right:14px;padding:0;border:0;color:#aeb7c8;background:transparent;font-size:26px;line-height:1;cursor:pointer}.modal-kicker{margin:0 0 4px;color:#8e9bb1;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.modal-panel h2{margin:0 0 18px;font-size:23px}.modal-panel p:not(.modal-kicker,.modal-error){color:#c0c8d7;font-size:14px;line-height:1.55}.modal-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.modal-actions button,.connect-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 13px;border:1px solid #394762;border-radius:8px;color:#fff;background:#202d46;font-weight:700;text-decoration:none;cursor:pointer}.modal-actions button:hover:not(:disabled),.connect-button:hover{background:#2a3956}.modal-actions button:disabled{opacity:.38;cursor:not-allowed}.modal-actions .danger-button{border-color:#f0008873;color:#ffc6e5;background:#f000881f}.status-row{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #2b3750;font-size:14px}.ready{color:#22d5a2}.offline{color:#8e9bb1}.connect-button{width:100%;margin-top:18px;background:#6441a5}.modal-error{color:#ff9bca;font-size:12px;overflow-wrap:anywhere}@media(prefers-reduced-motion:reduce){.guess-row,.recent-list .guess-row{animation:none}}@media(min-width:900px){.game-page{padding-top:12px}.game-column{width:400px}.brand{width:auto}.brand h1{font-size:19px}.brand strong{margin-top:3px;font-size:9px}.game-stats{gap:22px;margin:9px 0 18px;font-size:13px}.rank-pill{height:32px;border-radius:5px;font-size:14px}.guess-owner{font-size:11px}.guess-list{gap:5px}.recent-list{margin-bottom:40px}}@media(max-width:520px){.game-page{padding:14px 6vw 52px}.game-header{gap:7px}.guess-owner{font-size:12px}}
