/* SpiFi – Design des Modus default (erzeugt aus modes.j_config) */
html:root {
  --primary: #ffcf2d;
  --primary-fg: #2f2e7d;
  --primary-hover: #ffd546;
  --primary-3d: #cca624;
  --berry: #f04770;
  --berry-light: #fcdae2;
  --berry-dark: #c8264f;
  --die-berry: #fabfcd;
  --cream: #fffbf0;
  --radius: 22px;
  --r-lg: 27.5px;
  --r-md: 14px;
  --r-sm: 10.5px;
  --r-xs: 7px;
  --r-pill: 999px;
  --die-radius: 15%;
  --dice-scale: 1;
  --btn-scale: 1;
  --board-color: #a6ebe1;
  --font-head: 'Lilita One', 'Baloo 2 Variable', 'Rubik Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --head-weight: 400;
  --head-tracking: 0.01em;
  --font-body: 'Inter Variable', 'Noto Sans Arabic Variable', system-ui, sans-serif;
  --font-btn: 'Lilita One', 'Baloo 2 Variable', 'Rubik Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --btn-weight: 400;
  --btn-tracking: 0.02em;
  --btn-size: 1.2rem;
  --btn-big-size: 1.6rem;
  --font-die: 'Lilita One', 'Baloo 2 Variable', 'Rubik Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --die-font: 1;
  --die-weight: 400;
}

/* Schrift deckt latin-ext nicht ab → Ersatzschrift */
html:root:is(:lang(tr), :lang(hu), :lang(sl), :lang(hr), :lang(pl), :lang(ro)) {
  --font-head: 'Baloo 2 Variable', 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --head-weight: 800;
  --head-tracking: 0;
  --font-btn: 'Baloo 2 Variable', 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --btn-weight: 700;
  --btn-tracking: 0;
  --btn-size: 1.15rem;
  --btn-big-size: 1.5rem;
  --font-die: 'Baloo 2 Variable', 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --die-font: 0.9;
  --die-weight: 800;
}

/* Schrift deckt cyrillic nicht ab → Ersatzschrift */
html:root:is(:lang(uk)) {
  --font-head: 'Rubik Variable', system-ui, sans-serif;
  --head-weight: 700;
  --head-tracking: 0;
  --font-btn: 'Rubik Variable', system-ui, sans-serif;
  --btn-weight: 600;
  --btn-tracking: 0;
  --btn-size: 1.1rem;
  --btn-big-size: 1.4rem;
  --font-die: 'Rubik Variable', system-ui, sans-serif;
  --die-font: 0.85;
  --die-weight: 700;
}

/* Schrift deckt arabic nicht ab → Ersatzschrift */
html:root:is(:lang(ar)) {
  --font-head: 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --head-weight: 800;
  --head-tracking: 0;
  --font-body: 'Noto Sans Arabic Variable', system-ui, sans-serif;
  --font-btn: 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --btn-weight: 700;
  --btn-tracking: 0;
  --btn-size: 1.15rem;
  --btn-big-size: 1.5rem;
  --font-die: 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --die-font: 0.9;
  --die-weight: 800;
}

/* Eigenes Design spifi (Grunddesign colorful) */
html:root[data-design="spifi"] {
  --d-ground: #fffef0;
  --d-surface: #ffffff;
  --d-text-soft: #3a3860;
  --d-muted: #5a587e;
  --d-line: #d9d5bf;
  --d-link: #c8264f;
  --d-primary-bg: #ffcf2d;
  --d-primary-fg: #27237f;
  --d-primary-hover: #ffd84f;
  --d-secondary-bg: #ffffff;
  --d-shadow-color: #fffef0;
  --d-badge-bg: #fff1b8;
  --d-chip-bg: #ffffff;
  --d-tile-1: #dff5f1;
  --d-tile-2: #dcebfa;
  --d-tile-3: #fff1b8;
  --d-track: #ece9d6;
  --d-partner-bg: #ffffff;
  --d-die-ex-1: #ffcf2d;
  --d-h1: 38px;
  --d-text-size: 18px;
  --d-primary-h: 64px;
  --d-primary-size: 26px;
  --d-secondary-h: 56px;
  --d-timer-size: 60px;
  --d-border-w: 2px;
  --d-depth: 6px;
  --d-tile-depth: 4px;
  --d-r-card: 18px;
  --d-r-primary: 999px;
  --d-r-secondary: 999px;
  --d-r-chip: 22px;
  --d-r-tile: 14px;
}
html:root[data-design="spifi"]:is(:lang(de), :lang(en), :lang(fr), :lang(it), :lang(es), :lang(nl)) {
  --d-font-display: 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --d-display-weight: 900;
  --d-display-stretch: 100%;
  --d-font-text: 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
}
html:root[data-design="spifi"]:is(:lang(tr), :lang(hu), :lang(sl), :lang(hr), :lang(pl), :lang(ro)) {
  --d-font-display: 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --d-display-weight: 900;
  --d-display-stretch: 100%;
  --d-font-text: 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
}
html:root[data-design="spifi"]:is(:lang(uk)) {
  --d-font-display: 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --d-display-weight: 900;
  --d-display-stretch: 100%;
  --d-font-text: 'Nunito Variable', 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
}
html:root[data-design="spifi"]:is(:lang(ar)) {
  --d-font-display: 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
  --d-display-weight: 800;
  --d-display-stretch: 100%;
  --d-font-text: 'Baloo Bhaijaan 2 Variable', system-ui, sans-serif;
}