/* =============================================================================
   kartenspiele-kostenlos.de — оформление поверх общего site.css
   (подключается настройкой THEME_CSS в config.php, 24.09.2026).

   Облик «Filz» из макета: тёмно-зелёная обвязка, зелёное сукно движка,
   медный акцент #f28c4b, заголовки — Archivo, текст — Manrope (как в site.css).
   Здесь только цвета, шрифты и мелочи логотипа; раскладка — в site.css.
   ========================================================================== */

@font-face{font-family:Archivo;src:url(fonts/archivo-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-800-normal.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-900-normal.woff2) format('woff2');font-weight:900;font-display:swap}

/* ------------------------------------------------ тёмная тема (по умолчанию) */
:root{
  --ff-dis:Archivo,"Segoe UI",-apple-system,sans-serif;
  --suit:#d42a3c;

  --chrome:#121b14; --chrome-2:#1a261c; --chrome-line:#2b3b2d;
  --page:#0e1510;   --panel:#162018;    --panel-2:#1c281e;
  --line:#253427;   --line-soft:#1d2a1f;
  --txt:#eef3ec;    --txt-2:#b2c0b0;    --txt-3:#8c9a8a;
  --accent:#f28c4b; --accent-ink:#1d0d02; --accent-soft:rgba(242,140,75,.16);
  --hot:#e2574c;
  --sb-track:#1a2b21; --sb-thumb:#3d7a4b; --sb-hover:#4f9c61;
}
/* ------------------------------------------------------------ светлая тема */
html[data-mode="light"]{
  --chrome:#16301f; --chrome-2:#1d3a27; --chrome-line:#2c4d36;
  --page:#f2f5f1;   --panel:#ffffff;    --panel-2:#f5f8f4;
  --line:#dbe3d8;   --line-soft:#e8eee6;
  --txt:#15201a;    --txt-2:#4b5a50;    --txt-3:#6a786e;
  --accent:#b4541a; --accent-ink:#ffffff; --accent-soft:rgba(180,84,26,.12);
  --hot:#c0392b;
}
/* Обвязка (шапка, панель кнопок, подвал) тёмная в обеих темах, поэтому
   акцент на ней — всегда светлый медный: тёмно-рыжий светлой темы на
   тёмно-зелёном читается плохо. */
html[data-mode="light"] .bar,html[data-mode="light"] .dock,html[data-mode="light"] footer,
html[data-mode="light"] .drop,html[data-mode="light"] .fs-toast{--accent:#f28c4b;--accent-ink:#1d0d02}

/* ------------------------------------------------------------------ логотип */
.logo svg{width:32px;height:32px}
.logo b{font:800 21px/1 var(--ff-dis);letter-spacing:-.015em}
@media (max-width:900px){.logo b{font-size:17.5px}}
@media (max-width:560px){.logo svg{width:27px;height:27px}.logo b{font-size:15.5px}}
@media (max-width:360px){.logo b i{display:none}}   /* самый узкий телефон: «Kartenspiele» */

/* --------------------------------------------------------------- заголовки
   Archivo шире Fraunces и без засечек: чуть меньше трекинг, 800 вместо 900 */
.prose h1,.h h1,.h h2,.today h2{font-weight:800;letter-spacing:-.02em}
.prose h2,.prose h3,.dlg-h h2{letter-spacing:-.012em}
.fs-pause-box b,.fs-win-box>b{font-weight:800;letter-spacing:-.02em}

/* ------------------------------------------------ панель внизу у флеша и рамки
   На телефоне панель встаёт в два ряда: верхний — кнопки движка и часы.
   У флеша и рамки их нет, и верхний ряд оставался пустой полосой — отдаём
   эти 44 px игре. (То же есть на EN/DE — записано для окна EN.) */
@media (max-width:700px), (max-width:900px) and (min-height:700px){
  /* своя игра сайта (Durak, src 'own') — два ряда, как у пасьянсов: сверху «Neues Spiel» */
  body.page-game:not(.has-engine):not([data-src="own"]){--bottom:60px}
  body.page-game:not(.has-engine):not([data-src="own"]) .dock-break{display:none}
}

/* ------------------------------------------------ сукно у рамки и флеша
   Движок рисует у рамок (iframe) и флеша своё сукно bg/bg5.webp («Green baize»),
   а у пасьянсов — родное сукно движка. Здесь у всех страниц игр одно, родное
   (владелец 24.09, 16:07: «на покере другой фон, не дефолтный»). Выбранный
   в «Aussehen» стол site.js ставит поверх (стилем элемента) — он по-прежнему главнее. */
body.page-game:not(.has-engine) .table{background:#1c5c37 url(bg/native.png) repeat}
@media (min-width:1280px){
  body.lay-side:not(.has-engine){background:#1c5c37 url(bg/native.png) repeat fixed}
}

/* ------------------------------------------------ кнопки движка: крупнее
   Neustart, Zurück, Tipp, Anpassen — значки движка: 16 px на тёмном кружке, знак
   внутри ещё вдвое меньше (владелец 24.09, 19:22: «сильно мелкие»). Кружок убираем,
   значок крупнее, знак светлый — как наши значки рядом (пауза, «?»).
   Знак занимает меньше половины своего квадрата, поэтому квадрат большой, а поля
   у кнопки маленькие. */
.dock-eng svg._89_{width:28px !important;height:28px !important;background:none !important;
  box-shadow:none !important;border-radius:0 !important}
.dock-eng svg._89_ path{fill:#e3ece2}
.dock-eng ._87_:hover svg._89_ path{fill:#fff}
@media (min-width:1280px){
  body.side-nav .dock-eng svg._89_{width:36px !important;height:36px !important}
  body.side-nav .dock-eng ._87_:nth-child(n+3){padding:1px 2px !important}
}
@media (min-width:1280px) and (max-width:1499px){
  body.side-nav .dock-eng ._87_:nth-child(2){padding:1px 2px !important}   /* «Neustart» здесь значком */
}
