


@media (max-width: 767px) {
  #terminal-shell {
    padding-left: 6px;
    padding-right: 6px;
  }
  #terminal-shell .term-tabs,
  #terminal-shell.th-settings-compact .term-tabs {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    padding-bottom: 4px;
  }
  #terminal-shell .term-tabs__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: auto;
    min-width: 0;
    gap: 0;
    order: 1;
  }
  #terminal-shell .term-tab,
  #terminal-shell .term-tab + .term-tab {
    min-width: 0;
    margin-left: 0;
    padding: 7px 2px 6px;
    font-size: 9.5px;
    line-height: 1.12;
    text-align: center;
    white-space: normal;
  }
  #terminal-shell .term-tabs .term-tools { gap: 3px; order: 2; }
  #terminal-shell .term-tabs .term-tools .calc-quick-btn {
    width: 29px;
    min-width: 29px;
    height: 29px;
    min-height: 29px;
  }
  #term-panel-crypto > .term-bleed[data-panel="tape"] {
    padding: 6px !important;
    border-left: 0;
    border-right: 0;
  }
  #term-panel-crypto > .term-bleed[data-panel="liquidation-activity"] {
    padding: 0 6px !important;
  }

  /* Primary mobile information architecture. Existing DOM stays intact. */
  #crypto-tape-root .live-term {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 6px;
    row-gap: 6px;
    align-items: start;
    min-height: 0;
  }
  #crypto-tape-root .livechart-card { order: 1; grid-column: 1 / -1; }
  #crypto-tape-root .live-term__main { order: 2; grid-column: 1 / -1; }
  #crypto-tape-root .liq-sidebar { order: 3; grid-column: 1 / -1; }
  #crypto-tape-root .squeeze-card { order: 4; grid-column: 1; }
  #crypto-tape-root .orderflow-card { order: 4; grid-column: 2; }
  #crypto-tape-root .pulseflow-card { order: 5; grid-column: 1 / -1; }

  /* Explicitly unwrap the desktop sidebar in the mobile layer itself.
     Do not depend on an older stylesheet's breakpoint for this: these cards
     must remain direct grid items so paired panels cannot fall back into a
     one-column sidebar stack. */
  #crypto-tape-root .live-term__side { display: contents !important; }
  #crypto-tape-root .live-term__gutter { display: none !important; }

  /* Chart remains the primary mobile surface but no longer dominates the page. */
  #crypto-tape-root .livechart-card:not(:fullscreen):not(.livechart-card--fullscreen) {
    padding: 7px 5px 5px !important;
  }
  #crypto-tape-root .livechart-card:not(:fullscreen):not(.livechart-card--fullscreen) .livechart-canvas-wrap {
    height: 218px !important;
    min-height: 205px !important;
    max-height: 218px !important;
  }
  #crypto-tape-root .livechart-ticker {
    margin-bottom: 3px !important;
    padding: 3px 4px 2px !important;
  }
  #crypto-tape-root .livechart-ticker__stat { padding: 1px !important; }
  #crypto-tape-root .livechart-ticker__stat-label { font-size: 8.5px !important; }
  #crypto-tape-root .livechart-toolbar {
    gap: 3px;
    padding-top: 2px;
    padding-bottom: 3px;
  }
  #crypto-tape-root .livechart-toolbar .tape-toolbar__group { gap: 3px; }
  #crypto-tape-root .livechart-toolbar .tape-toolbar__select,
  #crypto-tape-root .livechart-toolbar .toolbar-btn,
  #crypto-tape-root .livechart-overflow-btn { min-height: 29px; }

  /* Live tape remains complete; only its on-page viewport is bounded. */
  #crypto-tape-root .live-term__main {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 0;
    height: auto;
    min-width: 0;
    border: 1px solid var(--line);
  }
  #crypto-tape-root .term-identity-bar,
  #crypto-tape-root .asset-command-row,
  #crypto-tape-root .live-term__tape-frame { grid-column: 1 / -1; }
  #crypto-tape-root .term-identity-bar {
    min-height: 23px;
    padding: 2px 6px;
  }
  #crypto-tape-root .term-identity-bar__brand { font-size: 10.5px; }
  #crypto-tape-root .asset-command-row .asset-select { padding: 3px; }
  #crypto-tape-root .asset-command-row .asset-quick-controls {
    padding: 3px 4px;
    gap: 2px;
  }
  #crypto-tape-root .asset-quick-controls .toolbar-btn--icon-only {
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
  }
  #crypto-tape-root .asset-pill {
    min-height: 30px;
    padding: 4px 3px;
  }
  #crypto-tape-root .live-term__tape-frame { height: auto !important; }
  #crypto-tape-root .live-tape {
    height: 238px !important;
    max-height: 36svh !important;
    min-height: 190px;
  }
  #crypto-tape-root .tape-row { min-height: 19px; }

  /* Empty Large Trades and Market Overview share a compact context row. */
  #crypto-tape-root .whale-card,
  #crypto-tape-root .mktoverview-card {
    min-width: 0;
    margin: 0 !important;
    padding: 7px 8px !important;
    border-top: 1px solid var(--line-soft);
    border-bottom: 0 !important;
  }
  #crypto-tape-root .whale-card {
    grid-column: 1;
    border-right: 1px solid var(--line-soft);
  }
  #crypto-tape-root .mktoverview-card { grid-column: 2; }
  /* Large Trades and Market Overview stay side-by-side even while live
     whale data is present. The trade list scrolls inside its half-width card
     instead of forcing the Market Overview onto a new row. */
  #crypto-tape-root .whale-card:not(.whale-card--empty) {
    grid-column: 1;
    border-right: 1px solid var(--line-soft);
  }
  #crypto-tape-root .mktoverview-card { grid-column: 2; }
  #crypto-tape-root .whale-card .widget-card__head,
  #crypto-tape-root .mktoverview-card .widget-card__head { margin-bottom: 4px; }
  #crypto-tape-root .whale-card .widget-card__head h4,
  #crypto-tape-root .mktoverview-card .widget-card__head h4 {
    font-size: 9.5px !important;
    letter-spacing: .045em !important;
  }
  #crypto-tape-root .whale-card--empty .widget-card__body,
  #crypto-tape-root .whale-card--empty .whale-empty-msg {
    min-height: 54px !important;
    height: 54px;
    padding: 0 4px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 9.5px;
    line-height: 1.35;
  }
  #crypto-tape-root .whale-card .widget-card__body {
    min-height: 0 !important;
    padding: 0 !important;
  }
  #crypto-tape-root .whale-card__live { min-width: 0; }
  #crypto-tape-root .whale-stats {
    margin: 0 0 4px !important;
    padding: 0 0 4px !important;
  }
  #crypto-tape-root .whale-stats__row { gap: 3px; }
  #crypto-tape-root .whale-stats__label { font-size: 7px; letter-spacing: .02em; }
  #crypto-tape-root .whale-stats__value { font-size: 9.5px; }
  #crypto-tape-root .whale-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2px;
    margin: 0 0 4px !important;
  }
  #crypto-tape-root .whale-tab {
    min-width: 0;
    min-height: 22px;
    padding: 2px 1px;
    font-size: 7.5px;
    line-height: 1;
  }
  #crypto-tape-root .whale-head-row {
    padding: 2px 1px 3px !important;
    font-size: 6.5px;
    gap: 1px;
  }
  #crypto-tape-root .whale-head-row span:nth-child(1) { width: 13px; }
  #crypto-tape-root .whale-head-row span:nth-child(2) { width: 25px; }
  #crypto-tape-root .whale-head-row span:nth-child(3) { width: 31px; }
  #crypto-tape-root .whale-head-row span:nth-child(5) { width: 31px; }
  #crypto-tape-root .whale-list {
    height: 96px !important;
    max-height: 96px !important;
    min-height: 0 !important;
    scrollbar-gutter: auto;
  }
  #crypto-tape-root .whale-row {
    min-height: 18px;
    padding: 2px 1px !important;
    gap: 1px;
    font-size: 7.5px;
  }
  #crypto-tape-root .whale-exch { width: 13px; height: 13px; }
  #crypto-tape-root .whale-pair { width: 25px; }
  #crypto-tape-root .whale-side { width: 31px; font-size: 7px; }
  #crypto-tape-root .whale-value { min-width: 0; font-size: 8px; }
  #crypto-tape-root .whale-time { width: 31px; font-size: 6.8px; }

  #crypto-tape-root .mktoverview-card .widget-card__body { padding: 0 !important; }
  #crypto-tape-root .mktoverview-card .marketstats-card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }
  #crypto-tape-root .mktoverview-card .mstat-source-state {
    min-height: 18px;
    margin-bottom: 2px;
    padding: 2px 3px;
    font-size: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #crypto-tape-root .mktoverview-card .mstat-row {
    min-width: 0;
    padding: 2px 0 !important;
    font-size: 9.5px !important;
    gap: 5px;
  }
  #crypto-tape-root .mktoverview-card .mstat-label,
  #crypto-tape-root .mktoverview-card .mstat-value {
    min-width: 0;
    white-space: nowrap;
  }

  /* Four liquidation windows in a 2x2 summary; event feed stays available. */
  #terminal-shell .liq-sidebar { padding: 7px 8px !important; }
  #terminal-shell .liq-sidebar .widget-card__head {
    grid-template-columns: 30px minmax(0, 1fr) 62px;
    column-gap: 4px;
    margin-bottom: 4px;
  }
  #terminal-shell .liq-sidebar .widget-card__head h4 { font-size: 10.5px; }
  #terminal-shell .liq-sidebar .liq-sidebar__src { display: none; }
  #terminal-shell .liq-stats {
    margin: 0 0 5px;
    padding: 0 0 5px;
  }
  #terminal-shell .liq-multi {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 1px 8px;
  }
  #terminal-shell .liq-multi-block {
    grid-template-columns: 30px minmax(0, 1fr) minmax(0, 1fr) !important;
    min-height: 28px;
    padding: 2px 0 !important;
  }
  #terminal-shell .liq-multi-block:nth-child(3),
  #terminal-shell .liq-multi-block:nth-child(4) { border-bottom: 0; }
  #terminal-shell .liq-multi-block__win { font-size: 9px; }
  #terminal-shell .liq-multi-block__value { font-size: 10.5px; }
  #terminal-shell .liq-multi-block__label { display: none; }
  #terminal-shell .liq-sidebar__head-row {
    padding: 3px 4px 4px;
    font-size: 8px;
  }
  #terminal-shell .liq-sidebar__list {
    height: 86px !important;
    min-height: 86px !important;
    max-height: 86px !important;
  }
  #terminal-shell .liq-sidebar__empty {
    min-height: 85px !important;
    font-size: 9px;
  }

  /* Squeeze and Buy/Sell share one glanceable row. */
  #terminal-shell .squeeze-card,
  #terminal-shell .orderflow-card {
    min-width: 0;
    width: auto !important;
    align-self: stretch;
    overflow: hidden;
    padding: 7px !important;
    border: 1px solid var(--line-soft) !important;
  }
  #terminal-shell .squeeze-card .widget-card__head,
  #terminal-shell .orderflow-card .widget-card__head {
    min-height: 24px;
    margin-bottom: 4px;
    gap: 3px;
  }
  #terminal-shell .squeeze-card .widget-card__head h4,
  #terminal-shell .orderflow-card .widget-card__head h4 {
    font-size: 9.5px;
    line-height: 1.2;
  }
  #terminal-shell .squeeze-card .panel-drag-handle,
  #terminal-shell .orderflow-card .panel-drag-handle {
    font-size: 11px;
    margin-right: 0;
  }
  #terminal-shell .squeeze-card .tag,
  #terminal-shell .orderflow-card .tag {
    padding: 1px 3px;
    font-size: 8px;
  }
  #terminal-shell .squeeze-destroyed {
    gap: 4px;
    margin-bottom: 4px;
    padding-bottom: 4px;
  }
  #terminal-shell .squeeze-destroyed__value { font-size: 13px; }
  #terminal-shell .squeeze-destroyed__label {
    font-size: 7px;
    letter-spacing: .03em;
    text-align: center;
  }
  #terminal-shell .squeeze-verdict {
    gap: 1px;
    padding: 2px 0 4px;
  }
  #terminal-shell .squeeze-verdict__label { font-size: 11px; }
  #terminal-shell .squeeze-factors { gap: 2px; }
  #terminal-shell .squeeze-factor {
    padding: 2px 3px;
    font-size: 7.5px;
  }
  #terminal-shell .orderflow-card .widget-card__body { padding: 0 !important; }
  #terminal-shell .orderflow-ratio-bar { height: 12px; }
  #terminal-shell .orderflow-ratio-legend { font-size: 9px; }
  #terminal-shell .orderflow-60s {
    padding-top: 5px;
    font-size: 8px;
    gap: 3px;
    flex-wrap: wrap;
  }

  /* Market Pulse and Order Flow Score remain side by side; gauge is scaled. */
  #terminal-shell .pulseflow-card { padding: 7px 8px !important; }
  #terminal-shell .pulseflow-card .widget-card__head { margin-bottom: 4px; }
  #terminal-shell .pulseflow-card .widget-card__head h4 {
    font-size: 9.5px;
    gap: 3px;
  }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-body {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    align-items: start;
    gap: 8px;
  }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-col { min-width: 0; overflow: hidden; }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-col + .wc-split-col {
    border-top: 0;
    border-left: 1px solid var(--line-soft);
    margin-top: 0;
    padding-top: 0;
    padding-left: 8px;
  }
  #terminal-shell .marketpulse-card .mstat-row--pulse { padding: 3px 0 4px; }
  #terminal-shell .marketpulse-status { height: 8px; }
  #terminal-shell .marketpulse-stat__head {
    margin-bottom: 2px;
    font-size: 8.5px;
  }
  #terminal-shell .ofscore-pressure__label {
    margin-bottom: 2px;
    font-size: 8.5px;
  }
  #terminal-shell .ofscore-pressure__ratio {
    margin-bottom: 0;
    font-size: 17px;
  }
  #terminal-shell .wc-split-col .ofscore-gauge-wrap { max-width: 104px !important; }
  #terminal-shell .wc-split-col .ofscore-value { font-size: 18px !important; }
  #terminal-shell .wc-split-col .ofscore-label {
    margin-bottom: 3px !important;
    font-size: 8px;
  }
  #terminal-shell .ofscore-card .mstat-row {
    padding: 2px 0;
    font-size: 8.5px;
  }

  /* Compact the executed-liquidation empty state below the live terminal. */
  #term-panel-crypto #panel-liqheatmap { margin: 0 0 7px !important; }
  #term-panel-crypto #panel-liqheatmap .widget-card__head {
    min-height: 30px;
    padding: 5px 7px;
    margin: 0;
  }
  #term-panel-crypto #panel-liqheatmap .widget-card__body { padding: 6px 7px !important; }
  #term-panel-crypto #panel-liqheatmap .heatmap-controls { margin-bottom: 4px; }
  #term-panel-crypto #panel-liqheatmap .heatmap-empty-note {
    min-height: 34px;
    padding: 7px 8px;
    font-size: 9px;
    line-height: 1.3;
  }
  .page-terminal .term-learning { margin-top: 10px; }
}



