#view-orbital-brief { min-height: 100%; color: var(--text); overflow-x: hidden; }
.ob-shell { position: relative; width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: var(--sp-10) 0 var(--sp-24); }
.ob-shell::before { content: ''; position: absolute; z-index: -1; top: 12px; right: 4%; width: 360px; height: 360px; border: 1px solid rgba(var(--glow), .08); border-radius: 50%; box-shadow: 0 0 90px rgba(var(--glow), .045), inset 0 0 70px rgba(var(--glow), .025); pointer-events: none; }
.ob-masthead, .ob-topic-header { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-8); margin-bottom: 0; }
.ob-masthead > div:first-child, .ob-topic-header > div:first-child { max-width: 760px; }
.ob-masthead .section-heading__copy { max-width: 680px; }
.ob-orbit-mark { position: relative; flex: 0 0 84px; width: 84px; aspect-ratio: 1; border: 1px solid var(--hair2); border-radius: 50%; box-shadow: inset 0 0 28px rgba(var(--glow), .04), 0 0 32px rgba(var(--glow), .04); }
.ob-orbit-mark::before, .ob-orbit-mark::after, .ob-orbit-mark span { content: ''; position: absolute; border-radius: 50%; }
.ob-orbit-mark::before { inset: 17px; border: 1px solid var(--hair); }
.ob-orbit-mark::after { width: 7px; height: 7px; top: 8px; left: 23px; background: var(--accent); box-shadow: 0 0 12px rgba(var(--glow), .5); }
.ob-orbit-mark span { width: 3px; height: 3px; right: 13px; bottom: 20px; background: var(--muted); }

.ob-search-panel { margin: var(--sp-8) 0 var(--sp-10); padding: var(--sp-5); border-radius: var(--r-lg); box-shadow: 0 18px 54px rgba(0,0,0,.18); }
.ob-search-panel > label { display: block; margin-bottom: var(--sp-2); color: var(--muted); font: var(--font-telemetry); }
.ob-search-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--sp-3); min-height: 52px; padding: 0 var(--sp-4); border: 1px solid var(--hair2); border-radius: var(--r-md); background: rgba(255,255,255,.015); }
.ob-search-row:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(var(--glow), .08); }
.ob-search-row > span { color: var(--accent); font-size: var(--fs-xl); }
.ob-search-row input { width: 100%; padding: var(--sp-3) 0; border: 0; outline: 0; background: transparent; color: var(--text); font: var(--font-body); }
.ob-search-row input::placeholder { color: var(--faint); }
.ob-search-row kbd, .ob-keyboard-hint kbd { min-width: 26px; padding: 3px 7px; border: 1px solid var(--hair2); border-radius: var(--r-sm); color: var(--muted); background: var(--raised); font: var(--font-action); text-align: center; }
.ob-filters { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-4); }
.ob-filters .orion-action { border-radius: var(--r-full); }
.ob-filters .is-active { border-color: var(--accent); color: var(--bg); background: var(--accent); }

.ob-strip, .ob-library { margin-top: var(--sp-10); }
.ob-section-heading, .ob-lineage-heading { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-5); margin-bottom: var(--sp-4); }
.ob-section-heading h2, .ob-lineage-heading h2 { margin: 0; color: var(--text); font: var(--font-section-title); letter-spacing: var(--ls-title); }
.ob-section-heading > span, .ob-lineage-heading > span { color: var(--muted); font: var(--font-telemetry); }
.ob-tile-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.ob-tile-grid--compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ob-topic-tile { position: relative; display: flex; flex-direction: column; gap: var(--sp-3); min-height: 164px; padding: var(--sp-5); border: 1px solid var(--hair); border-radius: var(--r-lg); background: linear-gradient(150deg, rgba(255,255,255,.027), rgba(255,255,255,.008)), var(--panel); color: inherit; text-decoration: none; overflow: hidden; transition: transform var(--t-fast) var(--ease-out), border-color var(--t-fast), background var(--t-fast); }
.ob-topic-tile::after { content: ''; position: absolute; right: -36px; bottom: -54px; width: 126px; height: 126px; border: 1px solid rgba(var(--glow), .08); border-radius: 50%; pointer-events: none; }
.ob-topic-tile:hover, .ob-topic-tile:focus-visible { transform: translateY(-3px); border-color: var(--hair2); background: linear-gradient(150deg, rgba(var(--glow),.055), rgba(255,255,255,.012)), var(--panel); outline: 0; }
.ob-topic-code { color: var(--accent); font: var(--font-action); letter-spacing: var(--ls-action); text-transform: uppercase; }
.ob-topic-copy { display: flex; flex: 1; flex-direction: column; gap: var(--sp-2); }
.ob-topic-copy strong { color: var(--text); font-size: var(--fs-md); line-height: 1.2; letter-spacing: var(--ls-title); }
.ob-topic-copy small { color: var(--muted); font-size: var(--fs-sm); line-height: 1.5; }
.ob-topic-count { color: var(--faint); font: var(--font-telemetry); }
.ob-tile-grid--compact .ob-topic-tile { min-height: 138px; }
.ob-empty { padding: var(--sp-12); border-radius: var(--r-lg); text-align: center; color: var(--muted); }
.ob-empty strong { color: var(--text); }
.ob-empty p { margin: var(--sp-2) 0 var(--sp-5); }
.ob-keyboard-hint { margin: var(--sp-10) 0 0; color: var(--faint); font: var(--font-telemetry); text-align: center; }

