/* Osiris glass — the ONE glass layer (design system, workspace reset Phase 2).
 *
 * Moved verbatim out of index.html's main <style> block, where eight glass "eras" were stacked, each partly overriding
 * the last: the Orbital Glass token layer, Phase C (translucent surfaces), D (liquid glass), F (depth & motion),
 * G (cursor FX), H (neon HUD), I (holographic sheen), J (Liquid Glass 2.0 lensing), K (de-crowding) and L
 * (accessibility). Collapsed: every declaration a later era re-declared for the same selector (same specificity,
 * later wins) is gone, so each surface now has ONE live definition; the era comments stay as section markers.
 * Cascade slot: index.html links this file exactly where the eras sat (the <style> block is split around the
 * <link>), so every rule keeps its place relative to the rest of the page's CSS. Controls take the Direction Lab pill
 * idiom from osiris-tokens.css / osiris-controls.css / osiris-legacy-skin.css, not from here.
 */

/* ════ Tokens (were index.html's "Orbital Glass token layer") ════ */
/* ── Orbital Glass token layer (2026 UI) — all DERIVED from the theme anchors
   above via color-mix(), so day/night + every color theme recolor live. ── */
:root{
  --ac-rgb:157,140,255;
  --bd-hi:color-mix(in srgb,var(--ac) 35%,transparent);
  --bd-a2:color-mix(in srgb,var(--a2) 30%,transparent);
  /* Glass layers tinted with TEXT color (flips with the theme) */
  --gl0:color-mix(in srgb,var(--tx) 4%,transparent);
  --gl1:color-mix(in srgb,var(--tx) 7%,transparent);
  --gl2:color-mix(in srgb,var(--tx) 12%,transparent);
  --gl3:color-mix(in srgb,var(--tx) 18%,transparent);
  --gl-ac:color-mix(in srgb,var(--ac) 19%,transparent);
  --gl-a2:color-mix(in srgb,var(--a2) 12%,transparent);
  --gl-a3:color-mix(in srgb,var(--a3) 11%,transparent);
  --gl-red:color-mix(in srgb,#e05242 14%,transparent);
  /* Translucent frosted surfaces (theme surface mixed with transparency) */
  --surf-header:color-mix(in srgb,var(--bg) 86%,transparent);
  --surf-bar:color-mix(in srgb,var(--bg) 90%,transparent);
  --surf-panel:color-mix(in srgb,var(--pn) 94%,transparent);
  --surf-elev:color-mix(in srgb,var(--sf) 95%,transparent);
  --surf-modal:color-mix(in srgb,var(--pn) 97%,transparent);
  /* Glow system — from accent hues */
  --glow-ac:0 0 0 1px color-mix(in srgb,var(--ac) 42%,transparent),0 6px 34px color-mix(in srgb,var(--ac) 24%,transparent);
  --glow-ac-sm:0 0 18px color-mix(in srgb,var(--ac) 34%,transparent);
  --glow-a2:0 0 0 1px color-mix(in srgb,var(--a2) 28%,transparent),0 4px 24px color-mix(in srgb,var(--a2) 14%,transparent);
  --glow-a2-sm:0 0 12px color-mix(in srgb,var(--a2) 22%,transparent);
  --glow-a3:0 0 0 1px color-mix(in srgb,var(--a3) 26%,transparent),0 4px 20px color-mix(in srgb,var(--a3) 12%,transparent);
  --glow-red:0 0 0 1px rgba(224,82,66,0.3),0 4px 20px rgba(224,82,66,0.12);
  /* Depth shadows — neutral black, theme-agnostic */
  --sh0:0 1px 4px rgba(0,0,0,0.28);--sh1:0 2px 12px rgba(0,0,0,0.32);
  --sh2:0 4px 24px rgba(0,0,0,0.36);--sh3:0 8px 40px rgba(0,0,0,0.42);--sh4:0 16px 60px rgba(0,0,0,0.5);
  /* Radius scale */
  --r0:3px;--r1:6px;--r2:10px;--r3:16px;--r4:24px;--r5:999px;
  /* Motion */
  --ease:cubic-bezier(0.4,0,0.2,1);--ease-out:cubic-bezier(0,0,0.2,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);
  --t1:0.1s var(--ease);--t2:0.18s var(--ease);--t3:0.3s var(--ease);
  --ui-font:TopoGlyph,'Inter',system-ui,-apple-system,sans-serif;
}

/* ════════════════ ORBITAL GLASS — Phase C: theme-derived translucent surfaces ════════════════
   Appended (wins the cascade). Every value is a token → recolors live with day/night + theme. */
#header{background:var(--surf-header)!important;border-color:var(--bd)}
#display-bar,#dynamic-bar{background:var(--surf-bar)!important;border-color:var(--bd)}
#sidebar,#right-panel{background:var(--surf-panel)!important;border-color:var(--bd)}

#info-box,#tables-panel,#research-panel,#map-box,#save-dialog,#log-overlay,.settings-float{
  background:var(--surf-modal);border-color:var(--bd-hi);}

.tab-btn.active,.sub-tab-btn.active{background:var(--gl-ac);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ac) 22%,transparent),var(--glow-ac-sm)}

/* ════════════════ Phase D: liquid-glass layer ════════════════ */

#header,#display-bar,#dynamic-bar,#sidebar,#right-panel,.tab-bar,.sub-tab-bar,#info-box,#tables-panel,#research-panel,#map-box,#save-dialog,#log-overlay,.settings-float{
  backdrop-filter:blur(26px) saturate(1.75);-webkit-backdrop-filter:blur(26px) saturate(1.75);}

#header::after{content:'';position:absolute;inset:0 0 auto 0;height:40%;background:var(--lg-sheen);pointer-events:none;z-index:0}
#header>*{position:relative;z-index:1}
input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:var(--r5);background:var(--gl2)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;margin-top:-5px;background:var(--ac);box-shadow:0 0 8px color-mix(in srgb,var(--ac) 65%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 40%,transparent)}
input[type=range]::-moz-range-track{height:3px;border-radius:var(--r5);background:var(--gl2)}
input[type=range]::-moz-range-thumb{width:13px;height:13px;border:none;border-radius:50%;background:var(--ac);box-shadow:0 0 8px color-mix(in srgb,var(--ac) 65%,transparent)}
.gly{display:inline-flex;align-items:center;justify-content:center;line-height:0}
.gly svg{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* ════════════════ Phase E: glyph rail (left icon sidebar) ════════════════ */
#icon-sidebar{position:fixed;left:0;top:0;bottom:0;width:58px;z-index:600;
  display:flex;flex-direction:column;align-items:center;padding:8px 0 10px;gap:3px;
  background:linear-gradient(150deg,color-mix(in srgb,var(--tx) 6%,transparent) 0%,transparent 38%),var(--surf-header);
  border-right:1px solid var(--bd);
  backdrop-filter:blur(28px) saturate(1.8);-webkit-backdrop-filter:blur(28px) saturate(1.8);}
#app{padding-left:58px}
.icon-sb-item{position:relative;width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;
  transition:all var(--t2),transform 0.16s ease}
.icon-sb-item svg{width:27px;height:27px;display:block;transition:filter var(--t2)}

