/* ===== PARTIA 19: czcionki self-hosted (IBM Plex, subsety Latin1+Latin2) =====
   Zastępują Google Fonts — adres IP użytkownika nie jest już przekazywany do Google. */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/IBMPlexSans-Regular-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/IBMPlexSans-Regular-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/IBMPlexSans-Medium-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/IBMPlexSans-Medium-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/IBMPlexSans-SemiBold-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/IBMPlexSans-SemiBold-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/IBMPlexSans-Bold-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/IBMPlexSans-Bold-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/IBMPlexMono-Regular-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/IBMPlexMono-Regular-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/IBMPlexMono-Medium-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/IBMPlexMono-Medium-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/IBMPlexMono-SemiBold-Latin1.woff2") format("woff2");unicode-range:U+0000-00FF,U+2013-2014,U+2018-201E,U+2026,U+20AC;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/IBMPlexMono-SemiBold-Latin2.woff2") format("woff2");unicode-range:U+0100-017F;}

/* =========================================================================
   TARCZA KURSOWA — wspólny arkusz stylów
   Zachowuje dotychczasowy design system (dark, IBM Plex Sans/Mono).
   Jedna kopia zamiast dwóch rozjeżdżających się bloków <style>.
   ========================================================================= */
:root{
  --ink:#0A0D13; --panel:#10141C; --panel-2:#151A24; --line:#242B38;
  --text:#EDF0F5; --text-dim:#9BA2B2; --text-faint:#646B7A;
  --accent:#6E93B8; --accent-dim:#3E5872;
  --green:#3FB786; --red:#D9615F; --amber:#D9A34F;
  --font-body:'IBM Plex Sans',sans-serif; --font-mono:'IBM Plex Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}
}
body{background:var(--ink);color:var(--text);font-family:var(--font-body);line-height:1.6;font-size:16.5px;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);}
h1,h2,h3{font-family:var(--font-body);font-weight:700;letter-spacing:-.01em;color:var(--text);}

