/* PALETTEN. Ét sted. Filen linkes fra hver HTML-fil i public/, og CSS-filerne arver derfra —
   praecis som radius.css, og af praecis samme grund.

   ── HVORFOR DEN FINDES ──────────────────────────────────────────────────────────────────────

   Vi havde TO brands. Appen var groen (`--gold:#1da85c`, "business green"), mens login-siden og
   monogrammet var pink/gul/moerk (#FF4D8D, #FFE14D, #141018). En kunde gik fra en pink-gul
   login-side ind i en groen app, og det var den enkeltstaaende stoerste grund til at fladerne
   ikke hang sammen — stoerre end nogen skrift eller skygge.

   Tokens laa samtidig spredt: flere :root-blokke i dashboard.html plus otte CSS-filer. Farven
   kunne altsaa ikke skiftes ét sted. Den her fil er stedet.

   ── BESLUTNINGEN, 18. august 2026 ───────────────────────────────────────────────────────────

   PINK/GUL/MOERK ER BRANDET. Groen er degraderet til STATUSFARVE.

   Hvorfor den vej: monogrammet, login-siden og figurerne fandtes allerede i den palet, og de
   ligger paa den akse brandet er kalibreret til — LIDT STREET, ALDRIG BARNLIG.

   Hvorfor groen ikke bare kunne blive: den betoed BAADE "det lykkedes" OG "det her er OhMyGen".
   Naar alt er groent, betyder groen ingenting — kvitteringen efter en gennemfoert handling
   forsvinder ind i kromet. De to ting maa ikke se ens ud.

   ── DEN REGEL DER GOER FORSKELLEN, OG SOM ER NEM AT BRYDE ────────────────────────────────────

   **Pink er FYLD, aldrig tekst.** #FF4D8D paa hvid er 3,1:1 og falder for broedtekst OG for
   knaptekst. Skal der staa pink TEKST, er det `--maerke-tekst` (#D11A62, 4,6:1). Skal der staa
   tekst OVEN PAA pink, er den ink — ikke hvid. Samme fejl blev allerede lavet og rettet i
   sign-in.html; den staar her saa den ikke skal opdages en tredje gang.

   ── HVAD DER IKKE ER HER ────────────────────────────────────────────────────────────────────

   Radierne (radius.css) og kalenderens `--cal-*`-lag (dashboard.html). Kalenderen har begge
   temaer og sin egen begrundelse — "kromet er neutralt, farven kommer fra indholdet" — og den
   regel er RIGTIG. Den skal udbredes til resten af appen, ikke trakkes ind her og fortyndes. */

