:root{--red: #c8372d;--red-dark: #8e2018;--blue: #2a5fa8;--blue-dark: #1b3f72;--paper: #efe3c8;--paper-dark: #d9c8a3;--ink: #2a2118;--muted: #7a6a52;--table: #15110d;--gold: #d9a441;--neutral: #cdb48a;--assassin: #1c1c1c;--radius: 10px;--head: "Oswald", "Arial Narrow", system-ui, sans-serif;--type: "Special Elite", "Courier New", monospace}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:system-ui,Segoe UI,sans-serif;color:var(--paper);font-size:15px;background:radial-gradient(ellipse at center,#0000 30%,#000a),var(--bg-image, none) center / cover fixed,var(--table);-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}h1,h2,h3{font-family:var(--head);font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin:0 0 .5em}input{font:inherit;color:var(--ink);background:#fffaf0;border:2px solid var(--paper-dark);border-radius:8px;padding:10px 12px;outline:none;width:100%}input:focus{border-color:var(--gold)}.muted{color:var(--muted)}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.center{justify-content:center}.row.end{justify-content:flex-end}.paper{color:var(--ink);background:linear-gradient(170deg,#f6ecd5,var(--paper) 60%,#e6d6b2);border-radius:var(--radius);box-shadow:0 10px 30px #0009,inset 0 0 0 1px #fff6,inset 0 0 40px #b8996a33}.btn{font:600 14px var(--head);letter-spacing:.05em;text-transform:uppercase;cursor:pointer;color:var(--ink);background:linear-gradient(#fbf3e1,#e3d1aa);border:1px solid #b59b6c;border-radius:8px;padding:9px 14px;display:inline-flex;align-items:center;gap:6px;transition:transform .1s,box-shadow .15s,filter .15s;box-shadow:0 2px #9c8257}.btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.04)}.btn:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px #9c8257}.btn:disabled{opacity:.45;cursor:default}.btn.primary{color:#fff;background:linear-gradient(#d4473c,var(--red-dark));border-color:#6e1610;box-shadow:0 2px #5a120d}.btn.big{padding:12px 22px;font-size:16px}.icon-btn{background:#0006;border:1px solid #ffffff22;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;cursor:pointer;color:var(--paper);font-size:18px;padding:0}.icon-btn:hover{background:#0009}.icon-btn.off{opacity:.4;text-decoration:line-through}.mini-btn{background:none;border:none;cursor:pointer;padding:2px 4px;color:var(--muted);font-size:13px;border-radius:4px}.mini-btn:hover{background:#0001;color:var(--ink)}.mini-btn.text{color:var(--paper);text-decoration:underline}.ico{width:22px;height:22px;object-fit:contain;vertical-align:middle}.ico.small{width:18px;height:18px}.ico.tiny{width:14px;height:14px}.ico.big{width:64px;height:64px}.ico.emoji{display:inline-grid;place-items:center;font-size:15px;width:auto}.seg{display:flex;gap:6px}.seg.wrap{flex-wrap:wrap}.seg button{flex:1;font:600 13px var(--head);text-transform:uppercase;cursor:pointer;padding:8px 10px;border-radius:8px;border:1px solid #b59b6c;background:#fffaf0;color:var(--ink);display:inline-flex;gap:6px;align-items:center;justify-content:center}.seg button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}#toast{position:fixed;left:50%;top:18px;transform:translate(-50%);background:#1b1510f2;color:var(--paper);padding:9px 16px;border-radius:10px;z-index:100;border:1px solid var(--gold);font-size:14px;max-width:90vw}#toast.near{position:fixed}#modal{position:fixed;inset:0;background:#000a;display:grid;place-items:center;z-index:50;padding:16px}.dialog{padding:22px 24px;width:min(460px,100%);display:flex;flex-direction:column;gap:10px}.dialog label{display:flex;flex-direction:column;gap:4px;font:600 13px var(--head);text-transform:uppercase}.label{font:600 13px var(--head);text-transform:uppercase;margin-top:4px}.label small{text-transform:none;font-weight:400;color:var(--muted)}.home{max-width:1000px;margin:0 auto;padding:32px 16px 48px}.home-head{text-align:center;margin-bottom:24px}.emblem{width:150px;height:150px;object-fit:contain;filter:drop-shadow(0 8px 20px #000a);animation:float 6s ease-in-out infinite}@keyframes float{50%{transform:translateY(-6px) rotate(-1deg)}}.home-head h1{font-size:clamp(42px,8vw,72px);color:var(--paper);text-shadow:3px 3px 0 var(--red-dark),-3px -3px 0 var(--blue-dark);margin:6px 0}.tagline{font-family:var(--type);color:var(--paper-dark);margin:0}.home-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:20px}.panel{padding:22px;display:flex;flex-direction:column;gap:10px}.panel h2{font-size:16px;margin:6px 0 0}.hint{font-size:13px;color:var(--muted);margin:0}#join-form input{width:120px;text-transform:uppercase;letter-spacing:.3em;font-family:var(--head);text-align:center}#join-form{flex-wrap:nowrap}.room-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.room-item{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:10px 12px;background:#fff8;border:1px dashed #b59b6c;border-radius:8px;animation:slide .3s}.room-item small{display:block;color:var(--muted);font-family:var(--type)}.status{font:600 11px var(--head);text-transform:uppercase;padding:3px 8px;border-radius:20px;background:#2a7a3d22;color:#2a7a3d}.status.playing{background:#c8372d22;color:var(--red-dark)}.empty{color:var(--muted);font-family:var(--type);padding:20px 0;text-align:center;list-style:none}@keyframes slide{0%{opacity:0;transform:translateY(6px)}}.room{min-height:100vh;display:flex;flex-direction:column;padding:10px 14px 24px;gap:10px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.top-left,.top-actions{display:flex;align-items:center;gap:8px}.code-chip{font:700 20px var(--head);letter-spacing:.25em;color:var(--ink);background:var(--paper);border:none;border-radius:8px;padding:6px 12px;display:flex;align-items:center;gap:8px;cursor:pointer;box-shadow:0 3px #9c8257}.code-chip:hover{filter:brightness(1.05)}.room-name{font-family:var(--type);color:var(--paper-dark);display:inline-flex;align-items:center;gap:6px}.score{font:600 18px var(--head);text-transform:uppercase;background:#0008;padding:6px 16px;border-radius:30px;display:flex;gap:10px;align-items:center}.score b{font-size:22px}.red-text{color:#ff7a6e}.blue-text{color:#7fb2ff}.table{display:grid;grid-template-columns:220px 1fr 220px;gap:14px;align-items:start}.team{border-radius:var(--radius);padding:12px;color:#fff;box-shadow:0 10px 24px #0008;position:sticky;top:10px}.team.red{background:linear-gradient(160deg,#d24c40,var(--red-dark))}.team.blue{background:linear-gradient(160deg,#3f78c8,var(--blue-dark))}.team-head{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #fff4;padding-bottom:6px;margin-bottom:8px;transition:all .3s}.team-head h2{margin:0;font-size:20px}.team-head.active h2:after{content:" ◀ ход";font-size:11px;letter-spacing:.1em;animation:blink 1.2s infinite}.team.blue .team-head.active h2:after{content:" ход ▶"}@keyframes blink{50%{opacity:.3}}.left{font:700 30px var(--head);background:#0003;border-radius:10px;min-width:46px;text-align:center;padding:0 8px}.members{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:4px}.members li{display:flex;align-items:center;gap:6px;padding:4px 6px;border-radius:6px;background:#0002}.members li.me{background:#fff3}.members li.offline{opacity:.55}.members .pname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.members small.off{font-size:10px}.members .ctrls{display:flex}.members .mini-btn{color:#fffc}.seats{display:flex;flex-direction:column;gap:6px}.btn.seat{justify-content:center}.btn.pulse{animation:pulse 1.4s infinite}@keyframes pulse{50%{box-shadow:0 0 0 6px #fff5,0 2px #5a120d}}.center{display:flex;flex-direction:column;gap:10px;min-width:0}.status-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;text-align:center;background:#000b;border-radius:30px;padding:8px 16px;min-height:48px;border:2px solid #fff2;transition:border-color .3s}.status-bar.turn-red{border-color:var(--red)}.status-bar.turn-blue{border-color:var(--blue)}.clue-chip{font:700 18px var(--head);letter-spacing:.08em;padding:3px 14px;border-radius:6px;color:var(--ink);background:var(--paper);box-shadow:0 2px #9c8257;animation:pop .4s cubic-bezier(.3,1.6,.5,1)}.clue-chip.team-red{border-left:6px solid var(--red)}.clue-chip.team-blue{border-left:6px solid var(--blue)}@keyframes pop{0%{transform:scale(.6);opacity:0}}.timer{font:600 16px var(--head);background:var(--paper);color:var(--ink);padding:2px 10px;border-radius:20px;display:inline-flex;gap:4px;align-items:center}.timer.urgent{background:var(--red);color:#fff;animation:blink .6s infinite}.timer.expired{background:#555;color:#fff;animation:none}.board{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(5px,1vw,12px);perspective:1200px}.card{aspect-ratio:4 / 3;position:relative;cursor:default;user-select:none}.board.deal .card{animation:deal .45s var(--d) both cubic-bezier(.3,1.2,.5,1)}@keyframes deal{0%{opacity:0;transform:translateY(-30px) rotate(-6deg) scale(.8)}}.card .inner{position:absolute;inset:0;transition:transform .7s cubic-bezier(.4,.2,.2,1);transform-style:preserve-3d}.card.revealed .inner{transform:rotateY(180deg)}.face{position:absolute;inset:0;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:0 4px 10px #000a}.front{background:var(--word-card, linear-gradient(#efe3c8, #d9c8a3)) center / cover;display:flex;align-items:flex-end;justify-content:center;transition:transform .15s,box-shadow .15s}.front .word{font:700 clamp(10px,1.45vw,19px) var(--head);color:var(--ink);text-transform:uppercase;letter-spacing:.04em;width:100%;text-align:center;padding:0 4px 9%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;z-index:2}.back{transform:rotateY(180deg);background:var(--neutral)}.back img{width:100%;height:100%;object-fit:cover;display:block}.back .word{position:absolute;left:6px;bottom:5px;font:600 clamp(8px,.9vw,11px) var(--head);text-transform:uppercase;background:#000a;color:#fff;padding:1px 6px;border-radius:4px}.t-red .back{background:var(--red)}.t-blue .back{background:var(--blue)}.t-assassin .back{background:var(--assassin)}.card.just .back{animation:glow 1.2s}@keyframes glow{30%{box-shadow:0 0 0 4px #fff,0 0 30px #fff}}.card.revealed.t-assassin .back{box-shadow:0 0 0 3px #000,0 0 24px #f00a}.card.keyed .front:after{content:"";position:absolute;inset:0;z-index:1;border-radius:8px}.card.keyed.t-red .front:after{background:#c8372d66;box-shadow:inset 0 0 0 4px var(--red)}.card.keyed.t-blue .front:after{background:#2a5fa866;box-shadow:inset 0 0 0 4px var(--blue)}.card.keyed.t-neutral .front:after{background:#8a734a22}.card.keyed.t-assassin .front:after{background:#000a;box-shadow:inset 0 0 0 4px #000}.card.keyed.t-assassin .front .word{color:#fff}.board.over .card.keyed .front{filter:saturate(.8)}.card.pickable{cursor:pointer}.card.pickable:hover .front{transform:translateY(-3px);box-shadow:0 10px 18px #000c}.card.mine .front{box-shadow:0 0 0 4px var(--gold),0 8px 18px #000c}.marks{position:absolute;top:5px;left:5px;display:flex;gap:3px;flex-wrap:wrap;z-index:3}.mark{font:700 10px var(--head);background:var(--gold);color:var(--ink);border-radius:50%;width:22px;height:22px;display:grid;place-items:center;box-shadow:0 1px 3px #0008;animation:pop .3s}.clue-form{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;background:#000b;border-radius:16px;padding:10px;border:2px solid var(--gold);animation:slide .3s}.clue-form input{width:220px;font:700 18px var(--head);text-transform:uppercase;letter-spacing:.06em}.nums{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.nums button{width:36px;height:40px;font:700 17px var(--head);border-radius:8px;border:1px solid #b59b6c;background:var(--paper);color:var(--ink);cursor:pointer}.nums button.on{background:var(--gold);border-color:#fff;transform:scale(1.1)}.history{font-size:14px}.history h3{font-size:13px;color:var(--paper-dark);margin:4px 0}.history ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:4px}.history li.team-red::marker{color:#ff7a6e}.history li.team-blue::marker{color:#7fb2ff}.rev{display:inline-block;font-size:12px;padding:1px 6px;border-radius:4px;margin:1px;background:var(--neutral);color:var(--ink)}.rev.t-red{background:var(--red);color:#fff}.rev.t-blue{background:var(--blue);color:#fff}.rev.t-assassin{background:#000;color:#fff}.lobby{padding:26px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center}.lobby p{margin:0;max-width:520px}.invite{font-family:var(--type);background:#fff8;border:1px dashed #b59b6c;border-radius:8px;padding:6px 10px;display:flex;gap:6px;align-items:center;max-width:100%;overflow-wrap:anywhere}.problems{list-style:none;padding:0;margin:0;color:var(--red-dark);font-family:var(--type)}.ready{color:#2a7a3d;font-weight:600}.spectators{font-size:14px;color:var(--paper-dark)}.spectators .offline{opacity:.5}.log-box{color:var(--paper-dark);font-size:13px}.log-box summary{cursor:pointer;font-family:var(--head);text-transform:uppercase;letter-spacing:.05em}#log{max-height:200px;overflow-y:auto;font-family:var(--type);padding:6px 0}#banner{position:fixed;inset:0;display:grid;place-items:center;background:#000a;z-index:40;animation:fadein .4s;padding:16px}@keyframes fadein{0%{opacity:0}}.result-card{padding:26px 34px;text-align:center;display:flex;flex-direction:column;gap:8px;align-items:center;min-width:min(380px,100%);animation:pop .5s cubic-bezier(.3,1.5,.5,1)}.result.team-red .result-card{box-shadow:0 0 0 6px var(--red),0 20px 60px #000}.result.team-blue .result-card{box-shadow:0 0 0 6px var(--blue),0 20px 60px #000}.result-card h2{font-size:40px;margin:0}.result-card p{margin:0}.series{font:600 20px var(--head)}.flash-banner{position:fixed;left:50%;top:40%;z-index:30;pointer-events:none;text-align:center;font:700 clamp(32px,6vw,60px) var(--head);text-transform:uppercase;letter-spacing:.06em;color:#fff;text-shadow:0 4px 20px #000;padding:10px 40px;border-radius:12px}.flash-banner.team-red{background:#8e2018dd}.flash-banner.team-blue{background:#1b3f72dd}.flash-banner small{display:block;font-size:16px;letter-spacing:.02em;text-transform:none;font-weight:400}.status-bar .show-result{padding:4px 10px;font-size:12px}@media(max-width:900px){.home-grid{grid-template-columns:1fr}.table{grid-template-columns:1fr 1fr}.table .center{grid-column:1 / -1;order:3}.team{position:static;padding:8px}.team-head h2{font-size:16px}.left{font-size:22px;min-width:36px}.members li{font-size:13px;padding:2px 4px}.seats{flex-direction:row;flex-wrap:wrap}.btn.seat{flex:1;padding:6px 8px;font-size:12px}}@media(max-width:560px){.room{padding:8px 6px 20px}.code-chip{font-size:16px;padding:4px 8px}.room-name{display:none}.score{font-size:13px;padding:4px 10px}.score>span{display:none}.icon-btn{width:34px;height:34px}.board{gap:4px}.front .word{font-size:clamp(8px,2.6vw,12px);padding-bottom:8%}.clue-form input{width:100%}.nums button{width:30px;height:36px}.mark{width:16px;height:16px;font-size:8px}.status-bar{border-radius:14px;font-size:13px}}.guess-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;background:#000b;border:2px solid #fff2;border-radius:16px;padding:10px 14px}.guess-bar.team-red{border-color:var(--red)}.guess-bar.team-blue{border-color:var(--blue)}.guess-bar .pick,.guess-bar .pass{display:flex;flex-direction:column;gap:4px}.guess-bar .pass{align-items:flex-end;text-align:right}.guess-bar .muted{color:#d9cdb4}.guess-bar .open{min-width:260px;justify-content:center}.btn.danger{color:#fff;background:linear-gradient(#5b5550,#2b2724);border-color:#111;box-shadow:0 2px #000}.mini-btn.text.danger{color:#e9a39c}.danger-zone{margin-top:8px;padding-top:10px;border-top:1px dashed #b59b6c;display:flex;flex-direction:column;gap:6px}@media(max-width:720px){.guess-bar{flex-direction:column;align-items:stretch}.guess-bar .pass{align-items:stretch;text-align:left}.guess-bar .open{min-width:0}}