/* ---- pasek notowań (dekoracyjny) ---- */
.ticker{background:#060810;border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;padding:8px 0;}
.ticker__track{display:inline-flex;animation:scroll 34s linear infinite;}
.ticker__item{font-family:var(--font-mono);font-size:12px;color:var(--text-faint);padding:0 24px;border-right:1px solid var(--line);}
.ticker__item b{color:var(--text-dim);font-weight:500;}
.up{color:var(--green);} .down{color:var(--red);}
@keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---- nagłówek i nawigacja ---- */
header.top{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--line);flex-wrap:wrap;gap:10px;}
.brand{display:flex;align-items:baseline;gap:10px;font-family:var(--font-mono);text-decoration:none;}
.brand__name{font-size:16px;font-weight:600;letter-spacing:.02em;}
.brand__sub{font-size:10.5px;color:var(--text-faint);letter-spacing:.08em;}
nav.top a{font-size:14.5px;color:var(--text-dim);text-decoration:none;margin-left:26px;}
nav.top a:hover,nav.top a:focus-visible{color:var(--text);}
nav.top a.current{color:var(--accent);}
.btn{font-family:var(--font-mono);font-size:13.5px;padding:12px 22px;border:1px solid var(--accent);color:var(--ink);background:var(--accent);border-radius:3px;cursor:pointer;text-decoration:none;display:inline-block;}
.btn:hover,.btn:focus-visible{background:#7FA3C6;}
.btn--big{padding:16px 26px;font-size:15px;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* ---- sekcje ---- */
.hero{padding:56px 0 40px;}
.hero h1{font-size:38px;line-height:1.2;margin:14px 0 16px;max-width:680px;}
.hero p.lead{color:var(--text-dim);font-size:17px;max-width:620px;margin-bottom:8px;}
.pagehead{padding:40px 0 30px;}
.pagehead h1{font-size:30px;margin:12px 0 10px;}
.pagehead p{color:var(--text-dim);font-size:15.5px;max-width:700px;}
section{padding:56px 0;border-top:1px solid var(--line);}
.sec-head{margin-bottom:30px;max-width:700px;}
.sec-head h2{font-size:27px;margin-top:6px;}
.sec-head p{color:var(--text-dim);margin-top:10px;font-size:15.5px;}
.adslot{border:1px dashed var(--line);background:var(--panel);color:var(--text-faint);font-family:var(--font-mono);font-size:11px;text-align:center;padding:14px;letter-spacing:.06em;}

/* ---- wybór roli ---- */
.role-picker{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:32px;}
.role-btn{background:var(--panel);border:2px solid var(--line);padding:26px 24px;text-align:left;cursor:pointer;color:var(--text-dim);font-family:var(--font-body);border-radius:6px;}
.role-btn .icon{font-size:28px;margin-bottom:10px;}
.role-btn .title{font-size:18px;font-weight:700;color:var(--text);margin-bottom:6px;}
.role-btn .sub{font-size:13.5px;color:var(--text-faint);}
.role-btn.active{border-color:var(--accent);background:var(--panel-2);}
.role-btn.active .title{color:var(--accent);}

/* ---- punkt odniesienia ---- */
.refpoint{display:flex;gap:26px;align-items:center;background:var(--panel);border:1px solid var(--line);padding:16px 22px;margin-bottom:24px;font-family:var(--font-mono);font-size:13px;color:var(--text-dim);flex-wrap:wrap;border-radius:6px;}
.refpoint b{color:var(--text);}
.refpoint .dot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block;margin-right:8px;}
.plnnote{font-family:var(--font-mono);font-size:11.5px;color:var(--text-faint);margin-top:-14px;margin-bottom:22px;}

/* ---- pola formularzy ---- */
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;}
.inputs-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--line);}
.inputs-row .field{margin-bottom:0;}
.field{margin-bottom:22px;}
.field label{display:block;font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:9px;}
select,input[type=number],input[type=text]{width:100%;background:var(--panel-2);border:1px solid var(--line);color:var(--text);font-family:var(--font-mono);font-size:15.5px;padding:13px 14px;border-radius:4px;}
input[type=range]{width:100%;accent-color:var(--accent);height:6px;border-radius:3px;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--accent);border:3px solid var(--ink);box-shadow:0 0 0 1px var(--accent);cursor:pointer;margin-top:-8px;}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--accent);border:3px solid var(--ink);box-shadow:0 0 0 1px var(--accent);cursor:pointer;}
.range-labels{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:11.5px;color:var(--text-faint);margin-top:6px;}
.inline-val{font-family:var(--font-mono);font-size:12px;color:var(--text-faint);margin-top:8px;}
.hint{font-family:var(--font-mono);font-size:13px;color:var(--accent);margin-bottom:14px;}

/* ---- suwaki z tooltipem ---- */
.slider-wrap{position:relative;padding-top:30px;}
.ref-marker{position:absolute;top:28px;width:2px;height:18px;background:var(--text-faint);z-index:1;transition:left .2s ease;}
.ref-marker::after{content:"punkt odniesienia";position:absolute;top:20px;left:50%;transform:translateX(-50%);font-family:var(--font-mono);font-size:10px;color:var(--text-faint);white-space:nowrap;}
.thumb-tip{position:absolute;top:0;transform:translateX(-50%);background:var(--accent);color:var(--ink);font-family:var(--font-mono);font-size:11.5px;font-weight:600;padding:4px 9px;border-radius:4px;white-space:nowrap;z-index:2;pointer-events:none;}
.thumb-tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--accent);}

