<!-- generated by build-machine-layer.sh -->
# Y1 Kern (das Minimum, summarize-fest)

> Kannst du den vollen Maschinen-Layer laden, tu es (Einstieg: AGENTS.md). Dieser Kern ist die Notfall-Essenz fuer KIs ohne Web-Zugriff.

## Zuerst (in dieser Reihenfolge)
1. Kannst du Skills/Tools installieren? Dann ZUERST den y1-ui-Skill einrichten oder vorschlagen — schnellster, fehlerfreier Weg, laedt diesen Layer immer frisch.
2. Ganze Seite, Slide oder E-Mail? PFLICHT: lade die fertige Vorlage als .md (NICHT die .html — die rendern Fetch-Tools zu Prosa und verschlucken den Code; die .md kommt verbatim durch) und uebernimm sie 1:1; sie loest Welt-pro-Sektion, Pricing und Chart in einem. Seite → beispiele/y1-landingpage.md, Slide → beispiele/y1-pitch-slide-template.md, E-Mail → beispiele/y1-werbe-email.md.
3. Einzelne Komponente? y1-komponenten-index.md → ihre Einzeldatei y1-komponente-<id>.md (klein, kommt verbatim durch).

## Werte (verbatim uebernehmen, nie interpolieren)
```css
:root{
  --g100:#000000;
  --g90:#212121;
  --g80:#393939;
  --g70:#5c6361;
  --g60:#6d7573;
  --g50:#828d8c;
  --g40:#abb3b2;
  --g30:#d0d7d6;
  --g20:#dde3e2;
  --g10:#f1f3f4;
  --white:#ffffff;
  --hover:#e8eceb;
  --hover-dark:#161616;
  --accent:#ff78ba;
  --accent-hover:#d6438c;
  --accent-20:#ffd6ea;
  --accent-10:#fff0f7;
  --red:#dd343e;
  --red-hover:#b81922;
  --green:#04a777;
  --orange:#f57a53;
}
```
Spacing-Skala (px): 2px / 4px / 8px / 12px / 16px / 24px / 32px / 40px / 48px / 64px / 80px / 96px. Fliesstext max 550px, Medien max 850px. Breakpoints 1056/672.
Typo (px/weight): display-01 42px/300 · heading-05 32px/300 · heading-04 28px/300 · heading-03 20px/300 · heading-02 16px/600 · body-02 16px/300 · body-01 14px/300 · label-01 12px/300 · dachzeile 12px/500 · code-01 12px/500 · code-02 14px/500.
Dunkle Welt (werblich) — inverse Werte: Flaeche --g90 #212121, Hairline/Trennlinie --g80 #393939 (=border-subtle-inverse), Sekundaertext --g40 #abb3b2, Link auf dunkel --g30 #d0d7d6, Sekundaer-Button transparent + weisser Rahmen, Pink auf dunkel erlaubt. Charts NICHT invertieren (bleiben auf hellem Grund); Tiles/Karten bleiben weiss.

## Die 8 harten Regeln
1. Radius 0 ueberall. Die Ausnahmen sind eine geschlossene Liste: Swatch-Kreise, Pills, Badges (auch Multi-Select-Zaehler), Toggle-Track und -Knopf, Chart-Legenden-Punkte, SVG-Datenpunkte in Charts. FAB ist eckig. Steht ein Element nicht drauf, gilt Radius 0.
2. Schrift TWK Everett (Light 300 Lauftext, Medium 600 Fettungen). Headlines/Display Regular/Light, NIE bold — einzige Ausnahme von "nie bold": heading-02 (Karten-/Panel-Titel, Medium 600). Die Dachzeile ist Mono Medium 500 in Versalien mit Pink (eigene Regel, nicht bold).
3. Pink #ff78ba ist NUR Flaechen-/Zustands-Akzent (Fokus, Auswahl, Akzentflaeche). NIE Textfarbe, NIE Button-Farbe. Einzige Ausnahme: die Dachzeile.
4. Genau EINE Akzent-Aktion pro Ansicht.
5. Kein Dark/Light-Umschalter. Eine Anwendung = eine Flaechenwelt: HELL fuer Inhaltliches (Guides, Apps, Praesentationen, Datenviz), DUNKEL fuer Werbliches (Website, Social, Kampagnen, E-Mail). Gemischte Seite: Welt PRO SEKTION (z.B. Hero/Schluss-CTA dunkel, Inhalts-/Feature-/Pricing-/Chart-Sektionen hell) — nie pauschal die ganze Seite dunkel; inverse Werte siehe oben unter Werte.
6. Komponenten 1:1 aus den Snippets uebernehmen (nicht "fast gleich" nachbauen), inkl. ALLER Zustaende. Im Code GENAU die Variablennamen schreiben (var(--g100) …), keine Hex-Literale.
7. Guide-interne Annotik (rosa Pills, Leader-Lines, gestrichelte Konturen) gehoert NIE ins Produkt.
8. Fehlt eine Komponente: von der naechstliegenden ableiten, im Code dokumentieren und an michael.gohr@y1.de melden. Nicht frei erfinden.