/* Type scale + numerals pass (P1-5/P1-6/P0-6, work/art-direction/review-2026-10-09.md).
   Loaded after balance.css: raises the token floors to the house minimums (UI §8: micro 11, label 12, small 13, body 14)
   and lifts the late sheets' literal sub-11 px sizes.

   Numerals: the shipped Be Vietnam Pro subset has no `tnum` ("1111" 24.1 px vs "8888" 37.4 px at 14/700).
   Inter is loaded *digits only* (Google Fonts `text=` subset, ~2 KB) and put first in --ff-num, so changing numbers get
   true tabular figures while every letter in the same span still falls back to Be Vietnam Pro / Cinzel. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700;800&display=swap&text=0123456789%2B-%E2%88%92%2F%25');

#game {
  --ff-num: 'Inter', 'Be Vietnam Pro', 'Segoe UI', system-ui, sans-serif;
  --fs-body: max(14px, calc(var(--u) * 3.45));
  --fs-small: max(13px, calc(var(--u) * 3));
  --fs-label: max(12px, calc(var(--u) * 2.6));
  --fs-micro: max(11px, calc(var(--u) * 2.3));
}

/* ------------------------------------------------------------ tabular numerals (changing numbers) */
#game .bar .txt, #game .bar .txt span,
#game .turn-counter, #game .tc-turn, #game .tc-par,
#game .skill .cost, #game .intent-value, #game .enemy .intent,
#game .chip-stats, #game .stat-chip, #game .quest-reward,
#game .cs-tile b, #game .cs-tile small, #game .rs-tile b, #game .reward-tile b, #game .reward-chip,
#game .brief .brief-reward b, #game .brief-foe small, #game .map-progress {
  font-family: var(--ff-num);
  font-variant-numeric: tabular-nums;
}
/* floats keep their letterforms (Cinzel for damage), only the digits switch to the tabular face */
#game .float { font-family: 'Inter', var(--ff-body); font-variant-numeric: tabular-nums; }
#game .float.dmg { font-family: 'Inter', var(--ff-head); }

/* ------------------------------------------------------------ title */
#game .title-sub, #game .title-edition, #game .title-edition span { font-size: max(11px, calc(var(--u) * 2.75)); }
#game .title-tag { font-size: max(13px, calc(var(--u) * 3)); }
#game .build-tag { font-size: 11px !important; }

/* ------------------------------------------------------------ map */
#game .map-header .realm span { font-size: max(12px, calc(var(--u) * 2.6)); }
#game .atlas-map .node-cta { font-size: 11px; }
#game .atlas-map .node .label { font-size: max(12px, var(--fs-label)); }
#game .atlas-map .node .reward-status, #game .atlas-map .node.reward-node .reward-status { font-size: 11px; }
#game .atlas-map .node.side .label { font-size: 12px; }
#game .map-footer .map-actions .icon-btn.labeled small { font-size: 11px; letter-spacing: .02em; }

/* ------------------------------------------------------------ camp */
#game .camp-panel .equip-state { font-size: 11px; }

/* ------------------------------------------------------------ stage preview (brief) */
#game .brief .eyebrow, #game .brief .brief-hero .eyebrow, #game .brief .eyebrow i { font-size: var(--fs-micro); }
#game .brief .brief-type, #game .brief .brief-stat { font-size: var(--fs-micro); }
#game .brief .brief-reward-label { font-size: var(--fs-micro); }
#game .brief .brief-section-head h3, #game .brief .brief-section-head small { font-size: var(--fs-micro); }
#game .brief .brief-wave-label, #game .brief .brief-wave-label b { font-size: var(--fs-micro); }
#game .brief .brief-foe small { font-size: 12px; }
#game .brief .brief-note-label { font-size: var(--fs-micro); }
#game .brief .brief-note-copy { font-size: var(--fs-label); }
#game .brief .tier-state { font-size: var(--fs-micro); }
#game .brief .tier-text { font-size: max(12px, var(--fs-label)); }

