:root {
  /* Fyers NSE classic dark — same navy and softer text for long sessions. */
  --bg: #0a0e17;
  --bg-soft: #0d1320;
  --panel: #111824;
  --panel-2: #0d1320;
  --border: #1d2638;
  --border2: #2a3548;
  --border-soft: rgba(148, 163, 184, 0.16);
  --text: #d5dee9;
  --muted: #76849b;
  --dim: #8b98ad;
  --green: #34d399;
  --green-deep: rgba(52, 211, 153, 0.15);
  --green-soft: rgba(52, 211, 153, 0.10);
  --green-border: rgba(52, 211, 153, 0.36);
  --red: #f87171;
  --red-soft: rgba(248, 113, 113, 0.10);
  --red-border: rgba(248, 113, 113, 0.36);
  --cyan: #38bdf8;
  --cyan-deep: rgba(56, 189, 248, 0.14);
  --cyan-soft: rgba(56, 189, 248, 0.08);
  --cyan-border: rgba(56, 189, 248, 0.34);
  --amber: #f0b429;
  --amber-soft: rgba(240, 180, 41, 0.10);
  --amber-border: rgba(240, 180, 41, 0.36);
  --purple: #c084fc;
  --on-accent: #001018;
  --sidebar: 244px;
  --radius: 10px;
  --shadow: 0 12px 40px rgba(0,0,0,.28);
  font-family: "Segoe UI", system-ui, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scrollbar-gutter: stable; }
body { margin: 0; background: var(--bg); color: var(--text); min-height: 100vh; font-size: 14px; font-variant-numeric: tabular-nums; }
button, select, input, textarea { font: inherit; }
button { color: inherit; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) 1fr; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar); padding: 24px 18px; background: linear-gradient(180deg,#111824 0%,#0a0e17 100%); border-right: 1px solid var(--border); display: flex; flex-direction: column; z-index: 5; }
.brand-block { display: flex; align-items: flex-start; gap: 12px; padding: 2px 8px 22px; }
.brand-mark { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: var(--on-accent); background: var(--cyan); font-size: 23px; font-weight: 900; box-shadow: 0 0 28px var(--cyan-soft); }
.brand-title { font-size: 14px; font-weight: 850; letter-spacing: .13em; }
.brand-subtitle { color: var(--muted); font-size: 12px; margin-top: 4px; }
.brand-meta { display: flex; flex-direction: column; gap: 3px; margin-top: 9px; color: var(--dim); font-size: 11px; line-height: 1.4; }
.brand-meta span { color: var(--cyan); font-weight: 800; letter-spacing: .08em; }
.live-pill { display: inline-flex; align-items: center; gap: 8px; margin: 0 8px 20px; padding: 7px 12px; border: 1px solid var(--green-border); background: var(--green-soft); border-radius: 9px; color: var(--green); font-size: 11px; font-weight: 850; letter-spacing: .16em; }
.mode-label, .panel-kicker, .eyebrow { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.status-dot.live { background: var(--green); box-shadow: 0 0 0 5px var(--green-soft); }
.nav-list { display: flex; flex-direction: column; gap: 5px; }
.nav-item { border: 0; background: transparent; color: var(--muted); text-align: left; padding: 12px; border-radius: 9px; cursor: pointer; display: flex; align-items: center; gap: 12px; transition: .16s ease; font-size: 14px; font-weight: 650; }
.nav-item span { font-size: 9px; color: var(--dim); letter-spacing: .1em; }
.nav-item:hover { color: var(--text); background: rgba(255,255,255,.035); }
.nav-item.active { color: var(--cyan); background: var(--cyan-deep); }
.nav-item.active span { color: var(--cyan); }
.sidebar-warning { margin-top: auto; display: flex; flex-direction: column; gap: 5px; background: var(--amber-soft); border: 1px solid var(--amber-border); padding: 12px; border-radius: 10px; }
.sidebar-warning strong { font-size: 11px; color: var(--amber); }
.sidebar-warning span { font-size: 10px; line-height: 1.45; color: var(--muted); }

.workspace { grid-column: 2; min-width: 0; padding: 24px 28px 56px; }
.topbar { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; min-height: 34px; margin-bottom: 10px; position: sticky; top: 0; z-index: 6; background: var(--bg); padding: 7px 0 6px; border-bottom: 1px solid var(--border); }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.icon-form { margin: 0; display: flex; }
.icon-btn { background: none; border: 0; padding: 0; margin: 0; cursor: pointer; line-height: 0; }
.icon-btn img { width: 28px; height: 28px; display: block; }
.users-panel { max-width: 680px; }
.header-market-strip { min-width: 0; display: grid; grid-template-columns: repeat(9,minmax(0,1fr)); background: var(--panel); border: 1px solid var(--border); border-radius: 9px; overflow: hidden; }
.header-market-strip > div { min-width: 0; padding: 4px 7px; border-right: 1px solid var(--border); border-top: 2px solid var(--cyan); }
.header-market-strip > div:nth-child(3) { border-top-color: var(--amber); }
.header-market-strip > div:nth-child(4) { border-top-color: var(--amber); }
.header-market-strip > div:last-child { border-right: 0; }
.header-market-strip span { display: block; color: var(--dim); font-size: 8.5px; font-weight: 850; letter-spacing: .06em; white-space: nowrap; }
.header-market-strip strong { display: block; margin-top: 1px; color: var(--text); font-size: 12px; font-weight: 850; font-variant-numeric: tabular-nums; white-space: nowrap; }
.header-market-strip .header-pnl { background: var(--panel-2); }
.header-market-strip .header-pnl.pnl-positive { background: var(--green-soft); border-top-color: var(--green); }
.header-market-strip .header-pnl.pnl-negative { background: var(--red-soft); border-top-color: var(--red); }
.header-market-strip .header-realized { background: var(--panel-2); }
.header-market-strip .header-capital { background: var(--panel-2); border-top-color: var(--green); }
.header-market-strip .header-capital strong { color: var(--green); }
.header-market-strip .header-realized.pnl-positive { background: var(--green-soft); border-top-color: var(--green); }
.header-market-strip .header-realized.pnl-negative { background: var(--red-soft); border-top-color: var(--red); }
.header-market-strip .header-time-box { background: var(--panel-2); border-top-color: var(--cyan); }
.header-market-strip .header-time-box strong { color: var(--cyan); }
.header-market-strip .settlement-box { background: var(--panel-2); }
.header-market-strip .settlement-box.settlement-urgent { background: var(--amber-soft, #3a2a0a); border-top-color: var(--amber); }
.header-market-strip .settlement-box.settlement-urgent strong { color: var(--amber); }
.header-market-strip .settlement-box.settlement-critical { background: var(--red-soft); border-top-color: var(--red); }
.header-market-strip .settlement-box.settlement-critical strong { color: var(--red); }
.header-market-strip #settlement-box-xau { border-top-color: var(--amber); }
.timestamp-block { text-align: right; display: flex; flex-direction: column; gap: 4px; }
.timestamp-block span { color: var(--dim); font-size: 9px; font-weight: 800; letter-spacing: .13em; }
.timestamp-block strong { font-size: 11px; color: var(--muted); }
.timestamp-block small { color: var(--dim); font-size: 9px; }
.button { border-radius: 8px; border: 1px solid transparent; padding: 9px 14px; font-size: 11px; font-weight: 800; cursor: pointer; transition: .16s ease; }
.button:disabled { opacity: .5; cursor: wait; }
.button.secondary { background: var(--panel); border-color: var(--border); color: var(--muted); }
.button.secondary:hover { color: var(--cyan); border-color: var(--cyan-border); }
.button.primary { background: var(--cyan); color: var(--on-accent); }
.button.primary:hover { filter: brightness(1.06); transform: translateY(-1px); }
.button.danger { background: transparent; border-color: var(--red-border); color: var(--red); }
.button.full { width: 100%; padding: 12px; }

.page { display: none; animation: page-in .22s ease; }
.page.active { display: block; }
@keyframes page-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.hidden { display: none !important; }
.global-alert { border: 1px solid var(--red-border); background: var(--red-soft); color: var(--red); padding: 12px 14px; margin-bottom: 16px; border-radius: 10px; font-size: 12px; }

.safety-banner { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 16px 18px; background: linear-gradient(90deg,var(--green-soft),transparent); border: 1px solid var(--green-border); border-radius: var(--radius); margin-bottom: 18px; }
.safety-icon { width: 32px; height: 32px; display: grid; place-items: center; background: var(--green-deep); color: var(--green); border-radius: 50%; font-weight: 900; }
.safety-banner strong { font-size: 13px; }
.safety-banner p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.safety-badge { color: var(--green); border: 1px solid var(--green-border); border-radius: 999px; padding: 5px 9px; font-size: 9px; font-weight: 900; letter-spacing: .12em; }

.market-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; margin-bottom: 16px; }
.market-card { position: relative; overflow: hidden; background: linear-gradient(145deg,var(--panel),var(--bg-soft)); border: 1px solid var(--border); border-top: 2px solid var(--cyan); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow); }
.market-card:nth-child(3) { border-top-color: var(--amber); }
.market-card::after { content: ''; position: absolute; width: 150px; height: 150px; border-radius: 50%; background: var(--cyan-soft); right: -50px; top: -70px; }
.market-title { display: flex; justify-content: space-between; align-items: center; }
.market-symbol { display: flex; align-items: center; gap: 10px; font-weight: 850; }
.asset-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--amber-soft); color: var(--amber); font-size: 12px; }
.change { font-size: 11px; font-weight: 800; padding: 4px 7px; border-radius: 999px; }
.change.positive { color: var(--green); background: var(--green-soft); }
.change.negative { color: var(--red); background: var(--red-soft); }
.market-price { font-size: 38px; font-weight: 720; letter-spacing: -.045em; margin: 17px 0 15px; font-variant-numeric: tabular-nums; }
.market-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.market-metrics span { color: var(--dim); font-size: 11px; display: block; margin-bottom: 5px; }
.market-metrics strong { font-size: 14px; font-weight: 750; }

