/* Design tokens, concatenated from the SmarTuna design system. */

/* --- colors --- */
:root{
--navy-950:#060f32;
--navy-900:#0d1b40;
--navy-800:#153e6c;
--navy-700:#233959;
--ink-900:#111111;
--blue-700:#0059b3;
--blue-600:#065abf;
--blue-500:#0b6fd6;
--cyan-400:#00d9ff;
--cyan-500:#00c2e6;
--sky-500:#00b6ff;
--sky-600:#0092d6;
--btn-blue:#00abff;
--sky-100:#edf9ff;
--gray-25:#fbfbfb;
--sky-300:#5dd0ff;
--teal-500:#2690bc;
--teal-400:#34c0cc;
--teal-300:#5bd4dd;
--white:#ffffff;
--gray-50:#f6f8fa;
--gray-100:#eceff2;
--gray-200:#e5e5e5;
--gray-300:#c1c8d1;
--gray-500:#7a8493;
--gray-700:#454e5c;
--gray-900:#1a2027;
--success:#1e9e6a;
--warning:#e0a828;
--danger:#d64545;

--color-bg-page:var(--white);
--color-bg-inverse:var(--ink-900);
--color-bg-navy:var(--navy-950);
--color-bg-navy-mid:var(--navy-800);
--color-surface:var(--white);
--color-surface-sunken:var(--gray-50);
--color-surface-tint:var(--gray-25);
--color-surface-accent:var(--sky-300);
--color-surface-inverse:var(--navy-700);
--color-border:var(--gray-200);
--color-border-strong:var(--gray-300);
--color-border-inverse:rgba(255,255,255,0.18);

--color-text-primary:var(--ink-900);
--color-text-secondary:var(--gray-700);
--color-text-muted:var(--gray-500);
--color-text-inverse:var(--white);
--color-text-inverse-muted:rgba(255,255,255,0.68);
--color-text-inverse-body:var(--white);

/* Accent rule: on LIGHT surfaces use --color-accent-on-light (#00b6ff);
   on DARK surfaces use --color-accent-on-dark (#00d9ff). */
--color-accent-on-light:var(--sky-500);
--color-accent-on-light-hover:var(--sky-600);
--color-accent-on-dark:var(--cyan-400);
--color-accent-on-dark-hover:var(--cyan-500);
--color-accent-primary:var(--btn-blue);
--color-accent-primary-hover:var(--sky-500);
--color-accent-primary-fg:var(--white);
--color-accent-secondary:var(--cyan-400);
--color-accent-secondary-hover:var(--cyan-500);

--color-focus-ring:var(--sky-500);
--color-success:var(--success);
--color-warning:var(--warning);
--color-danger:var(--danger);
}

/* --- typography --- */
:root{
--font-display:'Manrope',ui-sans-serif,system-ui,sans-serif;
--font-body:'Inter',ui-sans-serif,system-ui,sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,'SF Mono',monospace;

--text-display-xl:clamp(2.75rem,4vw,4.5rem);
--text-display-lg:clamp(2.25rem,3vw,3.25rem);
--text-display-md:clamp(1.75rem,2.4vw,2.375rem);
--text-heading-lg:1.75rem;
--text-heading-md:1.375rem;
--text-heading-sm:1.125rem;
--text-body-lg:1.125rem;
--text-body-md:1rem;
--text-body-sm:0.875rem;
--text-caption:0.75rem;

--leading-tight:1.1;
--leading-snug:1.3;
--leading-normal:1.55;
--leading-relaxed:1.7;

--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;

--tracking-tight:-0.02em;
--tracking-normal:0em;
--tracking-wide:0.04em;
--tracking-widest:0.12em;
}

/* --- spacing --- */
:root{
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--space-10:40px;
--space-12:48px;
--space-16:64px;
--space-20:80px;
--space-24:96px;
--space-32:128px;

--radius-sm:4px;
--radius-md:8px;
--radius-lg:12px;
--radius-full:999px;

--container-max:1200px;
--gutter:24px;
}

/* --- effects --- */
:root{
--gradient-sky-band:linear-gradient(to bottom,#00abff,#5bc9ff);
--shadow-sm:0 1px 2px rgba(6,15,50,0.06);
--shadow-md:0 4px 12px rgba(6,15,50,0.10);
--shadow-lg:0 12px 32px rgba(6,15,50,0.16);
--shadow-inverse-glow:0 0 0 1px rgba(52,192,204,0.25),0 8px 28px rgba(6,15,50,0.5);

--gradient-ocean:linear-gradient(160deg,var(--navy-950) 0%,var(--navy-800) 60%,var(--blue-700) 100%);
--gradient-accent:linear-gradient(90deg,var(--blue-600) 0%,var(--teal-400) 100%);

--ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
--ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
--duration-fast:120ms; /* @kind other */
--duration-base:200ms; /* @kind other */
--duration-slow:320ms; /* @kind other */
}