/* ------------------------------------------------------------ battle HUD */
#game .b-top .turn-counter, #game .tc-turn, #game .tc-par { font-size: 11px; }
#game .bar .txt { font-size: 11px; line-height: 1; }
#game .bar .txt span { font-size: 11px; }
#game .enemy-hud .bar.hp { min-height: 12px; }
#game .skill .cost { font-size: 11px; }
#game .hero-name, #game .hero-name span { font-size: 11px; }
#game .battle-status, #game .battle-status span { font-size: max(13px, var(--fs-small)); }

/* ------------------------------------------------------------ quest journal (P0-6) */
#game .quest-panel .close-x { top: 4px; right: 4px; width: 44px; height: 44px; border: 0; background: none; color: var(--tx-dim); }
#game .quest-panel .close-x .ui-icon { width: 18px; height: 18px; }
#game .quest-panel .close-x:hover { color: var(--tx-hi); }
#game .quest-titlebar { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: var(--sp-3); row-gap: 0; padding-right: 36px; margin: 0 0 var(--sp-2); }
#game .quest-titlebar h2 { margin: 0; padding-right: 0; flex: 0 1 auto; }
#game .quest-links { display: inline-flex; align-items: center; gap: var(--sp-3); }
#game .quest-links .text-link {
  display: inline-flex; align-items: center; min-height: 44px; margin: -10px 0; padding: 0 2px;
  border: 0; background: none; box-shadow: none; cursor: pointer;
  font: 600 13px/1 var(--ff-body); letter-spacing: .02em; color: var(--accent);
  text-decoration: underline; text-decoration-color: #e3bf7855; text-underline-offset: 3px; white-space: nowrap;
}
#game .quest-links .text-link:hover, #game .quest-links .text-link:focus-visible { color: var(--accent-hi); text-decoration-color: currentColor; }
#game .quest-links .text-link:active { transform: scale(.94); filter: brightness(.85); transition: transform 60ms; }

/* ------------------------------------------------------------ forged display type (2026-10-10)
   Brand reference: work/brand/ref_logo_left.png (carved stone/iron capitals, fire-orange left, ice-blue right).
   Face: Cinzel 900 — no Google face matches the bespoke chiselled logo letters without turning pulp/sci-fi
   (Germania One, New Rocker, Tektur, Pirata One compared in work/brand/type-compare.png); the carved feel comes
   from the treatment: metal-stone gradient face with a hard horizon, 1 px dark bevel edge, 2 px drop, optional glow.
   Display headings only. Full treatment needs >= 18 px; 13-17 px names get the `lite` version (soft fill, edge only);
   anything read (body, numbers, button labels, eyebrows) stays plain UI type.
   Shadows are drop-shadow filters, never text-shadow: a text-shadow paints over a background-clip:text face. */
