/* AfterLife design tokens. Mirror of tokens.json; keep both in sync. */

/* Dusk Paper base, also Region 1 zones 2–4 ("r1-dusk"). Every [data-palette] element
   resets to this full base first, so nested palettes never inherit a parent region's colours. */
:root, [data-palette] {
  --paper: #EDE5D3;
  --paper-shade: #D9CDB3;
  --surface: #F6F0E2;
  --button: #E4DAC4;
  --stone: #CDBFA5;
  --deep: #5B5066;
  --ink: #4B3E3A;
  --text: #3E3330;
  --text-soft: #6E625C;
  --on-lamp: #3E3330;
  --banner: #4E4763;
  --banner-ink: #F5EEDD;
  --lamp: #E8A13A;
  --lamp-light: #F4C675;
  --flame-core: #FFF0C2;
  --heart: #D9776A;
  --mind: #6E98B0;
  --meter: #E8C27A;
  --gem: #A897D6;
  --gem-shade: #7F6DB3;
  --gem-light: #E6DEF7;
  --soul: #FBF6EA;
  --soul-shade: #E6DCCB;
  --soul-glow: #F4C675;
  --shawl: #C9786B;
  --cheek: #EDB3A3;
  --water: #9DC6C1;
  --leaf: #A7B78C;
  --locked: #857B8C;
  --locked-ink: #F3ECDC;
  --path: #5E5470;
  --crow: #47405A;
  --crow-shade: #342E45;
  --crow-light: #8A83A3;
  --beak: #D9A95C;
  --good: #8DB27A;
  --wrong: #D0776A;
  --shade: rgb(60 40 50 / 0.16);
  --speckle: rgb(75 62 58 / 0.10);
  --scrim: rgb(40 32 42 / 0.45);
}

:root {
  /* Type */
  --font-ui: 'Baloo 2', ui-rounded, 'Arial Rounded MT Bold', 'Trebuchet MS', system-ui, sans-serif;
  --fw-regular: 500;
  --fw-bold: 700;
  --fw-heavy: 800;
  --fs-caption: 12px;
  --fs-small: 14px;
  --fs-body: 16px;
  --fs-label: 18px;
  --fs-counter: 20px;
  --fs-title: 24px;
  --fs-display: 32px;
  --lh-tight: 1.1;
  --lh-body: 1.4;

  /* Shape */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-pill: 999px;
  --line: 2px;
  --line-detail: 1.5px;
  --line-glyph: 3px;
  --glow-outer: 0.22;
  --glow-inner: 0.34;

  /* Space and layout */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --tap-min: 44px;
  --design-w: 390px;
  --design-h: 844px;
}

/* Region 1, Zone 1: The House at Dawn (demo default) */
[data-palette="r1-dawn"] {
  --paper: #F1E6DC;
  --paper-shade: #E2D0C1;
  --surface: #F9F1E9;
  --button: #EBDCCE;
  --stone: #D8C5B5;
  --deep: #6E5C74;
  --ink: #4E3F42;
  --text: #3F3236;
  --text-soft: #75656A;
  --banner: #6C5A7A;
  --banner-ink: #FBF3EA;
  --lamp: #EA9A45;
  --lamp-light: #F3BC80;
  --meter: #F0C98F;
  --soul-glow: #F6C98A;
  --water: #B7D3CF;
  --leaf: #B3BE95;
  --locked: #968A99;
  --path: #7A6887;
  --speckle: rgb(78 63 66 / 0.09);
}

/* Region 2: The River */
[data-palette="r2-river"] {
  --paper: #E3E8DE;
  --paper-shade: #CAD3C4;
  --surface: #F1F4EC;
  --button: #D8E0D1;
  --stone: #BEC7B6;
  --deep: #3F5A5A;
  --ink: #45423B;
  --text: #34332D;
  --text-soft: #636659;
  --banner: #3F5E5F;
  --banner-ink: #EEF3EC;
  --lamp: #E09B3E;
  --lamp-light: #F0C27A;
  --meter: #E3C888;
  --water: #8FBFB8;
  --leaf: #93AE8A;
  --locked: #7F8C88;
  --path: #4C6663;
  --speckle: rgb(69 66 59 / 0.09);
}

