/* Watch This Space design tokens — copied from design/project/tokens. Edit there first, then re-copy. */
:root{
/* ---- Ink: the primary brand neutral. Cool, slightly blue. Used for signage grounds and all text. ---- */
--ink-950:#08131a;--ink-900:#0c1a24;--ink-800:#122833;--ink-700:#1b3a47;--ink-600:#2a5060;--ink-500:#45707f;--ink-400:#6e939f;--ink-300:#9cb8c1;--ink-200:#c8dae0;--ink-100:#e4edf0;--ink-50:#f2f7f9;--white:#ffffff;

/* ---- Teal: the brand colour. Calm, technical, non-hostile. Primary actions. ---- */
--teal-900:#04332f;--teal-800:#06453f;--teal-700:#075a52;--teal-600:#0a7c74;--teal-500:#0e9e93;--teal-400:#35bdb0;--teal-300:#7ed8ce;--teal-200:#b7eae4;--teal-100:#dcf4f1;--teal-50:#effaf8;

/* ---- Bay Line: high-legibility accent, references painted bay markings. Never a warning colour. ---- */
--lime-700:#6f8400;--lime-600:#8fa800;--lime-500:#b4ce1f;--lime-400:#cfe84a;--lime-300:#e2f384;--lime-100:#f4fbd2;

/* ---- Status. Deliberately no red and no amber. ---- */
--green-700:#1c6b47;--green-600:#2e9e68;--green-100:#e2f4ea;
--blue-700:#1d4ea8;--blue-600:#2d6cdf;--blue-100:#e6eefc;
--slate-600:#5a6b78;--slate-100:#eceff1;
--clay-700:#7a4a2c;--clay-600:#a2663d;--clay-100:#f6ece4;

/* ---- Semantic aliases ---- */
--surface-page:var(--white);
--surface-sunken:var(--ink-50);
--surface-card:var(--white);
--surface-raised:var(--white);
--surface-ink:var(--ink-900);
--surface-ink-soft:var(--ink-800);
--surface-brand:var(--teal-700);
--surface-brand-soft:var(--teal-50);
--surface-accent:var(--lime-400);

--text-primary:var(--ink-900);
--text-secondary:var(--ink-600);
--text-muted:var(--ink-500);
--text-inverse:var(--white);
--text-inverse-soft:var(--ink-200);
--text-brand:var(--teal-700);
--text-link:var(--teal-700);
--text-link-hover:var(--teal-800);

--border-subtle:var(--ink-100);
--border-default:var(--ink-200);
--border-strong:var(--ink-300);
--border-inverse:rgba(255,255,255,.18);
--border-focus:var(--teal-600);

--status-available-fg:var(--green-700);--status-available-bg:var(--green-100);
--status-filling-fg:var(--clay-700);--status-filling-bg:var(--clay-100);
--status-full-fg:var(--slate-600);--status-full-bg:var(--slate-100);
--status-info-fg:var(--blue-700);--status-info-bg:var(--blue-100);
--status-open-fg:var(--teal-700);--status-open-bg:var(--teal-100);

/* ---- Signage. Physical output, all weather. Ink ground + white type is the default; ---- */
--sign-ground:var(--ink-900);
--sign-text:var(--white);
--sign-text-soft:var(--ink-200);
--sign-accent:var(--lime-400);
--sign-rule:rgba(255,255,255,.24);
--sign-ground-alt:var(--white);
--sign-text-alt:var(--ink-900);

/* ---- Focus ring ---- */
--focus-ring:0 0 0 2px var(--white),0 0 0 4px var(--teal-600);
--focus-ring-inverse:0 0 0 2px var(--ink-900),0 0 0 4px var(--lime-400);
}
:root{
--font-display:"Archivo","Archivo Fallback",Helvetica,Arial,sans-serif;
--font-text:"Public Sans","Public Sans Fallback",Helvetica,Arial,sans-serif;
--font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

--weight-light:300;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-black:800;

/* Screen scale — 16px base, 1.20-1.26 ratio */
--text-2xs:11px;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-md:18px;--text-lg:20px;--text-xl:24px;--text-2xl:30px;--text-3xl:38px;--text-4xl:48px;--text-5xl:60px;--text-6xl:76px;--text-7xl:96px;

--leading-tight:1.04;--leading-snug:1.16;--leading-normal:1.5;--leading-relaxed:1.62;

--tracking-tighter:-0.03em;--tracking-tight:-0.015em;--tracking-normal:0;--tracking-wide:0.02em;--tracking-wider:0.06em;--tracking-widest:0.12em;

/* Signage scale. Values are x-height-driven cap heights in mm at 1:1; the px values below
   are the on-screen mockup equivalents at 1mm = 1px for a 1:1 artwork board. */
--sign-text-primary:150px;   /* entrance headline, read at 15m+ */
--sign-text-secondary:90px;
--sign-text-terms:44px;      /* terms body, read at 2m */
--sign-text-legal:28px;
--sign-leading:1.1;
--sign-tracking:0.005em;

/* Semantic type roles */
--type-display:var(--weight-semibold) var(--text-5xl)/var(--leading-tight) var(--font-display);
--type-h1:var(--weight-semibold) var(--text-3xl)/var(--leading-snug) var(--font-display);
--type-h2:var(--weight-semibold) var(--text-2xl)/var(--leading-snug) var(--font-display);
--type-h3:var(--weight-semibold) var(--text-lg)/var(--leading-snug) var(--font-display);
--type-body:var(--weight-regular) var(--text-base)/var(--leading-relaxed) var(--font-text);
--type-body-sm:var(--weight-regular) var(--text-sm)/var(--leading-normal) var(--font-text);
--type-label:var(--weight-semibold) var(--text-xs)/1.2 var(--font-text);
--type-mono:var(--weight-medium) var(--text-sm)/1.3 var(--font-mono);
}
:root{
--space-0:0px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:32px;--space-8:40px;--space-9:48px;--space-10:64px;--space-11:80px;--space-12:96px;--space-13:128px;--space-14:160px;

--radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-2xl:28px;--radius-full:999px;

--border-width:1px;--border-width-thick:2px;

/* 12-column grid, 1280 content max, 24px gutters */
--grid-columns:12;/* @kind other */--grid-gutter:24px;--grid-margin:32px;
--container-sm:640px;--container-md:900px;--container-lg:1120px;--container-xl:1280px;--container-full:1440px;

--control-height-sm:32px;--control-height-md:40px;--control-height-lg:48px;--control-height-xl:56px;
--tap-target-min:44px;
}
:root{
/* Shadows are low, cool and short. Nothing floats far off the page. */
--shadow-none:none;
--shadow-xs:0 1px 2px rgba(12,26,36,.06);
--shadow-sm:0 1px 3px rgba(12,26,36,.07),0 1px 2px rgba(12,26,36,.04);
--shadow-md:0 4px 12px rgba(12,26,36,.08),0 1px 3px rgba(12,26,36,.05);
--shadow-lg:0 12px 32px rgba(12,26,36,.10),0 2px 6px rgba(12,26,36,.05);
--shadow-inset:inset 0 1px 0 rgba(255,255,255,.6);
--overlay-scrim:rgba(8,19,26,.56);
--blur-panel:saturate(140%) blur(14px); /* @kind other */
}
:root{
--duration-instant:80ms; /* @kind other */
--duration-fast:140ms; /* @kind other */
--duration-base:200ms; /* @kind other */
--duration-slow:320ms; /* @kind other */
--duration-slower:520ms; /* @kind other */
--ease-standard:cubic-bezier(.2,0,0,1); /* @kind other */
--ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
--ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
--transition-control:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard); /* @kind other */
}
@media (prefers-reduced-motion:reduce){:root{
--duration-instant:0ms; /* @kind other */
--duration-fast:0ms; /* @kind other */
--duration-base:0ms; /* @kind other */
--duration-slow:0ms; /* @kind other */
--duration-slower:0ms; /* @kind other */
}}