/*
 * Motyw "Tafla" dla natywnego DOMjudge 9.0.x. Opis, ograniczenia i kruchość: src/domserver/theme/README.md
 *
 * ŹRÓDŁO WYGLĄDU: tokeny i materiał design systemu Tafla (tafla-tokens.css, material.css).
 * Jasny motyw domyślnie, ciemny
 * przy prefers-color-scheme: dark (ustawienie systemu). Wartości przepisane 1:1;
 * mapowanie na klasy Bootstrapa/DOMjudge i tokeny [AMUR] są nasze.
 *
 * ZAKRES: DOMjudge ładuje pliki z css/custom/ na KAŻDEJ stronie (base.html.twig),
 * także w panelu jury, a <body> nie ma klasy typu strony. Jedynym wyróżnikiem
 * panelu jury jest dodatkowy arkusz style_jury.css w <head>, dlatego każda reguła
 * zaczyna się od  :root:not(:has(link[href*="style_jury.css"]))  (= strony
 * uczestnika, publiczne i logowanie). Przeglądarka bez :has() odrzuci reguły
 * i pokaże domyślny DOMjudge (bezpieczna porażka).
 *
 * KRUCHOŚĆ: selektory oznaczone [DOM] zależą od klas/ID z szablonów Twig
 * i style_domjudge.css DOMjudge, a nie od Bootstrapa, więc mogą się zepsuć po aktualizacji.
 */

/* ============ 0. Fonty Tafli offline (sieć konkursowa nie ma internetu) ============ */
/* Figtree i Geist Mono, wersje zmienne (wght) z @fontsource-variable 5.3.0, licencja SIL OFL 1.1
   (fonts/OFL-*.txt). Tylko zestawy latin + latin-ext (polskie znaki). Na macOS wygrywa SF Pro
   (wcześniej w stosie --font-ui), na Windows: Figtree zamiast Segoe UI. */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url(fonts/figtree-latin-ext-wght-normal.woff2) format('woff2-variations');
  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;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url(fonts/figtree-latin-wght-normal.woff2) format('woff2-variations');
  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;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(fonts/geist-mono-latin-ext-wght-normal.woff2) format('woff2-variations');
  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;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(fonts/geist-mono-latin-wght-normal.woff2) format('woff2-variations');
  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;
}

/* ============ 1. Tokeny Tafli + mapowanie na Bootstrap 5.3 ============ */
/* Wartości z tafla-tokens.css (design system Urwis Tafla): jasny motyw domyślnie,
   ciemny przy prefers-color-scheme: dark. Tokeny oznaczone [AMUR] nie istnieją w Tafli:
   są pochodne, bo kolory semantyczne Tafli nie trzymają 4,5:1 na szkle (audyt kontrastu). */

