/* ReportBar (report-bar.js) — the new workspace's ONE right-panel tab bar. Lab pill idiom (osiris-controls.css .o-tabs / .o-tab).
 * Every selector is prefixed `html:not(#o) ` and scoped to #right-panel.rb-on, which only the beta adds: classic is untouched. */
html:not(#o) #right-panel.rb-on #main-tabs.rb-host{display:block;flex:1;min-width:0;padding:6px 8px 4px;border-bottom:none}
html:not(#o) #right-panel.rb-on .rb{display:flex;flex-direction:column;gap:5px;min-width:0}
html:not(#o) #right-panel.rb-on .rb-families{gap:4px}
html:not(#o) #right-panel.rb-on .rb-families .o-tab{min-height:26px;padding:3px 10px}
html:not(#o) #right-panel.rb-on .rb-subs{gap:3px;padding-top:5px;border-top:1px solid var(--bd,#2a2348)}
html:not(#o) #right-panel.rb-on .rb-subs .o-tab{min-height:22px;padding:2px 9px;font-size:var(--fs-caption);font-weight:500}
html:not(#o) #right-panel.rb-on .rb-subs .o-tab:not(:disabled)[aria-selected=true]{font-weight:700}
html:not(#o) #right-panel.rb-on .rb-variants{display:flex;flex-direction:column;gap:4px}
html:not(#o) #right-panel.rb-on .rb-variants[hidden]{display:none}
html:not(#o) #right-panel.rb-on .rb-variant-row{gap:3px}
html:not(#o) #right-panel.rb-on .rb-variant-row .o-tab{min-height:20px;padding:1px 8px;font-size:var(--fs-caption);font-weight:500;border-style:dashed}
html:not(#o) #right-panel.rb-on .rb-variant-row .o-tab:not(:disabled)[aria-selected=true]{border-style:solid;font-weight:700}
html:not(#o) #right-panel.rb-on .rb-note{margin:0;font:400 var(--fs-caption)/1.4 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2)}
html:not(#o) #right-panel.rb-on .rb-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
html:not(#o) #right-panel.rb-on .rb-action-msg{font:400 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2)}
html:not(#o) #right-panel.rb-on .rb-crumb{font:600 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2)}
html:not(#o) #right-panel.rb-on .rb-view{padding:8px;display:flex;flex-direction:column;gap:8px;min-width:0}
/* Chart ▸ Speculum: the table scrolls in its own box (both ways) so the header row stays on top and the glyph / name
 * columns stay on the left (osiris-glass.css pins them) while the columns scroll. */
html:not(#o) #right-panel.rb-on .rb-speculum-scroll{overflow:auto;max-height:min(72vh,680px);scrollbar-width:thin}
html:not(#o) #right-panel.rb-on .rb-sphere-note{align-items:flex-start;font:400 11px/1.4 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2)}
html:not(#o) #right-panel.rb-on .rb-sphere-note p{margin:0}
/* Context line (Phase 5): what the open report reads — inner ↔ selected wheel, in layer names. */
html:not(#o) #right-panel.rb-on .rb-context{display:flex;flex-direction:column;gap:1px;padding:4px 8px;border:1px solid var(--bd,#2a2348);border-radius:8px;font:400 var(--fs-caption)/1.35 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2)}
html:not(#o) #right-panel.rb-on .rb-context[hidden]{display:none}
html:not(#o) #right-panel.rb-on .rb-context-head{display:flex;gap:6px;align-items:baseline;min-width:0}
html:not(#o) #right-panel.rb-on .rb-context-kicker{text-transform:uppercase;letter-spacing:.06em;font-size:var(--fs-caption)}
html:not(#o) #right-panel.rb-on .rb-context-pair{font-weight:700;color:var(--tx,#e6e1f5);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html:not(#o) #right-panel.rb-on .rb-context-warn{color:var(--warn,#e09850)}
/* The classic ▲▼ row cycling and ☰ dropdown are gone in the bar. */
html:not(#o) #right-panel.rb-on #tab-row-dropdown{display:none!important}
/* Inner navigation the bar now owns (PRIMARY postures + listing sub-tabs, Compare tabs, SOLAR REV, Houses' own tabs). */
html:not(#o) #right-panel.rb-on :is([data-rb-inner],[data-role=pd-listing-subtab-bar]){display:none!important}
html:not(#o) #right-panel.rb-on .houses-organization>nav[role=tablist]{display:none!important}
html:not(#o) #right-panel.rb-on:is([data-rb-tab=radix-ramc],[data-rb-tab=temporal],[data-rb-tab=local],[data-rb-tab=full])>#tab-content>div>.sub-tab-bar{display:none!important}
/* Sphere: the workspace dock folds into the bar. It shows only while a dock-backed tab is chosen, without its own header/tabs. */
html:not(#o) #right-panel.rb-on:not(.rb-dock-view)>#sphere-workspace-right-dock{display:none!important}
html:not(#o) #right-panel.rb-on.rb-dock-view>#tab-content{display:none!important}
html:not(#o) #right-panel.rb-on.rb-dock-view>#sphere-workspace-right-dock{display:flex!important;flex-direction:column;flex:1;min-height:0}
html:not(#o) #right-panel.rb-on #sphere-workspace-right-dock :is(.srd-header,.srd-tabs){display:none!important}
html:not(#o) #right-panel.rb-on #sphere-workspace-right-dock .sphere-right-dock{width:auto!important;flex:1;min-height:0}
/* Phones: the dock's own narrow-screen drawer (position:fixed, full height) would cover the header and the bar — inside
   the bar it stays in the panel's flow, under the tabs. */
html:not(#o) #right-panel.rb-on #sphere-workspace-right-dock .sphere-right-dock{position:static!important;max-width:none!important;box-shadow:none!important;z-index:auto!important}
/* View ▸ Return timeline: the row sits at the top of #sphere-transport, directly under the time row, full width. */
html:not(#o) #sphere-transport:has(>#sph-nav-srlr-row.rb-srlr-home:not([hidden])){flex-wrap:wrap}
html:not(#o) #sph-nav-srlr-row.rb-srlr-home{flex:1 0 100%;order:-1;box-sizing:border-box;padding:6px 10px;border-bottom:1px solid var(--bd,#2a2348)}
/* The return timeline, full size in Returns ▸ Soli-Lunar-Diurnal ▸ Timeline. */
html:not(#o) #right-panel.rb-on .rb-srlr #sph-nav-srlr-row:not([hidden]){max-height:none;margin-top:0}
@media (max-width:900px){
  /* nine families wrap (always all visible); sub-tab and variant rows scroll sideways, the chosen pill kept in view */
  html:not(#o) #right-panel.rb-on .rb-subs,html:not(#o) #right-panel.rb-on .rb-variant-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  html:not(#o) #right-panel.rb-on .rb-subs::-webkit-scrollbar,html:not(#o) #right-panel.rb-on .rb-variant-row::-webkit-scrollbar{display:none}
  html:not(#o) #right-panel.rb-on .rb-families .o-tab{min-height:28px;padding:3px 9px}
  html:not(#o) #right-panel.rb-on .rb .o-tab{flex:none}
}

/* Glyph-only listings (listing-glyphs.js, owner 2026-10-07): the glyphs that replace planet / aspect names read at
   the size of the words they replaced; the name stays in the title. */
#right-panel .lg-g { line-height: 1; letter-spacing: 0; font-weight: 400; }
#right-panel td.lg-cell .gl, #right-panel td.lg-cell.gl, #right-panel :not(td) > .lg-g, #right-panel .lg-src { font-size: 1.25em; line-height: 1; }

/* ── The bar owns the right panel's layout (right-panel overhaul 2026-10-08) ──
 * Only these direct children of #right-panel are shown: the resize edge, the angles strip, the bar, #tab-content and —
 * for dock-backed leaves — the sphere dock. Anything else parked there (the classic #sphere-panel that the old mode
 * switch shows in the sphere before the workspace dock adopts it, the classic Objects / Aspects strip, the in-panel
 * speculum) stays hidden instead of squeezing the report to the bottom of the panel. */
html:not(#o) #right-panel.rb-on > :not(.resize-handle, #angles-bar, .rb-bar-wrap, #tab-content, #sphere-workspace-right-dock){display:none!important}
/* Display ▸ on the sphere without a mounted workspace dock (no natal yet): the classic sphere panel, in place. */
html:not(#o) #right-panel.rb-on.rb-sphpanel-view > #sphere-panel{display:flex!important;flex:1;min-height:0}
html:not(#o) #right-panel.rb-on.rb-sphpanel-view > #tab-content{display:none!important}
html:not(#o) #right-panel.rb-on.rb-sphpanel-view:not([data-rb-display=style]) #sphere-panel > .sph-companion-controls{display:none!important}
html:not(#o) #right-panel.rb-on.rb-sphpanel-view[data-rb-display=style] #sphere-panel > .sph-companion-controls{display:flex!important}
html:not(#o) #right-panel.rb-on.rb-sphpanel-view[data-rb-display=style] #sphere-panel > #sphere-tab-content{display:none!important}
/* The bar's Display sub-tabs replace the classic sphere sub-tab row (Settings / Overlays / Houses). */
html:not(#o) #right-panel.rb-on #sphere-tab-bar{display:none!important}
/* Display ▸ on the sphere with the workspace dock: one part at a time, never folded away. */
html:not(#o) #right-panel.rb-on:is([data-rb-display=circles],[data-rb-display=sky]) #srd-panel-display > :not(.srd-group-legacy-sphere),
html:not(#o) #right-panel.rb-on[data-rb-display=settings] #srd-panel-display > :not(.srd-group-legacy-sphere, .srd-panel-content),
html:not(#o) #right-panel.rb-on[data-rb-display=style] #srd-panel-display > :not(.srd-panel-content){display:none!important}
/* Frame & View carries the camera (Interaction) after the classic settings; Bodies & Labels the rest of the dock groups. */
html:not(#o) #right-panel.rb-on[data-rb-display=settings] #srd-panel-display{display:flex;flex-direction:column}
html:not(#o) #right-panel.rb-on[data-rb-display=settings] #srd-panel-display > .srd-panel-content{order:2}
html:not(#o) #right-panel.rb-on[data-rb-display=settings] .srd-display-group:not([aria-labelledby=srd-group-interaction]){display:none!important}
html:not(#o) #right-panel.rb-on[data-rb-display=style] .srd-display-group[aria-labelledby=srd-group-interaction]{display:none!important}
/* Circles & Grids / Stars & Sky split the classic OVERLAYS tab; Frame & View reorders SETTINGS (most used first). */
html:not(#o) #right-panel.rb-on[data-rb-display] #sphere-tab-content{display:flex;flex-direction:column}
html:not(#o) #right-panel.rb-on[data-rb-display=circles] #sphere-tab-content > :is([data-group="overlays:stars-deep-sky"],[data-group="overlays:star-labels"]),
html:not(#o) #right-panel.rb-on[data-rb-display=sky] #sphere-tab-content > :not([data-group="overlays:stars-deep-sky"],[data-group="overlays:star-labels"]){display:none!important}
html:not(#o) #right-panel.rb-on[data-rb-display=circles] #sphere-tab-content > :not([data-group]){order:20}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:great-circles"]{order:1}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:coordinate-grids"]{order:2}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:small-circles-parallels"]{order:3}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:planetary-circles"]{order:4}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:dynamic-overlays"]{order:5}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:house-family-reference-overlays"]{order:6}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="overlays:degree-marks"]{order:7}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:reference-frame"]{order:1}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:view-presets"]{order:2}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:observer"]{order:3}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:zoom"]{order:4}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:nudge-view"]{order:5}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:observer-latitude"]{order:6}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:observer-longitude"]{order:7}
html:not(#o) #right-panel.rb-on #sphere-tab-content > [data-group="settings:display"]{order:8}
html:not(#o) #right-panel.rb-on:is([data-rb-display=circles],[data-rb-display=sky],[data-rb-display=settings]) #srd-panel-display .srd-group-legacy-sphere:not([hidden]){display:block!important}
html:not(#o) #right-panel.rb-on[data-rb-display] #srd-panel-display .srd-group-legacy-sphere > h3{display:none!important}
html:not(#o) #right-panel.rb-on[data-rb-display] #srd-panel-display .srd-group-legacy-sphere[data-folded] > :not(h3){display:block!important}
html:not(#o) #right-panel.rb-on #srd-panel-display .srd-display-group:has(> .srd-display-unavailable){display:none!important}
/* Display is the first family: set apart from the nine report families by a hairline. */
html:not(#o) #right-panel.rb-on .rb-families .rb-family[data-rb-family=display]{margin-right:7px;position:relative}
html:not(#o) #right-panel.rb-on .rb-families .rb-family[data-rb-family=display]::after{content:"";position:absolute;right:-6px;top:4px;bottom:4px;border-right:1px solid var(--bd,#2a2348)}
html:not(#o) #right-panel.rb-on .rb-display-view{gap:10px}
html:not(#o) #right-panel.rb-on .rb-display-group{display:flex;flex-direction:column;gap:5px;padding:8px 10px;border:1px solid var(--bd,#2a2348);border-radius:10px}
html:not(#o) #right-panel.rb-on .rb-display-setlabel{flex:0 0 100%;font:600 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);letter-spacing:.04em;color:var(--td,#aebbd2);margin-top:2px}
html:not(#o) #right-panel.rb-on .rb-display-title{margin:0;font:700 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);letter-spacing:.04em;color:var(--tx,#e6e1f5)}
html:not(#o) #right-panel.rb-on .rb-display-row{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
html:not(#o) #right-panel.rb-on .rb-display-field{display:flex;align-items:center;gap:6px;font:400 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2)}
html:not(#o) #right-panel.rb-on .rb-display-field input[type=range]{width:120px}
html:not(#o) #right-panel.rb-on .rb-display-field input[type=number]{width:64px}
html:not(#o) #right-panel.rb-on :is(.rb-display-readout,.rb-display-value){font:400 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);color:var(--td,#aebbd2);font-variant-numeric:tabular-nums}

/* Directions ▸ Age Harmonics (age-harmonic-events.js, report-bar view 'age-harmonics'): compact glyph listing, sticky header */
.ahl { display: flex; flex-direction: column; gap: 6px; padding: 6px 2px; min-height: 0; }
.ahl-controls { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.ahl-seg { display: inline-flex; flex-wrap: wrap; gap: 2px; }
.ahl-seg button { font: var(--fs-caption)/1.2 var(--ui-font, system-ui, sans-serif); padding: 2px 6px; border: 1px solid var(--bd, #1c2538); border-radius: 4px; background: transparent; color: var(--td, #8890a8); cursor: pointer; }
.ahl-seg button[aria-pressed="true"] { color: var(--tx, #d6d8ea); border-color: var(--ac, #c9aa6f); background: color-mix(in srgb, var(--ac, #c9aa6f) 12%, transparent); }
.ahl-seg button:focus-visible { outline: 2px solid var(--ac, #c9aa6f); outline-offset: 1px; }
.ahl-asp button, .ahl-opt button[data-ahl="lots"] { font-size: 13px; min-width: 24px; padding: 1px 4px; }
.ahl-range { display: inline-flex; align-items: center; gap: 3px; font-size: var(--fs-caption); color: var(--td, #8890a8); }
.ahl-num { width: 48px; font: var(--fs-caption) var(--num-font, system-ui, sans-serif); padding: 1px 3px; background: transparent; color: var(--tx, #d6d8ea); border: 1px solid var(--bd, #1c2538); border-radius: 4px; }
.ahl-status { font-size: var(--fs-caption); color: var(--td, #8890a8); }
.ahl-scroll { overflow: auto; max-height: 62vh; border: 1px solid var(--bd, #1c2538); border-radius: 6px; }
.ahl-table { width: 100%; border-collapse: collapse; font: 11px/1.3 var(--text-font, system-ui, sans-serif); font-variant-numeric: tabular-nums; }
#right-panel .ahl-table th { position: sticky; top: 0; z-index: 1; background: var(--bg, #0a0e18); color: var(--td, #8890a8); font-weight: 500; text-align: left; padding: 4px 5px; border-bottom: 1px solid var(--bd, #1c2538); }
#right-panel .ahl-table td { padding: 1px 5px; line-height: 16px; height: 18px; border-bottom: 1px solid color-mix(in srgb, var(--bd, #1c2538) 60%, transparent); vertical-align: baseline; white-space: nowrap; }
.ahl-table .ahl-h { text-align: right; }
.ahl-table td.ahl-m { color: var(--td, #8890a8); font-size: var(--fs-caption); }
.ahl-g { font-size: 16px; line-height: 1; }
.ahl-g.ahl-pt { font-size: var(--fs-caption); letter-spacing: .02em; }
.ahl-mark, .ahl-k { line-height: 1; }
.ahl-g.ahl-natal { border-bottom: 1px dotted var(--td, #8890a8); }
.ahl-mark { color: var(--ac, #c9aa6f); margin: 0 3px; }
.ahl-k { color: var(--td, #8890a8); font-size: var(--fs-caption); margin-left: 5px; }
.ahl-table td.ahl-cur { color: var(--tx, #d6d8ea); font-weight: 600; }
.ahl-table td.ahl-date { cursor: pointer; }
.ahl-row { cursor: pointer; }
.ahl-row:hover, .ahl-row:focus-visible { background: color-mix(in srgb, var(--ac, #c9aa6f) 10%, transparent); outline: none; }
.ahl-row.ahl-past { opacity: .72; }
.ahl-row.ahl-sel { background: color-mix(in srgb, var(--ac, #c9aa6f) 18%, transparent); opacity: 1; }
.ahl-now td { padding: 2px 5px; font-size: var(--fs-caption); color: var(--ac, #c9aa6f); border-top: 1px solid var(--ac, #c9aa6f); border-bottom: 0; }
.ahl-empty { color: var(--td, #8890a8); text-align: center; padding: 10px; }
/* Prayer-time convention picker (Astrolabe report, PRAYER TIMES; prayer-times.js, instruments P1). First visit: the ask band. */
.pt-picker{display:flex;flex-wrap:wrap;gap:4px;padding:4px 6px 6px}
.pt-picker .pt-sel{flex:1 1 140px;min-width:0;font:400 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);color:var(--tx,#e6edf7);background:var(--bg2,rgba(255,255,255,.04));border:1px solid var(--bd,#3a4660);border-radius:3px;padding:2px 4px}
.pt-picker .pt-sel[data-pt="convention"]{flex-basis:100%}
.pt-picker.pt-first .pt-sel[data-pt="convention"]{border-color:var(--ac,#7fb6ff);box-shadow:0 0 0 1px var(--ac,#7fb6ff)}
.pt-picker .pt-ask{flex:1 1 100%;font:400 var(--fs-caption)/1.4 var(--o-font,system-ui,sans-serif);color:var(--tx,#e6edf7);border:1px solid var(--ac,#7fb6ff);border-radius:3px;padding:4px 6px}
.pt-picker .pt-ok{display:block;margin-top:4px;font:600 var(--fs-caption)/1.3 var(--o-font,system-ui,sans-serif);color:var(--ac,#7fb6ff);background:none;border:1px solid var(--ac,#7fb6ff);border-radius:3px;padding:2px 8px;cursor:pointer}
/* Kept panes (speed round 2): a heavy pane (Directions ▸ List, Age Harmonics) stays mounted in #tab-content while another tab
   shows, so a revisit re-uses its style and layout instead of rebuilding a 600-3000 row table. Hidden = out of flow, not
   painted, not hit-tested, not in the accessibility tree; content-visibility:hidden keeps its rendering state for the
   revisit and skips its style / layout meanwhile. */
html #right-panel #tab-content>.tab-kept-hidden{content-visibility:hidden!important;position:absolute!important;top:0!important;left:0!important;visibility:hidden!important;pointer-events:none!important}