:root{--energy: #3fe0ff;--energy-dim: #1c8ba6;--amber: #ffb03a;--danger: #ff5c48;--good: #5fe0a0;--ink: #e9f4ff;--ink-dim: #93aac2;--glass: rgba(11, 20, 32, .82);--glass-soft: rgba(17, 29, 45, .7);--edge: rgba(63, 224, 255, .32);--edge-soft: rgba(120, 170, 205, .16);--clip-notch: 10px;--clip: polygon(var(--clip-notch) 0, 100% 0, 100% calc(100% - var(--clip-notch)), calc(100% - var(--clip-notch)) 100%, 0 100%, 0 var(--clip-notch));--ui-unit: clamp(4px, .28vw, 8px);--safe-top: max(var(--tg-safe-area-top, env(safe-area-inset-top, 0px)), var(--tg-content-safe-area-top, env(safe-area-inset-top, 0px)));--safe-right: max(var(--tg-safe-area-right, env(safe-area-inset-right, 0px)), var(--tg-content-safe-area-right, env(safe-area-inset-right, 0px)));--safe-bottom: max(var(--tg-safe-area-bottom, env(safe-area-inset-bottom, 0px)), var(--tg-content-safe-area-bottom, env(safe-area-inset-bottom, 0px)));--safe-left: max(var(--tg-safe-area-left, env(safe-area-inset-left, 0px)), var(--tg-content-safe-area-left, env(safe-area-inset-left, 0px)));--viewport-height: var(--tg-viewport-height, 100dvh);--stable-viewport-height: var(--tg-viewport-stable-height, var(--tg-viewport-height, 100dvh));--rail-space: 54px}*{box-sizing:border-box}html,body,#root{height:100vh;height:var(--viewport-height);min-height:0;margin:0;overflow:hidden;background:#060b12;color:var(--ink);font-family:Rajdhani,Eurostile,Segoe UI,system-ui,sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}#game-canvas,#galaxy-canvas{position:fixed;inset:0;display:block;width:100%;height:var(--viewport-height);outline:none;touch-action:none}.hud{position:fixed;inset:0;z-index:5;display:flex;flex-direction:column;pointer-events:none}.hud>*{pointer-events:auto}.resource-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--ui-unit) * .75);align-self:stretch;margin:calc(8px + var(--safe-top)) calc(8px + var(--safe-right)) 0 calc(8px + var(--safe-left));padding:max(calc(var(--ui-unit) * 1.75),var(--clip-notch));background:linear-gradient(180deg,#0e1a2af0,#09111ce0);border:1px solid var(--edge);border-radius:4px;clip-path:var(--clip);box-shadow:0 6px 26px #0000008c,inset 0 1px #78dcff1f;backdrop-filter:blur(9px)}.energy-deficit-warning{grid-column:1 / -1;display:flex;align-items:center;gap:7px;min-width:0;padding:5px 7px;color:#ffe1dc;background:linear-gradient(135deg,#ff5c4847,#7e231d57);border:1px solid rgba(255,112,94,.8);border-radius:3px}.energy-deficit-icon{display:grid;flex:none;width:21px;height:21px;place-items:center;color:#fff;background:var(--danger);border-radius:50%;font-weight:900}.energy-deficit-warning b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase}.energy-deficit-warning small{display:block;margin-top:2px;font-size:11px;color:#ffc8be}.res{display:flex;min-width:0;align-items:center;gap:6px;padding:3px 4px}.res-icon{display:grid;flex:none;width:21px;height:21px;place-items:center;border:1px solid rgba(63,224,255,.35);border-radius:3px;background:#3fe0ff1f;font-size:11px;font-weight:700}.res-body{display:flex;min-width:0;flex:1;flex-direction:column;line-height:1.05}.res-amount{font-size:max(11px,calc(var(--ui-unit) * 3.25));font-weight:700;letter-spacing:.02em}.res-rate{font-size:11px;color:var(--ink-dim);letter-spacing:.04em}.res-rate.neg{color:var(--danger)}.res-rate.pos{color:var(--good)}.res-fill{height:3px;margin-top:3px;overflow:hidden;border-radius:2px;background:#ffffff1a}.res-fill>i{display:block;height:100%;background:linear-gradient(90deg,var(--energy-dim),var(--energy))}.res-fill.full>i{background:linear-gradient(90deg,#a8641c,var(--amber))}.top-row{display:flex;min-width:0;align-items:flex-start;flex-direction:column;gap:0}.colony-tag{min-width:0;margin:8px calc(8px + var(--safe-right)) 0 calc(8px + var(--safe-left));padding:calc(var(--ui-unit) * 1.5) calc(var(--ui-unit) * 3);background:var(--glass);border:1px solid var(--edge);clip-path:var(--clip);backdrop-filter:blur(9px)}.colony-tag h1{margin:0;font-size:max(12px,calc(var(--ui-unit) * 3.5));font-weight:700;letter-spacing:.06em;text-transform:uppercase}.colony-tag p{margin:2px 0 0;font-size:11px;color:var(--ink-dim);letter-spacing:.05em}.colony-switch{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.colony-switch button{min-height:28px;padding:3px 9px;border:1px solid var(--edge-soft);border-radius:2px;background:#3fe0ff14;color:var(--ink-dim);font-size:11px;letter-spacing:.04em}.colony-switch button.active{border-color:var(--energy);background:var(--energy);color:#04121a;font-weight:700}.spacer{flex:1;min-height:0;pointer-events:none}.toolbar{position:absolute;right:calc(8px + var(--safe-right));bottom:calc(118px + var(--safe-bottom));z-index:6;display:flex;flex-direction:column;gap:6px}.tool{position:relative;display:grid;width:46px;height:46px;place-items:center;gap:1px;border:1px solid var(--edge);background:var(--glass);clip-path:var(--clip);backdrop-filter:blur(9px);transition:transform .12s ease,background .12s ease}.tool:hover{transform:translate(-3px);background:#183046e6}.tool.active{background:var(--energy);color:#04121a}.tool span{font-size:16px;line-height:1}.tool small{display:none;font-size:11px;letter-spacing:.06em;text-transform:uppercase;opacity:.8}.tool .badge,.badge{padding:1px 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:11px;font-weight:700}.tool .badge{position:absolute;top:-5px;right:-5px}.onboarding-layer{position:fixed;inset:0;z-index:20;pointer-events:none}.onboarding-callout{position:absolute;width:min(320px,calc(100vw - var(--safe-left) - var(--safe-right) - 16px));padding:14px 16px;border:1px solid var(--energy);background:#08131ff5;color:var(--ink);clip-path:var(--clip);box-shadow:0 10px 32px #00000094,0 0 20px #3fe0ff2e;pointer-events:auto}.onboarding-callout:after{position:absolute;width:13px;height:13px;border-right:1px solid var(--energy);border-bottom:1px solid var(--energy);background:inherit;content:"";transform:rotate(45deg)}.onboarding-eyebrow{margin:0 0 5px;color:var(--energy);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.onboarding-callout h2{margin:0;font-size:18px;letter-spacing:.03em}.onboarding-callout>p:not(.onboarding-eyebrow){margin:7px 0 13px;color:var(--ink-dim);font-size:13px;line-height:1.35}.onboarding-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.onboarding-actions button{min-height:36px;padding:7px 11px;border-radius:2px;font-size:12px;font-weight:700;letter-spacing:.04em}.onboarding-skip{border:0;background:transparent;color:var(--ink-dim);text-decoration:underline}.onboarding-next{border:1px solid var(--energy);background:var(--energy);color:#04121a}.onboarding-build-dock .onboarding-callout{bottom:calc(138px + var(--safe-bottom));left:50%;transform:translate(-50%)}.onboarding-build-dock .onboarding-callout:after{bottom:-7px;left:calc(50% - 7px)}.onboarding-resources .onboarding-callout{right:calc(8px + var(--safe-right));bottom:calc(168px + var(--safe-bottom))}.onboarding-resources .onboarding-callout:after{right:28px;bottom:-7px}.onboarding-galaxy .onboarding-callout{right:calc(62px + var(--safe-right));bottom:calc(208px + var(--safe-bottom))}.onboarding-galaxy .onboarding-callout:after{right:-7px;bottom:36px;transform:rotate(-45deg)}.build-dock{display:flex;align-items:stretch;align-self:stretch;max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 16px);margin:0 calc(8px + var(--safe-right) + var(--rail-space)) calc(8px + var(--safe-bottom)) calc(8px + var(--safe-left));padding:8px;gap:6px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x;background:linear-gradient(180deg,#0e1a2ae6,#080f19f2);border:1px solid var(--edge);clip-path:var(--clip);backdrop-filter:blur(10px);box-shadow:0 -4px 30px #0009}.build-card{position:relative;flex:none;width:88px;min-height:92px;padding:6px;border:1px solid var(--edge-soft);border-radius:3px;background:#1e30448c;text-align:left;transition:border-color .12s ease,transform .12s ease}.build-card:hover:not(:disabled){border-color:var(--energy);transform:translateY(-2px)}.build-card.selected{border-color:var(--energy);background:#3fe0ff2e}.build-card.locked{filter:saturate(.25)}.build-card .swatch{display:grid;width:100%;height:26px;margin-bottom:6px;place-items:center;border-radius:2px;font-size:15px}.build-card b{display:block;font-size:11px;letter-spacing:.04em;text-transform:uppercase}.build-card .cost{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px;color:var(--ink-dim);font-size:11px}.build-card .cost i{font-style:normal}.build-card .cost i.short{color:var(--danger)}.build-card .lock{margin-top:4px;color:var(--amber);font-size:11px}.panel{position:absolute;border:1px solid var(--edge);background:var(--glass);clip-path:var(--clip);backdrop-filter:blur(11px);box-shadow:0 10px 40px #0009}.detail{bottom:calc(116px + var(--safe-bottom));left:calc(8px + var(--safe-left));width:min(340px,calc(100vw - var(--safe-left) - var(--safe-right) - 74px));max-height:min(calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 185px),calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 185px));padding:11px 13px 13px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.detail header,.galaxy-dossier header{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.detail h2,.galaxy-dossier h2{margin:0;font-size:max(13px,calc(var(--ui-unit) * 4));letter-spacing:.07em;text-transform:uppercase}.detail .lvl{padding:2px 8px;border:1px solid var(--edge);background:#3fe0ff29;color:var(--energy);font-size:11px;letter-spacing:.06em}.detail p.desc{margin:8px 0 10px;color:var(--ink-dim);font-size:12px;line-height:1.45}.detail-energy-deficit{display:grid;gap:3px;margin:0 0 10px;padding:8px 9px;border:1px solid rgba(255,92,72,.58);border-left:3px solid var(--danger);background:#ff5c4824;color:#ffd6cf;font-size:11px;line-height:1.35}.detail-energy-deficit b{color:#fff;font-size:11px;letter-spacing:.1em;text-transform:uppercase}.stat-row{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px dashed var(--edge-soft);font-size:12px}.stat-row span{color:var(--ink-dim);letter-spacing:.04em}.stat-row b{font-weight:700}.progress{height:8px;margin-top:10px;overflow:hidden;border:1px solid var(--edge-soft);background:#ffffff14}.progress>i{display:block;height:100%;background:repeating-linear-gradient(115deg,var(--amber) 0 8px,#d18a22 8px 16px)}.progress-label{margin-top:4px;color:var(--amber);font-size:11px;letter-spacing:.05em}.btn{display:block;width:100%;min-height:40px;margin-top:12px;padding:10px;border:none;border-radius:2px;background:linear-gradient(180deg,var(--energy),var(--energy-dim));color:#04121a;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);font-size:12.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.btn.ghost{border:1px solid var(--edge);background:transparent;color:var(--ink)}.btn.danger{background:linear-gradient(180deg,#ff7a68,#b8392a);color:#fff}.overlay-scrim{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:calc(8px + var(--safe-top)) calc(8px + var(--safe-right)) calc(8px + var(--safe-bottom)) calc(8px + var(--safe-left));background:#0409109e;backdrop-filter:blur(3px)}.modal,.modal-wide{width:min(940px,calc(100vw - var(--safe-left) - var(--safe-right) - 16px));max-height:calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 16px);padding:14px 15px 18px;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;border:1px solid var(--edge);background:var(--glass);clip-path:var(--clip);box-shadow:0 20px 70px #000000b3}.modal-wide{width:min(1120px,calc(100vw - var(--safe-left) - var(--safe-right) - 16px))}.modal>header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--edge-soft)}.modal h2{margin:0;font-size:max(15px,calc(var(--ui-unit) * 4.75));letter-spacing:.12em;text-transform:uppercase}.close-x{display:grid;flex:none;width:34px;height:34px;place-items:center;border:1px solid var(--edge-soft);background:none;font-size:15px;line-height:1}.notifications-scrim{z-index:35}.notifications-panel{width:min(620px,calc(100vw - var(--safe-left) - var(--safe-right) - 16px))}.notifications-panel header>div{min-width:0}.notifications-summary{margin:3px 0 0;color:var(--ink-dim);font-size:12px;letter-spacing:.05em}.notifications-list{display:flex;max-height:min(calc(var(--stable-viewport-height) - 210px),520px);flex-direction:column;gap:8px;padding-right:3px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.notification-row{padding:11px 12px;border:1px solid var(--edge-soft);border-left:3px solid #5a7086;background:#14223280}.notification-row.unread{border-left-color:var(--energy);background:#1f475b7a;box-shadow:inset 0 0 18px #3fe0ff12}.notification-row-heading{display:flex;min-width:0;align-items:center;gap:8px}.notification-kind{color:var(--energy);font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}.notification-row.read .notification-kind{color:var(--ink-dim)}.notification-unread{padding:1px 6px;border-radius:8px;background:var(--energy);color:#04121a;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.notification-row time{margin-left:auto;color:var(--ink-dim);font-size:11px;white-space:nowrap}.notification-row p{margin:6px 0 0;font-size:13px;line-height:1.4}.notifications-empty{margin:24px 0;padding:20px;border:1px dashed var(--edge-soft);color:var(--ink-dim);text-align:center}.notifications-panel footer{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.grid-2{display:grid;grid-template-columns:1fr;gap:12px}.section-title{margin:4px 0 8px;color:var(--energy);font-size:11px;letter-spacing:.16em;text-transform:uppercase}.list-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;padding:8px 10px;border-left:2px solid var(--edge);background:#1e30446b;font-size:12.5px}.list-row .muted,.muted{color:var(--ink-dim)}.list-row .muted{font-size:11.5px}.row-actions{display:flex;flex-wrap:wrap;gap:6px}.mini{min-height:32px;padding:4px 10px;border:1px solid var(--edge);border-radius:2px;background:#3fe0ff24;font-size:11px;letter-spacing:.06em;text-transform:uppercase}.mini.solid{background:var(--energy);color:#04121a;font-weight:700}.mini.warn{border-color:#ff5c4880;background:#ff5c4829;color:#ffb3a8}.market-resource-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:16px}.market-resource-chip{min-width:0;padding:7px 8px;border:1px solid var(--edge-soft);border-left:2px solid var(--market-tint);background:var(--glass-soft);color:var(--ink);text-align:left}.market-resource-chip.active{border-color:var(--market-tint);background:#3fe0ff24;box-shadow:inset 0 0 12px #3fe0ff14}.market-resource-chip span,.market-resource-chip small{display:block}.market-resource-chip small{margin-top:2px;color:var(--ink-dim);font-size:11px}.market-ladder{border:1px solid var(--edge-soft);background:#070f1985}.market-ladder-head{display:flex;justify-content:space-between;padding:6px 9px;color:var(--ink-dim);font-size:11px;letter-spacing:.1em}.market-ladder>.muted{margin:5px 9px;font-size:11.5px}.market-ladder-row{position:relative;display:flex;width:100%;min-height:32px;justify-content:space-between;overflow:hidden;padding:6px 9px;border:0;border-top:1px solid rgba(120,170,205,.1);background:transparent;color:var(--ink);font-size:12px;text-align:right}.market-ladder-row:before{position:absolute;inset:0 auto 0 0;width:var(--market-depth);background:currentColor;content:"";opacity:.18;pointer-events:none}.market-ladder-row span,.market-ladder-row b{position:relative}.market-ladder-row.sell{color:#ffb3a8}.market-ladder-row.buy{color:var(--good)}.market-spread{padding:7px 9px;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);color:var(--energy);font-size:11px;letter-spacing:.04em;text-align:center}.market-side-toggle{display:flex;margin:0 0 10px}.market-side-toggle button{flex:1;min-height:38px;padding:7px;border:1px solid var(--edge-soft);background:var(--glass-soft);letter-spacing:.08em;text-transform:uppercase}.market-side-toggle button.active{border-color:var(--energy);background:#3fe0ff26;color:var(--energy)}.market-band,.market-submit-reason{margin:6px 0;font-size:11.5px}.market-submit-reason{color:var(--amber)}.market-summary{margin:10px 0;padding:7px 9px;border-left:2px solid var(--edge);background:#1e30446b;font-size:12px}.market-summary>div{display:flex;justify-content:space-between;gap:12px;padding:2px 0}.market-summary span{color:var(--ink-dim)}.empire-overview{display:grid;gap:10px;max-height:min(calc(var(--stable-viewport-height) - 180px),620px);padding-right:3px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.empire-colony-card{padding:13px;border:1px solid var(--edge-soft);border-left:3px solid var(--edge);background:#1423349e}.empire-colony-card.active{border-color:#3fe0ffa3;border-left-color:var(--energy);box-shadow:inset 0 0 20px #3fe0ff12}.empire-colony-card.energy-deficit{border-left-color:var(--danger)}.empire-colony-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.empire-colony-heading h3{margin:0;font-size:14px;letter-spacing:.07em;text-transform:uppercase}.empire-colony-heading p{margin:3px 0 0;color:var(--ink-dim);font-size:11.5px}.empire-active-badge{padding:3px 7px;background:var(--energy);color:#04121a;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.empire-energy-deficit{width:fit-content;min-width:0;margin-top:10px}.empire-resources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:12px}.empire-resource{display:flex;min-width:0;align-items:center;gap:5px;padding:6px;background:#050c156b}.empire-resource-icon{width:18px;flex:none;font-size:13px;text-align:center}.empire-resource>span:last-child{display:grid;min-width:0}.empire-resource b{font-size:12px;white-space:nowrap}.empire-resource b small{color:var(--ink-dim);font-size:11px;font-weight:400}.empire-resource em{color:var(--ink-dim);font-size:11px;font-style:normal;white-space:nowrap}.empire-resource em.pos{color:var(--good)}.empire-resource em.neg{color:var(--danger)}.empire-actions{justify-content:flex-end;margin-top:10px}input,select{width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--edge-soft);border-radius:2px;background:#08101ae6;color:var(--ink);font-size:13px}input:focus,select:focus{border-color:var(--energy);outline:none}label{display:block;margin:10px 0 4px;color:var(--ink-dim);font-size:11px;letter-spacing:.1em;text-transform:uppercase}.galaxy-root{position:fixed;inset:0;z-index:25;height:var(--viewport-height);background:#040711}.galaxy-topbar{position:absolute;top:calc(8px + var(--safe-top));right:calc(8px + var(--safe-right));left:calc(8px + var(--safe-left));display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:7px 12px;border:1px solid var(--edge);background:var(--glass);clip-path:var(--clip);backdrop-filter:blur(9px)}.galaxy-topbar h2{margin:0;font-size:14px;letter-spacing:.16em;text-transform:uppercase}.galaxy-topbar p{margin:3px 0 0;color:var(--ink-dim);font-size:11px;letter-spacing:.06em}.galaxy-legend{position:absolute;bottom:calc(8px + var(--safe-bottom));left:calc(8px + var(--safe-left));display:none;gap:14px;flex-wrap:wrap;padding:8px 14px;border:1px solid var(--edge-soft);background:var(--glass);color:var(--ink-dim);font-size:11px;letter-spacing:.06em}.galaxy-legend span{display:flex;align-items:center;gap:6px}.galaxy-legend i{display:block;width:9px;height:9px;border-radius:50%}.galaxy-dossier{right:calc(8px + var(--safe-right));bottom:calc(8px + var(--safe-bottom));left:calc(8px + var(--safe-left));width:auto;max-height:min(46vh,calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 76px),calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 76px));padding:11px 13px;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}.toasts{position:fixed;top:calc(78px + var(--safe-top));right:calc(8px + var(--safe-right));left:calc(8px + var(--safe-left));z-index:40;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.toast{max-width:100%;padding:9px 18px;border:1px solid var(--edge);border-left:3px solid var(--energy);background:var(--glass);box-shadow:0 6px 24px #0009;font-size:12.5px;letter-spacing:.05em;animation:toast-in .18s ease-out}.toast.error{border-left-color:var(--danger)}.toast.success{border-left-color:var(--good)}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}}.placement-hint{position:fixed;bottom:calc(102px + var(--safe-bottom));left:50%;z-index:12;max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 88px);padding:8px 14px;border:1px solid var(--energy);background:var(--glass);color:var(--energy);font-size:12px;letter-spacing:.09em;text-align:center;text-transform:uppercase;transform:translate(-50%);animation:pulse 1.8s ease-in-out infinite}@keyframes pulse{50%{opacity:.62}}.auth-screen{position:fixed;inset:0;z-index:50;display:grid;height:var(--viewport-height);place-items:center;padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) calc(16px + var(--safe-bottom)) calc(16px + var(--safe-left));background:radial-gradient(1100px 700px at 50% 10%,rgba(35,90,130,.5),transparent 65%),linear-gradient(180deg,#0a1626,#04080f)}.auth-card{width:min(372px,calc(100vw - var(--safe-left) - var(--safe-right) - 32px));max-height:calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 32px);padding:24px;overflow-y:auto}.auth-card h1{margin:0 0 4px;background:linear-gradient(90deg,#fff,var(--energy));-webkit-background-clip:text;background-clip:text;color:transparent;font-size:24px;letter-spacing:.15em;text-transform:uppercase}.auth-card .tagline{margin:0 0 18px;color:var(--ink-dim);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase}.auth-toggle{margin-top:12px;color:var(--ink-dim);font-size:12px;text-align:center}.auth-toggle button{min-height:24px;padding:0;border:none;background:none;color:var(--energy);font-size:12px;text-decoration:underline}.devbar,.devbar-toggle{position:fixed;top:calc(84px + var(--safe-top));left:calc(8px + var(--safe-left));z-index:30}.devbar{display:flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid rgba(255,176,58,.4);background:#ffb03a1f;color:var(--amber);font-size:11px;letter-spacing:.07em}.devbar-toggle{min-height:30px;padding:2px 7px;border:1px solid rgba(255,176,58,.18);border-radius:2px;background:#ffb03a0f;color:#ffb03a73;font-size:11px;letter-spacing:.14em}.devbar-toggle:hover{border-color:#ffb03a80;color:var(--amber)}.devbar button{min-height:28px;padding:2px 8px;border:1px solid rgba(255,176,58,.4);border-radius:2px;background:#ffb03a29;color:var(--amber);font-size:11px}.loading{position:fixed;inset:0;z-index:60;display:grid;height:var(--viewport-height);place-items:center;background:#04080f;color:var(--energy);font-size:13px;letter-spacing:.22em;text-transform:uppercase}@media (min-width: 600px){.resource-bar{grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--ui-unit) * 1.25);padding:max(calc(var(--ui-unit) * 2),var(--clip-notch))}.energy-deficit-warning{grid-column:1 / -1}.res{padding:4px 6px}.res-icon{width:24px;height:24px;font-size:13px}.build-card{width:98px;min-height:104px;padding:7px}.build-card .swatch{height:30px;font-size:17px}.detail{width:min(360px,calc(100vw - var(--safe-left) - var(--safe-right) - 96px))}.galaxy-legend{display:flex}.galaxy-dossier{left:auto;width:min(330px,calc(100vw - var(--safe-left) - var(--safe-right) - 32px))}.empire-resources{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width: 900px){:root{--rail-space: calc(var(--ui-unit) * 13.5 + 40px)}.resource-bar{display:flex;flex-wrap:wrap;min-width:0;align-self:flex-start;margin:calc(12px + var(--safe-top)) 0 0 calc(12px + var(--safe-left));padding:max(calc(var(--ui-unit) * 2.25),var(--clip-notch)) calc(var(--ui-unit) * 3)}.energy-deficit-warning{min-width:220px}.res{min-width:calc(var(--ui-unit) * 26);padding:4px 10px 4px 6px;border-right:1px solid var(--edge-soft)}.res:last-child{border-right:none}.res-icon{width:26px;height:26px}.res-amount{font-size:calc(var(--ui-unit) * 3.75)}.top-row{flex-direction:row;justify-content:space-between;gap:12px}.colony-tag{min-width:190px;margin:calc(12px + var(--safe-top)) calc(12px + var(--safe-right)) 0 0;padding:calc(var(--ui-unit) * 2) calc(var(--ui-unit) * 3.5)}.toolbar{top:50%;right:calc(14px + var(--safe-right));bottom:auto;gap:calc(var(--ui-unit) * 2);transform:translateY(-50%)}.tool{width:auto;min-width:calc(var(--ui-unit) * 13.5);height:calc(var(--ui-unit) * 13.5);padding:0 var(--ui-unit)}.tool span{font-size:calc(var(--ui-unit) * 4.75)}.tool small{display:block;font-size:11px}.build-dock{max-width:min(calc(var(--ui-unit) * 270),calc(100vw - var(--safe-left) - var(--safe-right) - 2 * var(--rail-space)));margin:0 auto calc(14px + var(--safe-bottom));padding:calc(var(--ui-unit) * 2.5) calc(var(--ui-unit) * 3);gap:calc(var(--ui-unit) * 2)}.build-card{width:calc(var(--ui-unit) * 26.5);min-height:calc(var(--ui-unit) * 28);padding:calc(var(--ui-unit) * 2)}.build-card .swatch{height:calc(var(--ui-unit) * 8.5);font-size:calc(var(--ui-unit) * 4.75)}.detail{bottom:calc(100px + var(--safe-bottom));left:calc(14px + var(--safe-left));width:calc(var(--ui-unit) * 76.5);max-height:min(calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 124px),calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 124px));padding:calc(var(--ui-unit) * 3.5) calc(var(--ui-unit) * 4)}.grid-2{grid-template-columns:1fr 1fr;gap:calc(var(--ui-unit) * 4.5)}.modal{padding:calc(var(--ui-unit) * 5) calc(var(--ui-unit) * 6)}.galaxy-topbar{top:calc(14px + var(--safe-top));right:calc(14px + var(--safe-right));left:calc(14px + var(--safe-left));padding:calc(var(--ui-unit) * 2.5) calc(var(--ui-unit) * 4.5)}.galaxy-topbar h2{font-size:calc(var(--ui-unit) * 4.5)}.galaxy-legend{bottom:calc(14px + var(--safe-bottom));left:calc(14px + var(--safe-left))}.galaxy-dossier{top:calc(88px + var(--safe-top));right:calc(14px + var(--safe-right));bottom:calc(14px + var(--safe-bottom));width:calc(var(--ui-unit) * 82.5);max-height:none;padding:calc(var(--ui-unit) * 3.5) calc(var(--ui-unit) * 4)}.toasts{top:calc(90px + var(--safe-top))}.placement-hint{bottom:calc(118px + var(--safe-bottom))}.auth-card{padding:30px 32px 32px}.auth-card h1{font-size:27px;letter-spacing:.19em}}@media (min-width: 1440px){.resource-bar{border-radius:5px}.toolbar{right:calc(18px + var(--safe-right))}.detail{left:calc(18px + var(--safe-left))}.build-dock{max-width:min(calc(var(--ui-unit) * 295),calc(100vw - var(--safe-left) - var(--safe-right) - 32px))}.modal{width:min(calc(var(--ui-unit) * 245),calc(100vw - var(--safe-left) - var(--safe-right) - 32px))}.modal-wide{width:min(calc(var(--ui-unit) * 280),calc(100vw - var(--safe-left) - var(--safe-right) - 32px))}.notifications-panel{width:min(calc(var(--ui-unit) * 162.5),calc(100vw - var(--safe-left) - var(--safe-right) - 32px))}}@media (min-width: 2200px){.resource-bar{margin-left:calc(24px + var(--safe-left))}.colony-tag{margin-right:calc(24px + var(--safe-right))}.toolbar{right:calc(24px + var(--safe-right))}.detail{left:calc(24px + var(--safe-left))}.galaxy-topbar{right:calc(24px + var(--safe-right));left:calc(24px + var(--safe-left))}.galaxy-legend{left:calc(24px + var(--safe-left));bottom:calc(24px + var(--safe-bottom))}.galaxy-dossier{right:calc(24px + var(--safe-right));bottom:calc(24px + var(--safe-bottom))}.toasts{top:calc(108px + var(--safe-top))}}@media (max-height: 480px){:root{--rail-space: 0px}.resource-bar{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:calc(4px + var(--safe-top));padding:4px 6px 4px var(--clip-notch)}.energy-deficit-warning{display:none}.res{gap:4px;padding:1px 2px}.res-icon{width:18px;height:18px;font-size:11px}.res-amount,.res-rate{font-size:11px}.res-fill{display:none}.colony-tag{margin-top:4px;padding:4px 8px}.colony-tag p,.colony-switch{display:none}.toolbar{right:calc(6px + var(--safe-right));bottom:calc(72px + var(--safe-bottom));flex-direction:row;gap:4px}.tool{width:38px;height:38px}.tool span{font-size:15px}.tool small{display:none}.build-dock{max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 12px);margin-bottom:calc(4px + var(--safe-bottom));padding:4px;gap:4px}.build-card{width:84px;min-height:54px;padding:4px}.build-card .swatch,.build-card .cost,.build-card .lock{display:none}.build-card b{font-size:11px}.detail{right:calc(6px + var(--safe-right));bottom:calc(54px + var(--safe-bottom));left:calc(6px + var(--safe-left));width:auto;max-height:min(calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 94px),calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 94px));padding:8px 10px}.placement-hint{bottom:calc(52px + var(--safe-bottom));font-size:11px}.modal{max-height:calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 8px);padding:10px 12px}.modal>header{margin-bottom:8px;padding-bottom:6px}.galaxy-topbar{top:calc(4px + var(--safe-top));padding:4px 8px}.galaxy-topbar p{display:none}.galaxy-dossier{right:calc(6px + var(--safe-right));bottom:calc(4px + var(--safe-bottom));left:calc(6px + var(--safe-left));max-height:min(calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 52px),calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 52px));padding:8px 10px}.toasts{top:calc(48px + var(--safe-top))}.onboarding-callout{max-height:min(calc(var(--stable-viewport-height) - var(--safe-top) - var(--safe-bottom) - 16px),calc(var(--viewport-height) - var(--safe-top) - var(--safe-bottom) - 16px));overflow-y:auto}.onboarding-build-dock .onboarding-callout,.onboarding-resources .onboarding-callout,.onboarding-galaxy .onboarding-callout{right:calc(52px + var(--safe-right));bottom:calc(48px + var(--safe-bottom));left:auto;width:min(320px,calc(100vw - var(--safe-left) - var(--safe-right) - 64px));transform:none}.onboarding-callout:after{display:none}}@media (pointer: coarse){button,input,select,.tool,.build-card,.colony-switch button,.btn,.close-x,.mini,.market-resource-chip,.market-side-toggle button,.market-ladder-row,.auth-toggle button,.onboarding-actions button,.devbar button,.devbar-toggle{min-width:44px;min-height:44px}.build-card{min-height:92px}.tool{width:max(46px,44px);height:max(46px,44px)}.close-x{width:44px;height:44px}.mini{display:inline-flex;align-items:center;justify-content:center}.market-ladder-row,.colony-switch button,.auth-toggle button,.onboarding-actions button{min-height:44px}}@media (pointer: coarse) and (max-height: 480px){.build-card{min-height:44px}}