/* --- wspólne dla obu motywów --- */
:root:not(:has(link[href*="style_jury.css"])) {
  --font-ui: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Figtree', system-ui, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Figtree', system-ui, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', 'Geist Mono', Consolas, monospace;
  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs-md: 13.5px;
  --fs-lg: 15px;
  --fs-xl: 25px;
  --fs-2xl: 30px;
  --fw-btn: 500;
  --fw-strong: 600;
  --fw-card: 600;
  --fw-display: 700;
  --display-ls: -0.03em;
  --wordmark-fs: 15px;
  --blur: blur(28px) saturate(185%);
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 26px;
  --r-card: 16px;
  --r-pill: 999px;
  --r-sk: 8px;
  --r-row: 14px;      /* wzorzec .ws z Tafli: wiersz rankingu */
  --r-badge-sq: 7px;  /* wzorzec .pk z Tafli: kafelek litery zadania */
  --r-sheet: 30px;    /* wzorzec .detail-panel z Tafli: arkusz logowania */
  --ring: 0 0 0 3.5px color-mix(in srgb, var(--focus) 48%, transparent);
  --ring-soft: 0 0 0 3.5px color-mix(in srgb, var(--focus) 30%, transparent);
  /* [AMUR] wypełnienie akcentem pod białym tekstem: #0A84FF z bielą ma 3,65:1, 80% akcentu + czerń ≥ 5,3:1 */
  --accent-fill: color-mix(in srgb, var(--accent) 80%, #000);
  --accent-fill-hover: color-mix(in srgb, var(--accent) 72%, #000);  /* hover przyciemnia, żeby nie tracić kontrastu */

  /* Bootstrap 5.3: komponenty czytają kolory z tych zmiennych */
  --bs-body-bg: var(--bg);
  --bs-body-color: var(--text);
  --bs-body-font-family: var(--font-ui);
  --bs-secondary-color: var(--text-2);
  --bs-secondary-bg: var(--solid);
  --bs-tertiary-bg: var(--solid);
  --bs-heading-color: var(--text);
  --bs-border-color: var(--line);
  --bs-border-color-translucent: var(--line);
  --bs-link-color: var(--accent-text);
  --bs-primary: var(--accent);
  --bs-code-color: var(--text);
  --bs-focus-ring-color: color-mix(in srgb, var(--focus) 48%, transparent);

  /* [DOM] zmienne z style_domjudge.css */
  --background-color: transparent;
  --text-color: var(--text);

  /* tapeta na <html>, żeby sięgała do dołu okna także na krótkich stronach */
  min-height: 100%;
  background: var(--wall);
  background-color: var(--bg);
  background-attachment: fixed;
}

/* --- jasny (domyślny), tafla-tokens.css:4-61 --- */
:root:not(:has(link[href*="style_jury.css"])) {
  color-scheme: light;
  scrollbar-color: rgba(0, 0, 0, .28) transparent;
  --wall:
    radial-gradient(42% 58% at 6% 10%, rgba(110, 185, 255, .78), transparent 70%),
    radial-gradient(40% 52% at 94% 6%, rgba(196, 156, 255, .66), transparent 70%),
    radial-gradient(46% 60% at 88% 96%, rgba(255, 176, 146, .62), transparent 70%),
    radial-gradient(42% 56% at 14% 96%, rgba(128, 228, 196, .58), transparent 70%),
    linear-gradient(150deg, #E7EEF9 0%, #F4EEF8 100%);
  --glass: rgba(255, 255, 255, .52);
  --glass-edge: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(255, 255, 255, .25), 0 1px 1px rgba(20, 30, 60, .04), 0 12px 34px rgba(20, 30, 60, .10);
  --rim: linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(255, 255, 255, .22) 32%, rgba(255, 255, 255, .04) 58%, rgba(255, 255, 255, .62));
  --hi: rgba(255, 255, 255, .92);
  --hi-soft: rgba(255, 255, 255, .55);
  --btn-glass: rgba(255, 255, 255, .62);
  --btn-glass-rim: rgba(255, 255, 255, .85);
  --panel-strong: rgba(255, 255, 255, .80);
  --solid: #F6F7F9;
  --solid-2: #FFFFFF;
  --bg: #EDF1F8;
  --panel: rgba(255, 255, 255, .60);
  --raised: rgba(255, 255, 255, .78);
  --field: rgba(255, 255, 255, .66);
  --soft: rgba(0, 0, 0, .05);
  --soft-2: rgba(0, 0, 0, .08);
  --line: rgba(0, 0, 0, .08);
  --line-2: rgba(0, 0, 0, .12);
  --line-3: rgba(0, 0, 0, .26);
  --row-line: rgba(0, 0, 0, .05);
  --row-hover: rgba(255, 255, 255, .55);
  --row-sel: rgba(0, 122, 255, .11);
  --head-bg: rgba(255, 255, 255, .62);
  --text: #1D1D1F;
  --text-2: #46464B;
  --text-3: #6C6C72;
  --accent: #007AFF;
  --accent-hover: #1A88FF;
  --accent-fg: #FFFFFF;
  --accent-soft: rgba(0, 122, 255, .12);
  --accent-soft-2: rgba(0, 122, 255, .2);
  --accent-text: #0062CC;
  --focus: #007AFF;
  --danger: #E0352B;
  --danger-soft: rgba(255, 59, 48, .12);
  --warning: #AD5B00;
  --warning-soft: rgba(255, 149, 0, .14);   /* [AMUR] Tafla: .16; przy .14 --warning-text ma ≥ 4,7:1 */
  --success: #248A3D;
  --side-active: rgba(255, 255, 255, .82);
  --top-bg: rgba(255, 255, 255, .52);
  --pop: rgba(255, 255, 255, .72);
  --code-bg: rgba(0, 0, 0, .05);
  --card-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 1px 2px rgba(20, 30, 60, .06), 0 4px 14px rgba(20, 30, 60, .06);
  --card-shadow-hover: inset 0 1px 0 #fff, 0 2px 4px rgba(20, 30, 60, .07), 0 12px 28px rgba(20, 30, 60, .12);
  --shadow-2: 0 2px 6px rgba(20, 30, 60, .06), 0 14px 40px rgba(20, 30, 60, .16);
  --shadow-3: 0 4px 12px rgba(20, 30, 60, .08), 0 30px 80px rgba(20, 30, 60, .24);
  /* [AMUR] tekst semantyczny na szkle i na *-soft (≥ 4,7:1 na każdej plamie tapety) */
  --success-text: #1A632C;
  --danger-text: #A1261F;
  --warning-text: #8A4900;
  --success-soft: rgba(36, 138, 61, .14);
  /* [AMUR] pełne wypełnienie „pierwsze rozwiązanie” i jego tekst */
  --success-solid: #1A632C;
  --success-solid-fg: #FFFFFF;
  /* [AMUR] nieprzezroczysty odpowiednik --glass (zanikanie długiej nazwy drużyny) */
  --glass-opaque: #F3F5FA;
  /* [AMUR] strzałka pól wyboru w kolorze tekstu motywu */
  --select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%231d1d1f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  /* [AMUR] ikona zamknięcia okien jest czarna, odwracamy ją tylko w ciemnym */
  --ink-filter: none;
  /* [AMUR] znak koła w pasku: na jasnym tle niebieska wersja logo (5,3:1; morska miała 2,1:1) */
  --brand-mark: url(brand/kni-mark-jasny.png);
  --brand-logo: url(brand/kni-logo-jasny.png);
  --bs-body-bg-rgb: 237, 241, 248;
  --bs-body-color-rgb: 29, 29, 31;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-link-color-rgb: 0, 98, 204;
  --bs-link-hover-color: #004A99;
  --bs-link-hover-color-rgb: 0, 74, 153;
  --bs-primary-rgb: 0, 122, 255;
}

/* --- ciemny, tafla-tokens.css:63-129: według systemu, chyba że wybrano jasny, albo wymuszony.
   Dwa bloki z tą samą treścią (reguła w @media i poza nią nie łączą się w jeden selektor);
   zmieniając jeden, zmień drugi. data-theme ustawia js/custom/tafla-theme.js. Oba działają
   tylko na ekranie (@media screen): wydruk jest zawsze jasny (sekcja 12). --- */
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(:has(link[href*="style_jury.css"])) {
    color-scheme: dark;
    scrollbar-color: rgba(255, 255, 255, .30) transparent;
    --wall:
      radial-gradient(42% 58% at 6% 10%, rgba(40, 96, 230, .55), transparent 70%),
      radial-gradient(40% 52% at 94% 6%, rgba(132, 64, 224, .46), transparent 70%),
      radial-gradient(46% 60% at 88% 96%, rgba(214, 72, 124, .36), transparent 70%),
      radial-gradient(42% 56% at 14% 96%, rgba(18, 140, 150, .42), transparent 70%),
      linear-gradient(150deg, #06070C 0%, #0B0A13 100%);
    --glass: rgba(40, 42, 52, .46);
    --glass-edge: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -1px 0 rgba(255, 255, 255, .04), 0 14px 44px rgba(0, 0, 0, .45);
    --rim: linear-gradient(145deg, rgba(255, 255, 255, .38), rgba(255, 255, 255, .07) 32%, rgba(255, 255, 255, .02) 58%, rgba(255, 255, 255, .2));
    --hi: rgba(255, 255, 255, .16);
    --hi-soft: rgba(255, 255, 255, .06);
    --btn-glass: rgba(255, 255, 255, .09);
    --btn-glass-rim: rgba(255, 255, 255, .14);
    --panel-strong: rgba(32, 34, 42, .84);
    --solid: #1C1D22;
    --solid-2: #26272E;
    --bg: #07080C;
    --panel: rgba(28, 30, 38, .56);
    --raised: rgba(64, 66, 78, .50);
    --field: rgba(255, 255, 255, .07);
    --soft: rgba(255, 255, 255, .07);
    --soft-2: rgba(255, 255, 255, .11);
    --line: rgba(255, 255, 255, .09);
    --line-2: rgba(255, 255, 255, .14);
    --line-3: rgba(255, 255, 255, .30);
    --row-line: rgba(255, 255, 255, .05);
    --row-hover: rgba(255, 255, 255, .05);
    --row-sel: rgba(10, 132, 255, .22);
    --head-bg: rgba(30, 32, 40, .72);
    --text: #F5F5F7;
    --text-2: #C9C9CE;
    --text-3: #9A9AA1;
    --accent: #0A84FF;
    --accent-hover: #3395FF;
    --accent-fg: #FFFFFF;
    --accent-soft: rgba(10, 132, 255, .2);
    --accent-soft-2: rgba(10, 132, 255, .3);
    --accent-text: #6AB4FF;
    --focus: #0A84FF;
    --danger: #FF453A;
    --danger-soft: rgba(255, 69, 58, .16);
    --warning: #FFB340;
    --warning-soft: rgba(255, 159, 10, .18);
    --success: #30D158;
    --side-active: rgba(255, 255, 255, .15);
    --top-bg: rgba(40, 42, 52, .46);
    --pop: rgba(42, 44, 54, .72);
    --code-bg: rgba(255, 255, 255, .08);
    --card-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 4px 16px rgba(0, 0, 0, .28);
    --card-shadow-hover: inset 0 1px 0 rgba(255, 255, 255, .18), 0 14px 32px rgba(0, 0, 0, .45);
    --shadow-2: 0 16px 44px rgba(0, 0, 0, .5);
    --shadow-3: 0 30px 90px rgba(0, 0, 0, .65);
    --success-text: #4DD76F;
    --danger-text: #FF8C84;      /* = --danger-badge-fg z Tafli */
    --warning-text: #FFB340;
    --success-soft: rgba(48, 209, 88, .20);
    --success-solid: #30D158;
    --success-solid-fg: #1D1D1F;
    --glass-opaque: #282A34;
    --select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23f5f5f7' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --ink-filter: invert(1) brightness(1.1);
    --brand-mark: url(brand/kni-mark.png);
    --brand-logo: url(brand/kni-logo.png);
    --bs-body-bg-rgb: 7, 8, 12;
    --bs-body-color-rgb: 245, 245, 247;
    --bs-emphasis-color: #fff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-link-color-rgb: 106, 180, 255;
    --bs-link-hover-color: #9CCBFF;
    --bs-link-hover-color-rgb: 156, 203, 255;
    --bs-primary-rgb: 10, 132, 255;
  }
}
@media screen {
  :root[data-theme="dark"]:not(:has(link[href*="style_jury.css"])) {
    color-scheme: dark;
    scrollbar-color: rgba(255, 255, 255, .30) transparent;
    --wall:
      radial-gradient(42% 58% at 6% 10%, rgba(40, 96, 230, .55), transparent 70%),
      radial-gradient(40% 52% at 94% 6%, rgba(132, 64, 224, .46), transparent 70%),
      radial-gradient(46% 60% at 88% 96%, rgba(214, 72, 124, .36), transparent 70%),
      radial-gradient(42% 56% at 14% 96%, rgba(18, 140, 150, .42), transparent 70%),
      linear-gradient(150deg, #06070C 0%, #0B0A13 100%);
    --glass: rgba(40, 42, 52, .46);
    --glass-edge: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -1px 0 rgba(255, 255, 255, .04), 0 14px 44px rgba(0, 0, 0, .45);
    --rim: linear-gradient(145deg, rgba(255, 255, 255, .38), rgba(255, 255, 255, .07) 32%, rgba(255, 255, 255, .02) 58%, rgba(255, 255, 255, .2));
    --hi: rgba(255, 255, 255, .16);
    --hi-soft: rgba(255, 255, 255, .06);
    --btn-glass: rgba(255, 255, 255, .09);
    --btn-glass-rim: rgba(255, 255, 255, .14);
    --panel-strong: rgba(32, 34, 42, .84);
    --solid: #1C1D22;
    --solid-2: #26272E;
    --bg: #07080C;
    --panel: rgba(28, 30, 38, .56);
    --raised: rgba(64, 66, 78, .50);
    --field: rgba(255, 255, 255, .07);
    --soft: rgba(255, 255, 255, .07);
    --soft-2: rgba(255, 255, 255, .11);
    --line: rgba(255, 255, 255, .09);
    --line-2: rgba(255, 255, 255, .14);
    --line-3: rgba(255, 255, 255, .30);
    --row-line: rgba(255, 255, 255, .05);
    --row-hover: rgba(255, 255, 255, .05);
    --row-sel: rgba(10, 132, 255, .22);
    --head-bg: rgba(30, 32, 40, .72);
    --text: #F5F5F7;
    --text-2: #C9C9CE;
    --text-3: #9A9AA1;
    --accent: #0A84FF;
    --accent-hover: #3395FF;
    --accent-fg: #FFFFFF;
    --accent-soft: rgba(10, 132, 255, .2);
    --accent-soft-2: rgba(10, 132, 255, .3);
    --accent-text: #6AB4FF;
    --focus: #0A84FF;
    --danger: #FF453A;
    --danger-soft: rgba(255, 69, 58, .16);
    --warning: #FFB340;
    --warning-soft: rgba(255, 159, 10, .18);
    --success: #30D158;
    --side-active: rgba(255, 255, 255, .15);
    --top-bg: rgba(40, 42, 52, .46);
    --pop: rgba(42, 44, 54, .72);
    --code-bg: rgba(255, 255, 255, .08);
    --card-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 4px 16px rgba(0, 0, 0, .28);
    --card-shadow-hover: inset 0 1px 0 rgba(255, 255, 255, .18), 0 14px 32px rgba(0, 0, 0, .45);
    --shadow-2: 0 16px 44px rgba(0, 0, 0, .5);
    --shadow-3: 0 30px 90px rgba(0, 0, 0, .65);
    --success-text: #4DD76F;
    --danger-text: #FF8C84;      /* = --danger-badge-fg z Tafli */
    --warning-text: #FFB340;
    --success-soft: rgba(48, 209, 88, .20);
    --success-solid: #30D158;
    --success-solid-fg: #1D1D1F;
    --glass-opaque: #282A34;
    --select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23f5f5f7' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --ink-filter: invert(1) brightness(1.1);
    --brand-mark: url(brand/kni-mark.png);
    --brand-logo: url(brand/kni-logo.png);
    --bs-body-bg-rgb: 7, 8, 12;
    --bs-body-color-rgb: 245, 245, 247;
    --bs-emphasis-color: #fff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-link-color-rgb: 106, 180, 255;
    --bs-link-hover-color: #9CCBFF;
    --bs-link-hover-color-rgb: 156, 203, 255;
    --bs-primary-rgb: 10, 132, 255;
  }
}
:root:not(:has(link[href*="style_jury.css"])) body {
  background: transparent;
  color: var(--text);
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
}
:root:not(:has(link[href*="style_jury.css"])) h1,
:root:not(:has(link[href*="style_jury.css"])) h2,
:root:not(:has(link[href*="style_jury.css"])) .h3,
:root:not(:has(link[href*="style_jury.css"])) .card-title {
  font-family: var(--font-display);
  font-weight: var(--fw-display);
  letter-spacing: var(--display-ls);
}
/* skala Tafli zamiast rozmiarów Bootstrapa (h1 40 px, .h3 28 px) */
:root:not(:has(link[href*="style_jury.css"])) h1 {
  font-size: var(--fs-2xl);
}
:root:not(:has(link[href*="style_jury.css"])) .h3 {
  font-size: var(--fs-xl);
}

/* ============ 2. Materiał: szkło + świetlista krawędź (material.css) ============ */
/* Szkło z rozmyciem tylko na powłoce: pasek, logowanie, modale, menu (jak material.css).
   Karty treści to --raised bez rozmycia, bo lista zadań miała 24-26 rozmytych warstw naraz. */
:root:not(:has(link[href*="style_jury.css"])) .navbar,
:root:not(:has(link[href*="style_jury.css"])) #loginform,
:root:not(:has(link[href*="style_jury.css"])) .modal-content,
:root:not(:has(link[href*="style_jury.css"])) .dropdown-menu {
  -webkit-backdrop-filter: var(--blur);
  backdrop-filter: var(--blur);
  box-shadow: var(--glass-edge);
  border: 0;
}
:root:not(:has(link[href*="style_jury.css"])) .card {
  border: 0;
}
/* 1-pikselowa ramka z gradientu wycięta maską, jak .card::before w material.css */
:root:not(:has(link[href*="style_jury.css"])) .navbar::before,
:root:not(:has(link[href*="style_jury.css"])) .card::before,
:root:not(:has(link[href*="style_jury.css"])) #loginform::before,
:root:not(:has(link[href*="style_jury.css"])) .modal-content::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: var(--rim);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  pointer-events: none;
  z-index: 3;
}

/* ============ 3. Górny pasek: pływająca pigułka (.top w material.css) ============ */
:root:not(:has(link[href*="style_jury.css"])) .navbar.fixed-top {
  /* team: .bg-dark, public: .bg-light, oba z !important w Bootstrapie */
  background-color: var(--top-bg) !important;
  margin: 10px 12px 0;
  border-radius: var(--r-pill);
  padding: 4px 8px 4px 14px;
  --bs-navbar-color: var(--text-2);
  --bs-navbar-hover-color: var(--text);
  --bs-navbar-active-color: var(--text);
  --bs-navbar-brand-color: var(--text);
  --bs-navbar-brand-hover-color: var(--text);
}
:root:not(:has(link[href*="style_jury.css"])) .navbar-brand {
  border-radius: var(--r-pill);
  font-family: var(--font-display);
  font-weight: var(--fw-display);
  font-size: var(--wordmark-fs);
  letter-spacing: -0.02em;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
/* [AMUR] znak koła (--brand-mark: brand/kni-mark*.png, 2:1, plik 3x) zamiast kółka Tafli (.mark) i słowa
   „DOMjudge”: font-size 0 chowa tekst linku, ale czytnik ekranu nadal go odczyta; sam CSS */
:root:not(:has(link[href*="style_jury.css"])) .navbar-brand {
  font-size: 0;
}
:root:not(:has(link[href*="style_jury.css"])) .navbar-brand::before {
  content: "";
  width: 48px;
  height: 24px;
  background: var(--brand-mark) center / contain no-repeat;
}
:root:not(:has(link[href*="style_jury.css"])) .navbar .nav-link {
  border-radius: var(--r-pill);
  padding-inline: 12px !important;
  font-size: var(--fs-md);
}
/* aktywna pozycja jako "soczewka" (.nav.on) */
:root:not(:has(link[href*="style_jury.css"])) .navbar .nav-link.active {
  background: var(--side-active);
  box-shadow: inset 0 1px 0 var(--hi), 0 1px 4px rgba(0, 0, 0, .08);
}
/* [DOM] zegar contestu w pigułce (.rt + .timer) */
:root:not(:has(link[href*="style_jury.css"])) #timeleft {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
  color: var(--text);
  background: var(--btn-glass);
  box-shadow: inset 0 1px 0 var(--hi);
  border-radius: var(--r-pill);
  padding: 4px 10px;
  /* inline-block: ta sama wysokość pigułki (i paska) przy odliczaniu i przy tekście po polsku
     z ::before (sekcja 9f); inaczej pasek skakał o 4 px na koniec konkursu */
  display: inline-block;
  vertical-align: middle;
}
/* [DOM] ikona zegara i #timeleft to dwa spany w .navbar-text; przy liniach bazowych ikona
   stała wyżej niż środek pigułki, więc wyrównujemy je we flexie do środka */
:root:not(:has(link[href*="style_jury.css"])) .navbar-text:has(#timeleft) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
:root:not(:has(link[href*="style_jury.css"])) .navbar-text:has(#timeleft) > span:not(#timeleft) {
  display: inline-flex;
  align-items: center;
}
/* pasek postępu contestu pod paskiem */
:root:not(:has(link[href*="style_jury.css"])) .progress {
  --bs-progress-bg: var(--soft);
  height: 3px !important;
  margin: 8px 24px 0 !important;
  border-radius: var(--r-pill);
}
/* gradient od niebieskiego do fioletu w Tafli tylko dla hero/znaku; pasek postępu to zwykły akcent */
:root:not(:has(link[href*="style_jury.css"])) .progress-bar {
  background: var(--accent);
}

/* ============ 4. Przyciski: kapsuły, szklane, "ściśnięcie" ============ */
:root:not(:has(link[href*="style_jury.css"])) .btn {
  border-radius: var(--r-pill);
  font-weight: var(--fw-btn);
  transition: background-color .15s, box-shadow .15s, transform .12s cubic-bezier(.3, .7, .4, 1.4);
}
:root:not(:has(link[href*="style_jury.css"])) .btn:active:not(:disabled) {
  transform: scale(.96);
}
:root:not(:has(link[href*="style_jury.css"])) .btn:focus-visible {
  box-shadow: var(--ring);
}
/* DOMjudge używa .btn-success dla "Submit", a w Tafli to akcja główna.
   Wypełnienie --accent-fill zamiast --accent: biały na #0A84FF ma 3,65:1, na hoverze Tafli 3,05:1. */
:root:not(:has(link[href*="style_jury.css"])) .btn-primary,
:root:not(:has(link[href*="style_jury.css"])) .btn-success {
  color: var(--accent-fg);
  border-color: transparent;
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent-fill) 88%, #fff) 0%, var(--accent-fill) 60%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -1px 0 rgba(0, 0, 0, .1), 0 4px 14px color-mix(in srgb, var(--accent) 34%, transparent);
}
:root:not(:has(link[href*="style_jury.css"])) .btn-primary:hover,
:root:not(:has(link[href*="style_jury.css"])) .btn-success:hover {
  color: var(--accent-fg);
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent-fill-hover) 88%, #fff) 0%, var(--accent-fill-hover) 60%);
}
:root:not(:has(link[href*="style_jury.css"])) .btn-secondary,
:root:not(:has(link[href*="style_jury.css"])) .btn-info,
:root:not(:has(link[href*="style_jury.css"])) .btn-warning,
:root:not(:has(link[href*="style_jury.css"])) .btn-light,
:root:not(:has(link[href*="style_jury.css"])) .btn-outline-secondary {
  color: var(--text);
  background: var(--btn-glass);
  border: 1px solid var(--btn-glass-rim);
  box-shadow: inset 0 1px 0 var(--hi), 0 1px 3px rgba(0, 0, 0, .06);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  backdrop-filter: blur(12px) saturate(160%);
}
/* w karcie przycisk leży na nieprzezroczystym --raised, więc rozmycie nic nie daje, a kosztuje GPU */
:root:not(:has(link[href*="style_jury.css"])) .card .btn {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
:root:not(:has(link[href*="style_jury.css"])) .btn-secondary:hover,
:root:not(:has(link[href*="style_jury.css"])) .btn-info:hover,
:root:not(:has(link[href*="style_jury.css"])) .btn-warning:hover,
:root:not(:has(link[href*="style_jury.css"])) .btn-light:hover,
:root:not(:has(link[href*="style_jury.css"])) .btn-outline-secondary:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--btn-glass) 60%, var(--raised));
  border-color: var(--btn-glass-rim);
}

