/* Osiris legacy skin — maps the legacy control families onto the ONE design system (owner, 2026-10-02:
 * "Direction Lab pills everywhere": rounded dark pills, thin light border, sans-serif, black filled active state).
 *
 * Loaded LAST (after the main <style> block) so it is the final word for the families it names. Every selector is
 * `html:not(#o) :where(<legacy selectors>):not(#o):not(#o)`: the same elements at ONE fixed specificity (3 ids), above
 * every legacy rule that styles them (the deepest is `#sidebar #console-actions #btn-save`), and — because :where()
 * contributes nothing — every state rule (:hover, the active state) reliably outranks its base rule. No !important is
 * needed except where a family carries inline style="" presentation (marked INLINE below).
 * Colours/shape/type come only from osiris-tokens.css (theme-derived), so every theme and day/night twin recolours.
 *
 * One active state for all four legacy conventions:
 *   .active · .is-active · .on / .rp-on / .selected · [aria-pressed|aria-selected|aria-checked=true]
 * → black fill, white ink, thin white inner ring (the .o-pill active look).
 *
 * New controls should use .o-pill / .o-seg / .o-tab / .o-menu (osiris-controls.css), not these legacy classes.
 * Regions another lane owns (#header wiring, #sphere-transport, #display-bar internals) are NOT targeted here
 * beyond their pre-existing legacy class families (.coord-btns); see the main-block blanket rules for the rest.
 */

/* ════ 1. Pills — standalone legacy buttons ════════════════════════════════════════════════════════════════ */
html:not(#o) :where(.chip,.cast-go,.pd-tog,.asp-presets button,.wd-chip,.wd-io button,.globe-view-btn,.zod-frame,.scale-row .scale-rst,
  #settings-tools button,.lsr-btn,.swt-btn,.dmo-pill,.srd-collapse,.srd-display-reset,.gl-pin,.hp-chip,.drop-zone .dz-actions button,
  .lib-edit-btns button,#save-dialog .sd-btns button,#map-search-btn,#map-use-btn,#map-cancel-btn,.pred-controls button,.chron-lap-btn,
  #research-panel .rp-close button,#tables-panel .tbl-close button,.rectification-capabilities-refresh,.houses-org-cusps button,
  .houses-org-scroll button,.houses-org-systems-row button,#sidebar #console-actions button,#sb-library-body #btn-save,
  #sb-atlas-body #atlas-add-btns button,#atlas-add-btns button,.coord-btns button,#rail-flyout[data-key="chartdata"] #btn-compute,
  #sb-chartdata-body #btn-compute):not(#o):not(#o){
  appearance:none;-webkit-appearance:none;box-sizing:border-box;min-height:var(--o-h-sm);padding:3px 10px;margin:0;
  border:1px solid var(--o-line);border-radius:var(--o-radius);background:var(--o-surface);background-image:none;
  color:var(--o-ink);font:var(--o-fw) var(--o-fs-sm)/1.2 var(--o-font);letter-spacing:var(--o-tracking);text-shadow:none;
  box-shadow:none;cursor:pointer;touch-action:manipulation;
  transition:border-color var(--o-dur) var(--o-ease),background-color var(--o-dur) var(--o-ease),color var(--o-dur) var(--o-ease)}
html:not(#o) :where(.chip,.cast-go,.pd-tog,.asp-presets button,.wd-chip,.wd-io button,.globe-view-btn,.zod-frame,.scale-row .scale-rst,
  #settings-tools button,.lsr-btn,.swt-btn,.dmo-pill,.srd-collapse,.srd-display-reset,.gl-pin,.hp-chip,.drop-zone .dz-actions button,
  .lib-edit-btns button,#save-dialog .sd-btns button,#map-search-btn,#map-use-btn,#map-cancel-btn,.pred-controls button,.chron-lap-btn,
  #research-panel .rp-close button,#tables-panel .tbl-close button,.rectification-capabilities-refresh,.houses-org-cusps button,
  .houses-org-scroll button,.houses-org-systems-row button,#sidebar #console-actions button,#sb-library-body #btn-save,
  #sb-atlas-body #atlas-add-btns button,#atlas-add-btns button,.coord-btns button,#rail-flyout[data-key="chartdata"] #btn-compute,
  #sb-chartdata-body #btn-compute):not(#o):not(#o):hover:not(:disabled){
  border-color:var(--o-line-hover);color:var(--o-ink-strong);background:var(--o-surface);box-shadow:none;filter:none;opacity:1}
