/* A lobby for friends (ui/party.js), style «Эфир»: REC, the code big, the two sides 4 + 4 (cyan спецназ / magenta
   одержимые), chips for the class and the host's switches, «Старт» amber. Phone portrait: the sides stack. */
#party{position:fixed;inset:0;z-index:46;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:auto;color:var(--ink);
  padding:calc(14px + var(--safe-t)) calc(14px + var(--safe-r)) calc(14px + var(--safe-b)) calc(14px + var(--safe-l));
  background:radial-gradient(ellipse 70% 60% at 50% 35%,rgba(53,230,255,.08),transparent 70%),rgba(7,5,11,.95)}
#party[hidden]{display:none}
.pty-box{position:relative;display:flex;flex-direction:column;gap:clamp(10px,2vh,18px);width:min(820px,100%);margin:auto;padding:clamp(16px,3vh,26px) clamp(16px,3vw,30px);
  background:rgba(9,7,14,.97);box-shadow:inset 3px 0 0 var(--cyan)}
.pty-start{width:min(520px,100%)}
.pty-k{display:flex;align-items:center;gap:14px}
.pty-k .lbl{color:var(--dim)}
.pty-h{margin:0;font:700 clamp(28px,4.4vw,42px)/1 var(--disp);letter-spacing:.06em;text-transform:uppercase;color:#fff}
.pty-h .num{color:var(--amber);letter-spacing:.14em}
.pty-note{margin:0;color:var(--ink2);font:italic 400 15px/1.45 var(--serif)}
.pty-err{margin:0;color:var(--red);font:500 12px/1.4 var(--mono);letter-spacing:.06em}
.pty-create{height:64px;font-size:30px}
.pty-join{display:flex;gap:10px;align-items:stretch}
.pty-join .field{flex:1;height:52px}
.pty-join input{text-transform:uppercase;letter-spacing:.2em}
.pty-join .btn-g{min-height:52px}
.pty-code{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px}
.pty-code .btn-g{min-height:44px}
.pty-toast{opacity:0;transition:opacity .2s;color:var(--live)}
.pty-toast.on{opacity:1}
.pty-sides{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pty-side{--sc:var(--cyan);border:var(--bw) solid var(--line);background:rgba(7,5,11,.55);padding:10px 12px}
.pty-side[data-side=possessed]{--sc:var(--mag)}
.pty-side header{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.pty-side header .lbl{color:var(--sc);flex:1}
.pty-side header .num{font:600 20px/1 var(--disp);color:#fff}
.pty-go{min-height:34px;padding:0 12px;font-size:10px}
.pty-side ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.pty-side li{display:flex;align-items:center;gap:10px;min-height:38px;border-top:1px solid var(--line)}
.pty-side li .n{font:500 18px/1.1 var(--disp);letter-spacing:.04em;text-transform:uppercase;color:#fff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pty-side li .lbl{color:var(--dim);font-size:9.5px}
.pty-side li.me .n{color:var(--sc)}
.pty-side li.empty .lbl{color:var(--mute)}
.pty-side li em{font-style:normal;margin-left:auto;font-size:9px}
.pty-host{color:var(--amber)!important} .pty-rdy{color:var(--live)!important} .pty-in{color:var(--red)!important}
.pty-side li em+em{margin-left:6px}
.pty-cls,.pty-opt{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px}
.pty-cls>.lbl{margin-right:6px}
.pty-chip{min-height:36px;padding:0 12px;border:var(--bw) solid var(--line);background:rgba(7,5,11,.6);color:var(--ink2);cursor:pointer;font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.pty-chip.on{color:#fff;border-color:var(--cyan);box-shadow:inset 0 -2px 0 var(--cyan)}
.pty-chip:disabled{cursor:default;opacity:.7}
.pty-act{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pty-ready{min-height:52px}
.pty-ready.on{border-color:var(--live);color:var(--live)}
.pty-startb{height:60px;min-width:240px;font-size:28px;gap:14px}
.pty-startb kbd{font-size:11px}
.pty-opts{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:10px}
.pty-opts>.lbl{color:var(--amber)}
.pty-opt>span{min-width:220px;color:var(--ink2);font-size:12.5px}
.pty-foot{display:flex;justify-content:flex-end}
.pty-foot .btn-g{min-height:44px}
/* the lobby's entry: a quiet second button under «На смену» */
.lob-friends{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:46px;margin-top:2px}
.lob-friends svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
@media (max-width:760px){ .pty-sides{grid-template-columns:1fr} .pty-opt>span{min-width:0;width:100%} .pty-startb{width:100%;min-width:0} .pty-startb kbd{display:none} .pty-ready{width:100%} }
@media (max-height:520px){ .pty-box{gap:8px;padding:12px 16px} .pty-side li{min-height:30px} .pty-side li .n{font-size:15px} .lob-friends{min-height:38px} }
/* SOC-372: Glint Online (public/glint-online.js): the lobby row under «Играть с друзьями» + its panel (the same «Эфир» box) */
.lob-glint{display:flex;gap:8px;width:100%;margin-top:2px}
.lob-glint[hidden]{display:none}
.lob-glint>button{flex:1 1 0;min-width:0;min-height:46px;margin:0;padding:0 8px;gap:8px;white-space:normal;line-height:1.2;text-align:center;font-size:10.5px;letter-spacing:.1em}
.lob-glint>.lob-friends{flex:1.3 1 0;width:auto}
.lob-glint .gl-host.on{border-color:var(--amber);color:var(--amber)}
@media (max-width:760px){ .lob-glint{gap:6px} .lob-glint>button{padding:0 6px;font-size:9.5px;letter-spacing:.06em} .lob-glint>.lob-friends svg{display:none} }
#glint{position:fixed;inset:0;z-index:46;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:auto;color:var(--ink);
  padding:calc(14px + var(--safe-t)) calc(14px + var(--safe-r)) calc(14px + var(--safe-b)) calc(14px + var(--safe-l));
  background:radial-gradient(ellipse 70% 60% at 50% 35%,rgba(255,181,71,.07),transparent 70%),rgba(7,5,11,.95)}
#glint[hidden]{display:none}
.gl-box{box-shadow:inset 3px 0 0 var(--amber)}
.gl-peers{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.gl-peers li{display:flex;align-items:center;min-height:38px;border-top:1px solid var(--line);font:500 18px/1.1 var(--disp);letter-spacing:.04em;text-transform:uppercase;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gl-peers li.me{color:var(--amber)}
.gl-status{color:#fff;font-style:normal}
.gl-foot{gap:10px;flex-wrap:wrap}
@media (max-height:520px){ .lob-glint>button{min-height:38px} .gl-peers li{min-height:30px;font-size:15px} }