.ob-status { position: fixed; z-index: var(--z-toast); right: 22px; bottom: 86px; max-width: min(360px, calc(100vw - 44px)); border-radius: var(--r-md); background: var(--raised); color: var(--text); font: var(--font-label); box-shadow: var(--shadow-lg); }
.ob-status:not(:empty) { padding: var(--sp-3) var(--sp-4); border: 1px solid var(--hair2); }
.ob-status[data-tone="error"] { border-color: rgba(255,120,120,.48); }
.ob-status[data-tone="success"] { border-color: var(--accent); }

.ob-topic-nav { position: sticky; z-index: 12; top: 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--sp-4); min-height: 58px; margin: calc(-1 * var(--sp-10)) 0 var(--sp-10); border-bottom: 1px solid var(--hair); background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(18px); }
.ob-topic-nav a { color: var(--accent); font: var(--font-action); letter-spacing: var(--ls-action); text-transform: uppercase; text-decoration: none; }
.ob-topic-nav > span { color: var(--muted); font: var(--font-telemetry); }
.ob-topic-nav button { justify-self: end; border-radius: var(--r-full); }
.ob-topic-nav button[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); }
.ob-topic-header { align-items: center; }
.ob-topic-gauge { min-width: 170px; border-radius: var(--r-lg); }
.ob-topic-gauge .orion-stat__value { display: block; }
.ob-topic-gauge .orion-stat__label { display: block; margin-top: var(--sp-1); }
.ob-topic-meta { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-5) 0 var(--sp-8); }
.ob-chip { border-radius: var(--r-full); }

.ob-lineage { margin-bottom: var(--sp-8); padding: var(--sp-6); border-radius: var(--r-lg); }
.ob-lineage-heading .section-heading__eyebrow, .ob-lineage--extension .section-heading__eyebrow { margin-bottom: var(--sp-2); }
.ob-lineage--extension { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); }
.ob-lineage--extension h2 { margin: 0; font: var(--font-section-title); }
.ob-lineage--extension > p { max-width: 520px; margin: 0; color: var(--muted); font: var(--font-body); }
.ob-lineage-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-3); }
.ob-lineage-concept { padding: var(--sp-4); border: 1px solid var(--hair); border-radius: var(--r-md); background: rgba(255,255,255,.012); }
.ob-lineage-concept h3 { margin: 0 0 var(--sp-3); color: var(--text); font-size: var(--fs-sm); line-height: 1.3; }
.ob-lineage-concept ul { margin: 0; padding-left: 17px; color: var(--muted); font-size: var(--fs-xs); line-height: 1.5; }
.ob-lineage-concept li + li { margin-top: var(--sp-1); }

.ob-topic-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(270px, .72fr); gap: var(--sp-6); align-items: start; }
.ob-card-stack { display: grid; gap: var(--sp-3); }
.ob-card { border: 1px solid var(--hair); border-radius: var(--r-lg); background: var(--panel); overflow: hidden; }
.ob-card[open] { border-color: var(--hair2); }
.ob-card summary { display: grid; grid-template-columns: 38px minmax(0, 1fr) 28px; align-items: center; gap: var(--sp-3); min-height: 78px; padding: 0 var(--sp-4); cursor: pointer; list-style: none; }
.ob-card summary::-webkit-details-marker { display: none; }
.ob-card summary:focus-visible { outline: 1px solid var(--accent); outline-offset: -3px; }
.ob-card-number { color: var(--faint); font: var(--font-telemetry); }
.ob-card-title { display: flex; flex-direction: column; gap: var(--sp-1); }
.ob-card-title strong { color: var(--text); font-size: var(--fs-base); }
.ob-card-title small { color: var(--muted); font-size: var(--fs-sm); line-height: 1.4; }
.ob-card-toggle { color: var(--accent); font-size: var(--fs-xl); text-align: right; transition: transform var(--t-fast); }
.ob-card[open] .ob-card-toggle { transform: rotate(45deg); }
.ob-card-body { padding: 0 var(--sp-6) var(--sp-5) 64px; border-top: 1px solid var(--hair); color: var(--muted); font-size: var(--fs-sm); line-height: 1.6; }
.ob-card-body ul { margin: var(--sp-4) 0; padding-left: 18px; }
.ob-card-body li + li { margin-top: var(--sp-2); }
.ob-qualified { display: grid; grid-template-columns: 84px 1fr; gap: var(--sp-3); margin: var(--sp-3) 0 0; padding: var(--sp-3); border-radius: var(--r-sm); background: rgba(var(--glow),.045); }
.ob-qualified > span { color: var(--accent); font: var(--font-action); text-transform: uppercase; }
.ob-qualified--warning { background: rgba(255,255,255,.025); }
.ob-card-footer { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-4); }
.ob-card-footer > a { margin-left: auto; color: var(--accent); font: var(--font-action); text-transform: uppercase; }

