/* ==========================================================================
   FUTURE — a quiet skin over the kit tokens: fonts, hollow glass, thin
   rules. Layer only: no layout, no ids, no classes, no JS.
   Loaded after kits.css/account.css, before phone.css (phone stays last).
   Every rule here wins by specificity/order over app.css's own panel rules,
   never by editing them.
   ========================================================================== */

/* ---------- fonts: system faces only, nothing downloaded ----------
   Headings, the wordmark and big numerals in a dignified serif; the body
   in a restrained humanist sans; data in the system monospace. The
   local() display faces of the earlier skin (Oxanium, Space Grotesk,
   JetBrains Mono) are retired on the owner's word (26 Sep 2026). */

html[data-edition] {
  --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, "Cascadia Code", Consolas, monospace;
}

html[data-edition] body {
  font-family: var(--font-body);
}

html[data-edition] h1,
html[data-edition] h2,
html[data-edition] h3,
html[data-edition] .room-title,
html[data-edition] .room-title-mobile,
html[data-edition] .brand-word,
html[data-edition] .tile-value {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
}

html[data-edition] .status-pill,
html[data-edition] .brand-edition-chip,
html[data-edition] .opening-chip,
html[data-edition] .tile-label,
html[data-edition] .audit-col-chip,
html[data-edition] code,
html[data-edition] .hash-cell,
html[data-edition] .cell-mono {
  font-family: var(--font-mono);
  letter-spacing: 0.12em;
}

/* ---------- hollow glass: panels, tiles, cards, top bar, prompt box, drawers, menus ---------- */
html[data-edition] .login-card,
html[data-edition] .gov-card,
html[data-edition] .tile,
html[data-edition] .chart-card,
html[data-edition] .compare-col,
html[data-edition] .audit-ledger-head,
html[data-edition] .settings-section,
html[data-edition] .media-item,
html[data-edition] .geometry-figure,
html[data-edition] .topbar,
html[data-edition] .prompt-input,
html[data-edition] .model-menu,
html[data-edition] .user-menu,
html[data-edition] .audit-drawer,
html[data-edition] .code-block {
  background: rgba(var(--kit-bg-elevated-rgb, 10, 20, 30), 0.55);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  backdrop-filter: blur(18px) saturate(1.4);
  border: 1px solid rgba(var(--kit-rim-rgb, 255, 255, 255), 0.16);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 12px 32px rgba(2, 8, 30, 0.28);
}

/* ---------- inputs: glass, hairline lights accent on focus ---------- */
html[data-edition] input,
html[data-edition] select,
html[data-edition] textarea {
  background: rgba(var(--kit-bg-elevated-rgb, 10, 20, 30), 0.45);
  -webkit-backdrop-filter: blur(12px) saturate(1.3);
  backdrop-filter: blur(12px) saturate(1.3);
  border: 1px solid rgba(var(--kit-rim-rgb, 255, 255, 255), 0.18);
}
html[data-edition] input:focus,
html[data-edition] select:focus,
html[data-edition] textarea:focus {
  border-color: var(--accent);
  box-shadow: none;
  outline: none;
}

/* ---------- hollow primary buttons: transparent, accent border+text; gradient only on hover/focus ---------- */
html[data-edition] .btn-primary,
html[data-edition] .send-btn,
html[data-edition] .opening-enter-btn {
  background: transparent;
  color: var(--text);
  border: 1px solid rgba(var(--kit-rim-rgb, 255, 255, 255), 0.55);
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
html[data-edition] .btn-primary:hover,
html[data-edition] .btn-primary:focus-visible,
html[data-edition] .send-btn:hover,
html[data-edition] .send-btn:focus-visible,
html[data-edition] .opening-enter-btn:hover,
html[data-edition] .opening-enter-btn:focus-visible {
  background: var(--kit-seal, var(--accent-2));
  border-color: var(--kit-seal, var(--accent-2));
  color: var(--accent-contrast);
  box-shadow: none;
}

/* ---------- luminous accent: glow on headings only, never on body/mono text ---------- */
html[data-edition] h1 .brand-word-accent,
html[data-edition] h1,
html[data-edition] h2,
html[data-edition] .room-title,
html[data-edition] .room-title-mobile {
  text-shadow: none;
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: 0.01em;
}

/* ---------- status pills: dot + glass, hairline border, no heavy fill ---------- */
html[data-edition] .status-pill {
  background: rgba(var(--kit-bg-elevated-rgb, 10, 20, 30), 0.45);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(var(--kit-rim-rgb, 255, 255, 255), 0.18);
}

/* ---------- per-edition --kit-bg-elevated-rgb (the rgba source for --bg-elevated) ---------- */
html[data-edition="AU"]:not([data-theme="light"]) { --kit-bg-elevated-rgb: 13, 31, 71; }
html[data-edition="AU"][data-theme="light"]       { --kit-bg-elevated-rgb: 255, 255, 255; }

/* ---------- accessibility: reduced transparency / reduced motion ---------- */
@media (prefers-reduced-transparency: reduce) {
  html[data-edition] .login-card,
  html[data-edition] .gov-card,
  html[data-edition] .tile,
  html[data-edition] .chart-card,
  html[data-edition] .compare-col,
  html[data-edition] .audit-ledger-head,
  html[data-edition] .settings-section,
  html[data-edition] .media-item,
  html[data-edition] .geometry-figure,
  html[data-edition] .topbar,
  html[data-edition] .prompt-input,
  html[data-edition] .model-menu,
  html[data-edition] .user-menu,
  html[data-edition] .audit-drawer,
  html[data-edition] .code-block,
  html[data-edition] input,
  html[data-edition] select,
  html[data-edition] textarea,
  html[data-edition] .status-pill {
    background: var(--bg-elevated);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  html[data-edition] body::before {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-edition] .btn-primary,
  html[data-edition] .send-btn,
  html[data-edition] .opening-enter-btn {
    transition: none;
  }
}
