
@font-face { font-family:'Borna'; src:url('fonts/borna-regular-webfont.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Borna'; src:url('fonts/borna-medium-webfont.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Borna'; src:url('fonts/borna-semibold-webfont.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Borna'; src:url('fonts/borna-bold-webfont.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }


/* ═══ DESIGN TOKENS ═══ */
:root {
  --brand-default:#00B489; --brand-dark:#00755A; --brand-darker:#00513E; --brand-darkest:#002D22;
  --brand-light:#A2E2D1; --brand-lighter:#D2F0E8;
  --neutral-white:#FFFFFF; --neutral-lightest:#F7F5F6; --neutral-lighter:#E1E7E7;
  --neutral-light:#9CABB0; --neutral-default:#385661; --neutral-dark:#213F4A;
  --neutral-darker:#092732; --neutral-darkest:#001014;
  --orange-default:#FD7D12; --orange-dark:#B3570E; --orange-light:#FFBD89;
  --pink-default:#EC0080; --pink-dark:#A7005A;
  --cyan-default:#00C0E7; --cyan-dark:#0086A3;
  --purple-default:#8F13FD; --purple-light:#C689FF; --purple-dark:#650CB2;
  --font-display:'Borna','Inter',system-ui,sans-serif;
  --font-body:'Inter',system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',Consolas,monospace;
  --r-xs:8px; --r-sm:10px; --r-md:14px; --r-lg:22px; --r-xl:28px; --r-2xl:32px; --r-full:9999px;
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.25rem; --s-6:1.5rem;
  --s-7:1.75rem; --s-8:2rem; --s-10:2.5rem; --s-12:3rem; --s-16:4rem;
  --shadow-sm:0 1px 2px rgba(0,0,0,.2);
  --shadow-md:0 4px 12px rgba(0,0,0,.25),0 1px 3px rgba(0,0,0,.15);
  --shadow-lg:0 12px 40px rgba(0,0,0,.35),0 4px 12px rgba(0,0,0,.2);
  --shadow-glow:0 0 32px rgba(0,180,137,.18);
  --t-fast:.18s ease; --t-base:.28s cubic-bezier(.4,0,.2,1); --t-slow:.5s cubic-bezier(.4,0,.2,1);
}
[data-theme="dark"] {
  --bg:var(--neutral-darker); --bg-elevated:#11394A; --bg-elevated-2:#174558;
  --bg-deep:var(--neutral-darkest); --bg-subtle:rgba(255,255,255,.02); --bg-muted:rgba(255,255,255,.04);
  --text-primary:#F1F4F4; --text-secondary:var(--neutral-light); --text-tertiary:#6A7E84;
  --text-on-brand:#001014;
  --border:var(--neutral-default); --border-subtle:rgba(56,86,97,.4); --border-strong:#4E6C77;
  --brand:var(--brand-default); --brand-hover:#1AC299;
  --brand-soft:rgba(0,180,137,.12); --brand-soft-strong:rgba(0,180,137,.2);
  --warning:var(--orange-default); --warning-soft:rgba(253,125,18,.14);
  --danger:var(--pink-default); --danger-soft:rgba(236,0,128,.14);
  --info:var(--cyan-default); --info-soft:rgba(0,192,231,.12);
  --special:var(--purple-light); --special-soft:rgba(143,19,253,.16);
  --grid-line:rgba(255,255,255,.04);
}
[data-theme="light"] {
  --bg:var(--neutral-lightest); --bg-elevated:var(--neutral-white); --bg-elevated-2:#FAFAFB;
  --bg-deep:#ECEEEE; --bg-subtle:rgba(9,39,50,.025); --bg-muted:rgba(9,39,50,.05);
  --text-primary:var(--neutral-darker); --text-secondary:var(--neutral-default); --text-tertiary:var(--neutral-light);
  --text-on-brand:#FFFFFF;
  --border:var(--neutral-lighter); --border-subtle:rgba(156,171,176,.3); --border-strong:var(--neutral-light);
  --brand:var(--brand-dark); --brand-hover:var(--brand-darker);
  --brand-soft:rgba(0,117,90,.08); --brand-soft-strong:rgba(0,117,90,.16);
  --warning:var(--orange-dark); --warning-soft:rgba(179,87,14,.1);
  --danger:var(--pink-dark); --danger-soft:rgba(167,0,90,.1);
  --info:var(--cyan-dark); --info-soft:rgba(0,134,163,.08);
  --special:var(--purple-dark); --special-soft:rgba(101,12,178,.1);
  --grid-line:rgba(9,39,50,.05);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:15px}
body{font-family:var(--font-body);background:var(--bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;overflow:hidden;height:100vh;transition:background var(--t-base),color var(--t-base)}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input{font:inherit;color:inherit}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.display{font-family:var(--font-display);letter-spacing:-.02em}
.num{font-variant-numeric:tabular-nums}
::selection{background:var(--brand-soft-strong);color:var(--text-primary)}
