/* Evince design tokens — copied from evince-site/styles/evince.css.
 * Source of truth is https://evince.app and github.com/evince-app/evince-site.
 * Do not invent values here. If a role has no token, add one named for the ROLE
 * (--ev-step-active-fg), never for the colour (--ev-brownish).
 */
:root {
  color-scheme: light;

  /* Palette — the seven earth tones, plus the two neutral grounds. */
  --ev-rust:       #7A3E2B; /* dark surfaces, deep text */
  --ev-sand:       #E7D8C5; /* light surfaces */
  --ev-terracotta: #C86A4A; /* the one hero accent */
  --ev-mustard:    #D4A32A; /* emphasis on dark only */
  --ev-teal:       #3D6D6E; /* secondary, data */
  --ev-olive:      #6B705C; /* muted, supporting text */
  --ev-clay:       #D48D7A; /* soft, tertiary, on rust */
  --ev-cream:      #FDFBF7; /* cards on sand */
  --ev-page:       #F2EDE6; /* the page ground behind a sheet */

  /* Semantic roles — prefer these over raw palette names. */
  --ev-text-deep:      var(--ev-rust);
  --ev-text-muted:     var(--ev-olive);
  --ev-text-on-rust:   var(--ev-sand);
  --ev-text-on-rust-muted: rgba(231, 216, 197, 0.9);
  --ev-accent:         var(--ev-terracotta);
  --ev-accent-on-rust: var(--ev-mustard);

  /* Rules and dividers are always rust at low opacity — never accent bars. */
  --ev-rule:         rgba(122, 62, 43, 0.14);
  --ev-rule-strong:  rgba(122, 62, 43, 0.16);
  --ev-rule-link:    rgba(122, 62, 43, 0.30);
  --ev-rule-link-2:  rgba(122, 62, 43, 0.35);
  --ev-rule-on-rust: rgba(231, 216, 197, 0.35);

  /* Type */
  --ev-font-display: "Instrument Serif", Georgia, "Times New Roman", serif;
  --ev-font-ui: "Space Grotesk", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", Roboto, sans-serif;

  /* Scale. Upper bounds are the spec sizes, reached at >= ~1240px. */
  --ev-size-display: clamp(2.75rem, 7.75vw, 6rem);    /* 96 */
  --ev-size-h1:      clamp(2.125rem, 4.2vw, 3.25rem); /* 52 */
  --ev-size-h2:      clamp(1.625rem, 2.75vw, 2.125rem); /* 34 */
  --ev-size-quote:   clamp(1.375rem, 2.4vw, 1.875rem); /* 30 */
  --ev-size-lead:    1.25rem;   /* 20 */
  --ev-size-body:    1rem;      /* 16 */
  --ev-size-small:   0.9375rem; /* 15 */
  --ev-size-fine:    0.8125rem; /* 13 */
  --ev-size-eyebrow: 0.75rem;   /* 12 */

  --ev-leading-display: 0.95;
  --ev-leading-h1: 1.1;
  --ev-leading-h2: 1.2;
  --ev-leading-lead: 1.6;
  --ev-leading-body: 1.65;
  --ev-leading-loose: 1.9;

  --ev-tracking-wordmark: 0.14em;
  --ev-tracking-eyebrow: 0.2em;
  --ev-tracking-tagline: 0.42em;

  /* Space */
  --ev-space-1: 6px;
  --ev-space-2: 10px;
  --ev-space-3: 14px;
  --ev-space-4: 20px;
  --ev-space-5: 26px;
  --ev-space-6: 36px;
  --ev-space-7: 48px;
  --ev-space-8: 64px;
  --ev-space-9: 72px;

  /* Shape */
  --ev-radius-card: 20px;
  --ev-radius-tile: 26%; /* of tile size */
  --ev-radius-pill: 999px;

  --ev-shadow-card:       0 18px 44px rgba(122, 62, 43, 0.12);
  --ev-shadow-sheet:      0 24px 60px rgba(122, 62, 43, 0.14);
  --ev-shadow-btn-hover:  0 12px 26px rgba(122, 62, 43, 0.28);
  --ev-shadow-btn-active: 0 2px 8px rgba(122, 62, 43, 0.22);

  /* Motion — one easing, everywhere. */
  --ev-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ev-dur-micro: 250ms;
  --ev-dur-press: 90ms;
  --ev-dur-entrance: 900ms;
  --ev-dur-entrance-fast: 600ms;
  --ev-stagger: 90ms;
}

/* Roles the site has no token for, because they are app furniture rather than marketing surface.
   Named for what they DO. Values are existing palette tokens — nothing new is invented here. */
:root {
  --ev-surface-card:      var(--ev-cream);
  --ev-surface-settled:   #FFFDFA;               /* cream, one step warmer: a card already judged */
  --ev-surface-page:      var(--ev-cream);
  --ev-on-accent:         #fff;                  /* the only pure white in the system */

  /* The stepper. The active step is marked with the accent and reads in deep text, not reversed
     out of a filled chip: white on terracotta measures 3.74:1 and cream on terracotta 3.62:1, both
     short of AA's 4.5:1 for text. The accent still identifies the step — as the dot fill and the
     border — while the label itself sits at 7.96:1. A page-level rust fill was the other option
     and it turns a progress indicator into a second header. */
  --ev-step-active-fg:    var(--ev-rust);
  --ev-step-active-mark:  var(--ev-accent);
  --ev-step-active-tint:  rgba(200, 106, 74, 0.12);
  --ev-step-done-fg:      var(--ev-teal);
  --ev-step-todo-fg:      var(--ev-text-muted);

  --ev-focus-ring:        var(--ev-accent);
  --ev-tint-sand:         rgba(231, 216, 197, 0.4);   /* the gap panel */
  --ev-scrim:             rgba(253, 251, 247, 0.93);  /* the waiting overlay */
}