/*
Theme Name: PolskieOZE
Theme URI: https://polskieoze.pl
Author: Redakcja PolskieOZE
Description: Motyw portalu branżowego o energii odnawialnej. Warstwa prezentacji dla danych dostarczanych przez wtyczkę polskieoze-dane. Dwa kroje pisma: Libre Franklin dla treści, IBM Plex Mono wyłącznie dla odczytów liczbowych.
Version: 2.1.0
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: polskieoze
Tags: news, magazine, energy, two-columns, custom-menu
*/

/* ══════════════════════════════════════════════════════════════
   Arkusz łączony z trzech widoków projektowych:
   strona główna · artykuł · kategoria
   Kolejność ma znaczenie — reguły późniejsze doprecyzowują wcześniejsze.
   ══════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════
   PolskieOZE.pl — system projektowy v2

   TYPOGRAFIA — dwa kroje, nie trzy:
   · Libre Franklin — cała treść. Grotesk z rodowodu Franklin Gothic,
     kroju gazet amerykańskich od 1902 r. Prosty, o mocnych wersjach
     grubych i spokojnym tekście. Komplet polskich znaków.
   · IBM Plex Mono — wyłącznie liczby i etykiety odczytów systemowych.
   Rozróżnienie nagłówek/tekst robimy grubością i światłem, nie
   dokładaniem kolejnej rodziny.
   ══════════════════════════════════════════════════════════════ */
:root{
  --paper:#F0F2EF;
  --surface:#FFFFFF;
  --surface-2:#E7EBE6;
  --grid:#0E1518;
  --grid-2:#162126;

  --ink:#14181A;
  --ink-2:#3D474A;
  --ink-3:#6C7A7D;
  --on-grid:#E8EDEA;
  --on-grid-2:#8FA3A6;

  --green:#0F7D4A;
  --green-d:#0A5C36;
  --green-br:#35C77E;
  --pv:#E9A526;
  --wind:#4EA8C4;

  --rule:#D8DCD6;
  --rule-2:#C3C9C1;
  --rule-dark:#243035;

  --sans:'Libre Franklin',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;

  --gut:24px;
  --max:1280px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:2.5px solid var(--green);outline-offset:2px;border-radius:2px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}

h1,h2,h3,h4,h5{font-weight:700;letter-spacing:-.022em;line-height:1.15}

.eyebrow{
  font-family:var(--mono);font-size:11px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
}

/* ─────────────────────────── PASEK SYSTEMOWY ─────────────────── */
.sysbar{
  background:var(--grid);color:var(--on-grid-2);
  font-family:var(--mono);font-size:11.5px;
  border-bottom:1px solid var(--rule-dark);overflow:hidden;
}
.sysbar .wrap{display:flex;align-items:center;gap:22px;height:34px;white-space:nowrap}
.sysbar .live{color:var(--green-br);display:inline-flex;align-items:center;gap:7px;flex-shrink:0}
.dot{width:6px;height:6px;border-radius:50%;background:var(--green-br);animation:ping 2.4s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(53,199,126,.55)}70%{box-shadow:0 0 0 7px rgba(53,199,126,0)}100%{box-shadow:0 0 0 0 rgba(53,199,126,0)}}
.sysbar b{color:var(--on-grid);font-weight:600}
.sysbar .sep{color:var(--rule-dark)}
.sysbar .roll{flex:1;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 92%,transparent)}
.sysbar .roll-in{display:inline-flex;gap:26px;animation:roll 46s linear infinite;will-change:transform}
@keyframes roll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.sysbar .roll:hover .roll-in{animation-play-state:paused}
.sysbar .q{display:inline-flex;gap:8px;align-items:baseline}
.sysbar .q i{font-style:normal;opacity:.75}
.sysbar .up{color:var(--pv)}
.sysbar .dn{color:var(--wind)}

/* ─────────────────────────── NAGŁÓWEK ────────────────────────── */
.masthead{background:var(--paper);border-bottom:1px solid var(--rule)}
.mast-top{display:flex;align-items:center;gap:26px;padding:16px 0 14px}

.logo{display:flex;align-items:center;gap:12px;flex-shrink:0}
.logo-mark{width:42px;height:42px;flex-shrink:0}
.logo-txt{line-height:1}
.logo-txt .l1{font-weight:800;font-size:23px;letter-spacing:-.035em}
.logo-txt .l1 em{font-style:normal;color:var(--green)}
.logo-txt .l2{
  display:block;font-family:var(--mono);font-size:8px;font-weight:500;
  letter-spacing:.215em;color:var(--ink-3);margin-top:5px;text-transform:uppercase;
}

/* ── sloty partnerskie ── */
.partners{
  display:flex;align-items:center;gap:10px;
  padding-left:26px;border-left:1px solid var(--rule);
}
.p-lbl{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);writing-mode:vertical-rl;transform:rotate(180deg);line-height:1;
}
.p-slot{
  height:42px;min-width:104px;border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--rule);
  transition:border-color .15s,box-shadow .15s;
}
.p-slot:hover{border-color:var(--rule-2);box-shadow:0 1px 5px rgba(20,24,26,.07)}
.p-slot.empty{background:none;border-style:dashed}
.p-slot.empty span{font-family:var(--mono);font-size:9.5px;color:var(--rule-2);letter-spacing:.06em}
.p-badge{display:flex;align-items:center;gap:8px;padding:0 11px}
.p-badge .pb-t{line-height:1.15}
.p-badge .pb-1{font-size:11.5px;font-weight:700;letter-spacing:-.01em}
.p-badge .pb-2{font-family:var(--mono);font-size:7.5px;letter-spacing:.11em;color:var(--ink-3);text-transform:uppercase;margin-top:2px}

.mast-tools{margin-left:auto;display:flex;align-items:center;gap:9px}
.search{
  display:flex;align-items:center;gap:8px;background:var(--surface);
  border:1px solid var(--rule);border-radius:2px;padding:8px 12px;width:180px;
}
.search input{border:none;background:none;outline:none;font:inherit;font-size:14px;width:100%}
.search input::placeholder{color:var(--ink-3)}
.search svg{flex-shrink:0;color:var(--ink-3)}
.btn{
  display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;
  padding:9px 15px;border-radius:2px;background:var(--green);color:#fff;
  white-space:nowrap;transition:background .15s;
}
.btn:hover{background:var(--green-d)}
.btn-ghost{background:none;color:var(--ink);border:1px solid var(--rule-2)}
.btn-ghost:hover{background:var(--surface-2);color:var(--ink)}
.burger{display:none;width:40px;height:40px;align-items:center;justify-content:center}
.burger span{display:block;width:20px;height:2px;background:var(--ink);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--ink)}
.burger span::before{top:-6px}.burger span::after{top:6px}

.mainnav{border-top:1px solid var(--rule)}
.mainnav ul{display:flex;list-style:none;overflow-x:auto;scrollbar-width:none}
.mainnav ul::-webkit-scrollbar{display:none}
.mainnav a{
  display:block;padding:12px 15px;font-size:14px;font-weight:500;white-space:nowrap;
  border-bottom:2px solid transparent;color:var(--ink-2);transition:color .15s,border-color .15s;
}
.mainnav a:first-child{padding-left:0}
.mainnav a:hover{color:var(--ink)}
.mainnav a[aria-current]{color:var(--ink);border-bottom-color:var(--green);font-weight:700}

/* ══════════════════════════════════════════════════════════════
   SYGNATURA — „Doba w systemie"
   ══════════════════════════════════════════════════════════════ */
.doba{background:var(--grid);color:var(--on-grid);padding:32px 0 28px;position:relative;overflow:hidden}

/* ── warstwa tła: krajobraz + realna pozycja słońca ──
   Zmienne --sky-*, --lum, --sat, --sun-* ustawia skrypt na dole
   dokumentu, na podstawie godziny i zachmurzenia. */
