/* Interior only. Account gate, PIN, travel and suspended credential retain their designs. */
.celestial-interior { --ink:#e9edf6; --quiet:#a0afc5; --edge:#acc7df26; --warm:#edce99; }
.celestial-interior .app-shell { min-height:100dvh; background:#030711; }
.celestial-interior #sky { position:fixed; }
.celestial-interior .topbar { position:fixed; inset:22px 30px auto; padding:16px 20px; border:1px solid var(--edge); border-radius:20px; background:#08111cc9; backdrop-filter:blur(18px); box-shadow:0 12px 36px #0003; }
.celestial-interior .brand { gap:13px; }
.celestial-interior .brand > .brand-mark { font-size:22px; text-shadow:0 0 18px #efce9b70; }
.celestial-interior .brand h1 { margin-top:5px; font:400 21px Georgia,serif; letter-spacing:.01em; }
.celestial-interior .brand .eyebrow { font-size:8px; letter-spacing:.2em; color:#a7b5c7; }
.celestial-interior .top-actions { gap:6px; }
.celestial-interior .top-actions .secondary-button { background:transparent; color:#acbdd1; font-weight:400; padding:11px 14px; }
.celestial-interior .top-actions .secondary-button:hover { background:#c6daf00d; color:#f4f0e7; }
.celestial-interior .sky-copy { position:fixed; top:calc(50% - 130px); left:7vw; margin:0; max-width:340px; }
.celestial-interior .sky-copy h2 { font-size:clamp(34px,3.6vw,54px); line-height:1.12; letter-spacing:-.035em; max-width:310px; }
.celestial-interior .sky-copy p:last-child { font-size:13px; line-height:1.9; color:#a0b1c6; max-width:265px; }
.celestial-interior .sky-copy .eyebrow { color:#c7bda9; font-size:9px; }
.celestial-interior .sky-footer { position:fixed; inset:auto 32px 22px; padding:13px 18px; border-top:1px solid #b3cee522; font-size:11px; color:#9eafc4; }
.celestial-interior .sky-footer .text-button { margin-right:0; }
.celestial-interior .quote { color:#9aabc0; font-size:12px; }
.celestial-interior .app-shell:not(.map-mode):has(.panel.open) .sky-copy { opacity:.22; transition:opacity .25s; }
.celestial-interior .app-shell.map-mode .topbar { opacity:1; }
.celestial-interior .app-shell.map-mode .topbar .primary-button { display:block; }
.celestial-interior .panel:not(:where(#pinPanel)) { top:50%; right:4vw; width:min(560px,calc(100vw - 32px)); max-height:calc(100dvh - 44px); overflow:auto; padding:30px; border:1px solid #adc5e02a; border-radius:24px; background:linear-gradient(145deg,#101c2eec,#07101eed); box-shadow:0 30px 110px #0009,inset 0 1px #d6e9ff0a; backdrop-filter:blur(24px); transform:translateY(calc(-50% + 12px)); transition:opacity .22s,transform .32s cubic-bezier(.2,.8,.2,1); scrollbar-width:thin; scrollbar-color:#6682a03b transparent; }
.celestial-interior .panel:not(:where(#pinPanel)).open { transform:translateY(-50%); }
.celestial-interior .panel:not(:where(#pinPanel)) .panel-heading { margin-bottom:22px; padding-bottom:20px; border-bottom:1px solid #adc5e017; }
.celestial-interior .panel:not(:where(#pinPanel)) .panel-heading h2 { font-size:32px; margin-top:9px; text-shadow:none; }
.celestial-interior .panel:not(:where(#pinPanel)) .eyebrow { color:#cbb68f; font-size:9px; letter-spacing:.18em; }
.celestial-interior .panel:not(:where(#pinPanel)) .icon-button { width:38px; height:38px; flex-shrink:0; background:#dae6f408; border:1px solid #b7cce51c; color:#b4c7dc; }
.celestial-interior .panel:not(:where(#pinPanel)) label { color:#b7c7da; font-size:12px; font-weight:400; }
.celestial-interior .panel:not(:where(#pinPanel)) input:not([type=file]),.celestial-interior .panel:not(:where(#pinPanel)) select,.celestial-interior .panel:not(:where(#pinPanel)) textarea { border-color:#b7cce52b; background:#040d1994; border-radius:11px; font-family:inherit; }
.celestial-interior .panel:not(:where(#pinPanel)) input:focus,.celestial-interior .panel:not(:where(#pinPanel)) textarea:focus,.celestial-interior .panel:not(:where(#pinPanel)) select:focus { border-color:#d8c0928c; box-shadow:0 0 0 3px #d8c09213; }
.celestial-interior .panel:not(:where(#pinPanel)) .primary-button,.celestial-interior .topbar .primary-button,.celestial-interior .universe-dialog:not(.crew-dialog) .primary-button { border-radius:12px; color:#29271f; background:#ecd5ad; box-shadow:0 4px 20px #0003; padding:13px 18px; font-size:12px; letter-spacing:.01em; }
.celestial-interior .panel:not(:where(#pinPanel)) .primary-button::after { display:none; }
.celestial-interior .panel:not(:where(#pinPanel)) .primary-button:hover,.celestial-interior .topbar .primary-button:hover { background:#f5e3c6; transform:translateY(-1px); }
.celestial-interior .panel:not(:where(#pinPanel)) .secondary-button,.celestial-interior .universe-dialog:not(.crew-dialog) .secondary-button { border:1px solid #bfd4ec23; border-radius:10px; background:#a5c1e509; color:#c4d2e3; font-weight:400; font-size:12px; padding:10px 13px; }
.celestial-interior .panel:not(:where(#pinPanel)) .secondary-button:hover { background:#a5c1e518; border-color:#bfd4ec4d; }
.celestial-interior #editorPanel { width:min(940px,calc(100vw - 44px)); height:min(730px,calc(100dvh - 44px)); overflow:hidden; padding:0; display:grid; grid-template-columns:300px minmax(0,1fr); right:50%; transform:translate(50%,calc(-50% + 12px)); }
.celestial-interior #editorPanel.open { transform:translate(50%,-50%); }
.stellar-workshop { position:relative; min-height:0; background:#030914; border-right:1px solid #a9c2de22; overflow:hidden; }
#formingStar { position:absolute; inset:0; width:100%; height:100%; }
.workshop-caption { position:absolute; bottom:38px; left:26px; right:26px; }
.workshop-caption h3 { font:400 29px/1.2 Georgia,serif; margin:16px 0; color:#eee8dc; overflow-wrap:anywhere; }
.workshop-caption > p:not(.eyebrow) { font-size:12px; line-height:1.85; color:#91a4bd; }
#formingState { display:block; margin-top:22px; padding-top:15px; border-top:1px solid #91a4bd28; color:#c7b697; font-size:10px; letter-spacing:.02em; }
.editor-writing { padding:26px 30px; min-width:0; min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#6682a03b transparent; }
.celestial-interior .editor-writing .panel-heading { margin-bottom:16px; padding-bottom:14px; }
.celestial-interior .editor-writing .draft-note { margin:8px 0 12px; font-size:10px; }
.celestial-interior .editor-writing #entryText { min-height:170px; line-height:1.85; font-size:14px; box-shadow:none; background:#030b1770; }
.celestial-interior .editor-writing #entryTitle { font:400 18px Georgia,serif; padding:14px; }
.celestial-interior .editor-writing .entry-date-row { font-size:11px; margin-bottom:14px; }
.celestial-interior .editor-writing .memory-media-controls { gap:7px; }
.celestial-interior .editor-writing .memory-media-controls .secondary-button { font-size:10px; padding:9px 11px; margin:0; }
.entry-extras { border-block:1px solid #adc5e017; margin:16px 0 22px; padding:12px 0; }
.entry-extras summary { font-size:11px; color:#c1ccdc; cursor:pointer; }
.entry-extras summary span { color:#768aa4; float:right; font-size:10px; }
.entry-extras[open] .title-input { margin-top:14px; }
.celestial-interior .mood-options { gap:5px; }
.celestial-interior .mood { padding:8px 10px; font-size:10px; background:#a7bdd109; border-color:#bdccdf22; color:#a8bcd3; backdrop-filter:none; }
.celestial-interior .mood.selected { border-color:#e8d0a770; background:#dbc28e15; color:#ead8b9; box-shadow:none; }
.celestial-interior legend { font-size:11px; color:#b7c7da; font-weight:400; }
.celestial-interior .form-footer { margin-top:15px; }
.celestial-interior .save-actions { margin-top:24px; justify-content:space-between; }
.celestial-interior .editor-writing .save-actions { position:sticky; bottom:0; padding:14px 0; background:linear-gradient(0deg,#091322 75%,#09132200); z-index:2; }
.celestial-interior .memory-text { line-height:1.95; font:400 18px/1.85 Georgia,serif; color:#d8e1ed; max-height:38dvh; padding:8px 0 18px; }
.memory-sky { position:relative; height:140px; margin:-10px 0 16px; border-radius:14px; overflow:hidden; }
.memory-sky canvas { width:100%; height:100%; }
.celestial-interior .memory-actions { flex-wrap:wrap; justify-content:flex-start; gap:12px; padding-top:18px; border-top:1px solid #c1d8ef17; }
.celestial-interior .memory-actions .text-button { margin:0; font-size:11px; }
.celestial-interior .memory-media img { border-radius:14px; max-height:320px; object-fit:contain; }
.celestial-interior .memory-tag { border-color:#b4cae223; color:#9fb5cc; background:#bdd5ef08; font-size:10px; }
.celestial-interior .map-controls { top:126px; left:32px; width:260px; max-height:calc(100dvh - 180px); overflow:auto; padding:22px; border-radius:18px; background:#07101cda; border-color:#acc7df26; box-shadow:0 20px 50px #0004; scrollbar-width:thin; }
.celestial-interior .map-controls > div { display:block; }
.celestial-interior #closeMap { position:absolute; right:18px; top:18px; width:32px; height:32px; }
.celestial-interior .map-controls .media-filter input { width:14px; height:14px; flex:0 0 14px; margin:0; }
.celestial-interior .map-controls h2 { font-size:26px; }
.celestial-interior .map-controls .constellation-map-item { border-left:1px solid #ccb48545; border-radius:0 8px 8px 0; padding:10px; }
.celestial-interior .zoom-controls { bottom:28px; right:32px; border-radius:12px; background:#07101cda; border-color:#acc7df26; }
.celestial-interior .tool-list { grid-template-columns:1fr 1fr; gap:10px; }
.celestial-interior .tool-list .secondary-button { min-height:66px; padding:15px; line-height:1.6; text-align:left; }
.celestial-interior .tool-list .secondary-button::before { content:'↗'; display:block; font-size:15px; color:#cab58f; margin-bottom:6px; }
.celestial-interior .tools-copy { font-size:12px; line-height:1.85; color:#93a8c1; }
.celestial-interior .timeline-entries { max-height:55dvh; overflow:auto; padding-left:12px; border-left:1px solid #b4c8e32c; }
.celestial-interior .timeline-item,.celestial-interior .constellation-entry { border:0; border-bottom:1px solid #b4c8e319; background:transparent; border-radius:8px; padding:16px 12px; transition:background .2s,transform .2s; }
.celestial-interior .timeline-item:hover,.celestial-interior .constellation-entry:hover { background:#b4c8e30a; transform:translateX(3px); }
.celestial-interior .timeline-item strong,.celestial-interior .constellation-entry strong { font:400 17px Georgia,serif; color:#d6e0ed; }
.celestial-interior .timeline-item span,.celestial-interior .constellation-entry span { display:block; line-height:1.8; color:#92a6bd; margin-top:7px; }
.celestial-interior .timeline-month { color:#c5b18d; font-size:9px; letter-spacing:.14em; }
.celestial-interior .mood-stat { border:0; border-radius:6px; padding:7px 10px; background:#acc7df0a; font-size:10px; color:#a4b7cf; }
.celestial-interior .universe-dialog:not(.crew-dialog) { padding:34px; width:min(790px,calc(100vw - 32px)); border-radius:24px; background:linear-gradient(135deg,#101b2deb,#070e1dee); border-color:#bbcee52c; backdrop-filter:blur(28px); box-shadow:0 30px 120px #0009; }
.celestial-interior .universe-dialog:not(.crew-dialog)::backdrop { background:#01050bc7; backdrop-filter:blur(5px); }
.celestial-interior .universe-dialog:not(.crew-dialog) h2 { font-size:36px; letter-spacing:-.02em; margin-top:12px; }
.celestial-interior .universe-dialog:not(.crew-dialog) h3 { font-size:13px; color:#cfbea1; }
.celestial-interior .universe-dialog:not(.crew-dialog) .eyebrow { color:#c5b18d; font-size:9px; }
.celestial-interior .universe-dialog:not(.crew-dialog) .muted { font-size:12px; color:#9db0c7; }
.celestial-interior .universe-dialog:not(.crew-dialog) .small-row { border-color:#acc7df1e; padding:17px 0; }
.celestial-interior .universe-dialog:not(.crew-dialog) label { color:#a9bdd5; font-weight:400; font-size:12px; }
.celestial-interior .universe-dialog:not(.crew-dialog) input,.celestial-interior .universe-dialog:not(.crew-dialog) select,.celestial-interior .universe-dialog:not(.crew-dialog) textarea { background:#030b1870; border-color:#bbcee529; }
.celestial-interior .systems-portal { height:230px; margin:20px 0 14px; background:#030814; border-radius:17px; border:1px solid #b6c9e719; }
.celestial-interior .systems-portal::before,.celestial-interior .system-grid::before { display:none; }
.celestial-interior .systems-portal > :not(canvas) { display:none; }
.systems-portal canvas { display:block; width:100%; height:100%; }
.celestial-interior .portal-system-grid { gap:12px; }
.celestial-interior .portal-system-card { animation:none; translate:none; border-radius:14px; background:radial-gradient(ellipse at 90% 0,rgba(var(--card-rgb),.16),transparent 70%),#07101e; border-color:#bbcee528; min-height:124px; padding:20px; transition:transform .25s,border-color .25s,box-shadow .25s; }
.celestial-interior .portal-system-card strong { font-size:25px; }
.celestial-interior .portal-system-card .system-signal { animation:none; top:19px; right:20px; }
.celestial-interior .portal-system-card[aria-current=true] { box-shadow:inset 0 0 0 1px #e6d0aa2a; border-color:#e6d0aa63; }
.celestial-interior .portal-system-card:hover { transform:translateY(-3px); box-shadow:0 12px 28px #0005; }
.celestial-interior .observatory { background:#030815; border-color:#c0d4ea23; border-radius:17px; }
.celestial-interior .observatory::before { animation:none; background:none; }
.celestial-interior .observatory-cards { perspective:none; padding:24px; gap:15px; }
.celestial-interior .observatory-card,.celestial-interior .observatory[data-view=wall] .observatory-card { transform:none; animation:none; background:#0a1423; border-color:#acc7df23; border-radius:14px; box-shadow:none; transition:transform .28s,box-shadow .28s,border-color .28s; }
.celestial-interior .observatory-card { display:flex; flex-direction:column; align-items:stretch; }
.celestial-interior .observatory-image { flex-shrink:0; }
.celestial-interior .observatory-card:hover,.celestial-interior .observatory[data-view=wall] .observatory-card:hover { transform:translateY(-4px); border-color:#dcc29260; box-shadow:0 18px 24px #0004; }
.celestial-interior .observatory-image { background:#050b17; height:145px; }
.celestial-interior .observatory-image:has(canvas) { position:relative; }
.celestial-interior .observatory-image canvas { width:100%; height:100%; }
.celestial-interior .observatory-copy { padding:18px; }
.celestial-interior .observatory-copy strong { font-size:22px; }
.celestial-interior .observatory-copy small { color:#c5b18d; font-size:9px; }
.celestial-interior .observatory-copy p { color:#93a8c1; font-size:11px; }
.star-hint { position:fixed; z-index:2; pointer-events:none; border-left:1px solid #dac0978c; padding:10px 15px; background:#07101cda; backdrop-filter:blur(12px); border-radius:0 10px 10px 0; max-width:220px; }
.star-hint span { display:block; font-size:9px; color:#cab58f; margin-bottom:7px; }
.star-hint strong { display:block; font:400 18px Georgia,serif; overflow-wrap:anywhere; }
.celestial-interior .toast { background:#101a28f2; border:1px solid #dbc69e44; border-radius:12px; color:#e7d6b9; font-size:12px; }
.celestial-interior #starBirth { display:none; }
@media(max-width:900px) {
  .celestial-interior .topbar { inset:12px 14px auto; padding:14px; gap:12px; }
  .celestial-interior .brand h1 { font-size:19px; }
  .celestial-interior .top-actions { justify-content:flex-end; }
  .celestial-interior .top-actions button { padding:9px 10px; font-size:11px; }
  .celestial-interior #editorPanel { grid-template-columns:220px minmax(0,1fr); }
  .workshop-caption { left:20px; right:20px; bottom:28px; }
  .workshop-caption h3 { font-size:24px; }
  .editor-writing { padding:24px; }
}
@media(max-width:650px) {
  .celestial-interior .topbar { align-items:center; flex-direction:row; flex-wrap:wrap; gap:12px; }
  .celestial-interior .top-actions { width:100%; justify-content:space-between; flex-wrap:nowrap; gap:3px; }
  .celestial-interior .top-actions .secondary-button { padding:8px 6px; font-size:10px; }
  .celestial-interior .top-actions .primary-button { font-size:11px; padding:10px; }
  .celestial-interior .top-actions .primary-button span { font-size:12px; margin-left:5px; }
  .celestial-interior .sky-copy { top:175px; left:28px; max-width:270px; }
  .celestial-interior .sky-copy h2 { font-size:34px; }
  .celestial-interior .sky-footer { inset:auto 16px 10px; padding:12px 4px; gap:10px; }
  .celestial-interior #syncStatus { order:3; width:100%; font-size:9px; }
  .celestial-interior .panel:not(:where(#pinPanel)) { padding:22px; right:16px; max-height:calc(100dvh - 32px); }
  .celestial-interior #editorPanel { display:block; width:calc(100vw - 28px); height:auto; overflow:auto; padding:0; right:50%; }
  .stellar-workshop { min-height:160px; border-right:0; border-bottom:1px solid #a9c2de22; }
  .workshop-caption { left:20px; right:42%; bottom:20px; }
  .workshop-caption h3 { font-size:22px; margin:9px 0 0; }
  .workshop-caption > p:not(.eyebrow),#formingState { display:none; }
  .editor-writing { padding:22px; overflow:visible; }
  .celestial-interior .panel:not(:where(#pinPanel)) .panel-heading h2 { font-size:27px; }
  .celestial-interior .editor-writing #entryText { min-height:145px; }
  .celestial-interior .map-controls { top:135px; left:14px; width:235px; max-height:calc(100dvh - 208px); overflow:auto; }
  .celestial-interior .universe-dialog:not(.crew-dialog) { padding:26px 20px; }
  .celestial-interior .universe-dialog:not(.crew-dialog) h2 { font-size:30px; }
  .celestial-interior .systems-portal { height:190px; }
  .celestial-interior .observatory-cards { padding:18px; }
}
@media(prefers-reduced-motion:reduce) {
  .celestial-interior .panel:not(:where(#pinPanel)),.celestial-interior .portal-system-card,.celestial-interior .observatory-card,.celestial-interior .timeline-item { transition:none!important; }
}
