/* 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(--on-selection); }
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, .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(var(--shadow-rgb) / calc(.6 * var(--shadow-strength))); }

/* 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) var(--select-chevron) 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: an amount field and its keys are one instrument. `.aera-infield` is the field's
   single border; the value takes the room, and each key (Max, Mid, Oracle, a currency select or a
   static unit) is a full-height segment cut into the field's right end behind a `rule-strong`
   hairline, so its fill meets the field edge. Keys grow with the field: standard fields carry
   0.75rem labels, prominent 60-64px fields (`--prominent`) 0.875rem labels on wider keys. Pages own
   only the value's typography and the field's height. */
body:not(.is-home) .aera-infield {
  --infield-key: .6875rem; --infield-pad: 10px; --infield-min: 40px;
  position: relative; display: flex; align-items: stretch; min-width: 0; padding: 0;
  border: 1px solid var(--rule-strong); border-radius: 4px; background: var(--terminal-control); transition: border-color 160ms ease-out;
}
body:not(.is-home) .aera-infield--prominent { --infield-key: .75rem; --infield-pad: 10px; --infield-min: 44px; }
body:not(.is-home) :is(.aera-infield[hidden], .aera-infield > [hidden], .aera-infield > .input-suffix-unit:empty) { display: none; }
/* The border answers to the value alone: hovering, clicking or toggling a key changes only that key,
   never the field's frame. `:where()` keeps hover, focus and invalid at equal weight, so the later wins. */
body:not(.is-home) .aera-infield:hover:where(:not(:has(> :is(.input-suffix-action, select.input-suffix-select):hover))) { border-color: var(--rule-bright); }
body:not(.is-home) .aera-infield:has(> :where(input):focus) { border-color: var(--positive); }
body:not(.is-home) .aera-infield:has([aria-invalid="true"]) { border-color: var(--danger-soft); }
/* The value is the field: it always keeps at least 70% of it, and keys and units stay compact around it. */
body:not(.is-home) .aera-infield > input { flex: 1 1 0; align-self: stretch; width: 0; min-width: 70%; height: auto; margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; outline: none; }
body:not(.is-home) .aera-infield > input:is(:hover, :focus, :focus-visible) { border: 0; outline: none; box-shadow: none; }
/* A field carrying both a button and a dropdown (Trading's Max and currency) keeps at least 60%. */
body:not(.is-home) .aera-infield:has(> .input-suffix-action):has(> select.input-suffix-select) > input { min-width: 60%; }
body:not(.is-home) .aera-infield > .input-prefix { flex: none; display: flex; align-items: center; padding-left: 12px; color: var(--text-muted); font: 400 .875rem/1 var(--fontfam-term); }
body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select, .input-suffix-unit) {
  flex: none; align-self: stretch; display: flex; align-items: center; justify-content: center;
  height: auto; min-height: 0; margin: 0; border: 0; border-left: 1px solid var(--rule-strong); border-radius: 0; box-shadow: none;
  font: 500 var(--infield-key)/1 var(--font-sans); letter-spacing: .01em; white-space: nowrap;
  transition: background-color 120ms ease-out, color 120ms ease-out, box-shadow 120ms ease-out;
}
body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select, .input-suffix-unit):last-child { border-radius: 0 3px 3px 0; }
body:not(.is-home) .aera-infield > .input-suffix-action { min-width: var(--infield-min); padding: 0 var(--infield-pad); background: transparent; color: var(--text-soft); cursor: pointer; }
body:not(.is-home) .aera-infield > select.input-suffix-select {
  appearance: none; -webkit-appearance: none; width: auto; min-width: var(--infield-min); max-width: 112px; padding: 0 calc(var(--infield-pad) + 13px) 0 var(--infield-pad);
  background: transparent var(--select-chevron) right calc(var(--infield-pad) - 2px) center / 10px no-repeat;
  color: var(--text); text-align: left; cursor: pointer;
}
/* A unit is secondary: one line in small mono, capped near eight characters (RBTC, WRBTC fit whole), and
   longer symbols end in an ellipsis with the full symbol in the title. Block layout lets text-overflow
   apply; align-content centres the line in the full-height key. */
body:not(.is-home) .aera-infield > span.input-suffix-unit { display: block; flex: 0 1 auto; align-content: center; min-width: 0; max-width: calc(8.5ch + 12px); padding: 0 6px; overflow: hidden; color: var(--text-muted); font-family: var(--fontfam-term); font-size: .6875rem; line-height: 1.25; letter-spacing: 0; white-space: nowrap; text-overflow: ellipsis; text-align: center; }
body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select):hover:not(:disabled) { background-color: var(--terminal-raised); color: var(--text); }
body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select):active:not(:disabled) { background-color: var(--rule); }
body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select):focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; color: var(--text); }
body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select):disabled { background-color: transparent; color: color-mix(in srgb, var(--text-soft) 42%, transparent); cursor: not-allowed; }
/* A toggled key (the Bridge send's Max, on while that address takes the rest) is lit by fill and ink
   alone: raised fill, text ink, no frame, so the field's border stays as it is. */
