/* Sternenpfad: one desktop cockpit from launch to rematch. */
#sp-app { position:relative; --sp-line:var(--line); --sp-muted:var(--muted); --sp-paper:var(--ink); --sp-accent:var(--accent-ink); --sp-chat-space:0px; }
#sp-app:has(.room-chat-docked:not([hidden])) { --sp-chat-space:78px; }
#sp-app [hidden] { display:none!important; }
#sp-app button,#sp-app select { font-family:inherit; }
#sp-app button { cursor:pointer; }
#sp-app button:disabled { cursor:default; opacity:.42; }
#sp-app :focus-visible { outline:2px solid var(--focus); outline-offset:3px; }
#sp-app kbd { font:11px Consolas,monospace; border:1px solid currentColor; border-radius:3px; padding:1px 4px; opacity:.8; }
.sp-toolbar { display:flex; align-items:center; gap:8px; flex:none; }
.sp-toolbar .game-toolbar { flex:1; min-width:0; }
.sp-view-tools { display:flex; align-items:center; gap:8px; }
.sp-view-tools .button { font-size:12px; padding:9px 13px; min-height:38px; white-space:nowrap; }
.sp-routes button { border:1px solid var(--line); border-radius:4px; padding:8px 12px; background:var(--surface-alt); color:var(--ink); font-size:12px; }
.sp-routes button:hover { background:var(--surface-hover); }
.sp-feedback { min-height:40px; }
.sp-status,.sp-error { margin:0; font-size:12px; line-height:1.5; }
.sp-status { color:var(--muted); }.sp-error { color:var(--danger); }
.sp-setup { display:grid; grid-template-columns:1.5fr 1fr; max-width:1160px; margin:10px auto 40px; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.sp-welcome { padding:36px 42px; }.sp-welcome h2 { font:clamp(32px,3.2vw,54px)/1.08 var(--display); letter-spacing:-.035em; margin:18px 0; }.sp-welcome p { max-width:480px; color:var(--muted); line-height:1.7; }
.sp-first-steps { list-style:none; padding:0; margin:28px 0 0; }.sp-first-steps li { border-top:1px solid var(--line); padding:13px 0; font-size:13px; color:var(--muted); }.sp-first-steps strong { display:block; color:var(--ink); font-size:12px; margin-bottom:5px; }
.sp-launch { padding:38px; background:var(--surface-alt); border-left:1px solid var(--line); display:flex; flex-direction:column; justify-content:center; }
.sp-launch label { display:grid; gap:8px; font-size:13px; margin-top:22px; }.sp-launch select { width:100%; padding:12px; border:1px solid var(--line); border-radius:5px; color:var(--ink); background:var(--surface); }
.sp-start-actions { display:grid; gap:9px; margin:22px 0 8px; }.sp-start-actions .button { justify-content:center; }
.sp-note { color:var(--muted); font-size:12px; line-height:1.6; }
#sp-session { position:relative; display:flex; flex-direction:column; height:clamp(400px,calc(100dvh - 180px - var(--sp-chat-space)),1000px); }
.sp-room-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; border-top:1px solid var(--line); }
.sp-room-bar>div:first-child { display:flex; gap:14px; align-items:center; }.sp-room-bar span { font-size:10px; color:var(--muted); }.sp-room-bar strong { font-size:12px; }.sp-room-actions { display:flex; align-items:center; gap:10px; }.sp-room-actions .button { min-height:30px; padding:6px 12px; font-size:12px; }.sp-room-actions .text-link { font-size:12px; }
.sp-room-details { position:absolute; left:10px; top:92px; z-index:6; font-size:11px; color:var(--sp-paper); max-width:calc(100% - 340px); }
.sp-room-details>summary { cursor:pointer; background:var(--surface); border:1px solid var(--sp-line); border-radius:4px; padding:7px 10px; width:fit-content; }
.sp-room-details[open] { background:var(--surface); border:1px solid var(--sp-line); padding:12px; border-radius:6px; box-shadow:0 12px 32px #0005; }.sp-room-details[open]>summary { padding:0 0 8px; border:0; }
.sp-invite-line { display:flex; gap:8px; margin-top:8px; }.sp-invite-line input { min-width:100px; width:360px; padding:8px; font:inherit; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:4px; }.sp-invite-line button { font-size:11px; }
.sp-players { display:grid; grid-template-columns:repeat(2,minmax(140px,1fr)); gap:16px; list-style:none; padding:0; margin:12px 0 0; }.sp-players li { display:flex; align-items:center; gap:8px; }.sp-player-dot { flex:none; width:24px; height:24px; display:grid; place-items:center; color:#12212e; border-radius:3px; }.sp-players strong,.sp-players small { display:block; }.sp-players small { color:var(--sp-muted); margin-top:3px; }
.sp-flight { display:grid; grid-template-columns:minmax(0,1fr) 300px; grid-template-rows:42px minmax(0,1fr); gap:0; flex:1; min-height:0; background:var(--surface); color:var(--sp-paper); border:1px solid var(--sp-line); border-radius:6px; overflow:hidden; }
.sp-weapon-bar { grid-column:1; display:flex; justify-content:space-between; align-items:center; padding:5px 9px; gap:8px; border-bottom:1px solid var(--sp-line); }
.sp-weapons { display:flex; gap:5px; }.sp-weapons button { display:flex; gap:6px; align-items:center; background:transparent; color:var(--sp-muted); border:1px solid transparent; padding:6px 8px; border-radius:3px; font-size:12px!important; }.sp-weapons button[aria-pressed=true] { border-color:var(--accent-ink); color:var(--accent-ink); background:var(--accent-soft); }.sp-weapons small { font-size:9px; opacity:.7; }.sp-controls { font-size:10px; color:var(--sp-muted); white-space:nowrap; }
.sp-canvas-wrap { position:relative; grid-column:1; grid-row:2; min-width:0; min-height:0; background:#0d1723; overflow:hidden; }
#sp-canvas { display:block; width:100%; height:100%; cursor:crosshair; outline-offset:-3px; }
.sp-sector-label { position:absolute; left:14px; bottom:14px; font:10px Consolas,monospace; color:#9cb2bd; pointer-events:none; }.sp-sector-label small { display:block; font-size:8px; letter-spacing:.06em; margin-top:5px; color:#7f98a5; }
.sp-render-stats { position:absolute; right:14px; bottom:14px; font:10px Consolas,monospace; color:#9cb2bd; }.sp-render-stats summary { cursor:pointer; text-align:right; margin-bottom:4px; }
.sp-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; background:#0d1723bb; color:#e5eff3; text-align:center; padding:24px; pointer-events:none; }.sp-overlay strong { font:32px/1.15 var(--display); }.sp-overlay p { color:#a9bec8; font-size:14px; max-width:360px; }
.sp-planet-dock { grid-column:2; grid-row:1/3; overflow:auto; scrollbar-width:thin; padding:16px; border-left:1px solid var(--sp-line); background:var(--surface); font-size:12px; }
.sp-hud { display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:12px; }.sp-hud small { display:block; color:var(--sp-muted); font-size:9px; letter-spacing:.06em; }.sp-hud strong { display:block; font:26px/1.4 var(--display); font-variant-numeric:tabular-nums; }.sp-hud span { color:var(--sp-accent); font-size:10px; }
.sp-gauges { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:14px; }.sp-gauges label { color:var(--sp-muted); font-size:11px; }.sp-gauges span { float:right; color:var(--sp-paper); font-variant-numeric:tabular-nums; }
.sp-flight progress { display:block; width:100%; height:5px; border:0; appearance:none; margin:6px 0; background:var(--surface-alt); border-radius:2px; overflow:hidden; }.sp-flight progress::-webkit-progress-bar { background:var(--surface-alt); }.sp-flight progress::-webkit-progress-value { background:var(--sp-accent); }.sp-flight progress::-moz-progress-bar { background:var(--sp-accent); }#sp-shield-progress::-webkit-progress-value { background:var(--accent-ink); }
.sp-tech { color:var(--ink); font-size:10px; margin:13px 0; }.sp-tech small { display:block; color:var(--sp-muted); margin-top:5px; }
.sp-cockpit .sp-feedback { min-height:48px; border-top:1px solid var(--sp-line); padding-top:9px; }.sp-cockpit .sp-status,.sp-cockpit .sp-error { font-size:11px; }.sp-cockpit .sp-error { color:var(--danger); }
.sp-objective { border-left:2px solid var(--sp-accent); padding:0 0 0 11px; margin:12px 0 16px; }.sp-objective strong { font-size:12px; line-height:1.4; display:block; }.sp-objective p { color:var(--sp-muted); font-size:11px; line-height:1.5; margin:5px 0 0; }
.sp-routes { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:18px; }.sp-routes button { padding:7px 6px; font-size:11px!important; }
.sp-target>label { font-size:9px; letter-spacing:.1em; color:var(--sp-muted); display:block; margin-bottom:6px; }.sp-flight select { padding:8px; background:var(--surface-alt); color:var(--sp-paper); border:1px solid var(--sp-line); border-radius:3px; font-size:12px!important; }#sp-target { width:100%; margin-bottom:16px; }#sp-orbit-status { font-size:9px; letter-spacing:.12em; color:var(--sp-accent); }.sp-target h3 { font:24px/1.2 var(--display); margin:5px 0 9px; }.sp-target p { font-size:11px; line-height:1.5; color:var(--sp-muted); margin:5px 0; }#sp-loyalty { margin:12px 0; }#sp-loyalty small { color:var(--sp-muted); font-size:10px; line-height:1.5; display:block; }
.sp-planet-actions { display:grid; gap:8px; margin-top:12px; }.sp-flight .button { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; min-height:36px; border:1px solid var(--sp-line); background:var(--surface-alt); color:var(--sp-paper); border-radius:4px; font-size:12px!important; padding:9px 7px; gap:3px; }.sp-flight .button-primary { background:var(--accent); color:#182311; border-color:var(--accent); }
.sp-flight .button:hover { background:var(--surface-hover); }
.sp-flight .button-primary:hover { background:var(--accent-hover); }.sp-flight .button small { font-size:10px; font-weight:400; opacity:.8; }
#sp-action-state { min-height:15px; margin:0; color:var(--sp-accent); font-size:10px; }.sp-investment { display:grid; grid-template-columns:1fr; gap:6px; }.sp-investment>small { font-size:10px; line-height:1.5; color:var(--sp-muted); }.sp-planet-dock details>summary { cursor:pointer; padding:10px 0; font-size:12px; }.sp-shop { border-top:1px solid var(--sp-line); margin-top:4px; }.sp-shop .button { margin:6px 0; }
.sp-guide { border-top:1px solid var(--sp-line); margin-top:12px; }.sp-guide>summary { display:flex; gap:8px; align-items:center; }.sp-guide>summary:before { content:'▸'; }.sp-guide[open]>summary:before { content:'▾'; }#sp-guide-count { margin-left:auto; font-size:10px; color:var(--sp-muted); }.sp-guide label { display:flex; gap:8px; align-items:center; }.sp-intel-card { padding:12px 0; border-bottom:1px solid var(--sp-line); }.sp-intel-card strong,.sp-intel-card small { display:block; }.sp-intel-card small { font-size:10px; line-height:1.5; color:var(--sp-muted); margin:4px 0; }.sp-intel-card .button { font-size:11px!important; margin-top:8px; min-height:28px; padding:5px; }.sp-log ol { padding-left:16px; font-size:11px; color:var(--sp-muted); }.sp-log li { margin:8px 0; }
.sp-results { position:absolute; inset:32px; z-index:5; overflow:auto; background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:26px; }.sp-results h2 { font:32px/1.1 var(--display); margin:14px 0; }.sp-results p { font-size:12px; line-height:1.6; color:var(--sp-muted); }.sp-results .eyebrow { color:var(--sp-accent); }.sp-table-wrap { overflow:auto; }.sp-results table { width:100%; border-collapse:collapse; text-align:left; font-size:12px; }.sp-results th,.sp-results td { padding:12px 7px; border-bottom:1px solid var(--sp-line); }.sp-results th,.sp-results caption { font-size:10px; color:var(--sp-muted); }.sp-results caption { text-align:left; margin:12px 0; }
@media(min-width:1600px) { .sp-flight { grid-template-columns:minmax(0,1fr) 326px; }.sp-planet-dock { padding:20px; } }
@media(max-width:1450px) { .sp-weapon-bar>.sp-controls { display:none; }.sp-weapons button { padding:6px; }.sp-room-bar #sp-leader { display:none; }.sp-results { inset:20px; padding:20px; } }
.sp-hangar { padding:0; }.sp-hangar>.eyebrow,.sp-hangar>h2 { display:none; }.sp-ships { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:20px 0; }.sp-ships button { border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:6px; padding:5px 12px 14px; text-align:left; }.sp-ships button[aria-pressed=true] { border-color:var(--accent-ink); box-shadow:inset 0 -3px var(--accent-ink); }.sp-ship-image { display:block; aspect-ratio:1; background-image:url('/games/starpath/images/ships-v2.png'); background-size:200% 200%; background-repeat:no-repeat; }.sp-ships strong { display:block; font:17px/1.3 var(--display); }.sp-ships small { font-size:10px; color:var(--muted); }
.sp-library-art { height:80px; display:flex; align-items:center; justify-content:center; gap:38px; margin-bottom:24px; border-bottom:1px solid var(--line); overflow:hidden; }.sp-library-art span { font-size:60px; color:var(--accent-ink); }.sp-library-art i { width:26px; height:26px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 7px var(--surface-alt),0 0 0 8px var(--line); }.sp-library-art i:last-child { width:17px; height:17px; background:#72c8ed; }

/* Keep immediate orbit actions above the fold; details stay optional. */
.sp-planet-dock { padding:12px 14px; }.sp-hud strong { font-size:23px; }.sp-gauges { margin-top:9px; }.sp-tech { margin:9px 0; }.sp-tech small { display:inline; margin-left:5px; }.sp-cockpit .sp-feedback { min-height:36px; padding-top:6px; }
.sp-objective { margin:9px 0 12px; }.sp-objective p { margin-top:4px; }.sp-routes { margin-bottom:12px; }.sp-routes button { padding:6px; }.sp-target h3 { font-size:22px; margin:4px 0; }.sp-planet-actions { margin-top:9px; gap:6px; }.sp-planet-actions #sp-loyalty { margin:4px 0; }.sp-planet-actions #sp-planet-development { font-size:10px; line-height:1.5; color:var(--sp-muted); margin:3px 0; }.sp-management,.sp-navigation { border-top:1px solid var(--sp-line); margin-top:5px; }.sp-navigation>label { font-size:10px; display:block; color:var(--sp-muted); margin:5px 0; }.sp-guide { margin-top:6px; }

/* Three visible build controls; ownership makes construction the immediate task. */
.sp-planet-dock[data-owned=true] .sp-objective { display:none; }
.sp-investment { display:grid; gap:5px; margin:12px 0 8px; }
.sp-investment>header { display:flex; justify-content:space-between; gap:8px; font-size:9px; color:var(--sp-muted); letter-spacing:.04em; margin-bottom:3px; }
.sp-investment>header strong { color:var(--sp-accent); }
.sp-building { display:grid; grid-template-columns:minmax(0,1fr) 83px; gap:7px; align-items:center; border:1px solid var(--sp-line); border-radius:4px; padding:8px; background:var(--surface-alt); }
.sp-building-title { display:flex; gap:6px; align-items:center; font-size:12px; }
.sp-building-title svg { width:18px; height:18px; fill:none; stroke:var(--sp-accent); stroke-width:1.5; flex:none; }
.sp-building-title>span { margin-left:auto; color:var(--sp-muted); font:11px Consolas,monospace; }
.sp-building-levels { display:flex; gap:3px; margin:5px 0; }
.sp-building-levels i { width:22px; height:3px; background:var(--line); border-radius:1px; }
.sp-building-levels i[data-built=true] { background:var(--sp-accent); }
.sp-building-info>small { display:block; font-size:9px; line-height:1.4; color:var(--sp-muted); }
#sp-app .sp-building-info kbd { font-size:9px; padding:0 2px; }
#sp-app .sp-building button { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; min-height:46px; padding:5px 3px; border:1px solid var(--accent); border-radius:4px; background:var(--accent); color:#182311; font-size:11px; }
.sp-building button small { font-size:9px; }
#sp-app .sp-building button:disabled { opacity:1; background:var(--surface-alt); color:var(--muted); border-color:var(--line); }
.sp-investment>p { color:var(--sp-muted); font-size:10px; line-height:1.4; margin:3px 0 0; }
.sp-colony { border-top:1px solid var(--sp-line); }

#sp-app .sp-building button:not(:disabled):hover { background:var(--accent-hover); }

/* Shared fullscreen includes the toolbar, dialogs and room chat. */
.game-fullscreen #sp-app { min-height:calc(100dvh - 90px); display:flex; flex-direction:column; }
.game-fullscreen #sp-session { flex:1; min-height:0; }
.game-fullscreen .sp-setup { width:min(1160px,100%); margin:auto; }
