/* === nkz68- Base Styles (auto-generated, do NOT edit manually) === */
@import '_design_variables.css';

/* --- Easing Library --- */
:root {
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out-quart: cubic-bezier(0.76, 0, 0.24, 1);
  --ease-out-3: cubic-bezier(0.22, 1, 0.36, 1);
}

/* --- Reset --- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body), sans-serif;
  color: hsl(var(--fg-1));
  background: hsl(var(--bg-0));
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* --- Skip Link (a11y) --- */
.nkz68-skip-link {
  position: absolute;
  top: -100%;
  left: 50%;
  transform: translateX(-50%);
  padding: 0.75rem 1.5rem;
  background: var(--accent);
  color: hsl(var(--bg-0));
  border-radius: var(--radius, 6px);
  z-index: 9999;
  font-weight: 600;
  text-decoration: none;
  transition: top 0.2s;
}
.nkz68-skip-link:focus { top: 1rem; }

/* --- Base Typography --- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display), sans-serif;
  line-height: 1.15;
  color: hsl(var(--fg-1));
}
p { max-width: 72ch; }
a { color: var(--accent); text-decoration: none; transition: color 0.2s var(--ease-out-3); }
a:hover { color: var(--accent-hover, var(--accent)); }

/* --- Images --- */
img { max-width: 100%; height: auto; display: block; }

/* --- Selection --- */
::selection { background: var(--accent); color: hsl(var(--bg-0)); }

/* --- Focus visible (keyboard nav) --- */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* --- Scrollbar (dark themes) --- */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: hsl(var(--bg-1)); }
::-webkit-scrollbar-thumb { background: hsl(var(--fg-3)); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: hsl(var(--fg-2)); }