/* The coord-btns in the display bar keep the bar's compact rhythm. */
html:not(#o) #display-bar .coord-btns button:not(#o):not(#o){min-height:22px;padding:2px 8px;font-size:var(--o-fs-xs)}

/* Primary actions (CAST, SAVE, Use, Add, Compute): the same pill, emphasised by an accent border — never a
   filled colour block (black fill is reserved for "selected"). */
html:not(#o) :where(.cast-go,#sb-library-body #btn-save,#sidebar #console-actions #btn-save,#map-use-btn,#save-dialog .sd-btn-save,
  #sb-atlas-body #atlas-add-btns button.primary,.pred-controls button,.chron-lap-btn,#rail-flyout[data-key="chartdata"] #btn-compute,
  #sb-chartdata-body #btn-compute):not(#o):not(#o){
  border-color:var(--o-accent);color:var(--o-ink-strong);font-weight:var(--o-fw-active)}
html:not(#o) #btn-compute.cast-go:not(#o):not(#o){width:100%;min-height:var(--o-h);letter-spacing:.12em}
/* Inputs changed since the last cast: the one place an accent fill remains (a call to action, not a selection). */
html:not(#o) #btn-compute.cast-go.cast-dirty:not(#o):not(#o){background:var(--o-accent);border-color:var(--o-accent);color:var(--o-canvas);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--o-accent) 30%,transparent)}
html:not(#o) #btn-compute.cast-go.cast-dirty:not(#o):not(#o)::after{background:var(--o-canvas)}
html:not(#o) #sidebar #console-actions button:not(#o):not(#o){min-height:var(--o-h);letter-spacing:.08em}

/* ════ 2. Tabs — legacy tab rows become rows of pills ═══════════════════════════════════════════════════════ */
html:not(#o) :where(.tab-btn,.sub-tab-btn,.spec-subtab,.settings-tab,.srd-tab,.houses-org-tab,.sphere-list-tabs button,.pd-subtab,.info-tab-btn):not(#o):not(#o){
  appearance:none;-webkit-appearance:none;box-sizing:border-box;min-height:var(--o-h-sm);padding:3px 10px;
  border:1px solid var(--o-line);border-radius:var(--o-radius);background:var(--o-surface);background-image:none;
  color:var(--o-ink);font:var(--o-fw) var(--o-fs-sm)/1.2 var(--o-font);letter-spacing:var(--o-tracking);text-shadow:none;
  box-shadow:none;white-space:nowrap;cursor:pointer;
  transition:border-color var(--o-dur) var(--o-ease),background-color var(--o-dur) var(--o-ease),color var(--o-dur) var(--o-ease)}
html:not(#o) :where(.tab-btn,.sub-tab-btn,.spec-subtab,.settings-tab,.srd-tab,.houses-org-tab,.sphere-list-tabs button,.pd-subtab,.info-tab-btn):not(#o):not(#o):hover:not(:disabled){
  border-color:var(--o-line-hover);color:var(--o-ink-strong);background:var(--o-surface);box-shadow:none;transform:none}
/* Tab rows: a little air between the pills, no underline rule. */
html:not(#o) :where(.tab-bar,.sub-tab-bar,#settings-tabbar,.srd-tabs,.pd-subtab-bar):not(#o):not(#o){gap:4px}
html:not(#o) :where(.tab-bar,.sub-tab-bar):not(#o):not(#o){padding:4px 6px;background:transparent;border-bottom:1px solid var(--o-line)}
html:not(#o) #settings-tabbar{padding-bottom:8px}
html:not(#o) .settings-tab:not(#o):not(#o){min-height:var(--o-h);padding:4px 12px;font-size:var(--o-fs)}
html:not(#o) .info-sidebar{padding:8px}
html:not(#o) .info-tab-btn:not(#o):not(#o){display:block;width:100%;margin:0 0 4px;text-align:left;white-space:normal;line-height:1.3;padding:6px 10px}

/* ════ 3. Segmented groups (.seg) — the .o-seg look ═════════════════════════════════════════════════════════ */
html:not(#o) .seg{display:inline-flex;align-items:stretch;gap:2px;padding:2px;overflow:visible;
  border:1px solid var(--o-line);border-radius:calc(var(--o-radius) + 2px);background:var(--o-surface)}
html:not(#o) :where(.seg,#sidebar .seg):not(#o):not(#o) button{appearance:none;min-height:calc(var(--o-h-sm) - 4px);padding:2px 10px;
  border:1px solid transparent;border-radius:calc(var(--o-radius) - 2px);background:transparent;background-image:none;
  color:var(--o-ink-muted);font:var(--o-fw) var(--o-fs-sm)/1.2 var(--o-font);letter-spacing:var(--o-tracking);box-shadow:none}
html:not(#o) :where(.seg,#sidebar .seg):not(#o):not(#o) button:hover:not(:disabled){background:var(--o-wash);color:var(--o-ink-strong);box-shadow:none}
html:not(#o) .console-tabs{width:100%}
html:not(#o) .console-tabs button{flex:1}

/* ════ 4. Ghost icon buttons (row actions, close ×) ═════════════════════════════════════════════════════════ */
html:not(#o) :where(#sidebar .ident-act,#sidebar .lib-menu-btn,.ident-act,.lib-menu-btn,.rail-fly-close,.settings-float .sf-titlebar button,
  #info-box .info-close,#zoom-reset):not(#o):not(#o){
  min-height:0;border:1px solid transparent;border-radius:var(--o-radius);background:transparent;background-image:none;
  color:var(--o-ink-muted);box-shadow:none;text-shadow:none}
html:not(#o) :where(#sidebar .ident-act,#sidebar .lib-menu-btn,.ident-act,.lib-menu-btn,.rail-fly-close,.settings-float .sf-titlebar button,
  #info-box .info-close,#zoom-reset):not(#o):not(#o):hover:not(:disabled){
  border-color:var(--o-line);background:var(--o-wash);color:var(--o-ink-strong);box-shadow:none}
html:not(#o) .rail-fly-close:not(#o):not(#o){padding:0 7px;line-height:1.1}

/* ════ 5. Menus — legacy popover lists take the .o-menu-item row look ═══════════════════════════════════════ */
html:not(#o) :where(.menu,#data-menu,#export-menu):not(#o):not(#o){border-color:var(--o-line);border-radius:var(--o-radius-lg);background:var(--o-surface);
  box-shadow:var(--o-shadow-pop)}
html:not(#o) :where(.menu button,#data-menu button,#export-menu .export-opt):not(#o):not(#o){min-height:30px;margin:0 0 4px;padding:5px 11px;
  border:1px solid var(--o-line);border-radius:var(--o-radius);background:var(--o-surface);background-image:none;
  color:var(--o-ink);font:var(--o-fw) var(--o-fs)/1.25 var(--o-font);text-align:left;box-shadow:none}
html:not(#o) :where(.menu button,#data-menu button,#export-menu .export-opt):not(#o):not(#o):last-child{margin-bottom:0}
html:not(#o) :where(.menu button,#data-menu button,#export-menu .export-opt):not(#o):not(#o):is(:hover,:focus-visible):not(:disabled){
  border-color:var(--o-line-hover);color:var(--o-ink-strong);background:var(--o-surface);box-shadow:none}
html:not(#o) .menu button.danger:not(#o):not(#o):hover{color:var(--o-danger);border-color:var(--o-danger)}
/* INLINE: the export options are built with style="background:none;border:none;…" */
html:not(#o) #export-menu .export-opt{border:1px solid var(--o-line)!important;background:var(--o-surface)!important;border-radius:var(--o-radius)!important}

/* ════ 6. Glyph rail — icon pills ══════════════════════════════════════════════════════════════════════════ */
html:not(#o) .icon-sb-item{border:1px solid transparent;border-radius:var(--o-radius-lg);background:transparent;color:var(--o-ink-muted);
  box-shadow:none;transform:none}
html:not(#o) .icon-sb-item:hover{border-color:var(--o-line);background:var(--o-surface);color:var(--o-ink-strong);box-shadow:none;transform:none}
html:not(#o) .icon-sb-item:hover svg{filter:none}
html:not(#o) .icon-sb-item:is(.active,[aria-pressed=true],[aria-current=page]){border-color:var(--o-active-bg);background:var(--o-active-bg);
  color:var(--o-active-ink);box-shadow:var(--o-active-ring),var(--o-active-lift)}
html:not(#o) .icon-sb-item.active::before{background:var(--o-ink);box-shadow:none}
html:not(#o) .icon-sb-item.active::after{display:none}
html:not(#o) .icon-sb-label{font-family:var(--o-font);font-weight:var(--o-fw);text-transform:none;letter-spacing:var(--o-tracking);
  background:var(--o-surface);border-color:var(--o-line);border-radius:var(--o-radius);box-shadow:var(--o-shadow-pop)}
html:not(#o) .icon-sb-label::before{background:var(--o-surface);border-color:var(--o-line)}
html:not(#o) body.rail-labeled .icon-sb-label{background:none;box-shadow:none}

/* ════ 7. The one active state ═════════════════════════════════════════════════════════════════════════════ */
html:not(#o) :where(.chip,.pd-tog,.asp-presets button,.wd-chip,.globe-view-btn,.zod-frame,.lsr-btn,.swt-btn,.dmo-pill,.hp-chip,
  .houses-org-cusps button,.houses-org-systems-row button,.coord-btns button,
  .tab-btn,.sub-tab-btn,.spec-subtab,.settings-tab,.srd-tab,.houses-org-tab,.sphere-list-tabs button,.pd-subtab,.info-tab-btn,
  .seg button,#sidebar .seg button,.lib-menu-btn,.menu button,#data-menu button,#export-menu .export-opt):not(#o):not(#o):not(:disabled):is(
  .active,.is-active,.on,.selected,[aria-pressed=true],[aria-selected=true],[aria-checked=true]){
  border-color:var(--o-active-bg);background:var(--o-active-bg);color:var(--o-active-ink);-webkit-text-fill-color:var(--o-active-ink);
  font-weight:var(--o-fw-active);text-shadow:none;box-shadow:var(--o-active-ring),var(--o-active-lift)}
html:not(#o) :where(.chip,.pd-tog,.asp-presets button,.wd-chip,.globe-view-btn,.zod-frame,.lsr-btn,.swt-btn,.dmo-pill,.hp-chip,
  .houses-org-cusps button,.houses-org-systems-row button,.coord-btns button,
  .tab-btn,.sub-tab-btn,.spec-subtab,.settings-tab,.srd-tab,.houses-org-tab,.sphere-list-tabs button,.pd-subtab,.info-tab-btn,
  .seg button,#sidebar .seg button,.lib-menu-btn,.menu button,#data-menu button,#export-menu .export-opt):not(#o):not(#o):not(:disabled):is(
  .active,.is-active,.on,.selected,[aria-pressed=true],[aria-selected=true],[aria-checked=true]):hover{
  border-color:var(--o-active-bg);background:var(--o-active-bg);color:var(--o-active-ink)}
/* INLINE: the export menu rows and the Settings-window presets carry inline/!important fills */
html:not(#o) #export-menu .export-opt:hover{border-color:var(--o-line-hover)!important;color:var(--o-ink-strong)!important}
html:not(#o) #export-menu .export-opt:is(.active,[aria-checked=true]){background:var(--o-active-bg)!important;color:var(--o-active-ink)!important}

/* ════ 8. Shared states ════════════════════════════════════════════════════════════════════════════════════ */
html:not(#o) :where(.chip,.cast-go,.pd-tog,.wd-chip,.lsr-btn,.swt-btn,.dmo-pill,.srd-tab,.tab-btn,.sub-tab-btn,.settings-tab,.seg button,
  #sidebar #console-actions button,.coord-btns button,.houses-org-tab):not(#o):not(#o):focus-visible{outline:2px solid var(--o-focus);outline-offset:2px;box-shadow:none}
html:not(#o) :where(.chip,.cast-go,.pd-tog,.wd-chip,.lsr-btn,.swt-btn,.dmo-pill,.srd-tab,.tab-btn,.sub-tab-btn,.settings-tab,.seg button,
  #sidebar #console-actions button,.coord-btns button,.houses-org-tab):not(#o):not(#o):disabled{opacity:.45;cursor:default}

/* ════ 9. Hover = border highlight only (owner, round 3, 2026-10-06): no 1px lift, no glow, no glyph zoom ════════════ */
html:not(#o) :where(.chip,.cast-go,.pd-tog,.asp-presets button,.wd-chip,.wd-io button,.globe-view-btn,.zod-frame,.scale-row .scale-rst,
  #settings-tools button,.lsr-btn,.swt-btn,.dmo-pill,.srd-collapse,.srd-display-reset,.gl-pin,.hp-chip,.drop-zone .dz-actions button,
  .lib-edit-btns button,#save-dialog .sd-btns button,#map-search-btn,#map-use-btn,#map-cancel-btn,.pred-controls button,.chron-lap-btn,
  #research-panel .rp-close button,#tables-panel .tbl-close button,.rectification-capabilities-refresh,.houses-org-cusps button,
  .houses-org-scroll button,.houses-org-systems-row button,#sidebar #console-actions button,#sb-library-body #btn-save,
  #sb-atlas-body #atlas-add-btns button,#atlas-add-btns button,.coord-btns button,#rail-flyout[data-key="chartdata"] #btn-compute,
  #sb-chartdata-body #btn-compute,
  .tab-btn,.sub-tab-btn,.spec-subtab,.settings-tab,.srd-tab,.houses-org-tab,.sphere-list-tabs button,.pd-subtab,.info-tab-btn,
  .seg button,#sidebar .seg button,#sidebar .ident-act,#sidebar .lib-menu-btn,.ident-act,.lib-menu-btn,.rail-fly-close,
  .settings-float .sf-titlebar button,#info-box .info-close,#zoom-reset,.menu button,#data-menu button,#export-menu .export-opt,
  .icon-sb-item):not(#o):not(#o):hover{transform:none;filter:none;text-shadow:none}
html:not(#o) :where(#rail-flyout[data-key="chartdata"] #btn-compute,#sb-chartdata-body #btn-compute):not(#o):not(#o):hover{box-shadow:none}
html:not(#o) .icon-sb-item:hover .gly:not(#o):not(#o){transform:none}

@media (max-width:700px){
  html:not(#o) :where(.chip,.tab-btn,.sub-tab-btn,.srd-tab,.settings-tab,.coord-btns button,#sidebar #console-actions button):not(#o):not(#o){min-height:30px}
}
@media (prefers-reduced-motion:reduce){
  html:not(#o) :where(.chip,.tab-btn,.sub-tab-btn,.srd-tab,.settings-tab,.seg button,.icon-sb-item):not(#o):not(#o){transition:none}
}

/* Permanent workspace surfaces sit beside the chart rather than over it. Their theme-tinted
 * backgrounds, gradients, borders and highlights already provide the shared glass treatment.
 * Re-blurring the page separately for each surface (and again for its nested chrome) causes
 * every moving canvas frame to re-rasterize several large backdrops, even when no panel moved.
 * Floating windows/menus keep their backdrop blur because they actually overlap the sky. */
html:not(#o) :is(#header, #display-bar, #dynamic-bar, #sidebar, #right-panel, #icon-sidebar,
  #console-head, #ident-card, #console-actions, #main-tabs, #zoom-bar),
html:not(#o) :is(#sidebar, #right-panel) :is(.tab-bar, .sub-tab-bar) {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}