@media (max-width: 360px) {
  #terminal-shell { padding-left: 4px; padding-right: 4px; }
  #crypto-tape-root .live-term { column-gap: 4px; row-gap: 4px; }
  #crypto-tape-root .live-term__main { column-gap: 4px; }
  #terminal-shell .squeeze-card,
  #terminal-shell .orderflow-card { padding: 5px !important; }
  #terminal-shell .squeeze-card .widget-card__head h4,
  #terminal-shell .orderflow-card .widget-card__head h4,
  #terminal-shell .pulseflow-card .widget-card__head h4 { font-size: 8.5px !important; }
  #terminal-shell .squeeze-factor { font-size: 6.9px; padding: 2px; }
  #terminal-shell .orderflow-ratio-legend { font-size: 8px; }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-body {
    grid-template-columns: minmax(0, 1fr) minmax(0, .92fr);
    gap: 5px;
  }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-col + .wc-split-col { padding-left: 5px; }
  #crypto-tape-root .whale-card,
  #crypto-tape-root .mktoverview-card { padding: 6px !important; }
}
@media (max-width: 285px) {
  #crypto-tape-root .live-term { grid-template-columns: minmax(0, 1fr); }
  #crypto-tape-root .squeeze-card,
  #crypto-tape-root .orderflow-card { grid-column: 1; }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-body { grid-template-columns: 1fr; }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-col + .wc-split-col {
    border-left: 0; border-top: 1px solid var(--line-soft); padding-left: 0; padding-top: 5px;
  }
}












