/* Moshe Porat — design tokens (from Claude Design export: tokens/*.css). Keep in sync. */
/* Google Fonts — no brand fonts were supplied. */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Instrument+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{
/* Cloud — page and surface whites, faintly blue */
--cloud-0:#FFFFFF;
--cloud-50:#F6F8FA;
--cloud-100:#EDF1F5;
--cloud-200:#DDE4EC;
--cloud-300:#C5D0DC;
/* Mist — blue-grey text greys */
--mist-400:#8A97A8;
--mist-500:#677488;
--mist-600:#4C586A;
/* Sky — azure through deep blue */
--sky-300:#A9C2DA;
--sky-400:#7FA3C6;
--sky-500:#55799F;
--sky-600:#3E5F84;
--sky-700:#2A4566;
/* Night — ink and dark surfaces */
--night-800:#16243A;
--night-900:#0D1726;
--night-950:#070D17;
/* Dusk — golden-hour accent, small doses */
--dusk-100:#F7E9DA;
--dusk-400:#E3B07A;
--dusk-500:#C8874A;
/* Feedback */
--success-500:#3F6B52;
--error-500:#A6402F;

/* Sky gradients — hero fallback, placeholders */
--sky-day:linear-gradient(180deg,#6F96C0 0%,#BCD0E3 68%,#E6ECF2 100%); /* @kind other */
--sky-dawn:linear-gradient(180deg,#A9C2DA 0%,#E9DCD3 70%,#F2D9C2 100%); /* @kind other */
--sky-dusk:linear-gradient(180deg,#16243A 0%,#3E5F84 45%,#B98A73 82%,#E3B07A 100%); /* @kind other */
--sky-night:linear-gradient(180deg,#070D17 0%,#16243A 60%,#2A4566 100%); /* @kind other */
--protection-bottom:linear-gradient(180deg,rgba(7,13,23,0) 35%,rgba(7,13,23,.7) 100%); /* @kind other */
--protection-top:linear-gradient(180deg,rgba(7,13,23,.5) 0%,rgba(7,13,23,0) 26%); /* @kind other */

/* Semantic */
--surface-page:var(--cloud-50);
--surface-raised:var(--cloud-0);
--surface-sunken:var(--cloud-100);
--surface-inverse:var(--night-900);
--surface-lightbox:var(--night-950);
--surface-photo-placeholder:var(--cloud-200);
--text-primary:var(--night-900);
--text-secondary:var(--mist-600);
--text-muted:var(--mist-500);
--text-inverse:var(--cloud-50);
--text-inverse-muted:#9AA9BC;
--text-accent:var(--sky-600);
--text-highlight:var(--dusk-500);
--border-hairline:var(--cloud-200);
--border-field:var(--cloud-300);
--border-strong:var(--night-900);
--border-inverse:rgba(246,248,250,.18);
--action-primary:var(--night-900);
--action-primary-hover:var(--sky-700);
--focus-ring:var(--sky-500);
--overlay-scrim:rgba(7,13,23,.96);
}
:root{
--font-display:'Instrument Serif',Georgia,'Times New Roman',serif;
--font-body:'Instrument Sans',system-ui,sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,monospace;

--text-xs:11px;
--text-sm:13px;
--text-base:16px;
--text-md:19px;
--text-lg:28px;
--text-xl:40px;
--text-2xl:64px;
--text-3xl:96px;
--text-4xl:clamp(64px,11vw,168px);

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

--leading-none:.95;
--leading-tight:1.05;
--leading-snug:1.25;
--leading-body:1.65;

--tracking-display:-.015em;
--tracking-ui:.02em;
--tracking-meta:.12em;

--type-hero:var(--weight-regular) var(--text-4xl)/var(--leading-none) var(--font-display);
--type-display:var(--weight-regular) var(--text-3xl)/var(--leading-none) var(--font-display);
--type-h1:var(--weight-regular) var(--text-2xl)/var(--leading-tight) var(--font-display);
--type-h2:var(--weight-regular) var(--text-xl)/var(--leading-tight) var(--font-display);
--type-h3:var(--weight-regular) var(--text-lg)/var(--leading-snug) var(--font-display);
--type-lead:var(--weight-regular) var(--text-lg)/1.3 var(--font-display);
--type-body:var(--weight-regular) var(--text-base)/var(--leading-body) var(--font-body);
--type-ui:var(--weight-medium) var(--text-sm)/1.3 var(--font-body);
--type-caption:var(--weight-regular) var(--text-sm)/1.5 var(--font-body);
--type-meta:var(--weight-regular) var(--text-xs)/1.4 var(--font-mono);
}
:root{
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:24px;
--space-6:32px;
--space-7:48px;
--space-8:64px;
--space-9:96px;
--space-10:160px;

--gutter-grid:16px;
--gutter-page:clamp(20px,4vw,56px); /* @kind spacing */
--grid-columns:12; /* @kind other */
--measure-text:60ch; /* @kind other */
--width-page:1440px;

--radius-0:0;
--radius-1:2px;
--radius-pill:999px;
--border-width:1px;

--shadow-none:none;
--shadow-lift:0 1px 2px rgba(13,23,38,.06),0 18px 40px -20px rgba(13,23,38,.35);

--ease-out:cubic-bezier(.2,.7,.2,1); /* @kind other */
--ease-in-out:cubic-bezier(.65,0,.35,1); /* @kind other */
--dur-fast:160ms; /* @kind other */
--dur-base:320ms; /* @kind other */
--dur-slow:800ms; /* @kind other */

--header-height:76px;
--z-header:20; /* @kind other */
--z-overlay:100; /* @kind other */
}
html{direction:ltr}
body{margin:0;background:var(--surface-page);color:var(--text-primary);font:var(--type-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--text-primary);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:var(--cloud-300);transition:color var(--dur-fast) var(--ease-out),text-decoration-color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-accent);text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
::selection{background:var(--sky-300);color:var(--night-900)}
.mp-meta{font:var(--type-meta);letter-spacing:var(--tracking-meta);text-transform:uppercase;color:var(--text-muted);font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:1ms!important;animation-duration:1ms!important}}