:root{--bg:#0a0a1f;--panel:#1a1a3a;--panel-2:#2a2a4a;--border:#4a4a6a;--text:#c0c0ff;--text-h:#fff;--text-dim:#8080aa;--accent:#f0a;--accent-2:#0ff;--accent-3:#ff0;--good:#0f8;--bad:#f36;--chrome:#a0a0ff;--leather:#4a2a6a;--sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--heading:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font:15px/1.5 var(--sans);letter-spacing:.2px;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg);min-height:100svh;color:var(--text);margin:0}h1,h2,h3{font-family:var(--heading);color:var(--text-h);letter-spacing:.5px;margin:0 0 8px;font-weight:600}h1{text-shadow:0 0 6px var(--accent);font-size:28px}h2{color:var(--accent-2);text-shadow:0 0 4px var(--accent-2);font-size:18px}h3{text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);font-size:14px}button{font-family:var(--sans);letter-spacing:.4px;appearance:none;border:2px solid var(--border);background:var(--panel-2);color:var(--text-h);cursor:pointer;border-radius:6px;padding:8px 14px;font-size:14px;font-weight:600;transition:all .1s;box-shadow:0 0 4px #ff00aa4d}button:hover{border-color:var(--accent);box-shadow:0 0 8px var(--accent);background:#2a2a5a}button:active{transform:translateY(1px)}button.primary{background:var(--accent);color:#fff;box-shadow:0 0 8px var(--accent);border-color:#f6c}button.primary:hover{filter:brightness(1.15);box-shadow:0 0 12px var(--accent)}button.big{padding:14px 22px;font-size:15px}.run-type{border:1px solid var(--border);background:var(--panel);border-radius:6px;flex-direction:column;gap:6px;margin-bottom:12px;padding:10px;display:flex}.run-option{cursor:pointer;color:var(--text);font-size:13px}.run-option input{margin-right:6px}.noise .noise-fill{background:linear-gradient(90deg,#48f,#f0a,#f36)}.noise-bar{border-color:#64a}button.small{padding:4px 10px;font-size:12px}button.danger{color:#f36;border-color:#f36}button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;border-color:#333}#app{flex-direction:column;max-width:1080px;min-height:100svh;margin:0 auto;padding:12px;display:flex}.topbar{background:var(--panel);border:2px solid var(--accent-2);border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:12px;padding:8px 12px;display:flex;box-shadow:0 0 10px #0ff3}.brand .logo{letter-spacing:3px;color:var(--accent);font-size:20px;font-weight:800}.brand .tag{color:var(--text-dim);vertical-align:middle;margin-left:10px;font-size:11px}.top-stats{font-family:var(--mono);align-items:center;gap:14px;font-size:13px;display:flex}.top-stats strong{color:var(--accent-2)}.screen{display:none}.screen.active{display:block}#hub-screen{grid-template-columns:1fr 320px;gap:16px;display:grid}@media (width<=860px){#hub-screen{grid-template-columns:1fr}}.hub-main{background:var(--panel);border:2px solid var(--accent);border-radius:10px;padding:20px;box-shadow:0 0 8px #ff00aa26}.camp h1{color:var(--text-h);margin-bottom:4px}.hub-cross-link{margin-bottom:10px;font-size:12px}.hub-cross-link a{color:var(--accent-2);text-decoration:none}.hub-cross-link a:hover{color:var(--text-h);text-decoration:underline}.camp .flavor{color:var(--text-dim);margin-bottom:16px;line-height:1.45}.pilot{gap:24px;font-size:13px;display:flex}.pilot .stat{font-family:var(--mono)}.pilot .stat span{color:var(--text-dim);text-transform:uppercase;font-size:10px;display:block}.loadout{margin-top:18px}.loadout h2{margin-bottom:10px}.strip{border:1px solid var(--border);background:#0f0f16;border-radius:6px;gap:8px;min-height:52px;margin-bottom:12px;padding:6px;display:flex}.strip .slot{background:var(--panel-2);border:1px solid var(--border);text-align:center;width:64px;height:40px;font-size:10px;font-family:var(--mono);border-radius:4px;justify-content:center;align-items:center;padding:2px;display:flex}.actions{flex-wrap:wrap;gap:8px;display:flex}.hub-side .panel{background:var(--panel);border:2px solid var(--border);border-radius:10px;margin-bottom:12px;padding:14px}.mini-list{font-family:var(--mono);color:var(--text-dim);min-height:60px;font-size:12px}.log{font-family:var(--mono);border:1px solid var(--accent-2);white-space:pre-wrap;text-shadow:0 0 2px #00ffff4d;background:#0c0c12;border-radius:6px;height:140px;padding:8px;font-size:12px;line-height:1.35;overflow-y:auto}.raid-layout{grid-template-columns:1fr 340px;gap:12px;display:grid}@media (width<=860px){.raid-layout{flex-direction:column;gap:12px;display:flex}.canvas-wrap{order:-1;scroll-margin-top:8px}}.canvas-wrap{border:4px solid var(--accent-2);background:#0a0a1f;border-radius:8px;outline:none;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden;box-shadow:0 0 12px #00ffff40}.canvas-wrap:focus-visible{box-shadow:0 0 12px #00ffff40, 0 0 0 2px var(--accent-2)}.canvas-wrap:after{content:"";pointer-events:none;z-index:2;mix-blend-mode:screen;background:repeating-linear-gradient(#0000,#0000 2px,#00ffff0a 2px 3px);position:absolute;inset:0}.raid-hud{flex-direction:column;gap:8px;display:flex}.hud-top{background:var(--panel);border:2px solid var(--accent);border-radius:8px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:8px 10px;padding:10px 12px;display:grid;overflow:hidden;box-shadow:0 0 6px #f0a3}.hp,.noise{min-width:0}.noise .label{letter-spacing:1px;color:var(--text-dim);font-size:10px}.noise .bar{border:1px solid var(--border);background:#222;border-radius:3px;height:10px;margin:4px 0;overflow:hidden}.noise .noise-fill{width:0%;height:100%;transition:width .2s linear}.noise #noise-text{font-family:var(--mono);font-size:12px}.hp .label{letter-spacing:1px;color:var(--text-dim);font-size:10px}.hp .bar{border:1px solid var(--border);background:#222;border-radius:3px;height:10px;margin:4px 0;overflow:hidden}.hp .fill{background:linear-gradient(90deg, var(--good), #24d17e);width:100%;height:100%;transition:width .2s linear}.hp #hp-text{font-family:var(--mono);font-size:13px}.meta{grid-column:1/-1;font-size:13px;line-height:1.3}.meta span{color:var(--accent-2)}.extract-zone{border-top:1px solid var(--border);grid-column:1/-1;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px 10px;min-width:0;padding-top:6px;display:grid}.extract-zone #extract-btn{white-space:nowrap;max-width:100%;padding:10px 14px;font-size:13px}.extract-zone .hint,.extract-zone #extract-progress{color:var(--text-dim);min-width:0;margin:0;font-size:10px;line-height:1.3}#raid-log{flex:1;min-height:180px;max-height:220px}.raid-actions{flex-wrap:wrap;gap:8px;display:flex}.modal-backdrop{z-index:100;background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-backdrop.hidden{display:none}.modal{background:var(--panel);border:3px solid var(--accent-2);border-radius:10px;width:min(520px,92vw);max-height:85vh;padding:18px 20px 20px;position:relative;overflow:auto;box-shadow:0 0 20px #00ffff4d,0 20px 60px #0009}.modal .close{color:var(--text-dim);background:0 0;border:none;padding:4px 8px;font-size:22px;line-height:1;position:absolute;top:8px;right:10px}.modal .close:hover{color:var(--accent)}.modal h2{margin-bottom:12px}.modal .item{border:1px solid var(--accent-2);font-family:var(--mono);background:#0f0f16;border-radius:4px;justify-content:space-between;align-items:center;margin:4px 0;padding:8px 10px;font-size:13px;display:flex;box-shadow:0 0 4px #00ffff1a}.modal .item .name{color:var(--text-h)}.modal .item .value{color:var(--accent-3)}.modal .item button{padding:3px 9px;font-size:12px}.hidden{display:none!important}.flavor{font-size:13px}.hint{color:var(--text-dim);font-size:11px}canvas{image-rendering:pixelated;image-rendering:crisp-edges}.loadout-sub{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;margin:14px 0 6px;font-size:12px}.class-picker{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin-bottom:8px;display:grid}.class-card{border:2px solid var(--border);cursor:pointer;background:var(--panel);text-align:left;border-radius:8px;padding:10px;transition:border-color .12s,box-shadow .12s}.class-card:hover:not(.locked){border-color:var(--accent-2);box-shadow:0 0 8px #00ffff40}.class-card.selected{border-color:var(--accent);background:#2a1a3a;box-shadow:0 0 12px #ff00aa59}.class-card.locked{opacity:.45;cursor:not-allowed}.class-card .c-name{color:var(--text-h);font-size:13px;font-weight:700}.class-card .c-tag{color:var(--accent-2);margin:2px 0 4px;font-size:10px}.class-card .c-stats{color:var(--text-dim);font-size:10px;font-family:var(--mono)}.class-card .c-progress{color:var(--accent-3);font-size:10px;font-family:var(--mono);margin:4px 0 2px}.adventure-panel{border:2px solid var(--accent-2);background:linear-gradient(#0f0f28 0%,#1a1030 100%);border-radius:8px;padding:14px;box-shadow:0 0 20px #00ffff26,inset 0 0 30px #ff00aa0d}.encounter-chapter{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent-3);margin:0 0 6px;font-size:10px}.adventure-panel .adventure-art{font-family:var(--mono);color:var(--accent-3);white-space:pre-wrap;margin-bottom:10px;font-size:11px;line-height:1.4}.adventure-stats{font-family:var(--mono);color:var(--text-dim);margin-bottom:6px;font-size:10px}.adventure-prompt{color:#8a8a96;margin-bottom:10px;font-size:12px}.choice-stat{color:var(--accent-2);font-size:10px;font-family:var(--mono)}.adventure-modal{border-color:var(--accent-2);max-width:520px}.adventure-panel .choice-btn{text-align:left;border-color:#446;width:100%;margin-bottom:8px;display:block}.adventure-panel .choice-btn.choice-pass{border-color:var(--good);box-shadow:0 0 10px #00ff8859}.adventure-panel .choice-btn.choice-fail{border-color:var(--bad);box-shadow:0 0 10px #ff336659}.encounter-badges{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.encounter-kind,.encounter-faction{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--border);border-radius:4px;padding:3px 7px;font-size:9px}.encounter-kind-poi{color:#fa4;background:#2a1a08;border-color:#a62}.encounter-kind-fight{color:#f68;background:#2a0818;border-color:#a35}.encounter-kind-ambient{color:#8af;background:#0a1428;border-color:#46a}.encounter-kind-extract{color:var(--accent-2);background:#081a28;border-color:#28a}.faction-sixss{color:#fd6;background:#1a1408;border-color:#a83}.faction-arc{color:#6fc;background:#081a14;border-color:#3a8}.faction-rival{color:#c8f;background:#14081a;border-color:#84c}.faction-hazard{color:#f86;background:#1a0c08;border-color:#a43}.faction-legacy{color:var(--text-dim);background:#12121a;border-color:#555}.crown-track{border:1px solid var(--border);background:linear-gradient(135deg,#1a1030 0%,#0f0f28 100%);border-radius:8px;margin-top:12px;padding:10px 12px}.crown-title{letter-spacing:.14em;text-transform:uppercase;color:var(--accent-3);margin-bottom:6px;font-size:10px}.crown-stats{font-family:var(--mono);color:var(--accent-2);font-size:11px;line-height:1.5}.crown-flavor{color:var(--text-dim);margin-top:6px;font-size:12px;font-style:italic}.raid-stats-line{font-family:var(--mono);color:var(--text-dim);margin-top:2px;font-size:10px}.zone-deck{border-top:1px solid var(--border);grid-column:1/-1;padding-top:6px}.zone-deck-title{letter-spacing:.12em;text-transform:uppercase;color:var(--accent-3);margin-bottom:4px;font-size:9px}.zone-deck-grid{grid-template-columns:1fr 1fr;gap:4px 8px;display:grid}.deck-chip{font-family:var(--mono);color:var(--text-dim);font-size:10px}.deck-chip span{letter-spacing:.08em;font-size:8px;display:block}.deck-chip strong{color:var(--accent-2);font-size:12px}.run-recap{border:2px solid var(--accent-3);background:#12101f;border-radius:8px;margin:10px 0;padding:12px}.run-recap .recap-line{font-family:var(--mono);color:var(--text);margin:4px 0;font-size:12px}.run-recap .recap-good{color:var(--good)}.run-recap .recap-bad{color:var(--bad)}.sync-status{color:var(--text-dim);cursor:default;min-width:4.5em;font-size:12px}.sync-status.synced{color:var(--good)}.sync-status.syncing{color:var(--accent-2)}.sync-status.offline{color:var(--text-dim)}.sync-status.error{color:var(--bad)}#pilot-name{cursor:pointer;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}#pilot-name:hover{color:var(--accent-2)}.leaderboard-table{border-collapse:collapse;width:100%;margin-top:8px;font-size:13px}.leaderboard-table th,.leaderboard-table td{text-align:left;border-bottom:1px solid var(--border);padding:6px 8px}.leaderboard-table th{color:var(--accent-2);text-transform:uppercase;font-size:11px}.leaderboard-table tr.you td{color:var(--accent);font-weight:600}.leaderboard-table .rank{width:2.5em;color:var(--text-dim)}