.ob-reference-panel, .ob-remember-panel { padding: var(--sp-5); border-radius: var(--r-lg); }
.ob-remember-panel { margin-top: var(--sp-4); }
.ob-reference { display: flex; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-3) 0; border-top: 1px solid var(--hair); color: var(--muted); font-size: var(--fs-sm); text-decoration: none; }
.ob-reference:hover, .ob-reference:focus-visible { color: var(--accent); outline: 0; }
.ob-remember { border-top: 1px solid var(--hair); }
.ob-remember summary { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; min-height: 48px; color: var(--text); font-size: var(--fs-sm); cursor: pointer; list-style: none; }
.ob-remember summary::-webkit-details-marker { display: none; }
.ob-remember summary span { color: var(--muted); font: var(--font-telemetry); }
.ob-remember summary b { color: var(--accent); font-size: var(--fs-lg); }
.ob-remember[open] summary b { transform: rotate(45deg); }
.ob-remember ul { margin: 0 0 var(--sp-4) 34px; padding-left: 16px; color: var(--muted); font-size: var(--fs-xs); line-height: 1.55; }

.ob-problems { margin-top: var(--sp-10); }
.ob-problem-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.ob-problem { padding: var(--sp-4); border: 1px solid var(--hair); border-radius: var(--r-md); background: var(--panel); }
.ob-problem header { display: flex; gap: var(--sp-3); min-height: 38px; }
.ob-problem header span { color: var(--faint); font: var(--font-telemetry); }
.ob-problem header a { color: var(--text); font-size: var(--fs-sm); font-weight: 700; text-decoration: none; }
.ob-problem header a:hover { color: var(--accent); }
.ob-problem dl { margin: var(--sp-3) 0 0; }
.ob-problem dl div { display: grid; grid-template-columns: 48px 1fr; gap: var(--sp-2); padding: var(--sp-2) 0; border-top: 1px solid var(--hair); }
.ob-problem dt { color: var(--accent); font: var(--font-action); text-transform: uppercase; }
.ob-problem dd { margin: 0; color: var(--muted); font-size: var(--fs-xs); line-height: 1.45; }
.ob-problem > p { margin: var(--sp-3) 0 0; color: var(--faint); font: var(--font-telemetry); }

@media (max-width: 980px) {
    .ob-tile-grid, .ob-problem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ob-tile-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ob-lineage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ob-topic-layout { grid-template-columns: 1fr; }
    .ob-topic-layout aside { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
    .ob-remember-panel { margin-top: 0; }
}

@media (max-width: 640px) {
    .ob-shell { width: min(100% - 24px, 1180px); padding-top: var(--sp-6); }
    .ob-shell::before { width: 240px; height: 240px; right: -90px; }
    .ob-masthead { align-items: center; }
    .ob-orbit-mark { flex-basis: 58px; width: 58px; }
    .ob-search-panel { margin-top: var(--sp-6); padding: var(--sp-4); }
    .ob-search-row { padding: 0 var(--sp-3); }
    .ob-tile-grid, .ob-tile-grid--compact, .ob-problem-grid, .ob-lineage-grid { grid-template-columns: 1fr; }
    .ob-topic-tile { min-height: 144px; }
    .ob-topic-nav { grid-template-columns: 1fr auto; margin-top: calc(-1 * var(--sp-6)); }
    .ob-topic-nav > span { display: none; }
    .ob-topic-header { align-items: flex-start; }
    .ob-topic-gauge { min-width: 112px; }
    .ob-lineage--extension { align-items: flex-start; flex-direction: column; gap: var(--sp-3); }
    .ob-topic-layout aside { grid-template-columns: 1fr; }
    .ob-card summary { grid-template-columns: 27px 1fr 20px; padding: 0 var(--sp-3); }
    .ob-card-body { padding: 0 var(--sp-4) var(--sp-4) 48px; }
    .ob-qualified { grid-template-columns: 1fr; gap: var(--sp-1); }
    .ob-keyboard-hint { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ob-topic-tile, .ob-card-toggle { transition: none; }
}