.doba-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.scene{
  position:absolute;inset:0;width:100%;height:100%;
  filter:brightness(var(--lum,.7)) saturate(var(--sat,.8));
  transition:filter 1.4s linear;
}
.sky-1{stop-color:var(--sky-1,#0A1220);transition:stop-color 1.4s linear}
.sky-2{stop-color:var(--sky-2,#0F1A22);transition:stop-color 1.4s linear}
.sky-3{stop-color:var(--sky-3,#152229);transition:stop-color 1.4s linear}
.stars{opacity:var(--star-op,.6);transition:opacity 1.4s linear}
.sun-body{fill:var(--sun-c,#FFE9AE);opacity:var(--sun-op,1);transition:opacity 1.4s linear,fill 1.4s linear}
.sun-halo{opacity:calc(var(--sun-op,1) * var(--halo,.75));transition:opacity 1.4s linear}
.clouds{opacity:var(--cloud-op,.4);transition:opacity 1.4s linear;animation:cloudDrift 120s linear infinite}
@keyframes cloudDrift{from{transform:translateX(-90px)}to{transform:translateX(90px)}}
.rotor{
  /* obrót wokół piasty: współrzędne w jednostkach viewBox, nie bounding boxa */
  transform-box:view-box;transform-origin:var(--ox) var(--oy);
  animation:spin var(--sp,11s) linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* przyciemnienie pod tekst — mocniejsze po lewej, gdzie stoi odczyt */
.doba-bg::after{
  content:"";position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(180deg,rgba(14,21,24,.16) 0%,rgba(14,21,24,.34) 50%,rgba(14,21,24,.60) 100%),
    linear-gradient(90deg,rgba(14,21,24,.54) 0%,rgba(14,21,24,.28) 42%,rgba(14,21,24,.14) 100%);
}
.doba .wrap{position:relative;z-index:1}

.doba-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:22px}
.doba-head .eyebrow{color:var(--green-br)}
.doba-head h2{text-shadow:0 1px 10px rgba(8,12,14,.6);font-size:19px;font-weight:700;color:var(--on-grid);letter-spacing:-.02em}
.doba-head .src{font-family:var(--mono);font-size:10.5px;color:var(--on-grid-2)}
.doba-head .src a{color:var(--green-br);border-bottom:1px solid rgba(53,199,126,.35)}
.wx{
  margin-left:auto;display:inline-flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:10.5px;color:var(--on-grid-2);
  border:1px solid var(--rule-dark);border-radius:2px;padding:5px 10px;
}
.wx b{color:var(--on-grid);font-weight:600}
.wx .ic{font-size:13px;line-height:1}
.daypick{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:9.5px;color:var(--on-grid-2);letter-spacing:.06em}
.daypick input{
  -webkit-appearance:none;appearance:none;width:104px;height:3px;border-radius:2px;
  background:var(--rule-dark);outline:none;cursor:pointer;
}
.daypick input::-webkit-slider-thumb{
  -webkit-appearance:none;width:11px;height:11px;border-radius:50%;
  background:var(--green-br);cursor:pointer;
}
.daypick input::-moz-range-thumb{width:11px;height:11px;border:none;border-radius:50%;background:var(--green-br);cursor:pointer}

.doba-body{display:grid;grid-template-columns:206px 1fr 236px;gap:34px;align-items:stretch}

/* lewa: odczyt */
.readout .lbl{
  font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--on-grid-2);margin-bottom:9px;min-height:15px;
}
.readout .v{text-shadow:0 1px 14px rgba(8,12,14,.75);
  font-family:var(--mono);font-weight:600;font-size:52px;line-height:.94;
  letter-spacing:-.05em;color:#fff;font-variant-numeric:tabular-nums;
}
.readout .u{font-family:var(--mono);font-size:12px;color:var(--on-grid-2);margin-top:9px}
.readout .tag{
  display:inline-flex;align-items:center;gap:7px;margin-top:16px;
  font-family:var(--mono);font-size:10.5px;
  background:rgba(233,165,38,.13);color:var(--pv);
  border:1px solid rgba(233,165,38,.32);padding:6px 10px;border-radius:2px;
}
.readout .note{font-size:12.5px;line-height:1.5;color:var(--on-grid-2);margin-top:14px;max-width:196px}

/* środek: wykres */
.chart-shell{display:flex;flex-direction:column;min-width:0}
.chart-tabs{display:flex;gap:3px;margin-bottom:14px;align-items:center}
.chart-tabs button{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 12px;color:var(--on-grid-2);border:1px solid var(--rule-dark);
  border-radius:2px;transition:.15s;
}
.chart-tabs button:hover{color:var(--on-grid);border-color:#33454C}
.chart-tabs button[aria-selected="true"]{background:var(--on-grid);color:var(--grid);border-color:var(--on-grid);font-weight:600}
.chart-tabs .stat{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--on-grid-2)}
.chart-tabs .stat b{color:var(--on-grid);font-weight:600}

.bars{display:flex;align-items:flex-end;gap:3px;height:136px}
.bar{
  flex:1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;
  min-width:0;cursor:pointer;background:none;padding:0;
}
.bar i{
  display:block;width:100%;background:var(--wind);border-radius:1px 1px 0 0;
  height:var(--h);transform-origin:bottom;transition:filter .12s;
  animation:grow .65s cubic-bezier(.2,.8,.3,1) backwards;animation-delay:var(--d);
}
@keyframes grow{from{transform:scaleY(0);opacity:.25}to{transform:scaleY(1);opacity:1}}
.bar.mid i{background:#3E6B72}
.bar.hi i{background:var(--pv)}
.bar.now i{background:var(--green-br)}
.bar.now::after{
  content:"";position:absolute;left:50%;bottom:calc(var(--h) + 6px);transform:translateX(-50%);
  width:5px;height:5px;border-radius:50%;background:var(--green-br);
}
.bar:hover i,.bar:focus-visible i{filter:brightness(1.35)}
.bar.act i{filter:brightness(1.45)}

.axis{display:flex;gap:3px;margin-top:9px}
.axis span{flex:1;text-align:center;font-family:var(--mono);font-size:9.5px;color:var(--on-grid-2);min-width:0}
.axis.h24 span:nth-child(even){visibility:hidden}

.marks{display:flex;gap:20px;flex-wrap:wrap;margin-top:16px;font-family:var(--mono);font-size:10.5px;color:var(--on-grid-2)}
.marks b{color:var(--on-grid);font-weight:600}
.marks .src a{color:var(--green-br);border-bottom:1px solid rgba(53,199,126,.35)}
.marks .sw{display:inline-block;width:9px;height:9px;border-radius:1px;margin-right:6px;vertical-align:-1px}

/* prawa: miks */
.mix{border-left:1px solid var(--rule-dark);padding-left:26px;display:flex;flex-direction:column}
.mix .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--on-grid-2);margin-bottom:14px}
.mix-row{margin-bottom:15px}
.mix-row .t{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;margin-bottom:6px}
.mix-row .t span{color:var(--on-grid-2)}
.mix-row .t b{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--on-grid)}
.mix-track{height:5px;background:rgba(255,255,255,.07);border-radius:3px;overflow:hidden}
.mix-fill{height:100%;border-radius:3px;width:var(--w);animation:wipe .9s cubic-bezier(.2,.8,.3,1) .25s backwards}
@keyframes wipe{from{width:0}}
.mix-share{margin-top:auto;padding-top:16px;border-top:1px solid var(--rule-dark)}
.mix-share .big{
  font-family:var(--mono);font-weight:600;font-size:36px;letter-spacing:-.045em;
  line-height:1;color:var(--green-br);font-variant-numeric:tabular-nums;
}
.mix-share .cap{font-size:12px;color:var(--on-grid-2);margin-top:7px;line-height:1.45}

/* ─────────────────────────── SEKCJE ──────────────────────────── */
.sec{padding:44px 0}
.sec + .sec{padding-top:0}
.sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:22px;border-bottom:2px solid var(--ink);padding-bottom:10px}
.sec-head h2{font-size:22px;font-weight:800;letter-spacing:-.03em}
.sec-head .more{margin-left:auto;font-size:13.5px;font-weight:600;color:var(--green);white-space:nowrap}
.sec-head .more:hover{color:var(--green-d);text-decoration:underline;text-underline-offset:3px}
.sec-head .sub{font-size:13.5px;color:var(--ink-3);font-weight:400}

.thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--surface-2);border-radius:2px}
.thumb svg{width:100%;height:100%;transition:transform .5s cubic-bezier(.2,.8,.3,1)}
a:hover .thumb svg{transform:scale(1.035)}
.kicker{
  position:absolute;left:10px;top:10px;z-index:2;
  font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  background:var(--grid);color:var(--on-grid);padding:4px 8px;border-radius:2px;
}
.kicker.pv{background:var(--pv);color:#2B1E02}
.kicker.wind{background:var(--wind);color:#062229}
.kicker.grn{background:var(--green);color:#fff}

.byline{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.byline .au{color:var(--ink-2);font-weight:500}

.hero{display:grid;grid-template-columns:1.55fr 1fr;gap:32px;align-items:start}
.hero-main .thumb{aspect-ratio:16/8.6;margin-bottom:16px}
.hero-main h3{font-size:clamp(27px,3vw,38px);line-height:1.08;letter-spacing:-.035em;font-weight:800;margin-bottom:12px}
.hero-main a:hover h3{color:var(--green-d)}
.hero-main .deck{font-size:16.5px;line-height:1.5;color:var(--ink-2);margin-bottom:14px;max-width:56ch;font-weight:400}
.hero-side{display:flex;flex-direction:column;gap:20px}
.side-art{display:grid;grid-template-columns:96px 1fr;gap:14px;padding-bottom:20px;border-bottom:1px solid var(--rule)}
.side-art:last-child{border-bottom:none;padding-bottom:0}
.side-art .thumb{aspect-ratio:1}
.side-art h4{font-size:15.5px;font-weight:700;line-height:1.25;margin-bottom:7px}
.side-art a:hover h4{color:var(--green-d)}

.adslot{
  margin:36px 0;border:1px dashed var(--rule-2);background:var(--surface);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:104px;border-radius:2px;
}
.adslot .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--ink-3);text-transform:uppercase;margin-bottom:5px}
.adslot .sz{font-family:var(--mono);font-size:12px;color:var(--rule-2)}

.cols{display:grid;grid-template-columns:1fr 340px;gap:44px;align-items:start}

.feed-art{display:grid;grid-template-columns:220px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--rule)}
.feed-art:first-child{padding-top:0}
.feed-art h3{font-size:19.5px;font-weight:700;line-height:1.22;letter-spacing:-.026em;margin-bottom:8px}
.feed-art a:hover h3{color:var(--green-d)}
.feed-art p{font-size:14.5px;color:var(--ink-2);line-height:1.5;margin-bottom:10px;font-weight:400}

.card{background:var(--surface);border:1px solid var(--rule);border-radius:2px;margin-bottom:22px}
.card-h{
  display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--rule);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-2);font-weight:500;
}
.card-h .tick{width:7px;height:7px;border-radius:50%;background:var(--green);flex-shrink:0}
.card-b{padding:16px}

.analiza .card-b p{font-size:14.5px;line-height:1.6;color:var(--ink-2);font-weight:400}
.analiza h4{font-size:17px;font-weight:700;line-height:1.26;margin-bottom:10px}
.analiza .facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:14px;border-radius:2px;overflow:hidden}
.analiza .fact{background:var(--surface);padding:10px 12px}
.analiza .fact .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.analiza .fact .v{font-family:var(--mono);font-size:15px;font-weight:600;margin-top:3px;font-variant-numeric:tabular-nums}
.analiza .foot{font-family:var(--mono);font-size:10px;color:var(--ink-3);margin-top:12px;line-height:1.5}

.wire li{list-style:none;padding:11px 0;border-bottom:1px solid var(--rule)}
.wire li:last-child{border-bottom:none;padding-bottom:0}
.wire h5{font-size:14px;font-weight:600;line-height:1.34;margin-bottom:5px}
.wire a:hover h5{color:var(--green-d)}
.wire .src{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);display:flex;gap:7px;align-items:center}
.wire .src em{font-style:normal;color:var(--ink-2);font-weight:500}
.wire .ext{margin-left:auto}