.icon-sb-item.active{color:var(--ac);border-color:var(--bd-hi);
  background:linear-gradient(155deg,color-mix(in srgb,#fff 12%,transparent),transparent 55%),var(--gl-ac);}
.icon-sb-item.active::before{content:'';position:absolute;left:-8px;top:50%;transform:translateY(-50%);
  width:3px;height:18px;border-radius:2px;}
.icon-sb-divider{width:26px;height:1px;background:var(--bd);margin:5px auto;flex-shrink:0;opacity:0.7}
.icon-sb-label{position:absolute;left:calc(100% + 12px);top:50%;
  border:1px solid var(--bd-hi);padding:0 12px;height:26px;
  display:flex;align-items:center;line-height:1;
  white-space:nowrap;font-size:13px;color:var(--tx);
  pointer-events:none;opacity:0;
  transform:translateY(-50%);transition:opacity var(--t2);
  
  backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);z-index:700}
.icon-sb-label::before{content:'';position:absolute;left:-5px;top:50%;transform:translateY(-50%) rotate(45deg);
  width:8px;height:8px;border-left:1px solid var(--bd-hi);border-bottom:1px solid var(--bd-hi)}
.icon-sb-item:hover .icon-sb-label{opacity:1}
#icon-sidebar{overflow-y:auto;overflow-x:visible;scrollbar-width:thin}
#icon-sidebar::-webkit-scrollbar{width:0}
/* ── Orbital Glass: rail control modal (centered window, Info-page style) ── */
#rail-modal-backdrop{position:fixed;inset:0;z-index:9985;opacity:0;pointer-events:none;transition:opacity var(--t2);
  background:color-mix(in srgb,var(--bg) 50%,rgba(0,0,0,0.62));
  backdrop-filter:blur(9px) saturate(1.2);-webkit-backdrop-filter:blur(9px) saturate(1.2)}
#rail-modal-backdrop.open{opacity:1;pointer-events:auto}
#rail-flyout{position:fixed;left:50%;top:50%;z-index:9990;min-width:360px;max-width:min(620px,94vw);
  max-height:88vh;overflow:auto;
  background:var(--surf-modal);border:1px solid var(--bd-hi);border-radius:var(--r3);
  padding:18px 22px 20px;
  backdrop-filter:blur(28px) saturate(1.75);-webkit-backdrop-filter:blur(28px) saturate(1.75);
  opacity:0;transform:translate(-50%,-50%) scale(0.96);pointer-events:none;
  transition:opacity var(--t2),transform var(--t2)}
#rail-flyout.open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
.rail-fly-title{font-family:var(--ui-font);font-size:13px;font-weight:700;
  color:var(--ac);margin:0 0 14px;display:flex;align-items:center;gap:8px;
  padding-bottom:10px;border-bottom:1px solid var(--bd)}
.rail-fly-close{margin-left:auto;font-size:20px;line-height:1;
  cursor:pointer;padding:0 2px;transition:color var(--t2)}
.rail-fly-close:hover{color:var(--ac)}

.zod-frame:hover{border-color:var(--bd-hi)}
.zod-frame.active{border-color:var(--bd-hi);background:var(--gl-ac);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ac) 28%,transparent),var(--glow-ac-sm)}
#layer-mode-label{font-family:var(--title-font);font-size:var(--fs-caption);font-weight:700;letter-spacing:0.08em;
  color:var(--ac);opacity:0.85;margin-right:8px;white-space:nowrap;flex-shrink:0}
#rail-flyout .rail-dock{display:flex;flex-direction:column;gap:7px;align-items:stretch}
#rail-flyout .rail-dock .coord-btns,#rail-flyout .rail-dock #hdr-inputs{display:flex!important;
  flex-wrap:wrap;gap:4px;align-items:center}
#rail-flyout .rail-dock .db-sep{display:none}
/* Chart Data flyout: roomy, legible inputs */
#rail-flyout[data-key="chartdata"]{min-width:312px;max-width:360px}
#rail-flyout[data-key="chartdata"] #hdr-inputs{gap:7px 8px;align-items:center}
#rail-flyout[data-key="chartdata"] #hdr-inputs label{font-size:11px;color:var(--td);font-weight:600;letter-spacing:0.02em}
#rail-flyout[data-key="chartdata"] #hdr-inputs input{font-size:13px;padding:6px 8px;border:1px solid var(--bd);
  background:var(--bg);color:var(--tx);border-radius:var(--r1)}
#rail-flyout[data-key="chartdata"] #hdr-inputs input[type=number]{width:56px}
#rail-flyout[data-key="chartdata"] #hdr-inputs input#in-tz{width:100%;flex:1 1 100%}
#rail-flyout[data-key="chartdata"] #hdr-inputs input#in-lat,
#rail-flyout[data-key="chartdata"] #hdr-inputs input#in-lng{width:86px}
#rail-flyout[data-key="chartdata"] #hdr-inputs button{padding:5px 10px;font-size:11px}
#rail-flyout[data-key="chartdata"] #btn-compute{width:100%;}
#rail-dock-storage{display:none}
/* ── Labelled rail mode (labels always shown beside glyphs) ── */
body.rail-labeled #icon-sidebar{width:226px;align-items:stretch;padding-left:9px;padding-right:9px;gap:4px;
  overflow-x:hidden}
body.rail-labeled #app{padding-left:226px}
body.rail-labeled .icon-sb-item .icon-sb-label{overflow:hidden;text-overflow:ellipsis}
body.rail-labeled .icon-sb-item{width:100%;justify-content:flex-start;gap:13px;padding-left:10px;height:40px}
body.rail-labeled .icon-sb-label{position:static;opacity:1;transform:none;border:none;height:auto;
  backdrop-filter:none;-webkit-backdrop-filter:none;padding:0;pointer-events:none;line-height:1.2;
  color:inherit;text-transform:none;letter-spacing:0.01em;font-size:14px;font-weight:500;white-space:nowrap}
body.rail-labeled .icon-sb-label::before{display:none}
body.rail-labeled .icon-sb-item .gly{flex-shrink:0;display:flex;align-items:center}
body.rail-labeled .icon-sb-divider{width:auto;margin:5px 6px}
/* ── Orbital Glass: global interaction + button/input polish (the part missing app-wide) ── */
/* Form controls don't inherit the page font; give them the glyph face too.
   :where() keeps this at zero specificity so any explicit font rule wins. */
:where(button,select,input,textarea){font-family:var(--ui-font)}
button,select,input,textarea{
  transition:background var(--t2),color var(--t2),border-color var(--t2),
    box-shadow var(--t2),transform .16s ease,opacity var(--t2)}
button:not(:disabled){cursor:pointer}
/* Hover = border highlight only (owner, round 3, 2026-10-06): no 1px lift on any button. */
button:not(:disabled):active{transform:translateY(0) scale(0.96)}
button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--ac) 55%,transparent)}
/* inputs & selects: softer radius + glass field + comfortable sizing */
select,input[type=text],input[type=number],input[type=date],textarea{border-radius:var(--r1);min-height:24px}
.sb-section-body select,.sb-section-body input{font-size:12px}
input[type=range]{accent-color:var(--ac)}
/* ════════════════ Phase F: depth & motion polish ════════════════ */
@keyframes glassPop{from{opacity:0;transform:translateY(7px) scale(0.984)}to{opacity:1;transform:none}}
/* modal backdrops: blur what's behind, animate the box in */
#info-modal,#map-modal{background:color-mix(in srgb,var(--bg) 50%,rgba(0,0,0,0.62))!important;
  backdrop-filter:blur(9px) saturate(1.2);-webkit-backdrop-filter:blur(9px) saturate(1.2)}
#info-modal.open #info-box,#map-modal.open #map-box{animation:glassPop .26s var(--ease-spring)}
.settings-float.open,#rail-flyout.open{animation:glassPop .2s var(--ease-spring)}
#info-box,#map-box,.settings-float,#tables-panel,#research-panel,#save-dialog{border-radius:var(--r3)}
/* titlebar sheen on modal/window headers */
#info-box .info-titlebar,#map-titlebar,.settings-float .sf-titlebar{position:relative}
#info-box .info-titlebar::after,#map-titlebar::after,.settings-float .sf-titlebar::after{
  content:'';position:absolute;inset:0;background:var(--lg-sheen);pointer-events:none}
