@import url("https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Roboto+Condensed:wght@400;600;700&display=swap");:root{--bg:#252a31;--bg-deep:#1c2026;--panel:#343a43;--panel-dark:#2a3038;--panel-light:#414852;--line:#15191e;--line-soft:#59616c;--text:#f3f5f7;--muted:#a8b0b9;--orange:#ff592b;--orange-dark:#d9441d;--green:#83c93e;--blue:#35a7d9}*{box-sizing:border-box}body,html{margin:0;min-height:100%;background:#1b1f24;color:var(--text)}body,button,input{font-family:Roboto Condensed,Arial,sans-serif}button{color:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.boot-screen{min-height:100vh;display:grid;place-content:center;justify-items:center;grid-gap:12px;gap:12px;background:#20252b;letter-spacing:.12em}.boot-logo{width:70px;height:70px;display:grid;place-items:center;background:var(--orange);border:3px solid #111;box-shadow:5px 5px 0 #111;font:700 25px Rajdhani}.boot-screen span{color:var(--muted);font-size:12px}.game-shell{min-height:100vh;background:linear-gradient(hsla(0,0%,100%,.018) 1px,transparent 1px),linear-gradient(90deg,hsla(0,0%,100%,.018) 1px,transparent 1px),var(--bg);background-size:26px 26px;display:flex;flex-direction:column}.bottom-bar,.top-bar{min-height:64px;background:#1c2026;border-bottom:2px solid #11151a;box-shadow:0 2px 0 #3e454e;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.bottom-bar{min-height:38px;border-top:2px solid #11151a;border-bottom:0;box-shadow:inset 0 1px 0 #3e454e;color:#929aa4;font:600 11px Rajdhani;letter-spacing:.08em}.game-title{display:flex;align-items:center;gap:12px}.game-title>div:last-child{display:grid}.game-title strong{font:700 22px Rajdhani;letter-spacing:.08em;line-height:1}.game-title span{color:#8f98a3;font:600 10px Rajdhani;letter-spacing:.13em;margin-top:3px}.game-emblem{width:40px;height:40px;display:grid;place-items:center;background:var(--orange);border:2px solid #111;box-shadow:3px 3px 0 #101318;font:700 17px Rajdhani}.top-status{display:flex;align-items:center;gap:10px;color:#aab2bb;font:600 11px Rajdhani;letter-spacing:.08em}.online-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px #72d32a}.square-button{width:38px;height:34px;display:grid;place-items:center;border:1px solid #12161b;background:#30363e;box-shadow:inset 0 1px 0 #555e69,2px 2px 0 #14181d}.square-button:hover{background:#3b424b}.lobby-layout{width:min(1420px,calc(100% - 40px));margin:24px auto;flex:1 1;display:grid;grid-template-columns:280px minmax(480px,1fr) 300px;grid-gap:14px;gap:14px;align-items:stretch}.game-panel{background:var(--panel);border:2px solid var(--line);box-shadow:inset 0 1px 0 #626a75,5px 5px 0 rgba(12,15,18,.55);min-height:610px}.panel-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:2px solid #171b20}.panel-tabs button{height:43px;border:0;border-right:1px solid #181d22;background:#292f36;color:#aeb6c0;font:700 13px Rajdhani;letter-spacing:.08em}.panel-tabs button.active{background:#3d444d;color:#fff;box-shadow:inset 0 -3px var(--orange)}.account-panel{display:flex;flex-direction:column}.player-card{margin:20px;padding:14px;display:flex;align-items:center;gap:12px;background:#292f36;border:1px solid #171b20;box-shadow:inset 0 1px 0 #4b535d}.player-avatar{position:relative;width:56px;height:56px;display:grid;place-items:center;background:#444b55;border:2px solid #181c21}.player-avatar img{width:100%;height:100%;object-fit:cover}.presence{position:absolute;right:-3px;bottom:-3px;width:13px;height:13px;background:var(--green);border:2px solid #20252b}.player-card>div:last-child{display:grid}.player-card strong{font:700 18px Rajdhani}.player-card span{color:var(--muted);font-size:12px}.player-stats{margin:0 20px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #171b20}.player-stats div{padding:12px 8px;display:grid;text-align:center;background:#2b3138;border-right:1px solid #171b20}.player-stats div:last-child{border-right:0}.player-stats span{color:#949da7;font:600 10px Rajdhani;letter-spacing:.08em}.player-stats strong{font:700 20px Rajdhani}.account-message{margin:18px 20px;padding:13px;display:flex;gap:10px;color:#bac1c8;background:#2a3037;border-left:3px solid var(--blue);font-size:12px;line-height:1.45}.account-message p{margin:0}.account-panel .menu-button{margin:0 20px 10px}.panel-heading{height:70px;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;background:#2a3037;border-bottom:2px solid #171b20}.panel-heading span{color:#a0a9b3;font:600 10px Rajdhani;letter-spacing:.12em}.panel-heading h1,.panel-heading h2{margin:2px 0 0;font:700 25px Rajdhani;letter-spacing:.05em}.panel-heading.compact h2{font-size:21px}.browser-panel{display:flex;flex-direction:column}.primary-actions{display:grid;grid-template-columns:1fr 1fr;grid-gap:10px;gap:10px;padding:14px;border-bottom:2px solid #171b20;background:#30363e}.play-button,.spectate-button{min-height:62px;border:2px solid #13171b;display:flex;align-items:center;justify-content:center;gap:12px;text-align:left;box-shadow:inset 0 1px 0 hsla(0,0%,100%,.25),3px 3px 0 #171b20}.play-button{background:var(--green);color:#15200d}.play-button:hover{background:#93dc49}.spectate-button{background:#399dc7;color:#071b24}.spectate-button:hover{background:#47add8}.play-button span,.spectate-button span{display:grid}.play-button strong,.spectate-button strong{font:700 18px Rajdhani}.play-button small,.spectate-button small{font-size:11px;opacity:.78}.server-row,.server-table-head{display:grid;grid-template-columns:minmax(190px,1.7fr) 1fr 90px 75px;align-items:center}.server-table-head{min-height:34px;padding:0 12px;background:#22272d;border-bottom:1px solid #11151a;color:#8e98a3;font:600 10px Rajdhani;letter-spacing:.08em}.server-list{flex:1 1;min-height:355px;background:#2b3138;overflow-y:auto}.server-row{width:100%;min-height:43px;padding:0 12px;border:0;border-bottom:1px solid #1a1f24;background:#343a42;color:#d9dde2;text-align:left;font-size:13px}.server-row:nth-child(2n){background:#30363d}.server-row:hover{background:#424a54}.server-row.selected{background:#4b535e;box-shadow:inset 4px 0 var(--orange)}.server-name{display:flex;align-items:center;gap:9px;font-weight:700}.good-ping{color:#98db54}.empty-list,.no-selection{min-height:100%;display:grid;place-content:center;justify-items:center;grid-gap:9px;gap:9px;text-align:center;color:#9099a3;padding:28px}.empty-list strong,.no-selection strong{color:#d9dde2;font:700 18px Rajdhani}.empty-list span,.no-selection span{max-width:260px;font-size:12px;line-height:1.45}.browser-footer{height:34px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border-top:2px solid #171b20;background:#22272d;color:#8e97a1;font:600 10px Rajdhani;letter-spacing:.08em}.details-panel{display:flex;flex-direction:column}.server-poster{position:relative;margin:16px;height:205px;overflow:hidden;display:grid;place-content:center;justify-items:center;grid-gap:4px;gap:4px;background:#222931;border:2px solid #15191e;box-shadow:inset 0 1px 0 #505964}.poster-grid{position:absolute;inset:0;opacity:.25;background-image:linear-gradient(#6c7784 1px,transparent 0),linear-gradient(90deg,#6c7784 1px,transparent 0);background-size:24px 24px;transform:perspective(180px) rotateX(50deg) scale(1.4);transform-origin:center bottom}.server-poster>:not(.poster-grid){position:relative;z-index:1}.server-poster svg{color:var(--orange);filter:drop-shadow(3px 3px 0 #111)}.server-poster strong{font:700 22px Rajdhani}.server-poster span{color:#aab2bc;font-size:12px}.detail-list{margin:0 16px 16px;border:1px solid #171b20}.detail-list div{min-height:42px;padding:0 11px;display:flex;justify-content:space-between;align-items:center;background:#2a3037;border-bottom:1px solid #171b20}.detail-list div:last-child{border-bottom:0}.detail-list span{color:#969fa9;font:600 10px Rajdhani;letter-spacing:.08em}.detail-list strong{font:700 13px Rajdhani}.ready{color:#9bdc57;display:flex;align-items:center;gap:5px}.details-panel .menu-button{margin:auto 16px 16px}.menu-button{min-height:43px;padding:0 15px;border:2px solid #15191e;display:flex;align-items:center;justify-content:center;gap:9px;font:700 13px Rajdhani;letter-spacing:.05em;box-shadow:inset 0 1px 0 hsla(0,0%,100%,.18),3px 3px 0 #171b20}.menu-button.orange{background:var(--orange)}.menu-button.orange:hover{background:#ff704a}.menu-button.dark{background:#2a3037}.menu-button.dark:hover{background:#3c444e}.menu-button.large{min-height:49px}.modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(10,12,15,.78);display:grid;place-items:center;padding:20px}.settings-window{width:min(760px,100%);background:#333941;border:2px solid #11151a;box-shadow:8px 8px 0 #11151a,inset 0 1px 0 #626b76}.settings-titlebar{min-height:50px;padding:0 12px 0 16px;display:flex;align-items:center;justify-content:space-between;background:#252a30;border-bottom:2px solid #15191e}.settings-titlebar>div{display:flex;align-items:center;gap:9px;font:700 16px Rajdhani;letter-spacing:.06em}.settings-content{display:grid;grid-template-columns:175px 1fr;min-height:390px}.settings-nav{padding:12px;background:#292f36;border-right:2px solid #181c21}.settings-nav button{width:100%;min-height:42px;padding:0 12px;border:0;display:flex;align-items:center;gap:8px;background:transparent;color:#aeb6bf;font:700 12px Rajdhani;text-align:left}.settings-nav button.active{background:#424a54;color:#fff;box-shadow:inset 3px 0 var(--orange)}.settings-form{padding:22px;display:grid;align-content:start;grid-gap:18px;gap:18px}.settings-form label{display:grid;grid-gap:7px;gap:7px}.settings-form label>span,.toggle-setting>span{color:#b3bbc4;font:700 11px Rajdhani;letter-spacing:.08em}.settings-form input:not([type]),.settings-form input[type=text]{min-height:40px;padding:0 11px;border:2px solid #181c21;background:#242a30;color:#fff;outline:0;box-shadow:inset 0 1px 4px #111}.range-line{display:grid;grid-template-columns:1fr 52px;grid-gap:12px;gap:12px;align-items:center}.range-line input{accent-color:var(--orange)}.range-line strong{text-align:right;font:700 14px Rajdhani}.toggle-setting{min-height:42px;padding:0;border:0;border-top:1px solid #20252b;display:flex;align-items:center;justify-content:space-between;background:transparent}.toggle-setting i{width:42px;height:22px;padding:3px;background:#1f242a;border:1px solid #111}.toggle-setting i b{display:block;width:14px;height:14px;background:#737d87;transition:transform .15s}.toggle-setting i.on{background:#5d872f}.toggle-setting i.on b{transform:translateX(19px);background:#b5ef79}.settings-actions{min-height:64px;padding:10px 14px;display:flex;justify-content:flex-end;gap:10px;background:#292f36;border-top:2px solid #181c21}.settings-actions .menu-button{min-width:145px}.game-wrap{position:fixed;inset:0;overflow:hidden;background:#101418}.game-wrap canvas{width:100%;height:100%;display:block}.game-hud{position:absolute;left:18px;top:18px;display:flex;align-items:stretch;gap:8px}.game-status-box{min-width:220px;padding:10px 13px;display:grid;background:rgba(31,36,42,.92);box-shadow:4px 4px 0 rgba(0,0,0,.55),inset 0 1px 0 #65707b}.game-status-box b{font:700 15px Rajdhani}.game-status-box span{color:#a5adb6;font-size:11px}.game-controls{position:absolute;left:18px;bottom:18px;padding:9px 12px;background:rgba(31,36,42,.92);border:2px solid #11151a;font:700 13px Rajdhani;box-shadow:3px 3px 0 rgba(0,0,0,.55)}.game-controls span{color:#a7afb8;margin-left:6px}.pause-overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(9,11,14,.7)}.pause-menu{width:min(360px,calc(100% - 30px));background:#343a43;border:2px solid #11151a;box-shadow:8px 8px 0 #101318,inset 0 1px 0 #68727e}.pause-menu h2{margin:0;padding:15px;background:#252a30;border-bottom:2px solid #13171b;font:700 23px Rajdhani;letter-spacing:.06em}.pause-menu-actions{padding:14px;display:grid;grid-gap:10px;gap:10px}.spinning{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}@media (max-width:1050px){.lobby-layout{grid-template-columns:250px 1fr}.details-panel{grid-column:1/-1;min-height:auto;display:grid;grid-template-columns:270px 1fr auto;align-items:center}.details-panel .panel-heading{display:none}.server-poster{height:150px}.details-panel .menu-button{margin:16px;min-width:170px}}@media (max-width:760px){.top-bar{padding:0 12px}.top-status{font-size:0}.lobby-layout{width:calc(100% - 20px);grid-template-columns:1fr;margin:12px auto}.game-panel{min-height:auto}.account-panel{order:2}.browser-panel{order:1;min-height:600px}.details-panel{order:3;display:flex}.details-panel .panel-heading{display:flex}.server-row,.server-table-head{grid-template-columns:minmax(150px,1fr) 70px 65px}.server-row>span:nth-child(2),.server-table-head span:nth-child(2){display:none}.primary-actions{grid-template-columns:1fr}.bottom-bar span:nth-child(2){display:none}.settings-content{grid-template-columns:1fr}.settings-nav{display:flex;overflow-x:auto;border-right:0;border-bottom:2px solid #181c21}.settings-nav button{min-width:130px}}.settings-select{width:100%;min-height:40px;border:2px solid #181c21;background:#242a30;color:#fff;font:600 13px Rajdhani,sans-serif;letter-spacing:.04em;outline:0;cursor:pointer;box-shadow:inset 0 1px 4px #111;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a8b0b9' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 10px center;padding:0 32px 0 11px}.settings-select:focus{border-color:var(--orange)}.color-picker-row{display:flex;align-items:center;gap:10px;margin-top:2px}.color-swatch{width:32px;height:32px;padding:0;border:2px solid #11151a;box-shadow:2px 2px 0 #101318,inset 0 1px 0 hsla(0,0%,100%,.3);transition:transform .1s ease,border-color .1s ease}.color-swatch:hover{transform:translateY(-2px)}.color-swatch.selected{border-color:#fff;outline:2px solid var(--orange);outline-offset:1px}.setting-info-box{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#272d34;border:1px solid #171b20;border-left:3px solid var(--orange);margin-top:4px}.setting-info-box span{color:#9aa3ae;font:700 11px Rajdhani,sans-serif;letter-spacing:.08em}.setting-info-box strong{color:#fff;font:700 13px Rajdhani,sans-serif}.game-status-box{min-width:180px;padding:8px 14px;display:flex;flex-direction:column;gap:4px;background:rgba(25,29,35,.92);border:2px solid #11151a;box-shadow:4px 4px 0 rgba(0,0,0,.55),inset 0 1px 0 #525c67}.hud-metrics{display:flex;align-items:center;gap:10px;font:700 15px Rajdhani,sans-serif;letter-spacing:.05em;color:#aeb6bf}.hud-metrics b{font-size:19px;color:#fff;margin-left:3px}.hud-divider{color:#4a525d;font-weight:400}.hud-room-id{color:#7d8793;font:600 10px Rajdhani,sans-serif;letter-spacing:.08em}