/* MarketLab Design Tokens · V1.4
   Einzige CI-Quelle fuer Farbe und Schrift.

   Angebunden an die Hauptseite marketlab.markets. Alle Farb- und Schriftwerte
   sind aus deren styles.css uebernommen, damit das Research Lab als Reiter im
   Funnel nicht wie ein Fremdkoerper wirkt.
   Quelle: 07_FUNNELS_OFFERS/20_WORK/atas_marathon/web/styles.css

   Abweichung mit Absicht: die Hauptseite bildet auch --mono auf Roboto Serif ab.
   Hier bleibt eine echte Monospace stehen, weil auf der Preisachse Zahlen
   untereinander fluchten muessen. Alles andere folgt der Hauptseite. */

/* Roboto Serif, lokal ausgeliefert wie auf der Hauptseite.
   Kein Google-Fonts-Link: der uebertrug bei jedem Aufruf die IP des Besuchers. */
@font-face{
  font-family:"Roboto Serif";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url(assets/fonts/roboto-serif-latin-wght-normal.woff2) format("woff2-variations");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Roboto Serif";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url(assets/fonts/roboto-serif-latin-ext-wght-normal.woff2) format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  color-scheme:dark;

  /* Flaechen · identisch zur Hauptseite */
  --bg:#07090a; --bg-rgb:7,9,10; --e2:#101417; --e3:#151a1d;

  /* Akzente · identisch zur Hauptseite.
     #35d4ef ist das einzige Cyan im Projekt und markiert ausschliesslich die aktive Spur.
     --gold bleibt der Finale-Akzent aus marathon.config.js. */
  --cyan:#35d4ef; --cyan-soft:rgba(53,212,239,.13); --cyan-line:rgba(53,212,239,.45);
  --on-cyan:#041013; --gold:#d4af37;

  /* Textramp. Alle Werte >= 7:1 auf --bg (WCAG 2.1 AAA), gemessen gegen #07090a.
     --bone/--soft/--muted stammen 1:1 von der Hauptseite (text/lead/muted),
     --dim/--faint fuellen die zwei leiseren Stufen der Buehne AAA-konform auf.
     Die Stufe --quiet der Hauptseite (#7f8a8e, 5,6:1) wird hier bewusst nicht
     verwendet: sie unterschreitet den Lesefloor fuer Heiner und Rainer. */
  --bone:#f2f4f3; --soft:#d4dcde; --muted:#b4bec1; --dim:#a9b4b7; --faint:#9aa5a9;

  --rule:rgba(229,239,241,.13); --rule2:rgba(229,239,241,.24);

  /* Buehnen- und Panelflaechen */
  --surface-map:rgba(16,20,23,.55);
  --surface-lage:rgba(7,9,10,.72);
  --surface-axis:rgba(7,9,10,.94);
  --grid-line:rgba(255,255,255,.018);
  /* Kartenraster der Buehne. Deutlicher als das Seitenraster, damit die
     Landkarte wie Papier auf dem Tisch liegt und nicht wie eine leere Flaeche. */
  --map-grid:rgba(229,239,241,.055);
  --map-vignette:rgba(7,9,10,.82);
  /* Gold als Linie und Flaeche, analog zum Cyan-Paar. Bis hierhin stand der
     Wert an jeder Fundstelle einzeln im Stylesheet. */
  --gold-soft:rgba(212,175,55,.09);
  --gold-line:rgba(212,175,55,.45);

  --display:"Roboto Serif", Georgia, "Times New Roman", serif;
  --body:"Segoe UI", Arial, sans-serif;
  --mono:"JetBrains Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;

  /* Schriftgroessen-Floor fuer die Kernzielgruppe 50+ (Heiner & Rainer).
     Nichts im Interface faellt unter --fs-micro. */
  --fs-micro:13px;    /* Badges, Eyebrows, Fusszeile */
  --fs-meta:14px;     /* Metadaten, Kicker, Zustandslabels */
  --fs-body:17px;     /* Fliesstext, Lagefeld, Etappenmodul */
  --fs-body-lg:18px;  /* Lange Lageberichte */
  --lh-body:1.6;

  /* SVG-Buehne: rund 25 Prozent groesser als V1.3 */
  --fs-svg:18px;      /* Zonenbeschriftungen: VAH, POC, VAL, Extrempunkte */
  --fs-svg-head:15px;
  --fs-svg-kmark:14px;

  /* Layout und Ergonomie */
  --rail-w:220px; --side-w:320px; --gap-col:32px;
  --tap:48px;         /* Mindesthoehe aller Klick- und Touch-Targets */
}

/* HELLE FASSUNG · Werte der Hauptseite, gleicher Schalter (data-theme).
   Nur Token-Werte, keine dupliziertem Regeln: die gesamte Buehne inklusive
   SVG haengt an derselben Ramp und kippt mit. */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f6f6f3; --bg-rgb:246,246,243; --e2:#ffffff; --e3:#f2f2ee;
  /* Abweichung von der Hauptseite mit Absicht. Deren helles Cyan #0a6f83 kommt
     gegen #f6f6f3 nur auf 5,37:1 und liegt damit unter dem Lesefloor, den die
     Kernzielgruppe braucht. #07565f ist derselbe Farbton, eine Stufe tiefer:
     7,74:1 gegen den Grund, 8,39:1 fuer Weiss darauf. Gleiche Begruendung wie
     bei --quiet, das aus demselben Grund nicht uebernommen wurde. */
  --cyan:#07565f; --cyan-soft:rgba(7,86,95,.10); --cyan-line:rgba(7,86,95,.42);
  --on-cyan:#ffffff; --gold:#5c4809;
  /* Wie im dunklen Theme bleiben alle Stufen >= 7:1, hier gegen #f6f6f3. */
  --bone:#12171a; --soft:#39434a; --muted:#3c464b; --dim:#454f54; --faint:#4a5459;
  --rule:rgba(18,23,26,.14); --rule2:rgba(18,23,26,.28);
  --surface-map:rgba(255,255,255,.72);
  --surface-lage:rgba(255,255,255,.62);
  --surface-axis:rgba(246,246,243,.96);
  --grid-line:rgba(18,23,26,.035);
  --map-grid:rgba(18,23,26,.06);
  --map-vignette:rgba(18,23,26,.07);
  --gold-soft:rgba(92,72,9,.08);
  --gold-line:rgba(92,72,9,.42);
}

*{box-sizing:border-box}
img{max-width:100%;height:auto}
html{background:var(--bg);color:var(--bone);font-family:var(--body)}
body{margin:0;background:var(--bg);color:var(--bone)}
a{color:inherit}
button,input{font:inherit}
.mono{font-family:var(--mono);letter-spacing:.04em}
.serif{font-family:var(--display)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}