/* ============ 5. Pola, alerty ============ */
:root:not(:has(link[href*="style_jury.css"])) .form-control,
:root:not(:has(link[href*="style_jury.css"])) .form-select {
  background-color: var(--field);
  border-color: var(--line-2);
  border-radius: var(--r-sm);
  color: var(--text);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .04);
}
:root:not(:has(link[href*="style_jury.css"])) .form-select {
  /* [AMUR] strzałka Bootstrapa (#343a40) na ciemnym polu była niewidoczna; kolor z tokenu */
  background-image: var(--select-chevron);
}
/* [AMUR] rozwijana lista: tło pola jest półprzezroczyste, a Chromium w Windows nie używa takiego
   tła w liście i daje białe, przy jasnym tekście ciemnego motywu. Pozycje dostają pełne kolory. */
:root:not(:has(link[href*="style_jury.css"])) .form-select option {
  background-color: var(--glass-opaque);
  color: var(--text);
}
:root:not(:has(link[href*="style_jury.css"])) .form-control:focus,
:root:not(:has(link[href*="style_jury.css"])) .form-select:focus {
  background-color: var(--field);
  border-color: var(--accent);
  box-shadow: var(--ring-soft);
  color: var(--text);
}
:root:not(:has(link[href*="style_jury.css"])) .form-floating > label,
:root:not(:has(link[href*="style_jury.css"])) .form-label,
:root:not(:has(link[href*="style_jury.css"])) label {
  color: var(--text-2);
}
/* --text-3 nie trzyma 4,5:1 na --raised (ciemny: 3,79:1) ani na szkle nad jasną tapetą (3,93:1) */
:root:not(:has(link[href*="style_jury.css"])) .text-muted {
  color: var(--text-2) !important;
}
/* [DOM] nazwa zadania na karcie to h3.card-subtitle.text-muted, a to treść główna, nie metadane */
:root:not(:has(link[href*="style_jury.css"])) .card-body > h3.card-subtitle {
  color: var(--text) !important;
  font-weight: var(--fw-card);
}
:root:not(:has(link[href*="style_jury.css"])) .alert {
  border: 0;
  /* nie --r-pill: przeglądarka przycina promień do połowy wysokości, więc jedna linia nadal jest
     pigułką, a komunikat w kilku liniach (wąskie okno) jest zaokrąglonym prostokątem, nie owalem */
  border-radius: var(--r-lg);
  padding: 8px 18px;
  font-size: var(--fs-md);
  color: var(--text);
  background: var(--glass);
  box-shadow: var(--glass-edge);
  -webkit-backdrop-filter: var(--blur);
  backdrop-filter: var(--blur);
}
/* [DOM] ranking: karta z nazwą contestu i zaraz pod nią komunikat o freeze stykały się,
   odstęp między taflami jak w powłoce Tafli (.body { gap: 12px }) */
:root:not(:has(link[href*="style_jury.css"])) .card + .alert {
  margin-top: 12px;
}
/* komunikat o freeze w tonie ostrzegawczym (.offline.tone-conn) */
/* Ton komunikatu nakładamy na szkło, a nie zamiast niego: sam półprzezroczysty *-soft na
   najmocniejszej plamie tapety dawał 2,9-3,6:1 (jasny), ze szkłem pod spodem ≥ 4,6:1.
   Błąd logowania, potwierdzenie wysłania i informacje DOMjudge bez tych reguł były szarym szkłem. */
:root:not(:has(link[href*="style_jury.css"])) .alert-warning {
  background: linear-gradient(var(--warning-soft), var(--warning-soft)), var(--glass);
  color: var(--warning-text);
}
:root:not(:has(link[href*="style_jury.css"])) .alert-danger {
  background: linear-gradient(var(--danger-soft), var(--danger-soft)), var(--glass);
  color: var(--danger-text);
}
:root:not(:has(link[href*="style_jury.css"])) .alert-success {
  background: linear-gradient(var(--success-soft), var(--success-soft)), var(--glass);
  color: var(--success-text);
}
/* --accent-text na niebieskiej plamie tapety miał 3,85:1 także ze szkłem, więc tekst motywu */
:root:not(:has(link[href*="style_jury.css"])) .alert-info {
  background: linear-gradient(var(--accent-soft), var(--accent-soft)), var(--glass);
  color: var(--text);
}
/* [DOM] czas contestu w nagłówku rankingu: DimGray (#696969) z style_domjudge.css:688, tylko 2,3:1 na szkle */
:root:not(:has(link[href*="style_jury.css"])) #contesttimer {
  color: var(--text-2);
}
/* [DOM] znacznik "rendered preview" w formularzu pytania: Gainsboro (#DCDCDC): pełne jasne tło, 2,04:1 */
:root:not(:has(link[href*="style_jury.css"])) .rendered-preview-badge {
  background: var(--btn-glass);
  box-shadow: inset 0 1px 0 var(--hi-soft);
  color: var(--text-2);
  border-radius: var(--r-pill);
  padding: 1px 9px;
  font-family: var(--font-mono);
  font-style: normal;
  font-size: var(--fs-xs);
}

/* ============ 6. Karty (lista zadań), modale, menu ============ */
:root:not(:has(link[href*="style_jury.css"])) .card {
  position: relative;
  --bs-card-bg: var(--raised);
  --bs-card-cap-bg: transparent;
  --bs-card-border-color: transparent;
  border-radius: var(--r-card);
  box-shadow: var(--card-shadow);
  transition: transform .15s, box-shadow .15s;
}
:root:not(:has(link[href*="style_jury.css"])) .card:hover {
  transform: translateY(-1px);
  box-shadow: var(--card-shadow-hover);
}
/* [AMUR] karta z nazwą konkursu nad rankingiem nie jest klikalna, więc nie reaguje na najechanie */
:root:not(:has(link[href*="style_jury.css"])) .card:has(#contesttimer):hover {
  transform: none;
  box-shadow: var(--card-shadow);
}
:root:not(:has(link[href*="style_jury.css"])) .modal-content {
  --bs-modal-bg: var(--panel-strong);
  --bs-modal-header-border-color: var(--line);
  --bs-modal-footer-border-color: var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--glass-edge), var(--shadow-3);
}
/* [DOM] okno z danymi uczestnika: drugi wiersz szablonu partials/team.html.twig to zawsze
   kategoria, a na AMUR jest jedna („Uczestnicy”), więc wiersz nic nie mówi */
:root:not(:has(link[href*="style_jury.css"])) .modal-body > .row > div > table.table-sm.table-striped > tbody > tr:nth-child(2) {
  display: none;
}
/* [AMUR] to samo okno pokazuje tylko imię i nazwisko (bez zdjęcia, uczelni i kategorii): zamiast
   szerokiego modal-lg z tabelą na pół szerokości wąskie okno z tabelą na całą szerokość */
:root:not(:has(link[href*="style_jury.css"])) .modal-dialog:has(.modal-body > .row > div > table.table-sm.table-striped) {
  max-width: 440px;
}
:root:not(:has(link[href*="style_jury.css"])) .modal-body > .row > div:has(> table.table-sm.table-striped) {
  flex: 0 0 100%;
  max-width: 100%;
}
:root:not(:has(link[href*="style_jury.css"])) .dropdown-menu {
  --bs-dropdown-bg: var(--pop);
  --bs-dropdown-link-color: var(--text);
  /* hover jako miękka soczewka akcentu z tekstem motywu (biały na --accent: 3,65:1) */
  --bs-dropdown-link-hover-bg: var(--accent-soft-2);
  --bs-dropdown-link-hover-color: var(--text);
  --bs-dropdown-link-active-bg: var(--accent-fill);
  --bs-dropdown-link-active-color: var(--accent-fg);
  border-radius: var(--r-md);
  padding: 6px;
}
/* [DOM] menu rozwijane w pasku (wybór konkursu): pasek ma własny backdrop-filter, a rozmycie
   elementu w środku takiego elementu przeglądarka pomija, więc --pop (72% krycia) prześwitywało
   stroną; w pasku menu jest nieprzezroczyste */