.nl{background:var(--grid);color:var(--on-grid);border-radius:2px;padding:24px}
.nl h4{font-size:19px;font-weight:800;letter-spacing:-.028em;line-height:1.2;margin-bottom:8px;color:#fff}
.nl p{font-size:13.5px;color:var(--on-grid-2);line-height:1.5;margin-bottom:14px;font-weight:400}
.nl input{
  width:100%;background:rgba(255,255,255,.06);border:1px solid var(--rule-dark);
  color:#fff;padding:11px 13px;font:inherit;font-size:14px;border-radius:2px;outline:none;margin-bottom:9px;
}
.nl input::placeholder{color:var(--on-grid-2)}
.nl input:focus{border-color:var(--green-br)}
.nl button{width:100%;background:var(--green-br);color:#062B18;font-weight:700;font-size:14px;padding:11px;border-radius:2px}
.nl button:hover{background:#2BB771}
.nl .fine{font-size:11px;color:var(--on-grid-2);line-height:1.5;margin-top:11px}
.nl .fine a{color:var(--green-br);border-bottom:1px solid rgba(53,199,126,.3)}

.market{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.mk-item{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.mk-item:last-of-type{border-bottom:none}
.mk-tag{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.09em;padding:3px 7px;border-radius:2px;flex-shrink:0;width:74px;text-align:center}
.t-sell{background:#FBE9E7;color:#A93226}
.t-buy{background:#E4EFF6;color:#1B5E7E}
.t-job{background:#FCF3DF;color:#8A6410}
.t-serv{background:#E3F2E9;color:var(--green-d)}
.mk-item .b{flex:1;min-width:0}
.mk-item h5{font-size:14px;font-weight:600;line-height:1.35;margin-bottom:3px}
.mk-item a:hover h5{color:var(--green-d)}
.mk-item .meta{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);display:flex;gap:10px;flex-wrap:wrap}
.mk-item .price{color:var(--ink-2);font-weight:500}
.mk-cta{margin-top:18px}

.talks{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.talk{background:var(--surface);border:1px solid var(--rule);border-radius:2px;overflow:hidden;display:flex;flex-direction:column}
.talk .por{aspect-ratio:4/3;background:var(--surface-2);overflow:hidden}
.talk .tb{padding:16px;display:flex;flex-direction:column;flex:1}
.talk .who{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--green-d);text-transform:uppercase;margin-bottom:8px;font-weight:500}
.talk h4{font-size:16.5px;font-weight:700;line-height:1.26;margin-bottom:10px}
.talk a:hover h4{color:var(--green-d)}
.talk .byline{margin-top:auto}

.events{display:grid;grid-template-columns:repeat(2,1fr);gap:0 40px}
.ev{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--rule);align-items:flex-start}
.ev .d{flex-shrink:0;width:52px;text-align:center;border:1px solid var(--rule-2);border-radius:2px;padding:6px 0;background:var(--surface)}
.ev .d .dd{font-family:var(--mono);font-size:19px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.ev .d .mm{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;color:var(--ink-3);margin-top:3px;text-transform:uppercase}
.ev h5{font-size:14.5px;font-weight:600;line-height:1.35;margin-bottom:4px}
.ev a:hover h5{color:var(--green-d)}
.ev .loc{font-family:var(--mono);font-size:10.5px;color:var(--ink-3)}
.ev .pat{color:var(--green-d);font-weight:500}

footer{background:var(--grid);color:var(--on-grid-2);margin-top:52px;padding:44px 0 26px;font-size:13.5px}
.f-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;padding-bottom:32px;border-bottom:1px solid var(--rule-dark)}
.f-brand .logo-txt .l1{color:#fff}
.f-brand p{margin-top:14px;line-height:1.6;max-width:40ch;font-weight:400}
.f-col h6{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--on-grid);margin-bottom:13px;font-weight:500}
.f-col a{display:block;padding:4px 0;transition:color .15s}
.f-col a:hover{color:var(--green-br)}
.f-bot{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding-top:22px;font-family:var(--mono);font-size:11px}
.f-bot .r{margin-left:auto;display:flex;gap:16px}
.f-bot a:hover{color:var(--green-br)}

/* ─────────────────────────── RESPONSYWNOŚĆ ───────────────────── */
/* na szerokich ekranach pasmo rośnie — inaczej kadr sceny przycina słońce */
@media (min-width:1400px){
  .doba{padding:50px 0 44px}
  .bars{height:170px}
  .readout .v{font-size:58px}
  .doba-body{gap:40px}
}
@media (min-width:1750px){
  .doba{padding:66px 0 56px}
  .bars{height:196px}
  .readout .v{font-size:62px}
}
@media (max-width:1180px){
  .partners .p-slot:nth-of-type(3){display:none}
  .search{width:150px}
}
@media (max-width:1080px){
  .doba-body{grid-template-columns:180px 1fr}
  .mix{grid-column:1/-1;border-left:none;border-top:1px solid var(--rule-dark);padding-left:0;padding-top:20px;
       display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px;align-items:end}
  .mix .lbl{grid-column:1/-1;margin-bottom:0}
  .mix-row{margin-bottom:0}
  .mix-share{margin-top:0;padding-top:0;border-top:none}
  .cols{grid-template-columns:1fr 300px;gap:32px}
}
@media (max-width:880px){
  .hero{grid-template-columns:1fr;gap:28px}
  .cols{grid-template-columns:1fr}
  .talks{grid-template-columns:1fr 1fr}
  .market{grid-template-columns:1fr;gap:32px}
  .events{grid-template-columns:1fr}
  .f-top{grid-template-columns:1fr 1fr;gap:28px}
  .search{display:none}
}
@media (max-width:680px){
  :root{--gut:16px}
  .burger{display:flex}
  .mast-tools .btn-ghost{display:none}
  .doba-body{grid-template-columns:1fr;gap:24px}
  .doba{padding:24px 0}
  .scene{filter:brightness(calc(var(--lum,.7) * .8)) saturate(var(--sat,.8))}
  .wx,.daypick{display:none}
  .readout .v{text-shadow:0 1px 14px rgba(8,12,14,.75);font-size:44px}
  .readout .note{max-width:none}
  .bars{height:104px}
  .axis.h24 span{visibility:hidden}
  .axis.h24 span:nth-child(4n+1){visibility:visible}
  .mix{grid-template-columns:1fr}
  .feed-art{grid-template-columns:120px 1fr;gap:14px}
  .feed-art p{display:none}
  .feed-art h3{font-size:16.5px}
  .talks{grid-template-columns:1fr}
  .side-art{grid-template-columns:80px 1fr}
  .f-top{grid-template-columns:1fr}
  .f-bot .r{margin-left:0;width:100%}
  .sec{padding:32px 0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .rotor,.clouds,.sysbar .roll-in{animation:none !important}
}


/* ── okruszki ── */
.crumbs{padding:16px 0 0;font-family:var(--mono);font-size:11px;color:var(--ink-3);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a:hover{color:var(--green-d)}
.crumbs .sep{color:var(--rule-2)}

/* ══════════════════════════════════════════════════════════════
   UKŁAD ARTYKUŁU
   ══════════════════════════════════════════════════════════════ */
.art-cols{
  display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:64px;
  max-width:1180px;margin:0 auto;padding:0 var(--gut) 40px;align-items:start;
}
.art{padding-top:26px}
.prose{max-width:700px}          /* miara ~72 znaki — tekst nigdy nie idzie na całą kolumnę */

/* nagłówek artykułu */
.art-kicker{
  display:inline-block;font-family:var(--mono);font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;background:var(--pv);color:#2B1E02;
  padding:5px 9px;border-radius:2px;margin-bottom:16px;
}
.art h1{font-size:clamp(30px,3.6vw,44px);line-height:1.06;letter-spacing:-.038em;font-weight:800;margin-bottom:18px;max-width:19ch}
.art .deck{font-size:20px;line-height:1.5;color:var(--ink-2);font-weight:400;margin-bottom:26px;max-width:60ch}

/* podpis autora */
.author-bar{display:flex;align-items:center;gap:14px;padding:16px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);flex-wrap:wrap}
.avatar{width:42px;height:42px;border-radius:50%;background:var(--grid);color:var(--green-br);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:14px;font-weight:600;flex-shrink:0}
.author-bar .who{line-height:1.3}
.author-bar .who .n{font-size:14.5px;font-weight:700}
.author-bar .who .r{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);margin-top:2px}
.author-bar .meta{font-family:var(--mono);font-size:11px;color:var(--ink-3);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.author-bar .share{margin-left:auto;display:flex;gap:6px}
.share a{width:32px;height:32px;border:1px solid var(--rule-2);border-radius:2px;display:flex;align-items:center;justify-content:center;color:var(--ink-2);transition:.15s}
.share a:hover{background:var(--grid);border-color:var(--grid);color:var(--on-grid)}

/* zdjęcie główne */
figure{margin:26px 0}
figure .ph{aspect-ratio:16/9;border-radius:2px;overflow:hidden;background:var(--surface-2)}
figure svg{width:100%;height:100%}
figcaption{font-size:12.5px;color:var(--ink-3);margin-top:9px;line-height:1.5;display:flex;gap:10px}
figcaption .credit{font-family:var(--mono);font-size:10.5px;white-space:nowrap;margin-left:auto;color:var(--rule-2)}

/* tekst ciągły */
.prose p{font-size:18px;line-height:1.72;margin-bottom:1.15em;color:#1B2124}
.prose p.first{font-size:19px}
.prose h2{font-size:25px;font-weight:800;letter-spacing:-.03em;margin:2em 0 .6em;line-height:1.2}
.prose h3{font-size:19px;font-weight:700;margin:1.8em 0 .5em}
.prose a{color:var(--green-d);border-bottom:1px solid rgba(15,125,74,.35)}
.prose a:hover{border-bottom-color:var(--green-d)}
.prose strong{font-weight:700}
.prose ul,.prose ol{margin:0 0 1.15em 1.3em}
.prose li{font-size:18px;line-height:1.68;margin-bottom:.5em;color:#1B2124}
.prose li::marker{color:var(--green)}

/* cytat wyróżniony */
.pull{margin:2em 0;padding-left:24px;border-left:3px solid var(--green);max-width:640px}
.pull p{font-size:23px;line-height:1.34;font-weight:700;letter-spacing:-.022em;color:var(--ink);margin-bottom:.5em}
.pull cite{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:.03em}

/* moduł danych osadzony w tekście — wyjście shortcode'a [poze_rce] */
.datablock{
  margin:2em 0;background:var(--grid);color:var(--on-grid);border-radius:2px;
  padding:20px 22px 18px;
}
.datablock .dh{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.datablock .dh .t{font-size:13.5px;font-weight:700;color:#fff;letter-spacing:-.01em}
.datablock .dh .s{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--on-grid-2)}
.datablock .dh .s a{color:var(--green-br)}
.db-bars{display:flex;align-items:flex-end;gap:2px;height:92px}
.db-bars i{flex:1;border-radius:1px 1px 0 0;background:#3E6B72;height:var(--h)}
.db-bars i.lo{background:var(--wind)}
.db-bars i.hi{background:var(--pv)}
.db-axis{display:flex;gap:2px;margin-top:7px}
.db-axis span{flex:1;text-align:center;font-family:var(--mono);font-size:9px;color:var(--on-grid-2)}
.db-axis span:nth-child(even){visibility:hidden}
.db-foot{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px;padding-top:13px;border-top:1px solid var(--rule-dark);font-family:var(--mono);font-size:10.5px;color:var(--on-grid-2)}
.db-foot b{color:#fff;font-weight:600}

/* tabela */
.prose table{width:100%;border-collapse:collapse;margin:1.8em 0;font-size:14.5px}
.prose th{text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:500;padding:0 12px 8px 0;border-bottom:2px solid var(--ink)}
.prose td{padding:11px 12px 11px 0;border-bottom:1px solid var(--rule)}
.prose td.num{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;padding-right:0}

/* ramka „czytaj też" */
.readmore{
  margin:2em 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);
  padding:14px 0;display:grid;grid-template-columns:88px 1fr;gap:16px;align-items:center;
}
.readmore .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);align-self:start;padding-top:3px}
.readmore h4{font-size:17px;font-weight:700;line-height:1.28}
.readmore a:hover h4{color:var(--green-d)}

/* reklama */
.adslot{margin:2.4em 0;border:1px dashed var(--rule-2);background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:104px;border-radius:2px}
.adslot .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--ink-3);text-transform:uppercase;margin-bottom:5px}
.adslot .sz{font-family:var(--mono);font-size:12px;color:var(--rule-2)}

/* źródła */
.sources{margin:2.4em 0 0;background:var(--surface);border:1px solid var(--rule);border-radius:2px;padding:16px 18px}
.sources h5{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px;font-weight:500}
.sources li{list-style:none;font-size:13.5px;padding:5px 0;color:var(--ink-2)}
.sources li a{color:var(--green-d);border-bottom:1px solid rgba(15,125,74,.3)}

/* tagi */
.tags{display:flex;gap:8px;flex-wrap:wrap;margin:26px 0 0}
.tags a{font-family:var(--mono);font-size:11px;padding:6px 11px;border:1px solid var(--rule-2);border-radius:2px;color:var(--ink-2);transition:.15s}
.tags a:hover{background:var(--grid);border-color:var(--grid);color:var(--on-grid)}

/* nota o autorze */
.authorbox{margin:32px 0 0;background:var(--surface);border:1px solid var(--rule);border-radius:2px;padding:20px;display:grid;grid-template-columns:56px 1fr;gap:16px}
.authorbox .avatar{width:56px;height:56px;font-size:17px}
.authorbox .n{font-size:16px;font-weight:700}
.authorbox .r{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);margin:3px 0 9px}
.authorbox p{font-size:14px;line-height:1.6;color:var(--ink-2)}
.authorbox .lk{margin-top:10px;display:flex;gap:14px;font-size:13px;font-weight:600;color:var(--green-d)}

/* powiązane */
.related{margin-top:44px}
.related .sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:20px;border-bottom:2px solid var(--ink);padding-bottom:10px}
.related h2{font-size:20px;font-weight:800;letter-spacing:-.03em}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.rel .ph{aspect-ratio:16/9;border-radius:2px;overflow:hidden;background:var(--surface-2);margin-bottom:11px}
.rel .ph svg{width:100%;height:100%;transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.rel a:hover .ph svg{transform:scale(1.035)}
.rel h4{font-size:15.5px;font-weight:700;line-height:1.28;margin-bottom:7px}
.rel a:hover h4{color:var(--green-d)}
.rel .by{font-family:var(--mono);font-size:10.5px;color:var(--ink-3)}

/* ══════════════════════════════════════════════════════════════
   SIDEBAR
   ══════════════════════════════════════════════════════════════ */
aside{padding-top:26px}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:2px;margin-bottom:22px}
.card-h{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-2);font-weight:500}
.card-h .tick{width:7px;height:7px;border-radius:50%;background:var(--green);flex-shrink:0}
.card-h .more{margin-left:auto;color:var(--green-d);letter-spacing:.04em;text-transform:none;font-size:11px}
.card-b{padding:16px}

/* widżet ceny */
.rce-w{background:var(--grid);color:var(--on-grid);border-radius:2px;padding:18px;margin-bottom:22px;position:relative;overflow:hidden}
.rce-w .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--on-grid-2);display:flex;align-items:center;gap:7px}
.rce-w .v{font-family:var(--mono);font-weight:600;font-size:40px;line-height:1;letter-spacing:-.05em;color:#fff;margin:11px 0 4px;font-variant-numeric:tabular-nums}
.rce-w .u{font-family:var(--mono);font-size:11px;color:var(--on-grid-2)}
.rce-w .spark{display:flex;align-items:flex-end;gap:1.5px;height:38px;margin:15px 0 0}
.rce-w .spark i{flex:1;background:#3E6B72;border-radius:1px 1px 0 0;height:var(--h)}
.rce-w .spark i.lo{background:var(--wind)}
.rce-w .spark i.hi{background:var(--pv)}
.rce-w .spark i.now{background:var(--green-br)}
.rce-w .ft{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;color:var(--on-grid-2);margin-top:9px;padding-top:9px;border-top:1px solid var(--rule-dark)}
.rce-w .ft b{color:#fff;font-weight:600}

/* Kompas Energetyczny */
.compass{display:grid;grid-template-columns:repeat(12,1fr);gap:3px}
.compass i{aspect-ratio:1;border-radius:1px;background:var(--surface-2);position:relative}
.compass i.c0{background:#2FA96A}
.compass i.c1{background:#C3C9C1}
.compass i.c2{background:var(--pv)}
.compass i.c3{background:var(--alert)}
.compass i.now{outline:2px solid var(--ink);outline-offset:1px}
.compass-ax{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;margin-top:5px}
.compass-ax span{font-family:var(--mono);font-size:8px;color:var(--ink-3);text-align:center}
.compass-lg{margin-top:12px;display:flex;flex-direction:column;gap:5px;font-size:11.5px;color:var(--ink-2)}
.compass-lg span{display:flex;align-items:center;gap:8px}
.compass-lg em{width:10px;height:10px;border-radius:1px;flex-shrink:0;font-style:normal}

/* ranking — numeracja niesie tu informację, bo to lista wg popularności */
.rank{counter-reset:r}
.rank li{list-style:none;display:grid;grid-template-columns:26px 1fr;gap:11px;padding:11px 0;border-bottom:1px solid var(--rule);counter-increment:r}
.rank li:last-child{border-bottom:none;padding-bottom:0}
.rank li::before{content:counter(r);font-family:var(--mono);font-size:15px;font-weight:600;color:var(--rule-2);line-height:1.2}
.rank h5{font-size:13.5px;font-weight:600;line-height:1.34}
.rank a:hover h5{color:var(--green-d)}
.rank .m{font-family:var(--mono);font-size:10px;color:var(--ink-3);margin-top:4px}

/* agregator */
.wire li{list-style:none;padding:11px 0;border-bottom:1px solid var(--rule)}
.wire li:last-child{border-bottom:none;padding-bottom:0}
.wire h5{font-size:13.5px;font-weight:600;line-height:1.34;margin-bottom:5px}
.wire a:hover h5{color:var(--green-d)}
.wire .src{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);display:flex;gap:7px;align-items:center}
.wire .src em{font-style:normal;color:var(--ink-2);font-weight:500}
.wire .ext{margin-left:auto}

/* newsletter */
.nl{background:var(--grid);color:var(--on-grid);border-radius:2px;padding:22px;margin-bottom:22px}
.nl h4{font-size:18px;font-weight:800;letter-spacing:-.028em;line-height:1.2;margin-bottom:8px;color:#fff}
.nl p{font-size:13px;color:var(--on-grid-2);line-height:1.5;margin-bottom:13px}
.nl input{width:100%;background:rgba(255,255,255,.06);border:1px solid var(--rule-dark);color:#fff;padding:10px 12px;font:inherit;font-size:14px;border-radius:2px;outline:none;margin-bottom:8px}
.nl input::placeholder{color:var(--on-grid-2)}
.nl input:focus{border-color:var(--green-br)}
.nl button{width:100%;background:var(--green-br);color:#062B18;font-weight:700;font-size:14px;padding:10px;border-radius:2px}
.nl .fine{font-size:10.5px;color:var(--on-grid-2);line-height:1.5;margin-top:10px}
.nl .fine a{color:var(--green-br)}

.sticky{position:sticky;top:104px}

/* ── stopka ── */
footer{background:var(--grid);color:var(--on-grid-2);margin-top:52px;padding:44px 0 26px;font-size:13.5px}
.f-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;padding-bottom:32px;border-bottom:1px solid var(--rule-dark)}
.f-brand .logo-txt .l1{color:#fff}
.f-brand p{margin-top:14px;line-height:1.6;max-width:40ch;font-weight:400}
.f-col h6{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--on-grid);margin-bottom:13px;font-weight:500}
.f-col a{display:block;padding:4px 0;transition:color .15s}
.f-col a:hover{color:var(--green-br)}
.f-bot{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding-top:22px;font-family:var(--mono);font-size:11px}
.f-bot .r{margin-left:auto;display:flex;gap:16px}
.f-bot a:hover{color:var(--green-br)}

/* ── responsywność ── */
@media (max-width:1180px){
  .art-cols{gap:44px;grid-template-columns:minmax(0,1fr) 310px}
}
@media (max-width:900px){
  .art-cols{grid-template-columns:1fr;gap:0}
  .prose{max-width:none}
  aside{padding-top:8px;border-top:1px solid var(--rule);margin-top:36px}
  .sticky{position:static}
  .search{display:none}
  .rel-grid{grid-template-columns:1fr 1fr}
  .f-top{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:640px){
  :root{--gut:16px}
  .burger{display:flex}
  .mast-tools .btn-ghost{display:none}
  .art h1{font-size:29px}
  .art .deck{font-size:17.5px}
  .prose p,.prose li{font-size:17px}
  .prose h2{font-size:22px}
  .pull p{font-size:20px}
  .author-bar .share{margin-left:0;width:100%;padding-top:10px}
  .readmore{grid-template-columns:1fr;gap:8px}
  .rel-grid{grid-template-columns:1fr}
  .f-top{grid-template-columns:1fr}
  .f-bot .r{margin-left:0;width:100%}
  .compass{grid-template-columns:repeat(8,1fr)}
  .compass-ax{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  html{scroll-behavior:auto}
}


/* ══════════════════════════════════════════════════════════════
   NAGŁÓWEK DZIAŁU
   ══════════════════════════════════════════════════════════════ */
.cat-head{padding:22px 0 26px;border-bottom:2px solid var(--ink);margin-bottom:30px}
.cat-top{display:grid;grid-template-columns:1fr 400px;gap:48px;align-items:end}
.cat-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.cat-head h1{font-size:clamp(34px,4.4vw,52px);letter-spacing:-.042em;font-weight:800;line-height:1}
.cat-lead{font-size:16.5px;line-height:1.55;color:var(--ink-2);margin-top:14px;max-width:62ch;font-weight:400}
.cat-count{font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-top:14px}

/* pasek danych właściwy dla działu — z wtyczki */
.cat-data{background:var(--grid);color:var(--on-grid);border-radius:2px;padding:16px 18px}
.cat-data .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--on-grid-2);display:flex;align-items:center;gap:7px;margin-bottom:12px}
.cat-data .rows{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px}
.cat-data .r .k{font-size:12px;color:var(--on-grid-2);margin-bottom:4px}
.cat-data .r .v{font-family:var(--mono);font-size:21px;font-weight:600;color:#fff;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1}
.cat-data .r .v small{font-size:11px;font-weight:400;color:var(--on-grid-2);letter-spacing:0;margin-left:4px}
.cat-data .ft{margin-top:13px;padding-top:11px;border-top:1px solid var(--rule-dark);font-family:var(--mono);font-size:10px;color:var(--on-grid-2)}
.cat-data .ft a{color:var(--green-br)}

/* wyszukiwarka działu */
.cat-search{margin-top:22px;display:flex;gap:10px;max-width:560px}
.cat-search .f{flex:1;display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--rule-2);border-radius:2px;padding:12px 14px;transition:border-color .15s}
.cat-search .f:focus-within{border-color:var(--green)}
.cat-search input{border:none;background:none;outline:none;font:inherit;font-size:15px;width:100%}
.cat-search input::placeholder{color:var(--ink-3)}
.cat-search svg{flex-shrink:0;color:var(--ink-3)}

/* ══════════════════════════════════════════════════════════════
   LISTA
   ══════════════════════════════════════════════════════════════ */
.thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--surface-2);border-radius:2px}
.thumb svg{width:100%;height:100%;transition:transform .5s cubic-bezier(.2,.8,.3,1)}
a:hover .thumb svg{transform:scale(1.035)}
.kicker{position:absolute;left:10px;top:10px;z-index:2;font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;background:var(--grid);color:var(--on-grid);padding:4px 8px;border-radius:2px}
.kicker.pv{background:var(--pv);color:#2B1E02}
.kicker.grn{background:var(--green);color:#fff}
.byline{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px;color:var(--ink-3)}

/* materiał wiodący */
.lead-art{display:grid;grid-template-columns:1.35fr 1fr;gap:32px;align-items:center;padding-bottom:30px;margin-bottom:30px;border-bottom:1px solid var(--rule)}
.lead-art .thumb{aspect-ratio:16/9}
.lead-art h2{font-size:clamp(24px,2.7vw,33px);line-height:1.09;letter-spacing:-.035em;font-weight:800;margin-bottom:12px}
.lead-art a:hover h2{color:var(--green-d)}
.lead-art p{font-size:16.5px;line-height:1.5;color:var(--ink-2);margin-bottom:13px;font-weight:400}

/* siatka */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 26px}
.card-art .thumb{margin-bottom:12px}
.card-art h3{font-size:18px;font-weight:700;line-height:1.24;letter-spacing:-.024em;margin-bottom:8px}
.card-art a:hover h3{color:var(--green-d)}
.card-art p{
  font-size:14px;line-height:1.5;color:var(--ink-2);margin-bottom:10px;font-weight:400;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.card-art.fresh h3::after{
  content:"NOWE";font-family:var(--mono);font-size:8.5px;font-weight:600;letter-spacing:.1em;
  color:var(--green-d);border:1px solid rgba(15,125,74,.4);border-radius:2px;
  padding:2px 5px;margin-left:8px;vertical-align:3px;white-space:nowrap;
}

/* reklama w strumieniu */
.adslot{border:1px dashed var(--rule-2);background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:104px;border-radius:2px;margin:34px 0}
.adslot .lb{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--ink-3);text-transform:uppercase;margin-bottom:5px}
.adslot .sz{font-family:var(--mono);font-size:12px;color:var(--rule-2)}

/* doładowywanie */
.loadmore{display:flex;flex-direction:column;align-items:center;gap:12px;padding:40px 0 8px}
.loadmore .bar{width:100%;max-width:280px;height:2px;background:var(--rule);border-radius:2px;overflow:hidden}
.loadmore .bar i{display:block;height:100%;background:var(--green);width:var(--p,25%);transition:width .5s cubic-bezier(.2,.8,.3,1)}
.loadmore .cnt{font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.loadmore button{border:1px solid var(--rule-2);padding:12px 26px;border-radius:2px;font-size:14px;font-weight:600;background:var(--surface);transition:.15s;min-width:220px}
.loadmore button:hover:not(:disabled){background:var(--grid);border-color:var(--grid);color:var(--on-grid)}
.loadmore button:disabled{opacity:.5;cursor:default}
.loadmore button.busy{color:var(--ink-3)}
.spin{width:13px;height:13px;border:2px solid var(--rule-2);border-top-color:var(--green);border-radius:50%;display:inline-block;animation:sp .7s linear infinite;vertical-align:-2px;margin-right:8px}
@keyframes sp{to{transform:rotate(360deg)}}
.loadmore .done{font-size:14px;color:var(--ink-3)}

/* newsletter — pas pełnej szerokości */
.nl-band{background:var(--grid);color:var(--on-grid);border-radius:2px;padding:30px 34px;margin:44px 0 0;display:grid;grid-template-columns:1fr 400px;gap:44px;align-items:center}
.nl-band h3{font-size:23px;font-weight:800;letter-spacing:-.03em;color:#fff;margin-bottom:8px;line-height:1.16}
.nl-band p{font-size:14px;color:var(--on-grid-2);line-height:1.55;max-width:50ch;font-weight:400}
.nl-form{display:flex;flex-direction:column;gap:9px}
.nl-form input{width:100%;background:rgba(255,255,255,.06);border:1px solid var(--rule-dark);color:#fff;padding:12px 13px;font:inherit;font-size:14px;border-radius:2px;outline:none}
.nl-form input::placeholder{color:var(--on-grid-2)}
.nl-form input:focus{border-color:var(--green-br)}
.nl-form button{background:var(--green-br);color:#062B18;font-weight:700;font-size:14px;padding:12px;border-radius:2px}
.nl-form button:hover{background:#2BB771}
.nl-form .fine{font-size:10.5px;color:var(--on-grid-2);line-height:1.5}
.nl-form .fine a{color:var(--green-br)}

/* ══════════════════════════════════════════════════════════════
   BLOK OPISOWY (opcjonalny, pod SEO)
   Na dole strony, żeby nie odsuwał listy artykułów.
   ══════════════════════════════════════════════════════════════ */
.cat-seo{margin-top:48px;padding-top:30px;border-top:1px solid var(--rule)}
.cat-seo .inner{max-width:820px}
.cat-seo h2{font-size:22px;font-weight:800;letter-spacing:-.03em;margin-bottom:14px}
.cat-seo h3{font-size:16.5px;font-weight:700;margin:26px 0 8px}
.cat-seo p{font-size:15px;line-height:1.68;color:var(--ink-2);margin-bottom:1em;font-weight:400}
.cat-seo a{color:var(--green-d);border-bottom:1px solid rgba(15,125,74,.3)}
.cat-seo ul{margin:0 0 1em 1.2em}
.cat-seo li{font-size:15px;line-height:1.65;color:var(--ink-2);margin-bottom:.4em}
.cat-seo li::marker{color:var(--green)}
.cat-seo .note{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);margin-top:18px;padding-top:14px;border-top:1px solid var(--rule)}

/* ── stopka ── */
footer{background:var(--grid);color:var(--on-grid-2);margin-top:52px;padding:44px 0 26px;font-size:13.5px}
.f-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;padding-bottom:32px;border-bottom:1px solid var(--rule-dark)}
.f-brand .logo-txt .l1{color:#fff}
.f-brand p{margin-top:14px;line-height:1.6;max-width:40ch;font-weight:400}
.f-col h6{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--on-grid);margin-bottom:13px;font-weight:500}
.f-col a{display:block;padding:4px 0;transition:color .15s}
.f-col a:hover{color:var(--green-br)}
.f-bot{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding-top:22px;font-family:var(--mono);font-size:11px}
.f-bot .r{margin-left:auto;display:flex;gap:16px}
.f-bot a:hover{color:var(--green-br)}

/* ── responsywność ── */
@media (max-width:1040px){
  .cat-top{grid-template-columns:1fr;gap:26px;align-items:start}
  .cat-data{max-width:460px}
  .nl-band{grid-template-columns:1fr;gap:22px;padding:26px}
}
@media (max-width:900px){
  .grid{grid-template-columns:1fr 1fr;gap:30px 22px}
  .lead-art{grid-template-columns:1fr;gap:18px}
  .f-top{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:620px){
  :root{--gut:16px}
  .burger{display:flex}
  .mast-tools .btn-ghost{display:none}
  .cat-head h1{font-size:33px}
  .cat-data .rows{grid-template-columns:1fr 1fr}
  .grid{grid-template-columns:1fr;gap:28px}
  .card-art p{-webkit-line-clamp:3}
  .loadmore button{width:100%}
  .f-top{grid-template-columns:1fr}
  .f-bot .r{margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
}


/* ══════════════════════════════════════════════════════════════
   DOPEŁNIENIA WORDPRESSA
   ══════════════════════════════════════════════════════════════ */
.screen-reader-text{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;left:-9999px;z-index:999;padding:12px 18px;
  background:var(--grid);color:var(--on-grid);font-weight:600;border-radius:0 0 2px 0;
}
.skip-link:focus{left:0;top:0}

.alignwide{max-width:900px;margin-left:auto;margin-right:auto}
.alignfull{width:100%;max-width:none}
.aligncenter{margin-left:auto;margin-right:auto;text-align:center}
.alignleft{float:left;margin:0 24px 16px 0;max-width:50%}
.alignright{float:right;margin:0 0 16px 24px;max-width:50%}
.prose .wp-block-image{margin:1.8em 0}
.prose .wp-block-image img{border-radius:2px;width:100%;height:auto}
.prose .wp-block-image figcaption{font-size:12.5px;color:var(--ink-3);margin-top:8px}
.prose blockquote{margin:2em 0;padding-left:24px;border-left:3px solid var(--green)}
.prose blockquote p{font-size:23px;line-height:1.34;font-weight:700;letter-spacing:-.022em}
.prose blockquote cite{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.prose .wp-block-embed{margin:1.8em 0}
.prose .wp-block-embed iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:2px}

/* paginacja awaryjna, gdy JavaScript jest wyłączony */
.nav-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;padding:36px 0}
.nav-links .page-numbers{
  font-family:var(--mono);font-size:13px;padding:9px 14px;border:1px solid var(--rule-2);
  border-radius:2px;background:var(--surface);
}
.nav-links .page-numbers.current{background:var(--grid);border-color:var(--grid);color:var(--on-grid);font-weight:600}
.nav-links a.page-numbers:hover{border-color:var(--ink)}
.no-js-pagination{display:none}
.no-js .no-js-pagination{display:block}
.no-js .loadmore{display:none}

/* komunikat o danych poglądowych */
.demo-flag{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--pv);
  border:1px solid rgba(233,165,38,.4);border-radius:2px;padding:3px 7px;
}

/* strona bez wyników */
.empty-state{padding:60px 0;text-align:center;max-width:520px;margin:0 auto}
.empty-state h2{font-size:24px;font-weight:800;letter-spacing:-.03em;margin-bottom:12px}
.empty-state p{color:var(--ink-2);margin-bottom:20px}

/* strona statyczna */
.page-head{padding:26px 0 22px;border-bottom:2px solid var(--ink);margin-bottom:30px}
.page-head h1{font-size:clamp(30px,3.8vw,46px);letter-spacing:-.04em;font-weight:800;line-height:1.02}

/* Nagłówek przyklejony — spójnie na wszystkich szablonach. */
.masthead{position:sticky;top:0;z-index:40}
.progress{position:absolute;left:0;bottom:-2px;height:2px;background:var(--green);width:0;transition:width .1s linear}
.admin-bar .masthead{top:32px}
@media (max-width:782px){.admin-bar .masthead{top:46px}}


/* ══════════════════════════════════════════════════════════════
   TURA 1 — sieć reklamowa, nagłówek mobilny, naprawa szerokości
   ══════════════════════════════════════════════════════════════ */

/* ── opakowanie miejsc reklamowych ────────────────────────────── */
.poze-slot{margin:36px 0}
.poze-slot:empty{display:none}
.poze-slot-inline{margin:2.2em 0;clear:both}

/* Wtyczka nadaje pasmu hero-bottom czarne tło pasujące do portali ON.
   U nas ten slot stoi na jasnym papierze — zdejmujemy je, zostawiając
   samą kreację. */
.poze-slot .polskaon-ad-placement-hero-bottom{
  background:none;border:0;padding:0;
}
.poze-slot .polskaon-ad{margin:0;width:100%}

/* Reklama tekstowa w naszej palecie — bez czerwieni z sieci ON. */
.poze-slot .polskaon-ad-type-text{
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:2px;
}
.poze-slot .polskaon-ad-cta,
.poze-slot .polskaon-ad-type-text .polskaon-ad-cta{
  background:var(--green);
  color:#fff;
  border-radius:2px;
  font-weight:600;
}
.poze-slot .polskaon-ad-cta:hover{background:var(--green-d)}
.poze-slot .polskaon-ad-title{font-family:var(--sans);letter-spacing:-.02em}

/* Etykieta „Reklama" — mono, spójna z resztą oznaczeń systemowych. */
.poze-slot .polskaon-ad-label{
  font-family:var(--mono);font-size:9px;letter-spacing:.16em;
  background:rgba(255,255,255,.9);color:var(--ink-3);
  border-radius:2px;padding:3px 6px;
}

/* ── sloty partnerskie w nagłówku ─────────────────────────────── */
.partners{
  display:flex;align-items:center;gap:10px;
  padding-left:26px;border-left:1px solid var(--rule);
  min-width:0;
}
.p-lbl{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);writing-mode:vertical-rl;transform:rotate(180deg);line-height:1;flex-shrink:0;
}
.p-slot{
  height:44px;width:146px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--rule);border-radius:2px;
  overflow:hidden;
}
.p-slot .polskaon-ad{margin:0;width:auto;max-width:100%}
.p-slot img{max-height:32px;width:auto;object-fit:contain}

/* Na logotypie 200 × 60 etykieta „Reklama" przykryłaby jedną trzecią
   powierzchni. Oznaczenie niesie wspólny podpis „Partnerzy" nad blokiem. */
.p-slot .polskaon-ad-label{display:none}

.p-slot-empty{
  background:none;border-style:dashed;border-color:var(--rule-2);
}
.p-slot-empty span{
  font-family:var(--mono);font-size:9px;color:var(--rule-2);letter-spacing:.04em;
}

.partners-mobile{display:none}

/* ── nagłówek: naprawa przepełnienia na wąskich ekranach ──────── */
.mast-top{min-width:0}
.logo{min-width:0}
.logo-txt{min-width:0}
.logo-txt .l1{white-space:nowrap}

/* ── panel nawigacji na wąskich ekranach ──────────────────────── */
/* Panel mobilny nie ma prawa pojawić się na desktopie. Selektor jest
   celowo mocniejszy niż potrzeba: arkusz powstał ze sklejenia trzech makiet
   i wcześniejsze warstwy potrafiły go odsłonić. */
.masthead .nav-extras{display:none}

@media (max-width:1040px){
  .partners-desktop{display:none}
  .partners-mobile{
    display:flex;margin:20px 0 0;padding-left:0;border-left:none;
    justify-content:center;flex-wrap:wrap;gap:12px;
  }
  .partners-mobile .p-lbl{
    writing-mode:horizontal-tb;transform:none;width:100%;text-align:center;margin-bottom:2px;
  }
}

@media (max-width:900px){
  .burger{display:flex}
  .mast-tools .search,
  .mast-tools .mast-cta{display:none}
  .mast-top{gap:14px;padding:12px 0}

  .mainnav{
    position:absolute;left:0;right:0;top:100%;
    background:var(--surface);
    border-top:1px solid var(--rule);
    border-bottom:1px solid var(--rule);
    box-shadow:0 20px 44px rgba(20,24,26,.16);
    max-height:calc(100vh - 100%);
    overflow-y:auto;
    display:none;
    z-index:50;
  }
  .masthead.nav-open .mainnav{display:block}

  .mainnav ul{flex-direction:column;overflow:visible}
  .mainnav a{
    padding:14px var(--gut);
    border-bottom:1px solid var(--rule);
    border-left:3px solid transparent;
    font-size:15.5px;
  }
  .mainnav a:first-child{padding-left:var(--gut)}
  .mainnav a[aria-current]{
    border-bottom-color:var(--rule);
    border-left-color:var(--green);
    background:var(--surface-2);
  }

  /* Blok wstępny panelu: wyszukiwarka i dwa skróty, razem ~100 px.
     Reszta panelu należy do działów. */
  .masthead .nav-extras{
    display:block;padding:14px var(--gut);
    background:var(--surface-2);border-bottom:1px solid var(--rule);
  }
  .nav-extras .search{display:flex;width:100%;margin:0 0 10px}
  .nav-extras .search input{font-size:16px}   /* 16 px — iOS nie przybliża widoku */
  .nav-cta{display:flex;gap:8px}
  .nav-cta .btn{flex:1;justify-content:center;padding:11px 12px;font-size:13.5px}

  body.nav-locked{overflow:hidden}
}

@media (max-width:640px){
  /* Tagline w mono z dużym trackingiem zajmował ~160 px — przy 360 px
     ekranu to on wypychał nagłówek poza widok. */
  .logo-txt .l2{display:none}
  .logo-mark{width:34px;height:34px}
  .logo-txt .l1{font-size:19px}
  .poze-slot{margin:26px 0}
  .partners-mobile .p-slot{width:132px;height:40px}
}

/* Zabezpieczenie przed poziomym rozpychaniem dokumentu.
   UWAGA: overflow-x:hidden na html/body tworzy kontener przewijania
   i unieruchamia position:sticky — nagłówek przestaje się przyklejać.
   Własność clip przycina tak samo, ale kontenera nie tworzy. */
html,body{max-width:100%}
body{overflow-x:clip}
@supports not (overflow-x:clip){
  /* Starsze przeglądarki: przycinamy na opakowaniu, nie na dokumencie. */
  body > .wrap,body > main,body > section{overflow-x:hidden}
}


/* ── makiety miejsc reklamowych, widoczne wyłącznie dla zalogowanej redakcji ── */
.p-slot-empty{
  border-style:dashed;border-color:var(--rule-2);background:none;
  flex-direction:column;gap:2px;
}
.p-slot-empty .ps-id{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.06em;color:var(--rule-2);
}
.p-slot-empty .ps-size{font-family:var(--mono);font-size:10px;color:var(--ink-3)}


/* ══════════════════════════════════════════════════════════════
   SCENA STEROWANA DANYMI
   Każdy obiekt koduje dokładnie jedną wielkość. Wszystko jedzie na
   transform i opacity — pasmo jest elementem LCP i nie może wymuszać
   przeliczania układu.
   ══════════════════════════════════════════════════════════════ */

/* ── promienie słońca: moc fotowoltaiki ──
   Grupa jest przesuwana atrybutem transform na pozycję tarczy, a wszystkie
   przekształcenia CSS liczą się względem jej własnego środka (fill-box).
   Wcześniej punkt odniesienia był podany w układzie viewBox, więc skalowanie
   odsuwało promienie od słońca — na wąskich ekranach widocznie w bok. */
.sun-rays{
  opacity:0;
  transition:opacity 1.2s linear;
  pointer-events:none;
}
.doba.scene-ready .sun-rays{
  opacity:calc(var(--sun-op,1) * (0.25 + var(--pv-load,0) * 0.75));
}
.rays-core{
  transform-box:fill-box;
  transform-origin:center;
  /* Długość rośnie z produkcją. Bez obrotu — wieniec miał się zachowywać
     spokojnie, a nie krążyć wokół tarczy. */
  scale:calc(0.45 + var(--pv-load,0) * 0.55);
  transition:scale 2.4s cubic-bezier(.2,.8,.3,1);
  animation:rayBreath 7s ease-in-out infinite;
}
@keyframes rayBreath{
  0%,100%{opacity:.62}
  50%{opacity:1}
}

/* ── rozjaśnienie okolic tarczy ──
   Nakładka przyciemniająca jest jednolita, więc słońce tonęło w niej tak samo
   jak reszta kadru. Ta warstwa leży NAD nią i rozjaśnia punktowo. */
.sun-lift{
  position:absolute;inset:0;pointer-events:none;z-index:3;
  mix-blend-mode:screen;
  background:radial-gradient(
    circle var(--sun-lift-r,320px) at var(--sun-cx,50%) var(--sun-cy,20%),
    rgba(255,236,186,.30),
    rgba(255,214,140,.12) 45%,
    rgba(255,214,140,0) 72%
  );
  opacity:calc(var(--sun-op,0) * (0.35 + var(--pv-load,0) * 0.65));
  transition:opacity 1.6s linear;
}

/* ── światła zabudowy: zapotrzebowanie KSE ── */
.town-lights{
  opacity:calc(0.12 + var(--demand-load,.5) * 0.88);
  transition:opacity 2s linear;
}
.town-lights rect{animation:windowFlicker 9s steps(1) infinite}
.town-lights rect:nth-child(3n){animation-delay:-3s}
.town-lights rect:nth-child(3n+1){animation-delay:-6s}
@keyframes windowFlicker{0%,88%{opacity:1}90%,100%{opacity:.45}}

/* ── magazyn energii: kierunek przepływu ── */
.storage-flow .sf{
  transform-box:fill-box;transform-origin:center bottom;
  animation:storageFlow 3.2s ease-in-out infinite;
  animation-play-state:var(--storage-play,paused);
}
@keyframes storageFlow{
  0%{opacity:0;transform:scaleY(0)}
  45%{opacity:.42}
  100%{opacity:0;transform:scaleY(1)}
}
/* Rozładowanie: ten sam ruch odwrócony — energia wychodzi górą. */
.storage-out .storage-flow .sf{transform-origin:center top}
.storage-led{
  opacity:calc(0.25 + var(--storage-abs,0) * 0.75);
  transition:opacity 1.4s linear,fill 1.4s linear;
}

/* ── wymiana międzysystemowa ── */
.flow-dots .fd{
  offset-path:path("M-20 220 Q 240 206 500 220 T 1020 216 T 1460 224");
  animation:flowMove 9s linear infinite;
  animation-play-state:var(--exch-play,paused);
  animation-direction:var(--exch-dir,normal);
  opacity:calc(0.2 + var(--exch-abs,0) * 0.8);
}
.flow-dots .fd-2{animation-delay:-3s}
.flow-dots .fd-3{animation-delay:-6s}
@keyframes flowMove{from{offset-distance:0%}to{offset-distance:100%}}

/* ── etykiety przy obiektach sceny ──
   Animacja ilustruje, ale źródłem prawdy zostają liczby. Skala jest
   ruchoma (maksimum z 30 dni), więc bez podpisów scena mogłaby wprowadzać
   w błąd co do wartości bezwzględnych. */
.scene-tags{position:absolute;inset:0;pointer-events:none;z-index:2}
.scene-tag{
  position:absolute;display:inline-flex;align-items:baseline;gap:6px;
  font-family:var(--mono);font-size:10px;letter-spacing:.04em;
  color:var(--on-grid-2);white-space:nowrap;
  transition:opacity .4s linear;
}
.scene-tag b{color:var(--on-grid);font-weight:600}
.scene-tag::before{
  content:"";position:absolute;left:-14px;top:50%;
  width:10px;height:1px;background:currentColor;opacity:.45;
}
.scene-tag-pv{top:16%;left:52%}
.scene-tag-wind{top:30%;right:6%}
.scene-tag-storage{bottom:22%;left:56%}

@media (max-width:1080px){
  .scene-tag-storage{display:none}
}
@media (max-width:900px){
  /* Mniej animowanych obiektów na telefonie — koszt kompozycji rośnie
     szybciej niż wartość informacyjna przy tej szerokości. */
  .scene-tags,.flow-dots,.town-lights{display:none}
  .rays-core{animation:none}
}
@media (prefers-reduced-motion:reduce){
  .rays-core,.town-lights rect,
  .storage-flow .sf,.flow-dots .fd{animation:none !important}
  .sun-rays{opacity:calc(var(--sun-op,1) * var(--pv-load,0) * .8)}
}

/* Zatrzymanie sceny poza widokiem. */
.doba.scene-paused .rotor,
.doba.scene-paused .rays-core,
.doba.scene-paused .clouds,
.doba.scene-paused .flow-dots .fd,
.doba.scene-paused .storage-flow .sf,
.doba.scene-paused .town-lights rect{animation-play-state:paused}

/* Bilans magazynów — wiersz bez paska, sama wartość z kierunkiem. */
.mix-balance{padding-top:2px}
.mix-balance .t{margin-bottom:0}
.mix-balance b.is-in{color:var(--green-br)}
.mix-balance b.is-out{color:var(--pv)}

/* Udział OZE jako główny odczyt prawej kolumny. */
.mix-share .big{font-size:44px}
@media (max-width:1080px){.mix-share .big{font-size:36px}}


/* ══════════════════════════════════════════════════════════════
   PRZYKLEJONY NAGŁÓWEK — STAN SKONDENSOWANY
   Pełny nagłówek to 144 px. Na laptopie zabierałby stale 18% widoku,
   dlatego po przewinięciu zbiega się do jednego rzędu.
   ══════════════════════════════════════════════════════════════ */
.sysbar{position:sticky;top:0;z-index:45;transition:height .22s ease}
.sysbar .wrap{transition:height .22s ease}
.admin-bar .sysbar{top:32px}
@media (max-width:782px){.admin-bar .sysbar{top:46px}}

.masthead{top:34px}
.admin-bar .masthead{top:66px}
@media (max-width:782px){.admin-bar .masthead{top:80px}}

.mast-top{transition:padding .22s ease}
.logo-mark{transition:width .22s ease,height .22s ease}
.logo-txt .l1{transition:font-size .22s ease}

/* Stan zbity — klasa nadawana skryptem po przewinięciu poza pasmo danych. */
.is-condensed .sysbar .wrap{height:28px}
.is-condensed .masthead{top:28px}
.admin-bar.is-condensed .masthead{top:60px}
.is-condensed .masthead .mast-top{padding:8px 0}
.is-condensed .logo-mark{width:28px;height:28px}
.is-condensed .logo-txt .l1{font-size:17px}
.is-condensed .logo-txt .l2{display:none}
.is-condensed .partners-desktop{display:none}
.is-condensed .mast-cta{display:none}
.is-condensed .mainnav a{padding-top:8px;padding-bottom:8px;font-size:13.5px}
.is-condensed .masthead{box-shadow:0 6px 22px rgba(20,24,26,.10)}

@media (max-width:900px){
  .is-condensed .masthead .mast-top{padding:8px 0}
}

/* ══════════════════════════════════════════════════════════════
   STEROWANIE W DOLNYM ROGU
   Postęp czytania, powrót na górę, przełącznik trybu ciemnego.
   ══════════════════════════════════════════════════════════════ */
.ui-dock{
  position:fixed;right:20px;bottom:20px;z-index:60;
  display:flex;flex-direction:column;align-items:center;gap:10px;
}
.ui-btn{
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--rule);
  color:var(--ink-2);cursor:pointer;
  box-shadow:0 4px 16px rgba(20,24,26,.12);
  transition:transform .18s,color .18s,border-color .18s,opacity .25s;
}
.ui-btn:hover{color:var(--ink);border-color:var(--rule-2);transform:translateY(-2px)}
.ui-btn > svg{width:19px;height:19px}
/* Pierścień jest obramowaniem przycisku, nie ikoną — reguła rozmiaru ikon
   ściągała go do 19 px i odklejała w lewy górny róg. */
.ui-top .ring{width:48px;height:48px}

/* Pierścień postępu rysowany na obwodzie przycisku powrotu. */
.ui-top{position:relative}
.ui-top .ring{position:absolute;inset:-1px;transform:rotate(-90deg);pointer-events:none}
.ui-top .ring circle{fill:none;stroke-width:2}
.ui-top .ring .bg{stroke:var(--rule)}
.ui-top .ring .fg{
  stroke:var(--green);
  stroke-linecap:round;
  stroke-dasharray:var(--circ,145);
  stroke-dashoffset:calc(var(--circ,145) - var(--circ,145) * var(--read,0));
  transition:stroke-dashoffset .12s linear;
}
.ui-top{opacity:0;pointer-events:none}
.ui-top.is-visible{opacity:1;pointer-events:auto}

/* ── żarówka: widoczna wyłącznie w trybie ciemnym ── */
.ui-lamp{display:none}
/* Dok ma 122 px wysokości licząc od dolnej krawędzi okna (20 + 46 + 10 + 46).
   Żarówka i licznik muszą stać ponad nim, inaczej przycisk trybu nachodzi
   na grafikę. */
[data-theme="dark"] .ui-lamp{
  display:block;position:fixed;right:0;bottom:186px;z-index:55;
  pointer-events:none;width:min(460px,52vw);height:min(420px,46vh);
}
[data-theme="dark"] .ui-lamp .cone{
  position:absolute;inset:0;
  background:radial-gradient(
    ellipse 78% 68% at 88% 88%,
    rgba(255,214,140,.16),
    rgba(255,196,110,.06) 42%,
    rgba(255,196,110,0) 70%
  );
}
.ui-lamp .bulb{
  position:absolute;right:24px;bottom:0;width:48px;height:48px;
  padding:0;border:0;background:none;
  pointer-events:auto;cursor:pointer;
  transition:transform .18s;
}
.ui-lamp .bulb:hover{transform:scale(1.08)}
.ui-lamp .bulb svg{width:100%;height:100%;display:block}
.ui-lamp .bulb:focus-visible{outline:2.5px solid var(--green);outline-offset:4px;border-radius:50%}

/* Migotanie włókna. Rytm celowo nierówny — równomierne pulsowanie czyta się
   jak animacja ładowania, nie jak żarnik pod napięciem. Stożek światła
   migocze w tym samym takcie, więc efekt jest spójny. */
.ui-lamp .filament{animation:filament 4.3s linear infinite}
@keyframes filament{
  0%{opacity:.92}
  4%{opacity:.55}
  7%{opacity:1}
  13%{opacity:.78}
  16%{opacity:1}
  38%{opacity:.95}
  41%{opacity:.62}
  44%{opacity:1}
  62%{opacity:.88}
  64%{opacity:1}
  78%{opacity:.7}
  81%{opacity:1}
  100%{opacity:.92}
}
.ui-lamp .bulb .glass{animation:bulbBreath 6s ease-in-out infinite}
@keyframes bulbBreath{0%,100%{opacity:.86}50%{opacity:1}}
[data-theme="dark"] .ui-lamp .cone{animation:coneFlicker 4.3s linear infinite}
@keyframes coneFlicker{
  0%{opacity:1}
  4%{opacity:.72}
  7%{opacity:1}
  41%{opacity:.8}
  44%{opacity:1}
  78%{opacity:.85}
  81%{opacity:1}
  100%{opacity:1}
}

.lamp-meter{
  position:fixed;right:20px;bottom:134px;z-index:56;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;
  color:var(--ink-3);text-align:right;line-height:1.5;
  display:none;pointer-events:none;
}
.lamp-meter b{color:var(--pv);font-weight:600}

/* Na szerokim ekranie licznik jest widoczny od razu; kliknięcie żarówki
   pozwala go schować. Na wąskim odwrotnie — domyślnie ukryty, bo miejsca
   nie ma, i rozwija się dopiero po dotknięciu żarówki. */
[data-theme="dark"] .lamp-meter{display:block}
[data-theme="dark"][data-lamp="closed"] .lamp-meter{display:none}

@media (max-width:900px){
  .ui-dock{right:14px;bottom:14px;gap:8px}
  .ui-btn{width:42px;height:42px}
  [data-theme="dark"] .ui-lamp{width:70vw;height:34vh;bottom:150px}

  [data-theme="dark"] .lamp-meter{display:none}
  [data-theme="dark"][data-lamp="open"] .lamp-meter{
    display:block;
    right:14px;bottom:118px;
    background:var(--surface);
    border:1px solid var(--rule);
    border-radius:2px;
    padding:9px 11px;
    font-size:10px;
    box-shadow:0 6px 20px rgba(0,0,0,.45);
  }
}
@media (prefers-reduced-motion:reduce){
  .ui-lamp .bulb .glass,.ui-lamp .filament,.ui-lamp .cone{animation:none !important}
  .sysbar,.mast-top,.logo-mark,.logo-txt .l1{transition:none}
}


/* ══════════════════════════════════════════════════════════════
   TRYB CIEMNY
   Wymieniamy wyłącznie tokeny. Wszystkie komponenty korzystają ze zmiennych,
   więc żaden nie wymaga osobnej reguły — poza reklamami, o których niżej.
   ══════════════════════════════════════════════════════════════ */
[data-theme="dark"]{
  --paper:#0F1416;
  --surface:#161D20;
  --surface-2:#1D2529;

  --ink:#E6EBE8;
  --ink-2:#A9B6B2;
  --ink-3:#788783;

  --rule:#242F2D;
  --rule-2:#31403D;

  /* Zieleń na ciemnym tle musi być jaśniejsza, żeby utrzymać kontrast
     tekstu odnośników na poziomie WCAG AA. */
  --green:#35C77E;
  --green-d:#5BDB99;

  /* Pasma systemowe schodzą niżej niż tło strony — inaczej przestałyby
     odróżniać się od reszty i straciłyby swoje znaczenie. */
  --grid:#080C0E;
  --grid-2:#101718;
  --rule-dark:#1D2729;
}

[data-theme="dark"] body{background:var(--paper)}
[data-theme="dark"] .masthead{background:var(--paper)}
[data-theme="dark"] .prose p,
[data-theme="dark"] .prose li{color:#D9E2DF}
[data-theme="dark"] .sec-head{border-bottom-color:var(--rule-2)}
[data-theme="dark"] .related .sec-head,
[data-theme="dark"] .cat-head{border-bottom-color:var(--rule-2)}
[data-theme="dark"] .prose table th{border-bottom-color:var(--rule-2)}
[data-theme="dark"] .ui-btn{box-shadow:0 4px 16px rgba(0,0,0,.4)}

/* Reklamy zostają na jasnym podkładzie.
   Logotypy partnerów to zwykle ciemna grafika na przezroczystym tle —
   na ciemnej stronie zniknęłyby całkowicie. Kreacje graficzne projektowane
   są pod jasny layout i nie mamy nad nimi kontroli. */
[data-theme="dark"] .p-slot,
[data-theme="dark"] .poze-slot .polskaon-ad-type-image,
[data-theme="dark"] .poze-slot .polskaon-ad-type-html{
  background:#EDEFEC;
  border-color:#D8DCD6;
}
[data-theme="dark"] .poze-slot .polskaon-ad-type-text{
  background:#F4F6F3;
  border-color:#D8DCD6;
}
[data-theme="dark"] .poze-slot .polskaon-ad-title{color:#14181A}
[data-theme="dark"] .poze-slot .polskaon-ad-label{background:rgba(255,255,255,.92);color:#3D474A}

/* Ilustracje zastępcze są ciemne z założenia — w trybie jasnym stanowiły
   kontrast, tutaj wymagają delikatnego obramowania, żeby nie zlewały się
   z tłem karty. */
[data-theme="dark"] .thumb{border:1px solid var(--rule)}

/* Przejście tokenów przy przełączaniu. Wyłączone dla osób, które proszą
   o ograniczenie ruchu. */
html.theme-switching *,
html.theme-switching *::before,
html.theme-switching *::after{
  transition:background-color .28s ease,border-color .28s ease,color .28s ease !important;
}
@media (prefers-reduced-motion:reduce){
  html.theme-switching *,
  html.theme-switching *::before,
  html.theme-switching *::after{transition:none !important}
}


/* ══════════════════════════════════════════════════════════════
   PODGLĄD DZIAŁÓW W MENU
   Logikę dostarcza PolskaON Portal Kit, wygląd należy do motywu.
   Panel czyta się jak wysunięta szuflada z papieru — ciemność w tym
   motywie znaczy „odczyt z systemu” i ta reguła zostaje nienaruszona.
   ══════════════════════════════════════════════════════════════ */
.mainnav{position:relative}

/* Panel leży wewnątrz nawigacji, więc kafelki dziedziczą reguły pozycji menu:
   white-space:nowrap, wewnętrzne odstępy i dolną krawędź. Zerujemy je, zanim
   nadamy własne — inaczej tytuł wyjeżdża poza kafelek zamiast się złamać. */
.mega-panel a{
  display:block;
  padding:0;
  border-bottom:0;
  white-space:normal;
  font-size:inherit;
  font-weight:inherit;
  color:inherit;
}

.mega-panel{
  position:absolute;left:0;right:0;top:100%;
  background:var(--surface);
  border-top:2px solid var(--green);
  border-bottom:1px solid var(--rule);
  box-shadow:0 22px 48px rgba(20,24,26,.14);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s,transform .18s,visibility 0s .18s;
  z-index:48;
}
.mega-panel.is-open{
  opacity:1;visibility:visible;transform:translateY(0);
  transition:opacity .18s,transform .18s,visibility 0s 0s;
}
.mega-panel-inner{max-width:var(--max);margin:0 auto;padding:24px var(--gut) 26px;min-height:132px}

.mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}

.mega-item{display:block;min-width:0}
.mega-thumb{
  display:block;aspect-ratio:16/9;overflow:hidden;border-radius:2px;
  background:var(--surface-2);margin-bottom:10px;
}
.mega-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.mega-item:hover .mega-thumb img{transform:scale(1.04)}
.mega-body{display:block}
.mega-title{
  display:block;font-size:15px;font-weight:700;line-height:1.28;
  letter-spacing:-.02em;color:var(--ink);
  /* Trzy wiersze wystarczą na każdy sensowny tytuł, a kafelki zachowują
     równą wysokość niezależnie od długości nagłówków. */
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.mega-item:hover .mega-title{color:var(--green-d)}
.mega-date{display:block;font-family:var(--mono);font-size:10.5px;color:var(--ink-3);margin-top:7px}

/* Odnośnik do działu zamyka siatkę po prawej, bez kolorowego kafelka —
   ma być zakończeniem listy, nie czwartą pozycją konkurującą o uwagę. */
.mega-panel .mega-all{
  grid-column:1/-1;justify-self:end;
  font-size:13.5px;font-weight:600;color:var(--green-d);
  padding-top:10px;border-top:1px solid var(--rule);width:100%;text-align:right;
}
.mega-panel .mega-all:hover{text-decoration:underline;text-underline-offset:3px}

.mega-state{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);padding:34px 0;
}

/* Aktywny dział podkreślony tak samo jak pozycja bieżąca. */
.mainnav a[aria-expanded="true"]{color:var(--ink);border-bottom-color:var(--green)}

/* Podgląd nie działa poniżej progu — tam pracuje menu mobilne. */
@media (max-width:900px){
  .mega-panel{display:none}
}


/* ══════════════════════════════════════════════════════════════
   SEKCJE REDAKCYJNE
   Układ i tła sterowane z panelu (PolskaON → Sekcje).
   ══════════════════════════════════════════════════════════════ */
.sec-dyn{padding:44px 0}
.sec-dyn .sec-head .eyebrow{margin-right:2px}
.sec-custom{margin-top:4px}

/* ── tła ── */
.sec-dyn.bg-light{background:var(--surface-2)}
.sec-dyn.bg-red{background:var(--green);color:#fff}   /* w panelu: „Akcent (zielone)” */
.sec-dyn.bg-red .sec-head{border-bottom-color:rgba(255,255,255,.35)}
.sec-dyn.bg-red .sec-head h2,
.sec-dyn.bg-red .more,
.sec-dyn.bg-red .eyebrow,
.sec-dyn.bg-red .sub{color:#fff}
.sec-dyn.bg-red .card-art h3,
.sec-dyn.bg-red .card-art p,
.sec-dyn.bg-red .byline{color:rgba(255,255,255,.92)}

.sec-dyn.bg-dark{background:var(--grid);color:var(--on-grid)}
.sec-dyn.bg-dark .sec-head{border-bottom-color:var(--rule-dark)}
.sec-dyn.bg-dark .sec-head h2{color:#fff}
.sec-dyn.bg-dark .eyebrow{color:var(--green-br)}
.sec-dyn.bg-dark .sub{color:var(--on-grid-2)}
.sec-dyn.bg-dark .more{color:var(--green-br)}
.sec-dyn.bg-dark .card-art h3,
.sec-dyn.bg-dark .wire h5{color:var(--on-grid)}
.sec-dyn.bg-dark .card-art p,
.sec-dyn.bg-dark .byline,
.sec-dyn.bg-dark .wire .src{color:var(--on-grid-2)}
.sec-dyn.bg-dark .wire li{border-bottom-color:var(--rule-dark)}

/* ── siatka czterokolumnowa ── */
.grid.grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1080px){.grid.grid-4{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.grid.grid-4{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.grid.grid-4{grid-template-columns:1fr}}

/* ── lista nagłówków ── */
.wire-section{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.wire-section li{padding:13px 0}
@media (max-width:820px){.wire-section{grid-template-columns:1fr}}

/* ── pasmo danych ──
   Ciemne tło znaczy w tym motywie „odczyt z systemu”. Sekcja typu „data”
   korzysta z tej samej reguły co pasmo w hero, więc czytelnik od razu wie,
   że patrzy na dane, a nie na materiał redakcyjny. */
.sec-dyn.layout-data{background:var(--grid);color:var(--on-grid);padding:34px 0}
.sec-dyn.layout-data .sec-head{border-bottom-color:var(--rule-dark);margin-bottom:20px}
.sec-dyn.layout-data .sec-head h2{color:#fff}
.sec-dyn.layout-data .eyebrow{color:var(--green-br)}
.sec-dyn.layout-data .sub{color:var(--on-grid-2)}
.sec-dyn.layout-data .datablock,
.sec-dyn.layout-data .poze-datablock{background:none;padding:0}
.sec-dyn.layout-data .poze-inline{color:var(--on-grid-2);font-size:14px}
.sec-dyn.layout-data .poze-compass{max-width:520px}

/* Sekcja reklamowa nie potrzebuje własnych odstępów — ma je slot. */
.sec-ad{padding:0}


/* ══════════════════════════════════════════════════════════════
   STRONA GŁÓWNA — CIĄGŁA KOLUMNA BOCZNA
   Pasmo dwukolumnowe otwierane raz: strumień, sekcje redakcyjne i rozmowy
   idą lewą kolumną, prawa biegnie obok bez przerw na całej wysokości.
   ══════════════════════════════════════════════════════════════ */
.col-main{min-width:0}
.col-main > .sec-head:not(:first-child){margin-top:40px}

/* Sekcja w kolumnie rezygnuje z własnego kontenera i teł pełnej szerokości. */
.sec-dyn.in-column{padding:0;margin:40px 0 0;background:none}
.sec-dyn.in-column .sec-head{margin-bottom:20px}

/* Tła w kolumnie działają jako karta, nie jako pas przez całą stronę. */
.sec-dyn.in-column.bg-light,
.sec-dyn.in-column.bg-dark,
.sec-dyn.in-column.bg-red,
.sec-dyn.in-column.layout-data{
  padding:22px;border-radius:2px;
}
.sec-dyn.in-column.bg-light{background:var(--surface-2)}
.sec-dyn.in-column.bg-red{background:var(--green)}
.sec-dyn.in-column.bg-dark,
.sec-dyn.in-column.layout-data{background:var(--grid)}

/* W węższej kolumnie siatki schodzą o jedną kolumnę. */
.col-main .grid{grid-template-columns:repeat(2,1fr)}
.col-main .grid.grid-4{grid-template-columns:repeat(3,1fr)}
.col-main .wire-section{grid-template-columns:1fr}
.col-main .talks{gap:18px}

/* Dolne miejsce reklamowe trzyma się widoku przy przewijaniu. */
.sidebar-sticky{position:sticky;top:104px}

/* ── Temat dnia: domknięcie prawej kolumny ──
   Materiał wiodący ze zdjęciem, zajawką i podpisem bywa wyższy od trzech
   pozycji bocznych. Reklama spycha się do dołu i zamyka lukę zamiast
   zostawiać pustkę. */
.hero-side{display:flex;flex-direction:column}
.hero-side-ad{margin:0;padding-top:20px;border-top:1px solid var(--rule)}
.hero-side .side-art:last-of-type{border-bottom:none;padding-bottom:0}

@media (max-width:1080px){
  .col-main .grid.grid-4{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .col-main .grid,
  .col-main .grid.grid-4{grid-template-columns:1fr 1fr}
  .sidebar-sticky{position:static}
  .sec-dyn.in-column{margin-top:32px}
}
@media (max-width:620px){
  .col-main .grid,
  .col-main .grid.grid-4{grid-template-columns:1fr}
}


/* ── widgety z menedżera sidebarów PolskaON ──
   Core opakowuje je we własne znaczniki (section.widget, h4.widget-title)
   i dokłada kontener .polskaon-sidebar-wrap. Sprowadzamy je do wyglądu
   naszych kart, żeby kolumna była spójna niezależnie od źródła widgetu. */
.polskaon-sidebar-wrap{display:block}
aside .widget{
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:2px;
  margin-bottom:22px;
  padding:16px;
}
aside .widget-title{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--ink-2);
  font-weight:500;
  margin:-16px -16px 14px;
  padding:12px 16px;
  border-bottom:1px solid var(--rule);
}
aside .widget ul{list-style:none;margin:0}
aside .widget li{padding:8px 0;border-bottom:1px solid var(--rule);font-size:14px;line-height:1.4}
aside .widget li:last-child{border-bottom:none;padding-bottom:0}
aside .widget a:hover{color:var(--green-d)}
aside .widget p{font-size:14px;line-height:1.55;color:var(--ink-2)}


/* ── odczyty rynkowe jako widgety ──
   Wtyczka danych wypisuje te same znaczniki, które wcześniej były wpisane
   w szablon kolumny bocznej. Widget opakowuje je w kartę, więc karta w karcie
   wymaga zdjęcia podwójnych ramek. */
aside .widget .rce-w{margin:-16px;border-radius:0}
aside .widget > .rce-w:only-child{margin:-16px}
aside .widget .mix-widget .mix-row{margin-bottom:14px}
aside .widget .mix-widget .mix-share{padding-top:14px;border-top:1px solid var(--rule)}
aside .widget .mix-widget .mix-share .big{font-size:32px;color:var(--green)}
aside .widget .mix-widget .mix-share .cap{font-size:12px;color:var(--ink-3);margin-top:5px}
aside .widget .mix-widget .t span{color:var(--ink-3)}
aside .widget .mix-widget .t b{color:var(--ink)}
aside .widget .mix-track{background:var(--surface-2)}


/* ══════════════════════════════════════════════════════════════
   STRONY STATYCZNE
   Miara wiersza obowiązuje tekst, nie całą treść. Tabele, siatki i osadzone
   narzędzia — jak spis kalkulatorów — dostają pełną szerokość, bo ściśnięcie
   ich do szerokości akapitu marnuje miejsce bez żadnego zysku dla czytania.
   ══════════════════════════════════════════════════════════════ */
.page-article.page-wide .prose{max-width:none}

.page-article.page-wide .prose > p,
.page-article.page-wide .prose > ul,
.page-article.page-wide .prose > ol,
.page-article.page-wide .prose > h2,
.page-article.page-wide .prose > h3,
.page-article.page-wide .prose > h4,
.page-article.page-wide .prose > blockquote,
.page-article.page-wide .prose > .sources{max-width:820px}

.page-article.page-wide .prose > .poze-calc-grid,
.page-article.page-wide .prose > .poze-calc,
.page-article.page-wide .prose > .poze-calc-overlay,
.page-article.page-wide .prose > table,
.page-article.page-wide .prose > figure,
.page-article.page-wide .prose > .wp-block-image,
.page-article.page-wide .prose > .wp-block-columns,
.page-article.page-wide .prose > .alignwide,
.page-article.page-wide .prose > .alignfull{max-width:none;width:100%}

/* W układzie z kolumną boczną strona zachowuje się jak artykuł. */
.page-article .page-head{margin-bottom:26px}
.art-cols .page-article{padding-top:26px}

/* Nakładka kalkulatora leży nad wszystkim, także nad przyklejonym nagłówkiem. */
.poze-calc-overlay{z-index:9000}