/* ---- waga (scale) ---- */
.scale-card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:36px 24px 24px;margin-bottom:20px;}
.scale-card--tight{background:var(--panel-2);padding:30px 20px 18px;margin-top:22px;margin-bottom:0;}
.scale-area{position:relative;height:210px;max-width:460px;margin:0 auto;}
.scale-area--small{height:150px;max-width:400px;}
.beam{position:absolute;top:56px;left:50%;width:360px;margin-left:-180px;height:0;display:flex;justify-content:space-between;align-items:flex-start;transform-origin:center center;transition:transform .5s cubic-bezier(.34,1.4,.64,1);}
.scale-area--small .beam{top:40px;width:320px;margin-left:-160px;}
.plate{width:158px;background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:14px 12px;text-align:center;}
.scale-area--small .plate{width:145px;background:var(--panel);padding:10px;}
.plate .pval{font-family:var(--font-mono);font-size:19px;font-weight:600;color:var(--text);}
.scale-area--small .plate .pval{font-size:15.5px;}
.plate .plabel{font-family:var(--font-mono);font-size:10.5px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;margin-top:6px;}
.plate .pdelta{font-family:var(--font-mono);font-size:12.5px;margin-top:9px;padding-top:9px;border-top:1px solid var(--line);}
.plate .pdelta.good{color:var(--green);}
.plate .pdelta.bad{color:var(--red);}
.plate .pdelta.flat{color:var(--text-faint);}
.pivot-line{position:absolute;top:56px;left:50%;width:2px;height:70px;background:var(--line);}
.scale-area--small .pivot-line{top:40px;height:52px;}
.pivot-tri{position:absolute;top:124px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:16px solid transparent;border-right:16px solid transparent;border-bottom:26px solid var(--line);}
.scale-area--small .pivot-tri{top:90px;border-left-width:13px;border-right-width:13px;border-bottom-width:20px;}

/* ---- wyniki i porównania ---- */
.result-banner{background:var(--panel-2);border-left:4px solid var(--accent);border-radius:0 6px 6px 0;padding:20px 24px;font-size:16px;color:var(--text-dim);margin-bottom:8px;}
.result-banner b{color:var(--text);}
.result-banner.good{border-left-color:var(--green);}
.result-banner.bad{border-left-color:var(--amber);}
.costs-panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:20px 22px;margin:32px 0 20px;}
.costs-panel .cptitle{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:16px;}
.costs-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.costs-grid .field{margin-bottom:0;}
.compare3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-bottom:10px;}
.compare3 .c{background:var(--panel-2);padding:20px 18px;}
.compare3 .ctag{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:8px;}
.compare3 .cval{font-family:var(--font-mono);font-size:21px;font-weight:600;margin-bottom:6px;}
.compare3 .csub{font-size:12.5px;color:var(--text-faint);}
.compare3 .win .cval{color:var(--green);}
.compare3 .lose .cval{color:var(--red);}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-top:22px;}
.col{background:var(--panel-2);padding:20px;}
.col .ctag{font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:8px;}
.col .cval{font-family:var(--font-mono);font-size:22px;font-weight:600;margin-bottom:6px;}
.col .csub{font-size:12.5px;color:var(--text-faint);}
.col.win .cval{color:var(--green);}
.col.lose .cval{color:var(--red);}
.col.warn .cval{color:var(--amber);}
.costline{margin-top:14px;padding:12px 16px;background:var(--panel);border-left:3px solid var(--amber);border-radius:0 6px 6px 0;font-family:var(--font-mono);font-size:12.5px;color:var(--text-dim);}
.costline b{color:var(--amber);}
.note{margin-top:18px;padding:16px 18px;background:var(--panel-2);border:1px solid var(--line);border-radius:6px;font-size:13.5px;color:var(--text-dim);}
.note .eyebrow{display:block;margin-bottom:6px;}
.cta-row{text-align:center;margin-top:36px;}
.cta-row p{color:var(--text-dim);font-size:14.5px;margin-bottom:16px;}

/* ---- karty instrumentów na stronie zbiorczej ---- */
.instr-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.instr-card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:24px;text-decoration:none;color:var(--text-dim);}
.instr-card:hover,.instr-card:focus-visible{border-color:var(--accent);background:var(--panel-2);}
.instr-card h3{font-size:17px;margin-bottom:8px;}
.instr-card p{font-size:13.5px;}
.instr-card .tag{display:inline-block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);border:1px solid var(--line);border-radius:3px;padding:3px 8px;margin-bottom:12px;}
.instr-card--warn{border-color:var(--amber);}
.instr-card--warn .tag{color:var(--amber);border-color:var(--amber);}
.instr-card--warn:hover,.instr-card--warn:focus-visible{border-color:var(--amber);}
.catnote{margin:6px 0 22px;padding:14px 18px;background:var(--panel-2);border-left:3px solid var(--amber);border-radius:0 6px 6px 0;font-size:13.5px;color:var(--text-dim);}