#info-box .info-titlebar>*,#map-titlebar>*,.settings-float .sf-titlebar>*{position:relative;z-index:1}
/* tabs: smooth (no hover lift — owner, round 3) */
.tab-bar button{transition:all var(--t2),transform .18s var(--ease-spring)}
/* sidebar section titles: hover accent */
.sb-section-title{transition:color var(--t2),border-color var(--t2)}
.sb-section-title:hover{color:var(--ac);border-color:var(--bd-hi)}
/* drop-zones: glassy, reactive */
.drop-zone{transition:border-color var(--t2),background var(--t2),box-shadow var(--t2),transform .18s var(--ease-spring);border-radius:var(--r2)}
.drop-zone:hover{border-color:var(--bd-hi);box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 8%,transparent),var(--glow-ac-sm)}
.drop-zone.has-chart{background:linear-gradient(160deg,color-mix(in srgb,#fff 5%,transparent),transparent 60%),var(--gl-ac)}
.drop-zone.drag-over{box-shadow:0 0 0 1px var(--ac),var(--glow-ac);transform:scale(1.012)}
/* collapsible headers hover */
#speculum-hdr,#orb-panel h4{transition:color var(--t2)}
#speculum-hdr:hover,#orb-panel h4:hover{color:var(--ac)}
/* selects: faint sheen */
select{background-image:linear-gradient(160deg,color-mix(in srgb,#fff 7%,transparent),transparent 55%)}
/* ── Left-panel draggable tool boxes ── */
.sb-card{border:1px solid transparent;border-radius:var(--r2);padding:2px 4px 4px;margin-bottom:7px;
  background:linear-gradient(160deg,color-mix(in srgb,#fff 3%,transparent),transparent 60%);
  transition:border-color var(--t2),box-shadow var(--t2),opacity .15s ease}
.sb-card:hover{border-color:color-mix(in srgb,var(--bd-hi) 55%,transparent)}
.sb-card.dragging{opacity:0.45;box-shadow:var(--glow-ac);border-color:var(--bd-hi)}
.sb-drag{display:inline-block;cursor:grab;color:var(--td);margin-right:7px;font-size:12px;
  letter-spacing:-1px;opacity:0.55;transition:opacity var(--t2),color var(--t2)}
.sb-drag:hover{opacity:1;color:var(--ac)}
.sb-drag:active{cursor:grabbing}
/* chart-data card body is laid out by .cast-form (L2); the old inline-strip rules that lived here were removed */
#sb-chartdata-body #btn-compute{flex:1 1 100%;width:100%;}
#sb-chartdata-body #btn-compute:hover{border-color:var(--ac)}
/* ════════════════ Phase G: cursor-flow liquid FX ════════════════ */
#cursor-aura{position:fixed;left:0;top:0;width:440px;height:440px;border-radius:50%;pointer-events:none;
  z-index:7000;transform:translate3d(-50%,-50%,0);opacity:0;transition:opacity .5s ease;filter:blur(12px);
  
  mix-blend-mode:screen;will-change:transform}
body.cursor-fx #cursor-aura{opacity:1}
.glx-spot{position:relative}
.glx-spot::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  opacity:0;transition:opacity .3s ease;mix-blend-mode:screen;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,#fff 15%,transparent),transparent 60%)}
body.cursor-fx .glx-spot:hover::after{opacity:1}
.click-burst{position:fixed;width:16px;height:16px;border-radius:50%;pointer-events:none;z-index:9998;
  transform:translate3d(-50%,-50%,0) scale(0);mix-blend-mode:screen;
  background:radial-gradient(circle,color-mix(in srgb,var(--ac) 48%,transparent),transparent 70%)}
@keyframes burstFx{0%{transform:translate3d(-50%,-50%,0) scale(0);opacity:.85}
  100%{transform:translate3d(-50%,-50%,0) scale(7);opacity:0}}
.icon-sb-item .gly{transition:transform .16s ease}
.icon-sb-item:hover .gly{transform:scale(1.12)}
.icon-sb-item:active .gly{transform:scale(0.92)}
@media (prefers-reduced-motion:reduce){#cursor-aura,.glx-spot::after,.click-burst{display:none!important}}
/* ── Animated conic-gradient rings on active/open surfaces ── */
@property --ring-spin{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes ringSpin{to{--ring-spin:360deg}}
#rail-flyout.open::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--ring-spin),transparent 0deg,var(--ac) 70deg,transparent 150deg,
    transparent 215deg,var(--a2) 290deg,transparent 360deg);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;
  opacity:0.75}
/* smooth, brief mode-switch crossfade via the View Transitions API */
::view-transition-old(root),::view-transition-new(root){animation-duration:.32s}
/* ════════════════ Phase H: neon-HUD glass (cyan ↔ magenta duotone) ════════════════ */

/* dual-tone neon rim on the rail */
#icon-sidebar{box-shadow:inset -1px 0 0 color-mix(in srgb,#fff 6%,transparent),1px 0 24px rgba(0,0,0,0.35),
  inset -2px 0 16px color-mix(in srgb,var(--ac) 13%,transparent)}
/* glowing neon edge-line under the top bars */
#header,#display-bar,#dynamic-bar{position:relative}
#header::before,#display-bar::before,#dynamic-bar::before{content:'';position:absolute;left:0;right:0;bottom:-1px;
  height:1px;pointer-events:none;opacity:0.6;z-index:2;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--a2) 60%,transparent) 28%,
    color-mix(in srgb,var(--neon-mag) 50%,transparent) 72%,transparent)}
/* faint HUD scanlines on the side panels */
#sidebar,#right-panel{background-image:repeating-linear-gradient(0deg,
  color-mix(in srgb,var(--tx) 2.4%,transparent) 0 1px,transparent 1px 3px)!important}
/* iridescent cursor sheen on glass — cyan core fading to a magenta halo (prismatic) */

/* dual-neon glow on the open modal */
#rail-flyout.open{box-shadow:var(--sh3),0 0 42px color-mix(in srgb,var(--ac) 22%,transparent),
  0 0 64px color-mix(in srgb,var(--neon-mag) 12%,transparent)}
/* HUD treatment on the tool/layer label */
#layer-mode-label{text-shadow:0 0 8px color-mix(in srgb,var(--ac) 55%,transparent)}
#layer-mode-label::before{content:'⌐ ';color:var(--a2);opacity:0.75}
#layer-mode-label::after{content:' ¬';color:var(--neon-mag);opacity:0.6}
/* aurora-aware aura: tint the cursor aura toward magenta at the edge */
#cursor-aura{background:radial-gradient(circle,color-mix(in srgb,var(--ac) 20%,transparent) 0%,
  color-mix(in srgb,var(--neon-mag) 10%,transparent) 45%,transparent 66%)}

/* Graphic Ephemeris / Ephemeris-table modal */
#graph-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(0.97);z-index:9990;
  width:min(1600px,97vw);height:94vh;max-height:96vh;overflow:auto;background:var(--surf-modal);
  border:1px solid var(--bd-hi);border-radius:var(--r3);padding:22px 28px 24px;
  backdrop-filter:blur(28px) saturate(1.75);-webkit-backdrop-filter:blur(28px) saturate(1.75);
  opacity:0;pointer-events:none;transition:opacity var(--t2),transform var(--t2)}
#graph-modal.open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
#graph-modal .rail-fly-title{font-size:16px}
#graph-modal #graph-controls{font-size:13px}
#graph-modal #graph-controls select,#graph-modal #graph-controls button{font-size:13px!important;padding:7px 10px!important}
#graph-modal #graph-controls label,#graph-modal #graph-controls>div{font-size:12px!important}
#graph-modal table{border-collapse:collapse;font-family:var(--text-font);font-size:14px;width:100%;line-height:1.5}
#graph-modal th,#graph-modal td{border:1px solid var(--bd);padding:7px 13px;text-align:right;white-space:nowrap}
#graph-modal th{color:var(--ac);position:sticky;top:0;background:var(--surf-modal);font-size:13px;
  text-transform:uppercase;letter-spacing:0.05em}
#graph-modal tbody tr:nth-child(even){background:color-mix(in srgb,var(--tx) 4%,transparent)}
#graph-modal tbody tr:hover{background:var(--gl-ac)}
/* Tabbed Settings window (Objects / Orbs / Aspects / Display …) */
#settings-window{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(0.97);z-index:9991;
  width:min(860px,95vw);height:auto;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;
  background:var(--surf-modal);border:1px solid var(--bd-hi);border-radius:var(--r3);padding:18px 24px 0;
  backdrop-filter:blur(28px) saturate(1.75);-webkit-backdrop-filter:blur(28px) saturate(1.75);
  opacity:0;pointer-events:none;transition:opacity var(--t2),transform var(--t2)}
#settings-window.open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
#settings-window .rail-fly-title{font-size:15px;flex-shrink:0}
#settings-tabbar{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--bd);margin-bottom:14px;flex-shrink:0}

