/* =========================================================
   Heirloom Festival · tokens (Indigo Field)
   Light: cotton field, indigo ink. The indigo field (--band) owns the hero band,
   the community band and the footer. Dark: indigo everywhere.
   Kola = the one page-level action per viewport (Plan my weekend, Get pass, Pay).
   Stamp ink = confirmation only. Changed = ochre, never gold.
   ========================================================= */
:root{
  /* field + surfaces (layered tinted shadow system) */
  --cotton:#fffcf6; --cotton-2:#f6f1e6; --cotton-3:#ece5d6;
  --card:#ffffff; --raised:#ffffff;
  /* ink */
  --ink:#17265c; --ink-2:#47527d; --ink-3:#69739a;
  --rule:rgba(23,38,92,.14); --rule-2:rgba(23,38,92,.26);
  /* indigo ramp */
  --in-50:#eef0f7; --in-100:#dde2f0; --in-300:#9ba8d0; --in-500:#50649f; --in-700:#2a3d7c; --in-900:#17265c;
  /* the indigo field */
  --band:#17265c; --band-deep:#0e1940; --on-band:#f5f0e5; --on-band-2:#bcc4de; --band-line:rgba(245,240,229,.16);
  /* the one accent */
  --kola:#c2511e; --kola-hi:#ad4416;
  /* stamp ink: confirmation only */
  --stamp:#9a3f24; --stamp-tint:#f8ece6; --stamp-blend:multiply;
  /* semantic */
  --changed:#9a6a12; --changed-bg:#f6ecd2;
  --ok:#2c7a4f; --ok-bg:#e3f1e8;
  --err:#b8323f; --err-bg:#f9e4e6;
  /* actions inside components */
  --btn-bg:#17265c; --btn-fg:#fffcf6; --btn-hi:#2a3d7c;
  /* shadows: two layers, tinted indigo */
  --sh-card:0 1px 2px rgba(14,25,64,.08), 0 14px 32px -14px rgba(14,25,64,.16);
  --sh-raised:0 2px 4px rgba(14,25,64,.08), 0 28px 56px -20px rgba(14,25,64,.16);
  --sh-rest:0 2px 4px rgba(5,10,32,.28), 0 30px 60px -22px rgba(5,10,32,.62);
  --sh-pop:0 2px 6px rgba(14,25,64,.12), 0 24px 48px -16px rgba(14,25,64,.28);
  --ring:0 0 0 2px var(--cotton), 0 0 0 4px var(--in-500);
  /* stage strips: six low-chroma cloth dyes (indigo, kola, badie bark, leaf, sand ochre, ink) */
  --t-main:#dfe3f1;   --t-main-ink:#22357a;
  --t-lane:#f3e0d4;   --t-lane-ink:#8a3815;
  --t-griot:#ebe0d3;  --t-griot-ink:#6b4a2e;
  --t-family:#dfe9dc; --t-family-ink:#2f5e3a;
  --t-film:#e0e0e6;   --t-film-ink:#2c3047;
  --t-makers:#efe7d2; --t-makers-ink:#6e5a2a;
  /* role stripes (avatars) */
  --role-attendee:#50649f; --role-performer:#8a4a2c; --role-trader:#3f7a52; --role-volunteer:#2f6a73; --role-organiser:#17265c;
  /* radius, type, layout */
  --r-s:6px; --r-m:12px; --r-l:20px; --r-btn:8px;
  --serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:"Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gut:40px; --max:1360px; --max-read:760px;
  --top-h:76px; --tab-h:64px; --rail-w:248px;
  /* motion */
  --e-out:cubic-bezier(.32,.72,0,1); --e-press:cubic-bezier(.34,1.56,.64,1);
  --d-fast:140ms; --d-ui:200ms; --d-sheet:260ms; --d-rest:320ms;
  /* layers */
  --z-top:20; --z-tab:30; --z-menu:35; --z-scrim:40; --z-sheet:41; --z-toast:50;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --cotton:#0b1331; --cotton-2:#0e1739; --cotton-3:#16204a;
    --card:#18234f; --raised:#1d2a5c;
    --ink:#f2ede2; --ink-2:#c3c9de; --ink-3:#959dbd;
    --rule:rgba(242,237,226,.12); --rule-2:rgba(242,237,226,.24);
    --in-50:#1d2a5c; --in-100:#2a3a75;
    --band:#101a42; --band-deep:#080f2a; --band-line:rgba(245,240,229,.12);
    --kola:#d4612b; --kola-hi:#e06f37;
    --stamp:#e08a66; --stamp-tint:#2a1d2c; --stamp-blend:screen;
    --changed:#e3b55a; --changed-bg:#3b2f17;
    --ok:#6cc596; --ok-bg:#163527;
    --err:#f07d87; --err-bg:#3d1a22;
    --btn-bg:#f2ede2; --btn-fg:#17265c; --btn-hi:#dde2f0;
    --sh-card:0 1px 2px rgba(0,0,0,.4), 0 14px 32px -14px rgba(2,6,22,.8);
    --sh-raised:0 2px 4px rgba(0,0,0,.45), 0 28px 56px -20px rgba(2,6,22,.9);
    --sh-rest:0 2px 4px rgba(0,0,0,.5), 0 30px 60px -22px rgba(0,0,0,.85);
    --sh-pop:0 2px 6px rgba(0,0,0,.5), 0 24px 48px -16px rgba(0,0,0,.8);
    --ring:0 0 0 2px var(--cotton), 0 0 0 4px var(--in-300);
    --t-main:#25336d;   --t-main-ink:#d3daf3;
    --t-lane:#3d2a2a;   --t-lane-ink:#f1bfa5;
    --t-griot:#352c23;  --t-griot-ink:#e3cbb0;
    --t-family:#203629; --t-family-ink:#b3dbbc;
    --t-film:#272b40;   --t-film-ink:#cdd0de;
    --t-makers:#363020; --t-makers-ink:#e6d4a2;
    --role-attendee:#9ba8d0; --role-performer:#e0997a; --role-trader:#7fc195; --role-volunteer:#7cc3cc; --role-organiser:#f2ede2;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --cotton:#0b1331; --cotton-2:#0e1739; --cotton-3:#16204a;
  --card:#18234f; --raised:#1d2a5c;
  --ink:#f2ede2; --ink-2:#c3c9de; --ink-3:#959dbd;
  --rule:rgba(242,237,226,.12); --rule-2:rgba(242,237,226,.24);
  --in-50:#1d2a5c; --in-100:#2a3a75;
  --band:#101a42; --band-deep:#080f2a; --band-line:rgba(245,240,229,.12);
  --kola:#d4612b; --kola-hi:#e06f37;
  --stamp:#e08a66; --stamp-tint:#2a1d2c; --stamp-blend:screen;
  --changed:#e3b55a; --changed-bg:#3b2f17;
  --ok:#6cc596; --ok-bg:#163527;
  --err:#f07d87; --err-bg:#3d1a22;
  --btn-bg:#f2ede2; --btn-fg:#17265c; --btn-hi:#dde2f0;
  --sh-card:0 1px 2px rgba(0,0,0,.4), 0 14px 32px -14px rgba(2,6,22,.8);
  --sh-raised:0 2px 4px rgba(0,0,0,.45), 0 28px 56px -20px rgba(2,6,22,.9);
  --sh-rest:0 2px 4px rgba(0,0,0,.5), 0 30px 60px -22px rgba(0,0,0,.85);
  --sh-pop:0 2px 6px rgba(0,0,0,.5), 0 24px 48px -16px rgba(0,0,0,.8);
  --ring:0 0 0 2px var(--cotton), 0 0 0 4px var(--in-300);
  --t-main:#25336d;   --t-main-ink:#d3daf3;
  --t-lane:#3d2a2a;   --t-lane-ink:#f1bfa5;
  --t-griot:#352c23;  --t-griot-ink:#e3cbb0;
  --t-family:#203629; --t-family-ink:#b3dbbc;
  --t-film:#272b40;   --t-film-ink:#cdd0de;
  --t-makers:#363020; --t-makers-ink:#e6d4a2;
  --role-attendee:#9ba8d0; --role-performer:#e0997a; --role-trader:#7fc195; --role-volunteer:#7cc3cc; --role-organiser:#f2ede2;
  color-scheme:dark;
}
@media (max-width:1100px){ :root{ --gut:24px } }
@media (max-width:760px){ :root{ --gut:16px; --top-h:60px } }