/* OI ledger: compact rows, neutral chrome and uninterrupted terminal scrolling. */
#radar-oi-shift-body { display:flex; flex-direction:column; min-height:360px; background:#0d0d0d; color:#d7d7d7; font:11px 'JetBrains Mono',monospace; letter-spacing:0; text-shadow:none; }
#radar-oi-shift-body .radar-oi-toolbar { display:flex; flex-direction:row; align-items:center; flex:0 0 auto; gap:6px 10px; flex-wrap:wrap; padding:6px 8px; border-bottom:1px solid #303030; background:#181818; }
#radar-oi-shift-body .radar-oi-session { flex-direction:row; align-items:baseline; gap:8px; flex-wrap:wrap; text-transform:none; }
#radar-oi-shift-body .radar-oi-session strong { font:600 12px 'JetBrains Mono',monospace; letter-spacing:0; color:#e1e1e1; }
#radar-oi-shift-body .radar-oi-session-date { font-size:10px; letter-spacing:0; color:#929292; }
#radar-oi-shift-body .radar-oi-search { flex:1 1 160px; width:160px; min-width:110px; max-width:260px; height:26px; min-height:0; max-height:26px; box-sizing:border-box; padding:4px 7px; border:1px solid #3a3a3a; border-radius:2px; background:#101010; color:#ddd; font:11px 'JetBrains Mono',monospace; box-shadow:none; }
#radar-oi-shift-body .radar-oi-filter-set { gap:0; margin-left:auto; }
#radar-oi-shift-body .radar-oi-filter { background:transparent; border:0; border-bottom:1px solid transparent; color:#999; font-size:10px; letter-spacing:0; padding:4px 7px; text-transform:none; }
#radar-oi-shift-body .radar-oi-filter.active { background:#242424; color:#ddd; border-bottom-color:#b38f55; }
#radar-oi-shift-body .radar-oi-filter:hover { background:#232323; color:#eee; }
#radar-oi-shift-body .radar-oi-open-terminal { border:0; padding:3px 0; background:transparent; color:#c39d61; font:10px 'JetBrains Mono',monospace; cursor:pointer; }
#radar-oi-shift-body .radar-oi-readout { flex:0 0 auto; flex-direction:row; align-items:center; flex-wrap:wrap; justify-content:flex-start; gap:3px 12px; padding:5px 8px; border-bottom:1px solid #292929; color:#888; font-size:9px; letter-spacing:0; line-height:1.5; background:#101010; }
#radar-oi-shift-body .radar-oi-state { margin-left:auto; color:#bb985b; }
#radar-oi-shift-body .radar-oi-state.ready { color:#66b494; }
#radar-oi-shift-body .radar-oi-readout .pointer { display:none; }
#radar-oi-shift-body .radar-oi-table-wrap { flex:1 1 auto; min-height:0; max-height:610px; overflow:auto; scrollbar-color:#444 #111; }
#radar-oi-shift-body .radar-oi-table { min-width:1140px; table-layout:auto; font:11px 'JetBrains Mono',monospace; font-variant-numeric:tabular-nums; }
#radar-oi-shift-body .radar-oi-table th { padding:5px 8px; background:#202020; border-bottom:1px solid #3a3a3a; color:#aaa; font-size:10px; font-weight:500; letter-spacing:0; text-transform:none; }
#radar-oi-shift-body .radar-oi-table td { height:25px; padding:3px 8px; border-bottom:1px solid #202020; color:#c9c9c9; font-size:11px; line-height:1.4; }
#radar-oi-shift-body .radar-oi-table td:nth-child(3), #radar-oi-shift-body .radar-oi-table th:nth-child(3), #radar-oi-shift-body .radar-oi-table td:nth-child(5), #radar-oi-shift-body .radar-oi-table th:nth-child(5) { text-align:right; }
#radar-oi-shift-body .radar-oi-table tbody tr { background:#0d0d0d; transition:background 100ms; box-shadow:none; }
#radar-oi-shift-body .radar-oi-table tbody tr:nth-child(even) { background:#141414; }
#radar-oi-shift-body .radar-oi-table tbody tr:hover, #radar-oi-shift-body .radar-oi-table tbody tr:focus-visible { background:#272727; box-shadow:none; }
#radar-oi-shift-body .radar-oi-symbol { font-size:11px; font-weight:600; letter-spacing:0; }
#radar-oi-shift-body .radar-oi-type { padding:0; border:0; background:transparent; font-size:10px; border-radius:0; }
#radar-oi-shift-body td.radar-oi-change.build { color:#66b494; }
#radar-oi-shift-body td.radar-oi-change.unwind { color:#d36a78; }
#radar-oi-shift-body .radar-oi-change-toggle:hover { color:#c39d61; }
#radar-oi-shift-body .radar-oi-spot-context { gap:5px; }
#radar-oi-shift-body .radar-oi-spot-context [class^=tag-] { padding:0; background:transparent; border:0; border-radius:0; font-size:10px; }
#radar-oi-shift-body .radar-oi-distance { color:#888; font-size:10px; }
#radar-oi-shift-body .radar-oi-footer { display:flex; justify-content:space-between; gap:10px; padding:5px 8px; border-top:1px solid #303030; background:#181818; color:#8d8d8d; font-size:10px; }
#radar-oi-shift-body .radar-oi-empty { flex:1; min-height:100px; padding:28px 12px; font:11px 'JetBrains Mono',monospace; color:#999; letter-spacing:0; }
#radar-oi-shift-body :focus-visible { outline:1px solid #b38f55; outline-offset:1px; }
html.terminal-embed[data-terminal-panel=oi] body { margin:0!important; padding:0!important; overflow:hidden; }
html.terminal-embed[data-terminal-panel=oi] :is(.radar-title-row,.radar-control-panel,#radar-detail-panel,.radar-tv-chart-shell,.radar-panel-head) { display:none!important; }
html.terminal-embed[data-terminal-panel=oi] :is(.radar-shell,.radar-split,.radar-queue-panel) { display:flex!important; flex-direction:column; padding:0!important; margin:0!important; border:0!important; border-radius:0!important; background:#0d0d0d; min-height:0!important; height:100%; width:100%; max-width:none!important; box-shadow:none; }
html.terminal-embed[data-terminal-panel=oi] #view-radar { height:100dvh; margin:0!important; padding:0!important; }
html.terminal-embed[data-terminal-panel=oi] #radar-oi-shift-body { flex:1; height:100%; min-height:0; overflow:hidden; }
html.terminal-embed[data-terminal-panel=oi] .radar-oi-table-wrap { max-height:none!important; }
html.terminal-embed[data-terminal-panel=oi] .radar-oi-open-terminal { display:none; }
@media(max-width:600px) { #radar-oi-shift-body .radar-oi-session { flex:1 1 100%; } #radar-oi-shift-body .radar-oi-state { margin-left:0; } }
/* Options chain: the familiar CALLS | STRIKE | PUTS card, in the compact terminal style (VISION / Ratio). */
#radar-oi-shift-body[data-oi-check] { padding:0; gap:0; background:#000; color:#d5d5d5; border:1px solid #2c2c2c; font:10px 'JetBrains Mono',monospace; }
#radar-oi-shift-body[data-oi-check] button { font:inherit; border:0; background:none; color:#b6b6b6; cursor:pointer; padding:2px 4px; }
#radar-oi-shift-body[data-oi-check] button:hover:not(:disabled) { color:#ffb24d; }
#radar-oi-shift-body[data-oi-check] button:disabled { color:#3c3c3c; cursor:default; }
#radar-oi-shift-body[data-oi-check] :is(button,input):focus-visible { outline:1px solid #c79143; outline-offset:-1px; }
#radar-oi-shift-body .oc-title { flex:0 0 28px; display:flex; align-items:center; gap:8px; padding:0 9px; background:#151515; border-bottom:1px solid #3c3c3c; white-space:nowrap; }
#radar-oi-shift-body .oc-title img { width:16px; height:16px; object-fit:contain; }
#radar-oi-shift-body .oc-title strong { color:#e0ac55; letter-spacing:.14em; font-size:11px; font-weight:600; }
#radar-oi-shift-body .oc-symbol { color:#eee; font-weight:600; }
#radar-oi-shift-body .oc-spot { color:#9fc8e8; font-variant-numeric:tabular-nums; }
#radar-oi-shift-body .oc-title form { margin-left:auto; display:flex; align-items:center; gap:4px; }
#radar-oi-shift-body .oc-title input { width:72px; height:20px; padding:2px 5px; border:1px solid #333; background:#090909; color:#ddd; font:10px 'JetBrains Mono',monospace; text-transform:uppercase; }
#radar-oi-shift-body .oc-title button { color:#e0ac55; }
#radar-oi-shift-body .oc-menu { flex:0 0 26px; display:flex; align-items:center; gap:10px; padding:0 7px; background:#0d0d0d; border-bottom:1px solid #292929; white-space:nowrap; }
#radar-oi-shift-body .oc-summary { margin-left:auto; display:flex; gap:10px; color:#8f8f8f; font-size:9px; font-variant-numeric:tabular-nums; }
#radar-oi-shift-body .oc-summary .is-call { color:#5fd38d; }
#radar-oi-shift-body .oc-summary .is-put { color:#ef6f8b; }
#radar-oi-shift-body .oc-expiries { flex:0 0 38px; display:flex; align-items:stretch; background:#090909; border-bottom:1px solid #2c2c2c; }
#radar-oi-shift-body .oc-page { width:24px; color:#777!important; }
#radar-oi-shift-body .oc-tabs { flex:1; min-width:0; display:flex; }
#radar-oi-shift-body [data-oi-expiry] { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; border-left:1px solid #1f1f1f!important; color:#bdbdbd!important; }
#radar-oi-shift-body [data-oi-expiry] span { font-size:11px; }
#radar-oi-shift-body [data-oi-expiry] small { color:#6f6f6f; font-size:9px; }
#radar-oi-shift-body [data-oi-expiry][aria-pressed=true] { background:#16130d!important; color:#e0ac55!important; box-shadow:inset 0 -2px #c79143; }
#radar-oi-shift-body [data-oi-expiry][aria-pressed=true] small { color:#a8875a; }
#radar-oi-shift-body .oc-body { flex:1; min-height:0; display:flex; flex-direction:column; overflow:hidden; background:#000; }
#radar-oi-shift-body .oc-scroll { flex:1; min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#383838 #090909; }
html:not(.terminal-embed) #radar-oi-shift-body .oc-scroll { max-height:min(62vh,640px); }
#radar-oi-shift-body .oc-table { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; font-variant-numeric:tabular-nums; }
#radar-oi-shift-body .oc-strike-col { width:24%; }
#radar-oi-shift-body .oc-table :is(th,td) { border-right:1px solid #262626; border-bottom:1px solid #1d1d1d; text-align:center; font-weight:400; padding:0 6px; }
#radar-oi-shift-body .oc-table tr > :last-child { border-right:0; }
#radar-oi-shift-body .oc-table thead th { position:sticky; z-index:2; background:#121212; }
#radar-oi-shift-body .oc-sides th { top:0; height:24px; font-size:11px; letter-spacing:.12em; color:#ddd; border-bottom:1px solid #2e2e2e; }
#radar-oi-shift-body .oc-sides .is-call { color:#5fd38d; }
#radar-oi-shift-body .oc-sides .is-put { color:#ef6f8b; }
#radar-oi-shift-body .oc-fields th { top:24px; height:21px; color:#8a8a8a; font-size:9px; background:#0e0e0e; border-bottom:1px solid #c79143; }
#radar-oi-shift-body .oc-iv { color:#c9b07a!important; }
#radar-oi-shift-body .oc-strike-heading { display:inline-flex; align-items:center; gap:6px; }
#radar-oi-shift-body .oc-strike-heading > span { display:inline-flex; flex-direction:column; line-height:7px; }
#radar-oi-shift-body .oc-strike-heading button { padding:0!important; font-size:7px!important; color:#8a8a8a!important; }
/* Full chain: OI bars grow outward from the strike; ITM sides are tinted; a gold line marks spot. */
#radar-oi-shift-body .oc-full tbody tr { height:20px; cursor:pointer; }
#radar-oi-shift-body .oc-full tbody th { color:#e6e6e6; font-weight:600; background:#0b0b0b; }
#radar-oi-shift-body .oc-full tbody td { color:#c9c9c9; }
#radar-oi-shift-body .oc-full .oc-oi { background-repeat:no-repeat; background-size:var(--bar) 3px; background-position-y:calc(100% - 3px); }
#radar-oi-shift-body .oc-full .oc-oi.is-call { background-image:linear-gradient(#1f6b43,#1f6b43); background-position-x:right; }
#radar-oi-shift-body .oc-full .oc-oi.is-put { background-image:linear-gradient(#7a2537,#7a2537); background-position-x:left; }
#radar-oi-shift-body .oc-full .oc-oi.is-peak { color:#fff; font-weight:600; }
#radar-oi-shift-body .oc-full .oc-oi.is-call.is-peak { background-image:linear-gradient(#2e9c62,#2e9c62); }
#radar-oi-shift-body .oc-full .oc-oi.is-put.is-peak { background-image:linear-gradient(#b03552,#b03552); }
#radar-oi-shift-body .oc-full .oc-vol.is-hot { color:#ffb24d; }
#radar-oi-shift-body .oc-full tr.itm-call > td:nth-child(-n+2) { background-color:#0c1510; }
#radar-oi-shift-body .oc-full tr.itm-put > td:nth-last-child(-n+2) { background-color:#170b0e; }
#radar-oi-shift-body .oc-full tbody tr:hover > * { box-shadow:inset 0 0 0 999px #ffffff0d; }
#radar-oi-shift-body .oc-full tr.is-active-strike > * { box-shadow:inset 0 1px #c79143, inset 0 -1px #c79143; }
#radar-oi-shift-body .oc-full tr.is-active-strike th { color:#e0ac55; }
#radar-oi-shift-body .oc-spot-row td { height:15px; padding:0; border:0; border-top:1px solid #c79143; background:#120f09; color:#e0ac55; font-size:9px; letter-spacing:.06em; }
/* Focused strike: large readable numbers; the selected cell is outlined like the classic card. */
#radar-oi-shift-body .oc-focused tbody td { height:96px; padding:0; }
#radar-oi-shift-body .oc-focused [data-oi-cell] { width:100%; height:96px; border:1px solid transparent!important; font:500 28px 'JetBrains Mono',monospace!important; color:#e6e6e6!important; }
#radar-oi-shift-body .oc-focused [data-oi-cell].is-selected { border:1px solid #e5484d!important; background:#1a0c0e!important; }
#radar-oi-shift-body .oc-strike-input { background:#0b0b0b; }
#radar-oi-shift-body .oc-strike-input input { width:100%; height:96px; border:0; background:transparent; text-align:center; color:#fff; font:600 28px 'JetBrains Mono',monospace; appearance:textfield; -moz-appearance:textfield; }
#radar-oi-shift-body .oc-strike-input input::-webkit-inner-spin-button { appearance:none; }
#radar-oi-shift-body .oc-history { margin:0; border-top:1px solid #262626; overflow:auto; }
#radar-oi-shift-body .oc-history summary { padding:6px 9px; color:#9a9a9a; cursor:pointer; }
#radar-oi-shift-body .oc-history > div { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0 9px 9px; }
#radar-oi-shift-body .oc-history-side strong { display:block; padding:3px 0; font-size:9px; letter-spacing:.12em; }
#radar-oi-shift-body .oc-history-side .is-call { color:#5fd38d; }
#radar-oi-shift-body .oc-history-side .is-put { color:#ef6f8b; }
#radar-oi-shift-body .oc-history-side p { margin:4px 0; color:#777; }
#radar-oi-shift-body .oc-history-side table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
#radar-oi-shift-body .oc-history-side :is(th,td) { padding:2px 5px; border-bottom:1px solid #1f1f1f; text-align:right; font-weight:400; }
#radar-oi-shift-body .oc-history-side :is(th,td):first-child { text-align:left; }
#radar-oi-shift-body .oc-history-side th { color:#777; font-size:9px; }
#radar-oi-shift-body .oc-history-side .oc-now td { color:#e0ac55; }
#radar-oi-shift-body .oc-history-side .is-up { color:#5fd38d; }
#radar-oi-shift-body .oc-history-side .is-down { color:#ef6f8b; }
#radar-oi-shift-body .oc-empty { padding:12px; color:#8a8a8a; }
#radar-oi-shift-body .oc-status { flex:0 0 22px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 9px; background:#151515; border-top:1px solid #303030; color:#9a9a9a; font-size:9px; }
#radar-oi-shift-body .oc-status span:last-child { color:#6a6a6a; }
@media(max-width:600px) { #radar-oi-shift-body .oc-summary { display:none; } #radar-oi-shift-body [data-oi-expiry] span { font-size:10px; } #radar-oi-shift-body .oc-focused [data-oi-cell], #radar-oi-shift-body .oc-strike-input input { font-size:20px!important; } }

/* The wide ledger scrolls inside the page, rather than widening its grid track. */
html:not(.terminal-embed) #view-radar .radar-shell.radar-oi-active .radar-split { grid-template-columns: minmax(0, 1fr); }
html:not(.terminal-embed) #view-radar .radar-shell.radar-oi-active :is(.radar-queue-panel, #radar-oi-shift-body, .radar-oi-table-wrap) { min-width: 0; max-width: 100%; box-sizing: border-box; }
@media (max-width: 600px) {
 html:not(.terminal-embed) #view-radar .radar-shell.radar-oi-active { min-width: 0; max-width: 100%; }
 html:not(.terminal-embed) #radar-oi-shift-body :is(.radar-oi-toolbar, .radar-oi-readout, .oc-title, .oc-status) { min-width: 0; overflow-wrap: anywhere; }
 html:not(.terminal-embed) #radar-oi-shift-body .radar-oi-table-wrap { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
 html:not(.terminal-embed) #radar-oi-shift-body .oc-title strong { white-space: normal; min-width: 0; }
}

.radar-oi-hidden { color: #6b7178; }

/* Phones retain the complete ledger; swipe across columns and down through contracts. */
@media (max-width:600px) {
#radar-oi-shift-body .radar-oi-table :is(th,td):nth-child(n) { display:table-cell; width:auto; }
#radar-oi-shift-body { min-width:0; max-width:100%; }
#radar-oi-shift-body .radar-oi-table { min-width:1140px; width:100%; }
#radar-oi-shift-body .radar-oi-table th { padding:7px 8px; font-size:10px; white-space:nowrap; }
#radar-oi-shift-body .radar-oi-table td { height:32px; padding:4px 8px; font-size:11px; white-space:nowrap; }
#radar-oi-shift-body .radar-oi-table-wrap {
 min-width:0; width:100%; max-height:65dvh; overflow:auto;
 overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
}
html.terminal-embed[data-terminal-panel=oi] #radar-oi-shift-body .radar-oi-table-wrap { max-height:none; }
/* Keep the ticker visible as the rest of the ledger moves sideways. */
#radar-oi-shift-body .radar-oi-table :is(th,td):nth-child(2) { position:sticky; left:0; z-index:1; background:#0d0d0d; border-right:1px solid #303030; }
#radar-oi-shift-body .radar-oi-table tbody tr:nth-child(even) td:nth-child(2) { background:#141414; }
#radar-oi-shift-body .radar-oi-table thead th:nth-child(2) { z-index:3; background:#202020; }
#radar-oi-shift-body .radar-oi-footer { flex:0 0 auto; flex-wrap:wrap; font-size:9px; }
#radar-oi-shift-body .radar-oi-readout::after { content:"Swipe ↔ for all columns · scroll ↓ for more contracts"; color:#bb985b; }
#radar-shell.radar-oi-active > .radar-control-panel,
#radar-oi-shift-body .radar-oi-open-terminal { display:none; }
}
