/* Fassung 30.09.2026 · Nr. 381S · Schwebe-Token (--schwebe-wunsch-*, Block „Nr. 381S“ am Ende) — geprüft von renty-schwebe.js, Befund 381S
   Vorfassung: Stand 30.09.2026 · Nr. 381-K (Endgeräte-Block). Alles davor unverändert.
   Fassung 28.09.2026 · CODE-336-E · NaviWorld-Rollen (Kugel, Tonne, Nabe) + Hausschrift-Token --schrift-haus (FR33609)
   Vorfassung: ALT-renty-haut-20260928-vor336e.css (daneben). Neu nur der Block „Nr. 336-E" am Ende — alles davor unverändert.
   Fassung 24.09.2026 · Nr. 295 · Haut glas + dunkel (FR29301 = A, FR13811)
   Vorfassung: ALT-renty-haut-20260924-295.css (daneben). Neu: data-haut="glas" (Skizze A) und
   data-haut="dunkel" (Skizze C) — reine Token-Umschaltung; ohne data-haut sieht jede Seite aus wie vorher. */
/* ==========================================================================
   X36 · renty-haut.css — die EINE Haut-Token-Datei des RentyAICommander (K-51)
   ==========================================================================
   Herkunft (INVENTAR Teil D, Empfehlung 1): CSS-Grundgerüst von nav-vorschau-v3_3
   (dunkel) behalten, um helle Zweitwerte ergänzt (nav-vorschau-v4_1-Tagesstimmung),
   als EINE Datei — kein zweites Gehäuse für Hell/Dunkel (F-034).

   Regel (Spec § 4, Stempel § 1c Nr. 15): Schriftgröße läuft NUR über die eine
   Stellschraube --schrift. Kein Bauteil setzt hier oder im Gehäuse eine feste
   Pixelgröße für Schrift.

   Umschaltung: <html data-thema="dunkel"> (Grundstellung), <html data-thema="hell">
   oder <html data-thema="papier"> — Papier ist seit 18.09.2026 (FR25710 = A) der
   Standard für personennahe Seiten; dunkel/hell bleiben fürs Arbeitsgerät. Kein @media(prefers-color-scheme) — RentyDATA lehrt:
   die Haut ist ein bewusster Schalter, keine Geräte-Erbschaft (INVENTAR Teil D/C).

   Herausgelöst NIE kopiert: dieses Blatt ist der EINE Ort für Farbe/Maß/Rundung
   des Commander-Gehäuses. Module bringen nur Werte aus diesem Blatt ein (§ 3c).
   ========================================================================== */

