/* ==========================================================================
   Display profiles (GEMINI.md monitors)
   html[data-ui-profile] is set by inline script in layout.html before paint.

   Screen ratio = ROOT only (--ui-root-font / --ui-rem).
   All UI font tiers use rem via calc(var(--ui-rem) * n) — no per-profile px.
   ========================================================================== */

html {
  --ui-root-font: 62.5%;
  --ui-rem: 10px;
  /* Left nav (CC / Settings): use --ui-rem (px), not bare rem — rem tracks
     browser default font (often smaller on macOS Safari/Chrome prefs). */
  --ui-sidebar-width: calc(var(--ui-rem) * 18);
  --ui-market-base-date-gap: 1rem;
  --ui-fs-body: calc(var(--ui-rem) * 1.3); /* ~13px @ default */
  --ui-fs-ui: calc(var(--ui-rem) * 1.3);
  --ui-fs-emphasis: calc(var(--ui-rem) * 1.5);
  --ui-fs-secondary: calc(var(--ui-rem) * 1.4);
  --ui-fs-micro: calc(var(--ui-rem) * 1.1);
  --ui-fs-small: calc(var(--ui-rem) * 1.2);
  /* Shared amount / money figure sizes (Trade cards, Dashboard tables, etc.) */
  --ui-fs-amount: calc(var(--ui-rem) * 1.5); /* 1.5rem — default amount */
  --ui-fs-amount-lg: calc(var(--ui-rem) * 1.7); /* 1.7rem — emphasized amount */
  /* Card header title */
  --ui-fs-card-title: calc(var(--ui-rem) * 1.5); /* 1.5rem */
  --ui-fw-card-title: 700;
  --ui-fs-popup-header: var(--ui-fs-card-title);
  --ui-fw-popup-header: var(--ui-fw-card-title);
  --ui-fs-popup-body: var(--ui-fs-body);
  --ui-fw-popup-body: 400;
  --ui-fc-popup-header: #202124;
  --ui-fc-popup-body: #3c4043;
  --ui-fc-popup-muted: #5f6368;
  --ui-fc-popup-action: #1a73e8;
  /* Popup chrome: all white; sections separated by divider lines */
  --ui-bg-popup-header: #ffffff;
  --ui-bg-popup-body: #ffffff;
  --ui-bg-popup-footer: #ffffff;
  --ui-bg-popup-btn-hover: #f1f3f4;
  --ui-bg-popup-btn-active: #e8eaed;
  --ui-bd-popup-divider: #e5e7eb;
  --ui-bg-popup-overlay: rgba(0, 0, 0, 0.4);
  --ui-radius-popup: 1.2rem;
  --ui-shadow-popup: 0 2px 8px rgba(0, 0, 0, 0.12);
  --ui-pad-popup-header-y: 1.4rem;
  --ui-pad-popup-header-x: 1.6rem;
  --ui-pad-popup-body: 1.6rem;
  --ui-pad-popup-footer-y: 1.2rem;
  --ui-pad-popup-footer-x: 1.6rem;
  --ui-fs-popup-icon: calc(var(--ui-rem) * 2);
  --ui-fc-popup-icon: #5f6368;
  /* Side panel header title (shared across Trade/Settings/CC drawers) */
  --ui-fs-side-panel-title: calc(var(--ui-rem) * 1.5); /* 1.5rem */
  --ui-fw-side-panel-title: 700;
  /* Settings / page main heading (top of content area) */
  --ui-fs-page-title: calc(var(--ui-rem) * 1.8); /* 1.8rem */
  --ui-fw-page-title: 700;
  /* Table header */
  --ui-fw-table-header: 700;
  /* Shared list-row rhythm (cards / dense lists) */
  --ui-list-row-line-height: 1.35;
  --ui-list-row-pad-y: calc(var(--ui-rem) * 0.16);
  --ui-list-row-pad-x: calc(var(--ui-rem) * 0.4);
  --ui-list-row-content-height: calc(var(--ui-fs-body) * var(--ui-list-row-line-height));
  /* Touch target floor (~44px); used on phone profile */
  --ui-touch-min: calc(var(--ui-rem) * 4.4);
  /* Top chrome height for shell calc (header bar) */
  --ui-top-chrome-height: 5rem;
}

html[data-ui-profile="default"],
html[data-ui-profile="laptop-15"],
html[data-ui-profile="tablet"] {
  --ui-root-font: 62.5%;
  --ui-rem: 10px;
  --ui-market-base-date-gap: 1rem;
}

/* Phone / narrow CSS layout — keep scale close to PC; viewport fix already restores size.
   Slight body bump only; oversized rem made the whole Trade UI feel huge. */
html[data-ui-profile="phone"],
html[data-ui-mobile="1"] {
  --ui-root-font: 62.5%;
  --ui-rem: 10px;
  --ui-fs-body: calc(var(--ui-rem) * 1.35); /* ~13.5px */
  --ui-fs-ui: calc(var(--ui-rem) * 1.35);
  --ui-list-row-pad-y: calc(var(--ui-rem) * 0.28);
  --ui-list-row-pad-x: calc(var(--ui-rem) * 0.5);
  --ui-touch-min: calc(var(--ui-rem) * 4); /* ~40px */
  --app-gutter-x: 0.8rem;
  --ui-top-chrome-height: 4.8rem;
}

html[data-ui-profile="home-scaled"],
html[data-ui-profile="home-retina"] {
  --ui-root-font: 68.75%;
  --ui-rem: 11px;
  --ui-market-base-date-gap: 1.25rem;
}

/* 32" 3840×2160 @100% — large screen, no OS scale; smaller than laptop tiers */
html[data-ui-profile="office-4k"] {
  --ui-root-font: 56.25%;
  --ui-rem: 9px;
  --ui-market-base-date-gap: 0.875rem;
}

/* Home market base-date row — rem-only local tweak */
html[data-ui-profile="home-scaled"] .dashboard-summary-side .card-row-item .val,
html[data-ui-profile="home-scaled"] .dashboard-summary-side .card-row-item-1 .val,
html[data-ui-profile="home-retina"] .dashboard-summary-side .card-row-item .val,
html[data-ui-profile="home-retina"] .dashboard-summary-side .card-row-item-1 .val {
  font-size: var(--ui-fs-amount);
}