/* The lobby uses its own game-native visual language; Derma remains in-game. */
#lobby{--lobby-accent:#d52b44;--lobby-panel:#1a1216;--lobby-text:#f4eaee;position:fixed;inset:0;pointer-events:none;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(ellipse at 51% 43%,transparent 15%,#08060888 75%),linear-gradient(90deg,#10070bcc,transparent 39%,transparent 61%,#16080ccc);color:var(--lobby-text);isolation:isolate}#lobby button,#lobby input,#lobby a,#lobby section{pointer-events:auto}#lobby button{font-weight:800}#lobby button:focus-visible,#lobby a:focus-visible{outline:3px solid #ff8a9c;outline-offset:4px}#lobby button{border:0;color:inherit}#lobby .lobby-top{height:90px;padding:0 44px;display:flex;align-items:center;gap:64px;background:linear-gradient(#090608dd,transparent);pointer-events:auto}.tt-brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:#fff;font-size:11px;line-height:1.05;font-weight:900;letter-spacing:1.5px}.tt-mark{font:italic 900 33px/1 Arial;border:3px solid white;letter-spacing:-4px;padding:2px 9px 2px 2px;transform:skew(-9deg)}.lobby-top nav{display:flex;gap:5px;height:100%;align-items:center}.lobby-nav{background:transparent;padding:13px 27px;font-size:16px;letter-spacing:.6px;transform:skew(-8deg)}.lobby-nav.selected{background:var(--lobby-accent);box-shadow:0 3px 0 #760f24;color:#fff7f7!important}.lobby-profile{margin-left:auto;display:flex;gap:14px;align-items:center}.lobby-profile img{width:46px;height:46px;object-fit:cover;border:2px solid #a74450;border-radius:3px}.profile-name{text-align:right}.profile-name b{display:block;font-size:15px}.profile-name small{display:block;font-size:10px;color:#e3a7ae;margin-top:6px;letter-spacing:1.5px}.lobby-intro{position:absolute;top:17%;left:4.2%;width:300px}.eyebrow{font-size:10px;line-height:1.4;letter-spacing:2px;font-weight:800;color:#e9a9b0}.eyebrow>span{display:inline-block;width:5px;height:5px;margin-right:6px;background:#ee4559;border-radius:50%;box-shadow:0 0 8px #fff}.lobby-intro h1{font-size:clamp(52px,6vw,92px);font-style:italic;letter-spacing:-4px;line-height:.9;margin:22px 0 20px;font-weight:950;text-shadow:0 6px 0 #650d1d88}.lobby-intro>p{font-size:15px;line-height:1.65;color:#d7ced0;margin:0 0 30px}.level-card{padding:19px 20px;background:linear-gradient(120deg,#171216d9,#23141bdd);border:1px solid #9c515d55;border-radius:3px}.level-label{display:flex;justify-content:space-between;align-items:center}.level-label>span{font-size:12px;font-weight:800;letter-spacing:1px}.level-label b{font-size:23px;color:#feec71;margin-left:5px}.level-label small{font-size:10px;color:#bfb2b6}.xp-track,.slots-track{height:4px;background:#08060899;margin:10px 0 0;overflow:hidden}.xp-track i,.slots-track i{display:block;background:#eb3e54;height:100%;transition:width .3s}.stats-row{display:flex;margin-top:20px}.stats-row div{flex:1;text-align:center;border-right:1px solid #ad798448}.stats-row div:last-child{border:0}.stats-row b{display:block;font-size:25px}.stats-row span{display:block;font-size:8px;font-weight:bold;letter-spacing:1.5px;color:#bda8ad;margin-top:4px}.extra-stats{display:flex;justify-content:space-between;padding:11px 5px;font-size:9px;color:#baa1a8;letter-spacing:1px}.extra-stats b{color:#dfd2d6;margin-left:5px}.character-caption{position:absolute;left:50%;top:18%;transform:translateX(-50%);display:flex;gap:10px;align-items:center;text-align:left}.character-check{display:grid;place-items:center;color:#182516;background:#b6f675;width:28px;height:28px;border-radius:50%;font-weight:bold}.character-caption b{font-size:18px;display:block}.character-caption small{font-size:8px;color:#c5a4ac;letter-spacing:1.5px;display:block;margin-top:5px}.server-select{position:absolute;right:4.2%;top:20%;width:310px}.server-heading,.locker-heading{display:flex;align-items:center;justify-content:space-between}.server-heading h2,.locker-heading h2{font-size:30px;font-style:italic;letter-spacing:-1px;line-height:1;margin:6px 0 18px}.icon-button{background:#68233199;font-size:25px!important;width:35px;height:35px;align-self:center;border-radius:3px}.server-card{width:100%;padding:0;background:#1a1216!important;text-align:left;box-shadow:0 0 0 2px #ec566b,0 0 0 5px #722431;overflow:hidden;border-radius:3px}.server-art{position:relative;height:132px;overflow:hidden;background:linear-gradient(165deg,#95d3ff 0 49%,#3284d9 50%);isolation:isolate}.server-art:before{content:'';position:absolute;background:#c7eaff88;width:60px;height:10px;top:25px;right:25px;box-shadow:-145px 10px 0 -2px #a2d8ff}.block-island{position:absolute;width:150px;height:50px;bottom:15px;right:18px;background:linear-gradient(#529a39 0 17%,#827557 18% 45%,#7f898d 46% 100%);transform:skewY(-10deg);box-shadow:-45px -13px 0 -5px #659642,20px 10px 0 -7px #ddd793}.block-island i{position:absolute;width:38px;height:36px;right:24px;top:-34px;background:linear-gradient(#95bc42 0 15%,#7d603f 16% 100%)}.block-island b{position:absolute;width:21px;height:28px;left:20px;top:-28px;background:#386c32;box-shadow:3px 18px 0 -6px #594d29}.block-island span{position:absolute;width:28px;height:25px;right:74px;top:-40px;background:#3b7b30;box-shadow:4px 20px 0 -8px #594d29}.mini-lighthouse{position:absolute;left:47px;bottom:37px;width:24px;height:70px;background:repeating-linear-gradient(#e9e4cd 0 9px,#9d3c3e 10px 17px);transform:rotate(-4deg);z-index:2}.mini-lighthouse:before{content:'';position:absolute;top:-19px;left:-3px;width:30px;height:21px;background:linear-gradient(#3c5261 0 30%,#f3e4a1 31% 70%,#3c5261 71%)}.mini-lighthouse:after{content:'';position:absolute;width:38px;height:6px;left:-7px;top:-24px;background:#3e5060}.map-tag{position:absolute;left:13px;bottom:12px;font-size:12px;text-shadow:0 2px 3px #13070b;font-style:italic}.server-status{position:absolute;right:10px;top:10px;padding:5px 7px;font-size:8px;letter-spacing:1px;background:#160c12e6;color:#c7b9be}.server-status.online{color:#bdf89e}.server-status.online:before{content:'●';margin-right:5px}.server-details{padding:16px 13px 12px;display:flex;justify-content:space-between;align-items:center}.server-details h3{margin:0 0 5px;font-size:16px}.server-details span{font-size:10px;color:#c3b1b7;font-weight:400}.selected-tick{font-size:18px!important;color:#a5f273!important}.server-meta{display:flex;justify-content:space-between;padding:0 13px;font-size:10px;color:#c6b6bb;font-weight:400}.server-meta b{color:white}.slots-track{margin:12px 13px 15px;height:3px}.slots-track i{background:#e94a61}.server-rule{font-size:10px;text-align:center;color:#c7b4bb;margin:19px 0}.join-button{width:100%;height:58px;font-size:26px;letter-spacing:-.8px;font-style:italic;color:#ffffff!important;background:#c9243d;box-shadow:0 5px 0 #6e1021;transform:skew(-5deg);transition:filter .15s,transform .15s}.join-button:hover{filter:brightness(1.1);transform:skew(-5deg) translateY(-2px)}.join-button:disabled{filter:saturate(.3);opacity:.65;cursor:wait}.server-select #lobbyStatus{font-size:11px;line-height:1.5;color:#e6d7dc;text-align:center;margin:15px 0 5px;min-height:17px}.text-button{background:transparent;color:#d7a4af!important;font-size:10px;text-decoration:underline;padding:2px 0;display:block;margin:auto}#signInGame{display:block;color:#fff8a7;text-align:center;font-size:13px;padding:8px}.locker{position:absolute;bottom:84px;left:4.2%;width:365px}.locker-heading h2{font-size:23px;margin:4px 0 12px}.locker-heading>span{font-size:8px;color:#c1a4ad;letter-spacing:1px}.skin-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.skin-choice{padding:0;background:linear-gradient(#3b202b,#171015);border-radius:3px;overflow:hidden;position:relative;box-shadow:0 0 0 1px #a3657677;transition:transform .15s}.skin-choice img{width:100%;height:72px;object-fit:cover;display:block;pointer-events:none}.skin-choice span{display:block;text-align:center;font-size:10px;padding:7px 0;background:#0c080bcc}.skin-choice.selected{box-shadow:0 0 0 2px #ff6d80}.skin-choice.selected:after{content:'✓';position:absolute;right:3px;top:3px;background:#ff6d80;color:#1c080e;font-size:8px;width:12px;height:12px;line-height:12px}.skin-choice:hover{transform:translateY(-3px)}.callsign-label{display:flex;align-items:center;gap:10px;color:#c7b3ba;letter-spacing:1px;font-size:8px;margin-top:15px}.callsign-label input{padding:7px 9px;background:#0e090dc9;border:1px solid #a26a7c66;color:#f3e8ec;border-radius:2px;font-size:11px;min-width:0;flex:1}.lobby-footer{position:absolute;left:0;right:0;bottom:0;height:49px;padding:0 4.2%;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #a74c6033;background:#100a0ee6;font-size:9px;letter-spacing:1px;font-weight:700;color:#cdb7c0}.lobby-footer i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#98db72;margin-right:7px}.lobby-footer b{color:#b58b99;margin-left:14px}.lobby-footer-right{display:flex;align-items:center;gap:30px}.lobby-footer-right>span{font-size:9px;font-weight:400;letter-spacing:0;color:#c4a8b2}.lobby-footer button{font-size:10px;background:transparent;color:#ecd6de!important}.lobby-help{position:absolute;inset:0;display:grid;place-items:center;background:#080408cc;pointer-events:auto}.lobby-help section{width:min(520px,90vw);background:#1d1219;border:1px solid #885265;padding:30px;box-shadow:0 20px 80px #00000099}.lobby-help h2{font-size:28px;font-style:italic}.lobby-help p{color:#d7c5cc;line-height:1.65;font-size:13px}.lobby-help button{float:right;background:none;font-size:24px}#connectionStatus{position:fixed;top:8px;left:50%;transform:translateX(-50%);background:#8b3b15ed;padding:8px 16px;border-radius:3px;z-index:60;font:12px Tahoma}#toolHint{position:fixed;right:20px;bottom:15px;background:#0009;padding:8px 12px;font:12px Tahoma;max-width:420px;pointer-events:none}#radarMarkers{position:fixed;inset:0;pointer-events:none}.radar-marker{position:absolute;border:2px solid #46e671;border-radius:50%;width:14px;height:14px;box-shadow:0 0 3px #000}.radar-marker span{position:absolute;top:15px;left:50%;transform:translateX(-50%);font:10px Tahoma;text-shadow:1px 1px black;white-space:nowrap}.radar-marker.traitor{border-color:#ff3333}.radar-marker.dna{border-color:#5aceff}.radar-marker.c4{border-color:#ffc544}
@media(min-width:1600px){.lobby-intro,.server-select{width:340px}.locker{width:400px}.skin-choice img{height:85px}.server-art{height:165px}}@media(max-height:780px){.lobby-top{height:70px!important}.lobby-intro{top:16%}.lobby-intro h1{font-size:58px;margin:17px 0}.lobby-intro>p{margin-bottom:17px;font-size:12px}.level-card{padding:13px}.stats-row{margin-top:12px}.stats-row b{font-size:21px}.locker{bottom:65px}.skin-choice img{height:57px}.locker-heading h2{font-size:18px}.callsign-label{margin-top:10px}.server-select{top:16%}.server-art{height:110px}.server-heading h2{font-size:25px}.server-rule{margin:14px 0}.character-caption{top:18%}}@media(max-width:1100px){.lobby-intro{width:235px;left:3%}.server-select{width:260px;right:3%}.locker{width:300px;left:3%}.lobby-top{padding:0 3%!important}.lobby-intro h1{font-size:58px}.lobby-top{gap:35px!important}.character-caption{left:50%}.level-label small{font-size:8px}.server-heading h2{font-size:24px}}@media(max-width:760px){.lobby-intro{display:none}.lobby-top{height:65px!important;gap:20px!important}.lobby-nav{font-size:12px;padding:10px 15px}.tt-brand>span:last-child{display:none}.lobby-profile .profile-name{display:none}.server-select{top:100px;right:20px;width:230px}.character-caption{left:23%;top:100px}.locker{left:20px;bottom:65px;width:285px}.server-art{height:100px}.lobby-footer-right>span{display:none}.lobby-footer b{display:none}}@media(max-height:620px){.locker{bottom:55px}.skin-choice img{height:40px}.callsign-label{display:none}.lobby-intro>p{display:none}.level-card{margin-top:10px}.server-art{height:75px}.server-rule{margin:10px 0}.join-button{height:45px;font-size:23px}.server-select{top:13%}.lobby-intro{top:17%}.lobby-intro h1{font-size:48px}.extra-stats{display:none}}
.equipment-layer{position:fixed;inset:0;display:grid;place-items:center;background:#0002;z-index:35;font-family:Tahoma,Arial,sans-serif}.equipment-window{width:min(660px,94vw);color:#ddd}.equipment-tabs{display:flex;gap:3px;padding:9px 10px 0}.equipment-tabs button{padding:5px 10px;border:1px solid #888;background:#626667;color:#ddd;font-size:12px}.equipment-tabs button[aria-selected=true]{background:#858889;color:#fff}.equipment-shop{display:grid;grid-template-columns:330px 1fr;gap:15px;padding:14px;background:#333;margin:0 10px;min-height:350px}.equipment-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;align-content:start;max-height:360px;overflow-y:auto;padding:3px}.equipment-item{position:relative;height:79px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:3px;background:#4e5152;border:1px solid #8c9091;color:#eee;cursor:pointer}.equipment-item.selected{outline:2px solid #f0cc40}.equipment-item.unavailable{opacity:.55}.equipment-item small{font:9px/1.2 Tahoma;text-align:center;margin-top:5px}.equipment-item>b{position:absolute;top:2px;right:3px;color:#91dd8f}.equip-glyph{font:bold 22px Arial;color:#e7e7e7;text-shadow:1px 2px #111}.equipment-description h3{font-size:17px;margin:12px 0 7px}.equipment-description small{font-size:10px;color:#aaa}.equipment-description p{font-size:12px;line-height:1.6;margin-top:17px}#equipmentPreview{width:70px;height:70px;background:#505555;border:1px solid #888;display:grid;place-items:center;font:bold 28px Arial}.equipment-description .blocked{color:#e5a488}.equipment-description .available{color:#a7d29a}.equipment-footer{padding:12px 10px;display:flex;align-items:center;gap:10px}.equipment-footer>b{font-size:13px;white-space:nowrap;color:#eee}.equipment-footer>span{font-size:10px;color:#bbb;flex:1}.equipment-footer button,.equipment-owned button,.equipment-transfer button{font:11px Tahoma;padding:6px 12px;color:#222}.equipment-footer button:disabled{color:#999}.equipment-owned,.equipment-transfer{background:#333;margin:0 10px;min-height:350px;padding:18px;max-height:385px;overflow:auto}.equipment-owned>div{display:grid;grid-template-columns:1fr auto;gap:5px;margin-bottom:15px;border-bottom:1px solid #555;padding-bottom:14px}.equipment-owned strong{font-size:13px}.equipment-owned span{grid-row:2;font-size:11px;color:#aaa}.equipment-owned button{grid-column:2;grid-row:1/3}.equipment-transfer{font-size:12px}.equipment-transfer label{display:block;margin-bottom:18px}.equipment-transfer input,.equipment-transfer select{display:block;margin-top:7px;padding:6px;width:100%;max-width:280px}.equipment-layer[data-role=Traitor] .derma-title{border-bottom:2px solid #a34040}.equipment-layer[data-role=Detective] .derma-title{border-bottom:2px solid #477dc4}#textChat{position:fixed;left:12px;bottom:154px;width:min(560px,80vw);z-index:30;font:13px/1.5 Tahoma,Arial,sans-serif;text-shadow:1px 1px #000;pointer-events:none}#chatLines{max-height:175px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}.chat-line{overflow-wrap:anywhere;flex-shrink:0}.chat-line b{color:#a8dd88}.chat-line.Traitor b{color:#ff7373}.chat-line.Detective b{color:#88b6ff}.chat-line.spectator b{color:#aaa}.chat-line.old{display:none}.editing #chatLines{background:#0009;padding:10px;overflow:auto;display:block;pointer-events:auto}.editing .chat-line.old{display:block}#chatForm{display:flex;align-items:center;background:#303030ed;margin-top:4px;border:1px solid #888;padding:6px;gap:8px;pointer-events:auto}#chatForm input{flex:1;width:0;min-width:0;background:transparent;border:none;outline:none;color:#fff;font:13px Tahoma}#chatForm button{background:#666;color:#fff;border:1px solid #999;padding:3px 7px;font:11px Tahoma}#chatForm>span{font:9px Tahoma;color:#999}.c4-panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:40;width:360px;padding:16px;background:#555;color:#eee;border:4px solid #888;font:12px Tahoma;box-shadow:0 12px 50px #0008}.c4-panel h3{margin-top:0}.c4-panel label{display:block;margin:10px 0}.c4-panel input{width:85px;margin-left:10px}.c4-panel button{padding:7px 10px;margin:4px;color:#222}.c4-wires{display:flex;justify-content:space-between}.c4-wires button{border-top:5px solid #a34c46}#c4Status{min-height:16px}@media(max-width:650px){.equipment-shop{grid-template-columns:1fr 1fr;gap:10px;padding:8px}.equipment-grid{grid-template-columns:repeat(3,1fr)}.equipment-footer>span{display:none}.equipment-item{height:68px}.equipment-item small{font-size:8px}}
.server-art{background-image:linear-gradient(0deg,#200912aa,transparent 70%),url('/assets/lobby-map.png');background-size:cover;background-position:center 50%}.server-art:before,.server-art .mini-lighthouse,.server-art .block-island{display:none}
.equip-glyph{width:46px;height:46px;object-fit:contain}#equipmentPreview img{width:64px;height:64px;object-fit:contain}

/* Lobby controls must not inherit the in-game Derma bevel or hover gradient. */
#lobby button{appearance:none;background-image:none;box-shadow:none;text-shadow:none;font-family:Arial,Helvetica,sans-serif;cursor:pointer;transition:background-color .16s,border-color .16s,box-shadow .16s,transform .16s}
#lobby button:hover{background-image:none}
#lobby button:active{background-image:none;box-shadow:none}
#lobby button:disabled{cursor:default;opacity:.5}
#lobby .lobby-top{background:linear-gradient(180deg,#101114f5,#10111490);border-bottom:1px solid #ffffff0c}
#lobby .lobby-nav{transform:none;border-radius:6px;background:transparent;color:#afb0b8;letter-spacing:1px;font-size:13px}
#lobby .lobby-nav:hover{background:#ffffff0d;color:#fff}
#lobby .lobby-nav.selected{background:#aa2334;box-shadow:inset 0 -2px #e95060;color:#fff}
#lobby .lobby-intro h1{text-shadow:0 4px 28px #0006;font-style:normal;letter-spacing:-3px}
#lobby .level-card{background:linear-gradient(135deg,#25262bea,#15161bec);border:1px solid #ffffff18;border-radius:10px;box-shadow:0 12px 35px #0003}
#lobby .level-label b{color:#f1f1f4}
#lobby .character-check{background:#242a28;color:#a9d6b4;border:1px solid #a9d6b433;border-radius:8px}
#lobby .character-caption{padding:10px 16px;background:#1415198c;border:1px solid #ffffff0c;border-radius:10px}
#lobby .server-heading{margin-bottom:12px;gap:16px}
#lobby .server-heading h2{margin-bottom:0;font-style:normal;font-size:27px;letter-spacing:-.5px}
#lobby #refreshServers{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;min-height:40px;padding:0;background:#23252c;border:1px solid #ffffff1a;border-radius:8px;color:#bcbfc8}
#lobby #refreshServers:hover{background:#34363f;border-color:#ffffff40;color:#fff}
#lobby #refreshServers:active{transform:rotate(-20deg)}
#lobby .server-card{background:#191b20!important;border:1px solid #ab3a4780;border-radius:12px;box-shadow:0 16px 40px #0004}
#lobby .server-card:hover{border-color:#ed6170;box-shadow:0 16px 40px #0005}
#lobby .server-art{border-bottom:1px solid #ffffff0c}
#lobby .server-status{border-radius:4px;padding:6px 8px}
#lobby .join-button{transform:none;border-radius:8px;background:#bd293d;font-style:normal;font-size:19px;letter-spacing:.5px;border:1px solid #f46b7844;box-shadow:0 8px 24px #a614252b}
#lobby .join-button:hover:not(:disabled){background:#d6354a;transform:translateY(-1px);filter:none;box-shadow:0 10px 28px #a6142545}
#lobby .join-button:active:not(:disabled){transform:translateY(0);background:#a92335}
#lobby .join-button:disabled{background:#34353d;color:#a5a6af!important;filter:none;transform:none;box-shadow:none;border-color:#ffffff10}
#lobby .skin-choice{background:#23252b;border:1px solid #ffffff16;border-radius:8px;box-shadow:none}
#lobby .skin-choice:hover{background:#34363e;border-color:#ffffff45;transform:translateY(-2px)}
#lobby .skin-choice.selected{border-color:#e55061;box-shadow:0 0 0 1px #e55061}
#lobby .skin-choice span{background:#141519}
#lobby .text-button{border-radius:5px;text-decoration:none;color:#c6c6ce!important}
#lobby .text-button:hover,#lobby .lobby-footer button:hover{background:#ffffff0d;color:#fff!important}
#lobby .lobby-footer{background:#101115e8;border-color:#ffffff0c;color:#999ca6}
#lobby #menuMusic{background:#24262c!important;border:1px solid #ffffff1a!important;color:#bbbfc8!important;box-shadow:none}
#lobby #menuMusic:hover{background:#34363e!important}
#lobby .lobby-help section{background:#1b1d23;border:1px solid #ffffff20;border-radius:12px}
@media(prefers-reduced-motion:reduce){#lobby button{transition:none}}