.settings-tab:hover{color:var(--tx);background:var(--gl-ac)}
.settings-tab.active{color:var(--ac);border-bottom-color:var(--ac);background:var(--gl-ac)}
#settings-tabbody{overflow-y:auto;flex:1 1 auto;padding-bottom:20px;font-size:12px;min-height:240px}
.settings-pane{display:none}
.settings-pane.active{display:block}
/* Collapsible settings sections (Display / Objects / Orbs & Aspects tabs) */
details.set-sec{border:1px solid var(--bd);border-radius:var(--r1);margin-bottom:8px;
  background:color-mix(in srgb,var(--tx) 3%,transparent);overflow:hidden}
details.set-sec>summary{list-style:none;display:flex;align-items:center;gap:7px;padding:7px 10px;cursor:pointer;
  user-select:none;font-family:var(--title-font);font-size:var(--fs-caption);font-weight:700;letter-spacing:0.08em;
  color:var(--ac);transition:background var(--t2)}
details.set-sec>summary::-webkit-details-marker{display:none}
details.set-sec>summary::before{content:'';width:0;height:0;border-left:5px solid var(--td);
  border-top:4px solid transparent;border-bottom:4px solid transparent;flex-shrink:0;transition:transform var(--t2)}
details.set-sec[open]>summary::before{transform:rotate(90deg)}
details.set-sec>summary:hover{background:var(--gl-ac)}
details.set-sec>summary .sec-sub{margin-left:auto;font-family:var(--text-font);font-size:var(--fs-caption);font-weight:400;
  letter-spacing:0;text-transform:none;color:var(--td);opacity:0.85;white-space:nowrap}
details.set-sec>summary input[type=checkbox]{accent-color:var(--ac);width:12px;height:12px;margin:0;cursor:pointer}
details.set-sec>.sec-body{padding:6px 10px 10px}
details.set-sec.placeholder>summary{color:var(--td);opacity:0.65}
.set-lbl{font-size:var(--fs-caption);color:var(--tx);margin:8px 0 4px;letter-spacing:0.5px;opacity:0.7}
.sec-body .set-lbl:first-child{margin-top:0}
/* Compact labelled slider rows (Display → Size & Scale) */
.scale-row{display:grid;grid-template-columns:96px 1fr 40px 22px;align-items:center;gap:6px;margin-bottom:5px;font-size:var(--fs-caption)}
.scale-row>label{color:var(--td);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:default}
.scale-row input[type=range]{width:100%;height:12px;accent-color:var(--ac)}
.scale-row .scale-val{font-size:var(--fs-caption);color:var(--td);text-align:right}

.scale-row .scale-rst:hover{border-color:var(--ac);color:var(--ac)}
.wd-select{grid-column:2 / span 3;padding:3px;font-size:var(--fs-caption);background:var(--pn);color:var(--tx);border:1px solid var(--bd);border-radius:3px;cursor:pointer}
.wd-check{display:flex;align-items:center;gap:4px;font-size:var(--fs-caption);color:var(--td);margin:0 0 5px;cursor:pointer}
.wd-check input{accent-color:var(--ac);margin:0}
.wd-ctx{display:none}
.wd-note{font-size:var(--fs-caption);color:var(--td);opacity:0.75;line-height:1.4;margin-top:6px}
.wd-chips{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}

.wd-chip:hover{border-color:var(--ac)}
.wd-chip.active{background:var(--gl-ac);border-color:var(--ac);color:var(--ac)}
.wd-chip[hidden]{display:none}
.wd-chip-mine{font-style:italic}
.wd-preset-desc{margin:0 0 8px;min-height:2.8em}
.wd-io{display:flex;gap:4px;flex-wrap:wrap}

.wd-io button:hover{border-color:var(--ac);color:var(--ac)}
.wd-colour-row input[type=color]{width:56px;justify-self:start;height:18px;padding:0;border:1px solid var(--bd);border-radius:3px;background:none;cursor:pointer}
.wd-colour-row.wd-custom .scale-val{color:var(--ac)}
/* Search + expand/collapse tools row in the Settings window */
#settings-tools{display:flex;align-items:center;gap:6px;margin:0 0 12px;flex-shrink:0}
#settings-tools input{flex:1;padding:5px 9px;font-size:11px;background:var(--bg);color:var(--tx);
  border:1px solid var(--bd);border-radius:var(--r1);outline:none;font-family:inherit}
#settings-tools input:focus{border-color:var(--ac)}
#settings-tools button{
  white-space:nowrap;}
#settings-tools button:hover{color:var(--ac);border-color:var(--ac)}
/* Data Tools launcher menu */
#data-menu{position:fixed;left:64px;z-index:9992;min-width:210px;
  border:1px solid var(--bd-hi);padding:8px;
  backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);
  display:flex;flex-direction:column;gap:2px;opacity:0;transform:translateX(-6px);pointer-events:none;
  transition:opacity var(--t2),transform var(--t2)}
#data-menu.open{opacity:1;transform:none;pointer-events:auto}
body.rail-labeled #data-menu{left:182px}
.data-menu-title{font-family:var(--ui-font);font-size:var(--fs-caption);font-weight:700;letter-spacing:0.08em;
  color:var(--ac);padding:2px 8px 7px}
#data-menu button{
  cursor:pointer;transition:all var(--t2)}
#data-menu button:hover{background:var(--gl-ac);color:var(--ac)}
/* Interactive Astro-Cartography map (Leaflet) */

/* Astro-Cartography is a rail chart mode (owner, round 3): the globe fills the app beside the rail, so the rail stays usable. */
#globe-overlay{position:fixed;inset:0;z-index:9993;display:none;left:58px}
body.rail-labeled #globe-overlay{left:226px}
#globe-overlay.open{display:flex}
/* Master transport (plan P7): the globe follows the time bar; its own clock selectors are hidden (legacy flag restores). */
#globe-overlay.globe-follows-bar #globe-tmode,#globe-overlay.globe-follows-bar #globe-tkey-wrap,#globe-overlay.globe-follows-bar #globe-tspeed{display:none!important}
/* MOTION CONSUMERS: the period / return in force at the time bar, and what moves the bar there. */
.motion-current{background:color-mix(in srgb,var(--ac) 16%,transparent)!important;box-shadow:inset 3px 0 0 var(--ac)}
.motion-seek{cursor:pointer;text-decoration:underline dotted color-mix(in srgb,var(--ac) 55%,transparent);text-underline-offset:2px}
.motion-seek:hover,.motion-seek:focus-visible{color:var(--ac)!important;outline:none}
.motion-return-strip{border:1px solid var(--bd);border-radius:4px;padding:4px 6px;margin:0 0 8px;background:var(--sf)}
.motion-strip-h{font-family:var(--title-font);font-size:var(--fs-caption);letter-spacing:.06em;color:var(--td);margin-bottom:3px}
.motion-return-row{font-size:var(--fs-caption);padding:2px 4px;border-radius:3px;color:var(--tx)}
.motion-return-row .motion-when{color:var(--a2)}
.motion-return-row .motion-tag{font-size:var(--fs-caption);color:var(--td);margin-left:4px}
.motion-strip-note{font-size:var(--fs-caption);color:var(--td)}
#globe-map{flex:1;min-width:0;height:100%;background:#06060f}
.globe-city{width:9px;height:9px;border-radius:50%;background:#9d8cff;border:1.5px solid #fff;box-shadow:0 0 6px rgba(157,140,255,0.8);cursor:pointer}
.maplibregl-popup-content{background:var(--surf-modal);color:var(--tx);border:1px solid var(--bd-hi)}
.globe-view-btn{flex:1;}
.globe-view-btn:hover{color:var(--tx)}
.globe-view-btn.active{background:var(--gl-ac);border-color:var(--bd-hi);color:var(--ac)}
#globe-mini{position:absolute;left:18px;bottom:18px;z-index:1100;display:none;width:360px;
  border:1px solid var(--bd-hi);border-radius:var(--r2);padding:8px 8px 6px;
  
  resize:both;overflow:hidden;min-width:200px;max-width:640px}
