/* Imprint bundles Roboto Mono (Christian Robertson, OFL 1.1) under the
   private family alias "Imprint Mono". The alias is load-bearing: the public
   Home names "Roboto Mono" without bundling it, so a global Roboto Mono
   @font-face would retroactively restyle an approved surface. Home adopts the
   real face only through its own typography review.

   Files are the Google Fonts v31 subsetted WOFF2 builds of the variable
   source RobotoMono[wght].ttf, so one file serves every weight in 100-700 and
   none is synthesized. Verify a re-download against these hashes before
   bundling; Google reissues subsets without changing the family name.

     latin     32,796 bytes  sha256
       b81cd55177300649be8f95b3b747d721ce607e8ed2856e25bd0c630cfd631faf
     cyrillic  18,592 bytes  sha256
       4052cc0b0f8b1b39da6cfaf90460f8b3c84dfc4b7562e9308ffa0998c3b9a005

   The italic faces are deliberately not bundled: no Imprint role renders mono
   italic, because italic belongs to authored material, which is Georgia.
   Adding a mono italic role means re-adding those files and re-measuring.

   unicode-range is copied verbatim from Google's served CSS, so a page
   fetches only the scripts it renders. See journal-presentation-themes.md
   section 3.7. */
@font-face {
  font-family: "Imprint Mono";
  src: url("/assets/roboto-mono-variable-latin-4913e56f.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 700;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Imprint Mono";
  src: url("/assets/roboto-mono-variable-cyrillic-fff2c113.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 700;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* Imprint: an independent-print treatment of the shared semantic DOM. Every
   value below is recorded in journal-presentation-themes.md section 3.7 and
   was measured against the real bundled face, in Russian, at 320-1440px.
   Imprint is light-only by decision: it receives no inferred dark variant. */
@layer presets {
  body[data-journal-presentation="imprint"],
  .journal-surface[data-journal-presentation="imprint"] {
    color-scheme: light;

    /* Paper, ink, and one warm red. `--color-border` is ink because Imprint
       draws rules and frames, never tinted hairlines. */
    --color-canvas: #d7c9ac;
    --color-surface: #d7c9ac;
    --color-on-strong: #efe9dc;
    --color-text: #0a0a0a;
    --color-text-muted: #4a423a;
    --color-border: #0a0a0a;
    --color-border-strong: #0a0a0a;
    --color-accent: #7c211d;
    --color-accent-strong: #5e1714;
    --color-danger: #7c211d;
    /* Success is ink, not green: status marks are outlines and never borrow
       a hue. A red-bordered pill beside red accent links read as a
       destructive control in the spike, which is why the three colour roles
       — accent, status, destructive — stay separate. */
    --color-success: #0a0a0a;
    --color-selection: #d0bc95;
    --color-disabled-text: #4a423a;
    --color-disabled-surface: #c7b28a;
    --color-status-attention-surface: #c7b28a;
    --color-status-attention-text: #0a0a0a;
    --color-status-danger-surface: #d7c9ac;
    --color-status-danger-text: #0a0a0a;
    --color-status-neutral-surface: #d7c9ac;
    --color-status-neutral-text: #0a0a0a;
    --color-status-success-surface: #d7c9ac;
    --color-status-success-text: #0a0a0a;

    /* `--color-focus` is deliberately not set. The shared #0a3d8f ring sits
       at 3px offset, so it lands on paper even when the control beneath it
       has reversed to ink, and a paper-toned ring would lose exactly the
       visibility a ring exists to provide. It is the one colour Imprint
       accepts from outside its palette. */

    /* Georgia carries authored material; the private mono alias carries
       wayfinding. Source Sans 3 stays available for instructional prose and
       is addressed by role below. */
    --font-reading: Georgia, Cambria, "Times New Roman", Times, serif;
    --font-interface: "Imprint Mono", ui-monospace, SFMono-Regular, Menlo,
      Consolas, monospace;

    /* 42.5rem is the measured 680px column at 1440px. */
    --journal-canvas: #d7c9ac;
    --journal-width-feed: 42.5rem;
    --journal-width-reading: 42.5rem;
    --width-wide: 42.5rem;
    --width-reading: 42.5rem;
    --journal-meta-letter-spacing: 0.08em;
    --journal-meta-transform: uppercase;
    --journal-post-title-color: #0a0a0a;
    /* Titles do not tint on hover; the link rule reverses them instead. */
    --journal-post-title-hover: #0a0a0a;
    --journal-featured-image-margin: 1.75rem 0 1rem;
    --journal-featured-caption-color: #4a423a;
  }
}

/* Presets describe component variants here so they remain below the permanent
   component layer in the architecture while outranking its base selectors. */
@layer components {
  /* The same paper substrate and stipple language as the public Home, which
     is the surface Imprint is a continuation of. Earlier it specified a very
     pale #f7f3ea with a feTurbulence overlay so faint it changed about 0.6%
     of pixels, and the preset read as a light Journal rather than as Home's
     print shell -- the bridge was the point, so that was the wrong trade.
     The distinction from the other presets comes from composition,
     typography and rules, not from an unrelated beige.

     The stipple is a background, not an overlay. A background cannot paint
     over content, which removes the whole class of bug the old
     `z-index: -1` existed to avoid. Dense surfaces quiet it for free: any
     component on an opaque `--color-surface` simply hides it. */
  body[data-journal-presentation="imprint"] {
    background-color: #d7c9ac;
    font-family: var(--font-interface);
    /* A missing face must render plainly rather than be faked. Every mono
       role states 400 or 700, because 700 and 800 are indistinguishable in
       this variable face and a hierarchy built on that pair would be
       invisible. */
    font-synthesis: none;
  }

  /* ── Authored material: Georgia ─────────────────────────────── */

  body[data-journal-presentation="imprint"] :where(.site-main) :is(h1, h2, h3, h4) {
    font-family: var(--font-reading);
    font-weight: 700;
    letter-spacing: -0.01em;
  }

  body[data-journal-presentation="imprint"] .post-body,
  body[data-journal-presentation="imprint"] .post-card__excerpt,
  body[data-journal-presentation="imprint"] .comment__body {
    font-family: var(--font-reading);
    line-height: var(--leading-copy);
  }

  body[data-journal-presentation="imprint"] .post-body,
  body[data-journal-presentation="imprint"] .post-card__excerpt {
    font-size: 1.0625rem;
  }

  body[data-journal-presentation="imprint"] .comment__body {
    font-size: 1rem;
  }

  body[data-journal-presentation="imprint"] .post-body blockquote {
    border-left: 2px solid #0a0a0a;
    font-style: italic;
  }

  body[data-journal-presentation="imprint"] .comment__body--tombstone {
    font-family: var(--font-reading);
    font-size: 1rem;
    font-style: italic;
  }

  /* ── Instructional prose: Source Sans 3 ─────────────────────── */

  body[data-journal-presentation="imprint"] .form-hint,
  body[data-journal-presentation="imprint"] .feed__chronology,
  body[data-journal-presentation="imprint"] .flash,
  body[data-journal-presentation="imprint"] .flash__message,
  body[data-journal-presentation="imprint"] .settings-section__header p {
    font-family: "Source Sans 3", Arial, Helvetica, sans-serif;
  }

  body[data-journal-presentation="imprint"] .form-hint {
    font-size: 0.75rem;
  }

  body[data-journal-presentation="imprint"] .feed__chronology {
    font-size: 0.875rem;
  }

  body[data-journal-presentation="imprint"] .settings-section__header p {
    font-size: 1rem;
  }

  /* ── Links: ink with an accent rule, reversing on interaction ── */

  body[data-journal-presentation="imprint"] a {
    color: #0a0a0a;
    text-decoration: underline;
    text-decoration-color: #7c211d;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
  }

  /* The only interaction treatment in the preset: nothing tints.

     The specificity here is load-bearing and was measured, not guessed.
     Component hover rules such as
     `body:not(.error-layout) .post-card__title a:hover` (0,3,2) and
     `body:not(.error-layout) .moderation-queue__identity:hover` (0,3,1) load
     after this file, so a plainer selector at (0,2,2) set the ink background
     and then lost the colour back to them: ink on ink for card titles, and
     accent red on ink -- about 2.7:1 -- for identity and directory links.
     `:not(.error-layout)` and `:not(.btn)` take this to (0,4,2), above both,
     and excluding `.btn` leaves the button states to the button rules. */
  body[data-journal-presentation="imprint"]:not(.error-layout) a:hover:not(.btn),
  body[data-journal-presentation="imprint"]:not(.error-layout) a:focus-visible:not(.btn) {
    background: #0a0a0a;
    color: #efe9dc;
    text-decoration-color: #efe9dc;
  }

  /* Four accent rules in one card footer made a tag look like the comment
     action, so footer tags carry no underline. */
  body[data-journal-presentation="imprint"] .post-card__tags a,
  body[data-journal-presentation="imprint"] .post-tags__item a {
    text-decoration: none;
  }

  /* ── Wayfinding: Imprint Mono ───────────────────────────────── */

  /* The stipple goes on the shell's own containers, as Home draws it, not on
     `body`. A body background with no background on `html` is propagated to
     the canvas, and the body box then paints nothing — which is how an
     earlier attempt rendered a texture that measured as literally zero
     changed pixels. */
  body[data-journal-presentation="imprint"] .site-header,
  body[data-journal-presentation="imprint"] .site-main {
    background-color: #d7c9ac;
    background-image:
      radial-gradient(rgb(10 10 10 / 7%) 0.45px, transparent 0.55px),
      radial-gradient(rgb(239 233 220 / 12%) 0.45px, transparent 0.55px);
    background-position: 0 0, 3px 3px;
    background-size: 6px 6px;
  }

  body[data-journal-presentation="imprint"] .site-header {
    border-bottom: 2px solid #0a0a0a;
  }

  body[data-journal-presentation="imprint"] .site-nav a,
  body[data-journal-presentation="imprint"] .site-nav summary,
  body[data-journal-presentation="imprint"] .site-nav button {
    font-family: var(--font-interface);
    font-size: 0.75rem;
    font-weight: 400;
    text-decoration: none;
  }

  /* New post is the only emphasised action. The blanket rule above is
     (0,2,2); a plain `.site-nav__new-post` class list would be (0,2,1) and
     lose, which is exactly how the spike rendered it at 400 while the
     stylesheet claimed otherwise. Keeping `.site-nav` in the selector puts
     this at (0,3,2). The weight is asserted, not merely permitted. */
  body[data-journal-presentation="imprint"] .site-nav a.site-nav__new-post {
    font-weight: 700;
  }

  /* Identity emphasis is a different thing from action emphasis, and states
     700 because 700 and 800 render identically in this face.

     `:not(.error-layout)` is not decoration. The shared rules are
     `body:not(.error-layout) .post-card__author` at (0,2,1); without the
     pseudo-class these would tie at (0,2,1) and lose, because
     `components/posts.css` loads after this file. That is the spike's
     finding recurring: the identity links rendered 800 while the stylesheet
     claimed 700. Measured on the leaf, not on `.post-card__meta`, which
     wraps the link and reports its own weight instead. */
  body[data-journal-presentation="imprint"]:not(.error-layout) .post-card__author,
  body[data-journal-presentation="imprint"]:not(.error-layout) .post-reading__author-link,
  body[data-journal-presentation="imprint"]:not(.error-layout) .comment__identity > a,
  body[data-journal-presentation="imprint"]:not(.error-layout) .notification__actor {
    font-family: var(--font-interface);
    font-weight: 700;
  }

  body[data-journal-presentation="imprint"]:not(.error-layout) .notification__actor {
    font-size: 0.875rem;
  }

  body[data-journal-presentation="imprint"]:not(.error-layout) .post-card__author {
    font-size: 0.6875rem;
  }

  body[data-journal-presentation="imprint"]:not(.error-layout) .post-reading__author-link {
    font-size: 0.75rem;
  }

  body[data-journal-presentation="imprint"]:not(.error-layout) .comment__identity > a {
    font-size: 0.875rem;
  }

  /* The editor's italic command shows its affordance as an italic glyph, and
     Imprint Mono bundles no italic. Georgia has a real one, so the button
     keeps its meaning instead of rendering upright under
     `font-synthesis: none` or being faked. */
  body[data-journal-presentation="imprint"] .post-editor__command em {
    font-family: var(--font-reading);
  }

  /* `strong` and `b` are UA `font-weight: bolder`, which resolves against the
     inherited weight: inside a 700 label they compute to 900. Under Imprint
     700 is the maximum that exists, so 700 is what they should say. Georgia
     carries a real bold at 700, so authored emphasis is unaffected. */
  body[data-journal-presentation="imprint"] strong,
  body[data-journal-presentation="imprint"] b {
    font-weight: 700;
  }

  /* 700 is this face's axis maximum, so the shared components' 800 renders
     as 700 and the declaration becomes a silent lie -- which is exactly what
     hid the author identity links' real weight through a full review. Imprint
     therefore states 700 everywhere the shared components state 800, and
     `ImprintTypefaceTest` fails on any mono weight above it rather than
     trusting these rules to have landed. The prefix carries
     `:not(.error-layout)` because several of these rules already do, and
     `components/*.css` loads after this file. */
  body[data-journal-presentation="imprint"]:not(.error-layout) .admin-search__field label,
  body[data-journal-presentation="imprint"]:not(.error-layout) .admin-table tbody th,
  body[data-journal-presentation="imprint"]:not(.error-layout) .admin-facts dt,
  body[data-journal-presentation="imprint"]:not(.error-layout) .admin-audit__details dt,
  body[data-journal-presentation="imprint"]:not(.error-layout) .site-header__brand-mark,
  body[data-journal-presentation="imprint"]:not(.error-layout) .community-profile__handle,
  body[data-journal-presentation="imprint"]:not(.error-layout) .form-field > label,
  body[data-journal-presentation="imprint"]:not(.error-layout) .form-field > .field_with_errors > label,
  body[data-journal-presentation="imprint"]:not(.error-layout) .form-fieldset > legend,
  body[data-journal-presentation="imprint"]:not(.error-layout) .mod-dashboard__work-link,
  body[data-journal-presentation="imprint"]:not(.error-layout) .mod-dashboard__action-details dt,
  body[data-journal-presentation="imprint"]:not(.error-layout) .post-card__read-more,
  body[data-journal-presentation="imprint"]:not(.error-layout) .settings-account__facts dt {
    font-weight: 700;
  }

  body[data-journal-presentation="imprint"] .post-card__meta {
    font-family: var(--font-interface);
    font-size: 0.6875rem;
    font-weight: 400;
    letter-spacing: var(--journal-meta-letter-spacing);
    text-transform: uppercase;
  }

  body[data-journal-presentation="imprint"] .post-card__tags,
  body[data-journal-presentation="imprint"] .post-card__tags a {
    font-family: var(--font-interface);
    font-size: 0.6875rem;
    font-weight: 400;
  }

  body[data-journal-presentation="imprint"] .post-reading__byline {
    font-family: var(--font-interface);
    font-size: 0.75rem;
    font-weight: 400;
  }

  body[data-journal-presentation="imprint"] .post-reading__timestamp {
    font-family: var(--font-interface);
    font-size: 0.625rem;
    font-weight: 400;
  }

  body[data-journal-presentation="imprint"] .post-tags,
  body[data-journal-presentation="imprint"] .post-tags__item a {
    font-family: var(--font-interface);
    font-size: 0.875rem;
    font-weight: 400;
  }

  body[data-journal-presentation="imprint"] .comment__meta {
    font-family: var(--font-interface);
    font-size: 0.75rem;
    font-weight: 400;
  }

  /* `.moderation-queue__identity`, not `.moderation-identity`: the latter
     matches no markup, so this role silently kept the shared 800. The
     pseudo-class beats `body:not(.error-layout) .moderation-queue__identity`
     at (0,2,1), which loads later. */
  body[data-journal-presentation="imprint"]:not(.error-layout) .moderation-queue__identity,
  body[data-journal-presentation="imprint"] .admin-table td {
    font-family: var(--font-interface);
    font-size: 0.875rem;
    font-weight: 700;
  }

  body[data-journal-presentation="imprint"] .admin-table th,
  body[data-journal-presentation="imprint"] table th {
    font-family: var(--font-interface);
    font-weight: 400;
    text-transform: uppercase;
  }

  body[data-journal-presentation="imprint"] .form-field label,
  body[data-journal-presentation="imprint"] .form-field legend {
    font-family: var(--font-interface);
    font-size: 0.875rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  body[data-journal-presentation="imprint"] .settings-nav__list a {
    font-family: var(--font-interface);
    font-size: 0.875rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  /* ── Cards are set with rules, not boxes ────────────────────── */

  body[data-journal-presentation="imprint"] .post-card {
    padding-inline: 0;
    border: 0;
    border-top: 2px solid #0a0a0a;
    border-radius: 0;
    background: transparent;
  }

  body[data-journal-presentation="imprint"] .post-card__footer {
    border-top: var(--border-thin) solid #0a0a0a;
    background: transparent;
    font-family: var(--font-interface);
    font-size: 0.6875rem;
  }

  /* ── Controls: square ink outlines ──────────────────────────── */

  body[data-journal-presentation="imprint"] .btn {
    border: var(--border-thin) solid #0a0a0a;
    border-radius: 0;
    background: #d7c9ac;
    color: #0a0a0a;
    font-family: var(--font-interface);
    font-size: 1rem;
    font-weight: 400;
  }

  body[data-journal-presentation="imprint"] .btn--primary {
    background: #0a0a0a;
    color: #efe9dc;
  }

  /* Destructive is the only red fill on any surface. */
  body[data-journal-presentation="imprint"] .btn--danger {
    border-color: #7c211d;
    background: #7c211d;
    color: #efe9dc;
  }

  /* `:not([disabled])` is load-bearing. Without it this rule and the
     disabled rule below have equal specificity and this one comes later, so
     a disabled destructive control turned deep red under the pointer and
     read as armed. Measured, not predicted from the cascade. */
  body[data-journal-presentation="imprint"] .btn:hover:not([disabled]),
  body[data-journal-presentation="imprint"] .btn:focus-visible:not([disabled]) {
    background: #0a0a0a;
    color: #efe9dc;
  }

  body[data-journal-presentation="imprint"] .btn--danger:hover:not([disabled]),
  body[data-journal-presentation="imprint"] .btn--danger:focus-visible:not([disabled]) {
    border-color: #5e1714;
    background: #5e1714;
    color: #efe9dc;
  }

  /* The preset's own `.btn` colour outranks the shared `.btn[disabled]`
     rule, so without this a disabled control renders identically to an
     available one. Found by measuring states, not by reading the cascade. */
  body[data-journal-presentation="imprint"] .btn[disabled] {
    border-color: #4a423a;
    background: #c7b28a;
    color: #4a423a;
  }

  /* ── Status and required marks: ink outlines, never the accent ── */

  body[data-journal-presentation="imprint"] .status-badge {
    border: var(--border-thin) solid #0a0a0a;
    border-radius: 0;
    background: transparent;
    color: #0a0a0a;
    font-family: var(--font-interface);
    font-size: 0.6875rem;
    font-weight: 400;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  body[data-journal-presentation="imprint"] .status-badge--pending {
    background: #c7b28a;
  }

  /* `.community-tag__badge`, not `.required-tag`, which matches no markup.
     The shared `--required` modifier borrows `--color-accent` for its border
     and `--color-accent-strong` for its text, so under Imprint the badge was
     a red-bordered pill beside red accent links -- the exact reading the
     spike rejected when it separated the three colour roles. */
  body[data-journal-presentation="imprint"] .community-tag__badge {
    border: var(--border-thin) solid #0a0a0a;
    border-radius: 0;
    background: transparent;
    color: #0a0a0a;
    font-family: var(--font-interface);
    font-size: 0.6875rem;
    font-weight: 400;
    text-transform: uppercase;
  }

  body[data-journal-presentation="imprint"] .community-tag__badge--required {
    border-color: #0a0a0a;
    color: #0a0a0a;
  }
}