/* Folio, concept B: final lavender workspace palette and layout tokens.
 * Existing document geometry is preserved; the workspace uses the selected Folio design.
 * No em or en dashes in this file (product text gate).
 */
:root {
  --phi-3: 3px;
  --phi-4: 4px;
  --phi-5: 5px;
  --phi-6: 6px;
  --phi-8: 8px;
  --phi-10: 10px;
  --phi-13: 13px;
  --phi-17: 17px;
  --phi-21: 21px;
  --phi-27: 27px;
  --phi-34: 34px;
  --phi-43: 43px;
  --phi-55: 55px;
  --phi-70: 70px;
  --phi-89: 89px;
  --phi-113: 113px;
  --phi-144: 144px;
  --phi-183: 183px;
  --phi-233: 233px;
  --phi-296: 296px;
  --phi-377: 377px;
  --phi-479: 479px;
  color-scheme: light;
  --background: #efeaf7;        /* light lavender workspace ground */
  --foreground: #392d4e;        /* dark plum interface text */
  --card: #faf8fd;              /* secondary surface: segmented track, chips */
  --card-foreground: #392d4e;
  --muted: #e0d7ee;             /* pressed segment, hover fill, progress track */
  --muted-foreground: #675a77;
  --plate: #e2dbea;             /* the deck the sheet lies on */
  --paper: #ffffff;             /* the sheet: paper-white, a shade warm */
  --paper-ink: #25212c;         /* type on the sheet, set for print not for screen */
  --paper-rule: #ddd8e3;        /* table rules inside the sheet */
  --paper-code: #f5f2f8;        /* code ground inside the sheet */
  --paper-muted: #655c6e;       /* folio, caption, table head on the sheet */
  --skeleton: #e8e2f0;          /* the ghost type of an empty sheet */
  --primary: #594174;           /* plum action and focus colour */
  --primary-foreground: #ffffff;
  --primary-hover: #49335f;
  --border: #d7cce4;
  --ring: var(--primary);
  --destructive: #993b43;
  --destructive-foreground: #ffffff;
  --shadow-sheet: 0 14px 30px -16px rgb(45 36 22 / .40), 0 2px 4px rgb(45 36 22 / .12);
  --shadow-raised: 0 1px 2px rgb(45 36 22 / .16);
  --radius: var(--phi-21);
  --radius-sm: var(--phi-8);
  --radius-xs: var(--phi-3);
  --radius-pill: 999px;
  --border-width: 1px;
  --outline-width: 2px;
  --font-sans: "Folio Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: Georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-mono: "Folio Mono", ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace;
  --text-lg: var(--phi-17);
  --text-base: var(--phi-13);
  --text-num: var(--phi-13);
  --text-sm: var(--phi-13);
  --text-xs: var(--phi-13);
  --space-1: var(--phi-3); --space-2: var(--phi-8); --space-3: var(--phi-13); --space-4: var(--phi-13); --space-5: var(--phi-21); --space-6: var(--phi-21);
  --strip-top: var(--phi-70);
  --col-left: 510px;
  --row: var(--phi-43);
  --target-min: var(--phi-43);  /* primary and keyboard targets stay above the 34 px minimum */
  --btn-h: var(--phi-34);
  --seg-h: var(--phi-34);
  --seg-min: var(--phi-43);
  --chip-h: var(--phi-21);
  --lab-w: var(--phi-113);
  --mark: var(--phi-34);
  --mark-radius: var(--phi-5);
  --grip: var(--phi-13);
  --star: var(--phi-27);
  --check: var(--phi-17);
  --track-h: 6px;
  --hair: 1px;
  --stepper-h: var(--phi-55);
  /* Page geometry: the sheet and everything printed on it derive from these numbers, as
     plain fractions of the sheet's own width. Percentage padding would resolve against the
     deck instead of the sheet, which is how a 25 mm margin silently becomes a 47 mm one. */
  --page-w: 210;
  --page-h: 297;
  --margin-plain: .09524;       /* 20 mm of 210 mm */
  --margin-book: .11905;        /* 25 mm of 210 mm */
  --margin-mono: .08571;        /* 18 mm of 210 mm */
  /* body size of each preset as the share of the page width it really occupies:
     11 pt, 12 pt and 10.5 pt of a 210 mm page. No floor, at any width: a sheet that
     enlarges its type to stay readable is no longer a proof of anything. */
  --type-plain: .018479;
  --type-book: .020159;
  --type-mono: .017639;
  --folio-drop: .05;            /* the folio sits 10.5 mm above the foot, inside the margin */
  --duration-fast: 120ms;
  --duration-slide: 180ms;
  --duration-max: 300ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
}

:root {
  --lemon: #dce096; --lemon-hover: #d0d580; --lemon-ink: #392d4e;
  --hero-bg: #e7dff6; --proof-bg: #e0d9e9; --surface: #faf8fd;
  --success-bg: #eef0d7; --error-bg: #fbebed;
  --panel-shadow: 0 8px 24px -18px rgb(57 45 78 / .3);
  --hero-width: var(--phi-89); --hero-height: var(--phi-113); --hero-title: var(--phi-21);
  --editor-min: var(--phi-183); --editor-max: var(--phi-377); --editor-size: var(--phi-13);
  --app-max: 1600px; --right-min: var(--phi-377); --proof-min: var(--phi-296);
  --proof-header-h: var(--phi-55); --border-double: 2px; --icon-size: var(--phi-17);
  --visually-hidden-size: 1px; --star-icon-size: var(--phi-17);
  --print-plain: 11pt; --print-book: 12pt; --print-mono: 10.5pt;
}
/* Exactly one focus frame, drawn inside the control's border. */
:focus-visible {
  outline: var(--outline-width) solid var(--ring);
  outline-offset: calc(-1 * var(--outline-width));
}

/* One frame at a time (owner rule 10.09): every focusable control draws its ring ON the border,
   never outside it; nothing falls back to the browser ring. Product rules may override. */
:where(input, select, textarea, button, [tabindex]):focus-visible {
  outline: var(--outline-width, 2px) solid var(--ring, currentColor);
  outline-offset: calc(-1 * var(--outline-width, 2px));
}

:where(input, select, textarea)[aria-invalid='true']:focus-visible {
  outline-color: var(--destructive, currentColor);
}

/* Used only when the product tokens.css has no prefers-color-scheme block. */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --background: #14171b;
    --foreground: #e6e9ee;
    --card: #1c2027;
    --card-foreground: #e6e9ee;
    --muted: #262b33;
    --muted-foreground: #9aa3ae;
    --border: #333a44;
    --primary-foreground: #0a1b33;
  }
}