@media (max-width: 767px) {
  #crypto-tape-root .live-term {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: row dense;
    column-gap: 5px !important;
    row-gap: 5px !important;
    align-items: start;
    min-width: 0;
  }

  /* One canonical mobile grid. The wrappers stay in the DOM for JS and
     accessibility hooks, but no longer create separate visual stacks. */
  #crypto-tape-root .live-term__main,
  #crypto-tape-root .live-term__side {
    display: contents !important;
  }
  #crypto-tape-root .live-term__gutter { display: none !important; }

  /* Full-width primary surfaces. */
  #crypto-tape-root .livechart-card {
    order: 1 !important;
    grid-column: 1 / -1 !important;
    min-width: 0;
  }
  #crypto-tape-root .term-identity-bar {
    order: 2 !important;
    grid-column: 1 / -1 !important;
    min-width: 0;
  }
  #crypto-tape-root .asset-command-row {
    order: 3 !important;
    grid-column: 1 / -1 !important;
    min-width: 0;
  }
  #crypto-tape-root .live-term__tape-frame {
    order: 4 !important;
    grid-column: 1 / -1 !important;
    min-width: 0;
  }

  /* Dense paired analytics. */
  #crypto-tape-root .whale-card {
    order: 5 !important;
    grid-column: 1 !important;
  }
  #crypto-tape-root .mktoverview-card {
    order: 5 !important;
    grid-column: 2 !important;
  }

  /* Price Alerts is lazy-mounted after Market Overview. Give it an explicit
     slot and pair it with Liquidations instead of leaving a blank column. */
  #crypto-tape-root #price-alert-center {
    order: 6 !important;
    grid-column: 1 !important;
    min-width: 0;
    margin: 0 !important;
    padding: 6px !important;
    overflow: hidden;
    border: 1px solid var(--line-soft) !important;
    align-self: stretch;
  }
  #crypto-tape-root .liq-sidebar {
    order: 6 !important;
    grid-column: 2 !important;
    min-width: 0;
    align-self: stretch;
    border: 1px solid var(--line-soft) !important;
  }

  #crypto-tape-root .squeeze-card {
    order: 7 !important;
    grid-column: 1 !important;
  }
  #crypto-tape-root .orderflow-card {
    order: 7 !important;
    grid-column: 2 !important;
  }
  #crypto-tape-root .pulseflow-card {
    order: 8 !important;
    grid-column: 1 / -1 !important;
  }

  /* The old mobile main container border no longer owns a box after
     display:contents. Rebuild the terminal-tape group on its real children. */
  #crypto-tape-root .term-identity-bar {
    border: 1px solid var(--line) !important;
    border-bottom: 0 !important;
  }
  #crypto-tape-root .asset-command-row {
    border-left: 1px solid var(--line) !important;
    border-right: 1px solid var(--line) !important;
  }
  #crypto-tape-root .live-term__tape-frame {
    border: 1px solid var(--line) !important;
    border-top: 0 !important;
  }

  /* Price Alerts must remain fully functional in a half-width card, but its
     controls are made genuinely mobile-dense rather than inheriting the old
     desktop card spacing. */
  #crypto-tape-root #price-alert-center .widget-card__head {
    min-height: 22px;
    margin-bottom: 4px !important;
    gap: 3px;
  }
  #crypto-tape-root #price-alert-center .widget-card__head h4 {
    min-width: 0;
    font-size: 8.5px !important;
    line-height: 1.15;
    letter-spacing: .035em !important;
    white-space: nowrap;
  }
  #crypto-tape-root #price-alert-center .widget-card__head .tag {
    max-width: 58px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 1px 3px;
    font-size: 6.8px;
  }
  #crypto-tape-root #price-alert-center .widget-card__body {
    display: grid;
    gap: 4px;
    padding: 0 !important;
  }
  #crypto-tape-root #price-alert-center .retention-permission {
    grid-template-columns: 1fr !important;
    gap: 2px;
    padding: 3px !important;
  }
  #crypto-tape-root #price-alert-center .retention-permission button {
    width: 100%;
    min-width: 0;
    height: 21px;
    padding: 0 3px;
    font-size: 7px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #crypto-tape-root #price-alert-center .retention-permission span {
    font-size: 6.5px;
    line-height: 1.15;
  }
  #crypto-tape-root #price-alert-center .retention-form {
    grid-template-columns: 1fr !important;
    gap: 3px !important;
  }
  #crypto-tape-root #price-alert-center .retention-form label {
    gap: 1px;
    font-size: 6.6px;
    line-height: 1.1;
  }
  #crypto-tape-root #price-alert-center .retention-form input,
  #crypto-tape-root #price-alert-center .retention-form select,
  #crypto-tape-root #price-alert-center .retention-form button {
    height: 23px;
    padding: 3px 4px;
    font-size: 7.5px;
  }
  #crypto-tape-root #price-alert-center .retention-alert-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4px !important;
  }
  #crypto-tape-root #price-alert-center .retention-alert-columns h5 {
    margin-bottom: 2px;
    font-size: 7px;
  }
  #crypto-tape-root #price-alert-center .retention-list {
    gap: 2px;
    font-size: 6.8px;
    line-height: 1.15;
  }
  #crypto-tape-root #price-alert-center .retention-list li {
    gap: 2px;
    padding-bottom: 2px;
  }
  #crypto-tape-root #price-alert-center .retention-note {
    font-size: 6.3px;
    line-height: 1.2;
  }

  /* Liquidations is now a half-width peer of Price Alerts. Keep all four
     windows and the live event feed, but compress them for the narrower card. */
  #crypto-tape-root .liq-sidebar {
    padding: 6px !important;
  }
  #crypto-tape-root .liq-sidebar .widget-card__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 22px;
    gap: 3px;
    margin-bottom: 4px !important;
  }
  #crypto-tape-root .liq-sidebar .panel-drag-handle,
  #crypto-tape-root .liq-sidebar .liq-sidebar__src {
    display: none !important;
  }
  #crypto-tape-root .liq-sidebar .widget-card__head h4 {
    min-width: 0;
    font-size: 8.5px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #crypto-tape-root .liq-sidebar .widget-card__head .tag {
    padding: 1px 3px;
    font-size: 6.8px;
  }
  #crypto-tape-root .liq-stats {
    margin-bottom: 3px;
    padding-bottom: 3px;
  }
  #crypto-tape-root .liq-multi {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  #crypto-tape-root .liq-multi-block {
    grid-template-columns: 25px minmax(0, 1fr) minmax(0, 1fr) !important;
    min-height: 20px;
    padding: 1px 0 !important;
  }
  #crypto-tape-root .liq-multi-block__win { font-size: 7px; }
  #crypto-tape-root .liq-multi-block__value { font-size: 8px; }
  #crypto-tape-root .liq-sidebar__head-row {
    display: none !important;
  }
  #crypto-tape-root .liq-sidebar__list {
    height: 74px !important;
    min-height: 74px !important;
    max-height: 74px !important;
  }
  #crypto-tape-root .liq-sidebar__empty {
    min-height: 73px !important;
    padding: 4px !important;
    font-size: 7px;
    line-height: 1.2;
    text-align: center;
  }

  /* Do not re-stack normal phone layouts. Even very small supported phones
     keep the paired analytics; overflow is prevented with minmax(0,1fr). */
  #crypto-tape-root .squeeze-card,
  #crypto-tape-root .orderflow-card,
  #crypto-tape-root .whale-card,
  #crypto-tape-root .mktoverview-card,
  #crypto-tape-root #price-alert-center,
  #crypto-tape-root .liq-sidebar {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100%;
    box-sizing: border-box;
  }
}