.globe-pill.paran{border-style:dashed;font-style:italic}
.globe-pill.harm{font-size:var(--fs-caption);font-weight:600;padding:0px 5px;opacity:0.9;background:rgba(12,14,24,0.82);box-shadow:none}
#globe-mini canvas{display:block;width:100%}
#globe-mini .gm-loc{font-family:var(--text-font);font-size:11px;color:var(--a2);text-align:center;margin-bottom:2px}
#globe-mini .gm-cap{font-family:var(--ui-font);font-size:var(--fs-caption);letter-spacing:0.08em;color:var(--td);text-align:center;margin-top:2px}
.globe-pill{display:inline-block;transform:translate(-50%,-50%);padding:1px 7px;border-radius:11px;
  background:#fff;border:1.5px solid #888;font-family:var(--text-font);font-size:11px;font-weight:700;
  white-space:nowrap;line-height:1.5;box-shadow:0 1px 4px rgba(0,0,0,0.35)}
#globe-side{width:288px;flex-shrink:0;height:100%;background:var(--surf-modal);border-left:1px solid var(--bd-hi);
  padding:20px 22px;overflow-y:auto;z-index:1000;box-shadow:var(--sh3)}
#globe-side .rail-fly-title{font-size:15px}
.globe-tip{background:var(--surf-modal)!important;border:1px solid var(--bd-hi)!important;color:var(--tx)!important;
  font-family:var(--text-font)!important;font-size:12px!important;box-shadow:var(--glow-ac-sm)!important}
