/* V13.18.3: waiting room UI, deliberately separate from active-game layout. */
.game[data-phase="lobby"]{
  background:radial-gradient(ellipse at 16% 8%,#671e301f,transparent 48%),radial-gradient(ellipse at 75% 85%,#7b24251f,transparent 55%),#09090e;
  color:#f8e8dc;
}
.game[data-phase="lobby"] .game-header{
  min-height:66px;padding:8px clamp(12px,2.4vw,34px);background:#100c10dd;border-bottom:1px solid #65413c61;
}
.game[data-phase="lobby"] .game-header .brand.compact{font:700 16px Georgia,serif;color:#f3d3a4;gap:6px}
.game[data-phase="lobby"] .game-header .brand.compact img{height:46px;width:46px;object-fit:contain}
.game[data-phase="lobby"] .game-header .header-center{display:none}
.game[data-phase="lobby"] .game-header .room-tools{margin-left:auto;gap:8px}
.game[data-phase="lobby"] .game-header .game-rules-link{display:none}
.game[data-phase="lobby"] .game-header #shareRoomLink{display:none!important}
.game[data-phase="lobby"] .game-header .room-code{padding:8px 10px;background:#1c151c;border-color:#534149}
.game[data-phase="lobby"] .game-header .room-code span{font-size:9px}
.game[data-phase="lobby"] .game-header #leaveBtn{background:#281923}
.game[data-phase="lobby"] .lobby-room-toolbar{
  margin:12px clamp(12px,2.4vw,34px) 9px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 19px;border:1px solid #85564a;border-radius:16px;background:linear-gradient(110deg,#22151b,#100f14 75%);
  box-shadow:0 12px 27px #0006;
}
.game[data-phase="lobby"] .lobby-room-identity{display:flex;align-items:center;flex-wrap:wrap;gap:5px 14px;min-width:0}
.game[data-phase="lobby"] .lobby-room-kicker{flex-basis:100%;font-size:10px;letter-spacing:.16em;color:#bb9682;font-weight:700}
.game[data-phase="lobby"] #lobbyRoomName{font:700 clamp(20px,2.25vw,31px) Georgia,serif;color:#f8d9ab;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:29vw}
.game[data-phase="lobby"] .lobby-room-count,.game[data-phase="lobby"] .lobby-ready-count{font-size:12px;color:#ddd1cb;white-space:nowrap}
.game[data-phase="lobby"] .lobby-ready-count{color:#83ddad;background:#14281e;border:1px solid #2b6443;border-radius:999px;padding:4px 10px}
.game[data-phase="lobby"] .lobby-room-buttons{display:flex;justify-content:flex-end;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.game[data-phase="lobby"] .lobby-room-buttons .lobby-action{min-height:42px;white-space:nowrap;padding:10px 15px;border-radius:10px;font-size:12px;font-weight:700}
.game[data-phase="lobby"] .lobby-room-buttons .btn.secondary{background:#27202a;color:#eadfdc;border:1px solid #65474a}
.game[data-phase="lobby"] .lobby-room-buttons .btn.primary{background:linear-gradient(115deg,#a91e3a,#d44058);border:1px solid #dc687d;box-shadow:0 0 18px #b0213833;color:white}
.game[data-phase="lobby"] .lobby-room-buttons .lobby-ready-button.is-ready{background:linear-gradient(115deg,#236d51,#248764);border-color:#65c29b;box-shadow:0 0 13px #3297702a}
.game[data-phase="lobby"] .lobby-room-buttons #lobbyStartBtn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.game[data-phase="lobby"] .game-layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(250px,20vw,315px);gap:14px;padding:12px clamp(12px,2.4vw,34px) 20px;align-items:stretch;overflow:hidden}
.game[data-phase="lobby"] .arena{padding:0;overflow-y:auto;min-height:0;scrollbar-width:thin}
.game[data-phase="lobby"] .arena-top,
.game[data-phase="lobby"] .phase-progress,
.game[data-phase="lobby"] .phase-notice,
.game[data-phase="lobby"] .voice-banner,
.game[data-phase="lobby"] .media-controls,
.game[data-phase="lobby"] .action-panel{display:none!important}
.game[data-phase="lobby"] .video-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-content:start;gap:11px;padding:1px 2px 12px;margin:0}
.game[data-phase="lobby"] .video-tile.lobby-seat{
  display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;min-height:228px;aspect-ratio:auto;
  padding:11px 10px 12px;position:relative;border:1px solid #68443c;border-radius:15px;
  background:radial-gradient(ellipse at 40% 12%,#51233180,transparent 65%),linear-gradient(145deg,#22151e,#111118 76%);
  box-shadow:0 7px 22px #0003;overflow:hidden;
}
.game[data-phase="lobby"] .video-tile.lobby-seat:before{content:none}
.game[data-phase="lobby"] .video-tile.lobby-seat.ready{border-color:#654839;box-shadow:0 7px 22px #0003}
.game[data-phase="lobby"] .video-tile.lobby-seat.me{border-color:#a56f50;background:radial-gradient(ellipse at 48% 0%,#6e252b75,transparent 66%),linear-gradient(145deg,#25161d,#101116)}
.game[data-phase="lobby"] .video-tile.lobby-seat.speaking{border-color:#fb647e!important;box-shadow:0 0 0 1px #f1577f66,0 0 25px #da2d603d}
.game[data-phase="lobby"] .video-tile.lobby-seat.offline{opacity:.62}
.game[data-phase="lobby"] .lobby-seat-top{min-height:23px;display:flex;align-items:flex-start;justify-content:space-between;gap:5px;z-index:3;position:relative}
.game[data-phase="lobby"] .lobby-host-label{font-size:9px;line-height:1.5;color:#f2cd8e;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.game[data-phase="lobby"] .lobby-player-menu{position:relative;margin-left:auto;z-index:5}
.game[data-phase="lobby"] .lobby-player-menu>summary{list-style:none;cursor:pointer;background:#231a25;border:1px solid #624046;border-radius:8px;padding:2px 6px}
.game[data-phase="lobby"] .lobby-player-menu button{position:relative;display:block;width:max-content;max-width:185px;margin:4px 0}
.game[data-phase="lobby"] .lobby-player-menu[open]{background:#161019;padding:5px;border-radius:9px;border:1px solid #7a4b55}
.game[data-phase="lobby"] .lobby-avatar-wrap{padding-top:0;display:grid;place-items:center;margin:1px auto 4px}
.game[data-phase="lobby"] .lobby-seat .avatar.lobby-person-avatar{width:94px;height:94px;border:2px solid #ae755c;border-radius:50%;overflow:hidden;position:relative;background:radial-gradient(circle at 45% 40%,#833e4d,#281824);display:grid;place-items:center;box-shadow:0 5px 18px #0007;color:#f1dbd9;font:700 40px Georgia,serif}
.game[data-phase="lobby"] .lobby-person-avatar img{height:100%;width:100%;object-fit:cover;display:block}
.game[data-phase="lobby"] .lobby-seat-main{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;text-align:center}
.game[data-phase="lobby"] .lobby-seat-name{font:700 16px Georgia,serif;color:#f8e2c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.game[data-phase="lobby"] .lobby-seat-status{font-size:12px;color:#90a19d}
.game[data-phase="lobby"] .lobby-seat.ready .lobby-seat-status{color:#5ce1a1}
.game[data-phase="lobby"] .lobby-seat.speaking .lobby-seat-status{color:#ff7b94;font-weight:700}
.game[data-phase="lobby"] .lobby-seat.speaking .lobby-seat-status:after{content:' · Gapirmoqda';}
.game[data-phase="lobby"] .lobby-seat-meta{font-size:10px;color:#a599a1}
.game[data-phase="lobby"] .lobby-seat-bottom{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:9px}
.game[data-phase="lobby"] .seat-mic{width:45px;height:45px;border-radius:50%;font-size:0;display:grid;place-items:center;cursor:pointer;background:linear-gradient(#34313c,#24242d);border:1px solid #62545e;color:#dbd4da;box-shadow:0 5px 14px #0005;position:relative}
.game[data-phase="lobby"] .seat-mic::before{content:'';width:21px;height:21px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2' width='6' height='12' rx='3'/%3E%3Cpath d='M5 10a7 7 0 0 0 14 0M12 17v5M8 22h8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2' width='6' height='12' rx='3'/%3E%3Cpath d='M5 10a7 7 0 0 0 14 0M12 17v5M8 22h8'/%3E%3C/svg%3E") center/contain no-repeat}
.game[data-phase="lobby"] .seat-mic.on{background:linear-gradient(#a52c48,#651d38);border-color:#ec879a;color:#fff1f3;box-shadow:0 0 0 3px #d7436144,0 0 15px #d9335e55}
.game[data-phase="lobby"] .seat-mic:disabled{cursor:default;opacity:.7}
.game[data-phase="lobby"] .lobby-seat.speaking .seat-mic{background:linear-gradient(#f54768,#aa1d3d);color:white;border-color:#ffb0bf;box-shadow:0 0 0 5px #ed4f6c22,0 0 22px #ed4f6caa}
.game[data-phase="lobby"] .seat-mic:focus-visible,.lobby-room-toolbar button:focus-visible{outline:3px solid #f3bd97;outline-offset:3px}
.game[data-phase="lobby"] .seat-ready-badge{font-size:9px;color:#b9a6ac}
.game[data-phase="lobby"] .seat-ready-badge.is-ready{color:#64d7a4}
.game[data-phase="lobby"] .video-tile.lobby-seat.empty{justify-content:center;align-items:center;gap:12px;border-style:dashed;border-color:#4d3b46;background:linear-gradient(145deg,#141118,#0d0e13)}
.game[data-phase="lobby"] .empty-plus{height:52px;width:52px;border-radius:50%;background:#221d29;border:1px solid #4f4254;color:#8e7d8e;font-size:31px}
.game[data-phase="lobby"] .empty-label{color:#8e8590;font-size:11px}
.game[data-phase="lobby"] .sidebar{background:linear-gradient(155deg,#171119,#0e0d13);border:1px solid #795447;border-radius:15px;overflow:hidden;min-height:0;display:flex;flex-direction:column}
.game[data-phase="lobby"] .players-block{display:none!important}
.game[data-phase="lobby"] .chat-block{height:100%;min-height:0;flex:1;padding:17px 14px;display:flex;flex-direction:column}
.game[data-phase="lobby"] .side-header h2{font:700 18px Georgia,serif;color:#eed1a5}
.game[data-phase="lobby"] .chat-messages{flex:1;min-height:220px;max-height:none;overflow:auto;gap:11px;padding-right:5px}
.game[data-phase="lobby"] .chat-entry{padding:7px 2px 8px;gap:11px}
.game[data-phase="lobby"] .chat-entry .chat-avatar{width:34px;height:34px;border-radius:50%;background:#452637;border:1px solid #88564c;color:#edd8ca}
.game[data-phase="lobby"] .chat-entry .chat-meta{color:#e6d3ce;font-size:12px}
.game[data-phase="lobby"] .chat-entry .chat-msg{font-size:12px;line-height:1.6;color:#d3c5d0}
.game[data-phase="lobby"] .chat-compose{padding-top:10px;border-top:1px solid #57434a}
.game[data-phase="lobby"] .chat-compose input{background:#201923;border:1px solid #634b54;border-radius:10px;color:#fcecef;min-height:42px}
.game[data-phase="lobby"] .chat-compose button{background:#b52c48;border-radius:10px;color:#fff;min-height:42px}
.lobby-roles-open{overflow:hidden}
.lobby-roles-overlay:not(.hidden){display:flex;position:fixed;inset:0;background:#030308dd;backdrop-filter:blur(7px);z-index:500;align-items:center;justify-content:center;padding:14px}
.lobby-roles-dialog{width:min(780px,100%);max-height:calc(100dvh - 28px);overflow:auto;background:linear-gradient(140deg,#25161f,#111218);border:1px solid #a16d54;border-radius:18px;box-shadow:0 20px 90px #000c;scrollbar-width:thin}
.lobby-roles-head{padding:21px 22px 16px;border-bottom:1px solid #60464a;display:flex;gap:14px;justify-content:space-between;align-items:flex-start}
.lobby-roles-head span{font-size:10px;letter-spacing:.14em;color:#e2ac85;font-weight:800}
.lobby-roles-head h2{font:700 25px Georgia,serif;color:#f6d4a4;margin:6px 0}
.lobby-roles-head p{font-size:12px;color:#bcaeb0;max-width:550px;line-height:1.55}
.lobby-roles-head button{flex-shrink:0}
.lobby-roles-body{padding:3px 12px 20px}
.lobby-roles-body .role-lobby-panel{background:#17121a;border-color:#67464b}
@media(min-width:1550px){.game[data-phase="lobby"] .video-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1190px){.game[data-phase="lobby"] .video-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.game[data-phase="lobby"] .game-layout{grid-template-columns:minmax(0,1fr) 270px}.game[data-phase="lobby"] .lobby-room-toolbar{flex-wrap:wrap}.game[data-phase="lobby"] #lobbyRoomName{max-width:50vw}}
@media(max-width:880px){.game[data-phase="lobby"]{height:auto;min-height:100dvh}.game[data-phase="lobby"] .game-layout{display:flex;flex-direction:column;overflow:visible}.game[data-phase="lobby"] .arena{overflow:visible}.game[data-phase="lobby"] .video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.game[data-phase="lobby"] .sidebar{min-height:330px}.game[data-phase="lobby"] .chat-messages{max-height:310px}}
@media(max-width:590px){.game[data-phase="lobby"] .game-header{min-height:58px}.game[data-phase="lobby"] .game-header .brand.compact{display:flex;font-size:11px}.game[data-phase="lobby"] .game-header .brand.compact img{width:34px;height:34px}.game[data-phase="lobby"] .room-code span{display:none}.game[data-phase="lobby"] .lobby-room-toolbar{margin:7px 9px;padding:12px;gap:10px}.game[data-phase="lobby"] .lobby-room-identity{gap:4px 10px}.game[data-phase="lobby"] #lobbyRoomName{max-width:calc(100vw - 100px);font-size:22px}.game[data-phase="lobby"] .lobby-room-buttons{width:100%;justify-content:flex-start;gap:7px}.game[data-phase="lobby"] .lobby-room-buttons .lobby-action{flex:1 1 auto;font-size:11px;padding:10px 8px}.game[data-phase="lobby"] .game-layout{padding:8px 9px 17px}.game[data-phase="lobby"] .video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.game[data-phase="lobby"] .video-tile.lobby-seat{min-height:213px;padding:10px 6px}.game[data-phase="lobby"] .lobby-seat .avatar.lobby-person-avatar{width:74px;height:74px;font-size:32px}.game[data-phase="lobby"] .lobby-seat-name{font-size:15px}.game[data-phase="lobby"] .lobby-roles-head{padding:16px;flex-wrap:wrap}.game[data-phase="lobby"] .lobby-roles-head h2{font-size:23px}}
