/* Névjegygyűjtő × biztributor — tokens.css
   Szerkezet: handoff 4. pont. A [data-theme] szelektor bármely elemen is működik
   (pl. előnézeti keretben); élesben a <html> kapja. A 3. pont minden tokenje megmaradt. */

:root, [data-theme="light"]{
  /* — szín (világos) — */
  --bg:#F6F1F5;
  --surface:#FFFFFF;
  --raised:#FBF7FA;
  --sunken:#EFE6ED;
  --ink:#221029;
  --muted:#5C4A64;
  --faint:#78667F;
  --line:#E4D8E1;
  --line-strong:#9C879A;
  --accent:#B8338F;
  --accent-hover:#9E2579;
  --accent-ink:#FFFFFF;
  --accent-soft:#F7DDEE;
  --accent-strong:#9A1F73;
  --signal:#6B2E8F;
  --signal-soft:#EFE4F6;
  --ok:#B8338F;
  --ok-soft:#F7DDEE;
  --err:#B3261E;
  --err-ink:#FFFFFF;
  --err-soft:#FADFDC;
  --hero:#2A0F38;
  --hero-ink:#F8EEF5;
  --hero-muted:#CDB8D4;
  --hero-accent:#E25CB6;
  --hero-line:rgba(248,238,245,.30);
  --hero-edge:transparent;
  --scan-bg:#0E0613;
  --scan-dim:rgba(14,6,19,.55);
  --inverse:#221029;
  --inverse-ink:#F6F1F5;
  --inverse-accent:#F59AD6;
  --tab-on:#221029;
  --tab-on-ink:#FFFFFF;
  --qr-bg:#FFFFFF;
  --qr-ink:#2A0F38;
  --overlay:rgba(34,16,41,.45);
  --shadow:0 1px 2px rgba(42,15,56,.06), 0 8px 24px rgba(42,15,56,.08);
  --shadow-sm:0 1px 2px rgba(42,15,56,.08);
  --shadow-lg:0 -2px 8px rgba(42,15,56,.06), 0 -16px 48px rgba(42,15,56,.14);
  color-scheme:light;

  /* — módfüggetlen tokenek: mindkét módban érvényesek — */
  --f-display:"Bricolage Grotesque", "Avenir Next", system-ui, sans-serif;
  --f-body:"Schibsted Grotesk", "Helvetica Neue", system-ui, sans-serif;
  --f-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:48px;
  --text-xs:0.75rem;
  --text-sm:0.875rem;
  --text-base:1rem;
  --text-lg:1.125rem;
  --text-xl:1.375rem;
  --text-2xl:1.75rem;
  --text-3xl:2.25rem;
  --r:12px;
  --r-sm:8px;
  --r-md:12px;
  --r-lg:20px;
  --r-pill:999px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --dur-fast:120ms;
  --dur:220ms;
  --dur-slow:360ms;
  --navh:64px;
  --hit:44px;
  --lh:1.45;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#140919;
    --surface:#1D1025;
    --raised:#26152F;
    --sunken:#2F1C3A;
    --ink:#F5ECF3;
    --muted:#BFAEC6;
    --faint:#9A87A2;
    --line:#3B2648;
    --line-strong:#7C6685;
    --accent:#E25CB6;
    --accent-hover:#EC7CC6;
    --accent-ink:#1C0822;
    --accent-soft:#4A1A40;
    --accent-strong:#F59AD6;
    --signal:#C9A2E6;
    --signal-soft:#35214D;
    --ok:#E25CB6;
    --ok-soft:#4A1A40;
    --err:#F28B82;
    --err-ink:#2A0A08;
    --err-soft:#3D1A1D;
    --hero:#2E1240;
    --hero-ink:#F8EEF5;
    --hero-muted:#CDB8D4;
    --hero-accent:#E25CB6;
    --hero-line:rgba(248,238,245,.24);
    --hero-edge:#4A2A5E;
    --scan-bg:#0E0613;
    --scan-dim:rgba(14,6,19,.6);
    --inverse:#F5ECF3;
    --inverse-ink:#1D1025;
    --inverse-accent:#9A1F73;
    --tab-on:#E25CB6;
    --tab-on-ink:#1C0822;
    --qr-bg:#FFFFFF;
    --qr-ink:#2A0F38;
    --overlay:rgba(0,0,0,.6);
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35);
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);
    --shadow-lg:0 -2px 8px rgba(0,0,0,.4), 0 -16px 48px rgba(0,0,0,.5);
    color-scheme:dark;
  }
}

:root[data-theme="dark"], [data-theme="dark"]{
  --bg:#140919;
  --surface:#1D1025;
  --raised:#26152F;
  --sunken:#2F1C3A;
  --ink:#F5ECF3;
  --muted:#BFAEC6;
  --faint:#9A87A2;
  --line:#3B2648;
  --line-strong:#7C6685;
  --accent:#E25CB6;
  --accent-hover:#EC7CC6;
  --accent-ink:#1C0822;
  --accent-soft:#4A1A40;
  --accent-strong:#F59AD6;
  --signal:#C9A2E6;
  --signal-soft:#35214D;
  --ok:#E25CB6;
  --ok-soft:#4A1A40;
  --err:#F28B82;
  --err-ink:#2A0A08;
  --err-soft:#3D1A1D;
  --hero:#2E1240;
  --hero-ink:#F8EEF5;
  --hero-muted:#CDB8D4;
  --hero-accent:#E25CB6;
  --hero-line:rgba(248,238,245,.24);
  --hero-edge:#4A2A5E;
  --scan-bg:#0E0613;
  --scan-dim:rgba(14,6,19,.6);
  --inverse:#F5ECF3;
  --inverse-ink:#1D1025;
  --inverse-accent:#9A1F73;
  --tab-on:#E25CB6;
  --tab-on-ink:#1C0822;
  --qr-bg:#FFFFFF;
  --qr-ink:#2A0F38;
  --overlay:rgba(0,0,0,.6);
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-lg:0 -2px 8px rgba(0,0,0,.4), 0 -16px 48px rgba(0,0,0,.5);
  color-scheme:dark;
}

@media (prefers-reduced-motion: reduce){
  :root{ --dur-fast:0ms; --dur:0ms; --dur-slow:0ms; }
}