#game {
  --ff-forge: 'Cinzel', var(--ff-head);
  --forge-iron-fill: linear-gradient(180deg, #fffaf0 0%, #f2e6cc 24%, #d4c5a5 47%, #8e806a 51%, #a99b81 66%, #6e6352 100%);
  --forge-fill: var(--forge-iron-fill);
  --forge-fill-lite: linear-gradient(180deg, #fff8e8 0%, #efe0c0 50%, #c9b48e 100%);
  --forge-tint: linear-gradient(transparent, transparent);
  --forge-solid: #ead9b4;
  --forge-edge: #120b05;
  --forge-drop: #000000b3;
  --forge-glow: drop-shadow(0 0 0 transparent);
  --forge-ember-fill: linear-gradient(180deg, #fff6e4 0%, #f7deb3 24%, #ddb47e 47%, #9b5b2b 51%, #b9763b 66%, #6b3515 100%);
  --forge-frost-fill: linear-gradient(180deg, #f6fbff 0%, #dce9f2 24%, #b2c7d5 47%, #607687 51%, #8098a9 66%, #3e4f5d 100%);
  --forge-rift-tint: linear-gradient(90deg, #ff8a3ae6 0%, #ff8a3a00 44%, #6cc8ff00 56%, #6cc8ffe6 100%);
}
#game .forged,
#game #brief-title, #game .panel h2, #game .panel.pause-panel .pm-title,
#game .result-panel .result-title, #game .reward-callout strong, #game .phase-banner h1, #game .banner .banner-word {
  font-family: var(--ff-forge); font-weight: 900; color: var(--forge-solid); text-shadow: none;
  filter: drop-shadow(0 1px 0 var(--forge-edge)) drop-shadow(0 -1px 0 var(--forge-edge))
          drop-shadow(1px 0 0 var(--forge-edge)) drop-shadow(-1px 0 0 var(--forge-edge))
          drop-shadow(0 2px 0 var(--forge-drop)) var(--forge-glow);
}
#game .forged.lite,
#game .map-header .realm b, #game .b-top .battle-stage-name, #game .enemy-hud .name {
  font-family: var(--ff-forge); font-weight: 800; color: var(--forge-solid); text-shadow: none;
  --forge-fill: var(--forge-fill-lite);
  filter: drop-shadow(0 1px 0 var(--forge-edge)) drop-shadow(0 0 1.5px #000000d9);
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  #game .forged, #game #brief-title, #game .panel h2, #game .panel.pause-panel .pm-title,
  #game .result-panel .result-title, #game .reward-callout strong, #game .phase-banner h1, #game .banner .banner-word,
  #game .map-header .realm b, #game .b-top .battle-stage-name, #game .enemy-hud .name {
    /* color stays solid: inline SVG icons inside a heading (Quest journal, Camp) keep currentColor */
    background-image: var(--forge-tint), var(--forge-fill); background-blend-mode: overlay, normal;
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  }
}
/* variants: ember (fire), frost (ice), rift (fire left -> ice right, the logo) */
#game .forged.ember, #game .result-panel.lost .result-title, #game .reward-callout strong, #game .phase-banner h1 {
  --forge-fill: var(--forge-ember-fill); --forge-glow: drop-shadow(0 0 10px #ff7a2a5c);
}
#game .forged.frost { --forge-fill: var(--forge-frost-fill); --forge-glow: drop-shadow(0 0 10px #5cc4ff52); }
#game .forged.rift, #game .result-panel .result-title, #game .reward-callout.reward-tier-4 strong, #game .reward-callout.reward-tier-5 strong {
  --forge-fill: var(--forge-iron-fill); --forge-tint: var(--forge-rift-tint);
  --forge-glow: drop-shadow(-5px 0 10px #ff7a2a70) drop-shadow(5px 0 10px #5cc4ff70);
}
/* defeat: charred iron, a dying ember rather than a bright one */
#game .result-panel.lost .result-title {
  text-shadow: none;
  --forge-tint: linear-gradient(transparent, transparent);
  --forge-fill: linear-gradient(180deg, #f3e2d6 0%, #dcbba6 26%, #b78a72 47%, #6e3a2a 51%, #8a4c36 66%, #4a2219 100%);
  --forge-glow: drop-shadow(0 0 12px #c8402a40);
}
#game .result-panel .result-title { letter-spacing: .1em; }
/* banners (wave, extra turn, skill name) keep their strip; only the word is forged */
#game .banner .banner-word { display: inline-block; font-weight: inherit; }
#game .banner.pattern, #game .banner.extra { font-size: max(18px, calc(var(--u) * 4.5)); }   /* full forge needs >= 18 px */
#game .banner.extra .banner-word { --forge-fill: var(--forge-frost-fill); }
@media (forced-colors: active) {
  #game .forged, #game #brief-title, #game .panel h2, #game .panel.pause-panel .pm-title, #game .result-panel .result-title,
  #game .reward-callout strong, #game .phase-banner h1, #game .banner .banner-word,
  #game .map-header .realm b, #game .b-top .battle-stage-name, #game .enemy-hud .name {
    background: none; -webkit-text-fill-color: CanvasText; filter: none;
  }
}