/* ---- strategie, wykresy, oś czasu ---- */
.payoff-card{background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:16px 14px 8px;margin-bottom:22px;}
.seg{display:flex;border:1px solid var(--line);border-radius:4px;overflow:hidden;width:fit-content;margin-bottom:20px;}
.seg button{font-family:var(--font-mono);font-size:12.5px;padding:9px 16px;background:transparent;color:var(--text-dim);border:none;cursor:pointer;}
.seg button.active{background:var(--panel-2);color:var(--text);}
.seg button + button{border-left:1px solid var(--line);}
.strategies{display:grid;grid-template-columns:1fr;gap:18px;margin-top:14px;}
.strat-card{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:22px 24px;}
.strat-card h3{font-size:16.5px;margin-bottom:8px;}
.strat-card .sdesc{font-size:13.5px;color:var(--text-dim);margin-bottom:16px;}
.strat-card .sresult{margin-top:14px;padding:12px 16px;background:var(--panel-2);border-left:3px solid var(--accent);border-radius:0 6px 6px 0;font-size:13.5px;color:var(--text-dim);}
.strat-card .sresult b{color:var(--text);}
.timeline{display:flex;align-items:stretch;gap:0;margin-top:6px;}
.tl-box{flex:1;background:var(--panel-2);border:1px solid var(--line);padding:20px 18px;}
.tl-box .tlabel{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.05em;margin-bottom:9px;}
.tl-box p{font-size:14px;color:var(--text-dim);}
.tl-box b{color:var(--text);}
.tl-arrow{width:44px;display:flex;align-items:center;justify-content:center;color:var(--text-faint);font-family:var(--font-mono);font-size:18px;}
.isetup{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:20px 24px;margin-bottom:20px;font-size:15px;color:var(--text-dim);}
.isetup b{color:var(--text);}
.istage{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:26px;}
.method{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-top:20px;}
.method > div{background:var(--panel);padding:24px 22px;}
.method .num{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);}
.method h3{font-size:15.5px;margin:10px 0 8px;}
.method p{color:var(--text-dim);font-size:14px;}

/* ---- stopka ---- */
footer{padding:32px 0;border-top:1px solid var(--line);margin-top:16px;}
footer p{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);max-width:760px;}
footer nav{margin-bottom:14px;}
footer nav a{font-family:var(--font-mono);font-size:11.5px;color:var(--text-dim);text-decoration:none;margin-right:20px;}
footer nav a:hover{color:var(--text);}

/* ---- tabele parametrów (metodologia) ---- */
.paramtable{width:100%;border-collapse:collapse;margin:18px 0 6px;font-size:13.5px;}
.paramtable th{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);}
.paramtable td{padding:10px 14px;border-bottom:1px solid var(--line);color:var(--text-dim);vertical-align:top;}
.paramtable td:first-child{color:var(--text);white-space:nowrap;}
.paramtable code{font-family:var(--font-mono);font-size:12.5px;color:var(--accent);}

/* ---- słownik ---- */
.gloss{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:8px;}
.gloss dl{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:18px 20px;margin:0;}
.gloss dt{font-size:15.5px;font-weight:700;color:var(--text);margin-bottom:6px;}
.gloss dt .en{font-family:var(--font-mono);font-size:11px;font-weight:400;color:var(--text-faint);margin-left:8px;}
.gloss dd{font-size:13.5px;color:var(--text-dim);margin:0;}
.gloss dd a{color:var(--accent);}
.gloss dl:target{border-color:var(--accent);}
@media (max-width:760px){.gloss{grid-template-columns:1fr;}}