body:not(.is-home) .aera-infield > .input-suffix-action[aria-pressed="true"] { background-color: var(--terminal-raised); color: var(--text); }
@media (max-width: 760px), (pointer: coarse) {
  body:not(.is-home) .aera-infield { --infield-min: 44px; }
  body:not(.is-home) .aera-infield--prominent { --infield-min: 44px; }
}

/* Range: a measuring rule. A 2px hairline, a neutral fill up to the value and a slim index thumb cut
   into the rule; no colour, because a setting is not a market signal. Controllers set --range-value
   (0–1) for the WebKit fill; Firefox draws it with ::-moz-range-progress. --range-thumb is set on the
   body so a scale drawn beside the input can inset its ticks to the thumb's travel. */
body:not(.is-home) { --range-thumb: 6px; }
body:not(.is-home) input[type="range"] {
  --range-track: var(--rule-strong); --range-fill: var(--text-soft); --range-index: var(--text);
  --range-at: calc(var(--range-thumb) / 2 + (100% - var(--range-thumb)) * var(--range-value, 0));
  appearance: none; -webkit-appearance: none; display: block; width: 100%; height: 44px; margin: 0; background: transparent; cursor: pointer;
}
body:not(.is-home) input[type="range"]::-webkit-slider-runnable-track { height: 2px; border-radius: 1px; background: linear-gradient(to right, var(--range-fill) var(--range-at), var(--range-track) var(--range-at)); }
body:not(.is-home) input[type="range"]::-moz-range-track { height: 2px; border-radius: 1px; background: var(--range-track); }
body:not(.is-home) input[type="range"]::-moz-range-progress { height: 2px; border-radius: 1px; background: var(--range-fill); }
body:not(.is-home) input[type="range"]::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: var(--range-thumb); height: 18px; margin-top: -8px; border: 0; border-radius: 2px; background: var(--range-index); box-shadow: 0 0 0 2px var(--ground); transition: box-shadow 120ms ease-out; }
body:not(.is-home) input[type="range"]::-moz-range-thumb { box-sizing: border-box; width: var(--range-thumb); height: 18px; border: 0; border-radius: 2px; background: var(--range-index); box-shadow: 0 0 0 2px var(--ground); transition: box-shadow 120ms ease-out; }
body:not(.is-home) input[type="range"]:hover:not(:disabled) { --range-track: var(--rule-bright); }
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 2px var(--ground), 0 0 0 4px var(--focus); }
body:not(.is-home) input[type="range"]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 2px var(--ground), 0 0 0 4px var(--focus); }
body:not(.is-home) input[type="range"]:disabled { --range-fill: var(--rule-bright); --range-index: var(--text-muted); cursor: not-allowed; }
@media (pointer: coarse) { body:not(.is-home) { --range-thumb: 8px; } }

/* Segmented controls: segmented.css (loaded last) owns them. */

/* ---------- 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; }
/* Page titles share the Trading market title's type (#trading-market-bar #market-title below) at every width. */
.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: 650 1.25rem/1.2 var(--font-display); font-stretch: 92%; letter-spacing: -.01em;
}
.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 { 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, .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,
.ad-dao-columns h3 > span, .sn-catalog-label, #pf-count,
.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-page, .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); }
.ad-root th, .moc-page th { padding-top: 0; padding-bottom: 12px; border-bottom: 1px solid var(--rule-strong); }
.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-fill-rgb) / calc(.12 * var(--positive-wash))); color: var(--positive); }
.side-chip[data-side="sell"] { background: rgb(var(--danger-soft-fill-rgb) / calc(.12 * var(--danger-soft-wash))); 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, .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,
.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, .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 { color: var(--text-soft); font-size: .8125rem; }
.ad-dao-ledger dd, .moc-metrics dd, .sn-page .series-detail-item 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); }
/* Segmented cells (`.aera-seg`) own their hover in segmented.css; this rule's specificity would override it. */
.btn:not(.primary-btn):not(.danger-btn):not(.ad-primary):not(.moc-primary):not(.pf-primary):not(.br-primary):not(.lb-btn):not(.aera-seg > *):not(.aera-preferences > *):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 { 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-fill); }
.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) .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); }
: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; }
.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-fill-hover); }
.main-layout:not(.main-layout--page) #submit-order-btn[data-side="sell"]:hover:not(:disabled) { background: var(--danger-soft-hover); }
.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. */
/* Borrowers & risk: seriesRisk.css owns the pool risk board. */
/* Liquidations: seriesLiquidations.css owns the desk. */

/* ---------- 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; }
  .sn-workspace, .ad-root .ad-main, .pf-layout { padding-top: 20px; padding-bottom: 40px; }
}
@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) .aera-infield, body:not(.is-home) .aera-infield > :is(.input-suffix-action, select.input-suffix-select), 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; }
#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 { 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(var(--ground-rgb) / .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(var(--shadow-rgb) / calc(.75 * var(--shadow-strength)));
}
#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-fill); }
#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: var(--terminal-selected); box-shadow: inset 2px 0 0 var(--positive-fill); }
#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: attr(data-short-label); 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; }
}