/* Bloop design tokens — copied verbatim from the Bloop Design System (tokens/*.css). Keep in sync with the source system; don't edit values here. */
/* Google Fonts (OFL) — substitutes; no brand font files were provided. Latin subset. */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:400 800;font-stretch:75% 100%;font-display:swap;src:url("../fonts/BricolageGrotesque-normal-400-800.woff2") format("woff2")}
@font-face{font-family:"Instrument Sans";font-style:italic;font-weight:400 700;font-stretch:100%;font-display:swap;src:url("../fonts/InstrumentSans-italic-400-700.woff2") format("woff2")}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 700;font-stretch:100%;font-display:swap;src:url("../fonts/InstrumentSans-normal-400-700.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/InstrumentSerif-italic-400.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/InstrumentSerif-normal-400.woff2") format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/SpaceMono-normal-400.woff2") format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/SpaceMono-normal-700.woff2") format("woff2")}

/* ---- tokens/colors.css ---- */
:root{
/* Sunshine — primary */
--yellow-50:#FFFBE6;--yellow-100:#FFF4C2;--yellow-200:#FFEA8A;--yellow-300:#FFDF5C;--yellow-500:#FFD23F;--yellow-700:#D9A600;--yellow-900:#7A5C00;
/* Bubblegum — secondary */
--pink-50:#FFF1F7;--pink-100:#FFE0EE;--pink-200:#FFC2DD;--pink-300:#FF9FCA;--pink-500:#FF7EB6;--pink-700:#D93A82;--pink-900:#7A1846;
/* Cobalt — accent / links */
--blue-50:#EEF2FF;--blue-100:#DCE4FF;--blue-300:#93A8FF;--blue-500:#2F5BFF;--blue-700:#1C3BC4;--blue-900:#0E1E6B;
/* Fizz — success */
--lime-100:#ECFCCB;--lime-500:#9BE15D;--lime-700:#3F7A12;
/* Tomato — error / hot accent */
--tomato-100:#FFE4DC;--tomato-500:#FF5A36;--tomato-700:#C2300F;
/* Warm neutrals */
--cream-0:#FFFFFF;--cream-50:#FFFAF0;--cream-100:#FBF3E2;--cream-200:#F2E7D0;--cream-300:#E3D5B8;
--ink-300:#B8AC96;--ink-500:#7D7262;--ink-700:#4A4237;--ink-800:#2E2922;--ink-900:#1C1915;

/* Semantic */
--brand-primary:var(--yellow-500);--brand-secondary:var(--pink-500);--brand-accent:var(--blue-500);
--surface-page:var(--cream-50);--surface-sunken:var(--cream-100);--surface-card:var(--cream-0);--surface-raised:var(--cream-0);--surface-inverse:var(--ink-900);
--surface-sunshine:var(--yellow-500);--surface-bubblegum:var(--pink-200);--surface-cobalt:var(--blue-500);
--text-strong:var(--ink-900);--text-body:var(--ink-800);--text-muted:var(--ink-700);--text-subtle:var(--ink-500);--text-inverse:var(--cream-50);--text-on-primary:var(--ink-900);--text-on-accent:var(--cream-0);
--text-link:var(--blue-500);--text-link-hover:var(--blue-700);
--border-strong:var(--ink-900);--border-default:var(--cream-300);--border-subtle:var(--cream-200);
--focus-ring:var(--blue-500);
--status-success:var(--lime-700);--status-success-bg:var(--lime-100);
--status-error:var(--tomato-700);--status-error-bg:var(--tomato-100);
--status-warning:var(--yellow-900);--status-warning-bg:var(--yellow-100);
--status-info:var(--blue-700);--status-info-bg:var(--blue-100);
}

/* ---- tokens/typography.css ---- */
:root{
--font-display:"Bricolage Grotesque","Instrument Sans",system-ui,sans-serif;
--font-body:"Instrument Sans",system-ui,sans-serif;
--font-serif:"Instrument Serif",Georgia,serif;
--font-mono:"Space Mono",ui-monospace,monospace;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-black:800;
/* Display scale */
--text-mega:clamp(64px,9vw,136px);--text-display-1:72px;--text-display-2:56px;--text-h1:44px;--text-h2:34px;--text-h3:26px;--text-h4:21px;
/* Body scale */
--text-lg:19px;--text-md:16px;--text-sm:14px;--text-xs:12px;--text-label:11px;
--leading-tight:0.95;--leading-snug:1.15;--leading-normal:1.45;--leading-relaxed:1.6;
--tracking-tight:-0.035em;--tracking-snug:-0.015em;--tracking-normal:0;--tracking-wide:0.08em;
/* Semantic */
--type-display-family:var(--font-display);--type-display-weight:var(--weight-black);--type-display-tracking:var(--tracking-tight);
--type-body-family:var(--font-body);--type-label-family:var(--font-mono);
}

/* ---- tokens/spacing.css ---- */
:root{
--space-0:0;--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-xs:6px;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:36px;--radius-blob:48px;--radius-pill:999px;
--border-thin:1.5px;--border-thick:2px;
--container-max:1240px;--gutter:clamp(20px,4vw,48px);/* @kind spacing */
--control-sm:36px;--control-md:44px;--control-lg:56px;
}

/* ---- tokens/effects.css ---- */
:root{
/* Sticker shadows — hard offset, no blur */
--shadow-pop-sm:0 2px 0 var(--ink-900);--shadow-pop:0 4px 0 var(--ink-900);--shadow-pop-lg:0 6px 0 var(--ink-900);
--shadow-sticker:4px 4px 0 var(--ink-900);
/* Soft shadows — floating layers only */
--shadow-soft:0 1px 2px rgba(28,25,21,.06),0 6px 20px rgba(28,25,21,.08);
--shadow-float:0 2px 6px rgba(28,25,21,.08),0 20px 48px rgba(28,25,21,.16);
--overlay-scrim:rgba(28,25,21,.45);
/* Motion */
--ease-bounce:cubic-bezier(.34,1.56,.64,1);/* @kind other */--ease-out:cubic-bezier(.22,1,.36,1);/* @kind other */--ease-in-out:cubic-bezier(.65,0,.35,1);/* @kind other */
--dur-fast:120ms;/* @kind other */--dur-base:220ms;/* @kind other */--dur-slow:420ms;/* @kind other */
--press-shift:translateY(2px);/* @kind other */--hover-lift:translateY(-2px);/* @kind other */
}

/* ---- tokens/base.css ---- */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);font-size:var(--text-md);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-strong);font-weight:var(--weight-black);letter-spacing:var(--tracking-tight);line-height:var(--leading-snug);margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--text-link-hover)}
::selection{background:var(--yellow-300);color:var(--ink-900)}
:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.bl-serif{font-family:var(--font-serif);font-style:italic;font-weight:400;letter-spacing:-0.01em}
.bl-label{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:var(--tracking-wide);text-transform:uppercase}