/* Board workspaces: every app page shares the landing board's grammar.
   One workspace head (Archivo title, lede, lead figure), one local-tab row,
   one column-head voice, one ledger row, one segmented control, one select.
   Loaded after every other stylesheet; it settles the cross-page contract. */

:root {
  --pane-x: clamp(16px, 2.5vw, 32px);
  --pane-y: 24px;
  --colhead: 500 .6875rem/1.4 var(--fontfam-term);
}

/* ---------- Browser surfaces ---------- */
::selection { background: var(--selection); color: var(--text); }
body:not(.is-home) :is(.main-layout, .trading-dialog) :is(input:not([type="checkbox"]):not([type="range"]), textarea, .form-input-wrapper, .sn-amount-control, .moc-price-input, .sl-amount-input, .moc-fund-amount input, .pf-workspace input:not([type="checkbox"]), .ad-form input, .ad-form textarea, .moc-field input, .sn-fields input, .sn-fields select) { border-radius: 4px; }
.btn, .btn.small-btn, .btn.ghost-btn, .btn.orders-icon-btn, .btn.aera-asset-action, .trading-book-zoom button, .orders-cancel-all-btn, .header-menu-toggle, .site-header #connect-wallet-btn, .ad-data-details > summary, .ad-badge, .ac-badge, .btn.wallet-choice, .btn.ledger-address-item { border-radius: 4px; }
.pane-count, .sn-on-the-run, .env-tag { border-radius: 3px; }
.market-statistics-popover, .sn-oracle-popover, .gateway-popover, .ad-data-popover, .pf-sync-popover { border-radius: 6px; border: 1px solid var(--rule-strong); background: var(--terminal-control); box-shadow: 0 24px 64px rgb(0 0 0 / .6); }

/* Selects across the app (and Trading dialogs, which sit outside .main-layout): one control, one chevron. */
body:not(.is-home) :is(.main-layout, .trading-dialog) select {
  appearance: none; -webkit-appearance: none; min-height: 44px; padding: 0 36px 0 12px; border: 1px solid var(--rule-strong); border-radius: 4px;
  background: var(--terminal-control) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23aab5af' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") right 12px center / 14px no-repeat;
  color: var(--text); font: 500 .875rem/1.4 var(--font-sans); cursor: pointer; transition: border-color 160ms ease-out;
}
body:not(.is-home) :is(.main-layout, .trading-dialog) select:hover:not(:disabled) { border-color: var(--rule-bright); }
body:not(.is-home) :is(.main-layout, .trading-dialog) select:focus-visible { border-color: var(--positive); outline: none; }
body:not(.is-home) :is(.main-layout, .trading-dialog) select:disabled { opacity: .55; cursor: not-allowed; }
body:not(.is-home) :is(.main-layout, .trading-dialog) select option { background: var(--terminal-control); color: var(--text); }
/* In-field controls: Max, Mid, Oracle and a field's currency select are quiet text controls inside the one field border. */
body:not(.is-home) .input-suffix-action,
body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select {
  height: 36px; min-height: 0; border: 1px solid transparent; border-radius: 3px; background-color: transparent;
  font: 500 .75rem/1 var(--font-sans); letter-spacing: .01em; cursor: pointer;
  transition: background-color 120ms ease-out, border-color 120ms ease-out, color 120ms ease-out;
}
body:not(.is-home) .input-suffix-action { min-width: 42px; padding: 0 10px; color: var(--text-soft); }
body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select { width: auto; min-width: 0; max-width: 112px; padding: 0 26px 0 10px; background-position: right 8px center; background-size: 12px; color: var(--text); }
body:not(.is-home) .input-suffix-action:hover:not(:disabled),
body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select:hover:not(:disabled) { border-color: transparent; background-color: var(--terminal-raised); color: var(--text); }
body:not(.is-home) .input-suffix-action:active:not(:disabled),
body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select:active:not(:disabled) { background-color: var(--rule); }
body:not(.is-home) .input-suffix-action:focus-visible,
body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select:focus-visible { border-color: var(--focus); outline: none; box-shadow: none; color: var(--text); }
body:not(.is-home) .input-suffix-action:disabled { opacity: .5; cursor: not-allowed; }
@media (max-width: 760px), (pointer: coarse) {
  body:not(.is-home) .input-suffix-action,
  body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select { height: 44px; }
}
}

/* Range: a hairline track and a mint thumb. */
body:not(.is-home) input[type="range"] { appearance: none; -webkit-appearance: none; width: 100%; height: 44px; margin: 0; background: transparent; accent-color: var(--positive); cursor: pointer; }
body:not(.is-home) input[type="range"]::-webkit-slider-runnable-track { height: 2px; background: var(--rule-strong); border-radius: 1px; }
body:not(.is-home) input[type="range"]::-moz-range-track { height: 2px; background: var(--rule-strong); border-radius: 1px; }
body:not(.is-home) input[type="range"]::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 16px; height: 16px; margin-top: -7px; border: 2px solid var(--ground); border-radius: 50%; background: var(--positive); box-shadow: 0 0 0 1px var(--positive); transition: transform 120ms ease-out; }
body:not(.is-home) input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border: 2px solid var(--ground); border-radius: 50%; background: var(--positive); box-shadow: 0 0 0 1px var(--positive); }
body:not(.is-home) input[type="range"]:hover::-webkit-slider-thumb { transform: scale(1.15); }
body:not(.is-home) input[type="range"]:focus-visible { outline: none; }
body:not(.is-home) input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--positive), 0 0 0 5px rgb(var(--positive-rgb) / .25); }
body:not(.is-home) input[type="range"]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 1px var(--positive), 0 0 0 5px rgb(var(--positive-rgb) / .25); }

