/* телефон-пульт */
body.phone{overscroll-behavior:none}
body.phone #app{max-width:560px;padding:10px 14px calc(18px + env(safe-area-inset-bottom))}
.ph-top{display:flex;align-items:center;gap:10px;padding:4px 0 10px;border-bottom:1px solid var(--line);margin-bottom:12px}
.ph-top .nm{flex:1;font-weight:900;font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-top .code{color:#cdb8ff;font-weight:800;font-size:14px}
.ph-top .dot{width:10px;height:10px;border-radius:50%;background:var(--green);flex:none}
.ph-top .dot.off{background:var(--red);animation:beat .8s infinite}
.ph-screen{display:flex;flex-direction:column;gap:14px;animation:fadeIn .3s ease}
.ph-title{font-size:clamp(22px,6vw,30px);font-weight:900;text-align:center;line-height:1.15}
.ph-sub{color:#cdb8ff;font-weight:700;text-align:center;font-size:16px}
.ph-prompt{background:linear-gradient(160deg,#2b1460,#1a0c3d);border:2px solid rgba(255,200,61,.55);border-radius:18px;padding:16px;font-size:20px;font-weight:800;text-align:center;line-height:1.3}
.ph-icon{font-size:76px;text-align:center;line-height:1}
.ph-in{width:100%;font-size:22px;font-weight:700;font-family:inherit;padding:14px 16px;border-radius:14px;border:2px solid var(--line);background:rgba(255,255,255,.08);color:#fff;outline:none}
.ph-in:focus{border-color:var(--gold)}
textarea.ph-in{min-height:110px;resize:none}
.ph-err{color:#ffb3bb;font-weight:800;text-align:center;min-height:22px}
.ph-count{color:#cdb8ff;text-align:right;font-size:13px;margin-top:-8px}
.ph-opts{display:grid;gap:10px}
.ph-opts.two{grid-template-columns:1fr 1fr}
.ph-opt{padding:16px 14px;border-radius:16px;border:2px solid var(--line);background:var(--card);color:#fff;font-size:19px;font-weight:800;font-family:inherit;text-align:left;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:60px}
.ph-opt:active{transform:scale(.97)}
.ph-opt.sel{background:var(--gold);color:#2a1300;border-color:#fff3b0}
.ph-opt .k{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;font-weight:900;color:#1a0b33;flex:none}
.buzzer{width:min(78vw,320px);aspect-ratio:1;border-radius:50%;border:0;margin:10px auto;display:flex;align-items:center;justify-content:center;flex-direction:column;font-family:inherit;font-weight:900;font-size:clamp(30px,9vw,44px);color:#fff;background:radial-gradient(circle at 35% 30%,#ff8fb8,#ff2d7a 55%,#a3134a);box-shadow:0 14px 0 #6d0b31,0 24px 50px rgba(0,0,0,.5);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}
.buzzer:active{transform:translateY(10px);box-shadow:0 4px 0 #6d0b31,0 10px 20px rgba(0,0,0,.5)}
.buzzer.locked{background:radial-gradient(circle at 35% 30%,#777,#444 60%,#222);box-shadow:0 8px 0 #111;opacity:.7}
.buzzer.mine{background:radial-gradient(circle at 35% 30%,#a8ffd0,#22c26a 55%,#127a40);box-shadow:0 14px 0 #0b4d27;animation:beat 1s infinite}
.buzzer small{font-size:16px;font-weight:800;opacity:.9;margin-top:6px}
.word-card{background:#fff;color:#1b0b3a;border-radius:22px;padding:22px 14px;text-align:center;font-size:clamp(30px,10vw,52px);font-weight:900;box-shadow:0 0 0 5px rgba(255,200,61,.6);word-break:break-word;line-height:1.1}
.ph-names{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ph-names .nb{font-size:16px;padding:12px 8px}
.pad{background:#fff;border-radius:16px;width:100%;aspect-ratio:4/3;touch-action:none;display:block;box-shadow:0 0 0 4px rgba(255,200,61,.5)}
.ph-tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;align-items:center}
.ph-tools button{width:38px;height:38px;border-radius:50%;border:3px solid rgba(255,255,255,.25);background:#fff;font-size:17px;cursor:pointer}
.ph-tools button.on{border-color:var(--gold);transform:scale(1.15)}
.ph-timer{height:8px;border-radius:6px;background:rgba(255,255,255,.12);overflow:hidden}
.ph-timer i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--pink));transition:width .25s linear}
.bombph{font-size:150px;text-align:center;line-height:1;animation:beat .6s infinite}
.role-card{background:linear-gradient(160deg,#2b1460,#1a0c3d);border:3px solid var(--gold);border-radius:22px;padding:18px;text-align:center;min-height:180px;display:flex;flex-direction:column;justify-content:center;gap:8px;cursor:pointer}
.role-card .loc{font-size:32px;font-weight:900;color:var(--gold)}
.role-card .role{font-size:20px;font-weight:800}
.role-card.hide>*:not(.cover){display:none}
.role-card .cover{font-size:20px;font-weight:900;color:#cdb8ff}
.role-card:not(.hide) .cover{display:none}
.ph-small{font-size:14px;color:#cdb8ff;text-align:center}
.ph-thumb{width:100%;border-radius:14px;background:#fff;box-shadow:0 0 0 4px rgba(255,200,61,.4)}