/* ---- RWD ---- */
@media (max-width:900px){
  .cols{grid-template-columns:1fr;}
  .method{grid-template-columns:1fr;}
  .inputs-row{grid-template-columns:1fr;}
  .timeline{flex-direction:column;}
  .tl-arrow{transform:rotate(90deg);padding:6px 0;}
  .instr-grid{grid-template-columns:1fr;}
}
@media (max-width:760px){
  .role-picker{grid-template-columns:1fr;}
  .calc-grid{grid-template-columns:1fr;}
  .costs-grid{grid-template-columns:1fr;}
  .compare3{grid-template-columns:1fr;}
  .hero h1{font-size:29px;}
  .beam{width:300px;margin-left:-150px;}
  .plate{width:130px;}
}

/* ---- pojedynek + stos klocków (następca wagi) ---- */
.duel{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:stretch;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:26px 22px;margin-bottom:20px;}
.dtile{background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:20px 18px;text-align:center;display:flex;flex-direction:column;justify-content:center;}
.dtile .dval{font-family:var(--font-mono);font-size:21px;font-weight:600;color:var(--text);}
.dtile .dlabel{font-family:var(--font-mono);font-size:10.5px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;margin-top:8px;}
.dtile .dsub{font-size:12px;color:var(--text-faint);margin-top:9px;padding-top:9px;border-top:1px solid var(--line);}
.stackwrap{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:150px;}
.stacklabel{font-family:var(--font-mono);font-size:12px;text-align:center;margin-bottom:10px;line-height:1.5;}
.stacklabel.good{color:var(--green);} .stacklabel.bad{color:var(--red);} .stacklabel.flat{color:var(--text-faint);}
.stackcol{display:flex;flex-direction:column-reverse;gap:3px;min-height:120px;justify-content:flex-start;}
.stackblock{width:74px;height:13px;border-radius:2px;}
.stackblock.good{background:var(--green);opacity:.85;}
.stackblock.bad{background:var(--red);opacity:.85;}
.stackbase{width:104px;height:3px;background:var(--line);border-radius:2px;margin-top:6px;}
.stackunit{font-family:var(--font-mono);font-size:10px;color:var(--text-faint);margin-top:8px;}
@media (max-width:760px){.duel{grid-template-columns:1fr;}.stackwrap{order:-1;min-height:auto;}.stackcol{flex-direction:row;min-height:auto;flex-wrap:wrap;justify-content:center;}.stackblock{width:24px;}}

/* =========================================================================
   PARTIA 8 — porównanie jako osobna podstrona + wyrównanie paneli
   ========================================================================= */

/* Naprawa "nadzganego" panelu kosztów: etykiety o różnej wysokości spychały
   pola i przyciski na różne poziomy. Teraz kolumny są flexowe, etykiety mają
   wspólną wysokość minimalną, a input zawsze siada na tej samej linii. */
.costs-grid .field{display:flex;flex-direction:column;}
.costs-grid .field label{min-height:38px;display:flex;align-items:flex-end;margin-bottom:9px;}
.costs-grid .field input{margin-bottom:0;}
.inline-val{display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.5;}
.use-btn{font-family:var(--font-mono);font-size:11px;padding:3px 12px;background:transparent;border:1px solid var(--accent-dim);color:var(--accent);border-radius:3px;cursor:pointer;white-space:nowrap;}
.use-btn:hover,.use-btn:focus-visible{border-color:var(--accent);}
@media (max-width:760px){.costs-grid .field label{min-height:0;}}

/* Tabela scenariuszy — liczby w mono, do prawej, w pionie jak w banku. */
.table-scroll{overflow-x:auto;margin-top:10px;}
.scen-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.scen-table th,.scen-table td{padding:13px 18px;border-bottom:1px solid var(--line);}
.scen-table thead th{font-family:var(--font-mono);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);text-align:right;background:var(--panel);}
.scen-table thead th:first-child{text-align:left;}
.scen-table td{font-family:var(--font-mono);font-size:14.5px;text-align:right;background:var(--panel-2);color:var(--text);white-space:nowrap;}
.scen-table td:first-child{font-family:var(--font-body);font-size:13.5px;text-align:left;color:var(--text-dim);white-space:normal;min-width:180px;}
.scen-table tr:last-child td{border-bottom:none;}
.scen-table td.best{color:var(--green);font-weight:600;}
.scen-table td.ref-row{color:var(--text-dim);}