:root:not(:has(link[href*="style_jury.css"])) .navbar .dropdown-menu {
  --bs-dropdown-bg: var(--glass-opaque);
}
:root:not(:has(link[href*="style_jury.css"])) .dropdown-item {
  border-radius: var(--r-sk);
}
:root:not(:has(link[href*="style_jury.css"])) .btn-close {
  filter: var(--ink-filter);
}
/* [DOM] przycisk zamknięcia komunikatu (alert-dismissible): Bootstrap daje mu dopełnienie 20 na 16 px
   pod wyższy komunikat, a komunikat motywu ma 36 px, więc przycisk miał 46 na 54 px, wystawał poniżej,
   X siedział przy dolnej krawędzi, a obwódka fokusu obejmowała cały ten obszar; teraz kwadrat 28 px
   na środku wysokości, z miejscem na niego po prawej stronie tekstu */
:root:not(:has(link[href*="style_jury.css"])) .alert-dismissible {
  padding-right: 48px;
}
:root:not(:has(link[href*="style_jury.css"])) .alert-dismissible .btn-close {
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  box-sizing: border-box;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: var(--r-pill);
}
/* [DOM] kafelek litery zadania (.pchip): na kolorze balonika z inline style
   nakładamy połysk z gradientu, kolor bazowy zostaje z DOMjudge */
:root:not(:has(link[href*="style_jury.css"])) .problem-badge {
  border-radius: var(--r-badge-sq);
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .30), rgba(255, 255, 255, 0) 70%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 0 0 .5px rgba(0, 0, 0, .12), 0 2px 6px rgba(0, 0, 0, .35);
  text-shadow: 0 1px 1px rgba(0, 0, 0, .25);
  font-family: var(--font-display);
}
/* [DOM] przycisk komunikatów na karcie zadania (partials/problem_list.html.twig): ikona, licznik
   i słowo „clarifications”. Po polsku „1 komunikaty” byłoby błędne, a licznik to osobny element,
   więc słownik nie może odmienić słowa: przenosimy licznik za słowo („komunikaty 1”) */
