:root{
  /* User palette. Existing primitive names remain compatible with the UI. */
  --navy-950:#111111;--navy-900:#303030;--blue-600:var(--navy-950);--blue-500:#1677D2;
  --yellow-400:#FFCC00;--yellow-500:#FFB800;--white:#FFFFFF;
  --slate-50:#F7F7F7;--slate-100:var(--slate-50);--slate-200:#E5E7EB;
  --slate-500:#6B7280;--slate-300:var(--slate-200);--green-600:#138262;
  --yellow-soft:var(--yellow-400);--yellow-pale:var(--slate-50);--map-route:var(--blue-500);
  --map-pickup:var(--green-600);--map-destination:var(--navy-950);
  --map-ink:#17201e;--map-line:#e3e9e4;--map-muted:#626a65;
  --color-bg:var(--white);--color-surface:var(--white);
  --color-fg:var(--navy-950);--color-muted:var(--slate-500);
  --color-brand:var(--yellow-400);--color-brand-hover:var(--yellow-500);
  --color-brand-accent:var(--yellow-500);
  --color-link:var(--blue-600);--color-border:var(--slate-200);--color-focus:var(--blue-500);
  --color-inverse:var(--white);--color-inverse-muted:color-mix(in srgb,var(--white) 75%,var(--navy-950));
  --surface-highlight-bg:var(--navy-950);--surface-highlight-fg:var(--white);
  --surface-highlight-muted:var(--color-inverse-muted);--surface-highlight-line:rgb(255 255 255 / .22);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
  --space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;
  --radius-sm:8px;--radius-md:16px;--radius-lg:24px;
  --control-hit-min:44px;
  --display:Manrope,sans-serif;--body:'DM Sans',sans-serif;
  --heading-weight:650;--heading-tracking:-.03em;
  --type-copy:1rem;--type-lead:1.125rem;
  --type-copy-leading:1.75;--type-heading-leading:1.12;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);
  --duration-press:160ms;--duration-state:220ms;--duration-entry:400ms;
  --button-bg:var(--color-brand);--button-fg:var(--color-fg);
  --store-bg:var(--navy-950);--store-fg:var(--white);--store-border:var(--navy-950);
  --store-play-bg:var(--button-bg);--store-play-fg:var(--button-fg);--store-play-hover:var(--color-brand-hover);
  --store-inverse-border:var(--slate-500);
  --header-bg:var(--white);--phone-bg:var(--white);
  --header-height:76px;
  --header-logo-height:calc(var(--header-height) - var(--space-2));
  --header-logo-width:calc(var(--header-logo-height) * 1.65);
  /* The supplied square PNG contains transparent margins; preserve its artwork. */
  --brand-logo-width:136px;--brand-logo-height:82px;
  --brand-logo-position:50% 53%;
  --phone-logo-width:70px;--phone-logo-height:44px;
  --download-logo-width:120px;--download-logo-height:74px;
  /* The HTML phones and both Canvas/3D screens consume these same roles. */
  --phone-ui-bg:var(--phone-bg);--phone-ui-surface:var(--slate-50);
  --phone-ui-fg:var(--navy-950);--phone-ui-muted:var(--slate-500);
  --phone-ui-border:var(--slate-200);--phone-ui-handle:var(--slate-300);
  --phone-ui-action-bg:var(--button-bg);--phone-ui-action-fg:var(--button-fg);
  --phone-ui-link:var(--blue-500);--phone-ui-route:var(--map-route);
  --phone-ui-pickup:var(--map-pickup);--phone-ui-destination:var(--map-destination);
  /* Keep the QR contrast independent of action/link theme changes. */
  --phone-qr-paper:var(--white);--phone-qr-ink:var(--navy-950);
  --reading-progress-height:68px;--reading-taxi-width:132px;--reading-taxi-height:64px;
  --taxi-body:var(--color-brand);--taxi-glass:var(--navy-950);--taxi-tire:#080808;
  --taxi-rim:var(--navy-900);--taxi-trim:var(--navy-950);--taxi-lamp:var(--white);
  --shadow-phone:0 24px 60px rgb(0 0 0 / .24);
  --shadow-panel:0 16px 45px rgb(17 17 17 / .08);
  /* Scroll Craft inherits the existing LevelUp Go design system. */
  --sc-canvas:var(--color-bg);--sc-surface:var(--color-surface);
  --sc-ink:var(--color-fg);--sc-ink-soft:var(--color-muted);
  --sc-accent:var(--color-brand);--sc-accent-ink:var(--color-fg);
  --sc-font-display:var(--display);--sc-font-text:var(--body);
  --sc-ease-out:var(--ease-out);
  --border-inverse:rgb(255 255 255 / .14);

  /* Shared type scale; tiny sizes are reserved for the illustrative phone UI. */
  --text-7:7px;
  --text-8:8px;
  --text-9:9px;
  --text-10:10px;
  --text-11:11px;
  --text-12:12px;
  --text-13:13px;
  --text-caption:var(--text-12);--text-support:var(--text-13);
  --store-play-width:205px;
  --text-14:14px;
  --text-15:15px;
  --text-16:16px;
  --text-18:18px;
  --text-20:20px;
  --text-21:21px;
  --text-22:22px;
  --text-23:23px;
  --text-24:24px;
  --text-25:25px;
  --text-26:26px;
  --text-28:28px;
  --text-34:34px;
  --text-35:35px;
  --text-38:38px;
  --text-42:42px;
  --text-43:43px;
  --text-44:44px;
  --text-47:47px;
  --text-48:48px;
  --text-50:50px;
  --text-55:55px;
  --text-67:67px;
  --text-85:85px;
  --text-96:96px;
  --text-108:108px;
  --text-125:125px;
}