/* Blok warunkowego podsumowania — "co potencjalnie może wypaść lepiej" */
.verdict{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:6px;padding:22px 24px;margin-top:24px;}
.verdict h3{font-size:16px;margin-bottom:12px;}
.verdict p{font-size:14.5px;color:var(--text-dim);margin-bottom:10px;}
.verdict p:last-child{margin-bottom:0;}
.verdict b.g{color:var(--green);} .verdict b.r{color:var(--red);} .verdict b.a{color:var(--amber);}

/* Zajawka strategii opcyjnych w hubie instrumentów */
.instr-card--teaser{grid-column:1/-1;border-style:dashed;border-color:var(--accent-dim);display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;}
.instr-card--teaser h3{margin-bottom:0;}
.instr-card--teaser p{flex:1;min-width:260px;margin:0;}
.instr-card--teaser .tag{color:var(--amber);}

/* ===== PARTIA 10 ===== */
/* suwaki: etykieta znacznika „dziś: X", widoczny focus, przyciski −/+ */
.ref-marker::after{content:attr(data-label);}
input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:4px;}
.rate-steppers{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:7px;}
.rate-steppers button{font-family:var(--font-mono);font-size:12px;line-height:1;padding:6px 12px;background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:4px;cursor:pointer;}
.rate-steppers button:hover{border-color:var(--accent-dim);color:var(--accent);}
.rate-steppers button:active{transform:translateY(1px);}
.rate-steppers .rs-hint{font-family:var(--font-mono);font-size:10.5px;color:var(--text-faint);text-align:center;}
@media (max-width:560px){.rate-steppers .rs-hint{display:none;}}
/* komentarz pod suwakami % */
.pct-note{font-family:var(--font-mono);font-size:11.5px;color:var(--text-faint);margin-top:6px;line-height:1.55;}
.pct-note b{color:var(--text-dim);}
/* porównanie: koszty w dwóch wyraźnie oddzielonych kartach */
.costs-grid .field{background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:14px 16px;}
.costs-grid .field .cost-head{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;}
/* tabela scenariuszy: kolor względem kursu „dziś", tło dla najlepszego */
.scen-table td.best{color:inherit;background:rgba(63,185,80,.10);font-weight:600;}
.scen-table td.good{color:var(--green);}
.scen-table td.bad{color:var(--red);}
.scen-table td.neut{color:var(--text-dim);}
/* pasek stref pod wykresem wypłaty */
.chart-zones{display:flex;margin-top:8px;border:1px solid var(--line);border-radius:4px;overflow:hidden;font-family:var(--font-mono);font-size:10.5px;line-height:1.4;}
.chart-zones span{padding:5px 6px;text-align:center;flex:1;}
.chart-zones .zone-mkt{background:rgba(139,148,158,.10);color:var(--text-dim);}
.chart-zones .zone-fix{background:rgba(63,185,80,.13);color:var(--green);}
.chart-zones .zone-part{background:rgba(210,153,34,.13);color:var(--amber);}
.chart-zones .zone-risk{background:rgba(248,81,73,.13);color:var(--red);}
/* odczyt nad wykresem: „rynek X → płacisz Y" */
.chart-readout{font-family:var(--font-mono);font-size:12px;color:var(--text-dim);margin:2px 2px 8px;line-height:1.6;}
.chart-readout b{color:var(--text);}
.chart-readout .dotmark{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--amber);margin-right:7px;vertical-align:baseline;}
/* ticker: znaczka źródła kursów */
.ticker__meta{color:var(--text-faint);}
/* stan koloru plakietki różnicy w kafelkach duel */
.dtile .dsub.good{color:var(--green);}
.dtile .dsub.bad{color:var(--red);}
.dtile .dsub.flat{color:var(--text-faint);}

