/* Starpath Arcana: decorative vector engraving, outside reading and aiming areas. */
:root{--arcana-gold:#bc914b;--arcana-light:#e4c488;--line:rgba(188,145,75,.32);--background:#041116;--mint:#8ed7cc}
.header{border-bottom-color:var(--arcana-gold);background:linear-gradient(180deg,#071b22e8,#071b2200)}
.brand,.brand-mark,.brand-subtitle{color:var(--arcana-light)}
.header:after{content:"";position:absolute;bottom:-5px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#bc914b,transparent);pointer-events:none}
.header{position:relative}
.destination-panel{background:linear-gradient(120deg,#071b22ef,#071b22a6);border:1px solid var(--arcana-gold);border-radius:24px;padding:26px;box-shadow:inset 0 0 0 5px #071b22,inset 0 0 0 6px #bc914b66}
.destination-panel:before{content:"";display:block;height:38px;margin:-12px 0 14px;background:url('./assets/interface/starpath-ornament.svg') center/auto 38px no-repeat;pointer-events:none}
.destination-panel .eyebrow,.destination-panel .overline{color:var(--arcana-light)}
.destination-card,.library-world,.sky-highlights,.sky-selection,.audio-player,.scene-toolbar{border-color:var(--arcana-gold);border-radius:14px;background-color:#071b22;box-shadow:inset 0 0 0 3px #071b22,inset 0 0 0 4px #bc914b40}
.destination-card{background:linear-gradient(135deg,#133039,#071b22)}
.destination-card.selected{border-color:var(--arcana-light)}
.sky-stage{border-color:var(--arcana-gold)}
.sky-stage:after{content:"";position:absolute;inset:5px;z-index:1;border:1px solid #bc914b88;border-radius:10px;pointer-events:none}
.sky-highlights-top:before{content:"";display:block;height:30px;margin-bottom:12px;background:url('./assets/interface/starpath-ornament.svg') center/auto 30px no-repeat;pointer-events:none}
.reader-dialog,.info-dialog,.library-dialog{border:1px solid var(--arcana-gold);border-radius:24px;background:#071b22;box-shadow:inset 0 0 0 5px #071b22,inset 0 0 0 6px #bc914b66,0 24px 90px #000a}
.dialog-top{background-color:#071b22;background-image:url('./assets/interface/starpath-ornament.svg');background-position:center bottom;background-size:320px 24px;background-repeat:no-repeat;padding-bottom:29px!important;border-bottom:1px solid #bc914b66}
.dialog-top .eyebrow{color:var(--arcana-light)}
.book-sidebar{border-color:var(--arcana-gold)}
.button-secondary,.world-fullscreen,.dialog-fullscreen,.sky-settings,.sky-fullscreen,.sky-view-controls>button:not(.button){border-color:#bc914baa;background-color:#0a222a;color:#f1e2c6;border-radius:8px}
.button-primary{background:#ddbd83;color:#102027;border:1px solid #f3d69e}
.button-primary:hover{background:#f0d29b}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #8ee9dc;outline-offset:3px}
.app-fullscreen .reader-dialog,.app-fullscreen .info-dialog{border:1px solid var(--arcana-gold);border-radius:0}
.app-fullscreen .dialog-top{padding-bottom:29px!important}
.app-fullscreen .sky-screen-actions,.app-fullscreen .sky-view-controls{border-color:var(--arcana-gold);background-color:#071b22ed}
/* Four compact corner engravings frame the view without covering the center. */
.arcana-screen-frame{position:fixed;inset:7px;pointer-events:none;z-index:4;border:1px solid #bc914b80;border-radius:28px}
.arcana-screen-frame i{position:absolute;width:64px;height:64px;background:url('./assets/interface/starpath-corner.svg') center/contain no-repeat;opacity:.85}
.arcana-screen-frame i:nth-child(1){left:0;top:0}.arcana-screen-frame i:nth-child(2){right:0;top:0;transform:rotate(90deg)}
.arcana-screen-frame i:nth-child(3){right:0;bottom:0;transform:rotate(180deg)}.arcana-screen-frame i:nth-child(4){left:0;bottom:0;transform:rotate(270deg)}
@media(max-width:800px){.arcana-screen-frame{inset:3px;border-radius:16px}.arcana-screen-frame i{width:30px;height:30px}.destination-panel{padding:20px}.dialog-top{background-size:200px 20px}.destination-panel:before{height:26px;background-size:auto 26px}}
@media(max-height:750px) and (min-width:801px){.destination-panel{padding:18px}.destination-panel:before{height:24px;background-size:auto 24px;margin-bottom:10px}}
.app-fullscreen:not(.sky-mode) .destination-panel{padding:24px;max-height:calc(100svh - 150px);overflow:auto;scrollbar-width:thin;scrollbar-color:#bc914b #071b22}
.app-fullscreen:not(.sky-mode) .destination-panel h1{font-size:clamp(42px,5.2vw,82px);line-height:1.08;overflow-wrap:normal}
.arcana-screen-frame i{width:44px;height:44px}
@media(max-width:800px){.app-fullscreen:not(.sky-mode) .destination-panel{padding:18px}.arcana-screen-frame i{width:28px;height:28px}}
/* Continuous engraved rails: ornaments belong to the frame lines themselves. */
.arcana-screen-frame{inset:5px;border:2px solid #bc914baa;box-shadow:inset 0 0 0 4px #041116,inset 0 0 0 5px #bc914b66;background-image:url('./assets/interface/starpath-rail.svg'),url('./assets/interface/starpath-rail.svg'),url('./assets/interface/starpath-ornament.svg'),url('./assets/interface/starpath-ornament.svg');background-position:left 73px,right -183px,center top,center bottom;background-size:18px 675px,18px 675px,480px 36px,480px 36px;background-repeat:repeat-y,repeat-y,repeat-x,repeat-x}
.arcana-screen-frame{z-index:1}
.header,.sky-highlights{position:relative;z-index:2}
.destination-panel{border-color:#d8b574;background-color:#071b22;background-image:url('./assets/interface/starpath-rail.svg'),url('./assets/interface/starpath-rail.svg'),linear-gradient(120deg,#0b2730f5,#06151ce8);background-position:left -47px,right -271px,center;background-size:16px 600px,16px 600px,auto;background-repeat:repeat-y,repeat-y,no-repeat;box-shadow:inset 0 0 0 4px #071b22,inset 0 0 0 5px #bc914b99,0 14px 55px #0007}
.destination-panel:before{height:44px;background-size:auto 44px;margin:0 0 18px}
.sky-highlights{background-image:url('./assets/interface/starpath-rail.svg');background-position:right top;background-size:14px 525px;background-repeat:repeat-y;padding-right:24px}
.dialog-top{background-size:480px 36px;padding-bottom:42px!important;background-repeat:repeat-x;border-bottom:2px solid #bc914b}
.app-fullscreen .dialog-top{padding-bottom:42px!important}
.sky-stage:after{inset:4px;border:0;border-radius:12px;background-image:url('./assets/interface/starpath-rail.svg'),url('./assets/interface/starpath-rail.svg');background-size:14px 525px;background-position:left top,right top;background-repeat:repeat-y;opacity:.8}
.book-sidebar{background-image:url('./assets/interface/starpath-rail.svg');background-position:right top;background-size:12px 450px;background-repeat:repeat-y}
@media(max-width:800px){.arcana-screen-frame{background-size:8px 300px,8px 300px,320px 24px,320px 24px}.destination-panel:before{height:30px;background-size:auto 30px}.dialog-top{background-size:320px 24px}}
/* The ornament itself defines each frame; no continuous enclosing rules. */
.arcana-screen-frame,.destination-panel,.destination-card,.destination-card.selected,.library-world,.sky-highlights,.sky-selection,.audio-player,.scene-toolbar,.sky-stage,.reader-dialog,.info-dialog,.library-dialog,.book-sidebar,.header,.dialog-top,.app-fullscreen .reader-dialog,.app-fullscreen .info-dialog,.app-fullscreen .sky-screen-actions,.app-fullscreen .sky-view-controls,.sky-immersive .sky-page>.sky-fullscreen-bar{border-color:transparent;box-shadow:none}
.header:after{display:none}
.sky-stage:after{border:0}
/* A single ornate outer frame; inner surfaces use quiet flowing strokes. */
.destination-panel{background-image:url('./assets/interface/starpath-inner-rail.svg'),url('./assets/interface/starpath-inner-rail.svg'),linear-gradient(120deg,#0b2730f5,#06151ce8);background-size:16px 300px,16px 300px,auto}
.destination-panel:before,.sky-highlights-top:before,.dialog-top{background-image:url('./assets/interface/starpath-inner-sweep.svg');background-repeat:no-repeat}
.sky-highlights,.book-sidebar{background-image:url('./assets/interface/starpath-inner-rail.svg');background-size:14px 300px}
.sky-stage:after{background-image:url('./assets/interface/starpath-inner-rail.svg'),url('./assets/interface/starpath-inner-rail.svg');background-size:14px 300px}
/* Keep interface content inside the outer celestial margin. */
:root{--arcana-safe-x:32px;--arcana-safe-y:44px}
.app-shell{padding:max(var(--arcana-safe-y),env(safe-area-inset-top)) max(4.3vw,var(--arcana-safe-x)) max(var(--arcana-safe-y),env(safe-area-inset-bottom))}
.app-fullscreen:not(.sky-mode) .app-shell{padding:var(--arcana-safe-y) max(4.3vw,var(--arcana-safe-x))}
.sky-immersive .sky-page{inset:var(--arcana-safe-y) var(--arcana-safe-x)}
.app-fullscreen .reader-dialog[open],.app-fullscreen .info-dialog[open]{inset:var(--arcana-safe-y) var(--arcana-safe-x);width:calc(100% - 2 * var(--arcana-safe-x));height:calc(100svh - 2 * var(--arcana-safe-y))}
.reader-dialog,.info-dialog,.library-dialog{max-width:calc(100vw - 2 * var(--arcana-safe-x));max-height:calc(100svh - 2 * var(--arcana-safe-y))}
.header{top:var(--arcana-safe-y)}
.app-fullscreen:not(.sky-mode) .header{top:auto}
/* Interior strokes hug the edges, rather than forming ornaments above titles. */
.destination-panel:before{position:absolute;left:0;right:0;top:0;height:12px;margin:0;background-size:100% 12px}
.sky-highlights-top:before{position:absolute;left:0;right:0;top:0;height:12px;margin:0;background-size:100% 12px}
.dialog-top{background-size:100% 12px;padding-bottom:18px!important}
.app-fullscreen .dialog-top{padding-bottom:18px!important}
.destination-panel{background-position:left -47px,right -271px,center;background-size:6px 300px,6px 300px,auto}
.sky-highlights,.book-sidebar{background-size:6px 300px;background-position:right top}
.sky-stage:after{inset:0;background-size:6px 300px}
@media(max-width:800px){:root{--arcana-safe-x:20px;--arcana-safe-y:32px}.header{height:auto;min-height:96px}.main-nav{flex-wrap:wrap;height:auto;row-gap:10px}.nav-button{min-height:36px}}
/* Full-bleed scenery; the masthead is the top of the celestial border. */
.app-shell{padding:0 max(4.3vw,32px) 42px}
.app-fullscreen:not(.sky-mode) .app-shell{padding:0 max(4.3vw,32px) 24px}
.sky-immersive .sky-page{inset:0}
.arcana-screen-frame{z-index:20;background-image:url('./assets/interface/starpath-rail.svg'),url('./assets/interface/starpath-rail.svg'),none,url('./assets/interface/starpath-ornament.svg')}
.header,.sky-immersive .header,.app-fullscreen:not(.sky-mode) .header{display:flex;position:relative;top:0;z-index:110;min-height:78px;height:78px;background:linear-gradient(180deg,#041116b3,transparent);gap:clamp(12px,1.8vw,28px);border:0}
.sky-immersive .header{position:fixed;left:max(4.3vw,32px);right:max(4.3vw,32px)}
.brand{font-size:clamp(23px,2.1vw,32px);color:#e4c488;text-shadow:0 1px 12px #bc914b22}
.brand-subtitle{color:#bda579;letter-spacing:3px}
.main-nav{gap:clamp(16px,2vw,32px);align-items:center}
.nav-button{color:#d9b87c;font-family:var(--serif);font-size:clamp(15px,1.3vw,20px);letter-spacing:.3px;min-height:44px}
.nav-button.active,.nav-button:hover{color:#ffe0a1}
.nav-button.active:after{background:#bc914b;bottom:2px;left:20%;right:20%;height:1px}
.help-button{color:#d9b87c}
.sky-immersive .sky-page>.sky-fullscreen-bar{top:86px;left:32px;right:32px;background:linear-gradient(90deg,#071b2299,#071b2233);padding:8px 14px}
.sky-immersive .sky-highlights{top:210px;right:32px;bottom:108px}
.sky-immersive .sky-view-controls{bottom:104px}
@media(max-width:800px){.header,.sky-immersive .header,.app-fullscreen:not(.sky-mode) .header{height:auto;min-height:116px;flex-wrap:wrap;align-content:center;gap:6px 16px}.main-nav{gap:16px;margin:0}.brand{font-size:23px}.nav-button{font-size:15px}.sky-immersive .sky-page>.sky-fullscreen-bar{top:124px;left:24px;right:24px}.sky-immersive .sky-highlights{top:280px;right:24px}.sky-immersive .sky-view-controls{bottom:100px}}
/* One remote-friendly entry point for all sky visibility choices. */
.sky-layers-dialog{width:560px;max-width:calc(100vw - 64px);max-height:calc(100svh - 64px);overflow:auto;background:#071b22;color:#f1e2c6;border:0;border-radius:16px;padding:24px;box-shadow:0 20px 90px #000b}
.sky-layers-dialog .dialog-top{padding:0 0 18px!important;display:flex;justify-content:space-between;align-items:center}
.sky-layers-dialog h2{font:normal 32px var(--serif);color:#e4c488;margin:0}
.sky-layer-options,.sky-scope-options{display:grid;gap:10px}
.sky-scope-options{margin-top:24px}
.sky-scope-options h3{font-size:14px;font-weight:normal;color:#cbb68f;margin:0 0 4px}
.sky-layer-options button,.sky-scope-options button{min-height:48px;text-align:left;padding:12px 16px;background:#102a32;border:1px solid #bc914b55;border-radius:6px;font-size:17px;color:#e8d6b5;display:flex;align-items:center;gap:12px}
.sky-layer-options button:after,.sky-scope-options button:after{content:'Off';margin-left:auto;font:12px var(--sans);color:#b4baba}
.sky-layer-options button[aria-pressed=true]:after{content:'On';color:#f4d399}
.sky-scope-options button:after{content:''}
.sky-scope-options button[aria-pressed=true]:after{content:'Selected';color:#f4d399}
.sky-layer-options button[aria-pressed=true],.sky-scope-options button[aria-pressed=true]{background:#233536;border-color:#bc914b}
.sky-layer-note{font-size:13px;line-height:1.6;color:#b5c1c1;margin:20px 0}
.sky-layers-dialog>.button{width:100%;min-height:48px}
/* Match the neighboring sky action buttons, without the former layer pills. */
#sky-layers-button{min-height:42px;padding:10px 13px;border:1px solid #bc914baa;border-radius:8px;background:#0a222a;color:#f1e2c6;font-size:12px;box-shadow:0 3px 15px #0003}
#sky-layers-button:hover{background:#1b303c}
.sky-immersive #sky-layers-button{min-height:44px}
@media(max-width:800px){#sky-layers-button{padding:9px}}
.sky-screen-actions>.sky-layers{display:flex;position:static;transform:none;width:auto;max-width:none;margin:0;padding:0;border:0;gap:0;background:none}
.sky-viewing-settings .sky-time-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.sky-viewing-settings .sky-time-actions button{min-height:44px;padding:10px 14px;border:1px solid #bc914baa;border-radius:8px;background:#0a222a;color:#f1e2c6}
.sky-viewing-settings .sky-time-actions button[aria-pressed=true]{background:#233536;border-color:#e4c488}
.sky-stage .sky-screen-actions{flex-wrap:wrap;max-width:calc(100% - 32px)}

/* Keep the normal sky introduction compact; give the map the room. */
body:not(.sky-immersive) .sky-page{padding-top:10px}
.sky-overview{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:28px;align-items:center;margin:0 0 14px}
.sky-overview .sky-heading{grid-row:1 / 3;margin:0}
.sky-overview .sky-heading .eyebrow{display:none}
.sky-overview .sky-heading h1{font-size:clamp(26px,2.6vw,38px);letter-spacing:-.8px}
.sky-overview .sky-timebar{margin:0;justify-content:flex-end;gap:8px}
.sky-overview .sky-time-copy{display:flex;align-items:baseline;justify-content:flex-end;flex-wrap:wrap;gap:4px 18px;text-align:right}
.sky-overview .sky-time-copy strong{font-size:15px}
.sky-overview .sky-time-copy>span{font-size:12px}
.sky-overview .sky-status{margin:4px 0 0;text-align:right;min-height:0;font-size:12px;line-height:1.5}
@media(max-width:800px){.sky-overview{grid-template-columns:1fr;gap:6px;margin-bottom:12px}.sky-overview .sky-heading{grid-row:auto}.sky-overview .sky-timebar,.sky-overview .sky-time-copy{justify-content:flex-start;text-align:left}.sky-overview .sky-status{text-align:left;margin:0}}

/* Location and viewing time replace the camera readout in the sky. */
.sky-overview .sky-heading{grid-row:auto}
.sky-stage>.sky-timebar{position:absolute;z-index:3;top:17px;left:19px;margin:0;pointer-events:none;max-width:calc(100% - 38px)}
.sky-stage>.sky-timebar .sky-time-copy{gap:4px;min-width:0}
.sky-stage>.sky-timebar .sky-time-copy strong,.sky-stage>.sky-timebar .sky-time-copy>span{font:400 11px/1.4 system-ui,sans-serif;color:#8195a9}
.sky-immersive .sky-stage>.sky-timebar{left:39px;top:162px}
@media(max-width:800px){.sky-immersive .sky-stage>.sky-timebar{top:248px}}
/* Keep the sky directly beneath the main navigation. */
.sky-overview{display:none}
/* Keep the sky footer concise; the toolbar already offers world search. */
.sky-editorial-explainer,#sky-summary-library,#sky-sources{display:none}
.sky-source-footer{border:0;padding-top:0;justify-content:flex-end}
/* Let the normal sky use the space recovered from the removed introduction/footer. */
@media(min-width:801px){
  body:not(.sky-immersive) .sky-stage,
  body:not(.sky-immersive) .sky-highlights{height:max(360px,calc(100svh - 230px));max-height:none}
}
@media(min-width:801px) and (max-width:1100px){
  body:not(.sky-immersive) .sky-stage,
  body:not(.sky-immersive) .sky-highlights{height:max(360px,calc(100svh - 255px))}
}
body:not(.sky-immersive) .sky-view-controls{margin:10px 0 6px}
body:not(.sky-immersive) .sky-legend{margin:6px 0}

.sky-source-footer{display:none}
.sky-stage>.sky-timebar #sky-catalog-counts{font:400 11px/1.4 system-ui,sans-serif;color:#8195a9}
@media(min-width:801px){
  body:not(.sky-immersive) .sky-stage,
  body:not(.sky-immersive) .sky-highlights{height:max(360px,calc(100svh - 210px))}
}
@media(min-width:801px) and (max-width:1100px){
  body:not(.sky-immersive) .sky-stage,
  body:not(.sky-immersive) .sky-highlights{height:max(360px,calc(100svh - 235px))}
}
/* Bring the sky up to the celestial rails and lighten the masthead. */
.sky-mode .app-shell{padding-left:28px;padding-right:28px;padding-bottom:26px}
.sky-mode .header{background:linear-gradient(180deg,#04111633,transparent)}
@media(min-width:801px){
  .sky-mode .header{height:62px;min-height:62px}
  .sky-immersive .header{left:28px;right:28px}
  body:not(.sky-immersive) .sky-page{padding-top:4px}
  body:not(.sky-immersive) .sky-stage,
  body:not(.sky-immersive) .sky-highlights{height:max(360px,calc(100svh - 188px))}
}
@media(min-width:801px) and (max-width:1100px){
  body:not(.sky-immersive) .sky-stage,
  body:not(.sky-immersive) .sky-highlights{height:max(360px,calc(100svh - 213px))}
}
@media(max-width:800px){.sky-mode .app-shell{padding-left:24px;padding-right:24px}}
/* Leave both masthead ends clear for Saturn and the Controls link. */
.arcana-screen-frame i:nth-child(-n+2){display:none}
/* Engraved host stars: reading depth controls size, not stellar brightness. */
.catalog-treatment-facts .sky-editorial-symbol,.sky-object-symbol.catalog-treatment-facts{font-size:12px}
.catalog-treatment-summary .sky-editorial-symbol,.sky-object-symbol.catalog-treatment-summary{font-size:18px}
.catalog-treatment-book-profile .sky-editorial-symbol,.sky-object-symbol.catalog-treatment-book-profile{font-size:23px}
.catalog-treatment-journey .sky-editorial-symbol,.sky-object-symbol.catalog-treatment-journey{font-size:27px}
/* Object details must cover sky readouts and controls, never share their layer. */
.sky-stage .sky-selection{z-index:10;background:#071b22;isolation:isolate;box-shadow:0 12px 40px #0009}
/* Reserve full rows for the location readout and bottom sky legend. */
.sky-stage .sky-selection{top:88px;bottom:66px;max-height:none}
.sky-immersive .sky-stage .sky-selection{top:224px;bottom:215px;left:32px;max-height:none}
@media(max-width:800px){
  .sky-stage .sky-selection{top:118px;bottom:82px}
  .sky-immersive .sky-stage .sky-selection{top:310px;bottom:215px;left:24px}
}
/* First-look cards lead with the world, not chart instructions. */
.sky-selection .celestial-portrait {margin:14px 0 16px}
.sky-selection .celestial-portrait img {max-height:165px}
.sky-selection .sky-preview-intro {font-size:15px;line-height:1.7;color:#f0e6ce}
.sky-selection .sky-preview-fact {font-size:13px;line-height:1.65;color:#c3dce4}
.sky-selection .sky-observing-details {margin-top:20px;font-size:12px;color:#9db7c1}
.sky-selection .sky-asteroid-photo figcaption {font-size:10px;line-height:1.4}
.sky-selection .planet-viewer-preview .planet-viewer-star {display:block;max-width:90%;font-size:10px;top:0;left:10px}
.sky-selection .planet-viewer-preview .planet-viewer-note {font-size:10px;line-height:1.4}
.sky-selection .planet-viewer-preview .planet-viewer-controls {gap:5px}
.sky-selection .planet-viewer-preview .planet-viewer-controls button {padding:5px 8px;font-size:11px;min-height:36px}
.sky-selection .planet-viewer-preview .planet-viewer-controls button:nth-child(3),
.sky-selection .planet-viewer-preview .planet-viewer-controls button:nth-child(4),
.sky-selection .planet-viewer-preview .planet-viewer-controls button:nth-child(5) {display:none}

/* Keep the sky visible behind the bottom navigation group. */
.sky-page .sky-view-controls{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none}

.app-exit-button{white-space:nowrap;font-size:12px;min-height:40px}
.app-exit-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}
#app-exit-message{line-height:1.7}

/* Deep-sky facts stay in the sky popup; the photograph loads only on selection. */
.deep-sky-photo {margin:12px 0 18px}
.deep-sky-photo img {display:block;width:100%;height:auto;max-height:330px;object-fit:contain;background:#030a10;border-radius:8px}
.deep-sky-photo figcaption {font-size:11px;line-height:1.5;margin-top:6px;color:#b6d8d2}
.deep-sky-popup .solar-facts {grid-template-columns:1fr;gap:4px;margin:16px 0;font-size:13px;line-height:1.5}
.deep-sky-popup .solar-facts dd {margin:0 0 10px}
.deep-sky-popup .solar-facts dt {color:#dcc389}
.deep-sky-popup details {font-size:12px;margin:12px 0}
.deep-sky-popup .solar-sources {font-size:11px}
.deep-sky-popup .deep-sky-photo img {max-height:190px;width:100%;object-fit:contain}