.two-column { display: grid; grid-template-columns: 1.2fr .8fr; gap: 16px; }
.panel { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.panel h2, .lab-intro h2 { margin: 5px 0 0; font-size: 17px; letter-spacing: -.02em; }
.workflow-list { display: grid; gap: 3px; }
.workflow-step { display: grid; grid-template-columns: 30px 1fr; gap: 11px; align-items: center; padding: 10px; border-radius: 9px; }
.workflow-step > span { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; font-size: 9px; color: var(--dim); }
.workflow-step strong { display: block; font-size: 11px; }
.workflow-step small { display: block; color: var(--muted); margin-top: 3px; font-size: 10px; }
.workflow-step.complete > span { background: var(--green); color: var(--on-accent); border-color: var(--green); }
.workflow-step.active { background: var(--cyan-soft); }
.workflow-step.active > span { color: var(--cyan); border-color: var(--cyan-border); }
.metric-list { display: grid; }
.metric-list > div { display: flex; justify-content: space-between; gap: 15px; padding: 11px 0; border-bottom: 1px solid var(--border-soft); font-size: 10px; }
.metric-list span { color: var(--muted); }
.metric-list strong { text-align: right; }
.panel-note, .table-footnote { color: var(--dim); font-size: 10px; line-height: 1.55; }

.control-bar { display: flex; align-items: end; gap: 14px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; margin-bottom: 14px; }
.segmented { display: flex; background: var(--bg); border: 1px solid var(--border); padding: 3px; border-radius: 9px; }
.segment { border: 0; background: transparent; color: var(--muted); padding: 8px 16px; border-radius: 6px; cursor: pointer; font-size: 11px; font-weight: 850; }
.segment.active { background: var(--cyan-deep); color: var(--cyan); }
.field-label { color: var(--dim); font-size: 9px; font-weight: 800; letter-spacing: .08em; display: flex; flex-direction: column; gap: 6px; }
select, input, textarea { min-height: 34px; color: var(--text); background: var(--bg); border: 1px solid var(--border); border-radius: 7px; padding: 7px 10px; outline: none; }
select:focus, input:focus, textarea:focus { border-color: var(--cyan-border); }
textarea { resize: vertical; }
.control-stat { margin-left: auto; padding: 2px 8px; }
.control-stat + .control-stat { margin-left: 0; }
.control-stat span { display: block; color: var(--dim); font-size: 8px; letter-spacing: .12em; margin-bottom: 4px; }
.control-stat strong { font-size: 13px; }
#chain-synthetic { color: var(--amber); }
.chain-control-bar { gap: 8px; margin-bottom: 6px; padding: 0 2px 6px; background: transparent; border: 0; border-radius: 0; }
.chain-control-bar .segmented { padding: 2px; border-radius: 7px; }
.chain-control-bar .segment { min-height: 30px; padding: 4px 10px; font-size: 11px; }
.chain-control-bar .field-label { flex-direction: row; align-items: center; gap: 6px; letter-spacing: .03em; }
.chain-control-bar select { min-height: 30px; padding: 4px 8px; }
.chain-control-bar .control-stat { margin-left: 0; padding: 0 6px; }
.chain-control-bar .control-stat span { margin-bottom: 2px; }
.chain-control-bar .control-stat strong { font-size: 14px; }
#page-chain { margin-inline: -16px; }
#page-chain > .control-bar, #page-chain > .panel { border-radius: 9px; }
.chain-panel { padding: 8px 10px; }
.chain-panel .table-scroll { max-height: calc(100vh - 132px); }
.option-table { table-layout: fixed; width: 100%; border-collapse: collapse; }
.option-table th { height: 32px; padding: 6px 5px; text-align: right; font-size: 11.5px; line-height: 1.15; white-space: normal; position: static; }
.option-table td { height: 32px; padding: 5px 6px; text-align: right; font-size: 12.5px; line-height: 1.15; transition: color .18s ease, background-color .32s ease; }
.option-table th, .option-table td { border-right: 1px solid #1a2333; }
.option-table th:last-child, .option-table td:last-child { border-right: 0; }
.option-table thead tr:first-child th { background: var(--panel-2); border-bottom: 1px solid #23304a; }
.option-table thead tr:last-child th { border-bottom: 1px solid var(--border2); }
.option-table th:nth-child(9), .option-table td:nth-child(9) { width: 6.5%; font-weight: 800; text-align: center; }
.option-table th:nth-child(2), .option-table td:nth-child(2),
.option-table th:nth-child(16), .option-table td:nth-child(16) { width: 7.5%; }
.option-table[data-side="call"] .pe-col { display: none; }
.option-table[data-side="put"] .ce-col { display: none; }
.option-table .max-ce, .option-table .max-pe { color: var(--amber) !important; font-weight: 950 !important; box-shadow: inset 0 0 0 1px rgba(247,201,72,.35); }
.chain-scroll.density-compact .option-table th { height: 30px; padding: 5px 4px; font-size: 11px; }
.chain-scroll.density-compact .option-table td { height: 29px; padding: 4px; font-size: 12px; }
.chain-scroll.density-dense .option-table th { height: 27px; padding: 3px 4px; font-size: 10.5px; }
.chain-scroll.density-dense .option-table td { height: 22px; padding: 1px 4px; font-size: 11.5px; line-height: 1.05; }
.chain-notes-panel { margin-top: 9px; padding: 11px 14px; }
.pcr-guide { display: flex; align-items: center; justify-content: space-between; gap: 14px; font-size: 13px; line-height: 1.45; white-space: nowrap; }
.pcr-guide > strong { color: var(--cyan); letter-spacing: .08em; }
.market-outlook-panel { margin-top: 9px; }
.market-outlook-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border: 1px solid var(--border-soft); border-radius: 9px; overflow: hidden; }
.market-outlook-grid > div { min-width: 0; padding: 11px 12px; background: var(--panel-2); border-right: 1px solid var(--border-soft); }
.market-outlook-grid > div:last-child { border-right: 0; }
.market-outlook-grid span { display: block; color: var(--dim); font-size: 10px; font-weight: 850; letter-spacing: .06em; }
.market-outlook-grid strong { display: block; margin-top: 5px; font-size: 15px; font-variant-numeric: tabular-nums; }
.market-outlook-note { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.premium-breakup-panel { margin-top: 8px; position: relative; }
.premium-breakup-panel .pb-fit { max-height: none; overflow: visible; }
.premium-breakup-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 11px; }
.premium-breakup-table th { color: var(--muted); font-weight: 800; padding: 4px 6px; text-align: right; border-bottom: 1px solid var(--border2); font-size: 9px; letter-spacing: .04em; }
.premium-breakup-table th.strike-column, .premium-breakup-table td.strike-column { text-align: center; }
.premium-breakup-table th.bar-col, .premium-breakup-table td.bar-col { text-align: left; width: 9%; }
.premium-breakup-table td { padding: 2px 6px; text-align: right; border-bottom: 1px solid #1a2333; font-variant-numeric: tabular-nums; color: var(--text); }
.premium-breakup-table td.strike-column { font-weight: 800; color: var(--text); background: transparent; }
.premium-breakup-table tr.atm-row td { background: transparent; }
.premium-breakup-table tr.atm-row td.strike-column { color: #fff; background: transparent; box-shadow: inset 0 0 0 1px var(--amber); }
.pb-bar-track { display: flex; height: 8px; border-radius: 3px; overflow: hidden; background: var(--bg); cursor: pointer; max-width: 100%; }
.pb-bar-track.call { justify-content: flex-end; }
.pb-seg { height: 100%; }
.pb-seg.intrinsic { background: var(--cyan); opacity: .85; }
.pb-seg.time { background: var(--amber); opacity: .85; }
.pb-tooltip {
  position: absolute; pointer-events: none; background: var(--panel-2); border: 1px solid var(--border2); border-radius: 8px;
  padding: 9px 12px; font-size: 11.5px; line-height: 1.6; opacity: 0; z-index: 20; box-shadow: 0 10px 30px -12px rgba(0,0,0,.7);
  transform: translate(-50%, -110%); white-space: nowrap;
}
.pb-tooltip strong { display: block; margin-bottom: 2px; }
.atm-iv-panel { margin-top: 8px; }
.chart-wrap.atm-iv-chart-wrap { position: relative; height: clamp(500px,58vh,640px); background: var(--bg); border: 1px solid var(--border-soft); border-radius: 10px; overflow: hidden; }
.atm-iv-chart-wrap svg { display: block; width: 100%; height: 100%; }
.atm-iv-ce { fill: none; stroke: var(--green); stroke-width: 1; vector-effect: non-scaling-stroke; }
.atm-iv-pe { fill: none; stroke: var(--red); stroke-width: 1; vector-effect: non-scaling-stroke; }
.atm-iv-vline { stroke: var(--cyan); stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.atm-iv-hour { fill: var(--text); font-size: 12px; font-weight: 750; }
.atm-iv-y-label { fill: var(--text); font-size: 13px; font-weight: 800; }
.atm-iv-tooltip { display: none; position: absolute; z-index: 5; pointer-events: none; min-width: 140px; padding: 8px 10px; color: var(--text); background: rgba(7,16,25,.97); border: 1px solid var(--border2); border-radius: 7px; font-size: 11px; line-height: 1.45; }
.atm-iv-tooltip strong { display: block; margin-bottom: 3px; }
.atm-iv-tooltip .ce-row { color: var(--green); }
.atm-iv-tooltip .pe-row { color: var(--red); }
.atm-session-marker line { stroke-width: 1.5; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; opacity: .85; }
.atm-session-marker text { font-size: 11px; font-weight: 900; letter-spacing: .05em; }
.atm-session-marker.asia line, .atm-session-marker.asia text { stroke: #22d3ee; fill: #22d3ee; }
.atm-session-marker.london line, .atm-session-marker.london text { stroke: #fbbf24; fill: #fbbf24; }
.atm-session-marker.new-york line, .atm-session-marker.new-york text { stroke: #c084fc; fill: #c084fc; }
.session-key { font-weight: 850; }
.session-key.asia { color: #22d3ee; }
.session-key.london { color: #fbbf24; }
.session-key.new-york { color: #c084fc; }
.desk-alert-banner { margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--amber); border-radius: 8px; background: rgba(240,180,41,.08); color: var(--text); font-size: 13px; }
.desk-alert-banner strong { color: var(--amber); margin-right: 8px; }
.alert-toggle-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 10px; }
.alert-toggle { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; }
.alert-toggle input { margin-top: 3px; }
.alert-toggle strong { display: block; font-size: 13px; }
.alert-toggle span { display: block; color: var(--muted); font-size: 11.5px; line-height: 1.4; margin-top: 3px; }
.alert-log-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.alert-log-table th { text-align: left; padding: 9px 12px; color: var(--muted); font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--panel-2); border-bottom: 1px solid var(--border2); white-space: nowrap; }
.alert-log-table td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--border-soft); font-size: 12.5px; vertical-align: middle; color: var(--text); }
.alert-log-table tr:hover td { background: rgba(255, 255, 255, 0.02); }
.alert-urgency-cell.urgent { color: var(--red); font-weight: 700; }
.alert-urgency-cell.normal { color: var(--muted); }
.chain-walls-panel { margin-top: 10px; }
.chain-oi-histogram { height: 280px; padding: 4px 8px 8px; overflow: hidden; position: relative; }
.chain-oi-histogram svg { display: block; width: 100%; height: 100%; }
.oi-histogram-axis { stroke: var(--border2); stroke-width: 1; }
.oi-histogram-ce { fill: var(--green); opacity: .88; }
.oi-histogram-pe { fill: var(--red); opacity: .88; }
.oi-histogram-strike { fill: var(--muted); font-size: 8px; font-weight: 700; text-anchor: middle; }
.oi-histogram-strike.histogram-atm { fill: var(--amber); font-weight: 900; }
.oi-histogram-spot { stroke: #fff; stroke-width: 1.2; stroke-dasharray: 4 3; opacity: .85; }
.oi-histogram-spot-label { fill: #fff; font-size: 8.5px; font-weight: 800; }
.oi-histogram-crosshair { stroke: var(--cyan); stroke-width: 1; stroke-dasharray: 3 3; opacity: 0; pointer-events: none; }
.oi-histogram-tooltip {
  position: absolute; pointer-events: none; background: var(--panel-2); border: 1px solid var(--border2);
  border-radius: 8px; padding: 8px 11px; font-size: 11.5px; line-height: 1.55; opacity: 0;
  transform: translate(-50%, -100%); white-space: nowrap; box-shadow: 0 10px 30px -12px rgba(0,0,0,.7); z-index: 5;
}
.oi-histogram-tooltip strong { display: block; font-size: 12.5px; margin-bottom: 3px; }
.oi-histogram-tooltip .ce-row { color: var(--green); }
.oi-histogram-tooltip .pe-row { color: var(--red); }
.chain-intelligence-panel { padding: 8px 10px 8px; margin-bottom: 8px; }
.chain-intelligence-panel .panel-header { margin-bottom: 4px; }
.chain-intelligence-panel .panel-header h2 { font-size: 11px; font-weight: 700; color: var(--muted); margin: 0; letter-spacing: .01em; }
.chain-intel-grid { display: grid; grid-template-columns: repeat(7, minmax(94px, 1fr)) minmax(118px, .85fr) minmax(210px, 1.55fr); gap: 0; margin-top: 0; }
.chain-intel-grid .control-stat { margin-left: 0; padding: 4px 8px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; }
.chain-intel-grid .control-stat strong { font-size: 13px; }
.chain-intel-grid .control-stat small { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .05em; margin-top: 2px; }
.chain-intel-grid #chain-side-filter { align-self: center; justify-self: center; }
.chain-intel-grid .chain-oi-display { align-self: center; justify-self: center; }
.chain-oi-display .segment { min-width: 48px; padding-inline: 9px; }
.selected-strike-row td { background: rgba(56,189,248,.06); }
@media (max-width: 900px) { .chain-intel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.legend { display: flex; gap: 8px; font-size: 8px; font-weight: 900; }
.legend span { padding: 4px 7px; border-radius: 4px; }
.call-key { color: var(--red); background: var(--red-soft); }
.put-key { color: var(--green); background: var(--green-soft); }
.oi-strike-key-ce { color: var(--green); font-weight: 700; }
.oi-strike-key-pe { color: var(--red); font-weight: 700; }
.table-scroll { overflow: auto; max-height: calc(100vh - 270px); }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.option-table, .seller-position-table, .summary-strip, .header-market-strip { overflow-anchor: none; }
th { position: sticky; top: 0; z-index: 1; background: var(--panel); color: var(--muted); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; padding: 11px 8px; border-bottom: 1px solid var(--border2); }
td { text-align: right; padding: 10px 8px; font-size: 13px; font-weight: 600; color: var(--text); border-bottom: 1px solid var(--border-soft); }
tr:hover td { background: rgba(255,255,255,.018); }
.strike-column, td.strike-column { text-align: center; background: var(--panel-2); font-weight: 850; color: var(--text); border-left: 1px solid var(--border); border-right: 1px solid var(--border); }
td.call-itm { background: var(--red-soft); }
td.put-itm { background: var(--green-soft); }
td.chain-liquidity { font-weight: 850; line-height: 1; white-space: nowrap; }
td.chain-liquidity span { display: block; font-size: 11.5px; }
td.chain-liquidity small { display: block; margin-top: 2px; font-size: 8px; }
.spread-good { color: var(--green) !important; }
.spread-warning { color: var(--amber) !important; }
.spread-danger { color: var(--red) !important; }
.spread-neutral { color: var(--muted) !important; }
.option-table th.ce-col { color: #88c9ff; }
.option-table th.pe-col { color: #86efac; }
.atm-row td { background: transparent; }
.atm-row td.strike-column { color: #fff; background: transparent !important; font-weight: 900; box-shadow: inset 0 0 0 1px var(--amber); }
.price-tick-up { animation: price-up .42s ease; }
.price-tick-down { animation: price-down .42s ease; }
@keyframes price-up { 0% { background-color: var(--green-soft); color: var(--green); } 100% { background-color: transparent; } }
@keyframes price-down { 0% { background-color: var(--red-soft); color: var(--red); } 100% { background-color: transparent; } }
.loading-cell { text-align: center; padding: 50px; color: var(--muted); }

.lab-intro { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 18px; align-items: center; margin-bottom: 12px; padding: 2px; }
.lab-intro h2 { margin: 0; white-space: nowrap; }
.lab-intro p { color: var(--muted); max-width: none; font-size: 12px; margin: 0; }
.lab-context { text-align: right; display: flex; flex-direction: row; align-items: baseline; gap: 8px; white-space: nowrap; }
.lab-context span { color: var(--cyan); font-size: 22px; font-weight: 900; }
.lab-context strong { color: var(--muted); font-size: 10px; }
.seller-control-bar { display: flex; justify-content: space-between; gap: 18px; align-items: center; margin-bottom: 15px; padding: 14px 16px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); }
.seller-expiry-control { min-width: 0; flex: 1; }
.expiry-picker { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 9px; }
.expiry-chip { min-height: 38px; padding: 8px 13px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); color: var(--text); font-size: 13px; font-weight: 750; cursor: pointer; }
.expiry-chip:hover { color: var(--cyan); border-color: var(--cyan-border); }
.expiry-chip.active { color: var(--cyan); border-color: var(--cyan); background: var(--cyan-deep); }
.expiry-loading { color: var(--muted); font-size: 13px; }
.inr-reference { min-width: 280px; text-align: right; display: flex; flex-direction: column; gap: 3px; }
.inr-reference span { color: var(--dim); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.inr-reference strong { color: var(--amber); font-size: 16px; }
.inr-reference small { color: var(--muted); font-size: 12px; }
.inr-reference small:empty { display: none; }
.strategy-builder-panel { margin-bottom: 15px; }
.builder-heading { margin-bottom: 13px; }
.builder-controls { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
.builder-controls-single { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.builder-controls-secondary { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 14px; align-items: end; }
.builder-controls select, .builder-controls input, .builder-controls .currency-input, .builder-controls .percent-input { width: 100%; height: 40px; }
.builder-controls-single select, .builder-controls-single input, .builder-controls-single .currency-input, .builder-controls-single .percent-input { height: 34px; }
.builder-notes { color: var(--muted); font-size: 12px; line-height: 1.45; margin: 10px 0 0; }
.builder-lot-presets { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 18px; }
.lab-tabs { margin: 16px 0 12px; }
.lab-table-panel.hidden { display: none; }
.leg-plan-table { width: 100%; }
.leg-plan-table th, .leg-plan-table td { text-align: left; padding: 8px 6px; font-size: 12px; white-space: nowrap; }
.leg-plan-table .cp { font-weight: 850; margin-right: 4px; }
.leg-plan-table tr.leg-sell td:first-child { box-shadow: inset 3px 0 0 var(--amber); }
.leg-plan-table tr.leg-buy td:first-child { box-shadow: inset 3px 0 0 var(--cyan); }
.leg-plan-table .leg-analysis { white-space: normal; min-width: 168px; max-width: 280px; font-size: 11px; font-weight: 650; line-height: 1.35; color: var(--muted); }
.leg-plan-table .leg-total { font-weight: 850; border-top: 1px solid var(--border); }
.leg-plan-table .leg-total td { padding-top: 10px; }
.leg-delta-note { display: block; color: var(--muted); font-size: 10px; font-weight: 650; margin-top: 3px; }
.server-overall { margin-bottom: 14px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel-2); }
.server-overall strong { display: block; font-size: 16px; }
.server-overall span { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
.unit-breakdown .panel-note { margin: 10px 0 0; padding: 0; border: 0; }
.unit-breakdown .liq-verdict { display: block; }
.unit-breakdown .liq-verdict span { display: block; margin-bottom: 6px; }
.unit-breakdown .liq-verdict strong { display: block; font-size: 13px; line-height: 1.45; }
.field-help { display: block; color: var(--muted); font-size: 11px; font-weight: 600; line-height: 1.35; margin-top: 6px; text-transform: none; letter-spacing: 0; }
.currency-input, .percent-input { display: grid; grid-template-columns: auto 1fr; align-items: center; min-height: 40px; color: var(--amber); background: var(--bg); border: 1px solid var(--border); border-radius: 7px; overflow: hidden; }
.currency-input span { padding-left: 11px; font-weight: 900; }
.percent-input { grid-template-columns: 1fr auto; }
.percent-input span { padding-right: 11px; font-weight: 900; }
.currency-input input, .percent-input input { border: 0; min-width: 0; }
.builder-guidance { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--border-soft); }
.builder-guidance > span { color: var(--amber); font-weight: 800; }
#strategy-focus { margin-bottom: 15px; }
.strategy-focus-card { border-color: var(--cyan-border); padding: 21px; }
.focus-title { align-items: flex-start; }
.focus-title h3 { font-size: 23px; margin: 5px 0 0; }
.focus-title p { color: var(--muted); margin: 7px 0 0; font-size: 14px; }
.capital-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; margin: 18px 0 11px; }
.capital-metrics > div { min-height: 82px; padding: 13px; background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 9px; }
.capital-metrics span { display: block; color: var(--dim); font-size: 12px; letter-spacing: .05em; margin-bottom: 7px; }
.capital-metrics strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.position-status { margin-bottom: 16px; padding: 11px 13px; background: var(--panel-2); border-radius: 8px; font-size: 15px; font-weight: 750; }
.seller-research { margin: 0 0 16px; padding: 16px; border: 1px solid var(--border); border-radius: 10px; background: linear-gradient(180deg, var(--panel), var(--panel-2)); }
.seller-research .panel-kicker { margin-bottom: 12px; }
.seller-research-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 28px; }
.seller-research-howto { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.rcf { display: grid; grid-template-columns: 168px 1fr; row-gap: 6px; column-gap: 8px; font-size: 13px; line-height: 1.5; }
.rcf .k { color: var(--muted); }
.rcf .v::before { content: ": "; color: var(--dim); }
.range-map { margin-top: 14px; }
.range-track { position: relative; height: 12px; background: #1d2638; border-radius: 7px; }
.range-expected { position: absolute; top: 0; bottom: 0; background: rgba(251, 191, 36, 0.42); border-radius: 7px; }
.range-spot { position: absolute; left: 50%; top: -4px; bottom: -4px; width: 2px; background: #fff; box-shadow: 0 0 10px rgba(255,255,255,.7); }
.range-wing { position: absolute; top: -3px; bottom: -3px; width: 2px; }
.range-wing.put { background: var(--green); }
.range-wing.call { background: var(--red); }
.range-legend { position: relative; height: 22px; margin-top: 8px; color: var(--muted); font-size: 12px; font-weight: 700; }
.range-short-label { position: absolute; top: 0; white-space: nowrap; }
.range-short-label.put { transform: translateX(-50%); }
.range-short-label.call { transform: translateX(-50%); }
.range-spot-label { position: absolute; left: 50%; transform: translateX(-50%); }
.range-note { margin-top: 6px; color: var(--dim); font-size: 12px; }
.research-verdict { margin: 10px 0 0; font-size: 14px; font-weight: 700; line-height: 1.45; }
.strategy-detail-grid { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(220px,.7fr); gap: 16px; margin-bottom: 14px; }
.strategy-detail-grid .panel-kicker { margin-bottom: 9px; }
.unit-breakdown { background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 9px; padding: 13px; }
.unit-breakdown > div:not(.panel-kicker) { display: flex; justify-content: space-between; gap: 13px; padding: 9px 0; border-bottom: 1px solid var(--border-soft); font-size: 13px; }
.unit-breakdown > div:last-of-type { border: 0; }
.unit-breakdown span { color: var(--muted); }
.capital-disclaimer { color: var(--muted); background: var(--amber-soft); border: 1px solid var(--amber-border); border-radius: 8px; padding: 11px 13px; margin-bottom: 13px; font-size: 13px; line-height: 1.5; }
.capital-disclaimer strong { color: var(--amber); }
.strategy-comparison-panel { margin-bottom: 15px; }
.compact-comparison { max-height: none; }
.comparison-table th, .comparison-table td { text-align: left; white-space: nowrap; }
.comparison-table th:nth-child(n+3):nth-child(-n+5), .comparison-table td:nth-child(n+3):nth-child(-n+5) { text-align: right; }
.comparison-table td { font-size: 13px; }
.comparison-name { font-weight: 850; }
.selected-comparison td { background: var(--cyan-soft); }
.selected-comparison .comparison-name { color: var(--cyan); }
.strategy-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin-bottom: 15px; }
.strategy-card { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 17px; box-shadow: var(--shadow); }
.strategy-card.unsafe { border-color: var(--red-border); }
.profitability-panel{padding:18px}
.profitability-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:14px}
.profitability-heading h2{margin:4px 0 5px;font-size:20px}
.profitability-heading p{margin:0;max-width:760px;color:var(--muted);font-size:12.5px;line-height:1.55}
.profitability-verdict{min-width:145px;padding:12px 16px;border:1px solid var(--border2);border-radius:11px;background:var(--panel-2);text-align:right}
.profitability-verdict span,.profitability-verdict strong,.profitability-verdict small{display:block}
.profitability-verdict span{font-size:11px;font-weight:900;letter-spacing:.1em}
.profitability-verdict strong{margin-top:3px;font-size:25px;font-variant-numeric:tabular-nums}
.profitability-verdict small{margin-top:2px;color:var(--muted);font-size:10px}
.profitability-metrics,.realized-diagnostic-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin:12px 0 14px}
.profitability-metrics>div,.realized-diagnostic-metrics>div{min-width:0;padding:11px 12px;border:1px solid var(--border);border-radius:9px;background:var(--panel-2)}
.profitability-metrics span,.realized-diagnostic-metrics span{display:block;color:var(--dim);font-size:9px;font-weight:800;letter-spacing:.08em;line-height:1.35}
.profitability-metrics strong,.realized-diagnostic-metrics strong{display:block;margin-top:6px;font-size:16px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.profitability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.profitability-box{min-width:0;padding:14px 15px;border:1px solid var(--border);border-radius:10px;background:var(--panel-2)}
.profitability-box h3{margin:0 0 10px;font-size:13px}
.profitability-box p{margin:9px 0 0;color:var(--muted);font-size:11.5px;line-height:1.5}
.profitability-box ul{margin:0;padding-left:18px;color:var(--muted);font-size:12px;line-height:1.55}
.profitability-facts{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.profitability-facts span{padding:6px 8px;border:1px solid var(--border-soft);border-radius:6px;color:var(--muted);font-size:10.5px}
.profitability-facts b{color:var(--text)}
.profitability-ledger{display:grid;gap:7px}
.profitability-ledger span{display:flex;justify-content:space-between;gap:15px;padding-bottom:6px;border-bottom:1px solid var(--border-soft);color:var(--muted);font-size:11.5px}
.profitability-ledger strong{color:var(--text);font-variant-numeric:tabular-nums}
.profitability-table{width:100%;min-width:560px;border-collapse:collapse;font-size:11.5px}
.profitability-table th,.profitability-table td{padding:8px 9px;border-bottom:1px solid var(--border-soft);text-align:right;white-space:nowrap}
.profitability-table th{color:var(--dim);font-size:9px;letter-spacing:.06em;text-transform:uppercase}
.profitability-table th:first-child,.profitability-table td:first-child{text-align:left}
.profitability-rule{margin:14px 0 0;padding:11px 13px;border-left:3px solid var(--amber);background:var(--amber-soft);color:var(--muted);font-size:12px;line-height:1.5}
.profitability-rule strong{color:var(--amber)}
.realized-diagnostics-card{margin-top:14px;padding:16px;border:1px solid var(--border);border-radius:11px;background:var(--panel-2)}
.realized-diagnostics-heading h3{margin:4px 0;font-size:16px}
.realized-diagnostics-heading p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.5}
.diagnostic-gaps{display:grid;gap:5px;margin-top:12px;padding:11px 13px;border:1px solid var(--amber-border);border-radius:8px;background:var(--amber-soft)}
.diagnostic-gaps strong{color:var(--amber);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.diagnostic-gaps span{color:var(--muted);font-size:11.5px;line-height:1.5}
.strategy-top { display: flex; justify-content: space-between; gap: 12px; }
.strategy-top h3 { font-size: 14px; margin: 0; }
.risk-chip { white-space: nowrap; padding: 4px 7px; border-radius: 999px; font-size: 8px; font-weight: 900; }
.risk-chip.defined { color: var(--green); background: var(--green-soft); }
.risk-chip.undefined { color: var(--red); background: var(--red-soft); }
.strategy-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 14px 0; }
.strategy-metrics div { background: var(--panel-2); padding: 10px; border-radius: 8px; }
.strategy-metrics span { display: block; color: var(--dim); font-size: 8px; margin-bottom: 4px; }
.strategy-metrics strong { font-size: 11px; }
.inr-equivalent { display: block; color: var(--amber); font-size: 12px; font-weight: 750; margin-top: 4px; }
.leg-list { display: grid; gap: 5px; margin-bottom: 13px; }
.leg-row { display: grid; grid-template-columns: 40px 1fr auto auto; gap: 9px; align-items: center; font-size: 9px; background: rgba(255,255,255,.018); padding: 7px 8px; border-radius: 6px; }
.leg-side { font-weight: 900; }
.leg-side.sell { color: var(--amber); }
.leg-side.buy { color: var(--cyan); }
.contract-symbol { white-space: nowrap; }
.contract-symbol.pe { color: var(--green); }
.contract-symbol.ce { color: var(--red); }
.liquidity { color: var(--muted); font-size: 9px; margin-bottom: 11px; }
.liquidity strong { color: var(--text); }
.assumption-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 15px; margin-top: 12px; }
.assumption-grid div { display: flex; flex-direction: column; gap: 5px; }
.assumption-grid strong { font-size: 10px; }
.assumption-grid span { color: var(--muted); font-size: 10px; line-height: 1.45; }

.summary-strip { display: grid; grid-template-columns: repeat(4,1fr); background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 12px; }
#demo-summary.summary-strip { grid-template-columns: repeat(5,1fr); }
.summary-strip > div { padding: 7px 12px; border-right: 1px solid var(--border); border-top: 2px solid var(--cyan); }
.summary-strip > div:last-child { border: 0; }
.summary-strip span { color: var(--muted); font-size: 9px; font-weight: 800; display: block; margin-bottom: 3px; letter-spacing: .07em; }
.summary-strip strong { font-size: 15px; font-weight: 850; }
.safe-text { color: var(--green); }
.paper-list { display: grid; gap: 9px; }
.paper-trade { display: grid; grid-template-columns: 1.3fr .8fr .8fr .8fr auto; gap: 12px; align-items: center; padding: 13px; background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 9px; }
.paper-trade h3 { margin: 0 0 4px; font-size: 12px; }
.paper-trade small { color: var(--muted); font-size: 9px; }
.paper-metric span { display: block; color: var(--dim); font-size: 10px; margin-bottom: 5px; }
.paper-metric strong { font-size: 15px; }
.positive-text { color: var(--green) !important; }
.negative-text { color: var(--red) !important; }
.warning-text { color: var(--amber) !important; }
.volatile-text { color: var(--purple) !important; }
.empty-state { padding: 45px 20px; text-align: center; color: var(--dim); font-size: 11px; }

.demo-setup { display: grid; grid-template-columns: auto 1fr; gap: 20px; max-width: 820px; margin: 30px auto; padding: 26px; }
.demo-setup h2 { margin: 6px 0 8px; font-size: 20px; }
.demo-setup p { color: var(--muted); font-size: 11px; line-height: 1.6; max-width: 660px; }
.setup-lock { width: 48px; height: 48px; display: grid; place-items: center; background: var(--cyan-soft); border: 1px solid var(--cyan-border); border-radius: 13px; font-size: 20px; }
.setup-steps { padding-left: 18px; margin: 17px 0; color: var(--muted); font-size: 11px; line-height: 1.9; }
.setup-steps strong { color: var(--text); }
.demo-status-banner { display: flex; justify-content: space-between; align-items: center; background: linear-gradient(90deg,var(--green-soft),transparent); border: 1px solid var(--green-border); padding: 14px 17px; border-radius: var(--radius); margin-bottom: 14px; }
.demo-status-banner > div:first-child { display: grid; grid-template-columns: auto auto; align-items: center; gap: 5px 9px; }
.demo-status-banner small { grid-column: 2; color: var(--muted); font-size: 9px; }
.compact-table { max-height: 310px; }
.compact-table th { text-align: center; }
.compact-table td { text-align: center; }
.compact-table th:first-child, .compact-table td:first-child { text-align: left; }
.demo-wallet-panel { max-width: 840px; margin-bottom: 15px; }
.wallet-inline-meta { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 14px; color: var(--muted); font-size: 12px; }
.wallet-inline-meta strong { color: var(--text); margin-left: 4px; }
.wallet-inline-meta .wallet-ledger-note { flex-basis: 100%; color: var(--muted); font-size: 11px; text-align: right; }
.seller-positions-panel { padding-bottom: 12px; }
.seller-positions-header { margin-bottom: 12px; }
.position-count-badge { color: var(--cyan); background: var(--cyan-soft); border: 1px solid var(--cyan-border); border-radius: 999px; padding: 6px 10px; font-size: 11px; font-weight: 800; }
.seller-position-guide { display: flex; flex-wrap: wrap; gap: 7px 18px; margin: 0 17px 12px; padding: 10px 12px; color: var(--muted); background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 8px; font-size: 11px; }
.seller-position-guide b { color: var(--text); }
.seller-position-scroll { max-height: none; overflow-x: hidden; }
.seller-position-table { width: 100%; min-width: 0; table-layout: fixed; }
.seller-position-table th { padding: 11px 5px; text-align: center; vertical-align: bottom; white-space: normal; font-size: 10.5px; line-height: 1.25; }
.position-sort { appearance: none; padding: 0; border: 0; color: inherit; background: transparent; font: inherit; font-weight: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; }
.position-sort span { margin-left: 2px; color: var(--cyan); }
.position-sort.active span { color: var(--amber); }
.seller-position-table td { min-width: 0; padding: 14px 5px; text-align: center; vertical-align: middle; font-size: 13.5px; font-weight: 650; transition: color .18s ease, background-color .32s ease; }
/* Auto-fit density steps: applied by app.js to keep every open position on
   screen without a page scroll, based on measured available height. Each
   step only shrinks padding/line-height, never past a readable text floor. */
.seller-position-scroll.density-compact .seller-position-table th { padding: 7px 4px; font-size: 9.5px; }
.seller-position-scroll.density-compact .seller-position-table td { padding: 8px 4px; font-size: 12px; }
.seller-position-scroll.density-dense .seller-position-table th { padding: 4px 3px; font-size: 9px; line-height: 1.1; }
.seller-position-scroll.density-dense .seller-position-table td { padding: 4px 3px; font-size: 11px; }
.seller-position-scroll.density-dense .seller-position-table small { font-size: 9px; }
.seller-position-table td:first-child { text-align: left; }
.seller-position-table th:nth-child(1), .seller-position-table td:nth-child(1) { width: 5%; }
.seller-position-table th:nth-child(2), .seller-position-table td:nth-child(2) { width: 4%; }
.seller-position-table th:nth-child(3), .seller-position-table td:nth-child(3) { width: 5%; }
.seller-position-table th:nth-child(4), .seller-position-table td:nth-child(4) { width: 6%; }
.seller-position-table th:nth-child(5), .seller-position-table td:nth-child(5) { width: 5%; }
.seller-position-table th:nth-child(6), .seller-position-table td:nth-child(6) { width: 5.5%; }
.seller-position-table th:nth-child(7), .seller-position-table td:nth-child(7) { width: 5.5%; }
.seller-position-table th:nth-child(8), .seller-position-table td:nth-child(8) { width: 6%; }
.seller-position-table th:nth-child(9), .seller-position-table td:nth-child(9) { width: 7%; }
.seller-position-table th:nth-child(10), .seller-position-table td:nth-child(10) { width: 5.5%; }
.seller-position-table th:nth-child(11), .seller-position-table td:nth-child(11) { width: 5.5%; }
.seller-position-table th:nth-child(12), .seller-position-table td:nth-child(12) { width: 7%; }
.seller-position-table th:nth-child(13), .seller-position-table td:nth-child(13) { width: 7%; }
.seller-position-table th:nth-child(14), .seller-position-table td:nth-child(14) { width: 7.5%; }
.seller-position-table th:nth-child(15), .seller-position-table td:nth-child(15) { width: 8%; }
.seller-position-table th:nth-child(16), .seller-position-table td:nth-child(16) { width: 8%; }
.payoff-panel { margin: 18px 0 4px; padding: 18px; background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 12px; }
.payoff-header { align-items:flex-start; margin-bottom:12px; }
.payoff-group-selector { margin-left:auto; }
.payoff-spot-chip { color:var(--muted); font-size:11px; font-weight:750; text-transform:uppercase; letter-spacing:.08em; }
.payoff-spot-chip strong { margin-left:5px; color:var(--amber); font-size:15px; }
.payoff-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:0 0 14px; }
.payoff-summary > div { min-width:0; padding:11px 13px; background:var(--panel); border:1px solid var(--border-soft); border-radius:8px; }
.payoff-summary span { display:block; margin-bottom:5px; color:var(--dim); font-size:9px; font-weight:850; letter-spacing:.11em; }
.payoff-summary strong { display:block; overflow:hidden; color:var(--text); font-size:17px; font-weight:850; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.payoff-summary > div:nth-child(1) strong { color:var(--green); }
.payoff-summary > div:nth-child(2) strong { color:var(--red); }
.payoff-chart { position:relative; width:100%; height:390px; overflow:hidden; background:var(--panel); border:1px solid var(--border-soft); border-radius:9px; }
.payoff-svg { width:100%; height:390px; display:block; touch-action:none; }
.payoff-profit-fill { fill:rgba(31,213,138,.34); }
.payoff-loss-fill { fill:rgba(255,75,105,.32); }
.payoff-line { fill:none; stroke:var(--cyan); stroke-width:2.4; vector-effect:non-scaling-stroke; }
.payoff-zero { stroke:#e2e8f0; stroke-width:2.5; vector-effect:non-scaling-stroke; }
.payoff-spot { stroke:var(--amber); stroke-width:1.4; stroke-dasharray:4 4; }
.payoff-be { stroke:var(--green); stroke-width:1; stroke-dasharray:3 5; }
.payoff-spot-label { fill:var(--amber); }
.payoff-be-label { fill:var(--green); }
.payoff-crosshair { stroke:#d9e4f2; stroke-width:1; stroke-dasharray:3 3; opacity:.8; }
.payoff-cursor-dot { fill:var(--cyan); stroke:#dff8ff; stroke-width:1.5; }
.payoff-capture { fill:transparent; cursor:crosshair; }
.payoff-tooltip { position:absolute; z-index:3; display:none; min-width:170px; padding:10px 12px; pointer-events:none; background:#111923; border:1px solid var(--border2); border-radius:8px; box-shadow:0 12px 32px rgba(0,0,0,.4); }
.payoff-tooltip strong,.payoff-tooltip span { display:block; }
.payoff-tooltip strong { margin-bottom:5px; color:var(--text); font-size:14px; }
.payoff-tooltip span { margin-top:3px; color:var(--muted); font-size:11px; }
.payoff-tooltip .positive-text,.payoff-tooltip .negative-text { margin:6px 0 3px; font-size:17px; font-weight:850; }
.seller-position-table small { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.3; white-space: normal; }
.seller-position-table .position-spread { font-size: 10.5px; font-weight: 850; }
.seller-position-table .exit-quote,
.seller-position-table .exit-pnl { font-size: 10px; font-weight: 750; }
.strategy-spread { display: block; margin-top: 4px; font-size: 10px; font-weight: 850; white-space: nowrap; }
.seller-position-table .contract-symbol { display: block; font-size: 14px; line-height: 1.25; white-space: normal; }
.instrument-symbol, .option-type { font-size: 15px; font-weight: 900; }
.instrument-symbol.ce, .option-type.ce { color: var(--red); }
.instrument-symbol.pe, .option-type.pe { color: var(--green); }
.seller-position-table .side-badge { font-size: 10px; }
.seller-position-table .seller-status { width: auto; max-width: 100%; margin: 0; padding: 5px 6px; font-size: 9px; white-space: normal; }
.position-greeks-panel { margin: 18px 0 4px; padding: 0; overflow: hidden; background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 12px; }
.position-greeks-header { padding: 15px 16px; margin: 0; border-bottom: 1px solid var(--border-soft); }
.position-greeks-scroll { overflow-x: auto; }
.position-greeks-table { width: auto; min-width: 0; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.position-greeks-table th { padding: 9px 7px; color: var(--muted); background: var(--panel); border-right: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); font-size: 9.5px; font-weight: 850; text-align: center; }
.position-greeks-table thead tr:first-child th:nth-child(n+7) { color: var(--cyan); font-size: 10.5px; }
.position-greeks-table td { padding: 10px 7px; border-right: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); font-size: 11.5px; font-weight: 700; text-align: center; white-space: nowrap; }
.position-greeks-table td:nth-child(2) { text-align: left; }
.position-greeks-table tr:last-child td { border-bottom: 0; }
.position-greeks-table .greeks-total-row td { color: var(--text); background: rgba(127, 90, 240, .12); border-top: 2px solid var(--purple); font-weight: 900; }
.seller-recommendation{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:12px 0;padding:11px 13px;border:1px solid currentColor;border-radius:8px;background:var(--panel-2)}
.seller-recommendation strong{font-size:12px;letter-spacing:.05em;white-space:nowrap}
.seller-recommendation span{color:var(--text);font-size:11.5px;line-height:1.45}
.risk-chip.unbounded{color:var(--red);border-color:rgba(255,82,99,.45);background:rgba(255,82,99,.08)}
.position-greeks-mobile { display: none; }
.greeks-reading-guide { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; padding: 13px 15px 5px; }
.greeks-reading-guide article { min-width: 0; padding: 12px; background: var(--panel); border: 1px solid var(--border-soft); border-radius: 8px; }
.greeks-reading-guide article > strong { display: block; margin-bottom: 7px; color: var(--purple); font-size: 11px; letter-spacing: .06em; }
.greek-sign { display: grid; grid-template-columns: 38px 1fr; gap: 8px; padding: 7px 0; color: var(--text); border-top: 1px solid var(--border-soft); font-size: 12px; line-height: 1.45; }
.greek-sign:first-of-type { border-top: 0; }
.greek-sign b { font-size: 12px; font-style: normal; }
.greek-sign em { color: var(--text); font-style: normal; }
.greek-sign.positive b { color: var(--green); }
.greek-sign.negative b { color: var(--red); }
.position-greeks-live-note { margin: 4px 15px 5px; padding: 12px 13px; color: var(--text); background: rgba(49, 199, 255, .05); border-left: 3px solid var(--cyan); font-size: 12px; line-height: 1.55; }
.position-greeks-note { padding: 8px 15px 14px; margin: 0; }
.loss-advisor-panel { margin: 14px 0 4px; overflow: hidden; background: var(--panel-2); border: 1px solid var(--border-soft); border-radius: 12px; }
.loss-advisor-header { padding: 15px 16px; margin: 0; border-bottom: 1px solid var(--border-soft); }
.loss-diagnosis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; padding: 13px 15px; }
.loss-diagnosis div { padding: 10px; background: var(--panel); border: 1px solid var(--border-soft); border-radius: 8px; }
.loss-diagnosis span { display: block; color: var(--muted); font-size: 9px; font-weight: 800; }
.loss-diagnosis strong { display: block; margin-top: 4px; font-size: 14px; }
.loss-exact-card { margin: 0 15px 12px; padding: 14px; background: var(--panel); border: 1px solid rgba(246,201,75,.55); border-radius: 9px; box-shadow: inset 0 3px 0 var(--amber); }
.loss-exact-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.loss-exact-title span { color: var(--amber); font-size: 9px; font-weight: 900; letter-spacing: .07em; }
.loss-exact-title h3 { margin: 5px 0 12px; font-size: 14px; }
.loss-exact-title > strong { font-size: 13px; text-align: right; }
.loss-action-table { width: 100%; min-width: 780px; border-collapse: collapse; }
.loss-action-table th { padding: 8px; color: var(--muted); border-bottom: 1px solid var(--border); font-size: 9px; text-align: left; }
.loss-action-table td { padding: 9px 8px; color: var(--text); border-bottom: 1px solid var(--border-soft); font-size: 11px; font-weight: 750; }
.loss-exact-card p { margin: 11px 0 0; color: var(--text); font-size: 11.5px; line-height: 1.55; }
.loss-before-after { margin: 0 15px 12px; overflow: hidden; border: 1px solid var(--border-soft); border-radius: 9px; }
.loss-before-after > div { display: grid; grid-template-columns: 1.15fr repeat(3,1fr); gap: 8px; align-items: center; padding: 9px 11px; border-bottom: 1px solid var(--border-soft); }
.loss-before-after > div:last-child { border-bottom: 0; }
.loss-before-after .loss-comparison-head { color: var(--cyan); background: var(--panel); font-size: 9px; }
.loss-before-after span { color: var(--muted); font-size: 10px; }
.loss-before-after b { font-size: 11px; }
.loss-advisor-rule { margin: 0 15px 14px; padding: 11px 12px; color: #f7e4a8; background: rgba(246,201,75,.06); border: 1px solid rgba(246,201,75,.3); border-radius: 8px; font-size: 11px; line-height: 1.5; }
.loss-advisor-empty { display: flex; flex-direction: column; gap: 5px; padding: 18px 16px; }
.loss-advisor-empty strong { font-size: 14px; }
.loss-advisor-empty span { color: var(--muted); font-size: 12px; }
.greeks-mobile-card { margin: 0 0 9px; padding: 11px; background: var(--panel); border: 1px solid var(--border-soft); border-radius: 9px; }
.greeks-mobile-card:last-child { margin-bottom: 0; }
.greeks-mobile-card.greeks-mobile-total { border-color: var(--purple); background: rgba(127, 90, 240, .12); }
.greeks-mobile-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.greeks-mobile-heading strong { font-size: 12px; }
.greeks-mobile-heading span { font-size: 10px; font-weight: 850; }
.greeks-mobile-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; color: var(--muted); font-size: 9px; }
.greeks-mobile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 9px; }
.greeks-mobile-grid div { min-width: 0; padding: 8px; background: var(--panel-2); border-radius: 6px; }
.greeks-mobile-grid span { display: block; color: var(--dim); font-size: 8px; font-weight: 800; letter-spacing: .05em; }
.greeks-mobile-grid strong { display: block; margin-top: 3px; font-size: 12px; overflow-wrap: anywhere; }
.metric-main { display: block; color: var(--text); font-size: 14px; font-weight: 850; white-space: nowrap; }
.side-badge { display: inline-block; margin-bottom: 6px; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.capture-meter { width: 100%; height: 5px; margin-top: 7px; overflow: hidden; background: var(--border-soft); border-radius: 999px; }
.capture-meter i { display: block; height: 100%; background: var(--cyan); border-radius: inherit; }
.capture-meter.good i { background: var(--green); }
.capture-meter.loss i { width: 100% !important; background: var(--red); opacity: .75; }
.moneyness-badge, .seller-status { display: inline-block; width: max-content; max-width: 155px; margin-bottom: 7px; padding: 4px 7px; border: 1px solid var(--border2); border-radius: 999px; font-size: 9px; font-weight: 850; letter-spacing: .04em; line-height: 1.25; }
.moneyness-badge.good, .seller-status.good { color: var(--green); background: var(--green-soft); border-color: var(--green-border); }
.moneyness-badge.warning, .seller-status.warning { color: var(--amber); background: var(--amber-soft); border-color: var(--amber-border); }
.moneyness-badge.danger, .seller-status.danger { color: var(--red); background: var(--red-soft); border-color: var(--red-border); }
.seller-status.hedge { color: var(--cyan); background: var(--cyan-soft); border-color: var(--cyan-border); }
.seller-status.neutral { color: var(--muted); }
.expiry-countdown { font-size: 16px; }
.seller-panel-note { margin: 11px 17px 2px; }
.positions-total-row td { padding-top: 13px; padding-bottom: 13px; background: var(--panel-2); border-top: 1px solid var(--border2); font-weight: 850; }
.positions-total-row td:first-child { color: var(--text); text-align: left; letter-spacing: .05em; }
.positions-total-row td:last-child { font-size: inherit; }
.realized-trades-panel { margin-top: 8px; padding-bottom: 8px; border-color: var(--cyan-border); display: flex; flex-direction: column; min-height: calc(100vh - 210px); }
.realized-trades-header { margin-bottom: 8px; }
.realized-summary { margin-bottom: 8px; border-color: var(--border-soft); box-shadow: none; }
.realized-summary strong { font-size: 20px; }
.realized-analysis-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 4px 2px 12px; }
.realized-analysis-bar p { max-width: 620px; margin: 0; color: var(--muted); font-size: 12px; text-align: right; }
.realized-mode-switch { display: inline-flex; flex: none; gap: 3px; padding: 3px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; }
.realized-mode { appearance: none; padding: 8px 12px; color: var(--muted); background: transparent; border: 0; border-radius: 6px; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.realized-mode:hover { color: var(--text); }
.realized-mode.active { color: var(--cyan); background: var(--cyan-soft); box-shadow: inset 0 0 0 1px var(--cyan-border); }
.realized-workspace { display: grid; gap: 14px; flex: 1; min-height: 505px; }
.realized-workspace[data-chart="on"] { grid-template-columns: minmax(500px,1.14fr) minmax(300px,1fr); }
.realized-workspace[data-chart="off"] { grid-template-columns: 1fr; }
.realized-table-card, .realized-pnl-card { min-width: 0; overflow: hidden; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
.realized-table-card { display: flex; flex-direction: column; }
.realized-card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid var(--border-soft); }
.realized-card-header strong { display: block; color: var(--text); font-size: 14px; }
.realized-card-header small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.realized-card-header > span { color: var(--cyan); border: 1px solid var(--cyan-border); border-radius: 999px; padding: 4px 7px; font-size: 9px; font-weight: 850; }
.realized-trades-scroll { flex: 1; max-height: 62vh; min-height: 390px; padding: 0 10px 10px; overflow: auto; }
.realized-workspace[data-chart="on"] .realized-trades-scroll { max-height: 58vh; min-height: 0; overflow-x: hidden; }
.realized-workspace[data-chart="on"] .realized-card-header { padding: 8px 10px; }
.realized-workspace[data-chart="on"] .realized-card-header small { display: none; }
.realized-trades-table { width: 100%; min-width: 1100px; table-layout: auto; }
.realized-trades-table[data-view="calendar"],
.realized-trades-table[data-view="expiry"] { min-width: 0; width: 100%; table-layout: fixed; }
.realized-trades-table[data-view="calendar"] th, .realized-trades-table[data-view="calendar"] td,
.realized-trades-table[data-view="expiry"] th, .realized-trades-table[data-view="expiry"] td { width: auto; padding: 6px 6px; text-align: right; font-size: 11.5px; white-space: normal; }
.realized-trades-table[data-view="calendar"] th:first-child, .realized-trades-table[data-view="calendar"] td:first-child,
.realized-trades-table[data-view="expiry"] th:first-child, .realized-trades-table[data-view="expiry"] td:first-child,
.realized-trades-table[data-view="expiry"] th:nth-child(2), .realized-trades-table[data-view="expiry"] td:nth-child(2) { text-align: left; }
.realized-trades-table th { text-align: left; font-size: 9px; letter-spacing: .04em; white-space: nowrap; padding: 9px 7px; }
.realized-trades-table td { text-align: left; font-size: 12.5px; white-space: nowrap; padding: 10px 7px; }
.realized-trades-table .close-liquidation { color: var(--red); font-weight: 850; }
.realized-trades-table .close-normal { color: var(--green); font-weight: 800; }
.realized-pnl-card { display: flex; flex-direction: column; }
.realized-pnl-legend { display: flex; gap: 10px; color: var(--muted); font-size: 9px; }
.realized-pnl-legend i { display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; }
.realized-pnl-legend i.profit { background: var(--green); }
.realized-pnl-legend i.loss { background: var(--red); }
.realized-calendar-card { margin-top: 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.realized-calendar-card #realized-calendar-heatmap { padding: 14px 15px; display: flex; flex-wrap: wrap; gap: 20px; }
.cal-month { min-width: 220px; }
.cal-month-label { font-size: 11.5px; font-weight: 800; color: var(--text); margin-bottom: 8px; }
.cal-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; margin-bottom: 3px; }
.cal-weekdays span { text-align: center; font-size: 8.5px; color: var(--muted); font-weight: 800; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-cell { aspect-ratio: 1; border-radius: 5px; background: var(--bg); border: 1px solid var(--border-soft); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2px; }
.cal-cell.cal-pad { visibility: hidden; }
.cal-day { font-size: 8.5px; color: var(--dim); }
.cal-val { font-size: 7.5px; font-weight: 800; color: var(--text); line-height: 1.1; text-align: center; }
.cal-cell.cal-pos .cal-day, .cal-cell.cal-neg .cal-day { color: rgba(10,14,23,.65); }
.cal-cell.cal-pos .cal-val, .cal-cell.cal-neg .cal-val { color: #0a0e17; }
.realized-pnl-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; padding: 12px 12px 4px; }
.realized-pnl-stats > div { padding: 9px 10px; background: var(--bg); border: 1px solid var(--border); border-radius: 7px; }
.realized-pnl-stats span { display: block; color: var(--dim); font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.realized-pnl-stats strong { display: block; margin-top: 4px; font-size: 15px; }
.realized-range-switch { display: flex; gap: 5px; padding: 9px 12px 0; }
.realized-range { appearance: none; padding: 5px 8px; color: var(--muted); background: var(--bg); border: 1px solid var(--border2); border-radius: 5px; font: inherit; font-size: 9px; font-weight: 800; cursor: pointer; }
.realized-range:hover { color: var(--text); }
.realized-range.active { color: #031119; background: var(--cyan); border-color: var(--cyan); }
.realized-pnl-chart { position: relative; flex: 1; min-height: 360px; margin: 4px 9px 0; overflow: hidden; }
.realized-pnl-svg { width: 100%; height: 100%; }
.realized-pnl-zero { stroke: var(--muted); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.realized-pnl-line { fill: none; stroke: var(--green); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.realized-pnl-point.profit { fill: var(--green); }
.realized-pnl-point.loss { fill: var(--red); }
.realized-pnl-vline { stroke: var(--cyan); stroke-width: 1; stroke-dasharray: 4,3; vector-effect: non-scaling-stroke; }
.realized-pnl-label { fill: var(--dim); font-size: 10px; }
.realized-pnl-tooltip { display: none; position: absolute; z-index: 5; pointer-events: none; min-width: 142px; padding: 8px 10px; color: var(--text); background: rgba(7,16,25,.97); border: 1px solid var(--border2); border-radius: 7px; box-shadow: var(--shadow); font-size: 10px; line-height: 1.5; }
.realized-pnl-tooltip b { display: block; margin-bottom: 2px; }
.realized-pnl-foot { padding: 9px 13px; color: var(--muted); border-top: 1px solid var(--border-soft); font-size: 9px; }
.realized-note { margin: 11px 2px 2px; }
.demo-activity { margin-top: 15px; }

.chart-wrap { height: 300px; background: var(--bg); border: 1px solid var(--border-soft); border-radius: 10px; overflow: hidden; }
.historical-inventory-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 15px; margin-bottom: 15px; }
.history-inventory-intro { grid-column: 1 / -1; display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 5px 2px 2px; }
.history-inventory-intro h2 { margin: 7px 0 0; font-size: 22px; }
.history-inventory-intro p { max-width: 650px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; text-align: right; }
.history-data-card { min-height: 205px; display: flex; flex-direction: column; justify-content: center; gap: 9px; padding: 20px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); }
.dataset-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dataset-heading > span { color: var(--dim); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.dataset-heading > b { flex: none; color: var(--cyan); background: var(--cyan-soft); border: 1px solid var(--cyan-border); border-radius: 999px; padding: 5px 8px; font-size: 9px; letter-spacing: .08em; }
.history-data-card > strong { font-size: 24px; }
.history-data-card h3 { margin: 0; color: var(--text); font-size: 14px; font-weight: 700; }
.history-data-card > small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.dataset-fields { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0; }
.dataset-fields span { color: var(--muted); background: var(--panel-2); border: 1px solid var(--border); border-radius: 6px; padding: 5px 7px; font-size: 11px; }
.spot-history-card { border-color: var(--green-border); }
.spot-history-card > strong { color: var(--green); }
.catalogue-card { border-color: var(--amber-border); }
.catalogue-card > strong { color: var(--amber); }
.option-download-card { border-color: var(--cyan-border); }
.option-download-card > strong { color: var(--cyan); }
.chain-snapshot-card { border-color: var(--green-border); }
.chain-snapshot-card > strong { color: var(--green); }
.chain-snapshot-card .dataset-heading > b { color: var(--green); background: var(--green-soft); border-color: var(--green-border); }
.history-scope-card { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,1fr); gap: 0; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.history-scope-card > div { display: flex; flex-direction: column; gap: 8px; min-height: 145px; padding: 18px; border-right: 1px solid var(--border); }
.history-scope-card > div:last-child { border-right: 0; }
.history-scope-card strong { font-size: 15px; }
.history-scope-card small { color: var(--muted); font-size: 12px; line-height: 1.5; }
.scope-status { width: max-content; border-radius: 999px; padding: 4px 7px; font-size: 9px; font-weight: 850; letter-spacing: .09em; }
.scope-status.available { color: var(--green); background: var(--green-soft); border: 1px solid var(--green-border); }
.scope-status.forward { color: var(--cyan); background: var(--cyan-soft); border: 1px solid var(--cyan-border); }
.scope-status.unavailable { color: var(--amber); background: var(--amber-soft); border: 1px solid var(--amber-border); }
.history-svg { width: 100%; height: 100%; }
.history-line { fill: none; stroke: var(--cyan); stroke-width: 2; }
.history-area { fill: url(#areaGradient); }
.chart-grid { stroke: rgba(148,180,169,.11); stroke-width: 1; }
.chart-label { fill: var(--dim); font-size: 9px; }

.premium-chart-panel { margin-top: 15px; }
.premium-chart-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; }
.premium-chart-summary span { display: block; color: var(--dim); font-size: 10px; letter-spacing: .09em; margin-bottom: 4px; }
.premium-chart-summary strong { font-size: 16px; }
.premium-chart-wrap { position: relative; height: 420px; }
.premium-chart-wrap.premium-candle-stage { background: #08131d; border: 1px solid #1d3042; border-radius: 8px; }
.premium-chart-svg { width: 100%; height: 100%; }
.premium-straddle-line { fill: none; stroke: var(--green); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.premium-straddle-area { fill: rgba(52,211,153,.10); stroke: none; }
.premium-ce-line { fill: none; stroke: #ff6b81; stroke-width: 1.15; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.premium-pe-line { fill: none; stroke: #3ee0a4; stroke-width: 1.15; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.premium-spot-line { fill: none; stroke: #f0b429; stroke-width: 1.25; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.premium-axis-label { fill: var(--text); font-size: 10px; font-weight: 700; }
.premium-live-tags { position: absolute; inset: 0 0 0 auto; width: 86px; pointer-events: none; }
.premium-tag { position: absolute; right: 2px; font-size: 10px; font-weight: 900; padding: 2px 5px; border-radius: 4px; white-space: nowrap; }
.premium-tag.ce { background: var(--red); color: #fff; }
.premium-tag.pe { background: var(--green); color: #001018; }
.premium-series { background: none; border: 0; padding: 0; cursor: pointer; opacity: .38; }
.premium-series.on { opacity: 1; }
.premium-candle-side-btn { background: none; border: 0; padding: 0; cursor: pointer; opacity: .38; margin-left: 4px; }
.premium-candle-side-btn.active { opacity: 1; }
.spot-key { color: #f0b429; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.premium-chart-vline { stroke: var(--cyan); stroke-width: 1.2; stroke-dasharray: 4,3; }
.premium-chart-tooltip { display: none; position: absolute; z-index: 5; pointer-events: none; background: rgba(11,16,32,.96); border: 1px solid var(--border2); border-radius: 8px; padding: 8px 10px; font-size: 11px; line-height: 1.5; min-width: 140px; box-shadow: var(--shadow); color: var(--text); }
.premium-chart-tooltip b { display: block; margin-bottom: 3px; }
.system-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin-bottom: 15px; }
.system-card { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 17px; }
.system-card span { color: var(--dim); font-size: 9px; display: block; }
.system-card strong { font-size: 16px; display: block; margin: 8px 0; }
.system-card small { color: var(--muted); font-size: 9px; word-break: break-word; }
.event-list { display: grid; gap: 7px; }
.event-row { display: grid; grid-template-columns: 145px 70px 1fr; gap: 10px; font-size: 9px; padding: 8px; border-bottom: 1px solid var(--border-soft); color: var(--muted); }
.event-row .error { color: var(--red); }

.skeleton-card { min-height: 180px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(100deg,var(--panel) 25%,var(--panel-2) 38%,var(--panel) 52%); background-size: 200% 100%; animation: shimmer 1.3s infinite; }
.skeleton-card.tall { min-height: 300px; }
@keyframes shimmer { to { background-position-x: -200%; } }

.modal-backdrop { position: fixed; inset: 0; z-index: 20; background: rgba(0,0,0,.72); backdrop-filter: blur(6px); display: grid; place-items: center; padding: 20px; }
.modal { width: min(480px,100%); max-height: 90vh; overflow: auto; position: relative; background: var(--bg); border: 1px solid var(--border2); border-radius: 16px; padding: 24px; box-shadow: 0 30px 100px rgba(0,0,0,.5); }
.modal h2 { margin: 6px 0 16px; font-size: 19px; }
.modal .field-label { margin-top: 13px; }
.modal-close { position: absolute; top: 12px; right: 12px; border: 0; background: transparent; color: var(--muted); font-size: 25px; cursor: pointer; }
.modal-warning { color: var(--amber); background: var(--amber-soft); border: 1px solid var(--amber-border); padding: 10px; border-radius: 8px; font-size: 9px; line-height: 1.5; margin: 15px 0; }
.modal-summary { background: var(--panel-2); border-radius: 9px; padding: 12px; font-size: 10px; color: var(--muted); }

/* Comfortable reading scale: keep all operational text legible without browser zoom. */
body { font-size: 16px; line-height: 1.48; }
.brand-title { font-size: 17px; }
.brand-subtitle,
.mode-label, .panel-kicker, .eyebrow,
.nav-item span,
.timestamp-block span,
.safety-badge,
.market-metrics span,
.workflow-step > span,
.field-label,
.control-stat span,
.legend,
th,
.risk-chip,
.strategy-metrics span,
.leg-row,
.liquidity,
.paper-trade small,
.paper-metric span,
.demo-status-banner small,
.chart-label,
.system-card span,
.system-card small,
.event-row,
.modal-warning { font-size: 11px; }

.mode-detail,
.sidebar-warning span,
.safety-banner p,
.market-metrics strong,
.workflow-step small,
.metric-list > div,
.panel-note, .table-footnote,
.lab-intro p,
.lab-context strong,
.strategy-metrics strong,
.assumption-grid strong,
.assumption-grid span,
.paper-metric strong,
.demo-setup p,
.setup-steps,
.modal-summary { font-size: 14px; }

.sidebar-warning strong,
.timestamp-block strong,
.button,
.global-alert,
.change,
.workflow-step strong,
.segment,
select, input, textarea,
td,
.paper-trade h3,
.empty-state { font-size: 14px; }

.mode-value { font-size: 16px; }
.safety-banner strong,
.control-stat strong { font-size: 21px; }
.strategy-top h3 { font-size: 18px; }
.system-card strong { font-size: 20px; }
.panel h2, .lab-intro h2 { font-size: 22px; }
.modal h2 { font-size: 22px; }
.demo-setup h2 { font-size: 23px; }
.topbar h1 { font-size: 31px; }
.market-price { font-size: 38px; }

.capital-metrics strong { font-size: 22px; }
.unit-breakdown strong { font-size: 15px; }
.wallet-inline-meta strong { color: var(--text); font-size: 15px; }
.demo-wallet-panel td { font-size: 15px; font-weight: 700; }
.history-data-card > strong { font-size: 28px; }
.history-data-card h3 { font-size: 16px; }
.history-data-card > small { font-size: 14px; }
.control-stat strong { font-size: 17px; }
.inr-reference strong { font-size: 19px; }
.topbar .topbar-title h1 { font-size: 20px; }
.topbar .timestamp-block strong { font-size: 11px; }
.topbar .timestamp-block small { font-size: 9px; }

.button { min-height: 40px; padding: 10px 16px; }
select, input, textarea { min-height: 40px; }
th { padding: 12px 9px; }
td { padding: 10px 9px; }

@media (max-width: 980px) {
  :root { --sidebar: 196px; }
  .workspace { padding: 24px 20px 50px; }
  #page-chain { margin-inline: -8px; }
  .topbar { grid-template-columns: 1fr auto; }
  .header-market-strip { grid-column: 1 / -1; grid-row: 2; }
  .market-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .strategy-grid, .two-column { grid-template-columns: 1fr; }
  .control-bar { flex-wrap: wrap; }
  .control-stat { margin-left: 0; }
  .builder-controls, .builder-controls-secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capital-metrics { grid-template-columns: repeat(2,1fr); }
  .seller-research-grid { grid-template-columns: 1fr; }
  .lab-intro { grid-template-columns: 1fr auto; }
  .lab-intro p { grid-column: 1 / -1; grid-row: 2; }
  .market-outlook-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .market-outlook-grid > div { border-bottom: 1px solid var(--border-soft); }
  .pcr-guide { flex-wrap: wrap; white-space: normal; justify-content: flex-start; }
  .historical-inventory-grid { grid-template-columns: 1fr; }
  .history-inventory-intro { align-items: start; flex-direction: column; }
  .history-inventory-intro p { text-align: left; }
  .history-scope-card { grid-template-columns: 1fr; }
  .history-scope-card > div { border-right: 0; border-bottom: 1px solid var(--border); }
  .history-scope-card > div:last-child { border-bottom: 0; }
}
@media (max-width: 720px) {
  .app-shell { display: block; }
  .sidebar { position: static; width: 100%; padding: 14px; }
  .brand-block, .sidebar-warning { display: none; }
  .nav-list { flex-direction: row; overflow-x: auto; }
  .nav-item { white-space: nowrap; }
  .workspace { padding: 18px 12px 40px; }
  #page-chain { margin-inline: 0; }
  .topbar { grid-template-columns: 1fr; align-items: flex-start; gap: 12px; }
  .header-market-strip { grid-column: 1; grid-row: auto; width: 100%; }
  .topbar-actions { justify-content: space-between; }
  .timestamp-block { display: none; }
  .market-grid, .system-grid { grid-template-columns: 1fr; }
  .summary-strip { grid-template-columns: repeat(2,1fr); }
  .summary-strip > div:nth-child(2) { border-right: 0; }
  #demo-summary.summary-strip { grid-template-columns: repeat(2,1fr); }
  .paper-trade { grid-template-columns: 1fr 1fr; }
  .paper-trade > div:first-child { grid-column: 1 / -1; }
  .assumption-grid { grid-template-columns: 1fr; }
  .seller-control-bar { align-items: stretch; flex-direction: column; }
  .lab-intro { display: flex; align-items: flex-start; flex-direction: column; gap: 7px; }
  .lab-intro h2 { white-space: normal; }
  .lab-context { text-align: left; }
  .market-outlook-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .chart-wrap.atm-iv-chart-wrap { height: 430px; overflow-x: auto; }
  .inr-reference { min-width: 0; text-align: left; }
  .builder-controls, .capital-metrics, .strategy-detail-grid, .seller-research-grid { grid-template-columns: 1fr; }
  .builder-controls-single { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rcf { grid-template-columns: 132px 1fr; }
  .builder-guidance { align-items: stretch; flex-direction: column; }
  .demo-wallet-panel { max-width: none; }
  .wallet-inline-meta { justify-content: flex-start; }
  .wallet-inline-meta .wallet-ledger-note { text-align: left; }
  .focus-title { flex-direction: column; }
}

.auth-page {min-height:100vh;display:grid;place-items:center;background:#080a0d;color:#e7edf5;padding:24px;}
.auth-panel {width:min(680px,100%);padding:32px;}
.auth-panel form {display:grid;gap:16px;margin:24px 0;}
.auth-panel label {display:grid;gap:8px;}
.auth-panel input {width:100%;padding:12px;background:#11151c;border:1px solid #39414e;color:#fff;border-radius:5px;}
.auth-panel a {color:#55cdf0;}
.users-panel {width:100%;max-width:none;padding:20px 22px;}
.users-panel h2 {margin:28px 0 6px;font-size:16px;}
.users-panel h2:first-of-type {margin-top:0;}
.create-user-strip {display:grid !important;grid-template-columns:minmax(170px,.55fr) minmax(220px,.75fr) auto;align-items:end;gap:12px !important;margin:18px 0 24px !important;}
.create-user-strip label {gap:6px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;}
.create-user-strip input {height:39px;padding:9px 11px;}
.create-user-strip button {height:39px;min-width:118px;}
.users-tabs {display:flex;gap:10px;margin:20px 0;border-bottom:1px solid var(--border-soft);padding-bottom:10px;flex-wrap:wrap;}
.users-tabs .active {border-color:var(--cyan);color:var(--cyan);}
.user-admin-panel {padding:20px;background:var(--panel-2);border:1px solid var(--border-soft);border-radius:10px;}
.user-admin-heading {margin-bottom:14px;}
.user-admin-heading h2 {margin:7px 0 5px;}
.user-reset-list {border-top:1px solid var(--border-soft);}
.tab-picker {border:1px solid #39414e;border-radius:6px;padding:12px 14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px 14px;}
.tab-picker legend {padding:0 6px;color:var(--muted);font-size:11px;letter-spacing:1px;text-transform:uppercase;}
.tab-picker-item {display:flex;align-items:center;gap:8px;font-size:13px;}
.tab-picker input[type="checkbox"] {width:16px;height:16px;padding:0;flex:0 0 16px;}
.access-matrix-heading {display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:10px;}
.access-matrix-heading h2 {margin:0 0 5px;}
.access-matrix {width:100%;min-width:420px;table-layout:fixed;}
.access-matrix th, .access-matrix td {padding:9px 14px;text-align:center;border-bottom:1px solid #232a36;white-space:nowrap;}
.access-matrix th:first-child, .access-matrix td:first-child {text-align:left;white-space:normal;}
.access-matrix th:first-child {width:46%;}
.access-matrix thead th {color:var(--muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;}
.access-user-state {display:block;margin-top:3px;font-size:9px;letter-spacing:.08em;}
.access-group-row td {padding:12px 14px 6px;border-bottom:0;color:var(--cyan);font-size:10px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;}
.access-matrix .access-matrix-active td {font-weight:700;}
.access-matrix input[type="checkbox"], .login-history-table input[type="checkbox"] {width:16px;height:16px;}
.access-matrix-actions {display:flex;align-items:center;gap:12px;margin-top:14px;}
.access-matrix-actions small {color:var(--muted);}
.reset-row {display:flex !important;flex-direction:row !important;align-items:center;gap:10px;margin:6px 0;}
.reset-row span {min-width:190px;color:var(--muted);font-size:13px;}
.reset-row span strong,.reset-row span small {display:block;}
.reset-row span strong {color:var(--text);font-size:14px;}
.reset-row span small {margin-top:3px;font-size:10px;}
.reset-row input {width:auto !important;flex:1;}
.login-history-table {min-width:520px;}
.login-history-table th, .login-history-table td {padding:8px 12px;text-align:left;border-bottom:1px solid #232a36;font-size:13px;}
.login-history-table thead th {color:var(--muted);font-weight:600;}

/* Releases page */
#releases-list {display:flex;flex-direction:column;gap:14px;margin-top:16px;}
.release-card {background:var(--panel-2);border:1px solid var(--border-soft);border-radius:10px;padding:16px 18px;}
.release-head {display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.release-head strong {font-size:16px;letter-spacing:-.01em;}
.release-badge {font-size:9px;font-weight:850;letter-spacing:.1em;color:var(--muted);border:1px solid var(--border-soft);border-radius:5px;padding:3px 8px;}
.release-badge-live {color:var(--green);border-color:var(--green-border);}
.release-date {margin-left:auto;color:var(--dim);font-size:11px;}
.release-features {display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px 16px;}
.release-feature strong {display:block;font-size:12.5px;margin-bottom:3px;}
.release-feature small {display:block;color:var(--muted);font-size:11.5px;line-height:1.5;}

/* Capital Management page */
.capital-investors-table {width:100%;min-width:760px;}
.capital-investors-table th, .capital-investors-table td {padding:9px 14px;text-align:left;border-bottom:1px solid #232a36;font-size:13px;white-space:nowrap;}
.capital-investors-table thead th {color:var(--muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;}
.capital-investors-table td:nth-child(1) {white-space:normal;}
.capital-allocation-grid {display:grid;grid-template-columns:1.2fr 1fr;gap:14px;margin:14px 0;}
.capital-split-bar {display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--bg);margin:14px 0 12px;}
.capital-split-bar i {display:block;height:100%;}
.capital-split-key {display:flex;flex-wrap:wrap;gap:8px 18px;}
.capital-split-key span {font-size:12px;}
.capital-split-empty {color:var(--dim);font-size:12px;}
.capital-audit-note {color:var(--muted);font-size:12.5px;line-height:1.6;margin-top:10px;}
.capital-form {display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;align-items:end;margin-top:16px;}
.capital-form input, .capital-form select {height:39px;padding:9px 11px;width:100%;}
.capital-form-actions {display:flex;align-items:center;gap:12px;grid-column:1 / -1;}
.zero-text {color:var(--muted);}
#capital-pnl-list {margin:14px 0 6px;}
.rcf .v.strong {font-weight:800;font-size:14px;}
@media (max-width: 860px) {
  .capital-allocation-grid {grid-template-columns:1fr;}
  .profitability-metrics,.realized-diagnostic-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profitability-grid{grid-template-columns:1fr}
}
.account-tabs {display:flex;gap:10px;margin:20px 0;flex-wrap:wrap;}
.account-tabs .active {border-color:#38bdf8;color:#38bdf8;}
.account-table-panel .table-scroll {max-height:70vh;}
.account-table-panel[data-account-panel="realized"] .table-scroll {max-height:none;}
.account-table-panel:not([data-account-panel="realized"]) table {width:100%;min-width:1150px;}
.realized-summary {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;}
.realized-summary strong {font-size:clamp(14px,1.4vw,22px);}
.timing-panel {margin:22px 0;padding:20px;}
.timing-controls {display:flex;gap:12px;margin:14px 0;}
.timing-panel .table-scroll {max-height:420px;}
.timing-panel td,.timing-panel th {white-space:nowrap;}
.timing-peaks {display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:4px 0 16px;}
.timing-peak {background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--border);border-radius:12px;padding:14px 16px;}
.timing-peak span {display:block;color:var(--dim);font-size:10px;font-weight:800;letter-spacing:.14em;}
.timing-peak strong {display:block;margin-top:6px;font-size:22px;font-weight:850;letter-spacing:.04em;text-shadow:0 0 22px rgba(251,191,36,.28);}
.timing-peak em {display:block;margin-top:4px;font-style:normal;font-size:28px;font-weight:850;font-variant-numeric:tabular-nums;}
.timing-peak small {display:block;margin-top:8px;color:var(--muted);font-size:12px;line-height:1.45;}
.timing-peak.ce {border-top:2px solid var(--red);}
.timing-peak.pe {border-top:2px solid var(--green);}
.timing-clock-wrap {min-width:0;}
.timing-clock {display:grid;grid-template-columns:44px repeat(24,minmax(0,1fr));gap:3px;align-items:stretch;}
.timing-clock-label {display:grid;place-items:center;font-size:11px;font-weight:850;color:var(--muted);}
.timing-clock-label.ce {color:var(--red);}
.timing-clock-label.pe {color:var(--green);}
.timing-hour {text-align:center;color:var(--dim);font-size:10px;font-weight:800;padding-bottom:4px;}
.timing-hour.expiry {color:var(--amber);}
.timing-hour.peak-hour {color:var(--amber);}
.timing-hour i {display:block;font-style:normal;font-size:8px;letter-spacing:.08em;}
button.timing-cell {appearance:none;-webkit-appearance:none;width:100%;}
.timing-cell {min-width:0;min-height:52px;border:1px solid transparent;border-radius:7px;padding:4px 2px;font-size:11px;font-weight:850;font-variant-numeric:tabular-nums;color:var(--text);cursor:pointer;background:var(--panel-2);}
.timing-cell.rise {color:var(--red);}
.timing-cell.blank {display:grid;place-items:center;color:var(--dim);background:rgba(255,255,255,.03);cursor:default;}
.timing-cell.peak {color:var(--amber);border:2px solid var(--amber);box-shadow:0 0 0 1px var(--amber),inset 0 0 0 1px rgba(251,191,36,.45),0 0 18px -4px var(--amber);z-index:1;}
.timing-cell.expiry {border-bottom:2px solid var(--amber);}
.timing-cell:hover {filter:brightness(1.08);}
.timing-legend {display:flex;flex-wrap:wrap;gap:10px 16px;margin:12px 0 0;color:var(--muted);font-size:12px;line-height:1.45;}
.timing-legend .fall {color:var(--green);}
.timing-legend .rise {color:var(--red);}
.timing-legend .peak {color:var(--amber);}
.timing-howto {margin:18px 0 8px;padding:16px 18px;background:var(--panel-2);border:1px solid var(--border);border-radius:12px;line-height:1.55;}
.timing-howto strong {display:block;margin-bottom:8px;letter-spacing:.08em;font-size:11px;color:var(--amber);}
.timing-howto ol {margin:0;padding-left:18px;color:var(--muted);}
.timing-howto li {margin:6px 0;}
.timing-limitations {margin:10px 0 0;padding-left:18px;color:var(--muted);line-height:1.55;}
.timing-limitations li {margin:8px 0;}
@media (max-width:900px) {
  .payoff-summary {grid-template-columns:repeat(2,minmax(0,1fr));}
  .payoff-chart,.payoff-svg {height:340px;}
  .create-user-strip {grid-template-columns:1fr;}
  .reset-row {align-items:stretch;flex-direction:column !important;}
  .reset-row span,.reset-row input {width:100% !important;}
  .timing-peaks {grid-template-columns:1fr;}
  .timing-clock-wrap {overflow-x:auto;}
  .timing-clock {min-width:980px;}
}
body[data-role="research"] [data-page="demo"],body[data-role="research"] [data-page="history"],body[data-role="research"] [data-page="login"],body[data-role="research"] [data-page="server"],body[data-role="research"] [data-page="shortcuts"],body[data-role="research"] [data-page="users"],body[data-role="research"] #page-demo,body[data-role="research"] #page-history,body[data-role="research"] #page-login,body[data-role="research"] #page-server,body[data-role="research"] #page-shortcuts,body[data-role="research"] #page-users,body[data-role="research"] .header-realized,body[data-role="research"] .header-pnl {display:none !important;}
.shortcut-sheet {margin:22px 0;max-width:720px;}
.shortcut-sheet .k {font-family:Consolas,ui-monospace,monospace;color:var(--cyan);}
@media(max-width:900px) {.realized-summary {grid-template-columns:repeat(3,minmax(0,1fr));}.topbar-actions {flex-wrap:wrap;}.auth-panel{padding:20px;}}
@media(max-width:850px) {.create-user-strip {grid-template-columns:1fr;align-items:stretch;}.create-user-strip button {width:max-content;}.access-matrix-actions {align-items:flex-start;flex-direction:column;}}
@media(max-width:1300px) {
  .realized-workspace[data-chart="on"] {grid-template-columns: minmax(410px,1.14fr) minmax(260px,1fr);}
  .realized-workspace[data-chart="off"] {grid-template-columns:1fr;}
  .realized-trades-scroll {min-height:0;max-height:62vh;}
}
@media(max-width:760px) {.realized-analysis-bar {align-items:flex-start;flex-direction:column;}.realized-analysis-bar p {text-align:left;}.realized-summary {grid-template-columns:repeat(2,minmax(0,1fr));}.realized-workspace {display:block;}.realized-pnl-card {margin-top:12px;}.realized-pnl-chart {min-height:285px;}}
@media(max-width:620px){.profitability-heading{display:block}.profitability-verdict{margin-top:12px;text-align:left}.profitability-metrics,.realized-diagnostic-metrics{grid-template-columns:1fr 1fr}.profitability-panel{padding:12px}.profitability-table{min-width:520px}}

.risk-group-panel {margin-bottom:16px;}
.risk-group-panel .summary-strip {margin:10px 0 16px;}
.risk-warning {display:flex;flex-direction:column;gap:4px;padding:14px 16px;margin:6px 0 16px;background:linear-gradient(90deg,var(--red-soft),transparent);border:1px solid var(--red-border);border-radius:var(--radius);}
.risk-warning strong {color:var(--red);font-size:12.5px;}
.risk-warning p {margin:0;color:var(--text);font-size:11.5px;line-height:1.5;}
.risk-ok {padding:12px 16px;margin:6px 0 16px;background:linear-gradient(90deg,var(--green-soft),transparent);border:1px solid var(--green-border);border-radius:var(--radius);font-size:12px;}
.risk-ok strong {color:var(--green);}
.risk-stress-table, .risk-hedge-table {width:100%;border-collapse:collapse;font-size:12.5px;}
.risk-stress-table th, .risk-hedge-table th {text-align:right;padding:8px 10px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border2);}
.risk-stress-table td, .risk-hedge-table td {text-align:right;padding:9px 10px;border-bottom:1px solid var(--border-soft);}
.risk-stress-table th:first-child, .risk-stress-table td:first-child,
.risk-hedge-table th:first-child, .risk-hedge-table td:first-child {text-align:left;}
.risk-now-row td:nth-child(2) {color:var(--amber);font-weight:900;}
.risk-hedge-table .call-key, .risk-hedge-table .put-key {padding:3px 7px;border-radius:5px;font-size:10px;font-weight:900;}
.risk-control-bar {align-items:center;flex-wrap:wrap;}
.risk-group-panel .risk-metric-row {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:10px 0 16px;align-items:stretch;}
.risk-group-panel .risk-metric-row > div {min-width:0;}
.risk-liq-text {font-size:13px;line-height:1.35;white-space:normal;}
.risk-stress-hedge-grid {display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.risk-box {border:1px solid var(--border2);border-radius:var(--radius);padding:14px 16px;background:var(--panel-2);min-width:0;}
.risk-box h3 {margin:6px 0 12px;font-size:13px;font-weight:650;color:var(--text);}
.risk-howto {margin-top:16px;padding:14px 16px;border:1px solid var(--border2);border-radius:var(--radius);background:var(--panel-2);}
.risk-howto strong {display:block;margin-bottom:8px;color:var(--amber);font-size:11px;letter-spacing:.08em;text-transform:uppercase;}
.risk-howto p {margin:0 0 8px;color:var(--muted);font-size:12.5px;line-height:1.5;}
.risk-howto p:last-child {margin-bottom:0;}
.risk-poi-chart {position:relative;height:370px;background:var(--bg);border:1px solid var(--border-soft);border-radius:10px;overflow:hidden;}
.risk-poi-chart svg {display:block;width:100%;height:100%;}
.risk-poi-hover {position:absolute;z-index:2;min-width:140px;padding:8px 10px;background:var(--panel);border:1px solid var(--border2);border-radius:8px;pointer-events:none;box-shadow:var(--shadow);}
.risk-poi-hover strong,.risk-poi-hover span {display:block;font-size:12px;line-height:1.4;}
.risk-poi-hover strong {color:var(--text);}
.risk-poi-hover span {color:var(--muted);}
.risk-poi-legs {flex-wrap:wrap;}
@media (max-width:1100px) {.risk-stress-hedge-grid {grid-template-columns:1fr;}.risk-group-panel .risk-metric-row {grid-template-columns:repeat(2,minmax(0,1fr));}}

/* v1.22 responsive shell: desktop remains unchanged; tablets and phones use
   the approved compact navigation and purpose-built mobile data layouts. */
.mobile-shell-bar,.mobile-bottom-nav,.chain-mobile{display:none}

@media (max-width:1024px){
  html,body{max-width:100%;overflow-x:hidden}
  body{padding-bottom:64px}
  .app-shell{display:block;min-width:0}
  .sidebar{position:sticky;inset:0 0 auto;width:100%;height:auto;min-height:0;padding:0;background:rgba(12,19,30,.97);backdrop-filter:blur(16px);border:0;border-bottom:1px solid var(--border);z-index:30}
  .brand-block,.sidebar>.live-pill,.sidebar-warning{display:none}
  .mobile-shell-bar{height:58px;padding:8px 12px;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px}
  .mobile-menu-button{width:44px;height:44px;border:1px solid var(--border2);border-radius:9px;background:var(--panel-2);color:var(--text);font-size:21px;cursor:pointer}
  .mobile-brand strong{display:block;color:var(--cyan);font-size:13px;letter-spacing:.06em}
  .mobile-brand small{display:block;margin-top:2px;color:var(--muted);font-size:9px;letter-spacing:.06em}
  .mobile-live{display:flex;align-items:center;gap:5px;color:var(--green);font-size:10px;font-weight:900}
  .nav-list{display:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:10px;border-top:1px solid var(--border-soft);max-height:calc(100vh - 58px);overflow:auto}
  .sidebar.mobile-open .nav-list{display:grid}
  .nav-item{min-height:44px;padding:9px 10px;font-size:12px;white-space:normal}
  .workspace{padding:16px 14px 76px;min-width:0}
  .topbar{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:12px}
  .header-market-strip{grid-column:1/-1;grid-row:2;display:flex;width:100%;gap:7px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;padding-bottom:2px}
  .header-market-strip::-webkit-scrollbar{display:none}
  .header-market-strip>div{flex:0 0 auto;min-width:106px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--panel-2)}
  .header-market-strip>div>span{font-size:8px;white-space:nowrap}
  .header-market-strip>div>strong{font-size:13px;white-space:nowrap}
  .topbar-actions{align-self:start}
  .icon-btn,.button,button.segment,select,input{min-height:44px}
  .mobile-bottom-nav{position:fixed;inset:auto 0 0;z-index:35;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:6px max(8px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:rgba(12,21,33,.96);backdrop-filter:blur(16px);border-top:1px solid var(--border)}
  .mobile-bottom-nav button{min-width:0;min-height:48px;padding:5px 4px;border:0;background:transparent;color:var(--muted);font-size:10px;font-weight:750;border-radius:8px;cursor:pointer}
  .mobile-bottom-nav button span{display:block;color:var(--dim);font-size:8px;letter-spacing:.08em}
  .mobile-bottom-nav button.active{color:var(--cyan);background:var(--cyan-soft)}
  .mobile-bottom-nav button.active span{color:var(--cyan)}
  #page-chain{margin-inline:0}
  .chain-control-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:8px}
  .chain-control-bar>.segmented,.chain-control-bar>.field-label{width:100%}
  .chain-control-bar .control-stat{padding:8px 9px;border:1px solid var(--border);border-radius:8px;background:var(--panel-2)}
  .chain-intel-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .chain-intel-grid .control-stat{min-width:0}
  .chain-scroll{display:none}
  .chain-mobile{display:block}
  .mobile-chain-heading,.mobile-chain-row{display:grid;grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr)}
  .mobile-chain-heading{padding:7px 0;color:var(--muted);font-size:9px;font-weight:850;letter-spacing:.08em}
  .mobile-chain-heading span:first-child{text-align:right}
  .mobile-chain-heading span:nth-child(2){text-align:center}
  .mobile-chain-row{width:100%;min-height:62px;padding:0;border:0;border-top:1px solid var(--border-soft);border-radius:0;background:transparent;color:var(--text);font:inherit;text-align:initial;cursor:pointer}
  .mobile-chain-side{min-width:0;padding:8px 10px}
  .mobile-chain-side.mobile-call{text-align:right;background:linear-gradient(90deg,transparent,rgba(248,113,113,.07))}
  .mobile-chain-side.mobile-put{text-align:left;background:linear-gradient(90deg,rgba(52,211,153,.07),transparent)}
  .mobile-chain-side>strong{display:block;font-size:14px;font-variant-numeric:tabular-nums}
  .mobile-chain-side>small{display:block;margin-top:3px;color:var(--muted);font-size:9px;white-space:nowrap}
  .mobile-chain-side>.mobile-chain-oi{color:var(--amber)}
  .mobile-chain-side.oi-zone{box-shadow:inset 0 -2px rgba(247,201,72,.42)}
  .mobile-chain-side.oi-maximum .mobile-chain-oi{color:var(--amber);font-weight:950}
  .mobile-chain-strike{display:grid;place-items:center;align-content:center;gap:2px;background:var(--panel-2);border-inline:1px solid var(--border);font-size:14px;font-weight:900}
  .mobile-chain-strike small{font-size:9px}
  .mobile-chain-row.atm-row .mobile-chain-strike{color:#fff;background:transparent;box-shadow:inset 0 0 0 1px var(--amber)}
  .mobile-chain-details{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin-top:8px;padding-top:7px;border-top:1px dashed var(--border2)}
  .mobile-chain-row.expanded .mobile-chain-details{display:grid}
  .mobile-chain-details span{min-width:0;color:var(--text);font-size:10px}
  .mobile-chain-details b{display:block;margin-bottom:2px;color:var(--dim);font-size:8px;text-transform:uppercase;letter-spacing:.06em}
  .chain-mobile[data-side="call"] .mobile-chain-heading,.chain-mobile[data-side="call"] .mobile-chain-row{grid-template-columns:minmax(0,1fr) 76px}
  .chain-mobile[data-side="call"] .mobile-put,.chain-mobile[data-side="call"] .mobile-chain-heading span:nth-child(3){display:none}
  .chain-mobile[data-side="put"] .mobile-chain-heading,.chain-mobile[data-side="put"] .mobile-chain-row{grid-template-columns:76px minmax(0,1fr)}
  .chain-mobile[data-side="put"] .mobile-call,.chain-mobile[data-side="put"] .mobile-chain-heading span:first-child{display:none}
  .chain-oi-histogram{height:240px;overflow-x:auto;touch-action:pan-x pan-y}
  .premium-chart-wrap,.payoff-chart{height:clamp(280px,48vh,380px);touch-action:pan-y}
  .panel-header,.payoff-header,.realized-card-header{flex-wrap:wrap}
  .greeks-reading-guide{grid-template-columns:repeat(2,minmax(0,1fr))}
  .legend{max-width:100%;overflow-x:auto;padding-bottom:3px}
  .capital-allocation-grid,.risk-stress-hedge-grid,.two-column,.strategy-grid{grid-template-columns:1fr}
  .modal{max-height:calc(100vh - 30px);padding:18px}
}

@media (max-width:720px){
  body{font-size:14px}
  .nav-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .workspace{padding:12px 10px 74px}
  .panel,.users-panel,.user-admin-panel,.timing-panel{padding:13px 11px}
  .topbar{align-items:start}
  .header-market-strip>div{min-width:92px;padding:7px 8px}
  .chain-control-bar{grid-template-columns:1fr 1fr}
  .chain-control-bar>.segmented:first-child{grid-column:1/-1}
  .chain-control-bar .control-stat{display:none}
  .chain-intel-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .chain-intel-grid .control-stat{padding:8px}
  .chain-intel-grid .control-stat strong{font-size:13px}
  .chain-intel-grid>.segmented{grid-column:span 2}
  .chain-panel{padding:7px}
  .mobile-chain-heading,.mobile-chain-row{grid-template-columns:minmax(0,1fr) 68px minmax(0,1fr)}
  .mobile-chain-side{padding:8px 5px}
  .mobile-chain-side>strong{font-size:13px}
  .mobile-chain-side>small{font-size:8.5px}
  .chain-notes-panel{padding:10px}
  .chain-walls-panel .panel-header,.premium-chart-panel .panel-header{display:block}
  .chain-walls-panel .legend,.premium-chart-panel .legend{margin-top:9px}
  .premium-chart-summary,.payoff-summary,.realized-summary,.capital-metrics,.summary-strip,#demo-summary.summary-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .premium-chart-summary{padding:9px}
  .premium-chart-summary strong{font-size:13px}
  .builder-controls,.builder-controls-secondary,.builder-controls-single,.risk-group-panel .risk-metric-row{grid-template-columns:1fr}
  .seller-position-scroll,.realized-trades-scroll,.account-table-panel .table-scroll{max-height:none!important;min-height:0!important;overflow:visible}
  .position-greeks-scroll{display:none!important}
  .position-greeks-mobile{display:block;padding:9px}
  .greeks-reading-guide{grid-template-columns:1fr;padding:9px}
  .position-greeks-header{padding:12px 10px}
  .position-greeks-note{padding:4px 10px 12px}
  .position-greeks-live-note{margin:4px 9px 5px}
  .loss-advisor-header{padding:12px 10px}
  .loss-diagnosis{grid-template-columns:repeat(2,minmax(0,1fr));padding:9px}
  .loss-exact-card,.loss-before-after,.loss-advisor-rule{margin-left:9px;margin-right:9px}
  .loss-exact-title{display:block}
  .loss-exact-title>strong{display:block;margin-bottom:9px;text-align:left}
  .loss-before-after>div{grid-template-columns:1fr 1fr}
  .loss-before-after .loss-comparison-head{display:none}
  .loss-before-after>div span{grid-column:1/-1;font-size:11px;font-weight:850}
  .loss-before-after>div b:nth-child(2)::before{content:"Current · ";color:var(--dim);font-size:8px}
  .loss-before-after>div b:nth-child(3)::before{content:"After · ";color:var(--dim);font-size:8px}
  .loss-before-after>div b:last-child{grid-column:1/-1}
  table.responsive-cards{display:block;width:100%!important;min-width:0!important;border:0}
  table.responsive-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  table.responsive-cards tbody,table.responsive-cards tr{display:block;width:100%}
  table.responsive-cards tbody tr{margin:0 0 10px;border:1px solid var(--border);border-radius:9px;overflow:hidden;background:var(--panel-2)}
  table.responsive-cards tbody tr:last-child{margin-bottom:0}
  table.responsive-cards td{display:flex!important;align-items:flex-start;justify-content:space-between;gap:14px;width:100%!important;min-height:38px;padding:8px 10px!important;border:0!important;border-bottom:1px solid var(--border-soft)!important;text-align:right!important;white-space:normal!important;font-size:12px!important}
  table.responsive-cards td:last-child{border-bottom:0!important}
  table.responsive-cards td::before{content:attr(data-mobile-label);flex:0 0 42%;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.06em;text-align:left;text-transform:uppercase}
  table.responsive-cards td[colspan]::before,table.responsive-cards td.loading-cell::before{display:none}
  table.responsive-cards td[colspan],table.responsive-cards td.loading-cell{display:block!important;text-align:center!important;padding:18px 10px!important}
  table.responsive-cards .positions-total-row{border-color:var(--cyan-border)}
  table.responsive-cards button{min-height:40px}
  .access-matrix-wrap,.users-panel>.table-scroll{overflow-x:auto;overscroll-behavior-inline:contain}
  .access-matrix{min-width:560px!important}
  .access-matrix th:first-child,.access-matrix td:first-child{position:sticky;left:0;z-index:2;background:var(--panel-2);box-shadow:1px 0 var(--border)}
  .access-matrix input[type="checkbox"]{width:22px;height:22px}
  .realized-analysis-bar,.timing-controls,.capital-form-actions{align-items:stretch;flex-direction:column}
  .realized-mode-switch,.account-tabs,.users-tabs,.segmented{max-width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .account-tabs .button,.users-tabs .button,.realized-mode{flex:0 0 auto;white-space:nowrap}
  .realized-workspace{display:block;min-height:0}
  .realized-pnl-card{margin-top:12px}
  .realized-calendar-card #realized-calendar-heatmap{overflow-x:auto;flex-wrap:nowrap}
  .capital-form{grid-template-columns:1fr}
  .capital-form-actions{grid-column:auto}
  .reset-row{align-items:stretch;flex-direction:column!important}
  .reset-row span,.reset-row input{width:100%!important}
  .payoff-chart,.payoff-svg,.premium-chart-wrap{height:300px}
  .timing-clock-wrap{overflow-x:auto;overscroll-behavior-inline:contain}
  .timing-clock{min-width:980px}
  .event-row{grid-template-columns:1fr;gap:4px}
  .release-date{width:100%;margin-left:0}
}