:root:not(:has(link[href*="style_jury.css"])) .card a.btn[href*="/clarifications/by-problem/"] {
  display: inline-flex;
  align-items: center;
  gap: .35em;
}
:root:not(:has(link[href*="style_jury.css"])) .card a.btn[href*="/clarifications/by-problem/"] > .badge {
  order: 1;
}
/* [DOM] mini-statystyki na kartach zadań (heatmapa correct/incorrect/frozen 0-9): pełne jasne kolory
   GitHuba ze style_domjudge.css:519-636 zamieniamy na skalę koloru semantycznego z rosnącą alfą */
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-0 { background-color: var(--soft); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-1 { background-color: color-mix(in srgb, var(--success) 27%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-2 { background-color: color-mix(in srgb, var(--success) 36%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-3 { background-color: color-mix(in srgb, var(--success) 45%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-4 { background-color: color-mix(in srgb, var(--success) 54%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-5 { background-color: color-mix(in srgb, var(--success) 63%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-6 { background-color: color-mix(in srgb, var(--success) 72%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-7 { background-color: color-mix(in srgb, var(--success) 81%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-8 { background-color: color-mix(in srgb, var(--success) 90%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.correct-9 { background-color: color-mix(in srgb, var(--success) 99%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-0 { background-color: var(--soft); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-1 { background-color: color-mix(in srgb, var(--danger) 27%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-2 { background-color: color-mix(in srgb, var(--danger) 36%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-3 { background-color: color-mix(in srgb, var(--danger) 45%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-4 { background-color: color-mix(in srgb, var(--danger) 54%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-5 { background-color: color-mix(in srgb, var(--danger) 63%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-6 { background-color: color-mix(in srgb, var(--danger) 72%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-7 { background-color: color-mix(in srgb, var(--danger) 81%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-8 { background-color: color-mix(in srgb, var(--danger) 90%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.incorrect-9 { background-color: color-mix(in srgb, var(--danger) 99%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-0 { background-color: var(--soft); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-1 { background-color: color-mix(in srgb, var(--accent) 27%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-2 { background-color: color-mix(in srgb, var(--accent) 36%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-3 { background-color: color-mix(in srgb, var(--accent) 45%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-4 { background-color: color-mix(in srgb, var(--accent) 54%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-5 { background-color: color-mix(in srgb, var(--accent) 63%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-6 { background-color: color-mix(in srgb, var(--accent) 72%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-7 { background-color: color-mix(in srgb, var(--accent) 81%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-8 { background-color: color-mix(in srgb, var(--accent) 90%, transparent); }
:root:not(:has(link[href*="style_jury.css"])) .problem-stats-item.frozen-9 { background-color: color-mix(in srgb, var(--accent) 99%, transparent); }

/* ============ 7. Tabele: zgłoszenia i pytania do jury (.tbl-wrap/.tr) ============ */
:root:not(:has(link[href*="style_jury.css"])) .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--text);
  --bs-table-border-color: var(--row-line);
  --bs-table-striped-bg: transparent;
  --bs-table-striped-color: var(--text);
  --bs-table-hover-bg: var(--row-hover);
  --bs-table-hover-color: var(--text);
  background: var(--raised);
  box-shadow: var(--card-shadow);
  border-radius: var(--r-md);
  overflow: hidden;
}
:root:not(:has(link[href*="style_jury.css"])) .table > :not(caption) > * > * {
  padding-inline: 14px;
}
/* [DOM] DOMjudge rysuje wiersze .data-table liniami silver/#C0C0C0, a w Tafli jest tylko --row-line */
:root:not(:has(link[href*="style_jury.css"])) .data-table,
:root:not(:has(link[href*="style_jury.css"])) .data-table tr,
:root:not(:has(link[href*="style_jury.css"])) .data-table th,
:root:not(:has(link[href*="style_jury.css"])) .data-table td {
  border-color: var(--row-line);
}
:root:not(:has(link[href*="style_jury.css"])) .data-table tbody tr:last-child > * {
  border-bottom: 0;
}
/* [DOM] komórki zgłoszeń i pytań to linki; kolor tekstu daje im styl wpisany w team/index.html.twig,
   ale okno komunikatów zadania (clarifications_by_problem_modal, ładowane AJAX-em) go nie ma
   i cały wiersz był w kolorze linku */
:root:not(:has(link[href*="style_jury.css"])) .data-table td a,
:root:not(:has(link[href*="style_jury.css"])) .data-table td a:hover {
  color: inherit;
}
/* [DOM] szablon DOMjudge wstawia `.data-table tr:hover { background: #ffffcc !important }`,
   jasnożółte tło pod jasnym tekstem (1,06:1). Hover Tafli: --row-hover. */
:root:not(:has(link[href*="style_jury.css"])) .data-table tr:hover {
  background: var(--row-hover) !important;
}
:root:not(:has(link[href*="style_jury.css"])) .table thead th {
  background: var(--head-bg);
  color: var(--text-3);
  font-size: var(--fs-xs);
  font-weight: var(--fw-btn);
  border-bottom-color: var(--line);
}
/* [DOM] nagłówki sekcji "Submissions"/"Clarifications" na stronie zespołu (.h-page) */
:root:not(:has(link[href*="style_jury.css"])) .teamoverview {
  background: none;
  border: 0;
  text-align: left;
  font-family: var(--font-display);
  font-weight: var(--fw-display);
  font-size: var(--fs-lg);
  letter-spacing: -0.02em;
  padding: 0 4px 8px;
  margin-top: 28px;
}
/* [DOM] kolumna języka: style_domjudge.css ma małe kapitaliki (.probid, .langid), czyli ok. 9 px;
   nazwę języka („C++”, „Python”) podstawia słownik (tafla-translate-pl.js, scoped) */
:root:not(:has(link[href*="style_jury.css"])) .langid {
  font-variant: normal;
  font-size: var(--fs-md);
  font-weight: var(--fw-strong);
}
/* [DOM] werdykty na liście zgłoszeń jako znaczniki-pigułki */
:root:not(:has(link[href*="style_jury.css"])) .sol {
  display: inline-block;
  border-radius: var(--r-pill);
  /* [AMUR] werdykt to najważniejsza informacja na liście: było 11 px małymi kapitalikami
     (font-variant ze style_domjudge.css), czyli ok. 9 px wysokości liter */
  padding: 4px 11px;
  font-size: var(--fs-sm);
  font-variant: normal;
  text-transform: uppercase;
  font-weight: var(--fw-strong);
  letter-spacing: .04em;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 35%, transparent);
}
/* tekst semantyczny: --*-text [AMUR], bo --danger/--success Tafli na *-soft mają 2,6-4,4:1 */
:root:not(:has(link[href*="style_jury.css"])) .sol_correct {
  color: var(--success-text);
  background: var(--success-soft);
}
:root:not(:has(link[href*="style_jury.css"])) .sol_incorrect {
  color: var(--danger-text);
  background: var(--danger-soft);
}
:root:not(:has(link[href*="style_jury.css"])) .sol_queued {
  color: var(--warning-text);
  background: var(--warning-soft);
}
:root:not(:has(link[href*="style_jury.css"])) .output_text,
:root:not(:has(link[href*="style_jury.css"])) .clarificationform pre,
:root:not(:has(link[href*="style_jury.css"])) pre,
:root:not(:has(link[href*="style_jury.css"])) kbd {
  font-family: var(--font-mono);
  background-color: var(--code-bg);
  color: var(--text);
  border-color: var(--line);
  border-radius: var(--r-sm);
}
:root:not(:has(link[href*="style_jury.css"])) hr {
  border-color: var(--line);
  opacity: 1;
}

/* ============ 8. Ranking publiczny i zespołu, [DOM] w całości ============ */
/* baner contestu to obraz jury (może mieć przezroczyste tło), więc bez cienia szkła, który
   rysowałby wokół przezroczystego obrazka prostokątną ramkę */
:root:not(:has(link[href*="style_jury.css"])) .banner {
  border-radius: var(--r-lg);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard {
  border-collapse: separate;
  border-spacing: 0 4px;
  font-variant-numeric: tabular-nums;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard td,
:root:not(:has(link[href*="style_jury.css"])) .scoreboard th {
  border-color: transparent !important;
  color: var(--text);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard a {
  color: inherit;
}
/* [DOM] style_domjudge.css:270-279: separatory `box-shadow: -1px 0 0 0 silver inset` i 2 px czarnej
   linii pod nagłówkiem; w Tafli separacja odstępem, bez twardych linii */
:root:not(:has(link[href*="style_jury.css"])) .scoreheader {
  border-bottom: 0;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th {
  box-shadow: none;
  color: var(--text-2);
  font-weight: var(--fw-btn);
}
/* [DOM] nagłówek rankingu jest przyklejony (position: sticky), a domjudge.js ustawia mu top równy
   wysokości .fixed-top, bez 10 px marginesu pływającego paska (sekcja 3): po przewinięciu chował się
   10 px pod paskiem, a przez przezroczyste tło prześwitywały wiersze. 10 px dopełnienia u góry
   (bez tła: background-clip) wpada pod pasek, ujemny margines tabeli oddaje je w zwykłym układzie,
   a nieprzezroczyste tło jak pasek wiersza zakrywa przewijane wiersze. */
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th {
  padding-top: 10px;
  background: var(--glass-opaque);
  background-clip: content-box;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard:has(> thead > .scoreheader) {
  margin-top: -10px;
}
/* [AMUR] tło nagłówka jest przycięte do treści (background-clip: content-box, 10 px dopełnienia
   u góry), a zaokrąglenie liczy się od krawędzi komórki: z 14 px promienia u góry zostawały 4 px
   i górne rogi były ostre. Pionowy promień u góry większy o te 10 px daje widoczne 14 px. */
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th:first-child {
  border-radius: var(--r-row) 0 0 var(--r-row) / calc(var(--r-row) + 10px) 0 0 var(--r-row);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th:last-child {
  border-radius: 0 var(--r-row) var(--r-row) 0 / 0 calc(var(--r-row) + 10px) var(--r-row) 0;
}
/* [AMUR] nagłówki rankingu nad treścią kolumn: „Miejsce” odsunięte od zaokrąglonej krawędzi,
   „Uczestnik” od lewej nad imieniem i nazwiskiem (45 px = pusta kolumna uczelni i serce, także
   na rzutniku), zamiast na środku szerokiej kolumny. Wcięcie tekstu, nie dopełnienie: tło
   nagłówka jest przycięte do treści (background-clip, przyklejanie), więc dopełnienie zwężało pasek. */
:root:not(:has(link[href*="style_jury.css"])) .desktop-scoreboard .scoreheader th:first-child {
  text-align: left;
  text-indent: 12px;
}
:root:not(:has(link[href*="style_jury.css"])) .desktop-scoreboard .scoreheader th:nth-child(2) {
  text-align: left;
  text-indent: 45px;
}
/* [AMUR] bez kolumn zadań (ranking przed startem) wynik był ostatnią kolumną przy samej krawędzi */
:root:not(:has(link[href*="style_jury.css"])) .desktop-scoreboard tr > td.scorett:last-child {
  padding-inline-end: 14px;
}
/* wiersz drużyny = szklany pasek (.tr) */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr td:not([class*="cl_"]) {
  background: var(--glass);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr td:first-child {
  border-radius: var(--r-row) 0 0 var(--r-row);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr td:last-child {
  border-radius: 0 var(--r-row) var(--r-row) 0;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr:hover td:not([class*="cl_"]) {
  background: color-mix(in srgb, var(--glass) 70%, var(--raised));
}
/* [AMUR] komórki z kolorem kategorii (flaga, logo, nazwa i uczelnia) mają tło z !important
   (sekcja kategorii niżej), więc bez tych reguł podświetlenie je omijało */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr:hover td:is(.cl_FFFFFF, .cl_ffffff) {
  background-color: color-mix(in srgb, var(--glass) 70%, var(--raised)) !important;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr:hover td[class*="cl_"]:not(.cl_FFFFFF):not(.cl_ffffff):not(.cl_FFFF99):not(.cl_FFFFE0) {
  background-image: linear-gradient(color-mix(in srgb, var(--glass-opaque) 70%, var(--raised)), color-mix(in srgb, var(--glass-opaque) 70%, var(--raised)));
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr:hover td.scoretn[class*="cl_"]:not(.cl_FFFFFF):not(.cl_ffffff):not(.cl_FFFF99):not(.cl_FFFFE0) {
  background-image: linear-gradient(to right, transparent 4px, color-mix(in srgb, var(--glass-opaque) 70%, var(--raised)) 4px);
}
:root:not(:has(link[href*="style_jury.css"])) .sortorderswitch {
  border-top: 0;
}
/* [DOM] style_domjudge.css:190 `.scoreboard tr { border-bottom: 1px solid black }`, :312 .scoresummary */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr,
:root:not(:has(link[href*="style_jury.css"])) .scoresummary {
  border-top: 0;
  border-bottom: 0;
}
/* [DOM] legenda kolorów (#cell_legend): kolor i tło ma wiersz tr.score_*, komórka nie może
   przykrywać go szkłem wiersza rankingu */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr[class*="score_"] > td {
  color: inherit;
  background: transparent;
}
/* [AMUR] legenda jako rząd pigułek zamiast kolumny wierszy 25ex: mniej miejsca, a wiersz
   z jedną komórką był zaokrąglony tylko z prawej (td jest jednocześnie :first- i :last-child).
   [DOM] Bootstrap .d-md-table ma display: table !important, stąd !important. */
@media (min-width: 768px) {
  :root:not(:has(link[href*="style_jury.css"])) #cell_legend {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
  }
}
:root:not(:has(link[href*="style_jury.css"])) #cell_legend :is(thead, tbody) {
  display: contents;
}
:root:not(:has(link[href*="style_jury.css"])) #cell_legend tr {
  display: block;
  /* [DOM] style_domjudge.css: `.scoreboard tr { height: 42px }`; kolor ma wiersz, więc pigułka
     była o 14 px wyższa niż treść i hover komórki jej nie pokrywał */
  height: auto;
  border-radius: var(--r-pill);
}
:root:not(:has(link[href*="style_jury.css"])) #cell_legend :is(th, td) {
  display: block;
  width: auto;
  padding: 4px 12px;
  border-radius: var(--r-pill);
}
:root:not(:has(link[href*="style_jury.css"])) #cell_legend th {
  padding-left: 0;
  font-weight: var(--fw-strong);
}
:root:not(:has(link[href*="style_jury.css"])) #cell_legend tbody tr:hover td {
  /* legenda nie jest klikalna; hover wierszy rankingu malował tu komórkę mniejszą niż pigułka */
  background: transparent;
}
:root:not(:has(link[href*="style_jury.css"])) #cell_legend tr.score_neutral {
  box-shadow: inset 0 0 0 1px var(--line);
}
/* [DOM] stopka rankingu "Last Update": szary #808080 10 px, tylko 3,5:1 */
:root:not(:has(link[href*="style_jury.css"])) #lastmod,
:root:not(:has(link[href*="style_jury.css"])) #lastmod a {
  color: var(--text-2);
  font-size: var(--fs-xs);
}
/* [DOM] kolor kategorii drużyny: DOMjudge daje komórkom klasę .cl_<kolor> z pełnym tłem
   (scoreboard-category-color.css; "participants" bez koloru = #FFFFFF). Pełne jasne tło pod
   tekstem motywu łamie kontrast, więc biały zamieniamy na szkło, a inny kolor na 4-pikselowy pasek po lewej
   w komórce z nazwą drużyny (kolor tła zostaje, szkło przykrywa resztę), pozostałe komórki
   kategorii daje szkło. Własna drużyna (.cl_FFFF99 w wierszu .scorethisisme) niżej. */
:root:not(:has(link[href*="style_jury.css"])) .cl_FFFFFF,
:root:not(:has(link[href*="style_jury.css"])) .cl_ffffff {
  background-color: var(--glass) !important;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard td[class*="cl_"]:not(.cl_FFFFFF):not(.cl_ffffff):not(.cl_FFFF99):not(.cl_FFFFE0) {
  background-image: linear-gradient(var(--glass-opaque), var(--glass-opaque));
  background-origin: border-box;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard td.scoretn[class*="cl_"]:not(.cl_FFFFFF):not(.cl_ffffff):not(.cl_FFFF99):not(.cl_FFFFE0) {
  background-image: linear-gradient(to right, transparent 4px, var(--glass-opaque) 4px);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard [class*="cl_"] .forceWidth.toolong:after {
  background: linear-gradient(to right, transparent 0%, var(--glass-opaque) 96%);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard .scoretn {
  text-align: left;
  font-weight: var(--fw-strong);
}
:root:not(:has(link[href*="style_jury.css"])) .univ {
  color: var(--text-2);
  font-weight: 400;
}
:root:not(:has(link[href*="style_jury.css"])) .scorenc {
  font-family: var(--font-display);
}
:root:not(:has(link[href*="style_jury.css"])) .scorett {
  color: var(--text-2);
}
:root:not(:has(link[href*="style_jury.css"])) img.affiliation-logo {
  border-radius: var(--r-badge-sq);
}
:root:not(:has(link[href*="style_jury.css"])) .countryflag {
  border-radius: 4px;
}
/* komórki zadań = .sb-cell z Tafli */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard td.score_cell div {
  border-radius: var(--r-sk);
  margin: 2px;
  /* [AMUR] „0 + 1 próba” (freeze) dotykało krawędzi i wychodziło poza komórkę: [DOM]
     style_domjudge.css ma `.scoreboard td div { width: 4em }`, więc szerokość jest minimalna,
     a nie stała */
  width: auto;
  min-width: 4em;
  padding: 2px 6px;
  font-weight: var(--fw-strong);
  line-height: 1.15;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard td.score_cell div span {
  font-size: var(--fs-xs);
  font-weight: 400;
  white-space: nowrap;
}
/* kolory komórek: --*-text/--*-solid [AMUR]: biały na --success miał 2,02:1, --danger na szkle 3,1:1 */
:root:not(:has(link[href*="style_jury.css"])) .score_correct {
  background: var(--success-soft);
  color: var(--success-text);
}
:root:not(:has(link[href*="style_jury.css"])) .score_correct.score_first {
  background: var(--success-solid);
  color: var(--success-solid-fg);
}
:root:not(:has(link[href*="style_jury.css"])) .score_incorrect {
  background: var(--danger-soft);
  color: var(--danger-text);
}
:root:not(:has(link[href*="style_jury.css"])) .score_pending {
  background: var(--warning-soft);
  color: var(--warning-text);
}
/* własna drużyna (.tr.is-me). [DOM] DOMjudge maluje cały wiersz #FFFF99 (style_domjudge.css:314)
   i komórkę nazwy .cl_FFFF99, bo tło wiersza prześwitywało przez półprzezroczyste --row-sel
   (biały tekst na jasnożółtym: 1,2:1). Zaznaczenie liczymy na nieprzezroczystym szkle. */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr.scorethisisme {
  background: none !important;
}
:root:not(:has(link[href*="style_jury.css"])) .scorethisisme td {
  background: linear-gradient(var(--row-sel), var(--row-sel)), var(--glass-opaque) !important;
}
/* [DOM] wiersz ulubionego uczestnika: DOMjudge daje mu inline lightyellow, a komórkom klasę
   cl_FFFFE0 (domjudge.js, initFavouriteTeams); zamiast żółtego tła lżejsze zaznaczenie na szkle */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr[style*="lightyellow"] {
  background: none !important;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr[style*="lightyellow"] td,
:root:not(:has(link[href*="style_jury.css"])) .cl_FFFFE0 {
  background: linear-gradient(color-mix(in srgb, var(--row-sel) 50%, transparent), color-mix(in srgb, var(--row-sel) 50%, transparent)), var(--glass-opaque) !important;
}
:root:not(:has(link[href*="style_jury.css"])) .scorethisisme .forceWidth.toolong:after {
  background: linear-gradient(to right, transparent 0%, color-mix(in srgb, var(--row-sel), var(--glass-opaque)) 96%);
}
:root:not(:has(link[href*="style_jury.css"])) .heart {
  color: var(--text-3);
}
/* [DOM] serce ulubionego uczestnika (fas) wypełnione i w kolorze, żeby było widać zaznaczenie */
:root:not(:has(link[href*="style_jury.css"])) .heart.fas {
  color: var(--danger);
}

/* ============ 9. Logowanie: arkusz szkła na tapecie (.login-card) ============ */
/* [DOM] #loginform, .form-signin z security/login.html.twig i style_login.css */
:root:not(:has(link[href*="style_jury.css"])) #loginform {
  position: relative;
  background: var(--panel-strong);
  border-radius: var(--r-sheet);
  padding: 30px 28px 26px;
  box-shadow: var(--glass-edge), var(--shadow-3);
}
/* [AMUR] logo koła zamiast logo DOMjudge (<img width="72"> w security/login.html.twig):
   content: url() na <img> podmienia obraz bez zmiany szablonu (Chromium; przeglądarka bez tego
   pokaże logo DOMjudge). Wersja jak w pasku: niebieska na jasnym, morska na ciemnym. */
:root:not(:has(link[href*="style_jury.css"])) #loginform > img {
  content: var(--brand-logo);
  width: 240px;
  height: auto;
  max-width: 100%;
}
:root:not(:has(link[href*="style_jury.css"])) #loginform .btn-primary {
  height: 42px;
}
:root:not(:has(link[href*="style_jury.css"])) div.vertical-line {
  background-color: var(--line);
}

/* ============ 9b. Komponenty: fokus, typografia, drobne elementy DOMjudge ============ */
/* [DOM] Submit / Logout / Notifications w pasku i "Submit" na kartach zadań to <a><span class="btn">:
   fokus dostaje <a> z outline: 0, więc bez tej reguły fokus z klawiatury jest niewidoczny */
:root:not(:has(link[href*="style_jury.css"])) a:has(> .btn):focus-visible {
  outline: 0;
  box-shadow: none;
}
:root:not(:has(link[href*="style_jury.css"])) a:focus-visible > .btn {
  box-shadow: var(--ring);
}
/* pierścień fokusu Tafli zamiast Bootstrapowego rgba(13,110,253,.25) */
:root:not(:has(link[href*="style_jury.css"])) .navbar-brand:focus-visible,
:root:not(:has(link[href*="style_jury.css"])) .navbar .nav-link:not(:has(> .btn)):focus-visible,
:root:not(:has(link[href*="style_jury.css"])) .dropdown-toggle:focus-visible,
:root:not(:has(link[href*="style_jury.css"])) .dropdown-item:focus-visible,
:root:not(:has(link[href*="style_jury.css"])) .navbar-toggler:focus-visible {
  outline: 0;
  box-shadow: var(--ring);
}
:root:not(:has(link[href*="style_jury.css"])) .navbar-toggler:focus:not(:focus-visible) {
  box-shadow: none;
}
/* nieaktywne kontrolki: --disabled-op z Tafli */
:root:not(:has(link[href*="style_jury.css"])) .btn:disabled,
:root:not(:has(link[href*="style_jury.css"])) .btn.disabled,
:root:not(:has(link[href*="style_jury.css"])) .form-control:disabled,
:root:not(:has(link[href*="style_jury.css"])) .form-select:disabled {
  opacity: .42;
}
/* typografia w skali --fs-* (Bootstrap i DOMjudge: 16 / 17,9 / 18,7 / 20 px) */
:root:not(:has(link[href*="style_jury.css"])) .btn {
  font-size: var(--fs-md);
}
:root:not(:has(link[href*="style_jury.css"])) .btn-lg {
  font-size: var(--fs-lg);
}
:root:not(:has(link[href*="style_jury.css"])) .form-control,
:root:not(:has(link[href*="style_jury.css"])) .form-select,
:root:not(:has(link[href*="style_jury.css"])) .form-floating > label {
  font-size: var(--fs-md);
}
:root:not(:has(link[href*="style_jury.css"])) .data-table {
  font-size: var(--fs-md);
}
/* [DOM] kolumna czasu w tabelach zgłoszeń i pytań: mono + cyfry o stałej szerokości */
:root:not(:has(link[href*="style_jury.css"])) .data-table tbody td:first-child {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
/* [DOM] karty zadań: nazwa (h3) i limity (h4) */
:root:not(:has(link[href*="style_jury.css"])) .card-body > h3.card-subtitle {
  font-size: var(--fs-lg);
}
:root:not(:has(link[href*="style_jury.css"])) .card-body > h4.card-subtitle {
  font-size: var(--fs-sm);
}
/* [DOM] nagłówek rankingu: litery zadań w skali UI, nie 16 px */
/* [DOM] style_domjudge.css ustawia .scoreheader { font-variant: small-caps }; przy 12 px małe
   kapitaliki miały ok. 9 px; w Tafli etykiety bez przekształceń (--label-tt: none), z wielką literą */
:root:not(:has(link[href*="style_jury.css"])) .scoreheader,
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th {
  font-variant: normal;
}
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th {
  font-size: var(--fs-sm);
}
/* wielka tylko pierwsza litera: capitalize zmieniał każde słowo („Czas Działania”) */
:root:not(:has(link[href*="style_jury.css"])) .scoreheader th::first-letter,
:root:not(:has(link[href*="style_jury.css"])) .table thead th::first-letter {
  text-transform: uppercase;
}
/* [DOM] litera zadania: biały na kolorze balonika ustawionym przez jury ma zwykle 3-3,7:1, więc
   musi zostać „dużym tekstem” WCAG (≥ 14 px pogrubiony, próg 3:1), nie schodzimy do --fs-md */
:root:not(:has(link[href*="style_jury.css"])) .problem-badge {
  font-size: max(1em, var(--fs-lg));
}
:root:not(:has(link[href*="style_jury.css"])) .univ {
  font-size: var(--fs-xs);
}
/* [DOM] nagłówek karty contestu na rankingu dziedziczył Roboto ze style_domjudge.css:22 */
:root:not(:has(link[href*="style_jury.css"])) .card-header,
:root:not(:has(link[href*="style_jury.css"])) .card-header * {
  font-family: var(--font-ui);
}
/* [DOM] kafelek litery zadania: obramowanie z inline stylu (ciemniejszy kolor balonika):
   w Tafli krawędź daje połysk i cień, nie linia */
:root:not(:has(link[href*="style_jury.css"])) .problem-badge {
  border-color: transparent !important;
}

/* skala --fs-* w pozostałych miejscach DOMjudge (16 px zegara, etykiet i nagłówka karty,
   13-19,2 px w rankingu). Tryb rzutnika (sekcja 11) nadpisuje rozmiary rankingu. */
:root:not(:has(link[href*="style_jury.css"])) #timeleft,
:root:not(:has(link[href*="style_jury.css"])) .form-label,
:root:not(:has(link[href*="style_jury.css"])) #messagepreview,
:root:not(:has(link[href*="style_jury.css"])) .card-header {
  font-size: var(--fs-md);
}
:root:not(:has(link[href*="style_jury.css"])) .scorepl,
:root:not(:has(link[href*="style_jury.css"])) .scorett {
  font-size: var(--fs-md);
}
:root:not(:has(link[href*="style_jury.css"])) .scorenc {
  font-size: var(--fs-lg);
  font-weight: var(--fw-display);
}
:root:not(:has(link[href*="style_jury.css"])) td.score_cell div {
  font-size: var(--fs-lg);
}
/* [DOM] liczniki zgłoszeń i komunikat o freeze mają rozmiar inline (90% / 80%) */
:root:not(:has(link[href*="style_jury.css"])) .submcorrect,
:root:not(:has(link[href*="style_jury.css"])) .submreject,
:root:not(:has(link[href*="style_jury.css"])) .submpend {
  font-size: var(--fs-xs) !important;
}
:root:not(:has(link[href*="style_jury.css"])) .alert {
  font-size: var(--fs-md) !important;
}
:root:not(:has(link[href*="style_jury.css"])) .scoretn,
:root:not(:has(link[href*="style_jury.css"])) #cell_legend th {
  font-size: var(--fs-md);
}
/* [AMUR] „Podsumowanie”: bez małych kapitalików ze style_domjudge.css, większe i pogrubione */
:root:not(:has(link[href*="style_jury.css"])) .scoresummary {
  font-variant: normal;
  font-weight: var(--fw-strong);
}
/* [DOM] wiersz podsumowania rankingu: klasę .scoresummary ma tylko pierwsza komórka,
   czasy/liczby w pozostałych mają inline font-size: 90% */
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr:has(> td.scoresummary) > td,
:root:not(:has(link[href*="style_jury.css"])) #cell_legend td {
  font-size: var(--fs-md);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr:has(> td.scoresummary) > td.scoresummary {
  font-size: var(--fs-lg);
}
:root:not(:has(link[href*="style_jury.css"])) .scoreboard tr:has(> td.scoresummary) span {
  font-size: var(--fs-sm) !important;
}
/* licznik (np. liczba pytań na przycisku karty zadania): Bootstrap .75em = 10 px */
:root:not(:has(link[href*="style_jury.css"])) .btn .badge:not(.problem-badge) {
  font-size: var(--fs-xs);
}

/* ============ 9c. Ekrany: ranking mobilny, węższe okna ============ */
/* [DOM] ranking mobilny (< 768 px): nierozwiązane zadania DOMjudge maluje inline
   `background-color: #F5F5F5; border: 1px solid linen` z literą w kolorze silver, czyli pełne jasne kółka */
:root:not(:has(link[href*="style_jury.css"])) .mobile-scoreboard .problem-badge[style*="#F5F5F5"] {
  background-color: var(--btn-glass) !important;
  box-shadow: inset 0 1px 0 var(--hi-soft);
  background-image: none;
  text-shadow: none;
}
:root:not(:has(link[href*="style_jury.css"])) .mobile-scoreboard .problem-badge[style*="#F5F5F5"] > span {
  color: var(--text-2) !important;
}
/* [DOM] nazwa drużyny i uczelni nie łamią się (nowrap), więc jedna długa nazwa rozpychała ranking
   poza ekran: telefon 401 px tabeli w 351 px, rzutnik 1280 px 1658 px, kolumny E-J niewidoczne.
   Komórka z width: 100% i max-width: 0 bierze tylko resztę miejsca, a za długa nazwa dostaje
   wygaszenie .toolong od DOMjudge. Pozostałe kolumny kurczą się wtedy do minimum, więc liczba
   rozwiązanych i czas karny dostają odstęp. Druk ma własne łamanie nazw (sekcja 12). */
@media screen {
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard td.scoretn {
    width: 100%;
    max-width: 0;
  }
  :root:not(:has(link[href*="style_jury.css"])) .desktop-scoreboard td.scorenc,
  :root:not(:has(link[href*="style_jury.css"])) .desktop-scoreboard td.scorett {
    padding-inline: .5em;
  }
  /* [DOM] wiersz własnej drużyny na /team (team/partials/index_content.html.twig): zwarta tabela
     na środku jak dotąd, bez rozciągania na całą szerokość */
  :root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.scoretn {
    width: auto;
    max-width: none;
  }
}
/* [DOM] poniżej 768 px (navbar-expand-md) menu rozwija się w pasku: z promieniem pigułki wysoki
   pasek był owalem, który ucinał pozycje menu i zegar. --r-lg: zwinięty pasek nadal jest pigułką. */
@media (max-width: 767.98px) {
  :root:not(:has(link[href*="style_jury.css"])) .navbar.fixed-top {
    border-radius: var(--r-lg);
  }
}
/* pasek poniżej 1280 px: przyciski łamały się na 2 linie, zegar wychodził poza ekran (1024 px) */
@media (min-width: 768px) and (max-width: 1279.98px) {
  :root:not(:has(link[href*="style_jury.css"])) .navbar.fixed-top {
    padding-inline: 8px;
  }
  :root:not(:has(link[href*="style_jury.css"])) .navbar .nav-link {
    padding-inline: 8px !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) .navbar .btn {
    white-space: nowrap;
    font-size: var(--fs-sm);
    padding-inline: 10px;
  }
  /* [DOM] "Enable Notifications": zostaje sama ikona (tekst nadal w DOM dla czytników ekranu) */
  :root:not(:has(link[href*="style_jury.css"])) #notify_enable .btn,
  :root:not(:has(link[href*="style_jury.css"])) #notify_disable .btn {
    font-size: 0;
  }
  :root:not(:has(link[href*="style_jury.css"])) #notify_enable .btn i,
  :root:not(:has(link[href*="style_jury.css"])) #notify_disable .btn i {
    font-size: var(--fs-md);
  }
  :root:not(:has(link[href*="style_jury.css"])) #timeleft {
    padding-inline: 8px;
    font-size: var(--fs-sm);
  }
}
/* [DOM] /team: kolumna treści pytań do Jury przy wąskim oknie łamała się po jednym słowie */
:root:not(:has(link[href*="style_jury.css"])) .data-table td:last-child {
  min-width: 14ch;
}
/* telefon: tabela pytań z 5 kolumnami miała 450 px przy 351 px miejsca (padding 14 px i powyższe
   14ch), a cała strona /team przewijała się w poziomie. Węższy padding i bez 14ch mieści się. */
@media (max-width: 575.98px) {
  :root:not(:has(link[href*="style_jury.css"])) .table > :not(caption) > * > * {
    padding-inline: 6px;
  }
  :root:not(:has(link[href*="style_jury.css"])) .data-table td:last-child {
    min-width: 0;
  }
}

/* ============ 9d. Ikony: kontur Tafli zamiast glifów Font Awesome ============ */
/* [DOM] DOMjudge rysuje ikony Font Awesome 6 (pełne glify w ::before). Podmieniamy glif na maskę
   z ikoną Lucide (icons/, licencja ISC, stroke 1,6 jak --icon-sw Tafli) w kolorze currentColor.
   Ikona FA spoza tej listy zostaje glifem FA; po zmianie wersji DOMjudge sprawdzić nowe ikony. */
:root:not(:has(link[href*="style_jury.css"])) :is(.fa-arrow-right, .fa-bell, .fa-bell-slash, .fa-book-open, .fa-clock, .fa-cloud-upload-alt, .fa-envelope, .fa-file-archive, .fa-file-pdf, .fa-filter, .fa-home, .fa-list-ol, .fa-medal, .fa-question-circle, .fa-sign-out-alt, .fa-sign-in-alt, .fa-thumbs-down, .fa-thumbs-up, .fa-trophy, .fa-heart)::before {
  content: "";
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  vertical-align: -0.2em;
  background-color: currentColor;
  -webkit-mask: var(--tafla-icon) center / contain no-repeat;
  mask: var(--tafla-icon) center / contain no-repeat;
}
:root:not(:has(link[href*="style_jury.css"])) .fa-arrow-right { --tafla-icon: url(icons/arrow-right.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-bell { --tafla-icon: url(icons/bell.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-bell-slash { --tafla-icon: url(icons/bell-off.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-book-open { --tafla-icon: url(icons/book-open.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-clock { --tafla-icon: url(icons/clock.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-cloud-upload-alt { --tafla-icon: url(icons/cloud-upload.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-envelope { --tafla-icon: url(icons/mail.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-file-archive { --tafla-icon: url(icons/file-archive.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-file-pdf { --tafla-icon: url(icons/file-text.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-filter { --tafla-icon: url(icons/funnel.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-home { --tafla-icon: url(icons/house.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-list-ol { --tafla-icon: url(icons/list-ordered.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-medal { --tafla-icon: url(icons/medal.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-question-circle { --tafla-icon: url(icons/circle-help.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-sign-out-alt { --tafla-icon: url(icons/log-out.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-sign-in-alt { --tafla-icon: url(icons/log-in.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-thumbs-down { --tafla-icon: url(icons/thumbs-down.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-thumbs-up { --tafla-icon: url(icons/thumbs-up.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-trophy { --tafla-icon: url(icons/trophy.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fa-heart { --tafla-icon: url(icons/heart.svg); }
:root:not(:has(link[href*="style_jury.css"])) .fas.fa-heart { --tafla-icon: url(icons/heart-filled.svg); }

/* ============ 9e. Przełącznik motywu (js/custom/tafla-theme.js) ============ */
/* szklany przycisk-kółko jak .rt/.btn-secondary Tafli; ikona: auto / jasny / ciemny */
:root:not(:has(link[href*="style_jury.css"])) .tafla-theme-toggle {
  --tafla-icon: url(icons/sun-moon.svg);
  width: 32px;
  height: 32px;
  padding: 0;
  margin-right: 8px;
  color: var(--text);
  background: var(--btn-glass);
  border: 1px solid var(--btn-glass-rim);
  border-radius: var(--r-pill);
  box-shadow: inset 0 1px 0 var(--hi), 0 1px 3px rgba(0, 0, 0, .06);
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-theme-toggle[data-mode="light"] {
  --tafla-icon: url(icons/sun.svg);
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-theme-toggle[data-mode="dark"] {
  --tafla-icon: url(icons/moon.svg);
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-theme-toggle::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: var(--tafla-icon) center / contain no-repeat;
  mask: var(--tafla-icon) center / contain no-repeat;
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-theme-toggle:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--btn-glass) 60%, var(--raised));
  border-color: var(--btn-glass-rim);
}

/* ============ 9f. Zegar po polsku (js/custom/tafla-translate.js) ============ */
/* [DOM] updateClock() w domjudge.js porównuje tekst #timeleft z „start delayed” i „no contest”,
   więc tekstu w DOM nie zmieniamy: tłumaczenie jest w data-pl, oryginał ma rozmiar 0. */
:root:not(:has(link[href*="style_jury.css"])) #timeleft[data-pl] {
  font-size: 0;
  /* działa dzięki display: inline-block z sekcji 3: jako inline przy font-size: 0 pigułka miała
     8 px wysokości (sam padding) i była paskiem pod tekstem */
}
:root:not(:has(link[href*="style_jury.css"])) #timeleft[data-pl]::before {
  content: attr(data-pl);
  font-size: var(--fs-md);
}
@media (min-width: 768px) and (max-width: 1279.98px) {
  :root:not(:has(link[href*="style_jury.css"])) #timeleft[data-pl]::before {
    font-size: var(--fs-sm);
  }
}

/* ============ 9g. Strona główna uczestnika (/team, team/partials/index_content.html.twig) ============ */
/* [AMUR] treść do 1280 px na środku: na szerokim monitorze lista zgłoszeń nie rozjeżdża się na boki */
:root:not(:has(link[href*="style_jury.css"])) body > .container-fluid:has(#teamscoresummary) {
  max-width: 1280px;
  margin-inline: auto;
}
/* [AMUR] karta wyniku: miejsce, rozwiązane i czas karny jako duże liczby z podpisami zamiast
   jednego wiersza tabeli rankingu; litery zadań zostają w nagłówku nad komórkami stanu */
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard {
  background: var(--raised);
  border-radius: var(--r-card);
  box-shadow: var(--card-shadow);
  border-collapse: separate;
  padding: 10px 16px 14px;
}
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard thead th:nth-child(-n+3) {
  font-size: 0;
}
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td:is(.scorepl, .scorenc, .scorett) {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: var(--fw-display);
  line-height: 1.1;
  text-align: center;
  vertical-align: top;
  padding: 6px 14px 0;
}
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td:is(.scorepl, .scorenc, .scorett)::after {
  display: block;
  margin-top: 4px;
  font-family: var(--font-ui);
  font-size: var(--fs-xs);
  font-weight: var(--fw-btn);
  color: var(--text-3);
}
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.scorepl::after { content: "Miejsce"; }
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.scorenc::after { content: "Rozwiązane"; }
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.scorett::after { content: "Czas karny"; }
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.scoretn {
  font-size: var(--fs-lg);
  font-weight: var(--fw-strong);
  vertical-align: top;
  padding-top: 10px;
}
/* [AMUR] zadanie bez prób: szary kafelek zamiast pustej komórki, żeby rząd stanów był pełny */
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.score_cell:not(:has(a))::before {
  content: "";
  display: block;
  min-height: 34px;
  border-radius: var(--r-xs);
  background: var(--line);
}
/* [AMUR] sekcje „Zgłoszenia” oraz „Komunikaty” z „Twoimi pytaniami” jako karty z nagłówkiem w środku */
:root:not(:has(link[href*="style_jury.css"])) .row > .col:has(> h1.teamoverview) {
  display: flex;
  flex-direction: column;
  background: var(--raised);
  border-radius: var(--r-card);
  box-shadow: var(--card-shadow);
  padding: 4px 18px 18px;
  margin: 0 8px;
}
:root:not(:has(link[href*="style_jury.css"])) .col > h1.teamoverview {
  margin-top: 14px;
}
:root:not(:has(link[href*="style_jury.css"])) .col > h1.teamoverview ~ h1.teamoverview {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
/* [DOM] puste stany w jednym neutralnym stylu: DOMjudge daje „Brak zgłoszeń” jako ostrzeżenie
   (alert-warning, na starcie wyglądało jak błąd), a „Brak komunikatów” i „Brak pytań” kursywą */
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > .alert.alert-warning,
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > p.nodata {
  background: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 0;
  color: var(--text-3);
  font-style: normal;
  font-size: var(--fs-md);
  padding: 2px 4px;
  margin: 0;
}
/* [AMUR] „Zadaj pytanie” po prawej od nagłówka „Twoje pytania”, jak akcja w nagłówku sekcji:
   kolumna jako zawijany wiersz (flex-wrap), nagłówek i przycisk dzielą linię, reszta zajmuje
   pełną szerokość; kolejność przez order, szablon DOMjudge bez zmian */
:root:not(:has(link[href*="style_jury.css"])) .row > .col:has(> h1.teamoverview) {
  flex-flow: row wrap;
  align-content: flex-start;
}
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > * {
  flex: 0 0 100%;
  min-width: 0;
}
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > h1.teamoverview:nth-of-type(2) {
  order: 1;
  flex: 1 1 auto;
}
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > .m-1:has(> a.btn) {
  order: 2;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  margin: 0 !important;
}
/* linia oddzielająca sekcje biegnie także pod przyciskiem, więc ma te same odstępy co nagłówek */
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > h1.teamoverview ~ .m-1:has(> a.btn) {
  margin-top: 20px !important;
  padding: 10px 4px 2px;
  border-top: 1px solid var(--line);
}
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) > h1.teamoverview:nth-of-type(2) ~ :not(.m-1) {
  order: 3;
}
/* [AMUR] telefon: karty sekcji jedna pod drugą z odstępem, bez przewijania w poziomie
   (boczny margines kart przy pełnej szerokości wypychał drugą kartę o 9 px) */
@media (max-width: 767.98px) {
  :root:not(:has(link[href*="style_jury.css"])) .row > .col:has(> h1.teamoverview) {
    flex-basis: 100%;
    margin: 0 0 12px;
  }
}
/* [AMUR] podpis „Czas karny” w jednej linii, kafelki zadań bez prób oddzielone jak litery nad nimi,
   a wiersz liter bez nieprzezroczystego tła przyklejonego nagłówka rankingu (tłem jest karta) */
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td:is(.scorepl, .scorenc, .scorett)::after {
  white-space: nowrap;
}
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .desktop-scoreboard td.score_cell:not(:has(a))::before {
  margin: 0 2px;
}
:root:not(:has(link[href*="style_jury.css"])) #teamscoresummary .scoreheader th {
  background: none;
}
/* [AMUR] tabele zgłoszeń, komunikatów i pytań w kartach sekcji bez własnego tła i cienia
   (ogólna reguła .table), żeby nie było karty w karcie */
:root:not(:has(link[href*="style_jury.css"])) .col:has(> h1.teamoverview) .table {
  background: none;
  box-shadow: none;
}

/* ============ 9h. Przed startem konkursu ============ */
/* [AMUR] strona startowa uczestnika: powitanie i godzina startu w karcie na środku; DOMjudge daje
   godzinie srebrny kolor (#C0C0C0, ok. 1,8:1 na jasnym tle) i wiesza oba napisy na tapecie */
:root:not(:has(link[href*="style_jury.css"])) [data-ajax-refresh-target]:has(> #contestnotstarted) {
  max-width: 560px;
  margin: 48px auto 0;
  padding: 28px 32px 30px;
  background: var(--raised);
  border-radius: var(--r-card);
  box-shadow: var(--card-shadow);
  text-align: center;
}
:root:not(:has(link[href*="style_jury.css"])) #teamwelcome {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: var(--fw-display);
  letter-spacing: var(--display-ls);
  margin: 0 0 10px;
}
:root:not(:has(link[href*="style_jury.css"])) #contestnotstarted {
  color: var(--text-2);
  font-size: 18px;
  font-weight: var(--fw-btn);
  margin: 0;
}
/* [DOM] ranking przed startem: DOMjudge pokazuje pod kartą konkursu uczelnie według kategorii (układ
   finałów ICPC, nie lista uczestników) i dwie puste karty jako wypełnienie kolumn; na AMUR jest jedna
   uczelnia, a puste karty z cieniem motywu rysowały się jako pasek pod kartą konkursu */
:root:not(:has(link[href*="style_jury.css"])) .card:has(#contesttimer) ~ .row:has(.list-group-flush) {
  display: none;
}
/* [AMUR] formularz wysyłania: podpowiedzi „Wybierz zadanie” i „Wybierz język” (pusta opcja Symfony)
   zostają napisem domyślnym w polu, ale nie ma ich na liście do wybrania; pola są wymagane, więc
   bez wyboru przeglądarka i tak nie wyśle formularza */
:root:not(:has(link[href*="style_jury.css"])) :is(#submit_problem_problem, #submit_problem_language) > option[value=""] {
  display: none;
}

/* ============ 9i. Własne okno potwierdzenia (js/tafla-confirm.js) ============ */
/* [AMUR] zamiast systemowego confirm() z adresem serwera w nagłówku: arkusz szkła jak okna Bootstrapa,
   tytuł AMUR, treść z podziałem linii (potwierdzenie wysłania ma plik, zadanie i język w osobnych liniach) */
:root:not(:has(link[href*="style_jury.css"])) dialog.tafla-confirm {
  border: 0;
  border-radius: var(--r-lg);
  padding: 22px 24px 18px;
  width: min(440px, calc(100vw - 32px));
  background: var(--panel-strong);
  color: var(--text);
  box-shadow: var(--glass-edge), var(--shadow-3);
  -webkit-backdrop-filter: var(--blur);
  backdrop-filter: var(--blur);
}
/* ::backdrop nie dziedziczy zmiennych motywu w starszych przeglądarkach, więc kolor wprost */
:root:not(:has(link[href*="style_jury.css"])) dialog.tafla-confirm::backdrop {
  background: rgba(0, 0, 0, .35);
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-confirm-title {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: var(--fw-display);
  margin: 0 0 10px;
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-confirm-text {
  white-space: pre-line;
  font-size: var(--fs-md);
  color: var(--text-2);
  margin: 0 0 18px;
}
:root:not(:has(link[href*="style_jury.css"])) .tafla-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* ============ 9j. Tabele zgłoszeń, komunikatów i pytań ============ */
/* [DOM] DOMjudge owija w link tylko treść każdej komórki, więc klikalne było ok. 35-55% wiersza;
   pierwszy link w wierszu dostaje niewidoczną warstwę na cały wiersz (wzorzec stretched link
   z Bootstrapa). Wiersz bez linku (zgłoszenie TOO-LATE po końcu konkursu) zostaje bez zmian. */
:root:not(:has(link[href*="style_jury.css"])) .data-table tbody tr:has(> td > a[href]) {
  position: relative;
  cursor: pointer;
}
:root:not(:has(link[href*="style_jury.css"])) .data-table tbody tr > td:first-child > a[href]::after {
  content: "";
  position: absolute;
  inset: 0;
}
/* [AMUR] treść pytań i komunikatów to Markdown: „# tekst” dawał nagłówek h1 w komórce tabeli
   i w oknie komunikatu; nagłówki w treści wyglądają jak pogrubiony tekst */
:root:not(:has(link[href*="style_jury.css"])) :is(.data-table td, .card-text) :is(h1, h2, h3, h4, h5, h6) {
  font-size: inherit;
  font-weight: var(--fw-strong);
  line-height: inherit;
  margin: 0 0 .25em;
}

/* [AMUR] licznik znaków pod treścią pytania do jury (js/tafla-submit.js, limit 2000) */
:root:not(:has(link[href*="style_jury.css"])) .tafla-counter {
  margin-top: 4px;
  text-align: right;
  font-size: var(--fs-xs);
  color: var(--text-3);
}
/* [AMUR] długie pytanie albo komunikat w tabeli: najwyżej 3 linie, całość w oknie po kliknięciu
   wiersza; bez tego jedno długie pytanie rozpychało tabelę na całą stronę */
:root:not(:has(link[href*="style_jury.css"])) .data-table:not(.submissions-table) td:last-child > a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  overflow-wrap: anywhere;
}

/* ============ 10. Dostępność: ruch i przezroczystość (material.css) ============ */
@media (prefers-reduced-motion: reduce) {
  :root:not(:has(link[href*="style_jury.css"])) .btn:active:not(:disabled),
  :root:not(:has(link[href*="style_jury.css"])) .card:hover {
    transform: none;
  }
}
@media (prefers-reduced-transparency: reduce) {
  :root:not(:has(link[href*="style_jury.css"])) .navbar,
  :root:not(:has(link[href*="style_jury.css"])) #loginform,
  :root:not(:has(link[href*="style_jury.css"])) .modal-content,
  :root:not(:has(link[href*="style_jury.css"])) .dropdown-menu,
  :root:not(:has(link[href*="style_jury.css"])) .alert {
    background: var(--solid) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) .card,
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr td {
    background: var(--solid-2) !important;
  }
}
/* „Zwiększ kontrast”: pełne powierzchnie jak wyżej i drugorzędny tekst zamiast trzeciorzędnego */
@media (prefers-contrast: more) {
  :root:not(:has(link[href*="style_jury.css"])) {
    --text-3: var(--text-2);
    --line: var(--line-3);
    --row-line: var(--line-2);
  }
  :root:not(:has(link[href*="style_jury.css"])) .navbar,
  :root:not(:has(link[href*="style_jury.css"])) #loginform,
  :root:not(:has(link[href*="style_jury.css"])) .modal-content,
  :root:not(:has(link[href*="style_jury.css"])) .dropdown-menu,
  :root:not(:has(link[href*="style_jury.css"])) .alert {
    background: var(--solid) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) .card,
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard tbody tr td {
    background: var(--solid-2) !important;
  }
}
/* brak backdrop-filter: szkło bez rozmycia byłoby prześwitujące, więc pełne tła (tafla-tokens.css:258) */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root:not(:has(link[href*="style_jury.css"])) .navbar,
  :root:not(:has(link[href*="style_jury.css"])) #loginform,
  :root:not(:has(link[href*="style_jury.css"])) .modal-content,
  :root:not(:has(link[href*="style_jury.css"])) .dropdown-menu,
  :root:not(:has(link[href*="style_jury.css"])) .alert {
    background: var(--solid) !important;
  }
}

/* ============ 11. Tryb rzutnika (js/custom/tafla-projector.js, /public#projector) ============ */
/* Prefiks :root.tafla-projector:not(:has(...)) ma wyższą specyficzność niż reguły ogólne motywu,
   więc rozmiary trybu rzutnika zawsze wygrywają (wcześniej html.tafla-projector przegrywał). */
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .navbar,
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .progress,
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) #filter-toggle {
  display: none !important;
}
/* [DOM] serduszko jest osobną komórką td.heart; display: none wyjmowało ją z wiersza i wszystkie
   wyniki przesuwały się o kolumnę w lewo (wynik zadania A pod nagłówkiem SCORE). Ukrywamy tylko
   ikonę (span.heart w td.heart): ukryta komórka traciła też szklane tło i w wierszu była dziura. */
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard td.heart > * {
  visibility: hidden;
}
/* karta z nazwą i stanem konkursu oraz komunikat o freeze: 13,5 px nie da się przeczytać z sali */
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .card-header {
  font-size: 20px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .alert {
  font-size: 18px !important;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) body {
  padding-top: 12px !important;
  overflow: hidden;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard {
  width: 96vw;
  font-size: 1.3rem;
}
/* [DOM] DOMjudge ustawia stałe rozmiary w komórkach, więc powiększenie tabeli do nich nie dociera */
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard .scoretn {
  font-size: 22px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard .univ {
  font-size: 15px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard .scorepl,
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard .scorett {
  font-size: 19px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard .scorenc {
  font-size: 28px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard td.score_cell div {
  font-size: 21px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard td.score_cell div span {
  font-size: 14px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreheader th {
  font-size: var(--fs-lg);
  padding-top: 0;   /* bez paska nie ma czego omijać (sekcja 8) */
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreboard:has(> thead > .scoreheader) {
  margin-top: 0;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .scoreheader .problem-badge {
  font-size: 19px;
}
:root.tafla-projector:not(:has(link[href*="style_jury.css"])) .banner {
  max-height: 14ex;
}

/* Ikona "hamburgera": Bootstrap wkleja SVG o stałym kolorze zależnym od .navbar-dark/-light
   (zespół: dark, publiczny: light). Maska z tym samym kształtem + kolor tekstu motywu. */
:root:not(:has(link[href*="style_jury.css"])) .navbar .navbar-toggler {
  border-color: var(--btn-glass-rim);
  border-radius: var(--r-pill);
}
:root:not(:has(link[href*="style_jury.css"])) .navbar .navbar-toggler-icon {
  background-image: none;
  background-color: var(--text);
  -webkit-mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23000' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") center / 100% no-repeat;
  mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23000' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") center / 100% no-repeat;
}

/* ============ 12. Druk (np. wywieszony ranking końcowy) ============ */
/* Wydruk jest zawsze w jasnym motywie: bloki ciemnego działają tylko na ekranie (sekcja 1).
   Przeglądarka domyślnie nie drukuje teł, więc chowamy nawigację i efekty szkła, a kolory
   komórek rankingu i liter zadań wymuszamy (print-color-adjust), żeby było widać wyniki. */
@media print {
  :root:not(:has(link[href*="style_jury.css"])) {
    background: none;
    /* mniejsza skala pisma, żeby pełny ranking zmieścił się na szerokość pionowej A4 */
    --fs-xs: 7pt;
    --fs-sm: 8pt;
    --fs-md: 9pt;
    --fs-lg: 10pt;
  }
  :root:not(:has(link[href*="style_jury.css"])) body {
    padding-top: 0 !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) .navbar,
  :root:not(:has(link[href*="style_jury.css"])) .progress,
  :root:not(:has(link[href*="style_jury.css"])) [data-progress-bar],
  :root:not(:has(link[href*="style_jury.css"])) #filter-toggle,
  :root:not(:has(link[href*="style_jury.css"])) .dropdown,
  :root:not(:has(link[href*="style_jury.css"])) .tafla-theme-toggle {
    display: none !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) * {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  /* Krawędź szkła (::before z maską, sekcja 2): przy prawdziwym druku Chrome pomija maskę
     i gradient zakrywa całą kartę razem z tekstem (emulacja druku tego nie pokazuje). */
  :root:not(:has(link[href*="style_jury.css"])) .navbar::before,
  :root:not(:has(link[href*="style_jury.css"])) .card::before,
  :root:not(:has(link[href*="style_jury.css"])) #loginform::before,
  :root:not(:has(link[href*="style_jury.css"])) .modal-content::before {
    display: none !important;
  }
  /* [DOM] nazwa konkursu w karcie rankingu powtarza baner: przy banerze drukujemy tylko status
     (start i koniec, „wyniki końcowe”), który mówi, czy wydruk jest ostateczny */
  :root:not(:has(link[href*="style_jury.css"])):has(img.banner) .card-header:has(#contesttimer) .row > :first-child {
    display: none;
  }
  :root:not(:has(link[href*="style_jury.css"])):has(img.banner) .card-header:has(#contesttimer) .row > :last-child {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center !important;   /* Bootstrap: text-md-end / text-start z !important */
  }
  /* mniej pustego miejsca pod banerem (na ekranie 32 px odstępu i szklana karta) */
  :root:not(:has(link[href*="style_jury.css"])) img.banner {
    margin-bottom: 4px;
  }
  :root:not(:has(link[href*="style_jury.css"])) .card-header:has(#contesttimer) {
    padding-block: 2px;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard td.score_cell,
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard td.score_cell *,
  :root:not(:has(link[href*="style_jury.css"])) .problem-badge {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard tr {
    break-inside: avoid;
  }
  /* [DOM] pionowa A4 ma ok. 718 px, mniej niż próg md Bootstrapa (768 px), więc DOMjudge
     drukowałby ranking mobilny (same litery zadań, bez czasów i prób). Wymuszamy pełną tabelę
     z legendą i zmniejszamy ją, żeby 10 zadań zmieściło się na szerokość kartki. */
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard {
    display: table !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) #cell_legend {
    display: flex !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.mobile-scoreboard {
    display: none !important;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard {
    width: 100%;
    font-size: 9pt;
  }
  /* szerokość rozpychały najdłuższa nazwa drużyny (bez łamania) i min-width komórek zadań
     ze style_domjudge.css: tabela miała 1220 px przy 703 px strony */
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard .scoretn,
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard .forceWidth {
    white-space: normal;
    max-width: 14em;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard td.score_cell {
    min-width: 0;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard td.score_cell div {
    margin: 1px;
  }
  /* [DOM] serduszko (ulubione drużyny) na papierze nic nie znaczy; display: none przesunąłby
     wyniki o kolumnę (nagłówek liczy tę komórkę w colspan), więc zwężamy ją do zera */
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard td.heart {
    width: 0;
    padding: 0;
  }
  :root:not(:has(link[href*="style_jury.css"])) .scoreboard.desktop-scoreboard td.heart * {
    display: none;
  }
}