/* ============================================================
   RowFold — design tokens. THE single source of truth.

   Loaded first by every layout (_Layout, _AuthLayout, _MarketingLayout, and the
   MultiLevel prototype). Nothing else may declare a :root palette.

   Why this file exists: site.css and marketing.css each defined their own :root with
   the SAME token names and DIFFERENT values (two creams, two greens, two border
   colours), so the app and the marketing site were quietly drifting apart and every
   colour decision had to be made twice. Worse, a family of tokens (--t-*, --ink-300,
   --bg, --border-strong) was consumed but defined nowhere — or defined only in a file
   the consuming layout never loaded — which rendered visibly broken UI on the auth,
   onboarding, billing and Studio form surfaces.

   Values below are the app's (formerly site.css), which is the product's system and
   carries the full semantic set. The marketing palette was folded into these.
   ============================================================ */
:root {
    /* Ink ramp */
    --ink-950: #07091A;
    --ink-900: #0E1428;
    --ink-800: #161D3A;
    --ink-700: #232B4F;
    --ink-600: #3A4275;
    --ink-400: #6B718F;
    --ink-300: #B7B9CB;
    --ink-200: #D9D8E1;

    /* Surfaces — "Clarity" overhaul: lighter, warmer paper; the rail is now a light
       surface (was dark ink) so it gets its own tokens. */
    --paper:   #FBF8F1;
    --paper-2: #EFE9DC;
    --card:    #FFFFFF;
    --card-2:  #FCFAF4;

    /* Rail (sidebar) is a light warm surface in the merged single-mode chrome. */
    --rail-bg:     #F3EEE2;
    --rail-border: #E4DCCB;
    --rail-hover:  #EFE9DC;
    --rail-active: #FFFFFF;

    /* Lines. --border-2 is the generic hover/emphasis border. It used to be a lavender
       (#DACEE8, an old typo) that looked anomalous next to the tan borders; the Clarity
       overhaul makes it the intended warm tan the hover-lift cards call for. */
    --border:      #E8DFCC;
    --border-2:    #D8CEB8;
    --border-soft: #F0EADC;
    --line:        #EDE6D6;

    /* Text */
    --text:       #14182E;
    --text-2:     #45496A;
    --text-muted: #807B68;
    --muted-2:    #928C78;
    --text-faint: #ABA68F;

    /* Accent */
    --accent:        #D9F25C;
    --accent-deep:   #AFD227;
    --accent-ink:    #51631A;
    --accent-tint:   #F2F8CF;
    --accent-tint-2: #F8FBE6;

    /* Semantic field-type colours */
    --relation:      #7C5CFF;
    --relation-soft: #EFEBFF;
    --relation-ink:  #4A33B8;
    --lookup:        #2E9BE6;
    --lookup-soft:   #E4F2FD;
    --lookup-ink:    #1A6BB0;
    --rollup:        #FF6B4A;
    --rollup-soft:   #FFEAE2;
    --rollup-ink:    #C53B1C;

    /* Palette — also what the avatar/swatch classes use (formerly the undefined --t-*). */
    --mint:       #1FB877; --mint-soft:      #DCF4EA;
    --amber:      #E5A12B; --amber-soft:     #FBEFD3;
    --rose:       #E84A8B; --rose-soft:      #FCE2EE;
    --sky:        #2E9BE6; --sky-soft:       #E4F2FD;
    --violet:     #7C5CFF; --violet-soft:    #EFEBFF;
    --coral:      #FF6B4A; --coral-soft:     #FFEAE2;
    --chartreuse: #D9F25C;
    --ink:        #0E1428;
    --emerald:    #117352;
    --indigo:     #4F35BF;
    --cyan:       #0E7490;

    --radius-sm: 7px;
    --radius:    11px;
    --radius-lg: 16px;
    --radius-xl: 22px;

    --shadow-sm:  0 1px 2px rgba(20,24,46,0.05), 0 1px 0 rgba(20,24,46,0.02);
    --shadow:     0 8px 24px -14px rgba(20,24,46,0.20), 0 2px 6px -3px rgba(20,24,46,0.08);
    --shadow-lg:  0 28px 64px -28px rgba(20,24,46,0.34), 0 10px 24px -14px rgba(20,24,46,0.12);
    --shadow-pop: 0 18px 50px -16px rgba(20,24,46,0.30);

    --font-display: 'Playfair Display', Georgia, serif;
    --font-sans:    'Bricolage Grotesque', 'Inter', system-ui, -apple-system, sans-serif;
    --font-mono:    'JetBrains Mono', ui-monospace, monospace;

    --rail-w: 232px;
}
