/* Final workspace density layer.
   Module scripts mount their own styles after the document loads, so these rules
   are deliberately scoped through the workspace density flag instead of relying
   on source order. The result stays compact while preserving readable controls. */
:root {
  --scan-space-1:4px;
  --scan-space-2:6px;
  --scan-space-3:8px;
  --scan-space-4:10px;
}

body.scan-density .gd-body,
body.scan-density .ad-body {
  gap:var(--scan-space-2);
  padding:var(--scan-space-3);
}

body.scan-density .gd-toolbar {
  gap:var(--scan-space-2);
  flex-wrap:nowrap;
  min-width:0;
}

body.scan-density :is(.gd-lanes,.gd-sub-toolbar,.cp-sub,.ad-lanes) {
  flex-wrap:nowrap;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
}

body.scan-density :is(.gd-lanes,.gd-sub-toolbar,.cp-sub,.ad-lanes)::-webkit-scrollbar {
  display:none;
}

body.scan-density :is(.gd-lanes,.gd-sub-toolbar,.cp-sub,.ad-lanes) > button {
  flex:0 0 auto;
  white-space:nowrap;
}

body.scan-density :is(.gd-panel,.ad-panel-wrap) {
  gap:var(--scan-space-3);
}

body.scan-density .ad-tiles,
body.scan-density .ad-form-row {
  gap:var(--scan-space-3);
}

body.scan-density :is(.gd-card,.gd-form,.ad-tile,.ad-form) {
  padding:var(--scan-space-3);
}

body.scan-density :is(.gd-form,.ad-form) {
  gap:var(--scan-space-3);
}

body.scan-density :is(.gd-empty,.ad-empty) {
  padding:12px;
}

body.scan-density :is(.cp-root,.cp-panel) {
  gap:var(--scan-space-2);
}

body.scan-density .cp-editor {
  padding:var(--scan-space-3);
}

body.scan-density :is(.cp-head,.cp-actions,.cp-templates,.cp-filters,.cp-resource-head) {
  gap:var(--scan-space-2);
}

body.scan-density .cp-entry {
  padding-top:var(--scan-space-3);
}

/* Keep the chart before comparison cards and preserve its plot height. The
   chart body scrolls when controls and comparisons exceed a spatial window. */
body.mobile-stack.spatial-workspace.scan-density .chart-body .candle-terminal {
  order:-1;
  flex:1 0 auto;
  height:auto;
  min-height:360px;
}

body.mobile-stack.spatial-workspace.scan-density .chart-body .compare-workbench {
  flex:0 0 auto;
}

body.mobile-stack.spatial-workspace.scan-density .oc-panel,
body.mobile-stack.spatial-workspace.scan-density .oc-breakdown {
  overflow:auto;
  flex:1 1 auto;
  min-height:0;
}

body.mobile-stack.spatial-workspace.scan-density .oc-source-layout {
  height:auto;
  min-height:0;
  flex:1 1 auto;
}

body.mobile-stack.spatial-workspace.scan-density .oc-abi-list {
  max-height:none;
  min-height:0;
  flex:1 1 auto;
}

/* Spatial dock icons remain compact symbols. Labels are available in the layer
   chooser, so they do not consume the working canvas on a phone. */
body.mobile-stack.spatial-workspace.scan-density .dock-icon-item {
  width:44px !important;
  min-width:44px;
  max-width:44px;
  height:44px !important;
  min-height:44px;
  max-height:44px;
  padding:4px;
  border-radius:10px;
}

body.mobile-stack.spatial-workspace.scan-density .dock-icon-label {
  display:none;
}

body.mobile-stack.spatial-workspace.scan-density .dock-icon-item :is(.dock-buddy,.dock-all-buddy) {
  width:26px !important;
  height:26px !important;
}

/* Creator, 2026-09-18: the buttons "were fine" and the enlarged ones "look huge".
   Touch enlargements apply only when a member picks the Large or XL scale tier. */