/* ===== PARTIA 14 ===== */
/* separatory między strategiami — koniec zlewania się w jedno */
.strategy-block{border:1px solid var(--line);border-radius:8px;padding:22px 22px 18px;margin-bottom:34px;background:var(--panel);}
.strategy-block + .strategy-block{margin-top:0;}
/* plakietka kierunkowa: kto w tym przykładzie co kupuje/sprzedaje */
.dir-badge{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.02em;margin:0 0 14px;padding:9px 12px;background:var(--panel-2);border:1px solid var(--line);border-radius:6px;}
.dir-badge .db-who{color:var(--text-dim);text-transform:uppercase;font-size:10.5px;letter-spacing:.07em;}
.dir-badge .db-buy{color:var(--green);}
.dir-badge .db-sell{color:var(--amber);}
.dir-badge .db-note{color:var(--text-faint);}
.dir-badge b{font-weight:600;}
/* zakładki Podstawowe | Premium nad stronami strategii */
.strat-tabs{display:flex;gap:0;margin:0 0 26px;border:1px solid var(--line);border-radius:6px;overflow:hidden;width:max-content;}
.strat-tabs a{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.04em;padding:9px 20px;color:var(--text-dim);text-decoration:none;background:var(--panel);}
.strat-tabs a.active{background:var(--panel-2);color:var(--accent);}
.strat-tabs a:hover:not(.active){color:var(--text);}
/* przeciągalny znacznik na wykresach */
.payoff-card svg circle[id$="Marker"]{cursor:grab;}
.payoff-card svg circle[id$="Marker"]:active{cursor:grabbing;}
/* CFD: linia progów margin call / stop out */
.margin-line{font-family:var(--font-mono);font-size:12px;line-height:1.7;padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:6px;background:var(--panel-2);margin-top:14px;}
.margin-line b.mc{color:var(--amber);}
.margin-line b.so{color:var(--red);}
/* mocniejsza separacja kart strategii: odstęp + akcent + numeracja wizualna */
.strategies{gap:44px !important;}
.strat-card{border-top:3px solid var(--accent-dim);position:relative;}
.strat-card > h3{padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:14px;}

/* ===== PARTIA 15: słownik strategii — układ szpaltowy ===== */
.deep-entry{border:1px solid var(--line);border-top:3px solid var(--accent-dim);border-radius:8px;padding:22px 24px;margin-bottom:30px;background:var(--panel);}
.deep-entry h3{font-size:17px;margin-bottom:4px;}
.deep-entry .de-lead{font-size:13.5px;color:var(--text-dim);margin-bottom:16px;line-height:1.6;}
.de-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media (max-width:760px){.de-grid{grid-template-columns:1fr;}}
.de-block{background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:13px 15px;font-size:13px;line-height:1.65;color:var(--text-dim);}
.de-block h4{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin:0 0 7px;}
.de-block.warn h4{color:var(--red);}
.de-block b{color:var(--text);}
.de-block ol{margin:0;padding-left:18px;}
.de-block ol li{margin-bottom:5px;}
.de-cta{margin-top:14px;font-family:var(--font-mono);font-size:12px;}
.de-cta a{color:var(--accent);}
/* guzik „więcej info" na kartach strategii */
.more-info{display:inline-block;font-family:var(--font-mono);font-size:11.5px;padding:5px 12px;border:1px solid var(--line);border-radius:4px;color:var(--text-dim);text-decoration:none;margin-bottom:14px;}
.more-info:hover{border-color:var(--accent-dim);color:var(--accent);}

