/*
 * Prolog · Hürde 1: Der Sendemast.
 *
 * Nur die Blöcke DIESER Station. Alles, was mehr als eine Hürde braucht –
 * Bank, Nonius, Hebel, Tafel, Terminal, Blatt, Werkzeugreiter – steht in
 * `css/game.css` und wird hier nicht noch einmal gebaut.
 *
 * PRÄFIX `.wr-sendemast__`. Er ist in diesem Haus einmal vergeben; ein zweiter
 * Block desselben Namens erbte fremde `display`-Regeln, und genau daran ist in
 * Fall 01 die Klappe gestorben. Farben ausschließlich über `--wr-*` und die
 * lokalen `--schirm-*` / `--role-*`, die `.station` je Rolle setzt.
 */

/* ================================================= SCHRAUBER · MASTFUSS === */

/* Ein Kasten wie die Bänke daneben. Ohne ihn stünden vier Geräte ohne Grenze
   untereinander, und was zu welcher Skala gehört, stünde nirgends. */
.wr-sendemast__geraet,
.wr-sendemast__platte,
.wr-sendemast__klemmbrett {
    padding: var(--wr-gap-2);
    background: var(--wr-blech);
    border: var(--wr-border) solid var(--wr-ink-3);
}

.wr-sendemast__geraet {
    display: grid;
    justify-items: start;
    gap: var(--wr-gap-1);
}

.wr-sendemast__messwerk {
    width: 100%;
    max-width: 12rem;
    height: auto;
    color: var(--wr-paper-dim);
}

/*
 * Die Ankerplatte: gegossenes Blech, eine Zeile, kein Wort.
 *
 * GESPIEGELT WIRD NICHTS, und das ist der erste Handgriff des ganzen Abends.
 * Der Server liefert die Zeichen bereits in umgekehrter Reihenfolge – damit
 * steht die Mastnummer nirgends im Klartext im Dokument, und kein Screenreader
 * liest sie vor. Die Glyphen zusätzlich zu spiegeln hieße, Ruth zweimal
 * arbeiten zu lassen: einmal rückwärts lesen und einmal jedes Zeichen im Kopf
 * zurückdrehen.
 *
 * `hyphens: none` neben `overflow-wrap: anywhere`, weil hier eine Zahl steht,
 * die über den Tisch gerufen wird – ein Trennstrich mitten darin ist eine
 * Falle, und einen echten trägt sie schon.
 */
.wr-sendemast__platte {
    display: grid;
    justify-items: start;
    gap: var(--wr-gap-1);
}

.wr-sendemast__guss {
    display: inline-block;
    padding: 0.3em 0.6em;
    font-family: var(--wr-font-mono);
    font-size: 1.6rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: var(--wr-tracking-mono);
    color: var(--wr-paper-aged);
    background: var(--wr-ink);
    border: 2px solid var(--wr-stahl);
    overflow-wrap: anywhere;
    hyphens: none;
}

.wr-sendemast__guss i {
    display: inline-block;
    font-style: normal;
}

/* --- Das Klemmbrett ------------------------------------------------------- */

.wr-sendemast__klemmbrett {
    display: grid;
    justify-items: start;
    gap: var(--wr-gap-1);
}

/*
 * Der Stand steht als WORT im Blech und nicht nur als Farbe: Keine Farbe ist in
 * diesem Haus der einzige Informationsträger. Was hier steht, ist ausschließlich
 * OB eine Karte hängt – welche, weiß der Schmierfink.
 */
.wr-sendemast__blende {
    padding: 0.35rem 0.6rem;
    font-family: var(--wr-font-amt);
    font-size: 0.86rem;
    letter-spacing: var(--wr-tracking-amt);
    color: var(--wr-paper-dim);
    background: var(--wr-feld-dunkel);
}

.wr-sendemast__klemmbrett[data-steckt='1'] .wr-sendemast__blende {
    color: var(--wr-phosphor);
}

/* ================================================= FÄLSCHER · HANDLAMPE === */

.wr-sendemast__lampe {
    display: grid;
    gap: var(--wr-gap-3);
}

.wr-sendemast__felder {
    display: grid;
    gap: var(--wr-gap-2);
    padding: var(--wr-gap-2);
    border: var(--wr-border) solid var(--schirm-kante);
}

/*
 * Drei Felder nebeneinander, jedes mindestens daumenbreit. Eine absolute Breite
 * wäre auf einem Telefon eine Lüge: Was von 375 Pixeln nach Seitenrand,
 * Stationsrahmen und Kastenkante übrig bleibt, sind keine drei mal hundert.
 */
.wr-sendemast__reihe {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
    gap: var(--wr-gap-2);
}

.wr-sendemast__feld {
    font-variant-numeric: tabular-nums;
    hyphens: none;
}

.wr-sendemast__feld[aria-pressed='true'] {
    color: var(--wr-ink);
    background: var(--role-licht);
    border-color: var(--wr-ink);
}

/* Ohne abgeworfenen Feldstrom ist der ganze Kasten ein Kasten Blech. Der
   Zustand steht als Attribut da und nicht nur als Farbe – die gesperrten
   Felder sagen es zusätzlich in Worten. */
.wr-sendemast__lampe[data-strom='0'] .leuchtkasten__sicht {
    color: var(--wr-stahl);
}

/* --- Der Befundbogen ------------------------------------------------------ */

.wr-sendemast__befund,
.wr-sendemast__kartenfach {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--wr-gap-1) var(--wr-gap-2);
    align-items: end;
    padding: var(--wr-gap-2);
    border: var(--wr-border) solid var(--schirm-kante);
}

.wr-sendemast__befund label,
.wr-sendemast__kartenfach label {
    grid-column: 1 / -1;
    margin: 0;
    font-family: var(--wr-font-amt);
    font-size: 0.72rem;
    letter-spacing: var(--wr-tracking-amt);
    text-transform: uppercase;
    color: var(--schirm-still);
}

/* ============================================== SCHMIERFINK · HANDBUCH === */

.wr-sendemast__kartenfach {
    margin-top: var(--wr-gap-3);
}

.wr-sendemast__stand {
    grid-column: 1 / -1;
    justify-self: start;
    font-family: var(--wr-font-amt);
    font-size: 0.72rem;
    letter-spacing: var(--wr-tracking-amt);
    text-transform: uppercase;
    color: var(--schirm-still);
}

/*
 * Der Stempel liegt unter der Zeile und würde sonst von ihr überstimmt:
 * `.wr-sendemast__stand` wiegt schwerer als `.stamp--gold`, und ohne diese
 * Zeile stünde der Goldstempel in der stillen Schrift des Bogens.
 */
.wr-sendemast__stand.stamp--gold {
    font-size: 0.68rem;
    color: var(--wr-gold);
}