/* theme.css — tokeny motywu. Ciemny: oranżeria nocą (mosiądz na głębokiej
   zieleni morskiej). Jasny: oranżeria rano (mosiądz na perłowej zieleni).
   Jedna drabina promieni (10/14/18) i odstępów (6/10/16/24), jedno światło
   z góry: jasna krawędź u góry, własny cień u dołu, cień rzucony niżej. */
:root {
  --font: ui-rounded, "SF Pro Rounded", "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r-s: 10px; --r-m: 14px; --r-l: 18px;
  --sp-1: 6px; --sp-2: 10px; --sp-3: 16px; --sp-4: 24px;
  --t-fast: 140ms; --t-med: 220ms;
  --ease: cubic-bezier(.2, .8, .2, 1);
}
body[data-theme="dark"] {
  --bg: #07141a;
  --veil: rgba(4, 12, 15, .64);
  --card: #10262c;
  --card-2: #15313a;
  --card-3: #1b3b45;
  --edge: rgba(243, 212, 140, .22);
  --edge-strong: rgba(243, 212, 140, .45);
  --text: #f4efe0;
  --text-2: #bfcac3;
  --text-3: #93a39c;
  --gold: #e8bd62;
  --gold-2: #f7dc98;
  --gold-3: #a67a2c;
  --gold-ink: #2a1b04;
  --good: #6ad8a2;
  --bad: #ff8a80;
  --lift: inset 0 1px 0 rgba(255, 255, 255, .10), inset 0 -2px 0 rgba(0, 0, 0, .28), 0 10px 26px rgba(0, 0, 0, .42);
  --lift-s: inset 0 1px 0 rgba(255, 255, 255, .10), inset 0 -2px 0 rgba(0, 0, 0, .25), 0 4px 12px rgba(0, 0, 0, .32);
  --track: rgba(255, 255, 255, .10);
  color-scheme: dark;
}
body[data-theme="light"] {
  --bg: #e8f1ea;
  --veil: rgba(236, 244, 238, .66);
  --card: #fffdf7;
  --card-2: #f5f0e3;
  --card-3: #ebe3d0;
  --edge: rgba(150, 110, 40, .20);
  --edge-strong: rgba(150, 110, 40, .42);
  --text: #1c2925;
  --text-2: #475852;
  --text-3: #66756f;
  --gold: #c38f34;
  --gold-2: #e7bf6a;
  --gold-3: #8e6423;
  --gold-ink: #fffaf0;
  --good: #1d9c61;
  --bad: #cc3f3f;
  --lift: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -2px 0 rgba(120, 90, 30, .10), 0 10px 24px rgba(40, 60, 50, .16);
  --lift-s: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -2px 0 rgba(120, 90, 30, .10), 0 4px 10px rgba(40, 60, 50, .12);
  --track: rgba(30, 50, 40, .10);
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html, body {
  margin: 0; height: 100%; overflow: hidden; background: var(--bg); color: var(--text);
  font-family: var(--font); -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none; user-select: none; overscroll-behavior: none; touch-action: manipulation;
}
button { font: inherit; color: inherit; }
.ic { width: 22px; height: 22px; flex: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}