/* ==========================================================================
   jAImy V1 — design tokens (Dag / Nacht / Automatisch)
   Gebruik:
     <html data-theme="dag">        → altijd Dag
     <html data-theme="nacht">      → altijd Nacht
     <html> (geen attribuut) of data-theme="auto" → volgt telefoon (prefers-color-scheme)
     <html data-room-accent="zee">  → kamerkleur (zee | munt | roos | zon | klei | mos), default zee
   Gegenereerd uit _build/tokens.py — pas daar aan, niet hier.
   ========================================================================== */
/* Zelf gehost, latin, OFL. Geen Google Fonts-CDN. */
@font-face{font-family:"Nunito";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/nunito-latin-600.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Nunito";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/nunito-latin-700.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Nunito";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/nunito-latin-800.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/bricolage-grotesque-latin-600.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/bricolage-grotesque-latin-700.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/bricolage-grotesque-latin-800.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* typografie */
  --font-display:"Bricolage Grotesque","Nunito",ui-rounded,system-ui,sans-serif;
  --font-body:"Nunito",ui-rounded,"SF Pro Rounded",-apple-system,system-ui,sans-serif;
  --font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --fs-meta:12px;      /* tijden, badges */
  --fs-small:13.5px;   /* helpers, chips, meldingen */
  --fs-body:16px;      /* berichten, invoer (16px = geen iOS-zoom) */
  --fs-lead:18px;      /* intro, kaarttitels */
  --fs-h2:22px;        /* sectie/sheet-titel */
  --fs-h1:30px;        /* paginatitel mobiel */
  --fs-hero:56px;      /* start desktop */
  --lh-tight:1.1; --lh-body:1.4;
  /* ruimte (4px-raster) */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px;
  /* vormen — concentrisch: buiten = binnen + padding */
  --radius-xs:8px;      /* badges, kleine tags */
  --radius-s:14px;      /* invoer/knop binnen kaart (30 − 16) */
  --radius-m:22px;      /* verstuurknop, icon-knoppen in composer */
  --radius-l:30px;      /* kaart (padding 16), composer (padding 8 → 22) */
  --radius-bubble:21px; --radius-tail:8px;
  --radius-pill:999px;
  --hit:44px;           /* minimum tikvlak */
  /* beweging */
  --ease-out:cubic-bezier(.2,0,0,1);
  --dur-fast:150ms;
  --theme-transition:background-color var(--dur-fast) ease-out, color var(--dur-fast) ease-out, box-shadow var(--dur-fast) ease-out;
  /* vaste merkkleur jAImy-smiley */
  --sun:#FFC83D;
}

