/*
 * DoYouTax design tokens (tickets 0003, 0103 and 0105, docs/design/systeme.md).
 * Shared by the site (site.css) and by the print templates rendered with WeasyPrint
 * (print.css). Hand-written, no build step.
 *
 * Second execution of the art direction (ticket 0237, sub-lot B1): direction D, the free
 * design chosen by Antoine on 2026-10-14 (docs/design/direction-2026-10/d/). Since ticket
 * 0271 (Q232 (a)), one palette: the block `:root` carries the colours and the families of
 * direction D for every rendering (screens, delivered documents, e-mails, social card,
 * figures), under the roles of docs/12; the block `:root.site`, below, keeps only the
 * shapes and the focus of the screens (the element `html` of templates/base.html carries
 * the class). apps/core/design_tokens.py reads both blocks and measures every pair of
 * docs/12 in each. Every colour variable is covered by the contrast test
 * (apps/core/tests/test_design_tokens.py): a new colour needs a pair there.
 */

/* Fonts (ticket 0103): DoyouTax Serif, DoyouTax Sans and DoyouTax Mono are Latin
   subsets of Spectral, Hanken Grotesk and IBM Plex Mono, renamed so that no modified
   file carries the name of the original (SIL Open Font License 1.1, condition 3 for the
   Reserved Font Name "Plex"; scripts/subset_fonts.py, static/fonts/LICENSE-*.md). The
   family names are identifiers and keep the spelling of the preloaded files. Served
   from static/fonts only: no font is ever loaded from another domain. Since ticket 0271
   they serve the figures drawn by the code (`--font-drawn-sans`, `--font-drawn-mono`)
   and the social card (TTF subsets of the same files, server side); the documents, the
   e-mails and the screens are set in the families of direction D below. */
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-regular.e30a57677338.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-italic.d6902ae2c5ca.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-medium.61ef8e362e1c.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-medium-italic.1b2b980965fd.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Serif";
  src: url("../fonts/doyoutax-serif-semibold.e26c608c411b.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Sans";
  src: url("../fonts/doyoutax-sans-regular.8d5bcfe3246a.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Sans";
  src: url("../fonts/doyoutax-sans-medium.bc10a4c089fe.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Sans";
  src: url("../fonts/doyoutax-sans-semibold.2b2e0c0dd56c.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Mono";
  src: url("../fonts/doyoutax-mono-regular.eed859c9836c.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoyouTax Mono";
  src: url("../fonts/doyoutax-mono-medium.393dd7a6f2fa.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Families of direction D (ticket 0237, sub-lot B1): Latin subsets of Newsreader (pinned
   at the optical size of titles), Geist and Geist Mono, renamed "DoYouTax Acte",
   "DoYouTax Service" and "DoYouTax Piece", one per voice of docs/12
   (scripts/subset_fonts.py, static/fonts/LICENSE-newsreader.md, LICENSE-geist.md,
   LICENSE-geist-mono.md). Since ticket 0271 they are the families of every rendering. */
@font-face {
  font-family: "DoYouTax Acte";
  src: url("../fonts/doyoutax-acte-regular.d00f3be7a509.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Acte";
  src: url("../fonts/doyoutax-acte-italic.ee05743d467c.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Acte";
  src: url("../fonts/doyoutax-acte-medium.c1199630f4ca.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Acte";
  src: url("../fonts/doyoutax-acte-medium-italic.d7e3397c284b.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
/* Body of the delivered documents (ticket 0271, Q233 (a)): Newsreader instantiated at an
   optical size of text (`opsz` 14), the four styles of the Acte. Read by print.css alone,
   through `--font-serif-text`: no rule of a screen names it, no page preloads it. */
@font-face {
  font-family: "DoYouTax Acte Texte";
  src: url("../fonts/doyoutax-acte-texte-regular.5ff91f20b9f2.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Acte Texte";
  src: url("../fonts/doyoutax-acte-texte-italic.3552cb3b3e01.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Acte Texte";
  src: url("../fonts/doyoutax-acte-texte-medium.2de16d467853.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Acte Texte";
  src: url("../fonts/doyoutax-acte-texte-medium-italic.1cb795a1c8c4.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Service";
  src: url("../fonts/doyoutax-service-regular.76c1ed510083.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Service";
  src: url("../fonts/doyoutax-service-medium.b9eb51ac1012.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Service";
  src: url("../fonts/doyoutax-service-semibold.4ae5c2bf636c.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Piece";
  src: url("../fonts/doyoutax-piece-regular.32643e33eb72.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DoYouTax Piece";
  src: url("../fonts/doyoutax-piece-medium.1551eba528a7.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Light theme only: the site does not follow the colour scheme of the system
     (docs/12-design-ux.md, "Thème sombre"). */
  color-scheme: light;

  /* Colours (ticket 0103, docs/12-design-ux.md, "Couleurs"; values of direction D since
     ticket 0271, decision of Antoine of 2026-10-14). Each variable is named by its role,
     never by its hue nor by the name of the palette; each value of the palette is written
     once, the other roles of the same value refer to it. The accompanying tints are those
     of the free design (`styles.css` of docs/design/direction-2026-10/d/), two of them
     moved towards the ink to reach their minimum (docs/design/systeme.md). */

  /* Text. */
  --color-ink: #141b22;
  --color-ink-muted: #616a74; /* #69727c of the design, 9 % towards the ink */
  --color-ink-inverse: var(--color-surface);
  /* Text between the ink and the muted text: leads and secondary paragraphs of the site,
     text of the framed mention of the example sheet (`--ink-2` of the design). */
  --color-ink-soft: #3a444f;

  /* Backgrounds and lines. */
  --color-page: #f7f4ee;
  --color-surface: #ffffff;
  --color-surface-muted: #efe9de; /* `--paper-2` of the design: table heads, boxes */
  --color-line: #e2dbcd;
  --color-border: #88857d; /* `--line-strong` of the design, 38 % towards the ink */
  /* Rule set off from the plain rule (outline of a secondary button, frame of the
     regulatory mention of a document), decorative (`--line-strong` of the design). */
  --color-line-strong: #cfc6b4;

  /* Links, structure accent and bands of the header and footer. */
  --color-link: var(--color-ink);
  --color-band: #0e161d;
  --color-band-ink: #eef1f2;
  --color-band-ink-muted: #9aa8b1;
  --color-band-rule: #242b31; /* `--night-line` of the design: rule of the home band */
  /* A plan raised on the band (`--night-2` of the design). */
  --color-band-raised: #16212a;
  /* Accent of structure: the Encre in direction D (text of a bordered button, rule of a
     box of a document). */
  --color-accent: var(--color-ink);
  --color-accent-strong: var(--color-ink);
  --color-accent-soft: var(--color-surface-muted);

  /* Main action and deadlines; mark of the brand. */
  --color-action: #9d1c20;
  --color-action-strong: #7d1418; /* `--brand-strong` of the design */
  --color-brand: var(--color-action);
  /* Visa clair: `--brand-on-night` of the design, in place of the framboise of 2026-10-06
     (decision of Antoine of 2026-10-14, suite 8). */
  --color-brand-on-band: #f08b84;
  --color-brand-ink-on-band: var(--color-surface); /* "DoYou" of the logo on the band */

  /* Deadline, status "à confirmer par un avocat" and error (ticket 0105, docs/12, rule
     2): the Visa and the Visa pâle, read by those components only. */
  --color-attention: var(--color-action);
  --color-attention-soft: #f7e8e4;

  /* Status "vérifié" only (docs/12, rule 3), on the site and in print. */
  --color-verified: #2d6a4f;
  --color-verified-soft: #e3efe7;

  /* Focus indicator (the screens take the Visa, block `:root.site`). */
  --color-focus: var(--color-ink);
  --color-focus-on-band: var(--color-surface);

  /* The only shadow (docs/12, "Parti pris"): under the document extract, a sheet laid
     on the page; Nuit at 55 %, as on the validated mock-up. */
  --shadow-sheet: 0 18px 40px -28px color-mix(in srgb, var(--color-band) 55%, transparent);

  /* Typography (docs/12-design-ux.md, "Typographie"): the three voices in the families
     of direction D (ticket 0237, sub-lot B1; every rendering since ticket 0271), and the
     text face of the Acte for the body of a delivered document (print.css alone). */
  --font-sans: "DoYouTax Service", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "DoYouTax Acte", Georgia, "Times New Roman", serif;
  --font-serif-text: "DoYouTax Acte Texte", Georgia, "Times New Roman", serif;
  --font-mono: "DoYouTax Piece", ui-monospace, "SFMono-Regular", Menlo, Consolas,
    "Liberation Mono", monospace;
  --font-size-xs: 0.875rem;
  --font-size-sm: 0.9375rem;
  --font-size-base: 1.0625rem;
  --font-size-md: 1.25rem;
  --font-size-lg: 1.5rem;
  --font-size-xl: 1.875rem;
  --font-size-2xl: 2.25rem;
  --font-size-3xl: 2.875rem;
  --line-height-tight: 1.15;
  --line-height-base: 1.6;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-strong: 600;

  /* Spacing scale (rem, base 16 px). */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  /* Layout and shapes (docs/12-design-ux.md, "Formes"): those of the documents; the
     screens take theirs in the block `:root.site`. */
  --measure: 40rem;
  --container: 64rem;
  --radius: 2px;
  --border-width: 1px;
  --focus-width: 3px;
  --focus-offset: 2px;
  --target-size: 2.75rem;

  /* Second execution of the art direction (ticket 0237, sub-lot B1, direction D). Read by
     site.css only: the documents keep the shapes above. */
  /* Families of the figures drawn by the code (ticket 0124): their texts are measured
     with the TTF subsets of apps/core/social_assets/fonts, the families of ticket 0103;
     they keep them (ticket 0271, rule 4; the palette of the figures is the one of the
     lot C of ticket 0237). */
  --font-drawn-sans: "DoyouTax Sans", "Segoe UI", Roboto, "Helvetica Neue", Arial,
    sans-serif;
  --font-drawn-mono: "DoyouTax Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas,
    "Liberation Mono", monospace;
  /* Titles: tracking closed (direction D, `--display-track` of its sheet), the screen
     title more than the others. */
  --tracking-display: -0.028em;
  --tracking-title: -0.015em;
  /* Shapes: a pill for the buttons and the marks, a soft corner for a notice, a large
     one for a card or a panel (direction D: 999, 14 and 22 pixels). */
  --radius-pill: 999px;
  --radius-box: 14px;
  --radius-card: 22px;
  /* The sheet of a document laid on the page (direction D: 6 pixels). */
  --radius-sheet: 6px;
  /* Width of the pages and their side margins (ticket 0237, rule 20 (a): 1 200 pixels and
     the gutter of direction D). */
  --container-wide: 75rem;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  /* Header of direction D (rule 20 (b)): sticky, the page seen through it at 82 per cent
     and blurred by 14 pixels; one row of 60 pixels under 48rem (64 at most, docs/12), of
     72 pixels from 48rem. */
  --header-height: 3.75rem;
  --header-height-wide: 4.5rem;
  --header-background: color-mix(in srgb, var(--color-page) 82%, transparent);
  --header-blur: saturate(1.4) blur(14px);
  /* Shadows of direction D, a closed list (site.css, test of the components): the main
     button set on the page, a surface raised over the page (form of the first screen,
     order box). The shadow of the sheet stays the one above. */
  --shadow-action: 0 1px 0 color-mix(in srgb, var(--color-surface) 18%, transparent) inset,
    0 6px 18px -8px color-mix(in srgb, var(--color-action) 70%, transparent);
  --shadow-raised: 0 2px 4px color-mix(in srgb, var(--color-ink) 4%, transparent),
    0 24px 60px -18px color-mix(in srgb, var(--color-ink) 28%, transparent);
  /* Fade of a block at its arrival in the screen (rule 20 (e)): opacity only. */
  --motion-reveal: 300ms;
  /* Movements of state (ticket 0237, B1): a colour that changes at the hover of a
     control, once, never on scroll, never in a loop, only under
     prefers-reduced-motion: no-preference (site.css, test of the stylesheet). */
  --motion-hover: 160ms;
  --ease-state: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* The screens of the site (ticket 0237, sub-lot B1; reduced by ticket 0271, Q232 (a), to
   what differs from the documents): the corner of the controls and the width of the pages
   of direction D, and the focus indicator in its Visa (rule 20 (c): 7,30 on the page, 8,01
   on a card, 6,63 on the muted background; its Visa clair on the Nuit, 7,58; 3 pixels
   kept, docs/12, "Formes"). Every colour is the one of the block above. */
:root.site {
  --radius: 12px;
  --container: var(--container-wide);
  --color-focus: var(--color-action);
  --color-focus-on-band: var(--color-brand-on-band);
}
