/* amadan — the sign-in screen (/signin, and /auth/verify, which is the
   same page on its confirm step). That screen is rastrillo's, drawn in
   its stage shell with the "day" theme, so it does not load amadan.css:
   that file's base rules (body, main, h1, :focus-visible) would fight
   rastrillo's components. This file is linked from the page set's head
   block instead, after day's theme, and does the cheapest thing
   rastrillo's design system allows: it sets day's tokens to amadan's
   palette. Every component on the card paints itself from them.

   Not in chromeAssets, so csslinks_test.go names it as linked from the
   sign-in page; signin_brand_test.go holds each value below to the
   amadan.css token it copies, in both schemes, so the two cannot drift.

   Dark mode is amadan.css's: the OS preference, one media block. The
   sign-in page sets no data-theme, so day's light-dark() pairs resolve
   from the same preference. */

:root {
  --rst-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* --font */
  --rst-radius: 8px; /* --radius */
  --rst-radius-sm: 6px; /* --radius-ctl */

  /* Surfaces: the card is amadan's page colour, and the ground behind
     it the inset colour, as on the home page's hero. --rst-bg is the
     body's, so the field reaches the scrollbar gutter too. */
  --rst-bg: #f4f7f5; /* --bg-inset */
  --rst-surface: #ffffff; /* --bg */
  --rst-surface-2: #f4f7f5; /* --bg-inset */
  --rst-line: #d5ddd9; /* --border */
  /* amadan has no 3:1 line. The card's edge and the address field's
     border need one: amadan's ink grey, 3.53:1 on the card and 3.27:1
     on the field. */
  --rst-line-strong: #808b85;

  --rst-text: #181d1b; /* --fg */
  --rst-text-muted: #5c6660; /* --fg-muted */
  --rst-text-faint: #5c6660; /* --fg-muted */

  /* The accent. day derives the focus ring, the halo and the row tints
     from --rst-accent; the button fills are set outright, so the
     Continue button is amadan's teal exactly rather than day's
     lightness at teal's hue. White on it is 6.13:1, on the hover 8.10:1. */
  --rst-accent: #0b6e63; /* --accent */
  --rst-accent-strong: #095a51; /* --accent-emph */
  --rst-accent-soft: #e7f2ef; /* --accent-wash */
  --rst-on-accent: #ffffff; /* --on-accent */
  --rst-accent-fill: #0b6e63; /* --accent */
  --rst-accent-fill-hover: #095a51; /* --accent-emph */
  --rst-accent-fill-edge: #08524a;
  --rst-accent-fill-edge-hover: #064640;
  --rst-on-accent-fill: #ffffff; /* --on-accent */

  /* Plain buttons (the passkey door) take amadan's button: the inset
     face, the hairline border, and the accent on hover. */
  --rst-control-face: #f4f7f5; /* --bg-inset */
  --rst-control-face-hover: #f4f7f5; /* --bg-inset */
  --rst-control-border: #d5ddd9; /* --border */
  --rst-control-border-hover: #0b6e63; /* --accent */
  --rst-control-text-hover: #0b6e63; /* --accent */

  --rst-tone-negative-fg: #b03a25; /* --danger */
  --rst-tone-negative-bg: #fbeeea; /* --danger-bg */
}

@media (prefers-color-scheme: dark) {
  :root {
    --rst-bg: #171d1a; /* --bg-inset */
    --rst-surface: #101413; /* --bg */
    --rst-surface-2: #171d1a; /* --bg-inset */
    --rst-line: #2b342f; /* --border */
    /* 3.70:1 on the card, 3.41:1 on the field. */
    --rst-line-strong: #66726c;

    --rst-text: #e7edea; /* --fg */
    --rst-text-muted: #93a09a; /* --fg-muted */
    --rst-text-faint: #93a09a; /* --fg-muted */

    /* Bright verdigris at night, so the label on it is ink, as on
       amadan's own buttons: 8.77:1, and 10.78:1 hovered. */
    --rst-accent: #4cc4b5; /* --accent */
    --rst-accent-strong: #6fd6c9; /* --accent-emph */
    --rst-accent-soft: #14251f; /* --accent-wash */
    --rst-on-accent: #0d1412; /* --on-accent */
    --rst-accent-fill: #4cc4b5; /* --accent */
    --rst-accent-fill-hover: #6fd6c9; /* --accent-emph */
    --rst-accent-fill-edge: #3aa597;
    --rst-accent-fill-edge-hover: #4cc4b5;
    --rst-on-accent-fill: #0d1412; /* --on-accent */

    --rst-control-face: #171d1a; /* --bg-inset */
    --rst-control-face-hover: #171d1a; /* --bg-inset */
    --rst-control-border: #2b342f; /* --border */
    --rst-control-border-hover: #4cc4b5; /* --accent */
    --rst-control-text-hover: #4cc4b5; /* --accent */

    --rst-tone-negative-fg: #f0704f; /* --danger */
    --rst-tone-negative-bg: #321812; /* --danger-bg */
  }
}

/* The backdrop (signin.html): a plain field in the inset colour in
   place of day's waves. --rst-bg is the same colour, for the gutter. */
[amadan-signin-field] { background: var(--rst-bg); }

/* The brand reads as the site header does: the mark at the name's
   side, the name in the header's heavy weight. */
[rst-signin-brand] { align-items: center; flex-direction: row; gap: 0.6rem; }
[rst-signin-mark] { block-size: 2rem; inline-size: 2rem; flex: none; }
[rst-signin-name] { color: var(--rst-text); font-size: 1.5rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1; }