@media (pointer:coarse) {
  :root:is([data-scale-tier="large"],[data-scale-tier="xl"]) body.scan-density :is(.gd-lanes,.gd-sub-toolbar,.cp-sub,.ad-lanes) > button {
    min-height:40px;
  }

  :root:is([data-scale-tier="large"],[data-scale-tier="xl"]) body.scan-density .gd-detail-toggle {
    min-height:40px;
    flex:0 0 auto;
  }

  :root:is([data-scale-tier="large"],[data-scale-tier="xl"]) body.scan-density .ad-body :is(.ad-btn,.ad-btn-sm,.ad-primary,.ad-lanes button,.ad-tile) {
    min-height:40px;
  }

  :root:is([data-scale-tier="large"],[data-scale-tier="xl"]) body.mobile-stack.spatial-workspace.scan-density .workspace-layer-controls:not([data-edge="free"]):has(#workspace-layer-panel[hidden]) > .workspace-layer-trigger {
    width:40px;
    height:40px;
  }
}

@container workspace-window (max-width:420px) {
  body.scan-density .cp-grid {
    grid-template-columns:1fr;
  }

  body.scan-density .cp-actions :is(.cp-btn,.gd-btn) {
    flex:1 1 100%;
  }
}

/* ── Module padding overhaul: the 8px window-body standard ────────────────────
   Window bodies pad 8px (index.html .win-body). Module scripts inject their own
   styles after this sheet, so these overrides are scoped through body.scan-density
   (and !important only where the module's own rule is !important). Cards and
   headers use <=8px, empty/loading states 12px, and nothing reserves blank
   space the content does not use. */
body.scan-density :is(.pf-body,.shop-body,.rd-body) { padding:8px; gap:8px; }
body.scan-density :is(.oc-body,.os-body,.wh-body) { padding:8px !important; gap:8px !important; }

/* Empty and loading states say it once, compactly. */
body.scan-density :is(.oc-loading,.oc-empty,.os-empty,.wh-empty,.alerts-empty,.mh-empty,.pf-empty,.rd-empty,.rd-loading,.cm-empty,.gd-empty,.pf-user-loading) { padding:12px 8px; }
body.scan-density .bm-overlay { padding:12px; }
body.scan-density .rd-gauge { padding:10px 8px; gap:4px; }
body.scan-density .rd-locked { padding:10px; }

/* Headers and identity rows inside modules. */
body.scan-density .shop-head { padding:8px; gap:8px; }
body.scan-density .oc-identity { padding:8px; gap:8px; }
body.scan-density .pf-hero { gap:8px; }
body.scan-density .pf-card { padding:8px; gap:6px; }
body.scan-density .chat-status { padding:6px 8px; }
body.scan-density .calc-screen { padding:8px 10px; gap:8px; }

/* Research checklist: compact rows; the reason text stays aligned under the
   item title (8px pad + 20px check + 8px gap) and uses the full width in a
   narrow window instead of a 40px blank gutter. */
body.scan-density .cl-head { padding:8px 8px 6px; }
body.scan-density .cl-token { padding:6px 8px; }
body.scan-density .cl-disclaimer { padding:6px 8px; }
body.scan-density .cl-body { padding:8px; }
body.scan-density .cl-item-row { padding:7px 8px; gap:8px; }
body.scan-density .cl-why { padding:0 8px 8px 36px; }
@container workspace-window (max-width:420px) {
  body.scan-density .cl-why { padding-left:8px; }
}

/* Community chat: message list and composer. */
body.scan-density .chat-scroll { padding:8px; gap:8px; }
body.scan-density .chat-form { padding:6px 8px; gap:6px; }

/* Phone legibility floor (js/phone-legibility.js marks window text under 12px).
   Creator, 2026-09-18: make the text and content inside windows readable; the
   buttons were fine. */
body [data-phone-legible] { font-size:12px !important; line-height:1.3 !important; }
