/* Verduona shop — Kraliki / Agent Jack paper & ink. Default DARK. KRA-5957. */

html {
  color-scheme: dark;
  --paper: #121110;
  --paper-2: #1a1917;
  --paper-3: #242320;
  --ink: #f4f3f0;
  --body: rgba(244, 243, 240, 0.88);
  --muted: rgba(244, 243, 240, 0.62);
  --muted-2: rgba(244, 243, 240, 0.42);
  --line: rgba(244, 243, 240, 0.12);
  --line-strong: rgba(244, 243, 240, 0.22);
  --scrim: rgba(0, 0, 0, 0.45);
  --accent: var(--ink);
  --ok: #8fbe9c;
  --ok-ink: #b7d4bf;
  --ok-soft: #1c2a21;
  --wait: #e0cc7a;
  --wait-ink: #e2d39a;
  --wait-soft: #2a2616;
  --danger: #d49a9a;
  --danger-ink: #e0b8b8;
  --danger-soft: #2a1d1d;
  --face-voice: #a7bbd6;
  --face-ok: var(--ok);
  --face-wait: var(--wait);
  --face-manual: #d7b38a;
  --face-operator: #c4bfa6;
  --font-ui: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: Fraunces, "Times New Roman", Georgia, serif;
  --max: 1120px;
  --gutter: 24px;
  --radius: 0;
}

html.light,
html.theme-light,
html[data-theme="light"] {
  color-scheme: light;
  --paper: #ffffff;
  --paper-2: #f7f7f5;
  --paper-3: #eeeeee;
  --ink: #000000;
  --body: rgba(0, 0, 0, 0.82);
  --muted: rgba(0, 0, 0, 0.6);
  --muted-2: rgba(0, 0, 0, 0.42);
  --line: #0000001a;
  --line-strong: rgba(0, 0, 0, 0.22);
  --scrim: rgba(0, 0, 0, 0.2);
  --ok-ink: #2e5a3c;
  --ok-soft: #e8f3eb;
  --wait-ink: #6a5818;
  --wait-soft: #f6efd2;
  --danger-ink: #7a3d3d;
  --danger-soft: #f5e6e6;
}

@media (max-width: 480px) {
  html { --gutter: 16px; }
}
@media (min-width: 768px) {
  html { --gutter: 40px; }
}

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

html, body {
  margin: 0;
  min-height: 100%;
  max-width: 100%;
  overflow-x: clip;
  background: var(--paper);
  color: var(--body);
}

body {
  font-family: var(--font-ui);
  font-size: 1.0625rem;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
}

a { color: inherit; }

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