/* Region 3: The Hills of Rain and Echo */
[data-palette="r3-hills"] {
  --paper: #E5E9EC;
  --paper-shade: #CCD3DA;
  --surface: #F5F7F9;
  --button: #D9DFE6;
  --stone: #B8C1CB;
  --deep: #4A5568;
  --ink: #403E46;
  --text: #33323A;
  --text-soft: #5F6270;
  --banner: #4F5B72;
  --banner-ink: #F2F5F8;
  --lamp: #E39D42;
  --lamp-light: #F1C47F;
  --meter: #E6CB93;
  --water: #93B4CF;
  --leaf: #9DB09A;
  --locked: #858D9A;
  --path: #5B6780;
  --speckle: rgb(64 62 70 / 0.09);
}

/* Region 4: The City of Unlit Lamps. Night, lantern gold only. */
[data-palette="r4-city"] {
  --paper: #272B46;
  --paper-shade: #1D2037;
  --surface: #474F7C;
  --button: #3E4670;
  --stone: #525B88;
  --deep: #12152A;
  --ink: #0F1124;
  --text: #EAE6F4;
  --text-soft: #A9ADC8;
  --on-lamp: #1E1A2E;
  --banner: #161A33;
  --banner-ink: #F4EAD0;
  --lamp: #F2C46D;
  --lamp-light: #F8DB9C;
  --meter: #C9B27A;
  --heart: #E08C7E;
  --mind: #86AFC6;
  --soul: #EEF0F8;
  --soul-shade: #C9CCE0;
  --soul-glow: #F3E6C0;
  --water: #2F4E6E;
  --leaf: #3E5A5C;
  --locked: #353B66;
  --locked-ink: #9CA2C6;
  --path: #5A6396;
  --crow: #3B3658;
  --crow-shade: #2A2642;
  --crow-light: #8E89B3;
  --shade: rgb(8 8 20 / 0.28);
  --speckle: rgb(255 255 255 / 0.07);
  --scrim: rgb(6 6 16 / 0.6);
}

/* Region 5: The Far Shore, at first light */
[data-palette="r5-shore"] {
  --paper: #F6EDE0;
  --paper-shade: #EAD6CC;
  --surface: #FCF6EE;
  --button: #F0DED4;
  --stone: #DCC5BC;
  --deep: #6A5578;
  --ink: #4D3D45;
  --text: #3E3038;
  --text-soft: #7A6670;
  --banner: #7A6A86;
  --banner-ink: #FFF6EC;
  --lamp: #EDA04A;
  --lamp-light: #F4C27E;
  --meter: #F4C27E;
  --heart: #DE8A86;
  --water: #C4DDD6;
  --leaf: #B9C49B;
  --locked: #9C8B9E;
  --path: #8A7896;
  --speckle: rgb(77 61 69 / 0.08);
}

/* Region 5 variant: sunrise at the Gate, the end of the map. Warmer rose and gold. */
[data-palette="r5-sunrise"] {
  --paper: #F8E6D2;
  --paper-shade: #EFCDB8;
  --surface: #FDF3E8;
  --button: #F5DCC8;
  --stone: #E6C3AE;
  --deep: #7A5572;
  --ink: #503B40;
  --text: #402F34;
  --text-soft: #7D6368;
  --banner: #8A5C6C;
  --banner-ink: #FFF6EC;
  --lamp: #F0A04A;
  --lamp-light: #F7C782;
  --meter: #F7C782;
  --heart: #E08A80;
  --water: #E5CFC2;
  --leaf: #C4C29A;
  --locked: #A88C98;
  --path: #9A7488;
  --speckle: rgb(80 59 64 / 0.08);
}

/* Paper speckle: two offset dot grids read as random at phone size. */
.paper {
  background-color: var(--paper);
  background-image:
    radial-gradient(circle at 30% 40%, var(--speckle) 0 1px, transparent 1.6px),
    radial-gradient(circle at 70% 80%, var(--speckle) 0 0.8px, transparent 1.3px);
  background-size: 23px 29px, 37px 31px;
  color: var(--text);
}