/* ============================================================
   KOREKTA v0.3
   1) siatka w tle: osobny token --grid; w trybie ciemnym cieplejsza
      i znacznie słabsza niż zwykłe odwrócenie koloru linii
   2) monospace tylko tam, gdzie niesie znaczenie (dane, kod,
      wartości techniczne); reszta na krój tytułowy albo tekstowy
   ============================================================ */
:root{
  /* v0.8: siatka traci zielonkawy odcien razem z reszta palety. Na tle
     #F5F5F7 linia #E3E3E8 jest widoczna, ale nie rysuje sie przed trescia.
     W trybie ciemnym rezygnujemy z cieplej, piaskowej linii na rzecz
     neutralnej bieli o niskim kryciu - na czerni Apple cieply odcien
     czytal sie jak zabrudzenie. Modul 80px bez zmian. */
  --grid:#E3E3E8;
  --mono:Monaco,"PT Mono","Andale Mono","DejaVu Sans Mono","Courier New",monospace;
}
@media (prefers-color-scheme:dark){:root{--grid:rgba(255,255,255,.05)}}
:root[data-theme="dark"]{--grid:rgba(255,255,255,.05)}
:root[data-theme="light"]{--grid:#E3E3E8}
body{
  background-image:
    repeating-linear-gradient(to right,transparent 0 79px,var(--grid) 79px 80px),
    repeating-linear-gradient(to bottom,transparent 0 79px,var(--grid) 79px 80px);
}
/* --- mono schodzi z elementów, które nie są danymi --- */
.label,.rail,.chip,.nav a,.nav-summary,.tgl,.crumbs,.codehead,.pc h4,.money .kicker,
.sponsor-tag,.spon-strip,.advertiser .ah,.brand small,.rank .pos b,
table.cmp thead th{
  font-family:var(--display);
}
.label,.chip,.nav a,.nav-summary,.tgl,.crumbs,.codehead,.pc h4,.money .kicker,
.sponsor-tag,.advertiser .ah,.brand small,.rank .pos b,table.cmp thead th{
  letter-spacing:.1em;
}
.label{font-size:12px;letter-spacing:.13em}
.rail{font-size:12.5px;letter-spacing:.09em;line-height:1.45}
.rail b{letter-spacing:.11em}
.nav a,.nav-summary{font-size:13px}
.crumbs{font-size:12.5px}
.chip{font-size:11.5px}
.codehead{font-size:12px}
.pc h4{font-size:12.5px;letter-spacing:.13em}
.money .kicker{font-size:12px}
.sponsor-tag{font-size:11.5px;letter-spacing:.13em}
.spon-strip{font-size:12.5px;letter-spacing:.14em}
.spon-strip span{font-family:var(--body);letter-spacing:0;font-size:14px;text-transform:none}
.advertiser .ah{font-size:12px}
.brand small{font-size:10.5px;letter-spacing:.13em}
.rank .pos b{font-size:10.5px}
table.cmp thead th{font-size:11.5px}
/* metadane, podpisy, spis treści i etykiety wykresów: krój tekstowy */
.meta,.byline,.toc,.tilebox figcaption,.notice,.disclosure,
.specs th,.bar span:first-child,.advertiser dt,.advertiser dd{
  font-family:var(--body);
}
.meta{font-size:14.5px;line-height:1.5}
.byline{font-size:14.5px;gap:14px}
.byline .dot{font-family:var(--display);font-size:12px;letter-spacing:.06em}
.toc{font-size:15px;line-height:1.45}
.toc li::before{font-family:var(--mono);font-size:11.5px}
.tilebox figcaption{font-size:14.5px;letter-spacing:0}
.notice{font-size:14.5px;line-height:1.6}
.specs th{font-size:15px}
.bar{font-family:var(--mono);font-size:11px}
.bar span:first-child{font-family:var(--display);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.advertiser dt{font-size:14.5px;color:var(--ink-3)}
.advertiser dd{font-size:14.5px}
/* mono zostaje wyłącznie na: table.cmp tbody, .specs td, pre/code,
   liczby ocen w .bar, numeracja spisu treści, etykiety na diagramach SVG */
/* wyroznienie w tytule: jedyna definicja siedzi w base.css (kolor akcentu).
   Byl tu wariant ochrowego paska malowanego per wiersz - martwy, bo nadpisywany. */
/* spis treści: krój tekstowy, bez wersalików odziedziczonych po .rail */
.toc{text-transform:none;letter-spacing:0}
.toc b{text-transform:uppercase;letter-spacing:.11em;font-family:var(--display);font-size:12.5px}
/* w tabeli porównawczej mono zostaje na ocenach; opisy czyta się serifem */
table.cmp td{font-family:var(--body);font-size:15.5px;line-height:1.45}
table.cmp td.sc{font-family:var(--mono);font-size:14px}
/* pasek oceny: etykieta nie może zjadać toru paska */
.bar{grid-template-columns:104px minmax(0,1fr) 34px}
.bar span:first-child{font-size:11px;letter-spacing:.06em}
.bar i{min-width:0}