/* Segmented mode controls: a recessed track, the current mode raised. */
:is(.ad-stake-modes, .moc-fund-modes, .sc-modes, .sr-scenarios, .br-fee-modes) { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 3px; padding: 3px; border: 1px solid var(--terminal-rule); border-radius: 4px; background: var(--terminal-inset); }
.ad-stake-modes { padding-bottom: 3px; margin-bottom: 24px; }
.moc-fund-modes { padding-bottom: 3px; margin-bottom: 24px; }
.sc-modes { margin-bottom: 20px; }
.sr-scenarios { margin: 12px 0; gap: 3px; }
:is(.ad-stake-modes, .moc-fund-modes, .sc-modes, .sr-scenarios, .br-fee-modes) .btn { min-height: 38px; margin: 0; padding: 6px 10px; border: 1px solid transparent; border-radius: 3px; background: transparent; color: var(--text-muted); font-weight: 500; }
:is(.ad-stake-modes, .moc-fund-modes, .sc-modes, .sr-scenarios, .br-fee-modes) .btn:hover:not(:disabled) { background: var(--terminal-control); color: var(--text); }
.ad-root :is(.ad-stake-modes, .sc-modes) .btn:is([aria-pressed="true"], [aria-current="page"]),
.moc-page .moc-fund-modes .btn[aria-current="page"],
.sn-page .sr-scenarios .btn[aria-current="true"],
.br-page .br-fee-modes .btn:has(input:checked) { background: var(--terminal-raised); border-color: var(--rule-strong); color: var(--text); }
.ad-root :is(.ad-stake-modes, .sc-modes) .btn:focus-visible, .moc-fund-modes .btn:focus-visible, .sr-scenarios .btn:focus-visible, .br-fee-modes .btn:has(input:focus-visible) { border-color: var(--focus); }
.sn-page .sr-scenarios .btn { min-height: 36px; font-family: var(--fontfam-term); font-size: .75rem; }

/* ---------- Shell ---------- */
/* The rail names the environment; the context bar keeps only the brand (shell.css). */

/* ---------- Shell: the notice tier ---------- */
.aera-governance-notice { min-height: 48px; padding: 6px var(--pane-x); }
.aera-governance-notice p { font-weight: 500; }
.aera-grant-notice {
  display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; grid-template-areas: "icon text action"; align-items: center; gap: 12px;
  min-height: 48px; padding: 6px var(--pane-x); border-bottom: 1px solid var(--terminal-rule); background: var(--ground-fill); color: var(--text);
}
.aera-grant-notice[hidden] { display: none; }
.aera-grant-icon { grid-area: icon; color: var(--positive); }
.aera-grant-notice p { grid-area: text; font-size: .8125rem; font-weight: 500; }
#aera-grant-open { grid-area: action; min-height: 34px; padding-inline: 14px; border-color: var(--rule-strong); color: var(--text); font-weight: 500; }
#aera-grant-open:hover:not(:disabled) { background: var(--terminal-control); border-color: var(--rule-bright); }
@media (max-width: 768px) {
  .aera-grant-notice { grid-template-columns: 20px minmax(0, 1fr); grid-template-areas: "icon text" ". action"; gap: 6px 8px; padding: 10px 12px 12px; }
  #aera-grant-open { justify-self: start; }
}

/* ---------- Workspace frame ---------- */
.main-layout.main-layout--page:has(.sn-page:not([hidden])) { gap: 0; padding: 0; }
.main-layout.main-layout--page > .page-shell > .panel { background: var(--ground-fill); }
.panel.ad-root, .panel.pf-workspace, .panel.sn-page { padding: 0; background: var(--ground-fill); border-radius: 0; }
.ad-root > * { max-width: none; }

