/* ===================================================================
   Webris - eigene Farbwelt
   Baut auf game.css auf. Hier stehen nur die Tokens von Webris und
   die paar Regeln, die es sonst nirgends gibt.

   Rot ist die Leitfarbe: tiefes Rotschwarz als Flaeche, ein hartes
   Rot als Akzent, Cyan als Gegenspieler.

   Copyright (C) 2025 Han Technologies
   Lizenz: GPL-3.0-or-later, siehe LICENSE.txt
   =================================================================== */

[data-game='webris'] {
    --bg: #0c0608;
    --surface-0: #110a0d;
    --surface-1: #170e11;
    --surface-2: #1f141a;
    --surface-glass: rgba(255, 255, 255, 0.04);
    --bg-texture: none;
    --tint: rgba(255, 43, 43, 0.14);

    --ink: #f6eaea;
    --ink-dim: #a99095;
    --ink-faint: #74595f;
    --line: rgba(255, 255, 255, 0.1);
    --line-strong: rgba(255, 90, 90, 0.4);

    --accent-base: #ff2b2b;
    --accent-soft: #ff8080;
    --accent-ink-base: #1a0508;
    --accent-2: #4fe6ff;

    --ok: #5ee08a;
    --warn: #ffc94a;
    --bad: #ff5f6d;

    --font-display: 'Quantum', system-ui, Impact, sans-serif;
    --font-ui: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --font-hand: 'Quantum', system-ui, sans-serif;

    --radius: 12px;
    --radius-sm: 8px;
    --frame-style: solid;
    --tilt-a: 0deg;
    --tilt-b: 0deg;
    --tilt-c: 0deg;

    /* Brett */
    --board-bg: #0a0507;

    /* Sieben Steine, sieben unterscheidbare Farben. Der I-Stein
       fuehrt in Rot, die uebrigen weichen bewusst davon ab. */
    --block-0: transparent;
    --block-1: #ff4d4d; /* I */
    --block-2: #ffc94a; /* O */
    --block-3: #c77dff; /* T */
    --block-4: #5ee08a; /* S */
    --block-5: #ff8a3d; /* Z */
    --block-6: #4c8dff; /* J */
    --block-7: #35e0c8; /* L */
    --block-outline: rgba(10, 5, 7, 0.85);
    --grid-line: rgba(255, 255, 255, 0.05);
    --ghost: rgba(255, 128, 128, 0.2);
    --garbage: #4a3a40;
}

[data-game='webris'] .board {
    box-shadow:
        0 0 0 1px rgba(255, 43, 43, 0.28),
        0 0 46px -12px rgba(255, 43, 43, 0.6),
        0 18px 40px rgba(0, 0, 0, 0.7);
}

[data-game='webris'] .gbar-title b {
    text-shadow: 0 0 18px rgba(255, 43, 43, 0.6);
}