:root{
  /* ---- Schrift: die eine Stellschraube ---------------------------------- */
  --schrift: 1;                 /* Stufe 0.8–1.5, Schritt 0.08 (RENTYDATA-Muster) */
  --schrift-basis: 13px;        /* Grundgröße vor Skalierung, wie v3_3/v4_1 */
  --s: calc(var(--schrift-basis) * var(--schrift));

  /* ---- Maße (v3_3, feste Bereiche laut INVENTAR Teil D) ------------------ */
  --top-h: 48px;
  --top-h2: 40px;               /* zweite Kopfzeile (RentyMulti-Leiste, v4_1) */
  --foot-h: 30px;
  --icon-w: 44px;                /* Seitenleiste eingeklappt (Stempel P4/X23-Nachbarn) */
  --mitte-w: 44px;               /* Mittelleiste X1, senkrecht */
  --rad: 5px;                    /* EIN Rundungswert (Empfehlung 1, gegen v4_1s 6–20px-Wildwuchs) */
  --rad-panel: 10px;             /* AIHelp-Panel, Legende, Karten — etwas weicher als --rad */

  /* ---- Rollenfarben (v3_3, Grundstellung dunkel) -------------------------- */
  --bg: #18181b;
  --surf: #1f1f23;
  --surf2: #27272c;
  --surf3: #2d2d34;
  --bord: #303036;
  --text: #d4d4d8;
  --text-hoch: #f4f4f5;
  --dim: #71717a;

  --c-root: #60a5fa;   /* ⌂ Root */
  --c-ast:  #f87171;   /* ● Ast-Spitze */
  --c-up:   #ffffff;   /* ▲ eine Ebene hoch */
  --c-dn:   #34d399;   /* ▼ eine Ebene runter */
  --c-act:  #6366f1;   /* aktive Auswahl / Schnell-Aktion */
  --c-warn: #f59e0b;
  --c-fehler: #ef4444;

  --ai-grad: linear-gradient(135deg,#4f46e5,#7c3aed,#a21caf);

  /* ---- RentyMulti-Einheiten: 7 Themenfarben (v4_1), unabhängig von Hell/Dunkel */
  --e-teal: #14b8a6;    --e-teal-l: #99f6e4;   --e-teal-t: #042f2c;
  --e-blue: #3b82f6;    --e-blue-l: #bfdbfe;   --e-blue-t: #172554;
  --e-amber:#f59e0b;    --e-amber-l:#fde68a;   --e-amber-t:#451a03;
  --e-green:#22c55e;    --e-green-l:#bbf7d0;   --e-green-t:#052e16;
  --e-violet:#8b5cf6;   --e-violet-l:#ddd6fe;  --e-violet-t:#2e1065;
  --e-coral:#fb7185;    --e-coral-l:#fecdd3;   --e-coral-t:#4c0519;
  --e-gray: #94a3b8;    --e-gray-l: #e2e8f0;   --e-gray-t: #0f172a;

  /* ---- Lämpchen X5: Farbe + Zeichen (Fragezeichen-Regel gilt für beides) -- */
  --lampe-gut: #34d399;   --lampe-gut-z: "●";
  --lampe-warn:#f59e0b;   --lampe-warn-z:"▲";
  --lampe-schlecht:#ef4444; --lampe-schlecht-z:"■";
  --lampe-aus: #52525b;   --lampe-aus-z: "○";

  /* ---- Schatten / Ebenen -------------------------------------------------- */
  --schatten-1: 0 1px 2px rgba(0,0,0,.35);
  --schatten-2: 0 8px 24px rgba(0,0,0,.45);
  --schatten-3: 0 16px 48px rgba(0,0,0,.55);

  --z-splitter: 20;
  --z-overlay: 60;
  --z-legende: 70;
  --z-aihelp: 80;
  --z-menue: 90;
  --z-toast: 100;

  --dauer-kurz: 120ms;
  --dauer-mittel: 200ms;
}

/* ---- Helle Zweitwerte (v4_1-Tagesstimmung, Empfehlung 1) ------------------ */
html[data-thema="hell"]{
  --bg: #f0f2f0;
  --surf: #ffffff;
  --surf2: #f7f7f8;
  --surf3: #eceef0;
  --bord: #dcdfe3;
  --text: #27272a;
  --text-hoch: #0f0f11;
  --dim: #6b6f76;

  --c-root: #2563eb;
  --c-ast:  #dc2626;
  --c-up:   #18181b;
  --c-dn:   #059669;
  --c-act:  #4f46e5;
  --c-warn: #b45309;
  --c-fehler: #b91c1c;

  --schatten-1: 0 1px 2px rgba(15,15,17,.08);
  --schatten-2: 0 8px 24px rgba(15,15,17,.12);
  --schatten-3: 0 16px 48px rgba(15,15,17,.16);
}

/* ==========================================================================
   PAPIER — die Haut für personennahe Seiten (Alex, 18.09.2026, FR25710 = A)
   ==========================================================================
   Wörtlich entschieden: „Papier-Haut wird der Standard für personennahe Seiten."
   Dashboard-Haut (Grundstellung dunkel / data-thema="hell") bleibt für Cockpit,
   Kompass und AICommander — dort wird gearbeitet. Papier gilt für alles, was ein
   Mensch liest und schreibt: Jules Werkstatt und Wissensseite, Briefe, Handbücher,
   Familienseiten.

   Herkunft: Jules eigene Werte aus jule-werkstatt.html und start-jule.html
   (--paper #EFEDE6 · --ink #23211C · --accent #1F5A66). Sie stehen jetzt HIER,
   damit AC-51 gewahrt bleibt: kein Bauteil bringt einen eigenen Farbwert mit.
   Neue personennahe Seiten setzen <html data-thema="papier"> und definieren nichts
   Eigenes mehr. Bestehende Seiten mit eigenem Token-Satz werden nachgezogen
   (Bauauftrag aus Sitzung 257).

   Merksatz: dunkel zum Arbeiten, Papier zum Lesen.
   ========================================================================== */
html[data-thema="papier"]{
  /* Rollenfarben — warm, kontrastarm genug für lange Lesestrecken */
  --bg: #efede6;            /* Papier */
  --surf: #f8f7f2;          /* aufliegendes Blatt */
  --surf2: #edeae1;
  --surf3: #e3dfd4;
  --bord: #d7d3c7;          /* Linie */
  --text: #23211c;          /* Tinte */
  --text-hoch: #141310;
  --dim: #5f5b52;           /* zweite Tinte */

  --c-root: #1f5a66;        /* Akzent (Petrol) — ersetzt das Dashboard-Blau */
  --c-ast:  #9c3b32;        /* Block/Sperre */
  --c-up:   #23211c;
  --c-dn:   #3b7a4e;        /* fertig */
  --c-act:  #1f5a66;
  --c-warn: #a97b1e;        /* offen */
  --c-fehler: #9c3b32;

  /* Lämpchen in derselben Sprache (X5) */
  --lampe-gut: #3b7a4e;
  --lampe-warn: #a97b1e;
  --lampe-schlecht: #9c3b32;
  --lampe-aus: #8b857a;

  /* Themenfarben gedämpft — auf Papier blenden die Neon-Werte */
  --e-teal: #2a6f6a;   --e-teal-l: #cfe3e0;   --e-teal-t: #0f2f2c;
  --e-blue: #1f5a66;   --e-blue-l: #dce8ea;   --e-blue-t: #0d2a30;
  --e-amber:#a97b1e;   --e-amber-l:#f3e9d2;   --e-amber-t:#3d2c07;
  --e-green:#3b7a4e;   --e-green-l:#e2ede4;   --e-green-t:#12301d;
  --e-violet:#5b4b86;  --e-violet-l:#e2ddef;  --e-violet-t:#241c3a;
  --e-coral:#9c3b32;   --e-coral-l:#f2dedb;   --e-coral-t:#3a130f;
  --e-gray: #8b857a;   --e-gray-l: #e6e3d9;   --e-gray-t: #2a2720;

  /* Schatten weich — Papier wirft keine harten Kanten */
  --schatten-1: 0 1px 2px rgba(35,33,28,.07);
  --schatten-2: 0 8px 24px rgba(35,33,28,.12);
  --schatten-3: 0 16px 48px rgba(35,33,28,.16);

  /* Lesen statt Bedienen: etwas größer, etwas runder */
  --schrift-basis: 14px;
  --rad: 6px;
  --rad-panel: 10px;

  /* Serifen für Überschriften — Bauteile greifen sie über --schriftfamilie-titel ab */
  --schriftfamilie-titel: Georgia, "Times New Roman", serif;
}

/* Grundstellung für Bauteile, die den Titel-Stapel abfragen: wie der Fließtext.
   Nur Papier setzt ihn auf Serifen (siehe oben). */
:root{ --schriftfamilie-titel: var(--schriftfamilie, system-ui, sans-serif); }

/* ---- Schriftfamilie: v3_3-Muster (Apple-Systemstapel) -------------------- */
:root{
  --schriftfamilie: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

/* ---- ERGÄNZT 05.09.2026 (Nr. 132, AC-51 Reserve-Token + Abstände) ----------------------
   Semantische Abstände und Reserve-Variablen: definiert, unbenutzt, kommentiert — damit ein
   späteres systemweites Design-Upgrade nur DIESE Datei anfasst (Alex: „Module die alle im
   Nachhinein systemweit auf einmal verbessert werden können"). Kein Bauteil setzt eigene Werte. */
:root{
  --abstand-1: 4px;  --abstand-2: 8px;  --abstand-3: 12px;
  --abstand-4: 16px; --abstand-5: 24px; --abstand-6: 40px;
  --tipp-klein: 32px;           /* Nr. 381 · kleinste Tippfläche für Mini-Knöpfe */
  --feld-schrift-handy: 16px;   /* Nr. 381 · iOS zoomt unter 16 px */
  --flaeche-1: var(--bg);  --flaeche-2: var(--surf);  --flaeche-3: var(--surf2);  --flaeche-4: var(--surf3);
  --akzent-1: var(--c-act); --akzent-2: var(--c-root); --akzent-3: var(--c-fehler);
  --linie-1: var(--bord);   --linie-2: var(--dim);
  --radius-s: var(--rad);   --radius-m: var(--rad-panel); --radius-l: 16px;
  --reserve-farbe-1: #0000; --reserve-farbe-2: #0000; --reserve-farbe-3: #0000; --reserve-farbe-4: #0000;
  --reserve-farbe-5: #0000; --reserve-farbe-6: #0000; --reserve-farbe-7: #0000; --reserve-farbe-8: #0000;
  --reserve-mass-1: 0px; --reserve-mass-2: 0px; --reserve-mass-3: 0px; --reserve-mass-4: 0px;
  --reserve-schrift-1: var(--schriftfamilie); --reserve-schrift-2: ui-monospace, Consolas, monospace;
  --haut-fassung: "4 (28.09.2026 · CODE-336-E)";
}
/* Dichte-Schalter (RentyData X9): <html data-dichte="eng|normal|weit"> — Grundstellung normal */
html[data-dichte="eng"]{ --abstand-2: 6px; --abstand-3: 8px; --abstand-4: 12px; --schrift-basis: 12px; }
html[data-dichte="weit"]{ --abstand-2: 10px; --abstand-3: 16px; --abstand-4: 24px; --schrift-basis: 14px; }
/* Haut-Schalter (RentyData): <html data-haut="apple|windows|android"> — heute nur Schriftstapel */
html[data-haut="windows"]{ --schriftfamilie: "Segoe UI", system-ui, sans-serif; --rad: 3px; }
html[data-haut="android"]{ --schriftfamilie: Roboto, system-ui, sans-serif; --rad: 8px; }

/* ==========================================================================
   Nr. 295 · 24.09.2026 · Haut A „Glas" + Haut C „Dunkel" (FR29301 = A, Skizzen FR13811)
   ==========================================================================
   Alex (Zwischenruf 24.09.2026 12:20 Panama): „A · GlasApple-Translucency, 10 px, SF-Schrift".
   Herkunft der Werte: claude/archiv/ARTIFACT-renty-haut-skizzen-FR13811-20260924.html (.glas, .dunkel),
   Kontrast auf WCAG ≥ 4.5:1 nachgeschärft (Belege: claude/a295/HAUT-295-BERICHT.md).

   Schalter:  <html data-haut="glas">   hell, halbdurchsichtige Flächen, Unschärfe 10 px, Rundung 10 px
              <html data-haut="dunkel"> Schwarz/Weiß „Dunkel-Edel", Akzent Grafit statt Farbe
   Ohne data-haut bleibt alles wie bisher (data-thema dunkel/hell/papier). Die Haut schlägt das
   Thema, weil sie weiter unten steht (gleiche Spezifität) — wer glas/dunkel setzt, wählt das Ganze.
   Kein @media(prefers-color-scheme): die Haut bleibt ein bewusster Schalter (siehe Kopf).

   Neue Token (in jeder Haut definiert, Grundstellung wirkungslos):
     --glas-filter   backdrop-filter der Glasflächen (Grundstellung none)
     --grund-bild    Hintergrundbild des Grunds (Grundstellung none)
     --auf-akzent    Schriftfarbe auf --c-act (Grundstellung #fff) — für Bauteile, die heute noch
                     „color:#fff" auf dem Akzent fest verdrahten (Gehäuse-Nachzug, AC-51)
   ========================================================================== */
:root{
  --glas-filter: none;
  --grund-bild: none;
  --auf-akzent: #fff;
  --schriftfamilie-sf: -apple-system, "SF Pro Text", "SF Pro Display", BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

/* ---- A · Glas ------------------------------------------------------------ */
html[data-haut="glas"]{
  --schriftfamilie: var(--schriftfamilie-sf);
  --schriftfamilie-titel: var(--schriftfamilie-sf);
  --rad: 10px;
  --rad-panel: 14px;
  --radius-l: 18px;

  --bg: #eef0f3;
  --surf: rgba(255,255,255,.72);      /* Kopf, Fuß, Leisten, Karten: Inhalt scheint durch */
  --surf2: rgba(255,255,255,.90);
  --surf3: rgba(255,255,255,.55);
  --bord: rgba(0,0,0,.08);
  --text: #1d1d1f;
  --text-hoch: #000000;
  --dim: #5f5f64;                     /* Skizze #6e6e73 = 4.44:1 auf dem Grund → nachgeschärft */

  --c-root: #0a66ff;
  --c-ast:  #d70015;
  --c-up:   #1d1d1f;
  --c-dn:   #1f7a36;
  --c-act:  #0a66ff;                  /* iOS-Blau; #fff darauf 4.82:1 */
  --c-warn: #b45309;
  --c-fehler: #c42b1c;
  --auf-akzent: #fff;

  --lampe-gut: #30b46c;
  --lampe-warn: #d98a00;
  --lampe-schlecht: #e5484d;
  --lampe-aus: #a1a1a6;

  --schatten-1: 0 1px 2px rgba(0,0,0,.05);
  --schatten-2: 0 6px 18px rgba(0,0,0,.06);
  --schatten-3: 0 16px 40px rgba(0,0,0,.10);

  --glas-filter: saturate(180%) blur(10px);
  --grund-bild: radial-gradient(circle at 20% 10%, #dfe6ff 0, transparent 40%),
                radial-gradient(circle at 90% 90%, #d9f3ea 0, transparent 40%);
}
/* Glas braucht Fläche + Unschärfe am Gehäuse. Einziger Strukturteil der Haut: er setzt keine
   eigenen Werte, sondern reicht nur die Token an die Gehäuse-Bereiche durch. Neue Bauteile
   melden sich mit data-glas an, statt hier Selektoren nachzutragen. */
html[data-haut="glas"] body{
  background-image: var(--grund-bild);
  background-attachment: fixed;
}
html[data-haut="glas"] :is(header, footer, nav, aside, [data-glas]){
  -webkit-backdrop-filter: var(--glas-filter);
  backdrop-filter: var(--glas-filter);
}
/* Alte Geräte ohne backdrop-filter (altes iPad, Stempel § 1a): deckende Rückfallflächen */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  html[data-haut="glas"]{
    --surf: #f8f9fb;
    --surf2: #ffffff;
    --surf3: #f2f3f6;
    --bord: #e2e4e8;
    --grund-bild: none;
  }
}

/* ---- C · Dunkel („Dunkel-Edel", Britta-Stil, kein Rosa) ---------------------
   Skizze: Akzent Weiß (#f5f5f7). Das Gehäuse schreibt auf dem Akzent heute noch fest #fff —
   Weiß auf Weiß wäre unlesbar. Darum Akzent Grafit #636366 (#fff darauf 5.99:1), bis das Gehäuse
   --auf-akzent nutzt; dann hier --c-act:#f5f5f7 + --auf-akzent:#000 (Frage an Fable, Nr. 295). */
html[data-haut="dunkel"]{
  --schriftfamilie: -apple-system, "SF Pro Display", "SF Pro Text", BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --schriftfamilie-titel: var(--schriftfamilie);
  --rad: 12px;
  --rad-panel: 16px;
  --radius-l: 20px;

  --bg: #000000;
  --surf: #131315;
  --surf2: #1e1e21;
  --surf3: #26262a;
  --bord: #2c2c30;
  --text: #e5e5ea;
  --text-hoch: #ffffff;
  --dim: #8e8e93;

  --c-root: #0a84ff;
  --c-ast:  #ff453a;
  --c-up:   #ffffff;
  --c-dn:   #30d158;
  --c-act:  #636366;
  --c-warn: #ff9f0a;
  --c-fehler: #ff453a;
  --auf-akzent: #fff;

  --lampe-gut: #30d158;
  --lampe-warn: #ff9f0a;
  --lampe-schlecht: #ff453a;
  --lampe-aus: #48484a;

  --schatten-1: 0 1px 2px rgba(0,0,0,.6);
  --schatten-2: 0 12px 30px rgba(0,0,0,.6);
  --schatten-3: 0 20px 56px rgba(0,0,0,.7);

  --ai-grad: linear-gradient(135deg,#3a3a3c,#636366,#8e8e93);
}

/* ==========================================================================
   Nr. 336-E · 28.09.2026 · RentyNaviWorld — Rollen für Kugel, Tonne und Nabe (CODE-336-E)
   ==========================================================================
   Warum hier: Werte gehören in die Haut (AC-51/X36), das Bauteil liest sie nur — auch die WebGL-Kugel
   (renty-naviworld-kugel.js liest die Farben zur Laufzeit per getComputedStyle und zieht bei jedem
   Wechsel von data-thema/data-haut nach). CODE-336-B („Edel": Glas, Tiefe, Schatten, Unschärfe) war beim
   Bau noch nicht geliefert — B darf diese Rollen später auf seine Edel-Token umbiegen, ohne das Bauteil
   anzufassen. Fast alle Werte sind Verweise auf vorhandene Token; neu sind nur Maße der Tonne, die
   Tiefenunschärfe und der Schlagschatten der Schriftzüge je Thema.
   Hausschrift (FR33609 = A, Gedächtnis „rentyschrift", Nr. 339): DM Sans (SIL OFL) ist die Grundschrift —
   Datei schriften/renty-dmsans.woff2 (Teilmenge Latein, variabel), @font-face in renty-naviworld.css.
   ========================================================================== */
:root{
  --schrift-haus: "Renty DM Sans", var(--schriftfamilie);

  /* Maße */
  --nw-hitbox: 44px;                 /* kleinste Tippfläche (Apple HIG) — Knöpfe, Treffer auf der Kugel */
  --nw-perspektive: 700px;           /* Tonne: Augenabstand der CSS-Perspektive */
  --nw-fach-hoehe: 44px;             /* Tonne: Höhe eines Fachs = eine Tippfläche */
  --nw-rad-breite: 11em;             /* Tonne: Breite eines Rads (in em der Hausschrift) */
  --nw-tiefen-unschaerfe: 2.4px;     /* Tonne: Unschärfe der Nachbarn bei 90° Abstand zur Mitte */
  --nw-tiefen-deckkraft: 1.7;        /* Tonne: Exponent k in Deckkraft = cos(Δ)^k */
  --nw-kugel-hoehe: 72vh;            /* Kugel-Bühne: Höhe, wenn die Seite nichts vorgibt */
  --nw-kugel-hoehe-min: 320px;
  --nw-leiste-abstand: var(--abstand-3);
  --nw-schild-breite: 16em;          /* Beschriftung auf der Kugel: höchstens so breit */

  /* Farben (Verweise) */
  --nw-grund: var(--bg);             /* Raum hinter der Kugel */
  --nw-kugel-glas: var(--surf2);     /* Oberfläche: dunkles/helles Glas je Thema */
  --nw-atmosphaere: var(--c-root);   /* Fresnel-Schein am Rand */
  --nw-gradnetz: var(--dim);         /* Alex' „Halbkugelnetz", alle 15° */
  --nw-kante: var(--dim);            /* Eltern → Kind */
  --nw-verweis: var(--akzent-1);     /* Querverweise (bezug), höhere Bögen */
  --nw-stern: var(--text-hoch);
  --nw-tag: var(--lampe-gut);        /* ● fertig */
  --nw-daemmerung: var(--lampe-warn);/* ◐ in Arbeit */
  --nw-nacht: var(--lampe-aus);      /* ○ offen */
  --nw-fokus: var(--c-act);
  --nw-plus: var(--c-ast);           /* das rote + im Logo (K-74) */
  --nw-schild-grund: var(--surf);    /* Glas-Pille unter der Beschriftung (Kontrast ≥ 4,5:1) */
  --nw-schild-text: var(--text-hoch);
  --nw-neu: var(--lampe-gut);        /* grüner Neu-Punkt, 3 Tage */

  /* Tiefe: Relief der Schriftzüge + Leuchten */
  --nw-relief-kante: var(--bord);
  --nw-schlagschatten: rgba(0,0,0,.55);
  --nw-relief: 0 1px 0 var(--nw-relief-kante), 0 2px 0 var(--nw-relief-kante), 0 6px 14px var(--nw-schlagschatten);
  --nw-leuchten: 0 0 .35em var(--nw-plus), 0 0 1.1em var(--nw-plus);
  --nw-schatten-ebene: var(--schatten-3);
  --nw-dauer-leuchten: var(--dauer-mittel);

  /* Ebenen */
  --nw-z-bedien: var(--z-legende);
  --nw-z-ebene: var(--z-menue);
  --nw-z-blase: var(--z-toast);
}
html[data-thema="hell"]{ --nw-schlagschatten: rgba(15,15,17,.20); }
html[data-thema="papier"]{ --nw-schlagschatten: rgba(35,33,28,.20); }
html[data-haut="glas"]{ --nw-schlagschatten: rgba(0,0,0,.16); }
html[data-haut="dunkel"]{ --nw-schlagschatten: rgba(0,0,0,.75); --nw-verweis: var(--c-root); }

/* ==========================================================================
   Nr. BW-INSELKARTE · 28.09.2026 · Bocasworld-Inselkarte (CODE-BOCASWORLD-INSELKARTE)
   ==========================================================================
   Alex (28.09.2026): „die Darstellung soll auf allen Endgeräten Farbig sein, der Topographie entsprechen".
   Darum gelten diese Rollen in JEDER Haut gleich (glas, dunkel, papier, hell): eine Landkarte ist ein Bild,
   kein Gehäuse — nur die Bedienteile der Karte (Knöpfe, Info-Karte) folgen der Haut über --surf/--text.
   Nur dieser Block ist neu; alles darüber ist unverändert. Nutzer: bocasworld/karte/bw-inselkarte*.css
   und die Klassen in bw-inselkarte.svg (gebaut von bocasworld/karte/quelle/inselkarte-bauen.py).
   Herkunft der Farben: Beispielbild 00-IMPORT/Sonstiges 2/bocas-karte.webp (Türkis-Flachwasser, sattes Grün),
   Höhenschichten nach kartografischer Sitte (Grün unten → Oliv → Braun oben).
   ========================================================================== */
:root{
  /* Wasser: tief → flach (Tiefenstufen als Bänder um jede Küste) */
  --bwk-meer-tief: #0a3f68;
  --bwk-meer: #10679a;
  --bwk-band-1: #1682ab;      /* Schelf, ~800 m vor der Küste */
  --bwk-band-2: #25a3bb;      /* flach */
  --bwk-band-3: #4cc6c4;      /* Lagune */
  --bwk-band-4: #9fe6d6;      /* knietief, Sandgrund */
  --bwk-bucht: #1b8fb0;       /* Buchten und Lagune heller als offene See */
  --bwk-welle: rgba(255,255,255,.13);
  /* Land: Höhenschichten 0 (Küste) → 6 (Bergland Festland) */
  --bwk-land-0: #7dbb55;
  --bwk-land-1: #5ea846;
  --bwk-land-2: #46933b;
  --bwk-land-3: #317a33;
  --bwk-land-4: #3f6c30;
  --bwk-land-5: #6e6c3c;
  --bwk-land-6: #8d7b50;
  --bwk-festland: #6aa94e;    /* Tiefland Festland, etwas gedeckter als die Inseln */
  --bwk-licht: rgba(255,252,220,.30);
  --bwk-schatten: rgba(8,38,20,.30);
  --bwk-wald: rgba(18,66,28,.26);
  --bwk-sand: #f0dfaa;
  --bwk-sand-dunkel: #d6bd82;
  --bwk-mangrove: #24552f;
  --bwk-riff: rgba(220,248,238,.85);
  --bwk-koralle: #f19f86;
  --bwk-riff-flaeche: rgba(170,236,222,.35);
  /* Wege */
  --bwk-strasse: #c79f63;
  --bwk-route: #ffffff;
  --bwk-ausflug: #ffe08a;
  --bwk-route-schatten: rgba(4,36,58,.40);
  /* Schrift auf der Karte (mit Lichthof, damit sie auf Grün und Blau lesbar bleibt) */
  --bwk-schrift-insel: #fffdf2;
  --bwk-schrift-wasser: #dff6f8;
  --bwk-schrift-land: #f6f0d6;
  --bwk-schrift-hof: rgba(10,38,30,.78);
  /* Marker je Art (Bocasworld-Elemente) — Weiß darauf ≥ 3:1 */
  --bwk-typ-unterkunft: #d9480f;
  --bwk-typ-strand: #d97706;
  --bwk-typ-boot: #1c64c8;
  --bwk-typ-essen: #b7791f;
  --bwk-typ-tauchen: #0b8a8a;
  --bwk-typ-natur: #2b8a3e;
  --bwk-typ-aussicht: #7c3aed;
  --bwk-typ-bocasworld: #c2255c;
  --bwk-typ-ort: #37474f;
  --bwk-auf-typ: #ffffff;
  --bwk-marker-rand: #ffffff;
  /* Ersatzbilder (gezeichnet, bis die KI-Grafik da ist) */
  --bwk-farbe-weiss: #fffdf6;
  --bwk-farbe-hell: #efe4cc;
  --bwk-farbe-dunkel: #1f1b17;
  --bwk-farbe-fell: #9a8266;
  --bwk-farbe-braun: #6f4e2e;
  --bwk-farbe-holz: #a0703f;
  --bwk-farbe-dach: #caa35c;
  --bwk-farbe-gelb: #f5c330;
  --bwk-farbe-orange: #ee8527;
  --bwk-farbe-rot: #d62839;
  --bwk-farbe-blau: #2463b3;
  --bwk-farbe-grau: #8d9ca8;
  --bwk-farbe-gruen: #3d9a3a;
  --bwk-farbe-gruen-dunkel: #2a6e2c;
  /* Bedienteile auf der Karte (liegen auf Wasser/Grün, darum eigenes Glas) */
  --bwk-glas: rgba(255,255,255,.90);
  --bwk-glas-text: #12303a;
  --bwk-glas-rand: rgba(0,0,0,.10);
  --bwk-schatten-knopf: 0 2px 8px rgba(0,0,0,.28);
  --bwk-abdunkeln: rgba(4,24,36,.45);
  --bwk-vignette: inset 0 0 90px rgba(2,28,48,.42);   /* Randabdunklung der Kartenbühne (Tiefe, „Wow“) */
  /* Maße */
  --bwk-hoehe: min(80vh, 760px);   /* Kartenfeld Desktop */
  --bwk-hoehe-schmal: 76vh;        /* Kartenfeld Handy (≤ 640 px) */
  --bwk-marker: 36px;              /* Tippziel ≥ 36 px, Bocas-Handys */
  --bwk-marker-klein: 28px;        /* Detail-Marker ab Zoomstufe 2 */
  --bwk-knopf: 44px;               /* + / − / ⟲, iOS-Tippziel */
  --bwk-kompass: 84px;
  --bwk-band-breite: 300px;        /* Schriftband oben links */
  --bwk-info-breite: 320px;        /* Info-Karte am Marker */
  --bwk-poster-seiten: 1.6;        /* Seitenverhältnis Standbild Desktop (1280 × 800) */
  --bwk-poster-seiten-schmal: .8;  /* Standbild Handy (640 × 800) */
}

/* ==========================================================================
   Nr. 364-B · 28.09.2026 · RentyNaviWorld 1.2 — Erde, Anflug, Walze, Ring, Fenster (CODE-364-B)
   ==========================================================================
   Alex (28.09.2026): „Überziehe die Weltkugel mit einer ansprechenden fotorealistischen Grafik …“ · „nimm google earth als
   vorlage“ · „die Tonnennavigation ist noch nicht plastisch in 3 D …“. Klickkarte 364: FR36402/04/05/06/08 = A.
   Neue Rollen, alles darüber unverändert. Leser: renty-naviworld.css (Walze, Ring, Fenster) und renty-naviworld-kugel.js
   (Shader-Farben per getComputedStyle — Erde, Wolken, Stadtlichter, Meeresglanz, Sonne, Linsenreflex, Nebel).
   Die Erdfarben selbst kommen aus den NASA-Texturen (lib/erde/, gemeinfrei) — hier stehen nur die Lichter darüber.
   ========================================================================== */
:root{
  /* Erde + All (WebGL liest diese Werte) — gleich in jeder Haut: Licht ist Licht */
  --nw-wolke: #f4f6fa;                  /* Wolkenschicht, beleuchtet */
  --nw-stadtlicht: #ffc978;             /* Stadtlichter auf der Nachtseite */
  --nw-meer-glanz: #fff1d6;             /* Sonnenspiegelung auf dem Ozean */
  --nw-sonne: #ffe2a8;                  /* Sonnenhof */
  --nw-sonne-kern: #ffffff;             /* Sonnenscheibe */
  --nw-linsenreflex: #9cc2ff;           /* Ringe und Scheiben des Linsenreflexes */
  --nw-nebel-a: var(--nw-atmosphaere);  /* Milchstraßenschleier, zwei Töne */
  --nw-nebel-b: var(--akzent-1);

  /* Walze (Tonne echt 3D) — dunkles Metall mit hellen Ringen */
  --nw-walze-material: linear-gradient(180deg, #3b3e46 0%, #2b2d34 48%, #1f2026 100%);
  --nw-walze-hinten: #111216;           /* Hohlraum hinter der Walze */
  --nw-walze-einbau: inset 0 0 0 1px rgba(0,0,0,.55), inset 0 2px 6px rgba(0,0,0,.6);
  --nw-walze-fuge: rgba(255,255,255,.06);
  --nw-walze-schatten: #000000;         /* Schattierung eines Fachs nach Winkel (Deckkraft = Winkelanteil) */
  --nw-walze-tiefe: linear-gradient(180deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.18) 28%, rgba(0,0,0,0) 42%, rgba(0,0,0,0) 58%, rgba(0,0,0,.18) 72%, rgba(0,0,0,.78) 100%);
  --nw-walze-glanz: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.26) 46%, rgba(255,255,255,.08) 54%, rgba(255,255,255,0) 100%);
  --nw-walze-linse: linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.03) 50%, rgba(0,0,0,.08) 100%);
  --nw-walze-linse-kante: rgba(255,255,255,.22);
  --nw-walze-ring: linear-gradient(90deg, #5d626b 0%, #d8dce2 38%, #8b919a 60%, #3a3e45 100%);
  --nw-walze-ring-schatten: 0 0 6px rgba(0,0,0,.55);
  --nw-walze-ring-breite: 7px;
  --nw-bewegung-unschaerfe: 2px;        /* höchste Bewegungsunschärfe bei vollem Tempo */

  /* Ring frei platzierbar */
  --nw-andock-abstand: 32px;            /* so nah an Ecke/Kantenmitte rastet der Ring magnetisch ein */
  --nw-ring-schatten-zug: 0 24px 60px rgba(0,0,0,.55), 0 8px 18px rgba(0,0,0,.35);
  --nw-nabe-tonne: 0 0 0 2px var(--akzent-1), 0 0 18px var(--akzent-1);

  /* Fenster-Flug (Glas-Tafel) */
  --nw-fenster-glas: rgba(28,28,34,.86);
  --nw-fenster-rand: rgba(255,255,255,.14);
  --nw-fenster-filter: saturate(160%) blur(18px);
  --nw-fenster-schatten: 0 40px 120px rgba(0,0,0,.60), 0 12px 32px rgba(0,0,0,.40);
  --nw-fenster-perspektive: 1200px;
  --nw-fenster-breite: 64em;
  --nw-fenster-hoehe: 82vh;
  --nw-schleier: rgba(0,0,0,.38);
  --nw-z-fenster: var(--z-menue);
}
html[data-thema="hell"], html[data-thema="papier"]{
  --nw-walze-material: linear-gradient(180deg, #ffffff 0%, #f1f2f4 50%, #e2e4e8 100%);
  --nw-walze-hinten: #c9ccd2;
  --nw-walze-einbau: inset 0 0 0 1px rgba(0,0,0,.12), inset 0 2px 6px rgba(0,0,0,.18);
  --nw-walze-fuge: rgba(0,0,0,.06);
  --nw-walze-schatten: #4a4f58;
  --nw-walze-tiefe: linear-gradient(180deg, rgba(40,44,52,.55) 0%, rgba(40,44,52,.10) 28%, rgba(40,44,52,0) 42%, rgba(40,44,52,0) 58%, rgba(40,44,52,.10) 72%, rgba(40,44,52,.55) 100%);
  --nw-walze-glanz: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.9) 46%, rgba(255,255,255,.3) 54%, rgba(255,255,255,0) 100%);
  --nw-walze-linse-kante: rgba(0,0,0,.14);
  --nw-ring-schatten-zug: 0 24px 60px rgba(15,15,17,.22), 0 8px 18px rgba(15,15,17,.14);
  --nw-fenster-glas: rgba(250,250,252,.90);
  --nw-fenster-rand: rgba(0,0,0,.10);
  --nw-fenster-schatten: 0 40px 120px rgba(15,15,17,.22), 0 12px 32px rgba(15,15,17,.14);
  --nw-schleier: rgba(15,15,17,.18);
}
html[data-haut="glas"]{
  --nw-fenster-glas: rgba(255,255,255,.72);
  --nw-fenster-rand: rgba(255,255,255,.55);
  --nw-fenster-schatten: 0 30px 90px rgba(0,0,0,.18), 0 10px 24px rgba(0,0,0,.10);
}
html[data-haut="dunkel"]{
  --nw-fenster-glas: rgba(12,12,16,.88);
  --nw-schleier: rgba(0,0,0,.55);
}

/* ==========================================================================
   Nr. 364-A · 28.09.2026 · Inselkarte 3D — Anflug aus dem All, Vogelflug mit Tukan, Vordergrund-Ebenen (CODE-364-A)
   ==========================================================================
   Wie Block „Nr. BW-INSELKARTE“: gilt in JEDER Haut gleich (Landkarte = Bild, kein Gehäuse); nur Bedienteile folgen der Haut.
   Nutzer: bocasworld/karte/bw-inselkarte-3d.css · bw-inselkarte-tukan.js · bw-inselkarte-vordergrund.js · bw-inselkarte-stil.js
   (liest Himmel/Nebel/Wasser/Wege von hier; alles andere im MapLibre-Stil ist „haut-ausnahme: Kartenstil“).
   Tukan- und Faultier-Farben: Recherche Nr. 364 (Fischertukan, Ramphastos sulfuratus — Wikipedia „Keel-billed toucan“, ADW, ITEC-Vogelliste
   Bocas del Toro); Näherungen aus Beschreibungen, nachziehen NUR hier. Nur dieser Block ist neu; alles darüber ist unverändert.
   ========================================================================== */
:root{
  /* Weltall hinter dem Globus (Anflug) */
  --bwk3-weltall: #02040b;
  --bwk3-weltall-mitte: #0a1230;
  --bwk3-milchstrasse: rgba(168,178,255,.10);
  --bwk3-milchstrasse-kern: rgba(255,236,210,.08);
  --bwk3-stern: #ffffff;
  --bwk3-stern-warm: #ffe7c2;
  --bwk3-stern-kalt: #cddcff;
  /* Himmel und Dunst der 3D-Karte (Spiel-Look) — gelesen vom Kartenstil */
  --bwk3-himmel: #5fa8e6;
  --bwk3-horizont: #d9eefb;
  --bwk3-nebel: #cfe6f4;
  --bwk3-wasser-toenung: #1fb5c9;
  --bwk3-gebaeude: #f3ead8;
  --bwk3-strasse-rand: rgba(40,30,18,.55);
  --bwk3-schrift-hof: rgba(8,26,34,.85);
  /* Bedienteile auf der 3D-Karte (Glas, liegt auf Satellitenbild) */
  --bwk3-glas: rgba(255,255,255,.80);
  --bwk3-glas-dunkel: rgba(10,22,32,.62);
  --bwk3-glas-text-hell: #f4fbff;
  --bwk3-glas-unschaerfe: 14px;
  --bwk3-schild-glas: rgba(255,255,255,.74);
  --bwk3-schild-text: #0e2430;
  --bwk3-hoehe: min(84vh, 800px);
  --bwk3-hoehe-schmal: 80vh;
  --bwk3-leiste-hoehe: 36px;
  --bwk3-panel-breite: 300px;
  --bwk3-dauer-blende: .7s;
  --bwk3-z-sterne: 0;
  --bwk3-z-karte: 1;
  --bwk3-z-vordergrund: 3;
  --bwk3-z-tukan: 4;
  --bwk3-z-bedien: 6;
  --bwk3-z-info: 7;
  --bwk-typ-surf: #0369a1;            /* neue Art „Surfen“ (Paunch, Silverbacks) — Weiß darauf ≥ 3:1 */
  /* Vordergrund-Ebenen (Silhouetten, vorne dunkel → hinten hell und unscharf) */
  --bwk3-vg-nah: #07130c;
  --bwk3-vg-nah-licht: #1d3b27;
  --bwk3-vg-mitte: #163022;
  --bwk3-vg-mitte-licht: #3a6446;
  --bwk3-vg-fern: #3f6b55;
  --bwk3-vg-fern-licht: #8fb89c;
  --bwk3-vg-sand: #2b2618;
  --bwk3-vg-sand-licht: #6e5f3c;
  --bwk3-vg-unschaerfe-fern: 3px;
  --bwk3-vg-unschaerfe-mitte: 1.2px;
  --bwk3-vg-deckkraft-fern: .72;
  --bwk3-vg-breite: 30vw;             /* Palmen links/rechts */
  --bwk3-vg-breite-schmal: 44vw;
  --bwk3-vg-strand-hoehe: 16%;
  --bwk3-vg-wiegen: 7s;               /* ein Wiegen im Wind hin und zurück */
  --bwk3-vg-wiegen-grad: 1.6deg;      /* Ausschlag der Palmwedel */
  --bwk3-vg-gras-grad: 3deg;          /* Neigen des Strandgrases */
  /* Tukan (Fischertukan) — Figur und Größe */
  --bwk-tukan-koerper: #141414;
  --bwk-tukan-schatten: #000000;
  --bwk-tukan-kante: rgba(255,255,255,.30);     /* dünner heller Rand an den Flügelvorderkanten */
  --bwk-tukan-koerper-licht: #34363d;  /* bläulicher Glanz auf Rücken und Kopf (Lichtseite) */
  --bwk-tukan-schnabel-gruen: #7dbe3a;
  --bwk-tukan-schnabel-orange: #f28c1e;
  --bwk-tukan-schnabel-rot: #d8261b;
  --bwk-tukan-schnabel-blau: #3e7cc4;
  --bwk-tukan-kiel: #e8e0a0;
  --bwk-tukan-kehle: #ffd400;
  --bwk-tukan-kehlband: #d8261b;
  --bwk-tukan-buerzel: #f5f5f0;
  --bwk-tukan-steiss: #d01818;
  --bwk-tukan-schwanzspitze: #d8261b;
  --bwk-tukan-augenhaut: #8fd0e0;
  --bwk-tukan-iris: #3ab5b0;
  --bwk-tukan-beine: #4a78c0;
  --bwk-tukan-bodenschatten: rgba(0,0,0,.22);
  --bwk-tukan-groesse: 150px;
  --bwk-tukan-groesse-schmal: 104px;
  --bwk-tukan-links: 57%;             /* Platz im Bild: unteres Drittel, leicht rechts der Mitte */
  --bwk-tukan-oben: 60%;
  /* Tier-Szene: Vordergrund-Baum (Cecropia/Seemandel) mit Lianen — Naturfarben */
  --bwk3-szene-breite: 36vw;
  --bwk3-szene-breite-schmal: 54vw;
  --bwk3-baum-rinde: #4b3d30;
  --bwk3-baum-rinde-licht: #7c6a54;
  --bwk3-baum-blatt: #3f6d2e;
  --bwk3-baum-blatt-licht: #79a856;
  --bwk3-baum-blatt-unten: #a9b8a0;    /* Cecropia: weißliche Blattunterseite */
  --bwk3-liane: #3a5529;
  --bwk3-liane-blatt: #4d7c38;
  /* Braunkehl-Faultier (Bradypus variegatus) — Recherche Nr. 364 (Wikipedia „Brown-throated sloth“, ADW, xenarthrans.org);
     Näherungen aus Beschreibungen, nachziehen NUR hier */
  --bwk-faultier-fell: #7a6d5a;
  --bwk-faultier-schatten: #4e4436;
  --bwk-faultier-alge: #85935a;         /* Algen-Grünschimmer (Kopf, Schulter, oberer Rücken) */
  --bwk-faultier-gesicht: #cdbb93;
  --bwk-faultier-maske: #3a2c20;        /* Augenmaske und Stirn */
  --bwk-faultier-kehle: #6b4a32;
  --bwk-faultier-rueckenfleck: #d9a65e;  /* Männchen (Variante) */
  --bwk-faultier-rueckenstreif: #1e1812;
  --bwk-faultier-kralle: #d8cdb4;
  --bwk-faultier-krallenspitze: #9c8f76;
  --bwk-faultier-nase: #2a211a;
  --bwk-faultier-auge: #1b1510;
}

/* ===== Nr. 372 · Homepage-Spalte (CODE-372-A) =====
   Eine Spaltenbreite für Hero, #buchen, Rechner und Kalender der Homepage (homepage-neu).
   Die Homepage lädt diese Haut nicht und spiegelt den Wert in ihrem :root — beide gleich halten. */
:root{
  --lp-spalte-breite: 1100px;
}


/* ==========================================================================
   Nr. 361 · 28.09.2026 · M02 Kalender 2.0 „Schaltstelle" — Zahlfarben je Gast + Naht (CODE-361-A E1, AC-51)
   ==========================================================================
   Zweite Helligkeit je Themenfarbe (-2): zwei aufeinanderfolgende Gäste mit gleichem Bild wechseln zwischen
   --e-<farbe> und --e-<farbe>-2 — am Wechseltag zeigt die schräge Kachel zwei Farben („findet er es sofort?").
   Zahlbild der Zeile „TAB-Zahlung" (FR36101 A):  voll = --e-violet / --e-violet-2 ·
   gestrichelt (offen, Link gesendet) = --e-violet-l / --e-violet-l2 + Strichrand · verfallen = --e-gray-l / --e-gray-l2.
   Häute: hell (data-thema) und die Häute glas/dunkel überschreiben die Themenfarben nicht (wie bisher, Nr. 295) —
   sie erben diese Grundstellung; Papier bekommt gedämpfte Zweitwerte wie seine übrigen Themenfarben.
   --kl-*: Rollen und Maße des Zeilen-Kalenders (Naht zwischen Gästen, Strichrand, Verlängerungs-Punktlinie,
   Hervorhebung .kl-fokus für den Rücksprung E2). Bauteile setzen keine eigenen Werte.
   ========================================================================== */
:root{
  --e-teal-2:  #0f766e;
  --e-blue-2:  #1d4ed8;
  --e-amber-2: #b45309;
  --e-green-2: #15803d;
  --e-violet-2:#6d28d9;   --e-violet-l2:#c4b5fd;
  --e-coral-2: #e11d48;
  --e-gray-2:  #64748b;   --e-gray-l2: #cbd5e1;

  --kl-naht-breite: 3px;              /* Naht zwischen zwei Gästen: Streifen links in der ersten Kachel */
  --kl-strich: 2px;                   /* Strichrand (gestrichelt/verfallen), Punktlinie der Verlängerung */
  --kl-linie: 1px;                    /* feine Linie (Rand der Marke ¢) */
  --kl-naht-grund: var(--flaeche-2);  /* Naht = Grund des Gitters, damit sie wie eine Lücke wirkt */
  --kl-naht-linie: var(--text-hoch);  /* Punktlinie am Übergang Aufenthalt → Verlängerung */
  --kl-fokus: var(--c-warn);          /* E2: 1,2 s Hervorhebung der Kachel nach dem Rücksprung */
}
html[data-thema="papier"]{
  --e-teal-2:  #3f8f88;
  --e-blue-2:  #2f7d8c;
  --e-amber-2: #c89a3c;
  --e-green-2: #5a9a6c;
  --e-violet-2:#7b6aa8;   --e-violet-l2:#cfc6e3;
  --e-coral-2: #b85a50;
  --e-gray-2:  #a6a094;   --e-gray-l2: #d6d2c6;
}
/* Nr. 361 E6a · 29.09.2026 · Nachrichten-Eingang (Korb) + Importe-Kachel + RentyImport: Tippfläche am Handy ≥ 44 px
   (Apple HIG) — Verweis auf --nw-hitbox, kein neuer Wert. Knöpfe/Klappen im Korb, in der Importe-Kachel und auf der Antwortseite. */
:root{
  --kl-tipp: var(--nw-hitbox);
}
/* Nr. 381-K · 30.09.2026 · Endgeräte-Kopf (renty-geraet-kopf.js): Breitenstufen als Token — der Kopf liest --bp-s/-m/-l per getComputedStyle
   (Rückfall 480/768/1200 im Skript). data-breite: s ≤ --bp-s < m ≤ --bp-m < l ≤ --bp-l < xl. Die Zahlen sind unbenannt (px), weil das
   Skript sie als Zahl liest; @media kann keine Variable — Regeln für Endgeräte hängen darum an html[data-breite] / html[data-geraet]. */
:root{
  --bp-s: 480;
  --bp-m: 768;
  --bp-l: 1200;
  --sicher-oben: env(safe-area-inset-top, 0px);      /* das Skript setzt dieselben Werte auf <html>; hier der Rückfall ohne Kopf */
  --sicher-unten: env(safe-area-inset-bottom, 0px);
  --sicher-links: env(safe-area-inset-left, 0px);    /* Querformat mit Notch: Inhalt rutscht nicht unter die Aussparung */
  --sicher-rechts: env(safe-area-inset-right, 0px);
  --hoehe-voll: calc(var(--vh, 1vh) * 100);          /* statt 100vh: die echte Fensterhöhe, ohne iOS-Sprung */
  --bild-verhaeltnis: 16 / 9;                        /* iframe/Karte/Bild ohne eigene Maße: Platz bleibt von Anfang an reserviert */
  --tab-max: 100%;                                   /* Tabellen scrollen im eigenen Kasten, nie breiter als der Inhalt */
}
/* ==========================================================================
   Nr. 381S · 30.09.2026 · Schwebe-Token (Befund 381S — Alex: „schwarz auf schwarz … sowas darf nicht passieren … Systemweit !“)
   Wunschwerte für alle schwebenden Knöpfe und Symbole: ⌂ (renty-heim.js), PapaRenty, Freigabe-Männchen, Kreativix-Renty + Knopf
   „Bauwünsche“ (Prompt-Leiste), „?“ (renty-hilfe.js), „← Familienseite“ (familie/s/_zurueck.js). renty-schwebe.js liest sie, prüft JEDES
   Paar auf ≥ 4.5:1 (WCAG AA), schärft nötigenfalls nach und schreibt daraus --schwebe-grund/-grund-2/-text/-leise/-kante/-akzent/
   -auf-akzent/-warn/-auf-warn/-gut/-link. Seiten ohne diese Haut (PhoneCleaner, Jules Seiten) bekommen dieselben Token aus ihren
   echten Farben. Regel: ein Bauteil nimmt Schrift und Grund IMMER als Paar aus derselben Quelle — nie --text der Seite + eigener
   Grund-Rückfall (das war die Ursache: #1f1f23-Rückfall + helles Thema = 1.07:1).
   ========================================================================== */
:root{
  --schwebe-wunsch-grund: var(--surf);
  --schwebe-wunsch-text: var(--text-hoch);
  --schwebe-wunsch-leise: var(--text);            /* nicht --dim: 3.67:1 auf --surf im Dunkel */
  --schwebe-wunsch-akzent: #4f46e5;               /* Dunkel: --c-act #6366f1 trägt Weiß nur mit 4.47:1 → Indigo 600 (6.29:1) */
  --schwebe-wunsch-auf-akzent: var(--auf-akzent, #fff);
  --schwebe-wunsch-warn: var(--c-fehler);         /* Dunkel 4.36:1 auf --surf → renty-schwebe.js schärft nach */
  --schwebe-wunsch-gut: var(--c-dn);
  --schwebe-wunsch-link: var(--c-root);
}
html[data-thema="hell"], html[data-thema="papier"], html[data-haut="glas"], html[data-haut="dunkel"]{ --schwebe-wunsch-akzent: var(--c-act); }   /* dort trägt --c-act Weiß mit ≥ 4.8:1 */
html[data-haut="glas"]{ --schwebe-wunsch-grund: var(--surf2); }   /* --surf ist in Glas halbdurchsichtig */