@media (max-width: 285px) {
  #crypto-tape-root .live-term {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #crypto-tape-root .squeeze-card { grid-column: 1 !important; }
  #crypto-tape-root .orderflow-card { grid-column: 2 !important; }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-body {
    grid-template-columns: minmax(0, 1fr) minmax(0, .92fr) !important;
  }
  #terminal-shell #term-panel-crypto .pulseflow-card .wc-split-col + .wc-split-col {
    border-left: 1px solid var(--line-soft) !important;
    border-top: 0 !important;
    padding-left: 4px !important;
    padding-top: 0 !important;
  }
}







@media (max-width: 767px) {
  /* Live Liquidations: the half-width card previously inherited desktop
     fixed field widths, and a later "show more rows" override removed the
     list's height bound entirely. With up to 30 live prints that made this one
     grid item determine the height of the whole paired row (stretching Price
     Alerts beside it) and increased the page by hundreds of pixels. Keep the
     feed as a bounded scroll viewport and make every horizontal track
     shrinkable instead of letting liquidation content define page geometry. */
  #crypto-tape-root .liq-sidebar {
    display: flex !important;
    flex-direction: column;
    min-height: 0;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden;
  }
  #crypto-tape-root .liq-sidebar .widget-card__body {
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    flex: 1 1 auto;
    padding: 0 !important;
  }
  #crypto-tape-root .liq-sidebar__list {
    flex: 0 0 auto !important;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    height: 168px !important;
    min-height: 168px !important;
    max-height: 168px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain;
  }
  #crypto-tape-root .liq-sidebar__row {
    display: grid !important;
    grid-template-columns: 15px minmax(0, 1fr) 13px minmax(40px, auto) !important;
    align-items: center;
    gap: 3px !important;
    min-height: 21px !important;
    padding: 2px 3px !important;
    font-size: 8.5px !important;
    line-height: 1.05 !important;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }
  #crypto-tape-root .liq-sidebar__exch {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
  }
  #crypto-tape-root .liq-sidebar__sym {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8.5px !important;
    line-height: 1 !important;
  }
  #crypto-tape-root .liq-sidebar__side {
    width: 13px !important;
    min-width: 13px !important;
    overflow: hidden;
    white-space: nowrap;
    font-size: 0 !important;
    text-align: center;
  }
  #crypto-tape-root .liq-sidebar__row--long .liq-sidebar__side::before,
  #crypto-tape-root .liq-sidebar__row--short .liq-sidebar__side::before {
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
  }
  #crypto-tape-root .liq-sidebar__row--long .liq-sidebar__side::before { content: "L"; }
  #crypto-tape-root .liq-sidebar__row--short .liq-sidebar__side::before { content: "S"; }
  #crypto-tape-root .liq-sidebar__usd {
    min-width: 0 !important;
    font-size: 8.5px !important;
    line-height: 1 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #crypto-tape-root .liq-sidebar__time {
    display: none !important;
  }
  #crypto-tape-root .liq-sidebar__empty {
    min-height: 90px !important;
    display: grid;
    place-items: center;
    padding: 6px !important;
    font-size: 7.5px !important;
    line-height: 1.25;
  }

  /* Executed Liquidation Activity: the old 700px minimum width forced a
     horizontal scroller on phones. Fit all 21 distance buckets into the
     available card width so the whole distribution is visible at once. */
  #term-panel-crypto #panel-liqheatmap,
  #term-panel-crypto #panel-liqheatmap .widget-card__body,
  #term-panel-crypto #panel-liqheatmap .heatmap-wrap,
  #term-panel-crypto #panel-liqheatmap .heatmap-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-wrap {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    padding: 2px 0 3px !important;
    touch-action: pan-y;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-table {
    gap: 3px !important;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: 48px repeat(21, minmax(0, 1fr)) !important;
    gap: 1px !important;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-symbol {
    min-width: 0;
    padding-right: 3px !important;
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    font-size: 8px !important;
    line-height: 1.05 !important;
    overflow: hidden;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-symbol > * {
    min-width: 0;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-price {
    font-size: 6.5px !important;
    text-align: left !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-row-total {
    grid-column: auto !important;
    font-size: 6.5px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-cell {
    min-width: 0 !important;
    height: 20px !important;
    border-radius: 1px !important;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-axis-label {
    min-width: 0;
    overflow: visible;
    font-size: 0 !important;
    white-space: nowrap;
  }
  /* Keep only left edge, MARK and right edge labels on narrow screens.
     First grid child is .heatmap-symbol, so these are bucket positions
     -10 / 0 / +10 respectively. */
  #term-panel-crypto #panel-liqheatmap .heatmap-row--head > .heatmap-axis-label:nth-child(2),
  #term-panel-crypto #panel-liqheatmap .heatmap-row--head > .heatmap-axis-label:nth-child(12),
  #term-panel-crypto #panel-liqheatmap .heatmap-row--head > .heatmap-axis-label:nth-child(22) {
    font-size: 5.5px !important;
    letter-spacing: -.04em;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-controls {
    margin-bottom: 3px !important;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-controls .seg {
    width: auto;
    max-width: 100%;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-controls .seg button {
    min-width: 42px;
    padding: 5px 9px;
  }
  #term-panel-crypto #panel-liqheatmap .liq-heatmap-legend {
    gap: 7px !important;
    margin-top: 5px !important;
    font-size: 7px !important;
    line-height: 1.2;
  }
  #term-panel-crypto #panel-liqheatmap .liq-heatmap-legend span {
    gap: 3px !important;
  }
  #term-panel-crypto #panel-liqheatmap .liq-heatmap-legend i {
    width: 10px !important;
    height: 6px !important;
  }
  #term-panel-crypto #panel-liqheatmap .liq-heatmap-legend__scale {
    width: 44px !important;
  }
}

@media (max-width: 380px) {
  #crypto-tape-root .liq-sidebar__list {
    height: 147px !important;
    min-height: 147px !important;
    max-height: 147px !important;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-row {
    grid-template-columns: 44px repeat(21, minmax(0, 1fr)) !important;
  }
  #term-panel-crypto #panel-liqheatmap .heatmap-symbol { font-size: 7.5px !important; }
  #term-panel-crypto #panel-liqheatmap .heatmap-price,
  #term-panel-crypto #panel-liqheatmap .heatmap-row-total { font-size: 6px !important; }
  #term-panel-crypto #panel-liqheatmap .heatmap-cell { height: 19px !important; }
}







@media (max-width: 767px) {
  #crypto-tape-root .live-tape {
    height: 238px !important;
    max-height: 36svh !important;
  }

  /* Stable compact geometry for every trade tier. JS re-measures the actual
     row height after resize/density changes, so virtualization stays aligned. */
  #crypto-tape-root .tape-row,
  #crypto-tape-root .tape-row.tape-tier-2,
  #crypto-tape-root .tape-row.tape-tier-3,
  #crypto-tape-root .tape-row.tape-tier-4 {
    box-sizing: border-box;
    height: 21px !important;
    min-height: 21px !important;
    max-height: 21px !important;
    padding: 0 4px !important;
    gap: 4px !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
  }

  #crypto-tape-root .tape-row__exch {
    width: 15px !important;
    height: 15px !important;
  }
  #crypto-tape-root .tape-row__crown {
    font-size: 10px !important;
    margin-right: -2px !important;
  }
  #crypto-tape-root .tape-row__side {
    width: 9px !important;
    font-size: 9.5px !important;
  }
  #crypto-tape-root .tape-row__price {
    width: 72px !important;
    font-size: 10.5px !important;
  }
  #crypto-tape-root .tape-row__qty {
    min-width: 0 !important;
    font-size: 9.5px !important;
  }
  #crypto-tape-root .tape-row__value {
    width: 54px !important;
    font-size: 10px !important;
  }
  #crypto-tape-root .tape-row__time {
    width: 47px !important;
    font-size: 9.5px !important;
  }
  #crypto-tape-root .tape-row__cluster {
    height: 15px !important;
    min-height: 15px !important;
    padding: 0 3px !important;
    font-size: 8.5px !important;
    line-height: 15px !important;
  }

  /* Highlight tiers stay visual only; never consume extra vertical space. */
  #crypto-tape-root .tape-row.tape-hl-3 {
    border-left-width: 3px !important;
  }
}

@media (max-width: 380px) {
  /* Quantity is the least important field on narrow phones; hiding only this
     field protects price/value/time readability without changing the feed. */
  #crypto-tape-root .tape-row__qty { display: none !important; }
  #crypto-tape-root .tape-row__price { width: 70px !important; }
  #crypto-tape-root .tape-row__value { width: 52px !important; }
  #crypto-tape-root .tape-row__time { width: 45px !important; }
}
