/* HEARTH design tokens — a lit hearth in a dark room. Warm near-black,
   firelight amber, cream ink. Warmth is the whole point; nothing here is
   pure grey or acid. */
:root {
  /* surfaces — warm charcoals, never neutral black */
  --bg:        #17120f;
  --bg-raise:  #201812;
  --bg-card:   #2a1f18;
  --bg-hi:     #34271e;
  --line:      #3d2f24;
  --line-soft: #2e231b;

  /* ink — warm cream, not white */
  --ink:      #f4eadf;
  --ink-dim:  #c3b2a1;
  --ink-mute: #8f7d6d;

  /* firelight */
  --ember:      #f0a15a;  /* primary accent — the glow */
  --ember-soft: #f6bd85;
  --ember-hot:  #e4642b;  /* live / casting — hotter coal */
  --ember-deep: #b5401c;
  --glow:       rgba(240,161,90,.28);
  --glow-hot:   rgba(228,100,43,.34);

  --good: #8fb782;
  --warn: #e0a94a;

  /* type */
  --f-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --f-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;

  --step--1: clamp(.72rem, .69rem + .15vw, .8rem);
  --step-0:  clamp(.9rem, .86rem + .2vw, 1rem);
  --step-1:  clamp(1.1rem, 1rem + .5vw, 1.35rem);
  --step-2:  clamp(1.5rem, 1.25rem + 1.2vw, 2.1rem);
  --step-3:  clamp(2rem, 1.5rem + 2.5vw, 3.4rem);

  --radius: 14px;
  --radius-sm: 9px;
  --radius-lg: 22px;

  --bar: var(--hkc-bar-h, 48px);   /* follows the shared chrome bar (0 when collapsed) */
  --mantel-h: 76px;
  --shadow: 0 12px 34px rgba(0,0,0,.5);
  --ease: cubic-bezier(.22,.61,.36,1);
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--f-ui);
  font-size: var(--step-0);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
h1, h2, h3 { font-family: var(--f-display); font-weight: 600; line-height: 1.05; margin: 0; letter-spacing: -.01em; }
button, input { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--ember); outline-offset: 2px; border-radius: 4px; }

.eyebrow {
  font-family: var(--f-ui);
  font-size: var(--step--1);
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--ember);
  margin: 0 0 .6rem;
  font-weight: 600;
}