:root{
  --bg:#050b10;
  --bg-deep:#02070b;
  --panel:#09151b;
  --panel-raised:#0d2027;
  --panel-soft:#0a181e;
  --line:#21434d;
  --line-bright:#357887;
  --text:#edf7f3;
  --muted:#8da9ad;
  --sand:#f2c96f;
  --green:#9fe0ad;
  --blue:#74d5e4;
  --danger:#ef8e82;
  --violet:#b7a4e9;
  --shadow:0 18px 55px #0009;
}

html{background:var(--bg-deep)}
body{position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% -12%,#153744 0,#07141b 33%,var(--bg-deep) 75%);color:var(--text);font-family:"DM Mono",monospace;letter-spacing:.01em}
body:before{content:"";position:fixed;z-index:-2;inset:0;opacity:.28;pointer-events:none;background-image:linear-gradient(#73d7e30d 1px,transparent 1px),linear-gradient(90deg,#73d7e30d 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(180deg,#000,transparent 90%)}
body:after{content:"";position:fixed;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 18%,#5ad2e11e,transparent 24%),radial-gradient(circle at 90% 78%,#f0bd5d12,transparent 25%)}

.shell{position:relative;max-width:1680px;margin:0 auto;padding:24px clamp(16px,3vw,54px) 46px}
.shell>header{height:62px;align-items:center;border-bottom:1px solid #2a5963;background:linear-gradient(180deg,#08151ce8,#071016b5);box-shadow:0 10px 35px #0005;padding:0 15px}
.brand{font-size:clamp(14px,1.15vw,19px);letter-spacing:.12em}.brand img{width:34px;height:34px;filter:drop-shadow(0 0 12px #68dbe777)}
.shell>header>div{font-size:10px;color:#9fc1c4}.shell>header>div button{border:1px solid transparent;border-radius:3px;padding:7px 9px;color:#9fc1c4}.shell>header>div button:hover{border-color:#3b7480;background:#10242b;color:#fff}
.game-nav{gap:5px;margin-left:26px}.game-nav button{position:relative;padding:10px 13px;border:1px solid transparent;border-bottom:2px solid transparent;border-radius:3px;color:#89a6aa;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.game-nav button:before{content:"";position:absolute;left:10px;right:10px;bottom:-2px;height:2px;background:var(--sand);transform:scaleX(0);transition:.2s}.game-nav button.active{border-color:#2b525a;background:#10232a;color:#fff}.game-nav button.active:before{transform:scaleX(1)}

.task-strip{position:relative;margin:0 -15px;padding:10px 15px;border-bottom:1px solid #1f4149;background:#071217;gap:10px}.task-chip{flex-basis:235px;border-left:2px solid var(--blue);padding:5px 10px;background:linear-gradient(90deg,#10252b,#081419);box-shadow:inset 0 0 0 1px #1f454d}.task-chip b{font-size:10px;color:#e7f1ed}.task-chip small{font-size:9px;color:#8fb0b3}.task-chip i{height:3px;margin-top:7px;background:linear-gradient(90deg,var(--blue) var(--progress),#193138 var(--progress))}

.layout{position:relative;display:grid;grid-template-columns:minmax(220px,280px) minmax(520px,1fr) minmax(250px,330px);gap:14px;min-height:calc(100vh - 150px);padding-top:14px}
.left,.center,.right{padding:24px 22px;border:1px solid #1c3a43;background:linear-gradient(160deg,#09171dF2,#061016EA);box-shadow:var(--shadow)}
.left{border-right:1px solid #1c3a43}.right{border-left:1px solid #1c3a43}.center{min-width:0}
.label{display:flex;align-items:center;gap:9px;color:var(--sand);font-size:10px;letter-spacing:.18em}.label:before{content:"";width:20px;height:1px;background:var(--sand);box-shadow:0 0 8px var(--sand)}
.second{margin-top:34px}.signal{margin-top:16px;padding:12px 13px;border:1px solid #2c626d;border-left:3px solid var(--sand);background:linear-gradient(120deg,#122b32,#08151a);color:#def2ed;font-size:10px;line-height:1.7;box-shadow:0 0 22px #54c7d016}
.log{gap:7px;margin-top:17px;max-height:520px}.entry{position:relative;padding:10px 11px;border:1px solid transparent;border-left:2px solid #2a5058;background:#081217;color:#8eaaad;font-size:9px;line-height:1.55}.entry b{color:#d9eee6}.entry:hover{border-color:#27515c;background:#0d2027}.log .entry-navigation{border-left-color:#5aa8bc;background:#0a1a20}.log .entry-important{border-color:#796743;background:#17170f}.log .entry-danger{border-left-color:var(--danger);background:#1c1114}
.center h1{margin:12px 0 11px;color:#f2f9f2;font-size:clamp(24px,2.2vw,34px);letter-spacing:-.08em;text-shadow:0 0 20px #68d9e522}.story{max-width:64ch;color:#b9ced0;font-size:12px;line-height:1.8}
.mode-label{margin-top:24px}.orders{gap:10px;margin-top:16px}.order{position:relative;min-height:92px;padding:17px 17px;border:1px solid #21434d;border-radius:3px;background:linear-gradient(135deg,#0c1d23,#081216);box-shadow:inset 0 0 0 1px #0b252b;transition:.2s}.order:after{content:"";position:absolute;top:0;left:0;width:35px;height:1px;background:var(--sand);opacity:.8}.order:hover:not(.locked){transform:translateY(-2px);border-color:var(--blue);background:linear-gradient(135deg,#102a32,#09181e);box-shadow:0 10px 24px #0006,0 0 18px #4fc5d51b}.order.locked{opacity:.38}.order b{font-size:12px;color:#ebf6ef;letter-spacing:.02em}.order small{margin-top:8px;color:#91b2b5;font-size:10px}.order i{color:var(--sand);font-size:9px;text-transform:uppercase}
.crew,.explore,.market,.ship,.sectors-panel,.event-panel{border-top:1px solid #26505a;padding-top:20px;margin-top:30px}.crew h2,.explore h2,.market h2,.ship h2,.sectors-panel h2,.event-panel h2{color:#e9f4ef;font-size:13px;letter-spacing:.03em}.crew p,.explore p,.market p,.sectors-panel p,.event-panel p{color:#8eabad;font-size:10px;line-height:1.7}.crew-card,.explore-card{border:1px solid #26515c;background:linear-gradient(135deg,#10272e,#0a171c);padding:13px;box-shadow:0 8px 20px #0003}.crew-card button,.market-line button{border:1px solid #406d76;background:#0d2027;padding:7px 10px;color:#d7ece7}.crew-card button:hover,.market-line button:hover{border-color:var(--sand);color:#ffe8a8}
.storage{gap:0;margin-top:18px}.store{padding:12px 0;border-bottom:1px solid #1c3a42}.store span{color:#9ab7b8;font-size:10px}.store small{color:var(--green);font-size:8px}.store b{color:#edf7ef;font-size:15px}.colony{gap:8px;margin-top:18px}.colony-item{padding:10px 0 10px 11px;border-left-width:3px;background:linear-gradient(90deg,#10242a88,transparent)}.colony-item b{color:#e5f3eb}.market-line{padding:11px 0;border-bottom-color:#20424a}

.ship-grid{gap:10px}.ship-grid div,.sector,.event-choices article{border-color:#24515a;background:linear-gradient(145deg,#10272e,#09161b);box-shadow:inset 0 0 0 1px #102d34}.ship-grid div{padding:12px}.ship-grid span{color:#90b2b4}.ship-grid b{color:#edf6ef}.ship-grid i{height:4px;background:linear-gradient(90deg,var(--blue) var(--value),#1c3338 var(--value));box-shadow:0 0 8px #6dd6e344}.sector,.event-choices article{min-height:86px;padding:13px;transition:.2s}.sector:hover,.event-choices article:hover{transform:translateY(-2px);border-color:var(--blue);background:#12303a}.sector.here{border-color:var(--sand);box-shadow:0 0 20px #d9ae541f}.sector b,.event-choices b{color:#eaf5ed;font-size:11px}.sector small,.event-choices small{color:#8eacad;font-size:9px}.sector i{color:var(--sand)}.event-panel{border-left:3px solid var(--danger);border-top:0;padding:16px;background:#1a1114}.event-choices{gap:8px}.event-choices article{background:#111b20}

.progression-bar{border:1px solid #2d626d!important;background:linear-gradient(110deg,#0b2027,#0b1519)!important;box-shadow:0 10px 30px #0004}.progression-bar i{background:linear-gradient(90deg,var(--blue),var(--sand))!important;box-shadow:0 0 12px #6ad8e566}.rank-block b{color:#f5d47d!important}.upgrade-grid{gap:12px}.upgrade-card{border-color:#2d606a!important;background:linear-gradient(145deg,#0c2027,#071318)!important;box-shadow:var(--shadow)}.upgrade-card:hover{border-color:var(--sand)!important;transform:translateY(-2px)}

.scene{border:1px solid #2c6671!important;background:#061116!important;box-shadow:0 15px 45px #0008,0 0 0 1px #0e2930}.scene:before{opacity:.34}.map-head,.map-foot{letter-spacing:.14em}
.operation-lock{background:#02080deF!important;backdrop-filter:blur(14px)!important}.operation-card{border-color:#4a8994!important;background:radial-gradient(circle at 50% 8%,#1e4a55,#09151b 55%)!important;box-shadow:0 0 0 1px #68d9e326,0 30px 100px #000d!important}.operation-kicker{color:var(--sand)!important;letter-spacing:.16em}.operation-progress{height:5px;background:#17343c!important}.operation-progress i{background:linear-gradient(90deg,var(--blue),var(--sand))!important;box-shadow:0 0 12px #6bdae577}.operation-card em{color:#8baeb1!important}

.galaxy-map{border:1px solid #2b6470;box-shadow:0 20px 60px #0008}.galaxy-head{border-bottom-color:#2b6470}.system-switch button{border-color:#2a5962;background:#0a1b21}.system-switch button.active{border-color:var(--sand);box-shadow:0 0 15px #e9bd5b22}.planet-node b{color:#e6f5f0}.planet-node small{color:#9dc0c1}.galaxy-foot{border-top-color:#2b6470}

.journey-preflight-card{border-color:#65c7d2!important;background:radial-gradient(circle at 85% 0,#2a6b74,#07151b 48%)!important;box-shadow:0 30px 110px #000e!important}.mission-brief{border-color:#36717c!important;background:#081a20!important}.journey-facts{border-color:#30616b!important;background:#07161b!important}.journey-preflight-card button{border-radius:2px}.journey-preflight-card [data-confirm]{box-shadow:0 0 18px #e7c15b26}

.toast{z-index:220;border:1px solid #d2ac5d;background:#17160e;color:#ffe8a0;box-shadow:0 10px 35px #0008}

@media(max-width:900px){.shell{padding:12px 12px 82px}.shell>header{height:auto;min-height:60px;padding:10px 12px}.layout{display:flex;gap:0;padding-top:10px}.left,.center,.right{padding:20px 15px;border:0;border-bottom:1px solid #21434d;box-shadow:none}.center{background:linear-gradient(160deg,#09171df5,#061016e8)}.scene{height:min(62vh,470px)}.center h1{font-size:25px}.story{font-size:11px}.order{min-height:82px}.game-nav{background:#08161cf5;border-color:#2b5c66;box-shadow:0 10px 30px #000b}.game-nav button{font-size:9px}.right .storage,.right .colony{gap:7px 14px}}
@media(max-width:520px){.shell>header{align-items:flex-start}.brand{font-size:13px}.shell>header>div{font-size:8px}.layout{padding-top:0}.left,.center,.right{padding-inline:10px}.center h1{font-size:22px}.task-chip{flex-basis:200px}.scene{height:355px}.ship-grid,.sectors{grid-template-columns:1fr 1fr}.store b{font-size:14px}.operation-card{width:calc(100vw - 24px)!important;padding:18px 15px 22px!important}.operation-ship{height:88px}.operation-ship img{width:58px;height:112px}.journey-preflight-card{padding:19px 14px 25px!important}}
@media(max-width:360px){.ship-grid,.sectors,.right .storage,.right .colony{grid-template-columns:1fr}.game-nav button{padding-inline:8px;font-size:8px}}

/* Surface missions stay inside the viewport at every breakpoint.  The route
   panel is intentionally stacked on phones so the minimap cannot force a
   horizontal scroll or collapse the mission controls into a thin column. */
#activeExpedition{box-sizing:border-box;width:100vw;max-width:100vw;overflow:auto}
#activeExpedition .planet-window{box-sizing:border-box;min-width:0;width:min(960px,calc(100vw - 48px));max-width:100%;overflow-x:hidden}
#activeExpedition .surface-layout{min-width:0;grid-template-columns:minmax(0,1fr) 235px}
#activeExpedition .surface-view,#activeExpedition .route-panel{min-width:0;max-width:100%;overflow:visible}
#activeExpedition .mini-map{min-width:0;max-width:100%}

@media(max-width:650px){
  #activeExpedition{display:block;inset:0;padding:0;overflow-x:hidden;overflow-y:auto}
  #activeExpedition .planet-window{width:100%;max-width:none;min-height:100dvh;max-height:none;border-left:0;border-right:0;overflow-x:hidden;overflow-y:auto}
  #activeExpedition .planet-window>header{min-width:0;flex-wrap:wrap;gap:7px 12px}
  #activeExpedition .planet-title{min-width:0;max-width:100%;flex:1 1 100%;overflow-wrap:anywhere}
  #activeExpedition .planet-window>header>small{max-width:100%;overflow-wrap:anywhere}
  #activeExpedition .planet-stats{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
  #activeExpedition .surface-layout{display:grid;grid-template-columns:minmax(0,1fr)!important;width:auto;min-width:0;margin:0 10px;gap:12px}
  #activeExpedition .surface-view,#activeExpedition .route-panel{width:100%;min-width:0}
  #activeExpedition .route-panel{display:grid;grid-template-columns:minmax(0,1fr)!important;align-items:start;gap:9px}
  #activeExpedition .route-title{grid-column:1}
  #activeExpedition .mini-map{width:min(100%,240px);max-width:none!important;justify-self:start}
  #activeExpedition .route-panel small{max-width:none!important;overflow-wrap:anywhere}
  #activeExpedition .direction-pad{width:min(100%,320px);max-width:100%}
}

@media(min-width:651px){
  #activeExpedition .planet-window{width:min(960px,calc(100vw - 48px))}
}

/* Event markers in the explored route. The map cells carry the event class
   from active-expedition.js; keeping the artwork on the cell makes the route
   readable without widening the mission panel. */
#activeExpedition .route-panel{align-self:start;box-sizing:border-box}
#activeExpedition .mini-map{aspect-ratio:1/1;box-sizing:border-box}
#activeExpedition .mini-map i.known:not(.here){background-position:center;background-repeat:no-repeat;background-size:62%}
#activeExpedition .mini-map i.wreck{background-image:url('/assets/missions/wreck.png')}
#activeExpedition .mini-map i.ore{background-image:url('/assets/missions/ore.png')}
#activeExpedition .mini-map i.signal{background-image:url('/assets/missions/signal.png')}
#activeExpedition .mini-map i.storm{background-image:url('/assets/missions/storm.png')}
#activeExpedition .mini-map i.crater{background-image:url('/assets/missions/battery.png')}
#activeExpedition .mini-map i.ruins{background-image:url('/assets/missions/shield.png')}
#activeExpedition .mini-map i.cache{background-image:url('/assets/missions/cache.png')}
#activeExpedition .mini-map i.camp{background-image:url('/assets/missions/medical.png')}
#activeExpedition .mini-map i.ally{background-image:url('/assets/missions/nav.png')}
#activeExpedition .mini-map i.relic{background-image:url('/assets/missions/target.png')}
#activeExpedition .mini-map i.hostile{background-image:url('/assets/missions/hostile.png')}
#activeExpedition .mini-map i.objective{background-image:url('/assets/missions/target.png');border-color:var(--sand)}
#activeExpedition .mini-map i.extract{background-image:url('/assets/missions/extract.png');border-color:var(--sand)}
#activeExpedition .mini-map i.blocked{background-image:none}
#activeExpedition .mini-map i.empty{background-image:url('/assets/missions/nav.png');opacity:.48}

@media(max-width:650px){
  #activeExpedition .route-panel{align-self:start;padding:12px}
  #activeExpedition .mini-map{justify-self:center;width:min(100%,240px)}
}

/* The mission window can be narrower than the browser viewport (tablet,
   split-screen and embedded previews). Stack at 900px so the route card never
   becomes a misaligned sidebar beside the control surface. */
@media(max-width:900px){
  #activeExpedition{display:block;inset:0;padding:0;overflow-x:hidden;overflow-y:auto}
  #activeExpedition .planet-window{width:100%;max-width:none;min-height:100dvh;max-height:none;border-left:0;border-right:0;overflow-x:hidden}
  #activeExpedition .surface-layout{display:grid;grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"surface" "route";gap:12px;margin:0 14px}
  #activeExpedition .surface-view{grid-area:surface;min-width:0}
  #activeExpedition .route-panel{grid-area:route;display:grid;grid-template-columns:minmax(0,1fr)!important;align-self:start;width:100%;min-width:0;padding:12px}
  #activeExpedition .route-title{grid-column:1}
  #activeExpedition .mini-map{justify-self:center;width:min(100%,240px);max-width:none!important;margin-inline:auto}
}

/* Navigation-console treatment for the route map. */
#activeExpedition .route-panel{
  border-color:#397984;
  background:radial-gradient(circle at 50% 0,#16424c55,transparent 46%),linear-gradient(160deg,#0b2027,#061015 78%);
  box-shadow:inset 0 0 28px #52c8d517,0 14px 35px #0005;
}
#activeExpedition .route-title{padding:3px 2px 9px;border-bottom:1px solid #2b5b65}
#activeExpedition .route-title span{color:#d9f3ee;font:700 9px/1 "DM Mono",monospace;letter-spacing:.15em}
#activeExpedition .route-title span::after{content:"  //  GRID 06×06";color:#6eabb0;font-weight:400;font-size:7px}
#activeExpedition .mini-map{
  position:relative;
  isolation:isolate;
  padding:11px;
  gap:5px;
  border-color:#4b8d94;
  border-radius:3px;
  background:
    linear-gradient(90deg,transparent 49.5%,#67d0d20b 50%,transparent 50.5%),
    linear-gradient(0deg,transparent 49.5%,#67d0d20b 50%,transparent 50.5%),
    radial-gradient(circle at 50% 44%,#19414a,#071116 76%);
  box-shadow:inset 0 0 24px #4cc7d522,0 0 0 1px #0a2830,0 0 25px #55cad51a;
}
#activeExpedition .mini-map::before{content:"";position:absolute;z-index:3;left:10px;right:10px;top:-20%;height:1px;background:#8deaf2;box-shadow:0 0 10px 2px #5ed6e588;opacity:.55;animation:mapScan 4.8s linear infinite;pointer-events:none}
#activeExpedition .mini-map::after{content:"N";position:absolute;z-index:3;top:3px;right:7px;color:#d8c46c;font:700 7px "DM Mono",monospace;opacity:.8;pointer-events:none}
#activeExpedition .mini-map i{z-index:1;border-radius:2px;border-color:#25505a;background-color:#071218;box-shadow:inset 0 0 8px #4ecbd00d;transition:transform .18s,border-color .18s,box-shadow .18s}
#activeExpedition .mini-map i:not(.known):not(.here):not(.blocked){opacity:.68;background-image:radial-gradient(circle at 50% 50%,#6bcbd522 0 1px,transparent 2px)}
#activeExpedition .mini-map i.known:not(.here){border-color:#458b92;background-color:#12323a;box-shadow:inset 0 0 12px #58ccd01c,0 0 8px #4ec1c00c}
#activeExpedition .mini-map i.known:not(.here)::after{content:"";position:absolute;inset:2px;border:1px solid #7bd8d322;border-radius:1px;pointer-events:none}
#activeExpedition .mini-map i.here{z-index:2;border-width:2px;background-color:#273b2d;box-shadow:0 0 0 2px #e8c85d44,0 0 20px #f3c94b99,inset 0 0 16px #f4ca5b55;transform:scale(1.06)}
#activeExpedition .mini-map i.here::after{content:"";position:absolute;inset:15%;border:1px solid #ffe99a;border-radius:50%;animation:mapBeacon 1.5s ease-in-out infinite;pointer-events:none}
#activeExpedition .mini-map i.blocked{background:#2a1115;box-shadow:inset 0 0 12px #df5b5140}
#activeExpedition .mini-map i.wreck,#activeExpedition .mini-map i.ore,#activeExpedition .mini-map i.signal,#activeExpedition .mini-map i.storm,#activeExpedition .mini-map i.crater,#activeExpedition .mini-map i.ruins,#activeExpedition .mini-map i.cache,#activeExpedition .mini-map i.camp,#activeExpedition .mini-map i.ally,#activeExpedition .mini-map i.relic,#activeExpedition .mini-map i.hostile,#activeExpedition .mini-map i.objective,#activeExpedition .mini-map i.extract{background-color:#132e35;background-blend-mode:screen}
#activeExpedition .mini-map i.storm,#activeExpedition .mini-map i.hostile{border-color:#a65d61;box-shadow:inset 0 0 12px #db5d5735}
#activeExpedition .mini-map i.ore,#activeExpedition .mini-map i.cache,#activeExpedition .mini-map i.objective,#activeExpedition .mini-map i.extract{border-color:#d0ae5b;box-shadow:inset 0 0 12px #e1b9522e}
#activeExpedition .mini-map i.ally,#activeExpedition .mini-map i.signal,#activeExpedition .mini-map i.relic{border-color:#9581c8;box-shadow:inset 0 0 12px #977de832}
#activeExpedition .route-panel>b{display:flex;align-items:center;gap:7px;padding:8px 0 6px;border-top:1px solid #2d5961;color:#f0d37b;font-size:9px;letter-spacing:.08em}
#activeExpedition .route-panel>b::before{content:"◈";color:#6ed8df;font-size:10px}
#activeExpedition .route-panel small{display:block;max-width:none;padding:8px 0 2px;color:#91b8ba;font-size:8px;line-height:1.7}
#activeExpedition .route-panel small::before{content:"LEYENDA  ·  ";color:#d9bf6d;letter-spacing:.08em}
@keyframes mapScan{0%{top:8%}50%{top:92%}100%{top:8%}}
@keyframes mapBeacon{50%{transform:scale(1.45);opacity:.25}}

/* Keep the 6×6 terrain readout geometrically stable at every width.  Grid
   items with their own aspect-ratio can otherwise make one auto row grow when
   the panel is squeezed, which leaves a visible gap and misaligns the map. */
#activeExpedition .mini-map{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  grid-template-rows:repeat(6,minmax(0,1fr));
  grid-auto-rows:minmax(0,1fr);
  align-content:stretch;
  justify-content:stretch;
  min-height:0;
  aspect-ratio:1/1;
  overflow:hidden;
  contain:layout paint;
}
#activeExpedition .mini-map>i{
  width:auto;
  height:auto;
  min-width:0;
  min-height:0;
  aspect-ratio:auto;
}
/* The animated sweep looked like a broken horizontal row on narrow screens. */
#activeExpedition .mini-map::before{display:none}