/*  Gedeelde stijltokens voor de live schermen: ringmeester, LiveCentrum en jury.

    WAAROM DIT BESTAAT
    De vijf live schermen hadden hun stijl elk volledig in de .cshtml staan — samen ruim 2.000 regels
    CSS — en de twee jury-schermen hadden daarin een identiek tokenblok: 20 van de 23 eigenschappen
    letterlijk hetzelfde, tot de hoofdletters in #B2C0A4 toe. De drie ringmeester/LiveCentrum-schermen
    hadden juist géén tokens en zetten dezelfde merkkleuren als losse hexwaarden neer. Over alle vijf
    samen stonden er 138 hexwaarden in 56 varianten.

    Dit bestand is de doorsnede: één plek waar de kleuren en de radii staan, zodat een merkkleur die
    verschuift op één regel verschuift.

    VERHOUDING TOT common.css
    common.css heeft al een :root met dezelfde merkkleuren onder andere namen — --tile (#012c18),
    --beige (#e6e5d5), --light-bg (#f9f1e6), --text, --white. Die namen zijn hier niet overgenomen en
    de oude niet vervangen: common.css laadt op élk verenigingsscherm en die namen zitten daar door de
    hele stylesheet. De live schermen gebruiken de ink/sand/bone-namen die de jury-schermen al hadden,
    zodat er niet halverwege een derde vocabulaire ontstaat. Wie ze ooit samenvoegt: het gaat om
    dezelfde kleuren, alleen anders genoemd.

    De waarden hieronder zijn overgenomen uit de jury-schermen zoals ze waren — dit bestand verandert
    geen enkele kleur, het haalt ze alleen uit vijf views naar één. */

:root {
    /* ── Merkkleuren ── */
    --ink: #012c18;
    --ink-2: #034d2a;
    --sage: #B2C0A4;
    --sage-line: #d7ddc9;
    --sand: #f9f1e6;
    --bone: #e6e5d5;
    --paper: #ffffff;

    /* ── Signaalkleuren ── */
    --amber: #f39c12;
    --amber-tint: #fdf1dd;
    --good: #27ae60;
    --good-tint: #f0fdf4;
    --bad: #c0392b;
    --bad-tint: #fdecea;

    /* Alleen het scoreformulier gebruikt deze; ze staan hier omdat een podiumkleur nergens anders
       thuishoort dan bij de rest van het palet. */
    --gold: #e6a800;
    --silver: #b0b0b0;
    --bronze: #c8722a;

    /* ── Tekst op lagere sterkte ── */
    --ink-soft: #666;
    --ink-faint: #999;

    /* ── Vormgeving ── */
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 16px;
    --r-xl: 22px;
    --font-mono: 'Courier New', monospace;
}

/*  Het hidden-attribuut weer laten werken.

    De browser zet [hidden] op display:none, maar dat staat in het UA-stijlblad en verliest daarmee
    van élke regel die hier of in een schermstijlblad een display zet — ongeacht specificiteit, want
    auteursstijl gaat vóór browserstijl. Een blok als .leeg-melding { display: flex } maakt het
    hidden-attribuut op dat element dus stil zinloos: de JS zet el.hidden = true en er verandert
    niets.

    Op het scorebord viel dat niet op omdat de verborgen melding leeg is — hij nam alleen ruimte in
    het raster in. Bij een overlay als de pistekeuze zou hetzelfde het hele scherm afdekken.

    Vandaar één regel op de gedeelde plek in plaats van een display:none in elk van de blokken die
    het toevallig nodig hebben. Met !important, omdat het anders precies dezelfde strijd verliest. */
[hidden] { display: none !important; }