:root {
  /* ── BRANDET ───────────────────────────────────────────────────────────────────────────────
     De tre der gaar igen paa monogrammet, login-siden og figurerne. */
  --maerke:#FF4D8D;         /* pink. FYLD — flader, figurer, gradientens ene ende. Aldrig tekst */
  --maerke-dyb:#E11E6E;     /* pink i hover og i den anden ende af gradienten */
  --maerke-tekst:#D11A62;   /* den ENESTE pink der maa baere tekst. 4,6:1 paa hvid */
  --maerke-2:#FFE14D;       /* gul. Gaest, ikke vaert — accent paa ét element ad gangen */
  --maerke-3:#3DE1FF;       /* cyan. Sjaeldnest af de tre. Bruges paa figurerne og intet andet endnu */
  --maerke-ink:#141018;     /* den moerke. Baggrund paa login, tekst OVEN PAA pink og gul */

  /* SVAGE FLADER. Et valgt kort faar en anelse maerke-farve i baggrunden, ikke fuld pink —
     et helt pink kort skriger, og der kan vaere ti af dem valgt paa samme skaerm.
     De afloeser de haardkodede `#f4fbf6` (bleg groen) og `rgba(29,168,92,.08)` der stod
     spredt i dashboard.html. */
  --maerke-svag:rgba(255,77,141,.09);
  --maerke-svag-2:rgba(255,77,141,.16);
  --maerke-linje:rgba(255,77,141,.38);

  /* Gradienten. TILBAGEHOLDT MED VILJE — den bor paa den primaere knap og paa
     fremskridtsbjaelken, og ingen andre steder. En gradient paa ringe, kort og overskrifter
     bliver en regnbue, og det er praecis hvad interface-loeft-specen advarer imod. */
  /* ── TO GRADIENTER, OG DE ER IKKE ENS ───────────────────────────────────────────────────
     Brandbogen forboed gradienter i brandfarverne. Forbuddet er LOEST OP for appens
     interaktive elementer 18. august 2026, efter at begge udgaver var bygget og set ved siden
     af hinanden: den flade knap laeste korrekt men doed, gradienten laeste som noget nogen
     havde bygget med vilje. Se noten i BRAND.md §7.

     FREMSKRIDT baerer gult: gul -> pink -> dyb pink. Det gule er halvdelen af hvorfor bjaelken
     laeser som VORES og ikke som en vilkaarlig pink streg. Der staar ingen tekst paa den.

     KNAPPEN baerer det IKKE. Gul kan ikke ligge under tekst overhovedet: hvid paa #FFE14D er
     1,3:1 og ink er 15:1, saa bjaelkens gradient ville tvinge to forskellige tekstfarver paa
     samme knap.

     TEKST PAA KNAP-GRADIENTEN ER INK, IKKE HVID. Her stod indtil 19. august 2026 at
     "pink -> dyb pink er moerk nok hele vejen". Det er maalt forkert. To ting gjorde det galt:
     gradienten er 96deg og altsaa LYSEST i venstre ende, hvor teksten begynder, og
     `--maerke-glas` lyser hele fladen op indefra. Maalt paa den faerdige knap naaede hvid
     3,29:1 i venstre ende og kun 4,07:1 i det MOERKESTE punkt — den holdt altsaa ingen steder.

     Den moerke ende er `--maerke-grad-slut` og IKKE `--maerke-tekst`. De to har forskellige
     opgaver: `--maerke-tekst` (#D11A62) skal baere pink TEKST paa lys bund og skal derfor vaere
     moerk; gradientens slut skal baere INK-tekst og skal derfor vaere lys nok. Bandt man dem
     sammen igen, ville den ene opgave altid oedelaegge den anden. */
  --maerke-grad-slut:#E63C76;  /* ink = 4,7:1 her, foer `--maerke-glas` loefter den yderligere */
  --maerke-grad:linear-gradient(96deg,var(--maerke) 0%,var(--maerke-grad-slut) 100%);
  --maerke-grad-fremdrift:linear-gradient(90deg,var(--maerke-2) 0%,var(--maerke) 55%,var(--maerke-tekst) 100%);

  /* ── STATUS ────────────────────────────────────────────────────────────────────────────────
     Groen betyder nu ÉN ting: det lykkedes. Roed: det gik galt. Gul: se her.
     `--gold` og `--green` stod foer for baade brand og status og peger nu paa status —
     navnet `--gold` er en rest fra det groenne system og beholdes for ikke at skulle rette
     570 brugssteder paa én gang. Skriv `--status-ok` i ny kode. */
  /* MAALTE VAERDIER, hentet fra hjemmesidens globals.css. Den havde dem foerst, og den har
     kontrastforholdene skrevet ind — appen gaettede. `#e5484d` staar dokumenteret dér som
     3,9:1 og "faldt for broedtekst"; den er derfor afloest af #C2183C. */
  --status-ok:#127A4B;
  --status-ok-dyb:#127A4B;
  --status-fejl:#C2183C;
  --status-obs:#8A6D12;
  /* SVAGE STATUS-FLADER. En status-raekke skal have en TONE, ikke bare farvet tekst — ellers
     ligner en afkrydset linje en linje der bare har en anden farve. Opaciteten er lav med
     vilje: fem groenne felter over hinanden maa ikke raabe. */
  --status-ok-svag:rgba(21,112,63,.10);
  --status-obs-svag:rgba(138,109,18,.10);

  /* ── FLADER OG BLAEK ───────────────────────────────────────────────────────────────────────
     Kromet. Det BAERER ikke brandet — det skal vaere stille, saa den ene farve vi bruger faar
     lov at betyde noget (interface-loeft-spec §1.1).

     PAPIR ER VARMT, IKKE GROENT. `--felt` og `--felt-dyb` var #eef1ee / #e9ede9: neutrale
     "med en anelse groent i selve graatonen" — en rest fra det groenne system, valgt dengang
     accenten var groen. Med et pink brand kaemper den groenne undertone imod, og helheden
     bliver svaer at sætte fingeren paa: hver enkelt flade ser fin ud, og summen goer ikke.

     #F2F1EC er brandets EGEN papirfarve. Den staar i figur-specen (`--papir`), og Gnisten er
     renderet paa praecis den — figuren kan derfor lægges direkte paa fladen uden en synlig kant.
     Det er ikke en smagssag: baggrunden i asset'et og baggrunden i appen SKAL vaere den samme
     vaerdi, ellers staar figuren i en kasse. */
  /* UNDERTONEN ER PINK, IKKE GROEN. Vaerdierne er Port 1's egne (mockup'en af de seks skaerme),
     ikke skoennet: `--ground:#FAF7F8`, `--ink:#151114`, `--muted:#8A8187`. Det lyder som ingenting
     — men #101511 har groent i graatonen og #151114 har pink, og med et pink brand kaemper den
     groenne undertone imod paa HVER flade. Det er den slags man ikke kan pege paa, men kan se:
     hver enkelt skaerm ser fin ud, og summen goer ikke. */
  --papir:#F2F1EC;          /* brandets papir. SAMME vaerdi som hjemmesiden — se noten nedenfor */
  --ink:#141018;
  --ink-2:#4A4450;          /* sekundaer tekst paa papir */
  --muted:#6B6470;          /* 5,0:1 paa papir. Maalt paa hjemmesiden, ikke skoennet */
  --line:rgba(20,16,24,.10);
  --line-2:rgba(20,16,24,.18);  /* kanter der skal SES: felter, aktive rammer */
  --cream:#ffffff;
  --felt:#F2F1EC;
  --felt-dyb:#E9E7E1;       /* flisen under en chip, en sunket flade */
  --sunk:#F7F6F2;           /* felter og hvilende listeraekker */
  --creme-dyb:#F7F6F2;

  /* ── SKYGGER ───────────────────────────────────────────────────────────────────────────────
     `--lift-*` er til det der FAKTISK haenger over noget: modaler, svaevekort, menuer.
     `--gloed-*` er til det der bare skal loeftes lidt fra fladen — kort og paneler. Forskellen
     er y-forskydningen: en glood har ingen, og derfor ser den ikke ud som om kortet kaster
     skygge paa en flade der ikke findes. Se F8 i docs/holo-analyse/TODO.md. */
  --lift-1:0 14px 34px -16px rgba(15,25,18,.14), 0 3px 10px -5px rgba(15,25,18,.06);
  --lift-2:0 18px 40px -18px rgba(15,25,18,.16), 0 4px 12px -6px rgba(15,25,18,.07);
  --lift-3:0 28px 56px -22px rgba(6,14,9,.45);
  /* GLOEDEN ER LOEFTESPROGET (F8). En skygge UDEN y-forskydning: et kort der ligger paa en
     flade haenger ikke over noget, saa en drop shadow tegner et hul under noget der ikke
     svaever. `--lift-*` ovenfor er reserveret til det der FAKTISK haenger over noget.

     Brandbogen forboed indtil 18. august 2026 "neon-gloed", og det ord ramte bredere end det
     var ment — det slog ogsaa den her ihjel. Forbuddet er fjernet i BRAND.md §7 og
     brandbook.md §11; kun gloed i en BRANDFARVE som lyseffekt er stadig ude.

     Tonen er papirets EGEN, ikke en graa. En neutral graa skygge paa en varm bund laeser som
     snavs; den samme tone et trin moerkere laeser som lys. */
  --gloed-1:0 0 26px #ECE7EA, 0 0 5px #ECE7EA;
  --gloed-2:0 0 54px #E7E0E4, 0 0 10px #E7E0E4;
  /* GLAS-GLOEDEN PAA DEN PRIMAERE KNAP. En INDVENDIG hvid gloed oven paa gradienten — maalt i
     HOLO's app 18. august 2026 (interface-loeft-spec §1.3). Den koster én linje og er den
     enkeltstaaende detalje der laeser som dyrest: knappen bliver "glasset" frem for flad.
     KUN paa den primaere knap. Paa alt andet bliver den en slaering. */
  --maerke-glas:inset 0 0 20px rgba(255,255,255,.4);

  /* GLOEDEN om noget der er VALGT, AKTIVT eller har FOKUS. Pink, fordi det er brandets
     opmaerksomhed — ikke status.

     Den var kortvarigt afloest af en die-cut kontur, fordi brandbogen forboed "neon-gloed".
     Begge udgaver blev bygget og set ved siden af hinanden 18. august 2026, og gloeden vandt:
     konturen laeser haardt og teknisk, gloeden laeser som at elementet er levende. Forbuddet er
     fjernet i BRAND.md §7 og brandbook.md §11.

     Lav opacitet med vilje: den skal kunne ses, ikke lyse. Der kan staa ti valgte chips paa
     samme skaerm. */
  --gloed-maerke:0 0 24px rgba(255,77,141,.30);
  /* Konturen findes stadig — den er den rigtige naar noget skal se SKAARET UD frem for
     oplyst (brandbogens die-cut, §7.4). Begge er lovlige; vaelg efter hvad elementet siger. */
  --maerke-diecut:0 0 0 3px var(--maerke-svag-2);

  /* ── GLAS ──────────────────────────────────────────────────────────────────────────────────
     Branding-fladens sprog. Deles af alle ni emner; hvert emne har sin egen komposition. */
  --glas-bg:rgba(255,255,255,.42);
  --glas-bg-2:rgba(255,255,255,.55);
  --glas-line:rgba(255,255,255,.5);
  --glas-blur:22px;
  --glas-lift:0 22px 50px -30px rgba(6,14,9,.35);

  /* ── FIGURERNE ─────────────────────────────────────────────────────────────────────────────
     public/figurer.js tegner de fire foelelsesmaessige takter. Farverne staar HER og ikke i
     JS'en, saa figurerne er med naar paletten skifter — ellers ville de vaere det ene sted den
     ikke kunne skiftes. */
  --fig-pink:var(--maerke);
  --fig-gul:var(--maerke-2);
  --fig-cyan:var(--maerke-3);
  --fig-dyb:var(--maerke-tekst);
  --fig-oeje:#ffffff;
  --fig-pupil:#2D2D2D;
}

