/* 🪤 04.09.2026 Stempel-Heilung nach einem abgebrochenen Deploy -- die Begruendung steht in css/components/fenster.css. */ /* Avesmaps design tokens — the single source of truth for the shared warm, aventurian visual language. Never hardcode a colour, size, radius, spacing, or divider in a component; add or reuse a token here. See docs/design-language.md. Palette direction: C ("Heller / Papier") — light neutral parchment, warm taupe-brown controls, restrained coat-gold. No blue anywhere. Themes: light is the default (:root). Dark is OPT-IN via :root[data-theme="dark"] — deliberately NOT prefers-color-scheme, because the map tiles are light and auto-dark panels would clash over them. Wiring a toggle is a separate feature; the language only defines the values. */ :root { --font-ui: "Faculty Glyphic", "Arial", sans-serif; /* Typography scale — 7 rungs, 11px floor (see "Typography" in the doc) */ --font-size-caption: 11px; /* labels, pills, meta — the floor */ /* 🔴 DIE EINE AUSNAHME UNTER DER UNTERGRENZE, und sie hat einen eigenen Namen, damit sie sichtbar eine Ausnahme bleibt statt die Leiter nach unten zu verlaengern. Owner 02.09.2026: „mach die schrift von offiziell/inoffiziel 9px … die pille ist die absolute ausnahme". Sie gilt AUSSCHLIESSLICH dem Kanonwort im Etikett (.fs-kanon) -- ein kurzes, gefettetes Versalwort auf gefuellter Flaeche; das Bezeichnerfeld daneben bleibt auf der Untergrenze. Wer einen zweiten Leser fuer diesen Token sucht: es soll keinen geben. ⚠️ Ein Griff nach diesem Wert an anderer Stelle ist fast immer der Fehler, den --font-size-caption schon einmal geerbt hat (9,5px, vom Nachbarn abgeschrieben). */ --font-size-kanon: 9px; /* NUR das Kanonwort -- unter der Untergrenze, Owner-Entscheid */ --font-size-small: 12px; /* dense body — the workhorse */ --font-size-body: 13px; /* default controls / body */ --font-size-reading: 14px; /* comfortable reading */ --font-size-subhead: 16px; /* subheaders */ --font-size-title: 20px; /* dialog / panel titles */ --font-size-display: 22px; /* infobox hero name */ /* Sperrung der VERSALIEN-Abschnittsueberschriften. Angelegt am 16.08.2026, als die Wiki-Zuweisung den Wert als weiteren Ort gebraucht haette -- ein Literal mehr baut die Divergenz ein, die §12 meint. ⚠️ BEWUSST NICHT MITGEZOGEN sind die Stellen, die den Wert weiterhin literal fuehren; sie liegen in fremden Oberflaechen, und eine Sammelaenderung an ihnen gehoert nicht in den Commit einer Objektart: css/features/ecosystem-layer.css:1034 css/features/mail-inbox.css:52 css/features/review-panel.css:1193 css/pages/admin.css:114 💣 Hier stand eine ZAHL („die uebrigen fuenf"), und sie war falsch: gezaehlt wurden sechs Fundstellen, von denen dieser Commit ZWEI selbst tokenisiert hat -- die Klammerliste nannte sogar den Label-Editor, dessen Vorkommen es danach gar nicht mehr gab. Eine Zahl liest sich wie eine vollstaendige Liste und niemand zaehlt nach (AGENTS.md §11); wer eine Stelle nachzieht, streicht sie oben. */ --letter-spacing-caps: 0.08em; /* Schriftgroesse der EINGABEFELDER -- getrennt von der Lese-Skala oben, weil sie am Finger auf die iOS-Schwelle springt (siehe den (pointer: coarse)-Block unter diesem :root). 🔴 Owner 05.09.2026 („dropdown auf 13 und die eingabefelder auch"): --font-size-body (13px), vorher --font-size-small (12px). Der Sprung am Finger auf 16px bleibt unberuehrt. ⚠️ Gilt den FELDERN, nicht ihren Beschriftungen: die Felder haben feste Hoehen, die Schrift waechst dort nach innen. Beschriftungszeilen mitzuheben machte das Panel hoeher -- und dessen Hoehenbudget ist eine eigene, groessere Frage. */ --font-size-control: var(--font-size-body); /* Schriftgroesse der DROPDOWNS -- ein EIGENER Token, der am Zeiger denselben Wert hat wie --font-size-control und am Finger NICHT. 🔴 Owner 11.08.2026 „alle auf 14px" (die Dropdowns waren untereinander verschieden gross); Owner 05.09.2026 erst „auf 12px", nach dem Blick aufs Telefon dann „dropdown auf 13 und die eingabefelder auch". Damit lesen Dropdowns und Eingabefelder am Zeiger dieselben 13px, und im Routenplaner steht nur noch EINE Groesse neben der 11px-Aufschrift. 💣 GETRENNT BLEIBEN MUSS ER TROTZDEM, und das ist der ganze Grund seiner Existenz: --font-size-control traegt die iOS-SCHWELLE und springt am Finger auf 16px (der (pointer: coarse)-Block unter diesem :root) -- unter 16 zoomt Safari beim Fokus in ein Eingabefeld und kehrt nicht zurueck. Wer hier `var(--font-size-control)` schreibt, zieht jede Combobox am Telefon auf 16px mit; wer umgekehrt die Felder auf diesen Token setzt, holt den Zoom zurueck. Zwei Token, zwei Gruende, gleicher Wert am Zeiger. ⚠️ AM TELEFON stehen damit 13px-Dropdowns neben 16px-Eingabefeldern. Das ist die Folge des Entscheids und keine Nachlaessigkeit; soll der Finger groessere Dropdowns bekommen, gehoert dieser Token in den (pointer: coarse)-Block -- dann aber mit einem eigenen Wert, nicht durch Zusammenlegen. */ --font-size-dropdown: var(--font-size-body); /* Der Pfeil unserer Auswahlfelder. 💣 Als Token, weil ihn ZWEI Stellen brauchen (Meldedialog und Routenplaner) und ein zweiter Data-URI genau die Divergenz waere, vor der §12 warnt -- zwei Bilder, deren Farbe getrennt altert. ⚠️ Die Fuellung steht als Hex im Bild, nicht als currentColor: ein background-image kann currentColor nicht erben. Der Wert ist --color-text-muted. */ --avesmaps-select-chevron: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='8'%20height='6'%3E%3Cpath%20d='M0%200l4%205%204-5z'%20fill='%23706557'/%3E%3C/svg%3E"); --leading-tight: 1.15; /* titles / display */ --leading-snug: 1.25; /* controls / labels */ --leading-normal: 1.45; /* reading body */ --font-weight-regular: 400; --font-weight-bold: 700; /* two weights only — no 500 / 600 / 800 */ /* Surfaces */ --color-page-bg: #f3f0e8; /* app canvas behind the panels */ --color-page-bg-deep: #2b2721; /* deep surround (editor backdrop) */ --color-panel: #fffdf9; /* white card (infobox, route planner) */ --color-panel-soft: #faf6ee; /* softly grouped background */ --color-panel-muted: #f1ece1; /* muted inset (coat frame, wells) */ /* The SELECTED row of a list or rail. One step further from the panel than -muted, in the direction that reads as "pressed" in each theme: darker on light, lighter on dark. -muted alone was too close to the panel to find the active row at a glance. */ --color-panel-active: #e7ddc9; /* Text */ --color-text: #2e271e; --color-text-strong: #3c3327; /* titles, emphasised labels */ --color-text-muted: #706557; /* subtitles, captions, meta */ --color-placeholder: #9a8f7e; /* input placeholder — lighter than muted */ /* Lines */ --color-border: #ddd3c3; /* hairline around controls */ --color-border-strong: #cdbfa8; /* hover / emphasised control edge */ --color-divider: rgba(125, 115, 96, 0.30); /* section separator — same everywhere */ /* Button · primary (filled) — the one main action per surface */ --color-button: #5b5548; --color-button-border: #635b4d; --color-button-text: #f6efe1; --color-button-hover: #6a6353; /* hover — lighter */ --color-button-active: #4c473b; /* pressed — darker */ /* Button · secondary (soft / outline) — e.g. "Link teilen" */ --color-button-soft: #efe9db; --color-button-soft-text: #564b3b; --color-button-soft-border: #cdbda0; --color-button-soft-hover: #e7ddc9; --color-button-soft-active: #ddd1b9; /* Accent = coat-of-arms gold; links in warm gold-brown (NEVER blue) */ --color-accent: #bfa03a; /* 🔴 NACHGESCHAERFT AM 05.09.2026 (Owner-Entscheid auf das Kontrastaudit vom 13.08.2026, docs/kontrast-audit-gold-und-knopfpaar.md §4.1). Vorher `#9c7f22` -- und damit stand JEDE Gold-Beschriftung des hellen Themas unter AA: 3,78 auf `--color-panel` bis 3,17 auf `--color-button-soft`, verlangt sind 4,5:1 fuer Text unter 18,66px fett. Das Audit hatte `#82681e` empfohlen und dabei die Flaechen gezaehlt, auf denen damals wirklich Gold-Text stand; `--color-button-soft` war KEINE davon. 💣 Seit dem 04.09.2026 ist sie eine: die zugeklappte Leiste des Rahmenkastens traegt ihre Aufschrift darauf (Routenplaner). `#82681e` haette dort 4,39 gegeben -- knapp daneben. Deshalb eine Stufe tiefer: `#7e651d` misst 5,49 / 5,17 / 4,90 / 4,73 / 4,73 / 4,61 auf panel / -soft / page-bg / -muted / pill / button-soft. Farbton (47°) und Saettigung bleiben, nur die Helligkeit sinkt -- das Gold wird erdiger, nicht braun. ⚠️ Das DUNKLE Thema bleibt unberuehrt: `#dcc77e` steht dort zwischen 5,6 und 9,8. ⚠️ Und `--color-panel-active` (#e7ddc9) erreicht auch damit nur 4,14 -- auf dieser Flaeche steht nachweislich kein Gold-TEXT (Audit §2). Wer dort welchen hinschreibt, misst neu. Gewacht von js/app/__tests__/goldkontrast.test.js. */ --color-accent-strong: #7e651d; /* 💣 DER LINK MUSS MITWANDERN, und das ist keine Kosmetik (Audit §4.1): er war mit `#8f7326` die DUNKLERE der beiden Goldfarben (4,45 gegen 3,78) und verfehlte AA um 0,05. Bliebe er stehen, waere die Aufschrift ploetzlich dunkler als der Link -- die Rangfolge kippt, und der Link waere das einzige Textgold unter AA. `#79611b` misst 5,84 / 5,51 / 5,21 / 5,04 / 5,03 / 4,90 und bleibt eine Spur dunkler als die Aufschrift (Luminanz 0,127 gegen 0,138). ⚠️ `--color-link-hover` bleibt unveraendert dunkler (0,108) -- die Ordnung Link > Hover haelt. */ --color-link: #79611b; --color-link-hover: #6f5a1c; /* Secondary accent-brown — the WikiSync/label-path-location edit dialogs' own accent (links, active tabs, focus rings), distinct from the app-wide --color-accent-strong gold but from the same warm family. */ --color-accent-brown: #7a5a3a; --color-accent-brown-hover: #5f4429; --color-accent-brown-soft: #9a7a5a; --color-accent-brown-text: #fff; --color-accent-brown-focus: rgba(122, 90, 58, 0.18); /* Pills / tags (e.g. publication sources) */ /* 🔴 DAS KANON-ETIKETT (01.09.2026, Entwurf 2026-08-27-kanon-etikett-design.md). Gold = im Kanon, Blaugruen = nicht. 🔴 KEIN ROT fuer „inoffiziell" -- die Briefspiele sind der Grund, warum es diese Inhalte gibt; ein Warnrot machte aus einer Herkunftsangabe eine Qualitaetsaussage. Blaugruen kommt sonst nirgends in der Oberflaeche vor und ist damit eindeutig. Gemessen gegen die Fuellung: 4,9:1 (gold) und 5,9:1 (blaugruen), AA ist 4,5. */ --color-kanon-official: #8a6b16; --color-kanon-official-text: #fffaea; --color-kanon-unofficial: #1f6b64; --color-kanon-unofficial-text: #eafaf7; /* 🔴 DIE FASSUNG FUER DAUERHAFT DUNKLE FLAECHEN -- sie steht hier im hellen Block, weil sie NICHT mit dem Thema kippt: die Suchkachel ist in beiden Themen dunkel. Ohne sie trug der Chip dort die helle Fassung, und die hebt sich vom dunklen Grund kaum ab -- gemessen 2,33:1 gegen 8,61:1 im dunklen Thema, also unter den 3:1, die eine Nicht-Text-Grenze braucht. Die Schrift IM Chip war mit 5,83:1 die ganze Zeit lesbar; auffallen konnte er nur nicht, und genau das ist seine Aufgabe. ⭐ Das dunkle Thema unten nimmt dieselben vier Werte, statt sie ein zweites Mal zu tippen. */ --color-kanon-official-on-dark: #dcc77e; --color-kanon-official-text-on-dark: #2b2311; --color-kanon-unofficial-on-dark: #6fc7bd; --color-kanon-unofficial-text-on-dark: #0f2f2b; /* Die Schrift der Suchkachel -- derselbe Grund wie beim Chip darueber: sie ist in BEIDEN Themen dunkel, diese drei Werte kippen also nicht mit dem Thema und haben bewusst KEIN helles Gegenstueck (deshalb auch kein `-on-dark`-Suffix: das bezeichnet hier die zweite Fassung eines Tokens, das eine erste hat). 🔴 Wer sie je in den dunklen Block unten spiegelt oder im hellen Thema umdreht, macht die Suche im hellen Thema unlesbar -- dunkle Schrift auf dunklem Grund. Die Abstufungen sind derselbe Ton mit weniger Deckkraft: `soft` traegt die Typangabe neben einem Treffer UND die Statuszeile darunter (gemessen 8,12:1 gegen die Kachel), `faint` den Platzhalter im Eingabefeld. */ --color-spotlight-text: #fff9ef; --color-spotlight-text-soft: rgba(255, 249, 239, 0.68); --color-spotlight-text-faint: rgba(255, 249, 239, 0.58); --color-pill: #f3ecd9; --color-pill-border: #d7c7a2; --color-pill-text: #675024; --color-danger: #9d3a2e; --color-success: #2f7d3a; /* status: success (e.g. contact form) */ /* Halo around a presence dot (online editor, live visitor count) — the ring that lifts a 9px dot off the panel without giving it a border. */ --color-success-halo: rgba(79, 159, 74, 0.16); --color-muted-halo: rgba(161, 140, 116, 0.16); /* Soft status surfaces — the pale tinted fills for accept/reject buttons and status pills in the editor (Meldungen, WikiSync). --color-success/-danger above are the solid text colours; these carry a full bg/border/text set so the buttons follow the theme instead of staying light in dark mode. */ --color-success-soft: #eef6e2; --color-success-soft-border: #a9c07f; --color-success-soft-text: #3c5a1c; --color-danger-soft: #fbeae6; --color-danger-soft-border: #d3a79c; --color-danger-soft-text: #8a2d22; /* Link status — the reachability marker behind an external link (linkchecker). "online" reuses the success green so the two never drift apart; "offline" is a muted warm grey, NOT a red: a link that has gone is a fact worth noting, not an error the reader can act on. Deliberately not --color-map-presence*, which is pinned identical in both themes because it sits on the always-light map tiles — these markers live in panels and must follow the theme. */ --color-status-online: var(--color-success); --color-status-offline: #8b8478; /* Status: warning (amber) — the third status colour next to --color-success/--color-danger, used by the WikiSync + settlement editors (coverage gaps, attribution-required licences, values diverging from the wiki). --color-warning is the solid text/border/dot value; -soft* is the pale filled badge (hint boxes, "Lücke" badges); -strong* is the filled ACTIVE warn chip. */ --color-warning: #b8860b; --color-warning-soft: #faeeda; --color-warning-soft-border: #ef9f27; --color-warning-soft-text: #854f0b; --color-warning-strong: #f4c869; --color-warning-strong-text: #4a3300; /* Route waypoints — ONE language across map, route planner and infopanel (Owner): every waypoint is red, the destination is a teardrop, and the SELECTED one turns gold-yellow. Red means "waypoint", gold means "selected" — never "which position in the route". These stay the SAME in both themes on purpose: the same mark appears on the always-light map tiles and on the dark panels, and it must read as the same thing in both places. */ --color-marker-waypoint: #e33b35; /* heraldic red — matches the red settlement markers */ --color-marker-waypoint-core: #2e2119; /* the dark "eye" + outline inside the mark */ --color-marker-waypoint-ring: #dcb877; /* the gold ring (map marker only — invisible below ~16px) */ /* Ortsmarker — der Punkt, den die Karte für jede Siedlung zeichnet: roter Kern in weißer Kontur, Besondere Stätten in Violett. Gepinnt wie die Wegpunkt-Töne darüber, aus demselben Grund: sie sitzen auf den IMMER-hellen Kartenkacheln, nicht auf einem Theme-Panel. 💣 Die Vorschau im Fenster „Zoombänder" (html/wiki-sync-settlement-editor.html) zeigt DENSELBEN Punkt und nimmt dieselben Töne. Ein zweites Rot dort wäre genau die Divergenz, gegen die es Tokens gibt — und die Vorschau behauptete dann etwas anderes als die Karte. ⚠️ Der Canvas-Zeichner (js/map-features/map-features-location-canvas-layer.js) führt dieselben drei Werte als Zeichenketten: er malt auf ein , das keine CSS-Variable auflöst. Wer hier einen Ton ändert, ändert ihn dort mit. */ --color-marker-settlement: #cc2f2a; --color-marker-settlement-site: #7a4fd0; --color-marker-settlement-contour: #ffffff; /* Review stars — the rating glyphs (infobox summary + write-dialog picker). Warm coat-gold, not a generic yellow; `-muted` is the empty-star track. */ --color-star: #e0a528; --color-star-muted: #d9c7a6; /* Active/selected map location — the clicked settlement's marker fills gold-yellow (Owner). Also the SELECTED route waypoint (see above). The marker sits on the always-light map tiles, so the dark value stays the same warm gold. */ --color-marker-active: #f0b429; /* Editor-Markierungswerkzeuge (Discord #25) -- kräftige Warnringe um Marker, je ein Ton pro Befund: pink = "Unverbunden" (gar keine Anbindung), türkis = "Kreuzungen mit 2 Wegen" (überflüssiger Knoten). Pinned wie --color-marker-waypoint oben: die Ringe sitzen auf den IMMER-hellen Kartenkacheln, nicht auf einem Theme-Panel, also kein Dark-Override. */ --color-marker-unconnected-ring: #e0559a; --color-marker-sparse-crossing-ring: #0fb9b1; /* Ringstärke, EIN Wert für beide Töne (Owner 14.08.2026: „ruhig dicker", vorher 4 px) — sonst driften pink und türkis auseinander, sobald jemand nur einen der beiden anfasst. ⚠️ Das Zeichen der Prüfzeile im Anzeige-Menü wiederholt den Ring als Legende, nimmt diesen Wert aber NICHT: sein 24er-viewBox schrumpft auf --icon-md, dort ist 7 px die falsche Zahl (und `var()` löst in `stroke-width` als Attribut ohnehin nicht auf). Es soll gleich aussehen, nicht gleich groß sein. */ --marker-check-ring-width: 7px; /* Discord #43 -- bernstein = "offenes Wegende": ein per Strg vom Ort getrenntes Wegende, das noch an nichts haengt. Gleiche Begruendung wie oben (helle Kacheln, kein Dark-Override). Bewusst NICHT --color-accent: das Gold markiert waehrend des Ziehens den Marker, das Bernstein danach die zurueckgebliebene Luecke -- zwei Zustaende, zwei Toene. */ --color-marker-open-path-end-ring: #e8850c; /* Idee #86 -- der Prüfhaken „Offene Wegenden": dieselbe Lücke wie das Bernstein darüber, aber aus dem GESAMTBESTAND statt aus der eigenen Merkliste, und damit ein Befund statt eines Arbeitszustands. Trägt die rote LINIE des Weges und den Ring auf seiner Fundstelle -- ein Weg mit offenem Ende wird beim Routen ganz verworfen, das ist die lauteste Aussage der ganzen Prüfgruppe. Gepinnt wie die Ringe darüber (helle Kartenkacheln, kein Dark-Override). 💣 Bewusst NICHT --color-marker-waypoint (#e33b35): das Rot gehört den Reise-Wegpunkten, und die liegen auf derselben Karte. Dieser Ton ist satter und kälter, damit „Befund" und „Wegpunkt" nicht dieselbe Farbe sprechen. ⚠️ Wird auch im JS gelesen (map-features-open-path-check.js): Leaflet-Linienfarben können kein `var()` tragen, weder im Canvas- noch im SVG-Renderer. Wer den Wert ändert, ändert ihn hier -- der Rückfallwert dort ist nur die Notbremse, wenn der Token fehlt. */ --color-path-open-end: #e01b24; /* Pruefhaken „Keine Wiki-Zuweisung" (Owner 01.09.2026: „das objekt ohne wiki-eintrag auffaellig rot markieren", egal ob Ort, Flaeche oder Weg). EIN Ton fuer alle vier Objektarten -- Ortsring, Wegsaum, Flaechenkontur und Label-Halo sagen dasselbe, und vier Toene fuer einen Befund waeren vier Legenden statt einer. 💣 BEWUSST NICHT --color-path-open-end MITBENUTZT, obwohl beide rot sind: das heisst „offenes Wegende" und liefe beim naechsten Umton auseinander. Und die beiden treffen sich auf DEMSELBEN Weg: ein Weg kann ein offenes Ende UND keine Zuweisung haben, dann traegt er die rote Mitte des einen und den Saum des anderen. Waeren es dieselben Werte, waere das ein roter Klumpen ohne Aussage. ⚠️ Deshalb ist dieser Ton DUNKLER und blaeulicher als #e01b24 -- nebeneinander unterscheidbar. ⚠️ Wird auch im JS gelesen (Leaflet-Linienfarben koennen kein `var()` tragen, weder im Canvas- noch im SVG-Renderer -- siehe --color-path-open-end darueber). Wer den Wert aendert, aendert ihn HIER; die Rueckfallwerte im JS sind nur die Notbremse, wenn der Token fehlt. Gepinnt wie die Ringe darueber: liegt auf den IMMER-hellen Kartenkacheln, kein Dark-Override. */ --color-check-no-wiki: #a01029; /* 🔴 HIER STAND `--color-check-no-wiki-checked` (derselbe Ton blass, „nachgesehen, es gibt keinen Artikel"). Gefallen am 09.09.2026 mit dem Merker `properties.wiki_no_article`, der ihn erzeugte: sein Aequivalent ist die WIKI-ZUWEISUNG, es gibt keinen zweiten Zustand mehr. Wer eine blasse Stufe zurueckbaut, braucht zuerst wieder eine Aussage, die sie traegt. */ /* „Freie Labels markieren" (Owner 02.09.2026: „alle freien labels vom typ z.B. ‚Fluss‘ markieren (roter rahmen)"). Ein SCHEINWERFER, kein Befund: er leuchtet die gewaehlte Labelart an, damit ein Editor die Dubletten selbst sieht -- „Inoscha" steht einmal als freie Beschriftung und einmal als Name seines Flusswegs da, und welche der beiden weg soll, entscheidet kein Programm. 💣 GEMESSEN GEGEN ALLE DREI ROTS DER KARTE, nicht nur gegen den einen Nachbarn im Diff. Der erste Entwurf stand auf #e0342f und war von --color-marker-waypoint (#e33b35) nicht zu unterscheiden -- RGB-Abstand 9,7 bei unter 1 Grad Farbtondifferenz. Genau diese Kollision hat --color-path-open-end ein paar Zeilen weiter oben ausdruecklich vermieden („das Rot gehoert den Reise-Wegpunkten"), und der Entwurf hier haette sie stillschweigend wieder eingebaut. Jetzt: Wegpunkt 73,5 · offenes Wegende 64,8 · Wiki-Zuweisung 73,2 -- die einzige freie Nische im Rot der Karte ist der KALTE Rand (Karmin), weil die drei anderen den neutralen und den warmen schon belegen. 💣 Und die Trennung von --color-check-no-wiki ist die kritischste: die zwei treffen sich auf DERSELBEN Beschriftung -- der eine faerbt ihren Halo, dieser zieht einen Kasten darum. Waeren es dieselben Werte, wuesste bei einem roten Namen niemand mehr, welches der zwei Werkzeuge spricht. ⚠️ Unterschieden wird ohnehin auch an der FORM (Schein gegen Kasten), der Ton ist die zweite Haelfte -- aber eine Form, die allein tragen muss, ist genau das, worauf sich dieses Projekt beim Nachbartoken nicht verlassen wollte. Bewacht von freie-label-markierung-verdrahtung.test.js, das den Abstand zu ALLEN drei misst. ⚠️ Wird auch im JS gelesen (map-features-freie-label-markierung-check.js): der gebogene Name wird auf Canvas gemalt, und dort loest `var()` nicht auf. Wer den Wert aendert, aendert ihn HIER; der Rueckfall im JS ist nur die Notbremse, wenn der Token fehlt. Gepinnt wie die Ringe darueber: liegt auf den IMMER-hellen Kartenkacheln, kein Dark-Override. */ --color-check-free-label: #d1005d; /* Pruefhaken „Doppelte Beschriftungen" (Owner 02.09.2026) -- derselbe Kasten wie beim Scheinwerfer darueber, aber ein BEFUND statt einer Auswahl, und beide sind gleichzeitig einschaltbar. 💣 DESHALB EIN ANDERER FARBRAUM, NICHT NUR EIN ANDERES ROT: das Rot der Karte ist voll (Wegpunkt, offenes Wegende, Wiki-Zuweisung, Scheinwerfer), ein fuenfter Ton darin waere von mindestens einem nicht mehr zu trennen. Violett ist frei -- gemessen: settlement-site 77 · garetien 76 · unconnected 132 · free-label 123 · edit-handle 138. ⚠️ Und die Rangfolge ist gebaut, nicht geraten: der BEFUND schlaegt den Scheinwerfer (AVESMAPS_LABEL_MARKIERER in js/map-features/label-markierungen.js) -- wer eine Art anleuchtet und zugleich Dubletten sucht, will bei einem doppelten Namen den Befund sehen. ⚠️ Wird auch im JS gelesen (Canvas kennt kein `var()`); der Rueckfall dort ist die Notbremse. Gepinnt wie seine Nachbarn: liegt auf den IMMER-hellen Kartenkacheln, kein Dark-Override. */ --color-check-duplicate-label: #6a1b9a; /* Pruefhaken „Zu große Flächen" (Owner 09.10.2026): die Kontur einer Landschaftsflaeche, die zum Speichern zu gross ist oder ab 75 % der Grenze nah daran. Grenze und Stufen in js/map-features/ecosystem-groesse.js. 🔴 EIN TON, ZWEI STRICHSTAERKEN (5 gegen 3 px, ecosystemAreaStyle). Ein zweiter Ton fuer „nah dran" war ein dunkles Gold, und er trug nicht: er ist zugleich --color-warning, verschwimmt mit den Fuellungen Kulturlandschaft, Wadi und Insel, und bei Rot-Gruen-Schwaeche liegen Orange und Gold kaum 15 auseinander -- „bald zu gross" und „wird abgelehnt" saehen gleich aus. Die Dicke sieht jeder. 💣 Gemessen, nicht gewaehlt: das Rot der Karte ist voll (Wegpunkt, offenes Wegende, Wiki-Zuweisung, Scheinwerfer), also ORANGE. RGB-Abstand mindestens 76 zu jeder FLAECHEN-Farbe und jeder anderen FLAECHEN-Marke (Wiki-Zuweisung 139, Umriss unter dem Zeiger in „Grenze aus Territorien" 80, Zielwahl 120, die naechste Fuellung Wueste 123) und zum Wegpunkt (78) -- dieselbe Schwelle wie --color-check-duplicate-label darueber. ⚠️ EINE Ausnahme, benannt: der Ring „Offene Wegenden" (--color-marker-open-path-end-ring) liegt nur 35 entfernt. Er ist ein gestrichelter 26-px-Ring um einen PUNKT mit weissem Innenring, diese Marke eine Flaechenkontur -- die Form trennt sie, nicht der Ton. Ein Orange, das von Bernstein UND Wegende-Rot je 76 entfernt waere, gibt es nicht (die beiden liegen 109 auseinander). Gepinnt wie die Nachbarn: die Linie liegt auf den immer hellen Kartenkacheln. */ --color-check-area-size: #ff6d00; /* „Grenze aus Territorien" (Fall #68) -- die Territoriumsumrisse, solange das Fenster offen ist (leise), und der Umriss unter dem Zeiger (laut). Gepinnt wie die Ringe darueber: beides liegt auf den IMMER-hellen Kartenkacheln, ein Dark-Override machte sie dort unsichtbar. Bewusst NICHT --color-marker-active: das Gold traegt hier schon die Vorschau der GEWAEHLTEN Vereinigung. „Was ich treffen wuerde" und „was ich gewaehlt habe" duerfen nicht denselben Ton haben, sonst sagt keiner von beiden noch etwas. */ --color-import-outline: #8a7350; --color-import-hover: #b4651a; /* "Edit in progress" blue -- the ring of every drag handle on the map (.path-edit-handle-marker__dot in css/features/path-editor.css, used by the path, region and landscape editors). This is one of the two documented no-blue EXCEPTIONS in docs/design-language.md: it encodes a STATE, not chrome, and must not be "corrected" to a warm tone. It is a token so the contour of an area being edited can say the same thing in the same colour instead of writing the literal a second time. Pinned: drawn on the always-light map tiles. */ --color-edit-handle: #1452f7; /* Dieselbe Ausnahme, eine Stufe leiser: die Unterflächen einer mehrteiligen Landschaftsfläche, die GERADE NICHT gemeint sind. Die gemeinte trägt --color-edit-handle, die übrigen dieses dunklere Blau — man sieht damit auf einen Blick, aus wie vielen Stücken die Fläche besteht und welches der nächste Klick trifft (Owner 2026-07-27). Gepinnt, liegt auf hellen Kacheln. */ --color-edit-handle-muted: #0b2a80; /* 🔴 EIN GEWAESSER, EIN TON (Owner 09.09.2026). Ihn tragen genau drei Dinge: die Flusslinie, der Bach und die Seeflaeche -- ein See ist derselbe Wasserkoerper wie der Fluss, der hineinlaeuft. Der Wert ist der des SVG-Abzugs (js/pages/svg-export-farben.js), damit Karte und Abzug endlich dasselbe Blau fuehren. 💣 DAS MEER GEHOERT NICHT DAZU und behaelt --color-ecosystem-topographie-meer, die Kueste ihr Tuerkis, der Seeweg sein #2f7dd3 (Owner ausdruecklich: „achte darauf dass meere noch anders sind"). Das einzige ["see","meer","kueste","flussdelta"] im Haus steht in svg-export-build.js und regelt die ZEICHENREIHENFOLGE, nicht die Farbe -- wer die vier je zu einem Ton zusammenzieht, faerbt das Meer mit. 💣 DREI STELLEN AUSSERHALB DIESER DATEI TRAGEN DEN WERT HARTKODIERT: die Wegfarben der Karte lesen kein CSS, und der SVG-Bauer hat kein DOM. Gehalten werden sie von js/map-features/__tests__/wasserton.test.js -- nicht von diesem Kommentar. */ --color-water: #4c89c6; /* Landschaften (Erprobung), colours per Owner 2026-07-26. All three layers are on at once, so the tones must stay tellable apart -- but they are not three peers: the derographic layer draws administrative CONTAINERS (grey, and unfilled while it rests), topography draws relief, and only vegetation carries real ground cover, which is why it is the one that gets a tone per type instead of a single colour. Pinned in both themes for the same reason as the marker rings above: these are painted ON the always-light map tiles, never on a themed panel. */ --color-ecosystem-derographisch: #575757; /* neutral grey -- regions, islands, continents */ /* Placeholder. The height map (high -> white) replaces this per the concept; until then one brown-grey stands in for the whole relief layer. */ --color-ecosystem-topographie: #7a6c5e; /* brown-grey -- mountains, hills, coast, sea */ /* CONTOURS for those two, markedly darker than their own fill (Owner 2026-07-26). Only these two have one: vegetation carries a tone per type, and its contour follows that tone -- see ecosystemAreaColor(). A missing token here means "use the fill colour", which is what keeps the rule one rule instead of a second table. ⚠️ The topographic contour is a neutral dark SLATE, not the brown it started as: since that layer gained a tone per type it has to sit on brown-grey, grey-green, blue, dark blue and turquoise alike, and a brown line on a sea reads as dirt. One line per LAYER is still the rule -- the point of the dark contour is "this is where the area ends", and that answer must not change per type. */ --color-ecosystem-derographisch-contour: #2e2e2e; --color-ecosystem-topographie-contour: #2b3138; /* Owner 2026-07-29: „die Konturen der Vegetationsflächen dunkler". Bis hierher hatte die Vegetation als EINZIGE Ebene keinen eigenen Konturton und erbte deshalb ihre Füllfarbe -- ein Waldrand war waldgrün auf waldgrün und verschwand. Ein dunkles Blattgrün statt des Grau-Blaus der Topographie: die Kante gehört zur Ebene, nicht zum Fels. */ --color-ecosystem-vegetation-contour: #22351c; /* The fallback for a vegetation region with no type set. The per-type tones below win when the region has one; they are looked up BY RULE from the type_key (--color-ecosystem--), so a newly seeded type needs a token here and nothing else -- there is no list of them in the client to keep in sync. */ --color-ecosystem-vegetation: #5f7d33; --color-ecosystem-vegetation-wald: #3f6b2c; /* dense forest */ --color-ecosystem-vegetation-suempfe-moore: #2f4a2a; /* swamp and moor, dark green */ --color-ecosystem-vegetation-steppe: #a8bd8a; /* steppe, pale green */ --color-ecosystem-vegetation-tundra: #6f9d94; /* tundra, blue-green */ /* Owner 2026-10-04. Schnee und Eis liegen als LANDBEDECKUNG auf der Vegetationsebene. Beide stehen im kalten Weiss-Blau-Bereich, den sonst nur der Gletscher (#bcd6e0, topographisch) und die Tundra (#6f9d94, blaugruen und dunkler) besetzen: Schnee ist deutlich HELLER als der Gletscher, Eis deutlich BLAUER und gesaettigter -- keine der beiden Farben ist mit dem See (--color-water) zu verwechseln. */ --color-ecosystem-vegetation-schneelandschaft: #edf3f7; /* snow cover, near-white with a cold cast -- lighter than the glacier */ --color-ecosystem-vegetation-eislandschaft: #8ec3e0; /* ice cover, clear ice blue -- stronger than the glacier, paler than the lake */ --color-ecosystem-vegetation-auenlandschaft: #4f9e35; /* floodplain, vivid green */ --color-ecosystem-vegetation-wueste: #e0c74e; /* desert, yellow */ --color-ecosystem-vegetation-graslandschaft: #8fbf6a; /* grassland, soft green */ --color-ecosystem-vegetation-flussland-flusstal: #4a8f6b; /* river land and valley, green with a water cast */ --color-ecosystem-vegetation-dschungel: #1e7d32; /* jungle, deep saturated tropical green */ --color-ecosystem-vegetation-wuestenoase: #2fa88c; /* desert oasis, teal-green -- water in the sand */ --color-ecosystem-vegetation-kulturlandschaft: #a9a14c; /* cultivated land, matt olive gold -- ripe grain; duller and darker than the desert yellow so the two never blur, warmer than steppe and grassland */ /* Topography per type, same rule (Owner 2026-07-27). Until today the whole layer was one brown-grey; it draws relief AND water, and those two do not share a colour in any map anyone has ever read. 💣 THE BLUES ARE A DELIBERATE, PERMANENT EXCEPTION TO "no blue" (§12) -- do not "correct" them in a token sweep. The no-blue rule is about UI chrome: panels, controls, links, menus. These are DATA painted on the map, in the same category as the analytics chart's categorical palette and the heraldic red of the route markers, and the map's own rivers have been blue all along. A sea drawn in warm brown would be unreadable to every editor who has ever seen a map. */ --color-ecosystem-topographie-gebirge: #7a6c5e; /* mountains, brown-grey */ --color-ecosystem-topographie-huegelland: #7d8f6e; /* hills, grey-green */ /* 🔴 Hier stand bis zum 09.09.2026 --color-ecosystem-topographie-vorgebirge_mittelgebirge (#7c7b66, zwischen den beiden Toenen darueber). Die Art ist auf Owner-Entscheid gestrichen; der Token faellt MIT ihr, sonst bleibt ein Ton stehen, den nichts mehr anfordert. Begruendung im Kopf von avesmapsEcosystemRetireVorgebirge (api/_internal/app/ecosystem.php). */ /* 🔴 DER SEE TRAEGT DIE FARBE DES FLUSSES (Owner 07.09.2026: „Kannst du Seen dieselbe Fuellung geben wie die Farbe der Fluesse"). Seit 09.09.2026 ist das kein abgeschriebener Wert mehr, sondern derselbe Token: --color-water, oben im Block definiert und von den Wegfarben der Karte (`centerColors.Flussweg` in getPathStyleColors, js/map-features/map-features.js) sowie dem SVG-Bauer hartkodiert nachgezogen, weil beide kein CSS lesen. Ein See ist derselbe Wasserkoerper wie der Fluss, der hineinlaeuft. ⚠️ Gleich ist der WERT, nicht das Bild: die Flaeche liegt mit der Deckkraft ihrer Ebene auf der Karte (live 0,5 aus der Tafel „Darstellung"), die Flusslinie deckt voll. Der See bleibt also etwas blasser -- gewollt, und der Grund, warum hier NICHT zusaetzlich an der Deckkraft gedreht wurde: die gehoert dem Editor und seiner Tafel, nicht diesem Ton. */ --color-ecosystem-topographie-see: var(--color-water); /* lake -- the river's blue, see above */ --color-ecosystem-topographie-meer: #2d5f8a; /* sea, dark blue */ --color-ecosystem-topographie-kueste: #3f9e9a; /* coast, turquoise */ --color-ecosystem-topographie-wadi: #9b8a5c; /* wadi, sand with an olive cast -- a bed that is dry most of the time */ --color-ecosystem-topographie-schlucht: #5c5148; /* gorge, dark rock -- deliberately darker than the mountains: it reads as depth */ --color-ecosystem-topographie-hochebene: #9a9b82; /* plateau, pale grey-green -- high but flat, lighter than the hills */ --color-ecosystem-topographie-tiefebene: #6f7a55; /* lowland, deeper warm olive -- the plateau's counterpart, low and lush */ --color-ecosystem-topographie-tal: #6b7266; /* valley, shaded green-grey -- an incision like the gorge, but wide and walkable */ --color-ecosystem-topographie-flussdelta: #5e8f86; /* river delta, silted teal -- water and deposited land, duller than the coast's turquoise */ /* Owner 2026-07-30, the day `insel` moved from derographisch to topographie. 🔴 NOT optional: without this token ecosystemAreaColor() falls back to --color-ecosystem-topographie, which IS the mountain brown-grey -- all 251 islands would render as mountains. Sandy beige-olive: reads as LAND against see (#4c89c6) and meer (#2d5f8a), and stays apart from gebirge (#7a6c5e) and hochebene (#9a9b82). */ --color-ecosystem-topographie-insel: #b2a273; /* island, sandy beige-olive -- dry land ringed by water */ /* Owner 2026-10-04. Gletscher: blasses Eisblau, heller und kaelter als jeder andere Ton der Ebene -- er soll neben gebirge (#7a6c5e) und hochebene (#9a9b82) sofort als Eis lesen, ohne dem See (--color-water) zu aehneln. */ --color-ecosystem-topographie-gletscher: #bcd6e0; /* glacier, pale ice blue -- lighter and cooler than any rock tone */ /* Die zwei Kuesten bleiben in der Familie der Kueste (#3f9e9a, tuerkis), je eine Spur zur Form hin: die Flachkueste heller und sandiger (sie laeuft in die Tiefebene aus), die Steilkueste dunkler und grauer (sie bricht als Fels ab). */ --color-ecosystem-topographie-flachkueste: #77b3a5; /* flat coast, light sandy teal -- shallows and beach */ --color-ecosystem-topographie-steilkueste: #3d6e73; /* cliff coast, dark slate teal -- rock meeting water */ /* Namenstoene der Kartenbeschriftungen als TOKEN (Owner 14.09.2026: „gib ihnen passende variationen"). Berg-/Hügelkette, Hügel und Felsformation waren im Beschriftungsdialog wählbar und stehen seit dem 02.09.2026 in der Kollisionsvorgabe, hatten in css/features/map-labels.css aber KEINEN Namenston -- ihr erster Name wäre auf den Grundton gefallen und hätte sich wie „Region" gelesen. 🔴 GERECHNET, NICHT GEWÄHLT: je Art der Ton, der seinem Vorbild am nächsten liegt (Kette: Mitte aus Gebirge und Hügelland · Hügel: Hügelland · Felsformation: Schlucht) und dabei zu JEDEM anderen Namenston der Karte mindestens dE00 6,5 hält. Der Bestand liegt im Median bei 5,1, am engsten Hügelland gegen Wadi mit 2,6 (gemessen 14.09.2026). Das Mockup rechnet es beim Öffnen aus dem echten Stylesheet nach und bindet diese drei Werte: docs/namensfarben-gelaende-mockup.html. 💣 Wer einen Wert „nur ein bisschen" verschiebt, prüft den Abstand neu -- die Familie ist eng, und ein Ton, der einem Nachbarn zu nahe kommt, liest sich auf der Karte wie dieselbe Art. ⚠️ Kein zweiter Wert im dunklen Block: die Kartenfläche wechselt mit dem Thema nicht (Kopf dieser Datei), der Name sieht hell und dunkel gleich aus. ⚠️ Die übrigen Namenstöne stehen noch als Farbwert in map-labels.css. */ --color-map-label-bergkette: #cdc8b1; /* Berg-/Hügelkette: Greige zwischen Gebirge und Hügelland */ --color-map-label-huegel: #ddc6ab; /* Hügel: Lehm, wärmer und tiefer als das Hügelland */ --color-map-label-felsformation: #d7bfb6; /* Felsformation: Stein im Licht mit Rosé-Stich, Verwandter der Schlucht */ /* Klimazonen (Owner 2026-08-03). Sieben Bänder von Nord nach Süd, abgeleitet aus sechs Trennlinien. Bewusst KEINE Grün-Skala: Grün gehört der Vegetation, und die beiden Ebenen müssen nebeneinander unterscheidbar bleiben. Dies ist eine reine TEMPERATURSKALA -- Eis, blass, neutral, gold, warm --, die von selbst „oben kalt, unten heiss" liest. 💣 Die Namensregel ist bindend: --color-ecosystem-klima-. Fehlt ein Ton, fällt ecosystemAreaColor() auf --color-ecosystem-klima zurück und alle sieben Bänder sehen gleich aus -- dieselbe Falle, die bei `insel` 251 Flächen zu Gebirgen gemacht hätte. Die kühlen Töne sind dieselbe bewusste Ausnahme von „kein Blau" wie See und Meer darüber: gemalte KARTENDATEN, nicht UI-Chrom (§12). Gepinnt, sie liegen auf den immer hellen Kacheln. 💣 HIER STAND EIN ÜBERZÄHLIGES KOMMENTARENDE (seit 2026-08-03, gefunden am 12.08.2026). Der Absatz darunter war damit kein Kommentar mehr, sondern Text mitten im :root-Block -- und der CSS-Parser verwirft ab dort bis zum nächsten Semikolon. Verschluckt hat das GENAU EINE Zeile: `--color-ecosystem-klima`, den Rückfallton, den der Absatz oben als tragend beschreibt. Live gemessen war er neun Tage lang nicht definiert, während alle sieben Bänder daneben standen. ⚠️ So etwas fällt nie von selbst auf: Es gibt keine Fehlermeldung, die Datei sieht richtig aus, und der Fehler zeigt sich erst, wenn ausgerechnet der Rückfall gebraucht wird. Gewacht wird jetzt von js/app/__tests__/css-comment-balance.test.js. Owner 2026-08-03, zweiter Durchgang: „etwas stärker". Die ganze Rampe eine Stufe kräftiger, und das kalte Ende am deutlichsten -- #e6eef3 war auf den hellen Kacheln bei jeder Deckkraft fast unsichtbar, was die Polare Zone praktisch unbeschriftet liess. Die Reihenfolge kalt→warm und der neutrale Ton in der Mitte bleiben; nur der Kontrast zwischen benachbarten Zonen wächst. */ --color-ecosystem-klima: #bfc888; /* fallback -- the middle of the ramp */ --color-ecosystem-klima-polar: #cfe0eb; /* polar, pale ice */ --color-ecosystem-klima-subpolar: #a2c3d1; /* subpolar, ice blue */ --color-ecosystem-klima-boreal: #7aada9; /* boreal, cold teal */ --color-ecosystem-klima-gemaessigt: #bfc888; /* temperate, neutral olive */ --color-ecosystem-klima-subtropen-winterfeucht: #dcb857; /* winter-wet subtropics, warm gold */ /* Owner 2026-08-03, nachtraeglich zwischen die beiden geschoben. Der Unterschied zur Nachbarin darueber ist die FEUCHTE, nicht die Temperatur -- deshalb ein entsaettigter Sandton statt einer weiteren Stufe auf der Warm-Rampe. Er liegt zwischen Gold (#dcb857) und Ocker (#d98f3c) und unterscheidet sich von beiden durch die Blässe, nicht durch den Farbton: zwischen zwei so nahen Nachbarn ist das der einzige Platz, der noch frei war. */ --color-ecosystem-klima-trockene-subtropen: #cdb083; /* dry subtropics, dusty sand */ --color-ecosystem-klima-subtropisch: #d98f3c; /* subtropical, orange ochre */ --color-ecosystem-klima-tropisch: #c65e2e; /* tropical, warm terracotta */ /* Die Trennlinie. Ein neutrales Dunkel, das auf allen acht Tönen sitzt -- dieselbe Begründung wie beim topographischen Konturton: wo eine Zone aufhört, ist genau die Auskunft dieser Ebene, und die darf ihre Farbe nicht je Zone wechseln. 🪤 Der ZONENNAME hatte hier bis 2026-08-05 einen eigenen Ton (--color-ecosystem-klima-label, #33302b). Er trägt jetzt den Ton SEINER Zone und holt ihn über dieselbe Regel wie die Füllung ihres Bandes (ecosystemAreaColor) -- je Zone steht der Ton schon oben, ein zweiter wäre die Kopie, die beim Einschieben einer neunten Zone zurückfiele. */ --color-ecosystem-klima-divider: #2b3138; /* Der dunkle Saum hinter dem Zonennamen (Owner 2026-08-05: „vielleicht den halo dunkel machen wie beim rest"). Bis dahin war es umgekehrt -- dunkle Schrift, heller Saum. Seit der Name den Ton seiner Zone trägt, geht das nicht mehr: die Rampe reicht von fast weissem Polareis bis zu warmem Ocker, und ein heller Saum liesse das kalte Ende auf den hellen Kacheln verschwinden. Ein dunkler trennt alle acht Töne vom Grund -- dieselbe Bauart wie bei den Karten-Labels, deren Halo ebenfalls rgba(0, 0, 0, 0.85) ist (`glow` in map-features-labels.js), nur als text-shadow statt im Canvas gezeichnet. Halbtransparent, damit er ein Saum bleibt und kein Kasten. */ --color-ecosystem-klima-label-halo: rgba(0, 0, 0, 0.85); /* Höhenrampe (V8). Fünf Stufen vom Gebirgsfuss bis zum Firn, aus dem Prototyp (html/landschaften-modell.html:589) übernommen -- dort standen sie als rohe RGB-Tripel im Code, was AGENTS.md §12 verbietet. Warme Erdtöne, kein Blau: das Relief ist gemalte Karte, nicht Datenvisualisierung, und es liegt neben Pergament und Wappengold. 🔴 UMGESTELLT (Owner 2026-07-28): Graustufen auf ABSOLUTER Skala, als Schleier über die Topographieflächen gelegt -- 0 Schritt schwarz, HEIGHT_WHITE_SCHRITT weiss (map-features-ecosystem-height-render.js). Vorher war es eine warme Fünf-Farben-Rampe, RELATIV zum höchsten Gipfel DERSELBEN Fläche. Der Grund für den Wechsel: relativ skaliert sah ein 2.600er Bergland aus wie ein 5.200er Wall -- die Farbe war innerhalb eines Gebirges lesbar, zwischen zweien aber bedeutungslos. Absolut skaliert bedeutet ein Grauwert überall dasselbe. 💣 Der Preis steht hier, weil er beim Umstellen bestritten wurde und wieder bestritten werden wird: je höher der Weisspunkt, desto dunkler und flacher wird ALLES darunter. Bei 15.000 Schritt und einem Livebestand, dessen Gipfel per Vorgabe auf 5.000 stehen, bleibt der grösste Teil der Karte im unteren Drittel der Rampe. Das ist die eine Zahl, an der man dreht -- nicht die Farben. */ /* 🔴 Der untere Anschlag ist die GRUNDFARBE DER FLÄCHE, nicht Schwarz (Owner 2026-07-28). Damit ändert sich beim Aktivieren am Gebirgsfuss nichts sichtbar und es entsteht der Eindruck, dass nur das Höhenmodell dazukommt -- vorher wurde ein warm brauner Zug zu einem dunklen Fleck. Der Wert spiegelt --color-ecosystem-topographie-gebirge; wer den ändert, ändert auch diesen. */ /* 🔴 Die FÜNF Stützstellen des Prototyps (html/landschaften-modell.html:589), auf Owner-Wunsch 2026-07-28 wieder eingesetzt -- dort standen sie als rohe RGB-Tripel im Code, was AGENTS.md §12 verbietet. Warme Erdtöne vom Gebirgsfuss bis zum Firn, kein Blau: das Relief ist gemalte Karte. 🔴 FARBE UND DECKKRAFT SIND ZWEI DINGE, und das ist der Kern dieser Fassung. Die Farbe kommt aus dieser Rampe, die Deckkraft aus derselben Höhe: 0 Schritt = durchsichtig, 5.000 = voll. Am Gebirgsfuss ist der Schleier deshalb unsichtbar, und welche Farbe dort steht, spielt keine Rolle -- nach oben hin verdichtet er sich und die Rampe kommt zum Vorschein. Die Abstände sind ungleich, so wie im Prototyp: der Übergang ins Firn sitzt spät (0,8), damit nicht jeder Mittelhang schon weiss wird. */ --color-ecosystem-height-0: #b0be9e; /* 0 % -- Fuss, fahles Grün */ --color-ecosystem-height-1: #c6be96; /* 25 % -- untere Hänge, Sand */ --color-ecosystem-height-2: #bea37c; /* 55 % -- Mittellage, Braun */ --color-ecosystem-height-3: #d6c4b2; /* 80 % -- Hochlage, helles Braun */ --color-ecosystem-height-4: #f7f3ee; /* 100 % -- Firn, fast Weiss */ /* Deckkraft des Höhenschleiers. Er liegt ÜBER den Flächenfüllungen (Pane 420 über 250), also entscheidet dieser Wert, wie viel Regionsfarbe noch durchkommt. */ --opacity-ecosystem-height: 0.55; /* Selection contour (Owner 2026-07-26): a SELECTED area is outlined in white, an area whose corners are open for editing in the handle blue above. Two states, two contours -- the same principle as the two marker rings further up, and the reason the fill keeps its own tone in both cases: the colour says "which area", the contour says "what can I do with it". White because it reads on every one of the ten ground tones below/above it; pinned for the usual reason (light tiles). */ --color-ecosystem-selected-outline: #ffffff; /* Die Zielfläche einer Zwei-Flächen-Geste („Mit anderer vereinigen" & Co.) -- die Fläche, die der nächste Klick nimmt. 🔴 RICHTIG GELB (Owner 09.10.2026: „kannst du dem richtig gelb geben"); davor stand hier #ffab24, ein Orangegold, das sich zusammen mit seinem Schein „braungelb" las. Es ist die EINZIGE gelbe Linie, die die Zielwahl zeichnet -- die Kandidaten zeigen ihre eigene Kante, deshalb trennt die Farbe allein schon „das hier" von „hier kannst du anfassen". Gepinnt wie die Nachbarn: liegt auf hellen Kacheln. */ --color-ecosystem-target-active: #ffe500; /* Der dunkle Saum um die gelbe Zielkontur. Auf hellen Kacheln und hellen Grundtönen verschwindet Gelb allein; ein Pixel Dunkel daneben trägt es, ohne die Linie dicker oder blasser zu machen. 💣 Hier stand bis zum 09.10.2026 ein orangefarbener SCHEIN (6px) -- er machte die Kante weich und war ein Teil dessen, was der Owner „transparent" nannte. */ --color-ecosystem-target-halo: rgba(40, 32, 0, 0.85); /* ⚠️ `--color-ecosystem-target-outline` (#fff4a3, die blasse Kandidatenkante) und `--ecosystem-pick-band-width` (12px, das Trefferband) sind am 09.10.2026 entfallen: die Kandidaten tragen ihre eigene Kante, und die Reichweite des Treffens misst seither das Skript (ZIELWAHL_REICHWEITE_PX in js/map-features/map-features-ecosystem-geometry-ops.js). */ /* The paper the map is drawn on. The "Untergrund" slider fades the base tiles out towards THIS, so at 0% the frame looks like no base map at all and the drawn areas stand alone (Owner 2026-07-26). Pinned white, deliberately NOT --color-panel: this is map surface, not a panel, and in the dark theme a themed value would fade the tiles into near-black instead of clearing them away. */ /* Was hinter den ausgeblassten Kacheln durchscheint. 🔴 NICHT MEHR WEISS (Owner 2026-08-04: „kann man den Untergrund etwas dunkler ... machen?"). Reines Weiss hinter 25 % Kachel ergab eine fast leere Seite, auf der auch kräftige Flächenfarben blass wirkten -- der Untergrund nahm ihnen den Kontrast von unten. Ein warmes Pergamentgrau ist der Ton, gegen den die Landschaftsfarben stehen, statt in ihm zu verschwinden; es bleibt heller als jede Flächenfarbe und damit Hintergrund. */ --color-ecosystem-underground: #d3cec2; /* Modal scrim (behind centred dialogs) */ --color-scrim: rgba(38, 28, 16, 0.5); /* Editor dialog overlays (report/edit/wiki-sync/path/powerline/label/region) — a darker, denser scrim than --color-scrim above. Pinned: same in both themes. */ --color-scrim-dialog: rgba(20, 16, 12, 0.56); /* Full-bleed territory editor overlay — stronger still, paired with backdrop blur. */ --color-scrim-editor: rgba(20, 16, 12, 0.6); /* Spotlight search overlay — lighter + blurred, keeps the map visible behind it. */ --color-scrim-light: rgba(18, 15, 12, 0.34); /* Spoiler lid on a Kartensammlung card (Spec §3.7). Unlike every scrim above it does not sit BEHIND a dialog but ON a card, over already-blurred content: dense enough that the title underneath stays unreadable, light enough to read as a lid rather than a hole. Pinned + its own text colour: it always covers card content and always carries light text, so a themed --color-text-strong would go dark-on-dark in the light theme. */ --color-scrim-spoiler: rgba(20, 16, 12, 0.62); --color-scrim-spoiler-text: #f4ece0; /* ---- Der Startschleier (css/features/loading-bar.css) ---- Liegt ueber der Karte, solange die Klasse `avesmaps-booting` steht (Owner 19.08.2026: „sollen die kacheln im hintergrund leicht weiss erscheinen"). Entwurf: docs/superpowers/specs/2026-08-19-startladen-schleier-und-windrose-design.md 🔴 Anders als jeder Scrim darueber ist er NICHT gepinnt: „leicht weiss" beschreibt das helle Thema, und derselbe Wert ueber der dunklen Karte waere ein Blitz. Der dunkle Gegenwert steht im data-theme-Block weiter unten -- wer hier etwas aendert, aendert dort mit. */ --color-boot-veil: rgba(255, 253, 249, 0.55); /* Die Windrose darin: zwei Haelften je Zacke (die Seekarten-Optik) plus der ruhende Ring und sein Teilstrichkranz. Das Gold des laufenden Stuecks ist bewusst KEIN eigenes Token -- es ist --color-accent-strong, das Wappengold, das die Designsprache dafuer schon fuehrt. */ --color-boot-ring-ink: #6d5236; --color-boot-ring-pale: #d7c9a8; --color-boot-ring-track: rgba(109, 82, 54, 0.22); /* Territory-editor sticky header — translucent panel + backdrop-filter blur so scrolled content shows through faintly. */ --color-panel-translucent: rgba(255, 253, 249, 0.96); /* Travel-speed tiers — the functional ampel in the speed-matrix dialog. A data highlight, not chrome. 💣 THIS ONE IS THEMED (see the dark block below): it was pinned across both themes until 2026-08-04, and the pale light-theme fills then stood at 11:1 against the dark dialog — three glaring blocks instead of a tinted table. The dark set repeats the LIGHT theme's own relationship (fill ~1.5:1 over its panel), which is what makes it read as the same component. */ --color-tier-fast-bg: #d2e5ad; --color-tier-fast-text: #2b5407; --color-tier-mid-bg: #f2ddb0; --color-tier-mid-text: #6b3d07; --color-tier-slow-bg: #f3cfcf; --color-tier-slow-text: #7a1c1c; /* Territory-editor "on map" presence indicator (tree/legend swatch ring). A data highlight (not chrome), deliberately identical in both themes. */ --color-map-presence: #6a7f3a; /* Der Außendurchmesser des grünen Statuskreises. 💣 Er steht als Token da, weil es DREI Zeichner gibt und zwei davon nebeneinander im selben Fenster sichtbar sind: die geteilte Listenregel (css/components/map-status-circle.css) und das Abzeichen `.cov` des Territorienbaums (html/wiki-sync-settlement-editor.html, html/wiki-sync-monitor.html). Am 18.08.2026 zeigte der Ortseditor 12px links und 11px in der Mitte -- dieselbe Aussage in zwei Größen, in einem Blick. `.cov` bringt sein eigenes Markup mit (`.all`/`.own-only`/ `.children-only` statt der `tree-map-status--*`), deshalb bleibt es eine eigene Regel; die GRÖSSE darf nicht zweimal geraten werden. */ --map-status-circle-size: 11px; /* Wegarten — die Farbe, in der die KARTE diese Wegart zeichnet (map-features.js, centerColors). Sie machen die Art-Beschriftung in der Wegeliste zu einer Legende: man sieht dort, wie die Linie draußen aussieht. 🔴 Es sind NICHT die Kartenwerte selbst. Die sind für eine LINIE auf heller Karte gewählt; als SCHRIFT auf Pergament fielen sie durch — Wüstenpfad kam auf 2,23 Kontrast, die Untergrenze für kleine Schrift ist 4,5. Diese Werte sind dieselben Farbtöne, so weit abgedunkelt, dass 4,6 erreicht ist — gerechnet gegen den GEMESSENEN Grund der Editorseite (#f3f0e8). 💣 Die erste Fassung rechnete gegen --color-panel-soft (#faf6ee) und landete bei 4,27 bis 4,38: knapp daneben ist hier unbrauchbar, und nur die Messung in der echten Seite hat es gezeigt. 🔴 SEIT 02.09.2026 HABEN REICHSSTRASSE, STRASSE UND WEG EIN TOKEN. Hier stand bis dahin „haben KEIN Token", begründet damit, dass Weiß, Grau und Hellwarm als Text keine Farben seien, sondern Rauschen. Das galt für die Wegeliste und gilt dort weiter — es galt aber nie für den ZWEITEN Leser dieser Familie: die Karte des (inzwischen zurückgebauten) Garetien- Importers leitete ihren Farbton nach der Hauskonvention als `--color-path-` her. Für diese drei gab es nichts, `var()` wurde ungültig, und JEDE importierte Reichsstraße, Straße und jeder Weg wurde golden statt in seiner Wegart-Farbe gezeichnet — bei einer Konsolen- meldung je Objekt. Der Importer vergibt genau fünf Wegarten (Flussweg, Reichsstrasse, Strasse, Weg, Pfad), DREI davon waren betroffen: das war die Mehrheit, kein Sonderfall. ⚠️ Sie folgen derselben Regel wie ihre fünf Geschwister — der Kartenton, so weit abgedunkelt/aufgehellt, dass 4,5 erreicht ist. Weil Weiß und Grau abgedunkelt beide zu Grau werden, trägt die Reichsstraße den KÜHLEN Ton (ihr Kartenrand ist als einziger grau, nicht weiß), die Straße das reine Neutral und der Weg sein entsättigtes Warm. Gemessen gegen #f3f0e8: 8,27 / 4,75 / 5,95; jedes Paar dieser Familie liegt bei dE ≥ 10,8 auseinander — über den bestehenden Nachbarschaften (pfad~wuestenpfad 9,2, flussweg~bach 6,2). ⚠️ DIE WEGELISTE BEKOMMT SIE NICHT AUTOMATISCH: css/pages/wege-editor.css führt seine Arten einzeln auf, und wege-art-farben.test.js prüft eine eigene Liste. Wer sie dort haben will, trägt Regel UND Testliste nach — die Entscheidung „als Text Rauschen" ist damit nicht aufgehoben, sondern nur nicht mehr die Begründung für ein fehlendes Token. ⚠️ Blau bei Fluss- und Seeweg ist die Regel, nicht die Ausnahme: docs/design-language.md („No blue = UI chrome only") erlaubt es ausdrücklich, wo Farbe DATEN kodiert statt Bedienoberfläche — wie schon bei den Wassertönen der Landschaften-Ebene. */ --color-path-reichsstrasse: #3f4750; --color-path-strasse: #6a6a6a; --color-path-weg: #635a4d; --color-path-pfad: #86654e; --color-path-gebirgspass: #965d52; --color-path-wuestenpfad: #7b6a48; --color-path-flussweg: #3f7191; --color-path-seeweg: #296db9; /* Bach — vom Flussweg abgeleitet, aber ein EIGENES Token: heller und blasser (H≈206 statt 203, S≈26% statt 39%), weil ein Bach schmaler ist und den Fluss nicht überschreien soll. Eine geteilte Farbe mit --color-path-flussweg liefe beim nächsten Umton auseinander. Gemessen 4,66:1 gegen denselben Grund (#f3f0e8) wie die übrigen Wegarten-Tokens oben. */ --color-path-bach: #4f6f87; --color-map-presence-text: #2f6b3a; /* darker text variant of the above, same pinning rule */ /* Territory-assignment picker (parent-tree/tabs/breadcrumb "active" rows) — translucent white overlays that sit ONLY on the --color-button solid fill, never on a page surface. --color-button stays mid-dark in both themes, so these are deliberately identical in both (no dark override needed). */ --color-on-button-muted: rgba(255, 255, 255, 0.8); /* secondary/meta text on the fill */ --color-on-button-hairline: rgba(255, 255, 255, 0.25); /* faint divider/chip-bg on the fill */ /* Interaction & focus (see "Button states" in the doc) */ --color-focus: rgba(191, 160, 58, 0.45); /* gold focus glow */ --focus-ring: 0 0 0 3px var(--color-focus); /* compose with the element's shadow, don't replace it */ --color-hover-wash: rgba(191, 160, 58, 0.14); /* row / option hover */ --color-active-wash: rgba(191, 160, 58, 0.24);/* selected row */ /* ---- Chart series (categorical) ----------------------------------------------------------- * FOUR slots, assigned in fixed order, never cycled. Introduced 2026-08-02 for the way editor's * „Funktionen anzeigen" window -- the first surface in this project that draws several data * series at once. * * 💣 FOUR IS THE CEILING, AND IT IS A MEASURED ONE. These were not picked by eye: the palette * was run through an OKLab/ΔE validator with protanopia, deuteranopia and tritanopia * simulation against the real chart surfaces (--color-panel-soft, light and dark). Lightness * band, chroma floor, normal-vision separation (ΔE 18,1 light / 15,7 dark) and contrast all * pass. The red-green pair does NOT: ΔE 4,8 light and 1,0 dark against a target of 8. * * 🔴 That failure cannot be fixed with better hues, and it is the price of AGENTS.md §12's „no * blue". Red and green ARE the red-green confusion axis, and the one hue that separates * cleanly there is the forbidden one. Seven warm earth tones were tried first and scored * worse (ΔE 1,3) -- two of them indistinguishable even with full colour vision. * * ⭐ THEREFORE COLOUR NEVER CARRIES IDENTITY ALONE on these charts. Whoever uses these tokens * also ships a second encoding -- stroke pattern per series, plus small multiples so that * rarely more than four series share one picture. A fifth series is refused, never given an * invented fifth hue. */ --color-chart-1: #c9821c; /* gold-orange */ --color-chart-2: #a02a24; /* brick red */ --color-chart-3: #2f7d3a; /* leaf green */ --color-chart-4: #6b4a8f; /* plum */ --color-check-accent: var(--color-accent-strong); /* checkbox/radio checked mark + border */ --color-check-fill: var(--color-active-wash); /* checkbox/radio checked fill */ --color-disabled-bg: #ece7dd; --color-disabled-text: #a99f8e; --color-disabled-border: #dcd3c4; /* Scrollbars — thin, theme-aware track/thumb (Firefox scrollbar-color + WebKit pseudo-elements), applied globally in base.css. */ --color-scrollbar-thumb: rgba(141, 121, 98, 0.4); --color-scrollbar-thumb-hover: rgba(141, 121, 98, 0.6); --color-scrollbar-track: transparent; /* Spacing scale — value-named steps; use a token, never a stray px */ /* Owner: alle Spacing-Vars global +2px (mehr Luft überall). Die Namen (2/4/6/…) bleiben als Skala-Stufen; die WERTE tragen +2. App-weit + reversibel. */ --space-2: 4px; --space-4: 6px; --space-6: 8px; --space-8: 10px; --space-10: 12px; --space-12: 14px; --space-16: 18px; --space-20: 22px; --space-24: 26px; /* Radius — 3 rungs; the old 4/6/7/9 fold to the nearest (controls → md) */ --radius-sm: 5px; /* mirrored panel shell + tiniest chips */ --radius-md: 8px; /* all controls: buttons, inputs, selects, pills, rows */ --radius-lg: 10px; /* menus, cards, autocomplete */ /* Hüllenmaße der Editoren (Spec 2026-07-22-editor-designsprache §3.1a). Sie standen bis 2026-08-15 in css/components/editor-page.css und waren damit genau den Editor-SEITEN vorbehalten. Der Vorkommeneditor ist aber der einzige der fünf, der KEIN iframe ist — er lebt als Dialog in index.html und lädt editor-page.css nicht. Abschreiben wäre die Wiederholung des Fehlers, den editor-page.css beendet hat (derselbe Wert an drei Stellen, dreimal verschieden), also stehen sie hier: tokens.css laden BEIDE Welten. Der Name ist die Stufe, nicht die Pixelzahl — --space-* trägt global +2px. */ --avm-control-h: 32px; /* Suchfeld, Eingabe, Auswahl, Knopf */ /* 🔴 DER SEITENEINZUG IST ÜBERALL 14 (--space-12) — daran hängt die EINE Kante, durch die Kopfleiste, Menüband, Rumpf und Fußleiste eines Fensters senkrecht fluchten (docs/design-language.md §Fenster, Mockup docs/fensterformen-mockup.html). 💣 Das SENKRECHTE Polster folgt der BEDIENHÖHE des Bandes, das waagerechte NIEMALS: Kopf- und Fußleiste tragen 32px-Elemente -> 6, das Menüband 48px-Kacheln -> 10, die Statuszeile ist einzeilig -> 6. Wer waagerecht 12 schreibt, nimmt die Kante zurück. */ --avm-kopf-pad: var(--space-4) var(--space-12); /* 6 / 14 — Kopfleiste und Fußleiste */ --avm-ribbon-pad: var(--space-8) var(--space-12); /* 10 / 14 — Menüband */ --avm-ribbon-gap: var(--space-4); /* 6 */ --avm-status-pad: var(--space-4) var(--space-12); /* 6 / 14 — Statuszeile, Listenkopf */ --avm-status-min-h: 30px; /* 🔧 WAAGERECHT STEHT ER NOCH AUF 12 -- und das ist Absicht, kein Versehen. Die Spalten sind die EINZIGE Zone, die nicht auf der gemeinsamen 14er-Kante steht (Menüband und Statuszeile tragen sie schon), und er soll dorthin. Aber: 💣 DIESEN TOKEN LESEN NEUN FENSTER GLEICHZEITIG -- .avm-col (Landschaften-, Wege-, Kraftlinien-, Orte-, Literatur-, Karten-Editor), .wp-fn und .wp-tempo (Funktionen, Tempowerte), der Vorkommen-Editor, dazu fuenf iframe-Seiten inline. Ihn hier zu aendern verschiebt sie alle auf einmal um 2px -- eine sichtbare Aenderung an neun Fenstern in einem Push, in dem der Owner EINES erwartet (AGENTS.md §9: "Ein Commit, ein Push, sein Blick -- dann der naechste"). ⚠️ Und KEIN Test haelt den Zahlenwert fest; das Feld bliebe gruen. ⭐ Wer ein Fenster einzeln auf die Kante zieht, ueberschreibt den Token AN SEINER HUELLE (so machen es inzwischen sechs Fenster, z. B. .social-hub). Wenn alle neun dort sind, faellt der Wert hier auf --space-12 und die lokalen Zeilen fallen weg. */ --avm-col-pad: var(--space-6) var(--space-10); /* 8 / 12 — jede der drei Spalten */ --avm-row-pad: var(--space-2) var(--space-4); /* 4 / 6 — Listenzeile */ --avm-field-label-w: 130px; /* Beschriftung links neben dem Feld */ /* Die Feldzeile mit Wiki-Override (Entwurf 2026-08-17-wiki-override-fuer-alle-design.md §2.8): Beschriftung · durchgestrichener Wiki-Stand + ↺ · Eingabefeld. 🔴 DAS EINGABEFELD BEKOMMT MINDESTENS DIE HAELFTE (Owner 17.08.2026), der Wiki-Stand weicht als Erster -- deshalb steht hier ein Mindestmass fuer das FELD und ein Hoechstmass fuer den Wiki-Stand, nicht umgekehrt. 💣 Die obere Schranke des clamp() ist tragend: ohne sie fordern die drei Spalten bei schmalem Fenster mehr als 100 % an und das Raster haengt eine waagerechte Bildlaufleiste an -- bei 300px gemessen. Die 165px sind Beschriftung (130) + zwei Spaltenabstaende (12) + das ↺ samt Vorabstand (18) + Rest; in der ersten Rechnung war das ↺ schlicht vergessen. */ /* 🪤 HIER STANDEN ZWEI TOKEN -- eine Hoechstbreite fuer den Wiki-Stand und ein gerechneter Mindestplatz fuers Feld (clamp mit 100% - 165px). Beide sind am 17.08.2026 gefallen, und die Lehre ist groesser als die zwei Zeilen: die Rechnung loeste ein Problem, das die AUFTEILUNG gar nicht erst hat. Der Owner hat es in einer Zeile gesagt -- „50% | 50%" --, nachdem zwei gerechnete Fassungen an zwei Oberflaechen danebengegangen waren. Wer einen Mindestwert ausrechnet, sollte zuerst fragen, ob eine Haelfte reicht. */ /* Hoehe der Wiki-Zuweisungs-Trefferliste. 💣 Stand bis 16.08.2026 als nackte 340px an ZWEI Stellen -- .label-wiki-picker-list (region-sync.css) und der abgeschriebenen .dt-picker-list (editor-page.css) -- und ein Kommentar behauptete "dieselbe Hoehe". Das gilt genau bis jemand eine der beiden aendert (AGENTS.md §12: erst das Token, dann benutzen). */ --avm-picker-list-max-h: 340px; /* Trefferliste der Wiki-Zuweisung */ /* Divider rhythm — symmetric space above & below a section line (on-scale) */ --divider-gap: var(--space-12); /* reading sections (infobox) */ --divider-gap-tight: var(--space-6); /* dense control groups (route planner) */ /* Icon sizes — one scale for UI glyphs (sm/md) AND the existing colour imagery (lg..hero: transport, type toggles, coats) so sizes stop drifting */ --icon-sm: 16px; /* dense inline glyph */ --icon-md: 20px; /* standard UI glyph */ --icon-lg: 24px; /* inline content icon — transport mode */ --icon-xl: 46px; /* map-display type toggle — fills the wider 350px route-planner cell */ --icon-2xl: 48px; /* infobox type icon (coat fallback) */ --icon-hero: 130px; /* coat / logo hero */ /* Die beiden Randlaschen -- „Routenplaner" links (#toggle-button, css/layout/map-layout.css) und „Info" rechts (.avesmaps-infopanel__handle, css/features/infopanel.css). Sie sind seit jeher gleich gebaut, standen aber mit denselben drei Zahlen in ZWEI Dateien; das ist die Divergenz aus AGENTS.md §12, und am Telefon musste sie an beiden Enden zugleich wandern. */ --avesmaps-tab-w: 30px; --avesmaps-tab-top: 30px; --avesmaps-tab-h: 140px; /* 🔴 Die PANEL-REITER "Info" und "Editor" behalten diese Maße AUCH am Telefon (Owner 04.09.2026: "editor und infotab sollten nicht abmessung und groesse der lasche vom routenplaner auf dem handy haben. sondern vom desktop"). Sie sind ein anderes Bauteil als der Griff des Planers: der ist am Telefon ein PFEIL ohne Wort und darf deshalb auf 26x56 schrumpfen (unten im Telefon-Block) -- diese beiden tragen ihre BESCHRIFTUNG und sind zu zweit ein Reiterpaar, zwischen dem man waehlt. Bei 56px stapelten sie sich als zwei Briefmarken an der Kante. 💣 Darum ein EIGENER Satz und keine abgeschriebenen Zahlen an den zwei Laschen: sonst wandert beim naechsten Anfassen die eine und die andere bleibt stehen -- genau die Divergenz, wegen der --avesmaps-tab-* ueberhaupt entstanden ist. */ --avesmaps-paneltab-w: 30px; --avesmaps-paneltab-top: 30px; --avesmaps-paneltab-h: 140px; /* Der Kantenschatten der Telefon-Lasche: ein schmales dunkles Band an genau der Kante, unter der sie hervorkommt -- ausdruecklich KEIN Verlauf ueber die volle Breite (Owner 12.08.2026, am Entwurf entschieden: „nicht ueber die volle breite, sondern dass es so aussieht wenn die lasche unter dem panel sitzt"). Als fertiges Bild und nicht als Farbe, weil erst die drei Stopps zusammen die Aussage sind; einzeln waeren es drei Zahlen, die auseinanderlaufen koennen. ⚠️ Derselbe Wert in hell und dunkel: er verdunkelt den Knopfgrund, statt eine eigene Farbe zu setzen, und beide Knopfgruende sind warme Brauntoene. */ --avesmaps-tab-edge-shade: linear-gradient(90deg, rgba(18, 15, 10, 0.36) 0, rgba(18, 15, 10, 0.17) 5px, rgba(18, 15, 10, 0) 13px); /* Der Abstand zum Kartenrand -- EINE Zahl fuer alles, was unten an der Karte klebt: der Knopfbund („Neuigkeiten"/„Hinweise"), der Zoom darueber und die beiden Panels. 💣 Sie standen vorher als 12 gegen 14 nebeneinander, und man sah es: das Infopanel endete 2px ueber „Hinweise" (Owner 11.08.2026, am Zeiger gemessen 786 gegen 788). Zwei Zahlen, die dasselbe meinen -- genau der Fall aus AGENTS.md §12. */ --avesmaps-edge-gap: 12px; /* Die Panels leiten ihren unteren Rand DARAUS ab, statt ihn zu waehlen. Damit kann das Infopanel gar nicht mehr neben dem Knopfbund enden, und wer den Kartenrand aendert, aendert beide. Oben haben sie einen eigenen Wert -- dort steht nichts, mit dem sie fluchten muessten. */ --avesmaps-panel-inset-top: 10px; --avesmaps-panel-inset-bottom: var(--avesmaps-edge-gap); /* Die Breite des Routenplaners (#search) -- und seit dem 12.08.2026 auch die des Anzeige-Menues in der Kartenecke (Owner: „auf dem desktop etwa die breite des routenplaners"). Bei dieser Breite stehen die sechs Ortsklassen nebeneinander, ohne sich zu quetschen. Zwei Zahlen, die dasselbe meinen, laufen beim ersten Anfassen auseinander -- derselbe Fall wie --avesmaps-edge-gap darueber. */ --avesmaps-planner-width: 350px; /* Eine Sprosse ueber --z-map-panel (1010): ein GEOEFFNETES Menue in der Kartenecke. Es schwebt seit dem 12.08.2026 ueber der Karte und ueberlappt dabei die Routenplaner-Lasche, die sonst darueber laege und ihm die erste Zeile abschneidet. ⚠️ Nur fuer den offenen Zustand gedacht -- der Bund selbst bleibt auf --z-map-ui. */ --z-map-menu: 1020; /* Elevation */ --shadow-panel: 0 8px 24px rgba(0, 0, 0, 0.16); --shadow-dialog: 0 20px 45px rgba(0, 0, 0, 0.38); /* Button hover lift — warm brown drop, one step stronger for the filled main action. Matches the route-planner buttons (which still inline these values; migrate them to these tokens later). */ --shadow-button-hover: 0 4px 10px rgba(52, 41, 32, 0.14); --shadow-button-hover-strong: 0 5px 12px rgba(52, 41, 32, 0.22); --z-map-ui: 1000; /* Der Routenplaner liegt UEBER der uebrigen Kartenbedienung (Owner 11.08.2026: "der routenplaner soll ueber den buttons auf der karte liegen"). Vorher trugen beide --z-map-ui, und dann entscheidet die Reihenfolge im Markup -- der Knopfbund steht spaeter und lag deshalb obenauf, mitten im Panelinhalt. ⚠️ Unter dem Infopanel (1080) und dem Editorpanel (1100): die beiden decken den Planer weiterhin zu, wenn sie aufgehen. */ --z-map-panel: 1010; --z-dialog: 1450; --z-dialog-high: 1460; /* Der aufziehbare Rahmen des Kartenausschnitts (Social-Media-Hub, js/ui/karten-abzug.js). Ueber --z-dialog-high, weil er das Kartenkontextmenue ueberdecken muss -- und UNTER --z-editor-overlay, weil ein offener Editor die Karte ohnehin verdeckt und dort nichts aufzunehmen ist. Der Hub selbst (--z-modal) blendet sich fuer das Ziehen weg. */ --z-map-capture: 1470; /* Editor overlays (the iframe tools: territory, settlement, adventure, citymap, wiki-sync). Above --z-dialog-high so an editor overlay always clears the map context menu sitting there. */ --z-editor-overlay: 1500; /* A dialog opened FROM an editor overlay ("Alle anzeigen") — must clear --z-editor-overlay. */ --z-dialog-over-editor: 3000; /* Typeahead dropdowns. Must clear --z-editor-overlay: the source autocomplete opens from an add-row that lives INSIDE the editor overlays. Also carries the route planner's jQuery-UI menu (.ui-autocomplete), which must out-rank jquery-ui.css's .ui-front (z-index: 100). */ --z-autocomplete: 1600; --z-modal: 5000; /* full-screen modal overlay — above --z-autocomplete */ } /* ═══════════════════════════════════════════════════════════════════════════════════════════ DIE IOS-SCHWELLE — der EINE Ort, an dem die Feldschrift fuer grobe Zeiger steht. 💣 Unter 16px faehrt Safari beim Fokus in jedes Feld hinein und kehrt NICHT zurueck -- bei jeder einzelnen Eingabe. 16 ist eine Schwelle, kein Richtwert: 15,5px zoomt noch. 🔴 NICHT ueber maximum-scale / user-scalable im Viewport-Meta loesen: das naehme allen das Aufziehen der Karte, und neuere iOS-Fassungen ignorieren es ohnehin. ⚠️ `pointer: coarse` meint den PRIMAEREN Zeiger -- ein Laptop mit Touchscreen und Maus meldet `fine` und bleibt unberuehrt. ═══════════════════════════════════════════════════════════════════════════════════════════ */ @media (pointer: coarse) { :root { --font-size-control: 16px; } } /* 💣 DER STEMPEL DIESER DATEI WIRD AUS DEM REPO GERECHNET, HOCHGELADEN WIRD NUR DER PUSH-DIFF. Am 11.08.2026 scheiterte der Deploy dieser Datei an einem roten Test -- hochgeladen wurde nichts. Der naechste, erfolgreiche Lauf trug ihren NEUEN Inhaltsstempel ins HTML, ohne sie selbst mitzunehmen: `tokens.css?v=903dace7de` lieferte zweieinhalb Stunden den ALTEN Inhalt, und jeder Browser hat genau den unter dieser Adresse gecacht. Ein spaeterer Voll-Deploy repariert das NICHT -- er laedt die richtige Datei unter dieselbe, laengst vergiftete Adresse. Heilung ist nur eine INHALTSAENDERUNG (neuer Hash = neue Adresse); dieser Absatz ist sie. ⚠️ Merkmal des Falls: der Server liefert mit Cache-Umgehung das Richtige, die Seite zeigt das Falsche, und das HTML ist NICHT veraltet (docs/asset-caching-and-versioning.md). Am Telefon laufen die PANELS von Kante zu Kante -- die Randlaschen NICHT. 🔴 Das war am 11.08.2026 fuer wenige Stunden anders und ist zurueckgenommen: „von oben nach unten durchgehen" galt dem PANEL, nicht seinem Reiter (Owner, nach dem Ansehen: „das Tab sollte nicht veraendert werden, ich meinte dass das Panel selbst von oben nach unten gehen soll"). Eine Lasche ueber die volle Bildschirmhoehe ist ein 100-dvh-Balken neben der Karte. ⚠️ Seit dem 12.08.2026 ist die Lasche des Planers am Telefon KLEINER als am Zeiger (26x56 statt 30x140, Werte unten) und sitzt mittig statt oben -- also das Gegenteil jener Aenderung, nicht sie noch einmal: der Owner hat den kleinen Pfeilgriff am Entwurf abgenommen, weil der beschriftete Balken am Telefon zu viel Karte verdeckt. `--avesmaps-tab-top` gilt dort deshalb nur noch der Info-Lasche (die im Frontend ohnehin weg ist, also praktisch nur dem Edit-Modus). 💣 An `html.avesmaps-phone`, NICHT an einer Media-Query: „Telefon" ist in diesem Haus EINE Definition -- avesmapsIsPhoneViewport() (pointer: coarse UND Kurzseite <= 600px) setzt die Klasse, das CSS liest sie. Eine zweite Fassung als Breiten-Query traefe ein quer gehaltenes Telefon nicht und ein Tablet zu viel. ⚠️ Hier stehen nur die WERTE. Beide Laschen lesen sie in ihren eigenen Dateien -- eine Regel, die von hier aus auf `#toggle-button` und `.avesmaps-infopanel__handle` zielte, waere ein dritter Ort, an dem ihre Maße stehen. */ html.avesmaps-phone { /* Die Panels laufen von Kante zu Kante (Owner 11.08.2026: „im mobile full height"). Nur SIE -- --avesmaps-edge-gap bleibt bei 12px, sonst klebte der Knopfbund am Bildschirmrand. Deshalb hat der Panel-Rand einen eigenen Token, statt der Kartenrand-Zahl direkt zu folgen: am Zeiger ist er von ihr abgeleitet, am Telefon faellt er weg. */ --avesmaps-panel-inset-top: 0px; --avesmaps-panel-inset-bottom: 0px; /* Die Randlasche ist am Telefon ein kleiner Pfeilgriff statt eines beschrifteten Balkens (Owner 12.08.2026, am Entwurf abgenommen). Nur die MASSE stehen hier; die Form -- Pfeil statt Wort, mittig statt oben, Kantenschatten -- steht bei der Lasche selbst in css/layout/map-layout.css. ⚠️ Beide Laschen lesen die Werte. Im Frontend ist die Info-Lasche am Telefon ohnehin weg (css/features/infopanel.css); im Edit-Modus bleibt sie und traegt ihr Wort auch in der kleineren Form -- „Info" misst gemessene 24px und passt in die 56. */ --avesmaps-tab-w: 26px; --avesmaps-tab-h: 56px; } /* Dark theme — opt-in (set data-theme="dark" on :root). Same warm family, deep parchment-brown canvas, cream text; the gold is lightly desaturated (~12% less than the light gold) so it stays calm on dark instead of shouting. */ :root[data-theme="dark"] { --color-page-bg: #211f19; --color-page-bg-deep: #181611; --color-panel: #312e26; --color-panel-soft: #37342b; --color-panel-muted: #39352b; /* Lighter than the panel here -- the same "pressed" reading, mirrored for dark. */ --color-panel-active: #4c4636; --color-text: #eee7da; --color-text-strong: #f5f0e4; --color-text-muted: #b4a895; --color-placeholder: #7b7467; --color-border: #514a3c; --color-border-strong: #615a49; --color-divider: rgba(207, 197, 171, 0.24); --color-button: #6b6456; --color-button-border: #7a7361; --color-button-text: #f5ebd7; /* Hover geht hier DUNKLER, anders als im hellen Thema. Auf dunklem Grund steht cremefarbene Schrift auf dem Knopf: ein hellerer Hover senkt den Kontrast, statt ihn zu heben. Der alte Wert #797264 lag bei 4,03:1 gegen --color-button-text und damit unter WCAG AA (4,5) -- sichtbar an jeder Sync-Kachel. Jetzt 6,05:1. Die 1px-Anhebung und der staerkere Schatten tragen das Hover-Signal. */ --color-button-hover: #5e5749; /* Muss mitwandern: der bisherige Wert #5d5648 lag praktisch auf dem neuen Hover und waere nicht mehr davon zu unterscheiden gewesen. Jetzt 7,46:1. */ --color-button-active: #4f4a3d; --color-button-soft: #3a362c; --color-button-soft-text: #eae1cf; --color-button-soft-border: #585142; --color-button-soft-hover: #453f32; --color-button-soft-active: #4e4739; --color-accent: #cfb767; --color-accent-strong: #dcc77e; /* Wegarten im dunklen Thema — dieselben Farbtöne, für den dunklen Panelgrund aufgehellt. Gemessen 4,7 bis 6,8 (die vorhandene gedämpfte Schrift liegt bei 5,3). */ /* Reichsstraße/Straße/Weg — dieselbe Ordnung wie im hellen Thema (kühl / neutral / warm), für den dunklen Grund aufgehellt. Gemessen gegen #211f19: 12,79 / 7,85 / 9,17. */ --color-path-reichsstrasse: #dfe3e9; --color-path-strasse: #b4b3af; --color-path-weg: #cdc0a6; --color-path-pfad: #c79a78; --color-path-gebirgspass: #d99184; --color-path-wuestenpfad: #d8bd85; --color-path-flussweg: #7fc9f0; --color-path-seeweg: #5aa6e0; /* Bach — dieselbe blasse, entsättigte Ableitung wie im hellen Thema (H≈206, S≈28% statt der satten 79% des Flusswegs), für den dunklen Panelgrund aufgehellt. Gemessen 4,93:1 gegen --color-panel-soft (#37342b), innerhalb der Spanne der übrigen Wegarten-Tokens oben. */ --color-path-bach: #89a7bd; --color-link: #d7c38b; --color-link-hover: #e3d39f; --color-accent-brown: #c9a97e; --color-accent-brown-hover: #dcbe97; --color-accent-brown-soft: #a3835c; --color-accent-brown-text: #241d14; --color-accent-brown-focus: rgba(201, 169, 126, 0.25); /* Kanon-Etikett, dunkel: Fuellung und Schrift tauschen die Rolle, damit das Feld auf dem dunklen Grund nicht als Loch wirkt. Gemessen 9,5:1 und 7,2:1. ⚠️ Die Werte stehen im hellen Block als `*-on-dark` -- sie gelten auch fuer Flaechen, die in BEIDEN Themen dunkel sind (die Suchkachel), und duerfen deshalb nur einmal existieren. */ --color-kanon-official: var(--color-kanon-official-on-dark); --color-kanon-official-text: var(--color-kanon-official-text-on-dark); --color-kanon-unofficial: var(--color-kanon-unofficial-on-dark); --color-kanon-unofficial-text: var(--color-kanon-unofficial-text-on-dark); --color-pill: #3b3522; --color-pill-border: #5c5237; --color-pill-text: #e7d7a5; --color-danger: #d27566; --color-success: #7cc48a; --color-success-halo: rgba(124, 196, 138, 0.22); --color-muted-halo: rgba(180, 168, 149, 0.20); --color-success-soft: #2c3a24; --color-success-soft-border: #4d6b3a; --color-success-soft-text: #9cd39a; --color-danger-soft: #3f2a26; --color-danger-soft-border: #6b463f; --color-danger-soft-text: #e29c8f; --color-warning: #e0b45c; --color-warning-soft: #3b3122; --color-warning-soft-border: #6d5629; --color-warning-soft-text: #e9c684; --color-warning-strong: #c79a3c; --color-warning-strong-text: #241d14; /* Link status, dark: the muted grey lifts so it stays legible on the deep panel. --color-status-online needs no override -- it is var(--color-success), which is re-pointed just above. */ --color-status-offline: #9a9184; /* No dark override for the waypoint marks (or the --color-marker-*-ring editor marks below) on purpose -- the SAME mark appears on the always-light map tiles and on the dark panels; a theme-shifted red would make the planner (or the editor) disagree with the map. */ --color-panel-translucent: rgba(49, 46, 38, 0.96); /* Travel-speed tiers, dark — deep warm fills with a light tint of their own hue, so the ampel stays readable as green/amber/red without lighting up the dialog. Measured on --color-panel #312e26: text 6,5–7,4:1 (AA is 4,5) and all three fills sit ~1,5:1 over the panel, the same modest lift the light theme has. */ --color-tier-fast-bg: #3f5326; --color-tier-fast-text: #d3e9ac; --color-tier-mid-bg: #5d4720; --color-tier-mid-text: #f2dcab; --color-tier-slow-bg: #753831; --color-tier-slow-text: #f7d4ce; /* Review stars, dark: the gold stays warm; the empty track darkens so it doesn't glare on the deep panel (a light beige track would read almost as bright as a filled star). */ --color-star: #e6b850; --color-star-muted: #6f6552; --color-marker-active: #f0b429; --color-focus: rgba(207, 183, 103, 0.5); --color-hover-wash: rgba(207, 183, 103, 0.18); --color-active-wash: rgba(207, 183, 103, 0.30); /* Chart series, dark. NOT an automatic lightening of the light steps -- these were re-validated against the dark chart surface (#37342b) as their own palette. The dark lightness band is narrower (L 0,48-0,67 vs 0,43-0,77), and the first attempts sat above it. Same ceiling of four, same obligation to a second encoding. */ --color-chart-1: #b58c10; --color-chart-2: #c74a55; --color-chart-3: #2f9647; --color-chart-4: #8f5fc4; /* Checkbox/radio checked, dark: the gold read as muddy + too yellow (owner). Use a markedly desaturated gold and a solid subtle fill instead of the translucent wash. */ --color-check-accent: #aaa598; --color-check-fill: var(--color-panel-soft); --color-disabled-bg: #322f27; --color-disabled-text: #6e685c; --color-disabled-border: #433e33; /* Scrollbars, dark: same warm-brown family as --color-text-muted, lightened so the thumb still shows up against the deep panel. */ --color-scrollbar-thumb: rgba(180, 168, 149, 0.35); --color-scrollbar-thumb-hover: rgba(180, 168, 149, 0.55); --shadow-panel: 0 8px 24px rgba(0, 0, 0, 0.45); --shadow-dialog: 0 20px 45px rgba(0, 0, 0, 0.6); --shadow-button-hover: 0 4px 10px rgba(0, 0, 0, 0.38); --shadow-button-hover-strong: 0 5px 12px rgba(0, 0, 0, 0.5); /* Der Startschleier, dunkel. Kein Weiss ueber der dunklen Karte -- die Begruendung steht im hellen Block. Die Rose dreht ihre beiden Haelften um: hell wird cremefarben, „dunkel" wird ein warmes Mittelbraun, damit beide auf dem dunklen Grund lesbar bleiben. */ --color-boot-veil: rgba(33, 31, 25, 0.66); --color-boot-ring-ink: #cbb99a; --color-boot-ring-pale: #efe6d2; --color-boot-ring-track: rgba(238, 231, 218, 0.20); }