:root{--bg:#06110d;--panel:rgba(12,31,24,.82);--line:rgba(134,255,205,.15);--mint:#44f2ae;--mint2:#b5ffdf;--text:#effff8;--muted:#8aa99c;--red:#ff617e;--blue:#62a8ff;--shadow:0 24px 80px rgba(0,0,0,.4)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,"Microsoft YaHei",system-ui,sans-serif}body{overflow-x:hidden;background-image:linear-gradient(rgba(60,150,110,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(60,150,110,.035) 1px,transparent 1px);background-size:42px 42px}button,input{font:inherit}.hidden{display:none!important}.ambient{position:fixed;border-radius:50%;filter:blur(100px);pointer-events:none;opacity:.22}.ambient-a{width:520px;height:520px;background:#00e98b;left:-230px;top:160px}.ambient-b{width:580px;height:580px;background:#1784ff;right:-330px;top:-190px}.lobby-shell{width:min(1180px,calc(100% - 36px));margin:auto;padding:34px 0 64px;position:relative}.brand-row{display:flex;align-items:center;gap:16px;margin-bottom:38px}.brand-row h1{font-size:24px;letter-spacing:.06em;margin:1px 0 0}.brand-row h1 span{color:var(--muted);font-weight:500;font-size:13px;margin-left:8px}.eyebrow,.kicker{margin:0;color:var(--mint);font-size:10px;letter-spacing:.2em}.brand-mark{width:42px;height:42px;border:1px solid var(--line);border-radius:13px;display:flex;gap:3px;align-items:center;justify-content:center;transform:rotate(-8deg)}.brand-mark i{display:block;width:7px;height:7px;background:var(--mint);border-radius:50%;box-shadow:0 0 15px var(--mint)}.brand-mark i:nth-child(2){opacity:.75}.brand-mark i:nth-child(3){opacity:.45}.server-pill{margin-left:auto;background:rgba(10,25,20,.8);border:1px solid var(--line);padding:8px 13px;border-radius:30px;color:var(--muted);font-size:12px;display:flex;gap:8px;align-items:center}.server-pill b{width:7px;height:7px;border-radius:50%;background:#ffbd4a;box-shadow:0 0 8px currentColor}.server-pill.online b{background:var(--mint)}.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;margin-bottom:22px}.intro-card{padding:42px 36px;border-left:1px solid var(--line)}.intro-card h2{font-size:clamp(45px,6vw,76px);line-height:.95;letter-spacing:-.05em;margin:20px 0 24px}.intro-card h2 em{font-style:normal;color:var(--mint)}.intro-copy{color:var(--muted);max-width:620px;line-height:1.8;font-size:14px}.rule-chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.rule-chips span{border:1px solid var(--line);border-radius:20px;padding:7px 12px;color:var(--mint2);font-size:11px;background:rgba(68,242,174,.04)}.panel{background:linear-gradient(145deg,rgba(16,40,31,.88),rgba(8,23,18,.84));border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);backdrop-filter:blur(18px)}.control-card{padding:25px}.section-title{display:flex;gap:13px;align-items:center;margin-bottom:22px}.section-title>span{color:var(--mint);font:700 24px/1 monospace}.section-title div{display:flex;flex-direction:column}.section-title small{color:var(--muted);font-size:9px;letter-spacing:.16em}.section-title strong{font-size:15px;margin-top:3px}.field{display:block;margin:17px 0}.field>span{display:block;color:var(--muted);font-size:11px;margin-bottom:8px}.field input,.join-box input{width:100%;background:#07140f;border:1px solid var(--line);border-radius:10px;color:white;padding:12px 13px;outline:none}.field input:focus,.join-box input:focus{border-color:var(--mint);box-shadow:0 0 0 3px rgba(68,242,174,.08)}.segmented{display:grid;grid-template-columns:1fr 1fr;background:#07140f;padding:4px;border-radius:11px}.segmented button{border:0;color:var(--muted);background:transparent;padding:9px;border-radius:8px;cursor:pointer}.segmented button.active{background:rgba(68,242,174,.13);color:var(--mint)}.switch-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:18px;margin-top:20px;cursor:pointer}.switch-row span{display:flex;flex-direction:column}.switch-row b{font-size:12px}.switch-row small{color:var(--muted);font-size:9px;margin-top:4px}.switch-row input{display:none}.switch-row i{width:42px;height:23px;border-radius:20px;background:#24372f;position:relative;transition:.2s}.switch-row i:after{content:"";position:absolute;width:17px;height:17px;border-radius:50%;background:#8aa99c;left:3px;top:3px;transition:.2s}.switch-row input:checked+i{background:rgba(68,242,174,.28)}.switch-row input:checked+i:after{left:22px;background:var(--mint)}.mode-section{padding:28px}.mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.mode-card{position:relative;text-align:left;min-height:126px;padding:17px;background:rgba(5,18,13,.68);border:1px solid var(--line);border-radius:14px;color:white;cursor:pointer;overflow:hidden;transition:.2s}.mode-card:hover{transform:translateY(-2px);border-color:rgba(68,242,174,.45)}.mode-card.active{border-color:var(--mint);background:linear-gradient(145deg,rgba(68,242,174,.15),rgba(7,22,16,.9));box-shadow:inset 0 0 24px rgba(68,242,174,.05)}.mode-card i{position:absolute;right:12px;top:8px;color:rgba(181,255,223,.15);font:700 33px monospace}.mode-card b,.mode-card small,.mode-card em{display:block;position:relative}.mode-card b{font-size:15px;margin-top:8px}.mode-card small{color:var(--muted);font-size:10px;margin-top:8px}.mode-card em{font-style:normal;color:var(--mint);font:700 8px monospace;letter-spacing:.12em;margin-top:17px}.mode-card.wide{grid-column:span 2;background-image:linear-gradient(100deg,rgba(255,95,122,.08),transparent)}.mode-card.wide.active{border-color:#ff8aa0}.action-row{display:flex;gap:10px;margin-top:22px}.primary-action,.secondary-action,.join-box button{border:0;border-radius:11px;cursor:pointer;font-weight:700}.primary-action{min-width:210px;background:var(--mint);color:#04150e;padding:14px 18px;display:flex;align-items:center;justify-content:center;gap:18px;box-shadow:0 10px 30px rgba(68,242,174,.18)}.primary-action:hover{background:#7effc7}.secondary-action{background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--text);padding:13px 18px}.join-box{display:flex;margin-left:auto;gap:7px}.join-box input{width:130px;text-transform:uppercase;letter-spacing:.17em;text-align:center}.join-box button{background:rgba(68,242,174,.12);color:var(--mint);padding:0 18px}.error-line{min-height:18px;color:#ff8da1;font-size:11px;margin:12px 0 0}.game-shell{position:fixed;inset:0;background:#071510;overflow:hidden}.game-shell canvas#arena{position:absolute;width:100%;height:100%;touch-action:none}.game-topbar{position:absolute;left:18px;right:18px;top:16px;height:52px;display:flex;align-items:center;gap:10px;pointer-events:none}.game-topbar>*{pointer-events:auto}.icon-button{width:43px;height:43px;border:1px solid var(--line);background:rgba(5,17,13,.8);border-radius:12px;color:white;font-size:19px}.room-label{display:flex;align-items:center;gap:8px;background:rgba(5,17,13,.78);border:1px solid var(--line);border-radius:12px;padding:8px 12px}.room-label small{color:var(--muted);font-size:8px}.room-label b{letter-spacing:.14em;font-family:monospace}.room-label button{border:0;background:transparent;color:var(--mint);font-size:9px;cursor:pointer}.timer{position:absolute;left:50%;transform:translateX(-50%);font:800 28px monospace;background:rgba(5,17,13,.75);padding:8px 17px;border:1px solid var(--line);border-radius:12px}.latency{margin-left:auto;color:var(--mint);font-size:11px;background:rgba(5,17,13,.75);padding:10px;border-radius:10px;border:1px solid var(--line)}.scoreboard{position:absolute;right:18px;top:82px;width:220px;background:rgba(5,17,13,.77);border:1px solid var(--line);border-radius:15px;padding:12px;backdrop-filter:blur(12px)}.team-row{padding:9px 8px;border-bottom:1px solid var(--line)}.team-row:last-child{border:0}.team-head{display:flex;justify-content:space-between;font-size:11px}.team-head b{font-family:monospace}.team-bar{height:3px;background:rgba(255,255,255,.08);margin-top:7px;border-radius:5px;overflow:hidden}.team-bar i{display:block;height:100%}.self-stats{position:absolute;left:18px;bottom:20px;display:flex;background:rgba(5,17,13,.8);border:1px solid var(--line);border-radius:13px;padding:10px 5px}.self-stats span{padding:0 13px;color:var(--muted);font-size:9px;border-right:1px solid var(--line)}.self-stats span:last-child{border:0}.self-stats b{display:block;color:white;font:700 17px monospace;margin-top:2px}.center-message{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);text-align:center;background:rgba(5,17,13,.8);border:1px solid var(--line);border-radius:17px;padding:20px 30px;backdrop-filter:blur(12px);transition:.2s}.center-message b,.center-message span{display:block}.center-message b{font-size:24px}.center-message span{color:var(--muted);font-size:11px;margin-top:7px}.center-message.off{opacity:0;pointer-events:none}.minimap{position:absolute;right:18px;bottom:20px;width:180px;height:112px;background:rgba(5,17,13,.8);border:1px solid var(--line);border-radius:12px}.desktop-hint{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:var(--muted);font-size:10px;background:rgba(5,17,13,.7);padding:8px 12px;border-radius:20px}.desktop-hint b{color:var(--mint);margin-left:10px}.touch-controls{display:none}.result-dialog{border:1px solid rgba(68,242,174,.3);border-radius:24px;background:#0a1b14;color:white;box-shadow:0 30px 100px #000;padding:42px;text-align:center;min-width:min(440px,calc(100vw - 30px));overflow:hidden}.result-dialog::backdrop{background:rgba(1,8,5,.78);backdrop-filter:blur(8px)}.result-dialog p{color:var(--mint);font:700 9px monospace;letter-spacing:.2em}.result-dialog h2{font-size:45px;margin:14px}.result-dialog table{width:100%;border-collapse:collapse;color:var(--muted);font-size:11px}.result-dialog td{padding:8px;border-bottom:1px solid var(--line)}.result-actions{display:flex;gap:9px;justify-content:center;margin-top:25px}.result-actions .primary-action{min-width:150px}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);opacity:0;background:#dfffee;color:#082016;padding:10px 15px;border-radius:10px;font-size:11px;transition:.2s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:850px){.hero-grid{grid-template-columns:1fr}.intro-card{padding:20px}.mode-grid{grid-template-columns:repeat(2,1fr)}.action-row{flex-wrap:wrap}.join-box{margin-left:0;flex:1}.join-box input{flex:1}.scoreboard{width:180px}.desktop-hint{display:none}}
@media(pointer:coarse),(max-width:680px){.lobby-shell{width:calc(100% - 22px);padding-top:18px}.brand-row{margin-bottom:20px}.intro-card h2{font-size:48px}.mode-section{padding:17px}.mode-grid{grid-template-columns:1fr 1fr}.mode-card{min-height:115px;padding:13px}.mode-card.wide{grid-column:span 2}.action-row>.primary-action,.action-row>.secondary-action{flex:1;min-width:140px}.join-box{flex-basis:100%}.touch-controls{display:block}.joystick{position:absolute;left:28px;bottom:34px;width:132px;height:132px;border-radius:50%;border:1px solid rgba(181,255,223,.25);background:radial-gradient(circle,rgba(68,242,174,.12),rgba(5,17,13,.25));touch-action:none}.joystick i{position:absolute;inset:25%;border:1px dashed rgba(181,255,223,.18);border-radius:50%}.joystick b{position:absolute;width:52px;height:52px;left:40px;top:40px;border-radius:50%;background:rgba(68,242,174,.42);border:1px solid var(--mint);box-shadow:0 0 22px rgba(68,242,174,.24);transform:translate(0,0)}.boost-button{position:absolute;right:34px;bottom:44px;width:92px;height:92px;border-radius:50%;border:1px solid rgba(255,197,74,.5);background:rgba(255,174,45,.14);color:#ffd36b;touch-action:none}.boost-button i,.boost-button span{display:block}.boost-button i{font-size:27px;font-style:normal}.boost-button span{font-size:10px;margin-top:3px}.boost-button.active{background:rgba(255,174,45,.35);transform:scale(.96)}.self-stats{bottom:180px}.minimap{bottom:176px;width:130px;height:82px}.scoreboard{top:77px;right:10px;width:150px}.game-topbar{left:10px;right:10px}.room-label{display:none}.timer{font-size:22px}.latency{display:none}}