/* ── BAGUDKOMPATIBILITET ──────────────────────────────────────────────────────────────────────
   `--gold`, `--green` og `--green-deep` staar i ~570 brugssteder paa tvaers af dashboard.html og
   otte CSS-filer. De peger nu paa STATUS, som er det de betoed de fleste af de steder (afkrydset,
   gennemfoert, aktiv). De steder hvor de betoed BRANDET — logoet, den primaere knap, det valgte
   element — flyttes ét ad gangen til `--maerke`.

   AT SKIFTE DEM ALLE PAA ÉN GANG VILLE VAERE FORKERT: en global s/--gold/--maerke/ ville gooere
   hvert eneste flueben pink, og saa var vi tilbage ved at én farve betyder to ting — bare den
   anden vej rundt. Se `--kobber` og `--fersken` nedenfor: de er groenne toner der KUN bruges
   dekorativt, og de skal vaek, ikke skifte farve. */
:root {
  --gold:var(--status-ok);
  --green:var(--status-ok);
  --green-deep:var(--status-ok-dyb);
  --red:var(--status-fejl);
  --kobber:#2ec871;
  --fersken:#8fe6b7;
  --sand:#bfe9d2;
  /* DE MOERKE SEKTIONSFLADER. Hed `--skov-*` og var groen-sorte (#0c1310 osv.) fra det groenne
     system — de baerer sidepanelet, den moerke KPI-flise og hver moerk knap i appen, altsaa
     rammen om det hele. Med et pink brand laeser en groen-sort ramme som en anden app.
     Vaerdierne er hjemmesidens `--color-ink-800/700/600`, som allerede havde navnet
     "Moerke sektionsflader. Afloeser skov-*" — de to flader skal vaere ens.
     Navnene beholdes indtil videre: de staar ~15 steder, og et omdoeb er en separat opgave. */
  --skov-900:#141018; --skov-800:#1A1620; --skov-700:#241E28; --skov-600:#2F2836;
}