:root{--ink:#07171b;--panel:#102b30;--line:#2e6568;--paper:#e9f3df;--cyan:#65f2e3;--amber:#ffc857;--red:#ff4d5a;--muted:#91aaa6;--shadow:#02090a;--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow:hidden;background:var(--ink);color:var(--paper);font-family:"Trebuchet MS",Verdana,sans-serif}button,input{font:inherit}button{color:inherit;cursor:pointer}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 78% 18%,#173c42 0,transparent 34%),radial-gradient(circle at 8% 85%,#48252a 0,transparent 28%),linear-gradient(135deg,#061215,#0b2226);z-index:-3}.stars{position:fixed;inset:0;z-index:-2;opacity:.28;background-image:radial-gradient(#fff 1px,transparent 1px),radial-gradient(#65f2e3 1px,transparent 1px);background-size:83px 83px,137px 137px;background-position:0 0,31px 47px;animation:drift 28s linear infinite}@keyframes drift{to{transform:translate3d(-83px,83px,0)}}
.hidden{display:none!important}.panel{width:min(760px,calc(100vw - 32px));margin:5vh auto;padding:clamp(24px,5vw,58px);border:1px solid var(--line);border-radius:3px;background:linear-gradient(145deg,rgba(16,43,48,.96),rgba(6,20,23,.98));box-shadow:16px 16px 0 rgba(0,0,0,.25),inset 0 0 70px rgba(101,242,227,.03);position:relative}.panel:before,.modal:before{content:"";position:absolute;inset:8px;pointer-events:none;border:1px solid rgba(101,242,227,.12)}.gate{display:grid;grid-template-columns:1fr 1fr;gap:18px 34px;animation:arrive .6s cubic-bezier(.2,.9,.2,1)}@keyframes arrive{from{opacity:0;transform:translateY(22px) scale(.98)}}.brand-mark{position:absolute;right:34px;top:28px;width:64px;height:64px;border:2px solid var(--cyan);display:grid;place-items:center;font-weight:900;letter-spacing:-2px;transform:rotate(3deg)}.brand-mark span{color:var(--red)}.eyebrow{color:var(--cyan);letter-spacing:.17em;font-size:11px;font-weight:900;margin:0 0 9px}.gate>.eyebrow,.gate h1,.gate .lead,.gate .fine{grid-column:1/-1}.gate h1{font-family:Georgia,serif;font-weight:400;text-transform:uppercase;font-size:clamp(54px,10vw,98px);line-height:.72;letter-spacing:-.07em;margin:22px 0 14px}.gate h1 em{color:var(--red);font-style:italic;margin-left:.45em;text-shadow:3px 3px 0 #501b21}.lead{max-width:450px;color:#bdd0cb;font-size:17px}.gate label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}input{width:100%;margin-top:8px;border:1px solid var(--line);border-radius:2px;background:#06171a;color:var(--paper);padding:14px;outline:none}input:focus{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(101,242,227,.12)}.gate-actions{align-self:end}.primary,button{border:1px solid var(--line);background:#173b40;padding:13px 18px;border-radius:2px;font-weight:800;letter-spacing:.04em}.primary{background:var(--cyan);color:var(--ink);border-color:var(--cyan);box-shadow:4px 4px 0 #28766f}.primary:hover{transform:translate(1px,1px);box-shadow:3px 3px 0 #28766f}.gate-actions>.primary{width:100%;margin-bottom:10px}.join-row{display:grid;grid-template-columns:1fr auto;gap:8px}.join-row input{margin:0;text-transform:uppercase;letter-spacing:.2em}.fine{color:#668581;font-size:12px;margin-bottom:-18px}
.lobby{margin-top:8vh}.lobby-head,.lobby-foot{display:flex;align-items:center;justify-content:space-between;gap:20px}.lobby h2{font-family:Georgia,serif;font-weight:400;font-size:31px;margin:0}.room-code{font-family:monospace;color:var(--amber);background:transparent;border:0;font-size:1em;padding:5px;letter-spacing:.12em}.signal{color:var(--red);font-size:11px;font-weight:900;letter-spacing:.2em}.signal:before{content:"";display:inline-block;width:8px;height:8px;background:var(--red);border-radius:50%;margin-right:8px;animation:pulse 1.2s infinite}@keyframes pulse{50%{opacity:.2}}.roster{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:36px 0}.crew-card{display:flex;align-items:center;gap:13px;border-bottom:1px solid var(--line);padding:10px}.helmet{width:30px;height:30px;border-radius:50% 50% 42% 42%;background:var(--c);box-shadow:inset -8px -4px rgba(0,0,0,.25)}.crew-card small{color:var(--amber)}.crew-card.offline{opacity:.42}
.game{position:fixed;inset:0;background:#061316}.game canvas{width:100%;height:100%;display:block}.hud-top{position:absolute;top:0;left:0;right:0;padding:16px clamp(14px,3vw,38px);display:grid;grid-template-columns:1fr minmax(180px,360px) auto;gap:28px;align-items:center;background:linear-gradient(#041012eb,transparent);pointer-events:none}.hud-top>*{pointer-events:auto}.mission b{display:block;color:var(--cyan);font-family:Georgia,serif;font-size:20px;letter-spacing:.08em}.mission span,.task-meter span{font-size:10px;letter-spacing:.1em;color:var(--muted)}.task-meter{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px}.task-meter>div{height:9px;background:#10292e;border:1px solid #31585b}.task-meter i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--cyan),var(--amber));transition:width .4s}.task-meter strong{font-size:11px}.icon-button{border-radius:50%;padding:8px;width:39px;height:39px}.task-list{position:absolute;left:20px;top:96px;max-width:265px;padding:12px 15px;background:#07191cdd;border-left:3px solid var(--amber);font-size:12px}.task-item{margin:7px 0;color:#c8d7d2}.task-item.done{text-decoration:line-through;color:#58736f}.room-chip{position:absolute;right:18px;top:90px;background:#061719cc;border:1px solid var(--line);padding:8px 10px;font:700 12px monospace;letter-spacing:.13em}.action-stack{position:absolute;right:clamp(16px,4vw,50px);bottom:calc(22px + var(--safe-bottom));display:flex;gap:12px;align-items:flex-end}.round-action{width:88px;height:88px;border-radius:50%;padding:6px;background:#173d42;border:3px solid #52777a;font-size:11px;box-shadow:0 7px 0 #061012}.round-action.ready{border-color:var(--amber);color:var(--amber);animation:actionGlow 1.3s infinite}@keyframes actionGlow{50%{box-shadow:0 7px 0 #061012,0 0 25px #ffc85766}}.round-action.danger{background:#681c26;border-color:var(--red)}.round-action.report{background:#7c5419;border-color:var(--amber)}.joystick{display:none;position:absolute;left:24px;bottom:calc(25px + var(--safe-bottom));width:126px;height:126px;border-radius:50%;border:2px solid #84aaa744;background:#0d2c3077;touch-action:none}.joystick:after{content:"";position:absolute;inset:41%;border-radius:50%;background:#65f2e344}.joystick #stick{position:absolute;left:35px;top:35px;width:56px;height:56px;border-radius:50%;background:#8cf8ebcc;border:2px solid white;box-shadow:0 5px 15px #0008}
::backdrop{background:#02090bd9;backdrop-filter:blur(5px)}dialog{border:0;padding:0;background:transparent;color:var(--paper);max-width:none}.modal{width:min(720px,calc(100vw - 24px));position:relative;background:linear-gradient(145deg,#12383d,#07191d);border:1px solid var(--line);padding:32px;box-shadow:12px 12px 0 #0006}.modal h2{font-family:Georgia,serif;font-weight:400;font-size:32px;margin:3px 0 22px}.close{position:absolute;right:13px;top:13px;border:0;background:transparent;font-size:28px}.frequency{padding:24px;border:1px solid var(--line);background:#061719}.frequency output{display:block;text-align:center;color:var(--amber);font:48px Georgia,serif}.frequency input{accent-color:var(--cyan)}.frequency button,.wire-task button{width:100%;margin-top:14px}.wire-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.wire{height:90px;text-transform:uppercase}.wire[data-color=cyan]{border-color:#5de2ff}.wire[data-color=amber]{border-color:#ffc857}.wire[data-color=lime]{border-color:#73f0a7}.wire.used{opacity:.25}.wire-sequence{height:44px;border-bottom:1px solid var(--line);color:var(--cyan);padding:10px}.meeting-modal{width:min(920px,calc(100vw - 24px));height:min(680px,calc(100vh - 24px));display:flex;flex-direction:column}.meeting-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:18px;min-height:0;flex:1}.vote-list{overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start}.vote{display:flex;align-items:center;gap:8px;text-align:left;padding:10px}.vote.dead{opacity:.35;text-decoration:line-through}.chat{display:flex;min-height:0;flex-direction:column;border-left:1px solid var(--line);padding-left:18px}.messages{flex:1;overflow:auto;background:#06171a;padding:12px}.message{margin-bottom:10px;font-size:13px}.message b{color:var(--cyan)}#chatForm{display:grid;grid-template-columns:1fr auto;gap:7px}#chatForm input{margin:7px 0 0}.meeting-result{padding:15px;background:var(--amber);color:var(--ink);font-size:20px;margin-bottom:16px}.end-modal{text-align:center}.end-modal h2{font-size:48px;color:var(--amber)}.end-modal button{margin:8px}#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--red);color:#fff;padding:11px 18px;opacity:0;pointer-events:none;transition:.2s;z-index:30;max-width:90vw}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){.panel{margin:14px auto;padding:25px}.gate{display:block;height:calc(100dvh - 28px);overflow:auto}.gate h1{font-size:57px;margin-top:45px}.gate label{display:block;margin:24px 0 14px}.fine{margin:18px 0}.roster{grid-template-columns:1fr;margin:24px 0}.lobby{height:calc(100dvh - 28px);overflow:auto}.lobby-head,.lobby-foot{align-items:flex-start;flex-direction:column}.hud-top{grid-template-columns:1fr auto;padding:10px 12px}.task-meter{grid-column:1/-1;grid-row:2;order:3}.task-list{top:96px;left:8px;max-width:220px}.room-chip{top:98px;right:8px}.joystick{display:block}.action-stack{right:14px}.round-action{width:72px;height:72px;font-size:9px}.meeting-modal{padding:22px 14px}.meeting-grid{grid-template-columns:1fr;grid-template-rows:auto 1fr}.vote-list{grid-template-columns:1fr 1fr;max-height:210px}.chat{border-left:0;border-top:1px solid var(--line);padding:12px 0 0}.modal h2{font-size:26px}}
@media(pointer:fine){.joystick{display:none}}