/* Generated from apps/dev-site/design-system. Edit the token sources. */
/* tokens/fonts.css */
@font-face{font-family:"Radley";src:url("fonts/radley-400.woff2") format("woff2"),url("fonts/radley-400.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Helvetica LT Std Bold";src:url("fonts/helvetica-lt-std-bold.otf") format("opentype");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:"Eina";src:url("fonts/Eina03-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Eina";src:url("fonts/Eina03-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Eina";src:url("fonts/Eina03-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"ASM";src:url("fonts/asm-regular.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"ASM";src:url("fonts/asm-bold.otf") format("opentype");font-weight:700;font-style:normal;font-display:swap}

/* tokens/colors.css */
/* Shared foundations. Every color is SOLID: --x fill, --x-hover, --on-x text. No tints. */
:root{
--text-1:#fffbf7;--text-2:#fff6ec;--text-muted:#B5B2C2;
--accent:#5e7ce2;--accent-hover:#758FE6;--accent-strong:#3f4fb0;--on-accent:#ffffff;
--green:#a4da8b;--green-hover:#bde5a8;--on-green:#12200c;
--yellow:#fff78e;--yellow-hover:#fffbc0;--on-yellow:#24220a;
--orange:#ecb041;--orange-hover:#f4c876;--on-orange:#221806;
--red:#e5484d;--red-hover:#f2555b;--on-red:#ffffff; /* Mind dark red ramp: canonical on all layers */
--purple:#9c59df;--purple-hover:#b077e8;--on-purple:#ffffff;
--blue:#9aaeff;--blue-hover:#b7c4ff;--on-blue:#10131f;
--danger:var(--red);--danger-hover:var(--red-hover);--on-danger:#ffffff;
--focus:#9aaeff;
--palo-nano:#f7e4aa;--palo-bloom:#accd98;--palo-research:#8f4550;
}

/* tokens/layers.css */
/* ONE ramp per layer: --surface-0..7. Rule: page = n, card = n+1, button = card+1, button hover = button+1. No separate card/btn ramps, no borders. Dev = main values. */
:root,[data-surface="main"],[data-surface="dev"]{
--surface-0:#060608;--surface-1:#0d0d12;--surface-2:#181821;--surface-3:#222230;--surface-4:#2d2d3e;--surface-5:#383849;--surface-6:#444458;--surface-7:#505068;
--header-bg:var(--surface-1);--footer-bg:var(--surface-0);
--surface-font-display:var(--font-radley);--surface-font-body:var(--font-helvetica);
}
[data-surface="api"]{
--surface-0:#0a1520;--surface-1:#0D1B2A;--surface-2:#1a253a;--surface-3:#263554;--surface-4:#32415f;--surface-5:#40557E;--surface-6:#4d658f;--surface-7:#5a7299;
--text-1:#E0E1DD;--text-2:#F8F4E3;
}
[data-surface="mind"],[data-surface="welcome"]{
--surface-0:#0c0c0c;--surface-1:#141414;--surface-2:#1F1F1F;--surface-3:#292929;--surface-4:#333333;--surface-5:#3d3d3d;--surface-6:#474747;--surface-7:#525252;
--surface-font-display:var(--font-helvetica);--surface-font-body:var(--font-helvetica); /* welcome keeps Helvetica; Mind overrides below */
}
[data-surface="mind"]{
--surface-font-display:var(--font-eina);--surface-font-body:var(--font-asm);
}
[data-surface="mind"][data-theme="light"],[data-surface="welcome"][data-theme="light"]{
--surface-0:#CFCCC1;--surface-1:#D9D6CC;--surface-2:#E3E0D6;--surface-3:#ECEAE3;--surface-4:#F4F2EC;--surface-5:#FAF8F3;--surface-6:#FDFCF9;--surface-7:#FFFFFF; /* light: page darkened so every step can be lighter, ending at white */
--text-1:#23221F;--text-2:#3B3934;--text-muted:#5F5D55;
--accent:#4257BD;--accent-hover:#33459E;
--green:#286A2B;--green-hover:#1F5224;--on-green:#fff;
--yellow:#765A07;--yellow-hover:#604708;--on-yellow:#fff;
--red:#B42318;--red-hover:#981F1A;--on-red:#fff;
--danger:#B42318;--danger-hover:#981F1A;--focus:#4257BD;
}

/* tokens/domains.css */
/* Domain values. Each block belongs to one surface so changing it cannot leak
   onto another host. Legacy files alias these names; they never restate a value. */

/* Shared status pairs. Solid surface plus the text that sits on it. */
:root{
--tone-blue-surface:#232a45;--tone-blue-on-surface:#b9c6ff;
--tone-green-surface:#1e2f26;--tone-green-on-surface:#b8e6a0;
--tone-yellow-surface:#33301c;--tone-yellow-on-surface:#f2e79a;
--tone-red-surface:#3a2224;--tone-red-on-surface:#ffb3b3;
--tone-orange-surface:#35291a;--tone-orange-on-surface:#f2c98a;
--tone-purple-surface:#2b2340;--tone-purple-on-surface:#cbb0f0;
--tone-accent-surface:#232a45;--tone-accent-on-surface:#b9c6ff;
--on-solid:#ffffff;
--chrome-scrollbar-bg:#0d1117;--chrome-scrollbar-thumb:#30363d;--chrome-scrollbar-thumb-hover:#484f58;--chrome-scrollbar-thumb-active:#656d76;
/* The shared border ramp and info tone predate the surface steps; the marketing
   layer reads the ramp, Mind reads both. */
--border-1:#232528;--border-2:#2F3237;--border-3:#3D3D3D;--border-4:#474747;--border-5:#525252;
--info:#5870A1;
}
[data-theme="light"]{
--tone-blue:#4257BD;--tone-blue-strong:#33459E;--tone-blue-surface:#E1E5F7;--tone-blue-on-surface:#2C3C8C;
--tone-green-surface:#DFEEDF;--tone-green-on-surface:#1F5623;
--tone-yellow-surface:#F4EBD2;--tone-yellow-on-surface:#6B540B;
--tone-red-surface:#F7E3E0;--tone-red-on-surface:#9E1F17;
--tone-orange:#90400C;--tone-orange-strong:#713206;--tone-orange-surface:#F7E7D5;--tone-orange-on-surface:#8A3F07;
--tone-purple:#5B21B6;--tone-purple-strong:#451884;--tone-purple-surface:#EAE2F9;--tone-purple-on-surface:#56209E;
--tone-accent-surface:#E1E5F7;--tone-accent-on-surface:#2C3C8C;
--tone-on-blue:#ffffff;--tone-on-orange:#ffffff;--tone-on-purple:#ffffff;
--border-1:#D3D2CE;
--info:#4257BD;
}

/* api.mpalo.com keeps its navy documentation palette. */
[data-surface="api"]{
--api-bg-input:#323252;--api-bg-code:#282c34;--api-text-code:#abb2bf;
--api-border-default:rgb(249 237 237 / 8.1%);--api-border-sidebar:rgb(249 237 237 / 2.1%);--api-border-popup:rgb(249 237 237 / 10%);
}

/* mind.mpalo.com. Danger runs one step deeper than the shared red, and the
   light theme's warm-grey border ramp is its own scale, not the marketing one. */
[data-surface="mind"]{
--danger-strong:#BF2239;--danger-deep:#4d161b;
--text-faint:#7C8293;
--scrim-overlay:rgb(0 0 0 / 50%);--scrim-strong:rgb(0 0 0 / 75%);--scrim-modal:rgb(20 20 20 / 80%);
}
[data-surface="mind"][data-theme="light"]{
--mind-border-1:#DBD8CF;--mind-border-2:#E6E3DA;--mind-border-3:#D3D0C6;--mind-border-4:#C4C1B6;--mind-border-5:#B4B1A6;
}

/* The welcome/signup flow keeps its own sage secondary accent. */
[data-surface="welcome"]{
--welcome-accent-secondary:#7eab7e;
}

/* tokens/typography.css */
:root{
--font-radley:"Radley",Georgia,serif;
--font-helvetica:"Helvetica LT Std Bold",Helvetica,Arial,sans-serif;
--font-eina:"Eina","Helvetica LT Std Bold",Helvetica,Arial,sans-serif;
--font-asm:"ASM","Helvetica LT Std Bold",Helvetica,Arial,sans-serif;
--font-mono:ui-monospace,"SF Mono",Menlo,monospace;
--ls-body:-0.03em;
--fs-xs:.75rem;--fs-sm:.875rem;--fs-base:1rem;--fs-lg:1.125rem;--fs-xl:1.25rem;--fs-2xl:1.5rem;--fs-3xl:1.875rem;--fs-4xl:2.25rem;--fs-5xl:3rem;
--fw-regular:400; /* @kind other */
--fw-medium:500; /* @kind other */
--fw-semibold:600; /* @kind other */
--fw-bold:700; /* @kind other */
}

/* tokens/spacing.css */
:root{
--sp-0-5:.125rem;--sp-1:.25rem;--sp-1-5:.375rem;--sp-2:.5rem;--sp-2-5:.625rem;--sp-3:.75rem;--sp-3-5:.875rem;--sp-4:1rem;--sp-5:1.25rem;--sp-6:1.5rem;--sp-8:2rem;--sp-10:2.5rem;--sp-12:3rem;--sp-16:4rem;--sp-20:5rem;--sp-24:6rem;
--gap-within:.5rem;--gap-between:2rem; /* proximity: items in a group 8px apart, groups 32px apart */
--radius:.5rem; /* ONE value, 8px. System like Apple: concentric (inner = outer - inset) + continuous (squircle) corners */
--btn-radius:var(--radius);
--field-h:2.625rem; /* 42px base field height */
--field-h-sm:2.25rem; /* 36px compact field height */
--sidebar-w:16rem;--sidebar-w-collapsed:4.5rem;--header-h:64px;
--shadow-overlay:0 8px 24px rgba(0,0,0,.4); /* selective: popovers/modals only */
--scrim:rgb(0 0 0 / 65%); /* the one translucent layer: behind modals and dialogs */
}

/* tokens/motion.css */
:root{
--dur-fast:.15s; /* @kind other */
--dur-base:.2s; /* @kind other */
--dur-slow:.3s; /* @kind other */
--dur-scribble-draw:5s; /* @kind other */
--dur-flower-spin:30s; /* @kind other */
}
@keyframes mpalo-draw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}} /* left-to-right reveal of animationscribblecombined.svg */
@keyframes mpalo-fade-in{from{opacity:0}to{opacity:1}}
@keyframes mpalo-shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* tokens/base.css */
body{margin:0;background:var(--surface-1);color:var(--text-1);font-family:var(--surface-font-body);letter-spacing:var(--ls-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--surface-font-display);font-weight:400;margin:0}
a{color:var(--accent)}a:hover{color:var(--accent-hover)}
*{corner-shape:squircle}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
::selection{background:var(--accent);color:var(--on-accent)}