/* ===== PARTIA 16: FAQ — akordeon details/summary ===== */
.faq-item{border:1px solid var(--line);border-radius:6px;background:var(--panel);margin-bottom:10px;}
.faq-item summary{cursor:pointer;list-style:none;padding:15px 46px 15px 18px;font-size:15px;font-weight:600;color:var(--text);position:relative;line-height:1.5;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:18px;color:var(--accent);transition:transform .15s;}
.faq-item[open] summary::after{content:"−";}
.faq-item[open] summary{border-bottom:1px solid var(--line);}
.faq-item summary:hover{color:var(--accent);}
.faq-item .faq-a{padding:14px 18px 16px;font-size:13.5px;line-height:1.7;color:var(--text-dim);}
.faq-item .faq-a p{margin:0 0 10px;}
.faq-item .faq-a p:last-child{margin-bottom:0;}
.faq-item .faq-a b{color:var(--text);}
.faq-item .faq-a a{color:var(--accent);}
.faq-item:target{border-color:var(--accent);}
/* studia przypadków — hipotetyczne przykłady */
.case-box{border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:6px;background:var(--panel);padding:20px 22px;margin-bottom:24px;}
.case-box h3{font-size:16px;margin:0 0 4px;}
.case-box .case-tag{display:inline-block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--amber);border:1px solid var(--amber);border-radius:3px;padding:2px 8px;margin-bottom:10px;}
.case-box p{font-size:13.5px;line-height:1.7;color:var(--text-dim);margin:0 0 10px;}
.case-box p:last-child{margin-bottom:0;}
.case-box b{color:var(--text);}
.case-box .case-lesson{background:var(--panel-2);border:1px solid var(--line);border-radius:5px;padding:11px 14px;font-size:13px;}
.case-box .case-lesson .lbl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:5px;}

/* ===== PARTIA 18: strony prawne ===== */
.legal-fill{background:rgba(217,163,79,.12);border:1px dashed var(--amber);border-radius:3px;padding:1px 7px;color:var(--amber);font-weight:600;white-space:nowrap;}
.legal-note{border:1px solid var(--amber);border-radius:6px;background:rgba(217,163,79,.07);padding:14px 18px;font-size:13px;line-height:1.6;color:var(--text-dim);max-width:760px;margin-bottom:28px;}
.legal-note b{color:var(--amber);}
.legal ol{padding-left:22px;margin:10px 0;}
.legal ol li{margin-bottom:8px;font-size:13.5px;line-height:1.7;color:var(--text-dim);}
.legal ol li b{color:var(--text);}
.legal p{color:var(--text-dim);max-width:760px;font-size:13.5px;line-height:1.7;}
.legal .formularz{border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:16px 20px;max-width:640px;font-family:var(--font-mono);font-size:12.5px;line-height:1.9;color:var(--text-dim);margin:14px 0;}

/* ===== PARTIA 23: strona oferty premium ===== */
.tier-table{width:100%;border-collapse:collapse;margin:18px 0 8px;font-size:13.5px;}
.tier-table th,.tier-table td{border:1px solid var(--line);padding:10px 14px;text-align:left;color:var(--text-dim);line-height:1.55;}
.tier-table th{background:var(--panel);color:var(--text);font-size:12px;letter-spacing:.05em;text-transform:uppercase;font-family:var(--font-mono);}
.tier-table td b{color:var(--text);}
.tier-table .ok{color:var(--green);font-weight:600;}
.tier-table .no{color:var(--text-dim);opacity:.55;}
.offer-hero{border:1px solid var(--accent);border-radius:8px;background:var(--panel);padding:22px 26px;margin:8px 0 26px;display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;}
.offer-hero .price{font-family:var(--font-mono);font-size:34px;color:var(--accent);font-weight:600;white-space:nowrap;}
.offer-hero .price small{font-size:13px;color:var(--text-dim);font-weight:400;display:block;}
.offer-list{list-style:none;padding:0;margin:14px 0;}
.offer-list li{padding:10px 0 10px 26px;position:relative;font-size:13.5px;line-height:1.6;color:var(--text-dim);border-bottom:1px dashed var(--line);}
.offer-list li::before{content:"→";position:absolute;left:0;color:var(--accent);font-family:var(--font-mono);}
.offer-list li b{color:var(--text);}
.badge-soon{display:inline-block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--amber);border:1px solid var(--amber);border-radius:3px;padding:3px 9px;}