.screen{z-index:1;position:absolute;top:0;right:0;bottom:0;left:0;display:flex;transition:opacity .4s ease}.screen.hidden{opacity:0;pointer-events:none}.menu-screen{flex-direction:column;justify-content:center;padding-left:5%}.menu-buttons{display:flex;flex-direction:column;gap:.5vh;width:20%}.menu-btn{background:none;border:none;color:#fff;font-family:Special Elite,Courier New,monospace;font-size:1.8vw;font-weight:600;letter-spacing:.05vw;text-transform:uppercase;text-align:left;padding:1.8vh 2%;cursor:pointer;position:relative;transition:color .2s,transform .15s;display:block;width:100%;overflow:hidden}.menu-btn.typewriter{color:transparent}.menu-btn.typewriter.typing{color:#fff}.menu-btn:before{content:"";position:absolute;left:0;bottom:.3vh;width:0;height:2px;background:#e94560;transition:width .25s ease}.menu-btn:hover{color:#fff;transform:translate(.5%)}.menu-btn:hover:before{width:100%}.menu-btn:active{color:#e94560}.footer{position:absolute;bottom:0;right:0;padding:1.5% 2%;display:flex;flex-direction:column;align-items:flex-end;gap:.2vw;pointer-events:none}.footer>*{pointer-events:auto}.footer-text{font-size:.7vw;color:#7c7c7c;letter-spacing:.02vw}.team-screen{flex-direction:column;align-items:center;justify-content:center;gap:3vh}.team-header{font-size:1.5vw;font-weight:700;text-transform:uppercase;letter-spacing:.1vw;color:#e0e0e0;font-family:Special Elite,Courier New,monospace}.team-panels.tw-hidden,.team-screen .btn-back.tw-hidden{opacity:0;transition:opacity .4s ease}.team-panels.tw-visible,.team-screen .btn-back.tw-visible{opacity:1;transition:opacity .4s ease}.team-panels{display:flex;gap:3%;justify-content:center;align-items:center;width:100%;padding:0 5%}.team-banner{flex:1;max-width:35%;aspect-ratio:16 / 9;background:#0f346059;border:2px solid #1a4080;border-radius:.5%;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:border-color .25s,background .25s,transform .2s;gap:1vh;-webkit-user-select:none;user-select:none}.team-banner:hover{background:#0f34608c;transform:scale(1.02);border-color:var(--accent, #53a8e2)}.team-banner .team-name{font-size:2vw;font-weight:700;text-transform:uppercase;letter-spacing:.15vw;color:var(--accent, #e0e0e0)}.team-banner .team-desc{font-size:.8vw;color:#89a}.btn-back{background:none;border:1px solid #1a4080;color:#89a;font-family:Segoe UI,Arial,sans-serif;font-size:.9vw;padding:.8vh 1.5%;border-radius:.3%;cursor:pointer;text-transform:uppercase;letter-spacing:.05vw;transition:border-color .2s,color .2s}.btn-back:hover{border-color:#53a8e2;color:#e0e0e0}.settings-screen{flex-direction:row;align-items:stretch;justify-content:flex-start}.settings-nav{display:flex;flex-direction:column;justify-content:center;padding:4% 0 4% 5%;gap:.3vh;width:18%;flex-shrink:0}.settings-header{font-size:1.5vw;font-weight:700;text-transform:uppercase;letter-spacing:.1vw;color:#e0e0e0;margin-bottom:1.5vh}.settings-tab{background:none;border:none;color:#6a7a8a;font-family:Segoe UI,Arial,sans-serif;font-size:1.1vw;font-weight:600;letter-spacing:.05vw;text-transform:uppercase;text-align:left;padding:1vh 1%;cursor:pointer;position:relative;transition:color .2s;border-left:2px solid transparent}.settings-tab:hover{color:#c0c8d4}.settings-tab.active{color:#e0e0e0;border-left-color:#e94560}.settings-body{display:flex;flex-direction:column;justify-content:center;padding:4% 1.5%;width:50%;flex-shrink:0}.settings-panel{display:none;flex-direction:column;gap:.5vh}.settings-panel.active{display:flex}.setting-row{display:flex;align-items:center;padding:.8vh 1%;border-radius:.3%;cursor:pointer;transition:background .15s;gap:1%;-webkit-user-select:none;user-select:none}.setting-row:hover{background:#0f346059}.setting-row.active{background:#0f34608c;border-left:2px solid #e94560}.setting-label{font-size:.9vw;font-weight:600;color:#c0c8d4;text-transform:uppercase;letter-spacing:.03vw;white-space:nowrap;min-width:30%}.setting-current{font-size:.85vw;color:#89a;margin-left:auto}.setting-slider-wrap{display:flex;align-items:center;gap:.5%;margin-left:auto;width:40%}.setting-slider{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:.3vh;background:#1a4080;border-radius:2px;outline:none;cursor:pointer}.setting-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1vw;height:1vw;border-radius:50%;background:#e94560;cursor:pointer;border:none}.setting-slider::-moz-range-thumb{width:1vw;height:1vw;border-radius:50%;background:#e94560;cursor:pointer;border:none}.setting-value{font-size:.85vw;color:#89a;min-width:2.5%;text-align:right}.setting-toggle{width:3vw;height:1.5vw;background:#1a4080;border-radius:1vw;border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0;margin-left:auto}.setting-toggle:after{content:"";position:absolute;top:.2vw;left:.2vw;width:1.1vw;height:1.1vw;border-radius:50%;background:#556;transition:transform .2s,background .2s}.setting-toggle.on{background:#0f3460}.setting-toggle.on:after{transform:translate(1.5vw);background:#e94560}.settings-divider{height:1px;background:#1a4080;margin:.5vh 1%}.pick-panel{width:14%;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;padding:4% 1.5% 4% 0}.pick-list{display:none;flex-direction:column;gap:.2vh;background:#0a1a3099;border:1px solid #1a4080;border-radius:.4%;padding:.5%;max-height:50vh;overflow-y:auto}.pick-list.visible{display:flex}.pick-list::-webkit-scrollbar{width:.3vw}.pick-list::-webkit-scrollbar-track{background:transparent}.pick-list::-webkit-scrollbar-thumb{background:#0f3460;border-radius:2px}.pick-item{padding:.8vh 1%;border-radius:.3%;cursor:pointer;font-size:.85vw;color:#89a;transition:background .15s,color .15s;-webkit-user-select:none;user-select:none}.pick-item:hover{background:#0f346080;color:#c0c8d4}.pick-item.selected{background:#e9456026;color:#e94560;font-weight:600}.loading-screen{flex-direction:column;align-items:center;justify-content:center;gap:2vh}.radar{width:6vw;height:6vw;border-radius:50%;position:relative;background:radial-gradient(circle,#0028004d,#00140099);border:2px solid #1a4a1a;box-shadow:0 0 12px #0050004d,inset 0 0 20px #00280033;overflow:hidden}.radar:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:#0050004d}.radar:after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:#0050004d}.radar-ring{position:absolute;top:25%;right:25%;bottom:25%;left:25%;border-radius:50%;border:1px solid rgba(0,80,0,.25)}.radar-sweep{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;animation:radarSpin 2.5s linear infinite}.radar-sweep:before{content:"";position:absolute;top:50%;left:50%;width:50%;height:2px;transform-origin:left center;background:linear-gradient(90deg,#32dc32cc,#32dc3200)}.radar-sweep:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background:conic-gradient(from 0deg at 50% 50%,rgba(50,220,50,.15) 0deg,rgba(50,220,50,.05) 15deg,transparent 40deg,transparent 360deg)}.radar-blip{position:absolute;width:.3vw;height:.3vw;border-radius:50%;background:#32dc32;box-shadow:0 0 4px #32dc32;animation:blipFade 2.5s linear infinite}.blip-1{top:30%;left:60%;animation-delay:0s}.blip-2{top:55%;left:35%;animation-delay:.8s}.blip-3{top:25%;left:40%;animation-delay:1.6s}@keyframes radarSpin{to{transform:rotate(360deg)}}@keyframes blipFade{0%,10%{opacity:1}60%{opacity:.2}to{opacity:0}}.loading-text{font-size:.9vw;color:#fff;font-weight:700;letter-spacing:.05vw;text-transform:uppercase}.chat-container{display:flex;flex-direction:column;height:100%;position:relative}.tabs{display:flex;background:#16213e;border-bottom:1px solid #0f3460;flex-shrink:0;height:28px}.tab{flex:1;padding:6px 0;text-align:center;cursor:pointer;color:#89a;border-right:1px solid #0f3460;transition:background .2s,color .2s;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.tab:last-of-type{border-right:none}.btn-collapse{width:32px;flex-shrink:0;border:none;background:#0f3460;cursor:pointer;display:flex;align-items:center;justify-content:center}.btn-collapse svg{width:12px;height:12px;fill:none;stroke:#89a;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.btn-collapse:hover svg{stroke:#e0e0e0}.btn-collapse.collapsed svg{transform:rotate(180deg)}.chat-container.collapsed .chat-body,.chat-container.collapsed .input-bar{visibility:hidden;height:0;overflow:hidden;flex:0}.expand-overlay{display:none;position:absolute;top:0;left:0;right:0;bottom:0;background:#1a1a2e;z-index:50;align-items:center;justify-content:center;font-size:12px;color:#556;font-style:italic}.expand-overlay.visible{display:flex}.waiting-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#1a1a2e;z-index:100;display:flex;align-items:center;justify-content:center;font-size:13px;color:#556;font-style:italic}.waiting-overlay.hidden{display:none}.tab:hover{background:#1a2a4a;color:#c0d0e0}.tab.active{background:#0f3460;color:var(--tab-color, #e94560);border-bottom:2px solid var(--tab-color, #e94560)}.chat-body{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:4px}.chat-body::-webkit-scrollbar{width:4px}.chat-body::-webkit-scrollbar-track{background:#1a1a2e}.chat-body::-webkit-scrollbar-thumb{background:#0f3460;border-radius:2px}.message{padding:4px 8px;border-radius:4px;max-width:85%;word-wrap:break-word;line-height:1.4}.message .author{font-weight:700;margin-right:4px}.message.other{background:#16213e;align-self:flex-start}.message.self{background:#0f3460;align-self:flex-end}.message .author.team{color:#53a8e2}.message .author.enemy{color:#e94560}.message .author.system{color:#e9c46a}.no-messages{color:#556;text-align:center;margin-top:40px;font-style:italic}.input-bar{display:flex;background:#16213e;border-top:1px solid #0f3460;flex-shrink:0;align-items:center}.input-region{padding:4px 8px;color:#e94560;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;border-right:1px solid #0f3460;-webkit-user-select:none;user-select:none}.input-bar input{flex:1;padding:8px;background:#1a1a2e;border:none;color:#e0e0e0;font-size:12px;outline:none}.input-bar input::placeholder{color:#556}.input-bar button{padding:8px 14px;background:#e94560;border:none;color:#fff;font-weight:700;cursor:pointer;font-size:11px;text-transform:uppercase}.input-bar button:hover{background:#c73650}.inventory-container{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;height:100%;width:100%;margin:0 auto;padding:16px;gap:16px;background:transparent}.section-panel{position:relative;background:#1a1a2e;border-radius:6px;padding:10px;display:flex;flex-direction:column;gap:6px;flex:0 1 auto;width:40%;max-width:50%}.section-header{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#fff;padding:4px 0;border-bottom:1px solid #0f3460;margin-bottom:4px;display:flex;align-items:center;gap:8px}.section-header.equipment{color:#fff}.btn-sort{padding:2px 10px;border-radius:4px;border:none;background:#2196f3;color:#fff;font-size:10px;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;font-weight:600;transition:background .15s}.btn-sort:hover{background:#1976d2}.btn-debug{position:fixed;bottom:12px;left:50%;transform:translate(-50%);padding:6px 12px;border-radius:4px;border:1px dashed #e94560;background:#1a1a2ed9;color:#e94560;font-size:10px;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;font-weight:600;z-index:50;transition:background .15s,color .15s}.btn-debug:hover{background:#e94560;color:#fff}.btn-close{position:absolute;top:6px;right:6px;width:18px;height:18px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;z-index:10}.btn-close svg{width:12px;height:12px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn-close:hover svg{stroke:#e94560}.btn-refresh{position:absolute;top:6px;right:30px;width:18px;height:18px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;z-index:10}.btn-refresh svg{width:14px;height:14px;fill:#fff}.btn-refresh:hover svg{fill:#53a8e2}.inventory-grid,.equipment-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;flex-shrink:0}.slot{aspect-ratio:1;border-radius:4px;border:2px solid #1a4080;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,border-color .15s;position:relative;overflow:hidden;-webkit-user-select:none;user-select:none;padding:14px 4px 4px;text-align:center;background:#0a1a30}.slot.empty{border-style:dashed;border-color:#152540}.slot.filled{border-color:#1a4080;background:#0f3460}.slot:hover{border-color:#53a8e2}.slot.selected{border-color:#e94560;border-width:2px}.slot[draggable=true]{cursor:grab}.slot[draggable=true]:active{cursor:grabbing}.slot.drag-over{border-color:#4caf50;border-style:solid;background:#1a3020}.slot.dragging{opacity:.4}.slot>*{pointer-events:none}.slot-index{position:absolute;top:2px;left:4px;font-size:8px;color:#6a7a9a}.slot .slot-name{font-size:9px;line-height:1.2;color:#e0e0e0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}.slot .slot-uses{position:absolute;bottom:3px;left:0;right:0;text-align:center;font-size:10px;font-weight:600;color:#fff}.slot .slot-qty{position:absolute;bottom:3px;right:5px;font-size:18px;font-weight:700;color:#fff}.slot .slot-empty-label{font-size:8px;color:#555;text-transform:uppercase}.equip-slot-type{font-size:7px;color:#556;position:absolute;top:2px;left:0;right:0;text-align:center;text-transform:uppercase;letter-spacing:.5px;pointer-events:none}.tooltip{display:none;position:fixed;background:#16213e;border:1px solid #0f3460;border-radius:4px;padding:8px;max-width:180px;z-index:100;font-size:11px;line-height:1.4;pointer-events:none}.tooltip.visible{display:block}.tooltip .tt-name{font-weight:700;color:#e0e0e0;margin-bottom:2px}.tooltip .tt-desc{color:#89a;font-size:10px}.toast-container{position:fixed;top:8px;right:8px;z-index:1000;display:flex;flex-direction:column;gap:4px}.toast{padding:6px 12px;border-radius:4px;color:#fff;font-size:11px;background:#e94560;box-shadow:0 4px 12px #0006;animation:toast-in .2s ease-out,toast-out .3s ease-in 2.7s forwards}@keyframes toast-in{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes toast-out{0%{opacity:1}to{opacity:0}}body.page-landing{font-family:Special Elite,cursive;background-color:#000;color:#d4c9a8;overflow:auto}body.page-landing #app{height:auto;min-height:100%;overflow:visible}.landing{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem}.landing-logo img{max-width:500px;width:90vw}.landing-tagline{max-width:600px;text-align:center;font-size:1.1rem;line-height:1.6;margin-bottom:3rem;color:#8a8068}.landing-pick-a-side{font-size:2rem;text-transform:uppercase;letter-spacing:.3em;margin-bottom:2.5rem;text-align:center}.landing-factions{display:flex;gap:3rem;justify-content:center;flex-wrap:wrap}.landing-faction{display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .2s ease,filter .2s ease;filter:grayscale(30%)}.landing-faction:hover{transform:scale(1.08);filter:grayscale(0%)}.landing-faction img{width:160px;height:160px;object-fit:contain}.landing-faction span{margin-top:.75rem;font-size:1.2rem;letter-spacing:.15em;text-transform:uppercase}.landing-faction-blurb{margin-top:.5rem;font-size:1rem;color:#b8ad8a;text-align:center;max-width:180px}.landing-ai-disclaimer{max-width:600px;margin-top:4rem;text-align:center;font-size:.85rem;line-height:1.6;color:#6b6350;font-style:italic}.landing-footer{margin-top:2rem;margin-bottom:2rem;text-align:center;font-size:.8rem;color:#555;line-height:1.6}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden;color:#e0e0e0}body{font-family:Segoe UI,Arial,sans-serif}body.page-main-menu{background:#000 url(/backgrounds/bg-1.jpg) center center / cover no-repeat;font-size:.9vw}body.page-main-menu:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;pointer-events:none;z-index:0}body.page-chat{font-family:Arial,sans-serif;background:#1a1a2e80;font-size:12px}body.page-inventory{background:transparent;font-size:12px}