/* kamerkleur: vlak (wit erop ≥4.5:1 in beide thema's) + ink (tekst op bg) + zacht (vlek/achtergrond) */
:root,[data-room-accent="zee"]{--room-accent:#1F6FA8;--room-accent-text:#FFFFFF;--ra-ink-dag:#1D679C;--ra-ink-nacht:#8CC3EE;--ra-soft-dag:rgba(31,111,168,0.12);--ra-soft-nacht:rgba(31,111,168,0.22);}
[data-room-accent="munt"]{--room-accent:#0F7B6C;--room-accent-text:#FFFFFF;--ra-ink-dag:#0E7163;--ra-ink-nacht:#6FD3C2;--ra-soft-dag:rgba(15,123,108,0.12);--ra-soft-nacht:rgba(15,123,108,0.22);}
[data-room-accent="roos"]{--room-accent:#C03A6E;--room-accent-text:#FFFFFF;--ra-ink-dag:#B33566;--ra-ink-nacht:#F4A0C0;--ra-soft-dag:rgba(192,58,110,0.12);--ra-soft-nacht:rgba(192,58,110,0.22);}
[data-room-accent="zon"]{--room-accent:#9A6400;--room-accent-text:#FFFFFF;--ra-ink-dag:#8A5A00;--ra-ink-nacht:#F2C46A;--ra-soft-dag:rgba(154,100,0,0.12);--ra-soft-nacht:rgba(154,100,0,0.22);}
[data-room-accent="klei"]{--room-accent:#9C5530;--room-accent-text:#FFFFFF;--ra-ink-dag:#934F2C;--ra-ink-nacht:#E9A882;--ra-soft-dag:rgba(156,85,48,0.12);--ra-soft-nacht:rgba(156,85,48,0.22);}
[data-room-accent="mos"]{--room-accent:#5A7420;--room-accent-text:#FFFFFF;--ra-ink-dag:#536B1D;--ra-ink-nacht:#B8D27A;--ra-soft-dag:rgba(90,116,32,0.12);--ra-soft-nacht:rgba(90,116,32,0.22);}

/* Dag (ook default zonder voorkeur) */
:root,[data-theme="dag"]{
  color-scheme:light;
  --bg:#FFF3E4;
  --bg-deco:rgba(107,71,255,.10);
  --bg-dot:rgba(43,29,20,.07);
  --surface:#FFFFFF;
  --surface-raised:#FFFFFF;
  --surface-sunken:#FBEFE1;
  --text:#2B1D14;
  --text-muted:#735E4E;
  --text-faint:#9A8572;
  --brand:#6B47FF;
  --primary:#6B47FF;
  --primary-text:#FFFFFF;
  --primary-edge:#4F2FE0;
  --primary-soft:#EFEAFF;
  --primary-ink:#5B37F0;
  --own:#C4502F;
  --own-text:#FFFFFF;
  --own-edge:#A13D20;
  --notice-bg:#F1E4D3;
  --notice-text:#5E4B3C;
  --table-bg:#FFE29A;
  --table-ink:#5C4314;
  --table-card:#FFFBF3;
  --table-pin:#FFC83D;
  --chip-bg:#FFFFFF;
  --chip-text:#2B1D14;
  --input-ring:rgba(43,29,20,.10);
  --focus-ring:#6B47FF;
  --online:#1F9D55;
  --success:#0B6F55;
  --danger:#B42318;
  --person-1:#C42F68;
  --person-2:#0B7468;
  --person-3:#2A62C9;
  --person-4:#8A5A00;
  --person-5:#7B3FA0;
  --scrim:rgba(43,29,20,.38);
  --seat-grok:#2A2D34;
  --seat-grok-on:#FFFFFF;
  --seat-grok-soft:#ECECF0;
  --seat-grok-ink:#2A2D34;
  --seat-gpt:#0B7A5E;
  --seat-gpt-on:#FFFFFF;
  --seat-gpt-soft:#DFF3EC;
  --seat-gpt-ink:#0A6A52;
  --seat-claude:#94590A;
  --seat-claude-on:#FFFFFF;
  --seat-claude-soft:#F6E7D2;
  --seat-claude-ink:#80500C;
  --shadow-bubble:0 1px 1px rgba(76,40,10,.05), 0 4px 12px -4px rgba(76,40,10,.14);
  --shadow-raised:0 1px 1px rgba(76,40,10,.06), 0 6px 20px -6px rgba(76,40,10,.18);
  --shadow-pop:0 2px 4px rgba(76,40,10,.06), 0 24px 48px -16px rgba(76,40,10,.30);
  --shadow-sheet:0 -12px 40px -12px rgba(76,40,10,.30);
  --shadow-inset:inset 0 0 0 1px var(--input-ring);
  --room-accent-ink:var(--ra-ink-dag);
  --room-accent-soft:var(--ra-soft-dag);
}

/* Nacht (expliciet) */
[data-theme="nacht"]{
  color-scheme:dark;
  --bg:#111114;
  --bg-deco:rgba(124,92,255,.07);
  --bg-dot:rgba(255,255,255,.04);
  --surface:#1D1D23;
  --surface-raised:#26262E;
  --surface-sunken:#16161B;
  --text:#EDECF1;
  --text-muted:#A3A0AD;
  --text-faint:#7C7986;
  --brand:#8B6CFF;
  --primary:#6247E0;
  --primary-text:#FFFFFF;
  --primary-edge:#4630B0;
  --primary-soft:#2A2547;
  --primary-ink:#B5A6FF;
  --own:#B5462A;
  --own-text:#FFFFFF;
  --own-edge:#8E3620;
  --notice-bg:#25252C;
  --notice-text:#BDBAC6;
  --table-bg:#3A3220;
  --table-ink:#F2D899;
  --table-card:#23211C;
  --table-pin:#FFC83D;
  --chip-bg:#1D1D23;
  --chip-text:#E1DFE7;
  --input-ring:rgba(255,255,255,.08);
  --focus-ring:#B5A6FF;
  --online:#4ADE80;
  --success:#6FD8B5;
  --danger:#FF8A80;
  --person-1:#F08BB0;
  --person-2:#5FC9BA;
  --person-3:#86A9F0;
  --person-4:#E5B85C;
  --person-5:#C9A2F0;
  --scrim:rgba(0,0,0,.6);
  --seat-grok:#DADDE3;
  --seat-grok-on:#17181C;
  --seat-grok-soft:#2C2F38;
  --seat-grok-ink:#DADDE3;
  --seat-gpt:#0E7C61;
  --seat-gpt-on:#FFFFFF;
  --seat-gpt-soft:#15302A;
  --seat-gpt-ink:#6FD8B5;
  --seat-claude:#94590A;
  --seat-claude-on:#FFFFFF;
  --seat-claude-soft:#32291C;
  --seat-claude-ink:#F0BE6E;
  --shadow-bubble:0 1px 2px rgba(0,0,0,.45);
  --shadow-raised:0 1px 2px rgba(0,0,0,.5), 0 8px 24px -8px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.04);
  --shadow-pop:0 2px 4px rgba(0,0,0,.4), 0 24px 48px -12px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.06);
  --shadow-sheet:0 -12px 40px -8px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  --shadow-inset:inset 0 0 0 1px var(--input-ring);
  --room-accent-ink:var(--ra-ink-nacht);
  --room-accent-soft:var(--ra-soft-nacht);
}

/* Automatisch: telefoon staat donker en gebruiker koos niet expliciet Dag */
@media (prefers-color-scheme: dark){
:root:not([data-theme="dag"]){
    color-scheme:dark;
    --bg:#111114;
    --bg-deco:rgba(124,92,255,.07);
    --bg-dot:rgba(255,255,255,.04);
    --surface:#1D1D23;
    --surface-raised:#26262E;
    --surface-sunken:#16161B;
    --text:#EDECF1;
    --text-muted:#A3A0AD;
    --text-faint:#7C7986;
    --brand:#8B6CFF;
    --primary:#6247E0;
    --primary-text:#FFFFFF;
    --primary-edge:#4630B0;
    --primary-soft:#2A2547;
    --primary-ink:#B5A6FF;
    --own:#B5462A;
    --own-text:#FFFFFF;
    --own-edge:#8E3620;
    --notice-bg:#25252C;
    --notice-text:#BDBAC6;
    --table-bg:#3A3220;
    --table-ink:#F2D899;
    --table-card:#23211C;
    --table-pin:#FFC83D;
    --chip-bg:#1D1D23;
    --chip-text:#E1DFE7;
    --input-ring:rgba(255,255,255,.08);
    --focus-ring:#B5A6FF;
    --online:#4ADE80;
    --success:#6FD8B5;
    --danger:#FF8A80;
    --person-1:#F08BB0;
    --person-2:#5FC9BA;
    --person-3:#86A9F0;
    --person-4:#E5B85C;
    --person-5:#C9A2F0;
    --scrim:rgba(0,0,0,.6);
    --seat-grok:#DADDE3;
    --seat-grok-on:#17181C;
    --seat-grok-soft:#2C2F38;
    --seat-grok-ink:#DADDE3;
    --seat-gpt:#0E7C61;
    --seat-gpt-on:#FFFFFF;
    --seat-gpt-soft:#15302A;
    --seat-gpt-ink:#6FD8B5;
    --seat-claude:#94590A;
    --seat-claude-on:#FFFFFF;
    --seat-claude-soft:#32291C;
    --seat-claude-ink:#F0BE6E;
    --shadow-bubble:0 1px 2px rgba(0,0,0,.45);
    --shadow-raised:0 1px 2px rgba(0,0,0,.5), 0 8px 24px -8px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.04);
    --shadow-pop:0 2px 4px rgba(0,0,0,.4), 0 24px 48px -12px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.06);
    --shadow-sheet:0 -12px 40px -8px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
    --shadow-inset:inset 0 0 0 1px var(--input-ring);
    --room-accent-ink:var(--ra-ink-nacht);
    --room-accent-soft:var(--ra-soft-nacht);
  }
}

/* basis die bij de tokens hoort */
html{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-size-adjust:100%}
body{transition:var(--theme-transition)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
@media (prefers-reduced-motion: reduce){*{transition-duration:0ms !important;animation-duration:0ms !important}}