.globe-tip::before{display:none!important}
#globe-map .leaflet-popup-content-wrapper,#globe-map .leaflet-popup-tip{background:var(--surf-modal);color:var(--tx);border:1px solid var(--bd-hi)}
.gl-pop-h{font-family:var(--ui-font);font-size:11px;color:var(--a2);margin-bottom:5px;letter-spacing:0.04em;font-weight:600}
.gl-pop-empty{font-size:11px;color:var(--td)}
.gl-row{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--tx);padding:2px 0;white-space:nowrap}
.gl-row .gl-sw{width:9px;height:9px;border-radius:2px;flex:0 0 auto;box-shadow:0 0 4px currentColor}
.gl-row .gl-d{margin-left:auto;color:var(--td);font-variant-numeric:tabular-nums;padding-left:10px}
.gl-pin{width:100%;}
/* Inline SVG icons (replace emoji everywhere; astro glyphs stay in .gl spans) */
.ico{display:inline-block;width:1.05em;height:1.05em;vertical-align:-0.17em;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* Epistemic-confidence markers (Harmonic Earth module): dots, not emoji */
.conf{display:inline-block;width:.62em;height:.62em;border-radius:50%;margin:0 .3em;vertical-align:baseline;box-shadow:0 0 0 1px color-mix(in srgb,currentColor 25%,transparent)}
.conf-r{background:#e05242}.conf-y{background:#e0b342}.conf-g{background:#4fbf7a}
/* Chart identity card (left panel, L1): which chart(s) am I looking at */
#ident-card{top:0;z-index:3;padding:4px 10px;border-radius:var(--r2);background:linear-gradient(160deg,var(--gl2),var(--gl0)),var(--surf-panel);border:1px solid var(--bd);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),var(--sh1,none);backdrop-filter:blur(14px) saturate(1.5);-webkit-backdrop-filter:blur(14px) saturate(1.5)}
.ident-row{display:flex;gap:9px;padding:7px 0}
.ident-row+.ident-row{border-top:1px dashed var(--bd)}
.ident-dot{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:none;box-shadow:0 0 6px currentColor}
.ident-main{min-width:0;flex:1}
.ident-name{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-family:var(--title-font);font-size:12px;color:var(--tx);line-height:1.25}
.ident-name b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.ident-badge{font-family:var(--text-font);font-size:var(--fs-caption);letter-spacing:.1em;padding:1px 6px;border-radius:var(--r5);border:1px solid var(--bd-hi);color:var(--ac)}
.ident-when{font-size:11px;color:var(--tx);font-variant-numeric:tabular-nums;margin-top:2px}
.ident-where,.ident-frame{font-size:var(--fs-caption);color:var(--td);font-variant-numeric:tabular-nums;margin-top:1px}
.ident-where.ident-prov{cursor:pointer}.ident-where.ident-prov:hover{color:var(--ac)}
.ident-empty{font-size:11px;color:var(--td);padding:6px 0}
/* ── Console shell (L5) ── */
#sidebar{display:flex;flex-direction:column;overflow-x:hidden}
#sidebar .resize-handle{right:0}   /* was right:-3px, which made the whole panel scroll sideways by 3px */   /* lets the action bar sit at the bottom even when a section is short */
#console-head{position:sticky;top:-8px;z-index:5;flex:none;margin:-8px -8px 8px;padding:8px 8px 8px;background:var(--surf-panel);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);border-bottom:1px solid var(--bd)}
#ident-card{position:static;margin:0 0 8px;max-height:38vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--bd) transparent}
.console-tabs{display:flex;}

#console-toast{margin-top:7px;padding:6px 9px;font-size:var(--fs-caption);line-height:1.4;color:var(--tx);background:var(--gl-ac);border:1px solid var(--bd-hi);border-radius:var(--r1)}
#sidebar .sb-card{background:none;border:0;box-shadow:none;padding:0;margin:0;backdrop-filter:none;-webkit-backdrop-filter:none}
#sidebar .sb-card>.sb-section-title{display:none}
#sidebar[data-console-tab="cast"] .sb-card:not([data-card="chartdata"]),
#sidebar[data-console-tab="library"] .sb-card:not([data-card="library"]){display:none!important}
/* Atlas lives inside CAST, directly beneath WHERE (owner decision 2026-09-27: tabs are CAST + LIBRARY only). */
.cast-atlas{margin:2px 0 10px;border:1px solid var(--bd);border-radius:var(--r2);background:var(--gl0)}
.cast-atlas>summary{display:flex;align-items:center;gap:6px;padding:6px 9px;cursor:pointer;list-style:none;font-family:var(--title-font);font-size:var(--fs-caption);letter-spacing:.16em;color:var(--td);}
.cast-atlas>summary::-webkit-details-marker{display:none}
.cast-atlas>summary::after{content:'▸';margin-left:auto;font-family:var(--num-font)}
.cast-atlas[open]>summary::after{content:'▾'}
.cast-atlas>summary:focus-visible{outline:2px solid var(--ac);outline-offset:1px}
.cast-atlas>#sb-atlas-body{padding:0 9px 9px}
#console-actions{position:sticky;bottom:-8px;z-index:5;flex:none;display:flex;gap:6px;margin:auto -8px -8px;padding:8px;background:var(--surf-panel);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);border-top:1px solid var(--bd)}
#sidebar #console-actions button{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;}

#sidebar #console-actions #btn-save{flex:1.5;background:var(--ac);width:auto;margin:0}
#sidebar #console-actions #btn-save:hover{background:color-mix(in srgb,var(--ac) 82%,#fff);color:var(--bg)}
.ident-acts{display:flex;gap:1px;flex:none;align-self:flex-start;opacity:.5;margin-top:1px}
.ident-row:hover .ident-acts,.ident-row:focus-within .ident-acts{opacity:1}
.ident-add{margin:6px 0 4px}
#sidebar .chip:focus-visible,#sidebar .seg button:focus-visible,#sidebar .ident-act:focus-visible,#sidebar .lib-menu-btn:focus-visible,.combo-item:focus-visible,.frame-row:focus-visible{outline:2px solid var(--ac);outline-offset:1px}
@media (prefers-reduced-motion: reduce){.lf-arrow,.af-arrow,.lr-arrow{transition:none}}
/* sidebar buttons: neutralise the blanket '#sidebar button' look for the shared components */
#sidebar .chip{background:var(--gl0);color:var(--tx);border:1px solid var(--bd);border-radius:var(--r5);padding:3px 9px;font-size:var(--fs-caption)}
#sidebar .chip:hover:not(:disabled){background:var(--gl-ac);color:var(--ac);border-color:var(--bd-hi)}
#sidebar .chip.on,#sidebar .frame-pop .chip.on{background:color-mix(in srgb,var(--ac) 30%,transparent);color:var(--tx);border-color:var(--bd-hi)}
#sidebar .seg button{background:transparent;color:var(--td);border-radius:0;padding:5px 8px}
#sidebar .seg button:hover{background:var(--gl-ac);color:var(--ac)}
#sidebar .seg button.on{background:color-mix(in srgb,var(--ac) 30%,transparent);color:var(--tx)}
#sidebar .lib-menu-btn,#sidebar .ident-act{padding:4px;display:inline-flex;cursor:pointer}
#sidebar .lib-menu-btn:hover,#sidebar .ident-act:hover{background:var(--gl1);color:var(--ac)}
.ident-frame.ident-link{cursor:pointer}.ident-frame.ident-link:hover{color:var(--ac)}
/* FRAME card (L3): house system + zodiac */
.frame-form:not(.sb-collapsed){display:flex;flex-direction:column;gap:14px;padding:3px 0}
.frame-pop{display:flex;flex-wrap:wrap;gap:5px}
.frame-pop .chip.on{background:color-mix(in srgb,var(--ac) 30%,transparent);border-color:var(--bd-hi);color:var(--tx);font-weight:600}
.frame-cur{margin-top:8px;padding:7px 9px;border-radius:var(--r1);background:var(--gl0);border:1px solid var(--bd)}
.frame-cur b{font-size:12px;color:var(--tx);font-weight:600}
.frame-cur div{font-size:var(--fs-caption);color:var(--td);margin-top:2px;line-height:1.35}
.frame-more{margin-top:7px;border:1px solid var(--bd);border-radius:var(--r2);background:var(--gl0);overflow:hidden}
.frame-more input{width:100%;box-sizing:border-box;padding:6px 9px;font-size:12px;background:var(--gl1);border:0;border-bottom:1px solid var(--bd);color:var(--tx);font-family:var(--text-font);border-radius:0}
.frame-more input:focus{outline:none;background:var(--gl2)}
.frame-more-list{max-height:250px;overflow:auto}
.frame-row{padding:6px 10px;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.frame-row:hover,.frame-row.hi{background:var(--gl-ac)}
.frame-row.on{background:color-mix(in srgb,var(--ac) 22%,transparent)}
.frame-row b{font-size:12px;color:var(--tx);font-weight:600}
.frame-row span{font-size:var(--fs-caption);color:var(--td);line-height:1.3}
.frame-zseg{display:flex;width:100%}.frame-zseg button{flex:1}
.frame-zdesc{font-size:var(--fs-caption);color:var(--td);margin-top:6px;line-height:1.35}
.frame-aya{margin-top:9px}
.frame-sum{font-size:var(--fs-caption);color:var(--td);border-top:1px dashed var(--bd);padding-top:8px}
.frame-sum b{color:var(--tx);font-weight:600}
/* Shared form components (L2): segmented control, chip, combobox */
.seg{flex:none}
.seg button{border:0;border-radius:0;padding:4px 10px;font-size:var(--fs-caption);letter-spacing:.07em;background:transparent;color:var(--td);cursor:pointer}
.seg button+button{border-left:1px solid var(--bd)}
.seg button.on{background:color-mix(in srgb,var(--ac) 30%,transparent);color:var(--tx);font-weight:600}
.chip{display:inline-flex;align-items:center;gap:5px;}

.combo{position:relative}
.combo-in{display:flex;align-items:center;gap:6px}
.combo-list{position:absolute;left:0;right:0;top:100%;margin-top:4px;z-index:30;max-height:240px;overflow:auto;background:var(--surf-modal);border:1px solid var(--bd-hi);border-radius:var(--r2);box-shadow:var(--sh3,0 8px 24px rgba(0,0,0,.35));backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6)}
.combo-item{padding:6px 10px;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.combo-item.hi,.combo-item:hover{background:var(--gl-ac)}
.combo-main{font-size:12px;color:var(--tx)}
.combo-sub{font-size:var(--fs-caption);color:var(--td);font-variant-numeric:tabular-nums}
.combo-h{font-size:var(--fs-caption);letter-spacing:.12em;color:var(--td);padding:6px 10px 2px}
.combo-empty{padding:9px 10px;font-size:11px;color:var(--td)}
/* CAST form (left panel, L2) */
.cast-form:not(.sb-collapsed){display:flex;flex-direction:column;gap:12px;padding:3px 0}
.cast-t{font-family:var(--title-font);font-size:var(--fs-caption);letter-spacing:.16em;color:var(--td);margin:0 0 5px}
.cast-grid{display:grid;gap:6px}
.cast-date{grid-template-columns:1.5fr 1fr 1fr}
.cast-time{grid-template-columns:1fr 1fr 1.5fr}
.cast-f{display:flex;flex-direction:column;gap:2px;min-width:0}
.cast-f>span.cap{font-size:var(--fs-caption);letter-spacing:.09em;color:var(--td);}
.cast-form input:not([type=checkbox]),.cast-form select,.frame-form input:not([type=checkbox]){width:100%;box-sizing:border-box;min-width:0;padding:5px 7px;font-size:12px;background:var(--gl1);border:1px solid var(--bd);border-radius:var(--r1);color:var(--tx);font-family:var(--text-font);font-variant-numeric:tabular-nums}
.cast-form input:focus,.frame-form input:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 2px color-mix(in srgb,var(--ac) 25%,transparent)}
.cast-zone{display:flex;gap:6px;align-items:center;margin-top:7px}
.cast-zone input{flex:1}
.cast-off{font-size:var(--fs-caption);color:var(--td);margin-top:4px;font-variant-numeric:tabular-nums}
.cast-coords{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.cast-coords:has(#lat-dms[style*="display: flex"]){grid-template-columns:1fr}
.cast-coords .cast-f>div{display:flex;gap:3px;align-items:center;flex-wrap:wrap}
.cast-coords #lat-dec,.cast-coords #lng-dec{display:block;width:100%}
.cast-coords #lat-dms input,.cast-coords #lng-dms input{width:auto!important;min-width:0}
.cast-coords #lat-dms input[type=number],.cast-coords #lng-dms input[type=number]{width:42px!important}
.cast-coord-tools{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:var(--fs-caption);color:var(--td)}
#btn-compute.cast-go{width:100%;padding:9px;font-size:12px;letter-spacing:.2em;border-radius:var(--r2);cursor:pointer;color:var(--ac);background:var(--gl-ac);border:1px solid var(--bd-hi);position:relative}
#btn-compute.cast-go.cast-dirty{color:var(--bg);background:var(--ac);box-shadow:0 0 0 2px color-mix(in srgb,var(--ac) 30%,transparent),0 0 14px color-mix(in srgb,var(--ac) 45%,transparent)}
#btn-compute.cast-go.cast-dirty::after{content:'';position:absolute;right:10px;top:50%;width:7px;height:7px;margin-top:-3px;border-radius:50%;background:var(--bg)}
.gl-pin:hover{background:var(--bd-hi)}
.gl-paran-row{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--tx);padding:3px 5px;cursor:pointer;border-radius:4px;white-space:nowrap}
.gl-paran-row:hover{background:var(--gl-ac)}
.gl-paran-row .gl-pl{font-variant-numeric:tabular-nums;color:var(--a2)}
.mt-key{font-size:11px;color:var(--tx);margin:3px 0;font-variant-numeric:tabular-nums}
.mt-s{color:var(--td);font-size:var(--fs-caption)}
.mt-grp{font-size:var(--fs-caption);letter-spacing:0.07em;color:var(--td);margin:8px 0 2px;border-bottom:1px solid var(--bd)}
.mt-hit{color:#e8c64a;cursor:help}
#globe-ruler-out .gl-row{font-size:11px}
#globe-ruler-out .gl-row .gl-d{font-variant-numeric:tabular-nums}
#globe-ruler-btn.active{background:var(--gl-ac);border-color:var(--bd-hi);color:var(--ac)}
/* Speculum — sortable, legible */
.speculum-table{border-collapse:collapse;font-family:var(--text-font);font-size:12px;width:100%;line-height:1.55}
.speculum-table th{position:sticky;top:0;z-index:1;background:var(--surf-elev);color:var(--ac);
  padding:7px 10px;font-size:11px;text-transform:uppercase;letter-spacing:0.04em;text-align:right;
  white-space:nowrap;border-bottom:1px solid var(--bd);user-select:none}
.speculum-table th:hover{color:var(--a2)}
.speculum-table th.sorted{color:var(--a2)}
.speculum-table th.sorted::after{content:' ▾';font-size:var(--fs-caption);opacity:0.8}
.speculum-table td{padding:6px 10px;text-align:right;white-space:nowrap;
  border-bottom:1px solid color-mix(in srgb,var(--bd) 45%,transparent)}
.speculum-table tbody tr:nth-child(even){background:color-mix(in srgb,var(--tx) 3.5%,transparent)}
.speculum-table tbody tr:hover{background:var(--gl-ac)}
.speculum-table .gl{font-size:15px}
#speculum-body{max-height:460px!important}
/* Speculum: the glyph and name columns stay pinned on the left while the numbers scroll sideways (owner 2026-10-10).
 * The pinned cells need an opaque fill (a row's background does not paint under a sticky cell), so the stripe and the
 * hover tint are layered over the panel colour. The glyph column has a fixed width so the name column knows its offset. */
:is(.speculum-table,.speculum-perm){--spec-gw:30px;--spec-fill:var(--pn)}
.speculum-perm{--spec-gw:22px}
:is(.speculum-table,.speculum-perm) tr>:is(th,td:not([colspan])):nth-child(-n+2){position:sticky;background:var(--spec-fill)}
:is(.speculum-table,.speculum-perm) tr>:is(th,td:not([colspan])):first-child{left:0;width:var(--spec-gw);min-width:var(--spec-gw);max-width:var(--spec-gw);box-sizing:border-box;padding-left:2px;padding-right:2px;text-align:center}
:is(.speculum-table,.speculum-perm) tr>:is(th,td:not([colspan])):nth-child(2){left:var(--spec-gw);box-shadow:inset -1px 0 0 var(--bd),6px 0 6px -6px rgba(0,0,0,.45)}
:is(.speculum-table,.speculum-perm) tbody tr>td:not([colspan]):nth-child(-n+2){z-index:1}
:is(.speculum-table,.speculum-perm) thead tr>th:not([colspan]):nth-child(-n+2){z-index:3;background:var(--sf)}
.speculum-table tbody tr:nth-child(even)>td:not([colspan]):nth-child(-n+2){background:linear-gradient(color-mix(in srgb,var(--tx) 3.5%,transparent),color-mix(in srgb,var(--tx) 3.5%,transparent)),var(--spec-fill)}
:is(.speculum-table,.speculum-perm) tbody tr:hover>td:not([colspan]):nth-child(-n+2){background:linear-gradient(var(--gl-ac),var(--gl-ac)),var(--spec-fill)}
[data-glass-ui] :is(.speculum-table,.speculum-perm){--spec-fill:var(--glass-raised)}
/* Helio speculum: compact cells in the narrow helio side panel; the wrapper scrolls sideways, never clips. */
.helio-speculum-scroll{overflow-x:auto;max-width:100%}
.helio-speculum.speculum-table{font-size:11px;width:max-content;min-width:100%}
.helio-speculum.speculum-table td{padding:4px 8px}
.helio-speculum.speculum-table th{padding:4px 8px;cursor:default}
.dyn-title{font-size:var(--fs-caption);letter-spacing:0.06em;opacity:0.8}
/* ── HUD corner brackets on modals (instrument framing) ── */
#rail-flyout.open::before,#info-modal.open #info-box::before,#map-modal.open #map-box::before{
  content:'';position:absolute;inset:6px;pointer-events:none;z-index:4;opacity:0.7;
  --c:color-mix(in srgb,var(--a2) 62%,transparent);--l:15px;--w:1.5px;
  background:
    linear-gradient(var(--c),var(--c)) top left/var(--l) var(--w) no-repeat,
    linear-gradient(var(--c),var(--c)) top left/var(--w) var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) top right/var(--l) var(--w) no-repeat,
    linear-gradient(var(--c),var(--c)) top right/var(--w) var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) bottom left/var(--l) var(--w) no-repeat,
    linear-gradient(var(--c),var(--c)) bottom left/var(--w) var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) bottom right/var(--l) var(--w) no-repeat,
    linear-gradient(var(--c),var(--c)) bottom right/var(--w) var(--l) no-repeat;}
