/**
 * A documented, deliberately small handful of utilities (design-system §5:
 * "utilities limited to a documented handful"). Not a utility framework —
 * anything beyond this list belongs in components.css instead.
 */
@layer utilities {
  /* .nn-flow and .nn-visually-hidden live in base.css (single source) */

  .nn-text-muted { color: var(--nn-text-muted); }
  .nn-text-center { text-align: center; }

  .nn-mt-0 { margin-top: 0; }
  .nn-gap-4 { gap: var(--nn-space-4); }
  .nn-gap-5 { gap: var(--nn-space-5); }

  .nn-hidden { display: none; }

  @media (min-width: 1280px) {
    .nn-xl\:block { display: block; }
    .nn-xl\:hidden { display: none; }
  }
}

/**
 * Print styles (design-foundations.md §10 — the one genuine gap found in
 * the Milestone 5 design-system audit; everything else in that spec was
 * already implemented across Milestones 1-4 and is NOT being redone here).
 *
 * Placed in the 'utilities' layer deliberately: it's the highest-
 * precedence layer in our declared order (tokens, base, components,
 * utilities), so these rules win unconditionally over component-specific
 * colors and higher-specificity state selectors like
 * `.nn-back-to-top[data-visible="1"]` WITHOUT needing !important — the
 * same layer-precedence mechanism the Milestone 2 hamburger-visibility
 * bug taught us, applied deliberately this time instead of discovered
 * as a bug.
 */
@layer utilities {
  @media print {
    /* Hide chrome/navigation regions (spec: "hide nav/footer/ads/
       related-modules"); tool shell, guide, and FAQ content are
       deliberately NOT hidden here, so inputs/results/article content
       print fully, per spec. */
    .nn-shell-header,
    .nn-shell-footer,
    .nn-shell-mobile-nav,
    .nn-back-to-top,
    .nn-announcement,
    .nn-shell-sidebar {
      display: none;
    }

    /* Black-on-white forced, regardless of dark mode or component colors */
    * {
      background: white;
      color: black;
      box-shadow: none;
    }

    a {
      color: black;
      text-decoration: underline;
    }
    /* URLs of key links printed after anchor text (spec) */
    a[href]::after {
      content: " (" attr(href) ")";
      font-size: var(--nn-text-xs);
    }

    .nn-tool-shell {
      border: 1px solid black;
    }
  }

  @page {
    margin: 2cm;
  }
}