/* Compact workspace head: MoC's inline title and subtitle, with optional figures. */
.aera-workspace-head {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 40px;
  min-height: 64px; padding: 10px var(--pane-x); margin: 0;
}
.aera-workspace-title { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 14px; min-width: 0; margin-right: auto; }
.aera-workspace-head h1, .aera-workspace-title h1, .page-shell .aera-workspace-head h1 {
  position: static; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip-path: none; white-space: nowrap;
  font-family: var(--font-display); font-stretch: 100%; font-weight: 650; font-size: 1.5rem; line-height: 1.2; letter-spacing: -.02em;
}
.aera-workspace-title > p {
  margin: 0; max-width: none; color: var(--text-muted); font: .75rem/1.5 var(--fontfam-term);
}
.sn-oracle-details > summary { gap: 14px; align-items: flex-end; }
.sn-oracle-quote { grid-template-columns: auto; justify-items: end; gap: 2px; text-align: right; }
.sn-oracle-label { grid-column: auto; gap: 6px; font: var(--colhead); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.sn-oracle-label > span { color: var(--text-muted); }
.sn-oracle-quote > strong { font-size: 2.25rem; line-height: 1; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.sn-oracle-quote .sn-oracle-state, .sn-oracle-quote .sn-pool-price-status { grid-column: auto; }
.sn-oracle-chevron { align-self: center; }

/* Local tabs: one row, one underline, one gutter. */
.sn-page .sn-side-nav, .ad-root .ad-nav {
  display: flex; flex-direction: row; gap: 4px; width: auto; margin: 0; padding: 0 var(--pane-x); border: 0; border-bottom: 1px solid var(--terminal-rule);
  background: transparent; overflow-x: auto; overflow-y: hidden; scrollbar-width: none;
}
.sn-page .sn-side-nav::-webkit-scrollbar, .ad-root .ad-nav::-webkit-scrollbar { display: none; }
.sn-page .sn-side-nav .aera-page-nav-link, .ad-root .ad-nav .aera-page-nav-link {
  flex: 0 0 auto; width: auto; min-width: 0; min-height: 48px; padding: 0 14px; border-radius: 4px 4px 0 0; gap: 8px; font-size: .8125rem; font-weight: 500; justify-content: center;
}
.aera-page-nav-link:is([aria-pressed="true"], [aria-current="page"])::after { left: 14px; right: 14px; bottom: -1px; }
.aera-page-nav-link:is(:hover, :focus-visible), .aera-page-nav-link:is([aria-pressed="true"], [aria-current="page"]):hover { background: var(--terminal-control); }
@media (max-width: 760px) {
  /* The strip scrolls; a fading right edge says so when a tab is cut off. */
  .sn-page .sn-side-nav, .ad-root .ad-nav { padding-right: 40px; overscroll-behavior-x: contain; -webkit-mask: linear-gradient(to right, #000 calc(100% - 40px), transparent); mask: linear-gradient(to right, #000 calc(100% - 40px), transparent); }
  .sn-page .sn-side-nav .aera-page-nav-link, .ad-root .ad-nav .aera-page-nav-link { flex: 0 0 auto; padding-inline: 12px; white-space: nowrap; }
  .moc-page .aera-page-nav-link span { white-space: nowrap; }
}

/* Workspace bodies share the gutter. */
.sn-workspace, .sn-page #sn-liquidations, .ad-root .ad-main, .pf-layout { padding-inline: var(--pane-x); }
.sn-workspace, .ad-root .ad-main, .pf-layout { padding-top: 28px; padding-bottom: 56px; }

/* ---------- Voices ---------- */
/* Column heads and stat labels speak in the board's mono tag voice. */
.main-layout:not(.main-layout--page) .orders-table thead th,
.main-layout:not(.main-layout--page) .orderbook-table th,
.main-layout:not(.main-layout--page) .orderbook-trades-head,
.trading-market-bar .market-stat-label,
.pf-columns, .moc-page th, .ad-root th, .sr-table th, .sr-band-table th, .sl-table th,
.ad-dao-columns h3 > span, .sn-catalog-label, #pf-count,
.sr-overview dt, .sr-personal dt, .moc-order-amounts dt, .ad-stake-summary dt, .ad-coverage-available > span, .sn-position-row h4, .ac-audit dt, .ad-reserve-metrics dt,
.moc-orders-toolbar, .sl-list-heading, .sl-filter > span, .ad-order-label, .moc-order-label {
  font: var(--colhead); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted);
}
.main-layout:not(.main-layout--page) .orders-table thead th { font: var(--colhead); letter-spacing: .06em; }
.main-layout:not(.main-layout--page) .orders-table .table-sort-btn { font: inherit; letter-spacing: inherit; text-transform: inherit; }
.main-layout:not(.main-layout--page) .orders-table th[aria-sort] .table-sort-btn { color: var(--text); }
.sl-table th span { text-transform: none; letter-spacing: 0; font-family: var(--font-sans); font-weight: 400; }
.sr-table th, .sl-table th, .ad-root th, .moc-page th { padding-top: 0; padding-bottom: 12px; border-bottom: 1px solid var(--rule-strong); }
.sr-positions-table thead th { padding-top: 0; }
.ad-root th { vertical-align: bottom; }
.trading-market-bar .market-stat-label { display: block; margin-bottom: 4px; }
.market-volume-label > span { text-transform: inherit; }
.main-layout:not(.main-layout--page) .orderbook-table .mid-label-cell { font: var(--colhead); letter-spacing: .06em; text-transform: uppercase; }

/* Order side reads as one tinted chip wherever orders are listed: Trading orders and fills, MoC orders. */
.side-chip { display: inline-flex; flex: none; align-items: center; justify-content: center; min-width: 44px; height: 22px; padding: 0 8px; border-radius: 3px; font: 600 .6875rem/1 var(--fontfam-term); letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.side-chip[data-side="buy"] { background: rgb(var(--positive-rgb) / .12); color: var(--positive); }
.side-chip[data-side="sell"] { background: rgb(var(--danger-soft-rgb) / .12); color: var(--danger-soft); }

/* Section titles share one scale. */
.main-layout:not(.main-layout--page) :is(.section-card-header h2, .section-card-header h3, .balances h2, .fills-card-header h3),
.moc-page h2:not(.moc-sr-only), .moc-reference h2, .moc-wallet-heading h2, .moc-section-heading h2, .moc-order-ticket-heading h3, .moc-fund-history h3, .moc-funds-ticket form h3,
.ad-main h2, .ad-reserves-layout h3, .ad-staking-manage .ad-form h3, .ac-audit .ad-heading h2, .sc-creation > h3, .ad-guided-intro h3, .ad-admin-advanced > h3, .ad-admin-heading h2,
.sn-page :is(.sn-section-heading h3, .sn-overview h3), #sn-balances-slot .ab-heading h2, .sn-page .sl-ticket h3, .sn-page .sl-heading h2, .sn-page .sr-personal h3, .sn-page .sr-section-heading h3, .sn-page .sr-analysis h3,
.pf-holdings-title h2, .pf-reference h2, .aera-balances .ab-heading h2 {
  margin: 0; font-family: var(--font-sans); font-size: 1rem; font-weight: 500; line-height: 1.4; letter-spacing: 0; color: var(--text);
}
.main-layout:not(.main-layout--page) :is(.section-card-header h2, .section-card-header h3, .balances h2, .fills-card-header h3) { font-size: .9375rem; }
.moc-page h3, .ad-main h3, .ad-main h4, .moc-order-ticket h4 { font-size: .875rem; font-weight: 500; }
.ad-main p, .moc-help, .sn-muted, .pf-muted, .pf-meta, .pf-footnote { font-size: .8125rem; line-height: 1.55; }

/* Ledger rows: label left, mono value right, hairline between. */
.ad-dao-ledger > div, .moc-metrics > div, .sn-page .series-detail-item, .sl-details dl > div, .sr-scenario-values > div, .trading-dialog-details > div, .market-statistics-popover dl > div { padding-block: 12px; border-bottom: 1px solid var(--terminal-rule); }
.ad-dao-ledger dt, .moc-metrics dt, .sn-page .series-detail-item dt, .sl-details dt, .sr-scenario-values dt { color: var(--text-soft); font-size: .8125rem; }
.ad-dao-ledger dd, .moc-metrics dd, .sn-page .series-detail-item dd, .sl-details dd, .sr-scenario-values dd { color: var(--text); font-family: var(--fontfam-term); font-size: .8125rem; font-variant-numeric: tabular-nums slashed-zero; }

/* Buttons in workspaces: one height, one outline. */
.sn-page .btn, .moc-page .btn, .ad-root .btn, .pf-workspace .btn { min-height: 44px; padding-inline: 16px; font-weight: 500; }
.sn-page .btn.small-btn, .ad-root .btn.small-btn { padding-inline: 14px; }
.pf-actions .btn { padding-inline: 12px; }
.btn.ghost-btn { border-color: var(--rule-strong); color: var(--text-soft); }
.btn.ghost-btn:hover:not(:disabled) { background: var(--terminal-control); border-color: var(--rule-bright); color: var(--text); }
.btn:not(.primary-btn):not(.danger-btn):not(.ad-primary):not(.moc-primary):not(.pf-primary):not(.br-primary):not(.lb-btn):hover:not(:disabled) { background: var(--terminal-control); border-color: var(--rule-bright); }

/* ---------- Trading ---------- */
/* The market bar is a board row: name, then the last price at display scale, then its context. */
.trading-market-bar { padding: 12px var(--pane-x) 14px; }
@media (min-width: 1280px) {
  .trading-market-bar { grid-template-columns: minmax(200px, auto) minmax(0, var(--market-stats-width, 760px)) auto; align-items: center; gap: 0 40px; padding: 8px var(--pane-x); }
  .trading-market-bar .market-stats, .trading-market-bar .market-stats.has-note-market { grid-template-columns: max-content max-content 1.3fr 1.1fr 1.1fr; gap: 0 32px; align-items: end; }
  .trading-market-bar .market-stats.has-note-market { grid-template-columns: max-content max-content minmax(0, .8fr) minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: 0 20px; }
  .trading-market-bar .market-stat { min-height: 0; justify-content: flex-end; gap: 4px; }
  .trading-market-bar .market-stat-value { font-size: .875rem; line-height: 1.4; }
  .trading-market-bar #market-stats .market-stat:first-child .market-stat-value { font-family: var(--fontfam-term); font-stretch: 100%; font-size: .875rem; font-weight: 700; line-height: 1.4; letter-spacing: 0; color: var(--text); }
  .trading-market-bar .market-stat-label { line-height: 1.2; margin-bottom: 0; }
}
.trading-market-bar h1, .trading-market-bar #market-title { font-family: var(--font-display); font-stretch: 100%; font-weight: 650; font-size: 1.5rem; letter-spacing: -.02em; line-height: 1.2; }
.trading-market-bar #market-title:hover { color: var(--positive-soft); }
.trading-market-bar .panel-subtitle { font-family: var(--fontfam-term); font-size: .75rem; color: var(--text-muted); }
.trading-market-bar .market-stat-value { font-family: var(--fontfam-term); font-variant-numeric: tabular-nums slashed-zero; }
.trading-tape { height: 40px; border-top: 1px solid var(--terminal-rule); }
.market-statistics-disclosure > summary { font: var(--colhead); letter-spacing: .06em; text-transform: uppercase; }
.market-header-status { font: 400 .6875rem/16px var(--fontfam-term); }

/* Pane headers: 48px rows with a hairline beneath, the same in every pane. */
.main-layout:not(.main-layout--page) .orderbook-card-header,
.main-layout:not(.main-layout--page) .order-form-header,
.main-layout:not(.main-layout--page) .orders-main-header,
.main-layout:not(.main-layout--page) .fills-card-header,
.main-layout:not(.main-layout--page) .balances .ab-heading { min-height: 44px; margin: 0 0 12px; padding-bottom: 0; border-bottom: 1px solid var(--terminal-rule); align-items: center; }
.main-layout:not(.main-layout--page) .orderbook-card-header { margin-bottom: 4px; }
.trading-book-tabs { gap: 4px; }
.trading-book-tab { position: relative; min-height: 44px; padding: 0 12px; border: 0; border-radius: 4px 4px 0 0; color: var(--text-soft); font-size: .8125rem; font-weight: 500; }
.trading-book-tab::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; background: transparent; transition: background-color 160ms ease-out; }
.trading-book-tab:hover { background: var(--terminal-control); color: var(--text); }
.trading-book-tab[aria-pressed="true"] { color: var(--text); border-bottom-color: transparent; }
.trading-book-tab[aria-pressed="true"]::after { background: var(--positive); }
.trading-book-tab:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.main-layout:not(.main-layout--page) .orderbook-panel { padding: 4px 16px 24px; }
.main-layout:not(.main-layout--page) .order-form { padding: 4px 20px 20px; }
.main-layout:not(.main-layout--page) .order-form-header { margin-bottom: 16px; }
.main-layout:not(.main-layout--page) > .orders-panel { padding: 4px 20px 24px; }
.main-layout:not(.main-layout--page) .balances { padding: 4px 20px 20px; }
.main-layout:not(.main-layout--page) .balances .ab-heading { margin-bottom: 8px; }
.main-layout:not(.main-layout--page) .balances .ab-caption { min-height: 0; margin-bottom: 4px; }
.main-layout:not(.main-layout--page) .balances .ab-row { padding: 12px 0; }
.main-layout:not(.main-layout--page) .balances .ab-amount { font-size: 1rem; }
.main-layout:not(.main-layout--page) .fills-panel { margin-top: 24px; padding-top: 0; border-top: 0; }
.trade-chart-panel { padding: 4px 20px 12px; }
.main-layout:not(.main-layout--page) .orderbook-table th { padding: 10px 4px 10px; border-bottom: 1px solid var(--rule-strong); letter-spacing: 0; }
.main-layout:not(.main-layout--page) .orderbook-trades-head { letter-spacing: 0; }
.main-layout:not(.main-layout--page) .orderbook-table .mid-row td { height: 34px; padding-block: 0; background: var(--terminal-control); }
.main-layout:not(.main-layout--page) .orderbook-table .mid-price-cell { font-family: var(--fontfam-term); font-stretch: 100%; font-weight: 700; font-size: .9375rem; letter-spacing: 0; }
.trading-book-scale { min-height: 28px; margin: 0 0 2px; }
.main-layout:not(.main-layout--page) .trading-book-scale-copy { display: flex; align-items: center; min-height: 28px; }
.main-layout:not(.main-layout--page) .orderbook-table :is(.bid-row, .ask-row) td { height: 24px; padding: 0 4px; font-size: .75rem; line-height: 1.3; }
.main-layout:not(.main-layout--page) .orderbook-table td { padding-block: 0; }
.main-layout:not(.main-layout--page) .trading-price { padding: 0; }
.main-layout:not(.main-layout--page) .orderbook-table th { padding: 6px 4px 8px; }
.main-layout:not(.main-layout--page) .trading-depth-help { min-height: 0; margin: 0 0 4px; }
#orderbook-step-label { font: var(--colhead); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
#orderbook-step { color: var(--text); text-transform: none; }
/* Trades rows read like order book levels: 24px rows, 12px mono figures, one head rule and no rules between rows. */
.main-layout:not(.main-layout--page) .orderbook-trades-head { padding: 6px 4px 8px; border-bottom: 1px solid var(--rule-strong); }
.main-layout:not(.main-layout--page) button.trade-row { min-height: 24px; padding: 0 4px; border-bottom: 0; font-family: var(--fontfam-term); line-height: 1.3; }
.main-layout:not(.main-layout--page) :is(.trade-time, .trade-price, .trade-apr, .trade-amount) { font-size: .75rem; line-height: 1.3; font-variant-numeric: tabular-nums slashed-zero; }
.main-layout:not(.main-layout--page) .trade-price { font-weight: 500; }
.main-layout:not(.main-layout--page) .trade-amount { color: var(--text); }
.main-layout:not(.main-layout--page) .trade-time { color: var(--text-muted); }
.trading-book-zoom button { width: 28px; height: 28px; border-color: var(--rule-strong); }
@media (max-width: 760px), (pointer: coarse) { .trading-book-zoom button { width: 40px; height: 40px; } }
.main-layout:not(.main-layout--page) .orders-table thead th { padding-bottom: 10px; border-bottom: 1px solid var(--rule-strong); }
.main-layout:not(.main-layout--page) #side-toggle { margin-bottom: 20px; border-radius: 4px; }
.main-layout:not(.main-layout--page) #side-toggle .toggle-btn { min-height: 40px; border-radius: 3px; font-size: .8125rem; letter-spacing: .01em; }
:is(.main-layout:not(.main-layout--page) .order-form, .trading-dialog .replace-fields) .form-row > label { font-size: .8125rem; color: var(--text-soft); }
:is(.main-layout:not(.main-layout--page) .order-form, .trading-dialog .replace-fields) .form-row input:not([type="checkbox"]) { font-family: var(--fontfam-term); font-variant-numeric: tabular-nums slashed-zero; }
:is(.main-layout:not(.main-layout--page), .trading-dialog) :is(.order-max-btn, .order-mid-btn) { border-radius: 3px; font-weight: 500; }
:is(.main-layout:not(.main-layout--page), .trading-dialog) :is(.order-max-btn, .order-mid-btn):hover:not(:disabled) { background: var(--terminal-raised); }
.main-layout:not(.main-layout--page) .order-estimates .form-row { padding: 8px 0; border-bottom: 1px solid var(--terminal-rule); color: var(--text-soft); }
.main-layout:not(.main-layout--page) .order-estimates .form-row:last-child { border-bottom: 0; }
.main-layout:not(.main-layout--page) .order-estimate-value { color: var(--text); font-family: var(--fontfam-term); font-variant-numeric: tabular-nums; }
.main-layout:not(.main-layout--page) #submit-order-btn { min-height: 48px; border-radius: 4px; font-size: .9375rem; font-weight: 600; }
.main-layout:not(.main-layout--page) #submit-order-btn:hover:not(:disabled) { filter: none; background: var(--positive-soft); }
.main-layout:not(.main-layout--page) #submit-order-btn[data-side="sell"]:hover:not(:disabled) { background: #ffa0ab; }
.trading-order-settings > summary { min-height: 44px; padding: 0; font-weight: 500; }
.pane-count { background: transparent; border: 1px solid var(--rule-strong); color: var(--text-soft); }
.orders-cancel-all-btn { min-height: 36px; }
.main-layout:not(.main-layout--page) .orders-cancel-all-btn { min-height: 36px; padding: 6px 12px; border-radius: 4px; }
@media (max-width: 768px) {
  .mobile-trading-nav { padding: 0 var(--pane-x); }
  .mobile-trading-nav button { font: var(--colhead); letter-spacing: .06em; text-transform: uppercase; min-height: 44px; color: var(--text-soft); }
}
@media (max-width: 760px) {
  .main-layout:not(.main-layout--page) { gap: 0; padding: 0; background: var(--terminal-rule); }
  .main-layout:not(.main-layout--page) > * { background: var(--ground-fill); }
  .main-layout:not(.main-layout--page) > :is(.market-stack, .trade-panel, .orders-panel, .trade-chart-panel) { margin: 1px 0 0; }
  .trading-market-bar { padding: 16px var(--pane-x); }
  .trading-market-bar h1, .trading-market-bar #market-title { font-size: 1.25rem; }
  .trading-market-bar #market-stats .market-stat:first-child .market-stat-value { font-family: var(--fontfam-term); font-stretch: 100%; font-size: .875rem; font-weight: 700; line-height: 1.4; letter-spacing: 0; }
  .main-layout:not(.main-layout--page) .order-form { padding-inline: var(--pane-x); }
  .main-layout:not(.main-layout--page) > .orders-panel { padding-inline: var(--pane-x); }
  .main-layout:not(.main-layout--page) .orderbook-panel { padding-inline: var(--pane-x); }
  .main-layout:not(.main-layout--page) .balances { padding-inline: var(--pane-x); }
  .trade-chart-panel { padding-inline: var(--pane-x); }
}

/* ---------- Series Notes ---------- */
/* seriesNotes.css loads after this file and owns the Series page: term rail, balance sheet, gauge, lifecycle. */
/* Positions & risk */
.sr-overview { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 24px; margin: 0 0 20px; padding: 0 0 20px; }
.sr-overview dd { margin-top: 6px; font-family: var(--font-display); font-stretch: 72%; font-weight: 600; font-size: 1.5rem; line-height: 1.1; letter-spacing: -.005em; font-feature-settings: "tnum" 1, "lnum" 1; }
.sr-workspace { gap: 0; }
.main-layout--page #series-notes-page.sn-page .sr-primary { padding: 0 32px 0 0; }
.main-layout--page #series-notes-page.sn-page .sr-analysis { padding: 0 0 0 32px; border-left: 1px solid var(--terminal-rule); border-radius: 0; }
.sr-analysis > summary { min-height: 44px; padding-block: 0 12px; font-weight: 500; color: var(--text); }
.sr-analysis[open] > summary { border-bottom-color: var(--terminal-rule); }
.sr-personal { padding-bottom: 20px; }
.sr-personal dd { font-size: .9375rem; }
.sr-own-row { background: var(--terminal-selected); box-shadow: inset 2px 0 0 var(--positive); }
.sr-borrower { border-color: var(--rule-strong); }
@media (max-width: 1250px) { .main-layout--page #series-notes-page.sn-page .sr-primary { padding-right: 0; } .main-layout--page #series-notes-page.sn-page .sr-analysis { padding-left: 0; border-left: 0; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--terminal-rule); } }
@container series-risk (max-width: 979px) { .main-layout--page #series-notes-page.sn-page .sr-primary { padding-right: 0; } .main-layout--page #series-notes-page.sn-page .sr-analysis { padding-left: 0; border-left: 0; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--terminal-rule); } }
@container series-risk (max-width: 700px) { .sr-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sr-overview dd { font-size: 1.25rem; } }
/* Liquidations */
.sn-page #sn-liquidations { padding-top: 28px; padding-bottom: 56px; }
.sl-heading { align-items: flex-end; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--terminal-rule); }
.sn-page .sl-heading h2 { font-family: var(--font-display); font-stretch: 100%; font-weight: 650; font-size: 1.75rem; line-height: 1.1; letter-spacing: -.015em; }
.sl-heading p { color: var(--text-soft); }
.sl-filter { gap: 6px; }
.sl-list-heading { min-height: 24px; }
#sl-freshness { font-family: var(--font-sans); text-transform: none; letter-spacing: 0; }
.main-layout--page #series-notes-page.sn-page .sl-ticket { padding: 0 0 0 32px; border-left: 1px solid var(--terminal-rule); border-radius: 0; background: transparent; }
.sl-preview strong { font-family: var(--font-display); font-stretch: 72%; font-weight: 600; font-size: 1.75rem; line-height: 1.1; letter-spacing: -.005em; font-feature-settings: "tnum" 1, "lnum" 1; }
#sl-empty { padding: 48px 0; }
@media (max-width: 1000px) { .main-layout--page #series-notes-page.sn-page .sl-ticket { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--terminal-rule); max-width: none; } }

/* ---------- Portfolio ---------- */
/* portfolio.css loads after this file and owns the Portfolio statement. */

/* ---------- Aera DAO ---------- */
/* dao.css loads after this file and owns the DAO page: head figure, board rows, instruments, panes. */

/* ---------- Mobile ---------- */
@media (max-width: 760px) {
  .aera-workspace-head { padding-block: 14px; gap: 12px 24px; }
  .aera-workspace-head h1, .aera-workspace-title h1, .page-shell .aera-workspace-head h1 { font-size: 1.25rem; }
  .sn-workspace, .ad-root .ad-main, .pf-layout, .sn-page #sn-liquidations { padding-top: 20px; padding-bottom: 40px; }
}
@media (max-width: 440px) {
  .sr-overview dd { font-size: 1.125rem; }
}
@media (prefers-reduced-motion: reduce) {
  body:not(.is-home) input[type="range"]::-webkit-slider-thumb, .trading-book-tab::after, .moc-order-row, .ad-root .ad-proposal-row, body:not(.is-home) :is(.main-layout, .trading-dialog) select, body:not(.is-home) .input-suffix-action, body:not(.is-home) :is(.main-layout, .trading-dialog) select.input-suffix-select { transition: none; }
}

/* ---------- Trading market bar — calm (2026-10-01) ----------
   The market's identity, its server statistics and the Daily stats disclosure, in the landing's calm voice:
   interface-type labels over mono figures on one even rhythm, a hairline before the actions, and nothing
   truncated at common widths. Scoped by ID so it outranks the older layered rules (trading.css, terminal.css
   and above) without touching the MoC bar. Every statistic stays the same size; Last is bolder, not larger. */
#trading-market-bar #market-title { font: 650 1.25rem/1.2 var(--font-display); font-stretch: 92%; letter-spacing: -.01em; }
#trading-market-bar .panel-subtitle { color: var(--text-muted); font: 400 .75rem/1.2 var(--fontfam-term); }
#trading-market-bar .market-panel-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
/* The market's contract as one small outlined control beside the title: a label, then Copy and Explorer.
   The address is not printed; each control names it in its tooltip. */
.contract-actions { display: inline-flex; align-items: stretch; height: 30px; border: 1px solid var(--rule-strong); border-radius: 4px; vertical-align: middle; transition: border-color 160ms ease-out; }
.contract-actions:hover, .contract-actions:focus-within { border-color: var(--rule-bright); }
.contract-actions__label { display: flex; align-items: center; padding: 0 10px; color: var(--text-muted); font: 500 .6875rem/1 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.contract-actions__btn { position: relative; display: grid; place-items: center; width: 32px; margin: 0; padding: 0; border: 0; border-left: 1px solid var(--rule-strong); border-radius: 0; background: transparent; color: var(--text-soft); cursor: pointer; text-decoration: none; transition: background-color 160ms ease-out, color 160ms ease-out; }
.contract-actions__btn:last-of-type { border-radius: 0 3px 3px 0; }
.contract-actions__btn:hover { background: var(--terminal-control); color: var(--text); text-decoration: none; }
.contract-actions__btn:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.contract-actions__btn svg { width: 15px; height: 15px; }
.contract-actions__done { display: none; }
.contract-actions__btn[data-copied="true"] { color: var(--positive); }
.contract-actions__btn[data-copied="true"] .contract-actions__icon { display: none; }
.contract-actions__btn[data-copied="true"] .contract-actions__done { display: block; }
.contract-actions__status { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (pointer: coarse) { .contract-actions { height: 36px; } .contract-actions__btn { width: 38px; } }
#trading-market-bar .market-stat { display: flex; flex-direction: column; justify-content: flex-end; gap: 5px; min-width: 0; min-height: 0; }
#trading-market-bar .market-stat-label { display: block; margin: 0; overflow: hidden; color: var(--text-muted); font: 500 .6875rem/1.2 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
#trading-market-bar .market-stat-value { display: block; overflow: hidden; color: var(--text); font: 400 .875rem/1.35 var(--fontfam-term); font-variant-numeric: tabular-nums slashed-zero; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
#trading-market-bar #market-stats .market-stat:first-child .market-stat-value { font: 600 .875rem/1.35 var(--fontfam-term); font-stretch: 100%; letter-spacing: 0; }
#trading-market-bar .btn.btn-stat { min-height: 0; padding: 0; gap: 5px; }
#trading-market-bar .market-header-actions { display: flex; align-items: center; gap: 12px; }
#trading-market-bar .market-statistics-footer { display: flex; align-items: center; gap: 14px; }
#trading-market-bar .market-header-status { color: var(--text-muted); font: 400 .6875rem/16px var(--fontfam-term); white-space: nowrap; }
/* Daily stats: a small outlined control in the label voice (its text stays "Daily stats", shown in capitals). */
#trading-market-bar .market-statistics-disclosure > summary {
  display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px 0 12px; border: 1px solid var(--rule-strong); border-radius: 4px;
  background: transparent; color: var(--text-soft); font: 500 .6875rem/1 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
  transition: background-color 160ms ease-out, border-color 160ms ease-out, color 160ms ease-out;
}
#trading-market-bar .market-statistics-disclosure > summary:hover, #trading-market-bar .market-statistics-disclosure[open] > summary { background: var(--terminal-control); border-color: var(--rule-bright); color: var(--text); }
#trading-market-bar .market-statistics-disclosure > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

@media (min-width: 1280px) {
  #trading-market-bar { display: flex; flex-wrap: nowrap; align-items: center; gap: 0 32px; min-height: 60px; padding: 8px var(--pane-x); }
  #trading-market-bar .market-panel-heading { flex: 0 0 auto; order: 0; }
  #trading-market-bar .market-stats { order: 1; }
  #trading-market-bar .market-header-actions { order: 2; }
  #trading-market-bar .market-stats, #trading-market-bar .market-stats.has-note-market {
    display: flex; flex: 0 1 auto; flex-wrap: nowrap; align-items: flex-end; justify-content: flex-end; gap: 0 28px; width: auto; max-width: none; min-width: 0; margin: 0 0 0 auto; grid-template-columns: none;
  }
  #trading-market-bar .market-stats.has-note-market { gap: 0 22px; }
  /* Figures shrink before they would crowd the actions; Last, Last APR and the change never do. */
  #trading-market-bar .market-stat { flex: 0 1 auto; }
  #trading-market-bar .market-stat:first-child, #trading-market-bar #market-last-apr-stat, #trading-market-bar .market-stat:nth-child(3) { flex-shrink: 0; }
  #trading-market-bar .market-header-actions { flex: 0 0 auto; align-self: stretch; padding-left: 24px; border-left: 1px solid var(--terminal-rule); }
}
/* A note market carries eight figures: below 1440px it stacks like narrower screens rather than truncate any. */
@media (min-width: 1280px) and (max-width: 1439px) {
  #trading-market-bar { gap: 0 24px; }
  #trading-market-bar .market-header-actions { padding-left: 20px; }
  #trading-market-bar:has(.market-stats.has-note-market) { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "title actions" "stats stats"; gap: 14px 24px; padding: 14px var(--pane-x) 16px; }
  #trading-market-bar:has(.market-stats.has-note-market) .market-panel-heading { grid-area: title; }
  #trading-market-bar:has(.market-stats.has-note-market) .market-header-actions { grid-area: actions; align-self: center; padding-left: 0; border-left: 0; }
  #trading-market-bar .market-stats.has-note-market { grid-area: stats; display: grid; grid-template-columns: repeat(8, minmax(0, auto)); justify-content: start; gap: 0 32px; margin: 0; padding-top: 14px; border-top: 1px solid var(--terminal-rule); }
}
/* Below 1280px: identity and actions share the first row; the full statistics grid follows under a hairline. */
@media (max-width: 1279px) {
  #trading-market-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "title actions" "stats stats"; align-items: center; gap: 14px 24px; padding: 14px var(--pane-x) 16px; }
  #trading-market-bar .market-panel-heading { grid-area: title; min-width: 0; }
  #trading-market-bar .market-header-actions { grid-area: actions; }
  #trading-market-bar .market-stats, #trading-market-bar .market-stats.has-note-market {
    grid-area: stats; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px 24px; width: auto; margin: 0; padding-top: 14px; border-top: 1px solid var(--terminal-rule);
  }
}
@media (max-width: 640px) {
  #trading-market-bar { gap: 12px 16px; padding: 14px var(--pane-x); }
  #trading-market-bar .market-stats, #trading-market-bar .market-stats.has-note-market { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; padding-top: 12px; }
  #trading-market-bar .market-header-status { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #trading-market-bar .market-statistics-disclosure > summary, .contract-actions, .contract-actions__btn { transition: none; }
}

/* ---------- Market selector — calm (2026-10-01) ----------
   A precise market picker in the landing's institutional voice: one panel with a hairline border, a search
   field with its keyboard hint, underline tabs, a quiet uppercase column head, compact 60px rows with each
   figure and its token on one line, and a factual note on what the numbers are. Scoped to #market-overlay:
   the wallet dialog shares .market-overlay-content and keeps its own look. */
#market-overlay { padding: 72px 24px 24px; align-items: flex-start; }
#market-overlay .market-overlay-backdrop { background: rgb(2 4 3 / .82); }
#market-overlay .market-overlay-content {
  display: flex; flex-direction: column; width: 880px; max-width: 100%; max-height: calc(100dvh - 96px); margin: 0; padding: 0; overflow: hidden;
  border: 1px solid var(--rule-strong); border-radius: 6px; background: var(--panel-fill); box-shadow: 0 32px 80px -28px rgb(0 0 0 / .75);
}
#market-overlay .market-overlay-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0; padding: 20px 16px 16px 24px; border: 0; }
#market-overlay h2 { margin: 0; color: var(--text); font: 650 1.25rem/1.2 var(--font-display); font-stretch: 92%; letter-spacing: -.01em; }
#market-overlay .market-overlay-title p { margin: 4px 0 0; color: var(--text-muted); font-size: .8125rem; line-height: 1.4; }
#market-overlay .market-overlay-close-btn { display: grid; place-items: center; flex: none; width: 36px; min-width: 36px; height: 36px; min-height: 36px; padding: 0; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--text-soft); }
#market-overlay .market-overlay-close-btn:hover { background: var(--terminal-control); color: var(--text); }
#market-overlay .market-overlay-close-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 0; }
#market-overlay .market-overlay-close-btn svg { width: 18px; height: 18px; }

/* Search: a magnifier, the field and an Esc hint. */
#market-overlay .market-filter-wrap { position: relative; display: flex; align-items: center; flex: none; margin: 0 24px; padding: 0; }
#market-overlay .market-filter-icon { position: absolute; left: 14px; width: 16px; height: 16px; color: var(--text-muted); pointer-events: none; }
#market-overlay .market-filter-input { width: 100%; height: 44px; margin: 0; padding: 0 56px 0 40px; border: 1px solid var(--rule-strong); border-radius: 4px; background: var(--terminal-inset); color: var(--text); font: 400 .9375rem/1 var(--font-sans); box-shadow: none; }
#market-overlay .market-filter-input::placeholder { color: var(--text-muted); }
#market-overlay .market-filter-input:hover { border-color: var(--rule-bright); }
#market-overlay .market-filter-input:focus { border-color: var(--focus); outline: none; box-shadow: none; }
#market-overlay .market-filter-key { position: absolute; right: 10px; padding: 3px 6px; border: 1px solid var(--rule-strong); border-radius: 3px; color: var(--text-muted); font: 500 .6875rem/1 var(--fontfam-term); pointer-events: none; }

/* Type tabs underline like the app's local tabs; the count sits at the right of the same rule. */
#market-overlay .market-selector-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex: none; margin: 8px 24px 0; border-bottom: 1px solid var(--terminal-rule); }
#market-overlay .market-type-tabs { display: flex; gap: 4px; margin: 0; padding: 0; }
#market-overlay .market-type-tab { position: relative; min-width: 0; min-height: 44px; padding: 0 12px; border: 0; border-radius: 0; background: transparent; color: var(--text-soft); font: 500 .875rem/1 var(--font-sans); }
#market-overlay .market-type-tab::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; border-radius: 2px 2px 0 0; background: transparent; }
#market-overlay .market-type-tab:hover { background: transparent; color: var(--text); }
#market-overlay .market-type-tab[aria-pressed="true"] { background: transparent; border: 0; color: var(--text); }
#market-overlay .market-type-tab[aria-pressed="true"]::after { background: var(--positive); }
#market-overlay .market-type-tab:focus-visible { outline: 2px solid var(--focus); outline-offset: -6px; border-radius: 6px; }
#market-overlay #market-result-count { padding-bottom: 14px; color: var(--text-muted); font: 400 .75rem/1 var(--font-sans); }
#market-overlay #market-registry-status { flex: none; min-height: 0; margin: 10px 24px 0; }
#market-overlay #market-registry-status:empty { display: none; }

/* Columns: market identity, then Last, 24h change and 24h volume right-aligned. */
#market-overlay .market-list-row { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, .75fr) minmax(0, 1.15fr); gap: 16px; align-items: center; }
#market-overlay .market-list-header { flex: none; height: 38px; margin: 0 24px; padding: 0 12px; border: 0; border-bottom: 1px solid var(--terminal-rule); }
#market-overlay .market-sort-btn { min-height: 38px; color: var(--text-muted); font: 500 .6875rem/1 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; }
#market-overlay .market-sort-btn:hover, #market-overlay .market-sort-btn.active { color: var(--text); }
#market-overlay #market-selector-scroll { flex: 1 1 auto; min-height: 160px; padding: 0 24px; }
#market-overlay .market-choice {
  min-height: 60px; margin: 0; padding: 10px 12px; border: 0; border-bottom: 1px solid var(--terminal-rule); border-radius: 0; background: transparent; color: var(--text); text-decoration: none;
  transition: background-color 120ms ease-out;
}
#market-overlay .market-choice:hover { background: var(--terminal-control); color: var(--text); text-decoration: none; }
#market-overlay .market-choice[aria-current="true"] { background: rgb(var(--positive-rgb) / .05); }
#market-overlay .market-choice:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
#market-overlay .market-list-main { display: flex; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; }
#market-overlay .market-list-name { flex-basis: 100%; color: var(--text); font: 500 .9375rem/1.3 var(--font-sans); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#market-overlay .market-list-symbols { margin: 0; color: var(--text-muted); font: 400 .75rem/1.4 var(--font-sans); white-space: nowrap; }
#market-overlay .market-row-status { display: inline; min-height: 0; color: var(--positive); font: 500 .6875rem/1.4 var(--font-sans); }
#market-overlay .market-row-status::before { content: '·'; margin-right: 8px; color: var(--text-muted); }
#market-overlay .market-row-status:empty { display: none; }
#market-overlay .market-row-status[data-stale="true"] { color: var(--network-label); }
#market-overlay .market-list-stat { display: flex; align-items: baseline; justify-content: flex-end; gap: 6px; min-width: 0; color: var(--text); font: 400 .875rem/1.3 var(--fontfam-term); font-variant-numeric: tabular-nums slashed-zero; text-align: right; }
#market-overlay .market-list-stat > span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#market-overlay .market-list-stat small { display: block; flex: none; margin: 0; color: var(--text-muted); font: 400 .6875rem/1.3 var(--font-sans); }
#market-overlay .market-filter-empty { padding: 48px 12px; border: 0; color: var(--text-muted); font-size: .875rem; text-align: center; }
#market-overlay .market-list:not(:has(.market-list-item:not([hidden]))) { border: 0; }
#market-overlay .market-selector-note { flex: none; margin: 0; padding: 12px 24px 14px; border-top: 1px solid var(--terminal-rule); color: var(--text-muted); font-size: .75rem; line-height: 1.5; }

/* Phones: a near-full-height sheet. Rows become pair and volume on the left, Last and change on the right. */
@media (max-width: 600px) {
  #market-overlay { padding: 8px; }
  #market-overlay .market-overlay-content { height: calc(100dvh - 16px); max-height: calc(100dvh - 16px); }
  #market-overlay .market-overlay-header { padding: 16px 8px 12px 16px; }
  #market-overlay .market-filter-wrap { margin: 0 16px; }
  #market-overlay .market-filter-key { display: none; }
  #market-overlay .market-filter-input { padding-right: 14px; font-size: 1rem; }
  #market-overlay .market-selector-toolbar { margin: 4px 16px 0; }
  #market-overlay #market-registry-status { margin-inline: 16px; }
  #market-overlay .market-list-header { display: flex; gap: 18px; height: 36px; margin: 0 16px; padding: 0 4px; }
  #market-overlay .market-sort-btn { min-height: 36px; text-align: left; }
  #market-overlay #market-selector-scroll { padding: 0 16px; }
  #market-overlay .market-choice { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "main last" "vol change"; gap: 2px 12px; min-height: 64px; padding: 10px 4px; }
  #market-overlay .market-list-main { grid-area: main; }
  #market-overlay .market-list-name { flex-basis: 100%; }
  #market-overlay .market-list-stat { align-self: auto; font-size: .875rem; }
  #market-overlay .market-list-stat::before { content: none; }
  #market-overlay .market-list-stat--last { grid-area: last; }
  #market-overlay .market-list-stat--change { grid-area: change; font-size: .8125rem; }
  #market-overlay .market-list-stat--volume { grid-area: vol; justify-content: flex-start; color: var(--text-muted); font-size: .75rem; text-align: left; }
  #market-overlay .market-list-stat--volume::before { content: 'Vol'; color: var(--text-muted); font: 400 .75rem/1.3 var(--font-sans); }
  #market-overlay .market-selector-note { padding: 10px 16px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  #market-overlay .market-choice { transition: none; }
}