/* ── Typography refinement ── */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
.sb-section-title{letter-spacing:0.08em;}
.rail-fly-title,.sf-titlebar h4,#map-titlebar span,.info-titlebar h1{letter-spacing:0.1em}
/* ════════════════ Phase I: holographic / crystal sheen (subtle) ════════════════ */
@keyframes holoHue{to{filter:hue-rotate(360deg)}}
/* prismatic 3-hue cursor sheen on glass (cyan → violet → magenta) */
body.cursor-fx .glx-spot:hover::after{background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),
  color-mix(in srgb,var(--a2) 15%,transparent),color-mix(in srgb,var(--ac) 11%,transparent) 33%,
  color-mix(in srgb,var(--neon-mag) 8%,transparent) 56%,transparent 70%)}
/* holographic shimmer: slowly rotate the conic rings' hue */
#rail-flyout.open::after{animation:ringSpin 6s linear infinite,holoHue 11s linear infinite}
/* crystal reflective top edge on cards */
.sb-card{box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 9%,transparent)}
/* faint iridescent facet wash over the rail (crystal feel) */
#icon-sidebar::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:0.4;
  background:linear-gradient(150deg,color-mix(in srgb,var(--a2) 6%,transparent),transparent 35%,
    color-mix(in srgb,var(--neon-mag) 5%,transparent) 75%,transparent)}

/* ════════════════ Phase J: LIQUID GLASS 2.0 — lensing · variants · adaptivity ════════════════
   Refraction rim (lensing) on every glass surface, Regular/Clear material variants,
   scroll-aware chrome, and system accessibility overrides. All token-derived. */
