/**
 * ./assets/css/base.css
 *
 * Base CSS variables, resets, global element defaults, and shared LAB545 theme tokens.
 */

:root {
  --daf-color-yellow: #fff35a;
  --daf-color-yellow-soft: #fff670;
  --daf-color-black: #242424;
  --daf-color-black-soft: #303030;
  --daf-color-white: #ffffff;
  --daf-color-gray: #b8b8b3;
  --daf-color-gray-light: #d8d8d0;
  --daf-color-border: #242424;

  --daf-page-max-width: 1440px;
  --daf-content-width: 1160px;
  --daf-narrow-width: 900px;

  --daf-space-2xs: 0.25rem;
  --daf-space-xs: 0.5rem;
  --daf-space-sm: 1rem;
  --daf-space-md: 1.5rem;
  --daf-space-lg: 2rem;
  --daf-space-xl: 4rem;
  --daf-space-2xl: 6rem;

  --daf-border-radius-card: 14px;
  --daf-border-radius-pill: 999px;
  --daf-border-width: 1px;
  --daf-transition-fast: 160ms ease;

  --daf-font-serif: "Instrument Serif", Georgia, "Times New Roman", Times, serif;
  --daf-font-mono: "IBM Plex Mono", "Courier New", Courier, monospace;
  --daf-font-sans: "IBM Plex Mono", Arial, Helvetica, sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  scroll-behavior: smooth;
}

body {
  min-height: 100%;
  margin: 0;
  background: var(--daf-color-white);
  color: var(--daf-color-black);
  text-rendering: geometricPrecision;
}

body.admin-bar .site-header {
  top: 32px;
}

body.admin-bar .daf-program-nav {
  top: 32px;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

img {
  height: auto;
}

a {
  color: inherit;
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  appearance: none;
}

::selection {
  background: var(--daf-color-black);
  color: var(--daf-color-yellow);
}

.skip-link {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 1000;
  transform: translateY(-200%);
  border: var(--daf-border-width) solid var(--daf-color-black);
  border-radius: var(--daf-border-radius-pill);
  padding: 0.5rem 0.9rem;
  background: var(--daf-color-yellow);
  color: var(--daf-color-black);
  font-family: var(--daf-font-mono);
  font-size: 0.85rem;
  line-height: 1;
  text-decoration: none;
}

.skip-link:focus {
  transform: translateY(0);
}

@media (max-width: 782px) {
  body.admin-bar .site-header {
    top: 46px;
  }

  body.admin-bar .daf-program-nav {
    top: 46px;
  }
}