/*
 * Die Luftnummer – Farben und Schriften.
 *
 * Die Werte kommen aus der Palette von Fall 01 (public/games/hardcover/css/tokens.css) und heißen hier --ln-*,
 * damit dieser Ordner allein steht. Kein Wert wird im Stilblatt darunter hartkodiert.
 *
 * Die Schriften liegen selbst gehostet unter schriften/ (SIL Open Font License 1.1, Lizenztext daneben) und
 * enthalten ä, ö, ü und ß; es sind dieselben Dateien, die Fall 01 ausliefert.
 */

/* latin-ext */
@font-face {
  font-family: 'Alfa Slab One';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/alfa-slab-one-400-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'Alfa Slab One';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/alfa-slab-one-400-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'Archivo Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/archivo-narrow-400-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'Archivo Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/archivo-narrow-400-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'Archivo Narrow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../schriften/archivo-narrow-600-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'Archivo Narrow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../schriften/archivo-narrow-600-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/caveat-400-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/caveat-400-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../schriften/caveat-600-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../schriften/caveat-600-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/ibm-plex-mono-400-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/ibm-plex-mono-400-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../schriften/ibm-plex-mono-500-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../schriften/ibm-plex-mono-500-latin.woff2) format('woff2');
  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;
}

/* latin-ext */
@font-face {
  font-family: 'Special Elite';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/special-elite-400-latin-ext.woff2) format('woff2');
  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;
}

/* latin */
@font-face {
  font-family: 'Special Elite';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../schriften/special-elite-400-latin.woff2) format('woff2');
  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;
}

:root {
    --ln-ink: #0b0b0d;
    --ln-ink-2: #17171c;
    --ln-ink-3: #24242b;
    --ln-russ: #8a8a94;
    --ln-papier: #e8dcc0;
    --ln-papier-alt: #cbb894;
    --ln-papier-dim: #a2957c;
    --ln-comic-papier: #ede2c8;
    --ln-tinte-notiz: rgba(11, 11, 13, 0.78);
    --ln-signal: #d6241c;
    --ln-signal-blech: #e95d57;
    --ln-signal-tief: #8e1410;
    --ln-senf: #d9a521;
    --ln-signal-senf: #3b0e09;
    --ln-gold: #b4893a;
    --ln-gruen: #4fe0c4;
    --ln-graphit: #141416;
    --ln-graphit-kante: #6e6e72;
    --ln-schleier: rgba(11, 11, 13, 0.92);

    /* Die vier Rollenfarben: Fläche und Kante. Schrift auf Blech nimmt die -blech-Fassung. */
    --ln-ruth: #3c6e9b;
    --ln-ansgar: #c4453b;
    --ln-selma: #c9a227;
    --ln-nuri: #2fa37e;
    --ln-ruth-blech: #5a90bf;
    --ln-ansgar-blech: #d16f67;
    --ln-selma-blech: #c9a227;
    --ln-nuri-blech: #2fa37e;

    --ln-font-display: 'Alfa Slab One', 'Rockwell', 'Bookman Old Style', Georgia, serif;
    --ln-font-letter: 'Caveat', 'Bradley Hand', cursive;
    --ln-font-doc: 'Special Elite', 'Courier New', monospace;
    --ln-font-mono: 'IBM Plex Mono', Consolas, ui-monospace, monospace;
    --ln-font-amt: 'Archivo Narrow', 'Arial Narrow', Arial, sans-serif;
    --ln-font-comic: Georgia, Times, serif;
    --ln-sperrung: 0.08em;

    --ln-gap-1: 0.35rem;
    --ln-gap-2: 0.7rem;
    --ln-gap-3: 1.15rem;
    --ln-gap-4: 1.9rem;
    --ln-gap-5: 3rem;
    --ln-rand: 3px;
    --ln-rand-fett: 5px;
    --ln-schatten: 4px 4px 0 var(--ln-ink);
    --ln-schnell: 90ms linear;
    --ln-griff: 44px;
    /*
     * DIE BUEHNE DES HAUSES UND KEINE EIGENE. Hier stand 88rem, und auf einem Schirm von 1920 Pixeln stand das Zimmer
     * 196 Pixel je Seite innerhalb von Marke und Codeknopf — ein Blatt, schmaler als sein Rahmen. Es nimmt jetzt
     * dieselbe Zahl wie Kopf und Fuss (`--haus-shell`) und dieselbe Seitenluft (`.ln-app`); die Zahl steht damit an
     * einer Stelle, und wer sie anfasst, fasst alle Zimmer an (CLAUDE.md, Abschnitt 7, „Drei Breiten").
     */
    --ln-breite: var(--haus-shell, 1800px);

    /* Die Bühne. Auf dem Telefon ist die Kulisse breiter als das Fenster und scrollt mit der Figur; auf dem
       Schreibtisch füllt sie die Breite, ohne das Pult unter den Falz zu schieben.

       Auf dem Laptop ist die Höhe der Engpass. Über der Bühne stehen Kopf des Hauses, Spielkopf und Reiter
       (195 Pixel), darunter Satzzeile, zwei Zeilen Ergebnis und die Verben (153); `--ln-buehne-rest` ist die
       Summe mit etwas Luft. Ohne sie lagen die Verben auf 1366 × 657 111 Pixel unter dem Falz, und gespielt wurde
       in der Knopfliste statt in der Kulisse. Schmaler wird dabei nichts: Wo die Höhe bremst, hatte die Kulisse
       schon schwarze Ränder. `vh` und nicht `dvh`: Ein Browser ohne `dvh` verwürfe die ganze Höhe. */
    --ln-buehne-rest: 360px;
    --ln-buehne-h: clamp(210px, min(64vh, calc(100vh - var(--ln-buehne-rest)), calc((100vw - 2 * var(--haus-luft, 16px) - 6px) / 2.333)), 680px);

    --ln-halbton: radial-gradient(rgba(11, 11, 13, 0.16) 1px, transparent 1.6px);
    --ln-halbton-groesse: 6px 6px;
    --ln-korn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.12'/%3E%3C/svg%3E");
}

/*
 * Zwischen 48 und 60rem steht der Kopf des Hauses in diesem Zimmer zweizeilig (106 statt 73 Pixel): Die Reihenzeile
 * teilt sich die Leiste mit der Navigation. Darueber steht er einzeilig, darunter liegt die Navigation im Menue.
 */
@media (min-width: 48rem) and (max-width: 59.99rem) {
    :root {
        --ln-buehne-rest: 392px;
    }
}