:root{--lg-edge:inset 0 0.5px 0 color-mix(in srgb,#fff 18%,transparent),inset 0 -0.5px 0 color-mix(in srgb,#000 22%,transparent);
  --lg-sheen:linear-gradient(155deg, color-mix(in srgb,#fff 9%,transparent) 0%, transparent 42%); --neon-mag:#ff5cce;
  /* Lensing rim: light concentrates along the top edge, micro-highlights bleed down the
     sides, shadow gathers at the bottom — reads as a curved glass edge, not a border. */
  --lens:inset 0 1px 0 color-mix(in srgb,#fff 15%,transparent),
         inset 1px 0 0 color-mix(in srgb,#fff 6%,transparent),
         inset -1px 0 0 color-mix(in srgb,#fff 4%,transparent),
         inset 0 -1px 0 color-mix(in srgb,#000 32%,transparent);
  --lens-soft:inset 0 1px 0 color-mix(in srgb,#fff 9%,transparent),
              inset 0 -1px 0 color-mix(in srgb,#000 20%,transparent);
  /* Clear variant — for surfaces floating over live canvas content */
  --surf-clear:color-mix(in srgb,var(--bg) 58%,transparent);
  --dim:color-mix(in srgb,var(--bg) 45%,rgba(0,0,0,0.55));}
/* Lensing applied: chrome gets the soft rim, floating windows the full rim */
#header,#display-bar,#dynamic-bar,#sidebar,#right-panel,.tab-bar,.sub-tab-bar{box-shadow:var(--lens-soft)}
#info-box,#map-box,#save-dialog,.settings-float,#tables-panel,#research-panel,#log-overlay{
  box-shadow:var(--lens),var(--sh3),var(--glow-ac)}
#rail-flyout,#settings-window,#graph-modal{box-shadow:var(--lens),var(--sh3),var(--glow-ac)}

/* Clear variant: zoom bar, tooltip, globe mini-chart float over the chart itself */
#zoom-bar,#globe-mini{background:var(--surf-clear)!important;border-color:var(--bd-hi);
  backdrop-filter:blur(18px) saturate(1.5)!important;-webkit-backdrop-filter:blur(18px) saturate(1.5)!important;
  box-shadow:var(--lens-soft),var(--sh2)}
#zoom-bar{border-radius:var(--r5);padding:5px 10px}
#zoom-label{font-size:var(--fs-caption)}
#tooltip{background:var(--surf-clear)!important;border:1px solid var(--bd-hi);border-radius:var(--r2);
  backdrop-filter:blur(18px) saturate(1.5)!important;-webkit-backdrop-filter:blur(18px) saturate(1.5)!important;
  box-shadow:var(--lens-soft),var(--sh2),var(--glow-ac-sm);font-size:12px;padding:10px 12px;line-height:1.65}
/* ── Un-glassed stragglers: modal backdrops dim + blur ── */
#library-modal-overlay,#bug-report-overlay,#admin-overlay,#save-dialog-overlay{
  background:var(--dim)!important;
  backdrop-filter:blur(9px) saturate(1.2);-webkit-backdrop-filter:blur(9px) saturate(1.2)}
/* …and their dialogs become full glass cards */
#library-modal,#admin-dialog,#bug-report-dialog{
  background:var(--surf-modal);border:1px solid var(--bd-hi);border-radius:var(--r3);
  box-shadow:var(--lens),var(--sh3),var(--glow-ac);
  backdrop-filter:blur(28px) saturate(1.75);-webkit-backdrop-filter:blur(28px) saturate(1.75);
  animation:glassPop .24s var(--ease-spring)}
#admin-dialog button,#bug-report-dialog button{border-radius:var(--r1)}
#bug-submit-btn{background:var(--gl-red)!important;color:#ff9587!important;
  border:1px solid rgba(224,82,66,0.45)!important;box-shadow:var(--lens-soft)}
#bug-submit-btn:hover{border-color:#e05242}
#bug-report-dialog input,#bug-report-dialog textarea,#bug-report-dialog select{border-radius:var(--r1)}
#lib-modal-search{border-radius:var(--r5);padding:5px 12px!important;font-size:12px!important}
/* Header popovers (export menu · gear settings) */
#export-menu,#settings-popup{background:var(--surf-modal)!important;border:1px solid var(--bd-hi)!important;
  border-radius:var(--r2)!important;box-shadow:var(--lens-soft),var(--sh2),var(--glow-ac-sm)!important;
  backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6)}
#export-menu .export-opt{transition:all var(--t2)}
/* Login / license gate — the first surface a user ever sees */
#license-gate{background:
  radial-gradient(ellipse at 18% 82%, rgba(157,140,255,0.10), transparent 55%),
  radial-gradient(ellipse at 82% 14%, rgba(79,216,232,0.08), transparent 50%),
  #0a0912!important}
#license-gate>div{background:rgba(14,12,24,0.55);border:1px solid rgba(201,170,111,0.28);
  border-radius:var(--r3);backdrop-filter:blur(26px) saturate(1.6);-webkit-backdrop-filter:blur(26px) saturate(1.6);
  box-shadow:var(--lens),0 12px 48px rgba(0,0,0,0.55),0 0 70px rgba(201,170,111,0.10);
  animation:glassPop .3s var(--ease-spring)}
#license-gate input{background:rgba(8,7,16,0.55)!important;border:1px solid rgba(201,170,111,0.32)!important;
  border-radius:var(--r1)!important;transition:border-color var(--t2),box-shadow var(--t2)}
#license-gate input:focus{border-color:#c9aa6f!important;outline:none;
  box-shadow:0 0 0 2px rgba(201,170,111,0.22),0 0 18px rgba(201,170,111,0.18)}
#license-gate button{border-radius:var(--r1)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.35),0 2px 14px rgba(201,170,111,0.30)}
#license-gate button:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,0.4),0 0 26px rgba(201,170,111,0.45)}
/* Header account chrome — was 8px grey-on-grey */
/* Hardcoded near-black hairlines → theme tokens (were invisible on light themes) */
.lap-tbl td,.ev-row,#research-panel td{border-bottom-color:color-mix(in srgb,var(--bd) 55%,transparent)}
/* ── Scroll-aware chrome: content visibly slips under the glass as you scroll ── */
.lg-scrolled{box-shadow:inset 0 16px 14px -14px rgba(0,0,0,0.5)}
#sidebar.lg-scrolled,#right-panel .tab-content.lg-scrolled{
  box-shadow:var(--lens-soft),inset 0 16px 14px -14px rgba(0,0,0,0.5)}
/* ════════════════ Phase K: de-crowding & legibility pass ════════════════ */
*::-webkit-scrollbar{width:5px;height:5px}
input[type=checkbox]{accent-color:var(--ac)}
/* header: one comfort tier up */
#header{min-height:44px;gap:7px;padding:4px 10px}
#header input{padding:5px 7px;font-size:12.5px}

#header #btn-compute{background:linear-gradient(160deg,color-mix(in srgb,#fff 14%,transparent),transparent 55%),var(--gl-ac);
  color:var(--ac);border:1px solid var(--bd-hi);letter-spacing:0.08em;padding:6px 16px}
#header #btn-compute:hover{color:var(--bg);border-color:var(--ac)}
/* display bar: taller, pill tabs */
#display-bar{height:32px;gap:3px}
#display-bar button{transition:all var(--t2)}
#display-bar button.active{background:var(--gl-ac);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ac) 22%,transparent),var(--glow-ac-sm)}
/* tab systems: breathing room */

#right-panel .tab-btn{padding:5px 11px;font-size:var(--fs-caption)}
#right-panel .sub-tab-btn{padding:5px 12px}
/* tables: row rhythm */
th{padding:5px 6px;font-size:var(--fs-caption)}
td{padding:4px 6px}
.pd-tbl{font-size:11px}
.pd-tbl th{font-size:var(--fs-caption);padding:4px 6px}
.pd-tbl td{padding:4px 6px}
.pd-filter-row>span{font-size:var(--fs-caption)}
.pd-filter-row select{font-size:11px;padding:2px 5px;border-radius:var(--r1)}

.pd-info,.pd-work{font-size:var(--fs-caption)}
/* sidebar: readable at a glance */
.sb-section-title{font-size:11px;padding:6px 0 4px}

.saved-item{font-size:11px;padding:6px 8px;border-radius:var(--r1)}
.drop-zone .dz-hint{font-size:var(--fs-caption);padding:8px 0}
.drop-zone .dz-chart-info{font-size:var(--fs-caption)}

.lib-folder-hdr,.lib-radix-hdr{font-size:11px}
.lib-radix-hdr{padding:5px 7px}
.lib-child-item{font-size:var(--fs-caption)}
.atlas-item{font-size:11px;padding:4px 5px}
.atlas-item .atlas-country{font-size:var(--fs-caption)}
.obj-grid{gap:3px 9px;font-size:11px}
.asp-checks{gap:2px 9px;font-size:11px}
.obj-grid label input,.asp-checks label input{width:14px;height:14px}
.orb-row{font-size:11px}
#info-content{font-size:13px}
/* ════════════════ Phase L: system accessibility adaptivity (Liquid Glass contract) ════════════════ */
@media (prefers-reduced-transparency: reduce){
  :root{--surf-header:var(--bg);--surf-bar:var(--bg);--surf-panel:var(--pn);
    --surf-elev:var(--sf);--surf-modal:var(--pn);--surf-clear:var(--bg);--dim:rgba(0,0,0,0.78)}
  *{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  html,body{background-image:none}
  #sidebar,#right-panel{background-image:none!important}
  #license-gate>div{background:#12101e}
}
@media (prefers-contrast: more){
  :root{--bd:color-mix(in srgb,var(--tx) 42%,transparent);
    --td:color-mix(in srgb,var(--tx) 78%,var(--bg));--lg-sheen:none}
  #header::before,#display-bar::before,#dynamic-bar::before,#icon-sidebar::after,#header::after{display:none}
  #sidebar,#right-panel{background-image:none!important}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.001s!important;transition-duration:0.001s!important}
  #chart-loading .spinner{animation-duration:0.7s!important}
  #rail-flyout.open::after{display:none}
  button:not(:disabled):hover{transform:none}
  .tab-bar button:not(.active):hover,.sub-tab-btn:not(.active):hover,.tab-btn:not(.active):hover{transform:none}
}
