:root{
  color-scheme: light;
  --bg:#eef1f4;
  --page:#e7ebef;
  --surface:#ffffff;
  --surface-2:#f4f6f8;
  --ink:#11161c;
  --ink-2:#48515c;
  --muted:#7a8390;
  --border:rgba(17,22,28,0.13);
  --border-strong:rgba(17,22,28,0.26);
  --accent:#1d5fd1;
  --accent-ink:#ffffff;
  --accent-wash:rgba(29,95,209,0.10);
  --good:#0ca30c;
  --tri-green:#1f7a3d;
  --tri-green-ink:#ffffff;
  --tri-yellow:#f2b705;
  --tri-yellow-ink:#1a1a1a;
  --tri-red:#c0272d;
  --tri-red-ink:#ffffff;
  --tri-black:#1a1b1d;
  --tri-black-ink:#ffffff;
  --shadow: 0 1px 2px rgba(17,22,28,0.06), 0 8px 24px -12px rgba(17,22,28,0.18);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --bg:#0e1116;
    --page:#0a0c10;
    --surface:#161b22;
    --surface-2:#1d242c;
    --ink:#f2f4f7;
    --ink-2:#c2cad4;
    --muted:#8793a1;
    --border:rgba(255,255,255,0.12);
    --border-strong:rgba(255,255,255,0.22);
    --accent:#5b8fe8;
    --accent-ink:#0a1322;
    --accent-wash:rgba(91,143,232,0.16);
    --good:#2fbf4f;
    --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 12px 32px -14px rgba(0,0,0,0.6);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0e1116;
  --page:#0a0c10;
  --surface:#161b22;
  --surface-2:#1d242c;
  --ink:#f2f4f7;
  --ink-2:#c2cad4;
  --muted:#8793a1;
  --border:rgba(255,255,255,0.12);
  --border-strong:rgba(255,255,255,0.22);
  --accent:#5b8fe8;
  --accent-ink:#0a1322;
  --accent-wash:rgba(91,143,232,0.16);
  --good:#2fbf4f;
  --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 12px 32px -14px rgba(0,0,0,0.6);
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--page);
  color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  padding-inline:18px;
}
h1,h2,h3{text-wrap:balance; margin:0;}
.stencil{
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  font-weight:700;
  letter-spacing:-.01em;
}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace;}
.tabular{font-variant-numeric:tabular-nums;}
button{font-family:inherit;}
:focus-visible{outline:2.5px solid var(--accent); outline-offset:2px;}
[hidden]{display:none!important;}

#app{max-width:1040px; margin:0 auto; padding-block:26px 60px;}

/* ---------- top bar ---------- */
.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 18px; margin-bottom:22px;
  background:var(--surface); border:1px solid var(--border); border-radius:10px;
  box-shadow:var(--shadow);
}
.brand{display:flex; align-items:center; gap:12px;}
.brand-badge{
  width:40px; height:40px; border-radius:7px; background:var(--accent); color:var(--accent-ink);
  display:flex; align-items:center; justify-content:center; font-size:19px; flex:none;
}
.brand-text h1{font-size:19px; line-height:1.1;}
.brand-text p{margin:2px 0 0; font-size:12.5px; color:var(--muted);}
.topbar-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}

/* ---------- aktualizacje (rozwijana lista) ---------- */
.updates{position:relative;}
.btn-icon{position:relative; padding-left:10px; padding-right:10px;}
.updates-dot{position:absolute; top:4px; right:5px; width:8px; height:8px; border-radius:50%; background:var(--tri-red); box-shadow:0 0 0 2px var(--surface);}
.updates-panel{
  position:absolute; top:calc(100% + 8px); right:0; z-index:50; width:min(360px, calc(100vw - 32px));
  max-height:min(70vh, 520px); overflow:auto; background:var(--surface); border:1px solid var(--border-strong);
  border-radius:10px; box-shadow:var(--shadow); padding:6px 0;
}
.updates-head{font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); padding:8px 16px 6px;}
.updates-list{list-style:none; margin:0; padding:0;}
#btn-install{display:inline-flex; align-items:center; gap:6px;}
#btn-install[hidden]{display:none;}
.install-steps{padding:4px 16px 12px; font-size:13px; color:var(--ink-2); line-height:1.5;}
.install-steps ol{margin:6px 0 0; padding-left:20px; display:flex; flex-direction:column; gap:6px;}
.install-steps b{color:var(--ink);}
.install-steps .install-note{margin:10px 0 0; font-size:12px; color:var(--muted);}
.updates-list li{padding:10px 16px; border-top:1px solid var(--border);}
.updates-list .u-date{font-family:"IBM Plex Mono",monospace; font-size:11.5px; color:var(--muted); display:block; margin-bottom:3px;}
.updates-list .u-title{font-size:13.5px; font-weight:700; color:var(--ink); display:block;}
.updates-list .u-text{font-size:12.5px; color:var(--ink-2); line-height:1.45; margin-top:3px; display:block;}
.updates-list li.u-important{border-left:4px solid var(--tri-red); background:color-mix(in oklab, var(--tri-red) 8%, var(--surface));}
.u-chip, .ib-chip{display:inline-block; font-family:"IBM Plex Sans",sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.08em; color:#fff; background:var(--tri-red); border-radius:4px; padding:1px 6px; vertical-align:1px;}
.important-banner{display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:14px 16px; border-radius:10px;
  border:2px solid var(--tri-red); background:color-mix(in oklab, var(--tri-red) 9%, var(--surface)); box-shadow:var(--shadow);}
.important-banner[hidden]{display:none;}
.important-banner .ib-body{display:flex; flex-direction:column; gap:3px; flex:1 1 240px; min-width:0;}
.important-banner .ib-title{font-size:15px; color:var(--ink);}
.important-banner .ib-text{font-size:13.5px; color:var(--ink-2); line-height:1.45;}
@media (max-width:560px){ .updates-panel{position:fixed; top:72px; left:16px; right:16px; width:auto;} }

.btn{
  appearance:none; border:1px solid var(--border-strong); background:var(--surface-2); color:var(--ink);
  padding:9px 14px; border-radius:8px; font-size:13.5px; font-weight:600; cursor:pointer;
  display:inline-flex; align-items:center; gap:7px; line-height:1.2;
}
.btn:hover{border-color:var(--accent);}
.btn-primary{background:var(--accent); color:var(--accent-ink); border-color:var(--accent);}
.btn-primary:hover{filter:brightness(1.06);}
.btn-ghost{background:transparent;}
.btn:disabled{opacity:.45; cursor:not-allowed;}
.btn-sm{padding:6px 10px; font-size:12.5px;}

/* ---------- cards / layout helpers ---------- */
.panel{
  background:var(--surface); border:1px solid var(--border); border-radius:12px;
  padding:22px; box-shadow:var(--shadow);
}
.stack{display:flex; flex-direction:column; gap:16px;}
.row-wrap{display:flex; gap:10px; flex-wrap:wrap;}
.eyebrow{
  font-size:11.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--accent);
}
.lede{color:var(--ink-2); font-size:15px; line-height:1.55; max-width:62ch;}

/* ---------- intro screen ---------- */
.hero{
  display:flex; flex-direction:column; gap:10px; padding-block:6px 4px;
}
.hero h2{font-size:clamp(28px,5vw,42px); line-height:1.02;}
.option-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px;}
.option-card{
  border:1.5px solid var(--border); border-radius:10px; padding:14px 16px; cursor:pointer;
  background:var(--surface-2); text-align:left; display:flex; flex-direction:column; gap:4px;
}
.option-card h4{font-size:14.5px; margin:0;}
.option-card p{margin:0; font-size:12.5px; color:var(--muted); line-height:1.4;}
.option-card[aria-pressed="true"]{border-color:var(--accent); background:var(--accent-wash);}
.field-label{font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); margin-bottom:8px; display:block;}

/* ---------- triage colors (fixed semantic, same both themes) ---------- */
.tag{display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:5px; font-size:12px; font-weight:700;}
.tag-zielony{background:var(--tri-green); color:var(--tri-green-ink);}
.tag-zolty{background:var(--tri-yellow); color:var(--tri-yellow-ink);}
.tag-czerwony{background:var(--tri-red); color:var(--tri-red-ink);}
.tag-czarny{background:var(--tri-black); color:var(--tri-black-ink); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.14);}
.tag-wyczekujacy{background:#ffffff; color:#1a1a1a; box-shadow:inset 0 0 0 1.5px #1a1a1a;}

/* ---------- game header ---------- */
.incident-bar{
  display:flex; flex-wrap:wrap; gap:10px 22px; align-items:center; justify-content:space-between;
  padding:14px 18px; background:var(--surface); border:1px solid var(--border); border-radius:10px; margin-bottom:16px;
}
.incident-bar .meta{font-size:12.5px; color:var(--muted);}
.incident-bar .meta b{color:var(--ink);}
.progress-track{height:6px; border-radius:4px; background:var(--surface-2); overflow:hidden; flex:1 1 160px; min-width:120px;}
.progress-fill{height:100%; background:var(--accent); border-radius:4px;}

/* ---------- persistent color tally (session-wide, like reference) ---------- */
.tally-row{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px;}
.tally-tile{border-radius:12px; padding:16px 8px; text-align:center; border:0; font:inherit; width:100%; cursor:pointer; transition:transform .08s ease, opacity .15s ease;}
.tally-tile:hover:not(:disabled){transform:translateY(-2px);}
.tally-tile:focus-visible{outline:3px solid var(--accent); outline-offset:2px;}
.tally-tile:disabled{opacity:.35; cursor:not-allowed;}
.tally-tile .n{font-family:"IBM Plex Mono",monospace; font-size:28px; font-weight:800; display:block; line-height:1;}
.tally-tile .l{font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; opacity:.9; margin-top:5px; display:block;}
.tally-zielony{background:var(--tri-green); color:var(--tri-green-ink);}
.tally-zolty{background:var(--tri-yellow); color:var(--tri-yellow-ink);}
.tally-czerwony{background:var(--tri-red); color:var(--tri-red-ink);}
.tally-czarny{background:var(--tri-black); color:var(--tri-black-ink); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.14);}
.tally-wyczekujacy{background:#ffffff; color:#1a1a1a; box-shadow:inset 0 0 0 2px #1a1a1a;}
.tally-row.five{grid-template-columns:repeat(5,1fr);}
.tally-tile .l{overflow-wrap:anywhere;}
@media (max-width:560px){
  .tally-row.five{grid-template-columns:repeat(6,1fr);}
  .tally-row.five .tally-tile{grid-column:span 2;}
  .tally-row.five .tally-tile:nth-child(n+4){grid-column:span 3;}
}

/* ---------- patient (triage tag) card ---------- */
.tag-card{
  border-radius:12px; overflow:hidden; border:1px solid var(--border); box-shadow:var(--shadow); background:var(--surface);
}
.tag-strip{height:10px; background:repeating-linear-gradient(90deg, var(--accent) 0 18px, transparent 18px 26px); opacity:.55;}
.tag-body{padding:22px;}
.tag-top{display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:14px;}
.tag-top h3{font-size:21px;}
.tag-top .sub{font-size:12.5px; color:var(--muted); margin-top:3px;}
.vignette{font-size:14.5px; color:var(--ink-2); line-height:1.55; margin-bottom:10px;}
.avpu-legend{font-size:11.5px; color:var(--muted); margin-bottom:16px;}

/* ---------- examination log (step-by-step transcript) ---------- */
.exam-log{display:flex; flex-direction:column; gap:6px; margin-bottom:16px;}
.exam-log .entry{
  font-size:12.5px; color:var(--ink-2); display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline;
  padding:9px 12px; background:var(--surface-2); border:1px solid var(--border); border-radius:8px;
}
.exam-log .entry .q{color:var(--ink); font-weight:600;}
.exam-log .entry .a{font-family:"IBM Plex Mono",monospace; color:var(--ink);}
.exam-log .entry .b{margin-left:auto; font-size:11px; font-weight:700; color:var(--accent); white-space:nowrap;}

/* ---------- interactive step area ---------- */
.step-kicker{font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:6px;}
.step-block h4{font-size:16.5px; margin:0 0 12px;}
.choice-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px;}
.step-list{display:flex; flex-direction:column; gap:10px;}
.step-btn{
  border:1.5px solid var(--border-strong); border-radius:10px; padding:14px 12px; cursor:pointer; text-align:center;
  background:var(--surface-2); color:var(--ink); font-weight:600; font-size:14px; transition:transform .08s ease;
}
.step-btn:hover{border-color:var(--accent); background:var(--accent-wash); transform:translateY(-1px);}
.step-btn:disabled{opacity:.4; cursor:not-allowed;}
.wrong-msg{font-size:14px; font-weight:700; color:var(--ink); background:rgba(192,39,45,0.09); border:1px solid rgba(192,39,45,0.35); border-radius:8px; padding:10px 12px; margin:0 0 12px;}
.wrong-msg.flash{animation:wrongflash .35s ease;}
@keyframes wrongflash{0%,100%{transform:translateX(0);}25%{transform:translateX(-5px);}75%{transform:translateX(5px);}}
.retry-prompt{text-align:center; padding:28px 10px;}
.retry-msg{font-size:16px; font-weight:700; margin:0 0 6px; color:var(--ink);}
.retry-msg2{font-size:13.5px; color:var(--ink-2); margin:0 0 18px;}
.retry-actions{display:flex; gap:12px; justify-content:center;}
.retry-actions .btn{min-width:96px; justify-content:center;}
.measure-reveal{display:flex; align-items:center; gap:12px; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:12px 14px; margin-bottom:16px;}
.measure-reveal .k{font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--muted);}
.measure-reveal .v{font-family:"IBM Plex Mono",monospace; font-size:18px; font-weight:700;}

/* ---------- choice buttons for final triage color (legacy reuse not used anymore) ---------- */
.choice-zielony{background:var(--tri-green); color:var(--tri-green-ink);}
.choice-zolty{background:var(--tri-yellow); color:var(--tri-yellow-ink);}
.choice-czerwony{background:var(--tri-red); color:var(--tri-red-ink);}
.choice-czarny{background:var(--tri-black); color:var(--tri-black-ink);}

/* ---------- reveal (leaf result) ---------- */
.reveal{border-radius:12px; padding:20px 22px; margin-top:4px; border:1.5px solid var(--border);}
.reveal.ok{border-color:var(--good); background:color-mix(in oklab, var(--good) 10%, var(--surface));}
.reveal.bad{border-color:var(--tri-yellow); background:color-mix(in oklab, var(--tri-yellow) 10%, var(--surface));}
.reveal-head{display:flex; align-items:center; gap:10px; margin-bottom:10px; font-size:16px; font-weight:700; flex-wrap:wrap;}
.reveal-head .icon{font-size:20px;}
.steps{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px;}
.steps li{font-size:13.5px; color:var(--ink-2); display:flex; gap:8px; align-items:baseline;}
.steps li .n{font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--muted); min-width:16px;}
.severity-note{margin-top:12px; font-size:13px; padding:10px 12px; border-radius:8px; background:var(--surface-2); border:1px solid var(--border);}

/* ---------- debrief ---------- */
.stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px;}
.stat-tile{
  background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:14px 16px;
}
.stat-tile .label{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}
.stat-tile .value{font-family:"IBM Plex Mono",monospace; font-size:28px; font-weight:600; margin-top:4px;}
.stat-tile .hint{font-size:11.5px; color:var(--muted); margin-top:3px;}
.chip{display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; padding:2px 8px; border-radius:99px; margin-top:6px;}
.chip-good{background:color-mix(in oklab, var(--good) 20%, transparent); color:var(--good);}
.chip-warn{background:color-mix(in oklab, var(--tri-yellow) 28%, transparent); color:#8a6400;}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .chip-warn{color:#f2c233;}}
:root[data-theme="dark"] .chip-warn{color:#f2c233;}

.cat-breakdown{display:flex; flex-direction:column; gap:10px;}
.cat-row{display:grid; grid-template-columns:200px 1fr 70px; align-items:center; gap:10px;}
.cat-row .cname{font-size:12.5px; font-weight:700; color:var(--ink);}
.cat-bar-track{height:10px; border-radius:6px; background:var(--surface-2); overflow:hidden; border:1px solid var(--border);}
.cat-bar-fill{height:100%; border-radius:6px; background:var(--accent);}
.cat-row .cnum{font-family:"IBM Plex Mono",monospace; font-size:12px; text-align:right; color:var(--ink-2);}

.mistake-card{border:1px solid var(--border); border-radius:10px; padding:14px 16px; background:var(--surface-2);}
.mistake-head{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:6px;}
.mistake-name{font-weight:700; font-size:14px;}
.mistake-compare{display:flex; gap:8px; align-items:center; font-size:12.5px; color:var(--ink-2); margin:6px 0;}
.mistake-note{font-size:12.5px; color:var(--ink-2); line-height:1.5;}
.mistake-list{margin:6px 0 0; padding-left:18px; font-size:12.5px; color:var(--ink-2); line-height:1.6;}

/* ---------- reference / diagram screen ---------- */
.legend-grid{display:flex; flex-wrap:wrap; gap:8px 16px; font-size:12.5px; color:var(--ink-2); margin-bottom:10px;}
.legend-grid span b{color:var(--ink);}
figure.diagram{margin:0; display:flex; flex-direction:column; gap:10px;}
figure.diagram svg{width:100%; height:auto; display:block;}
figcaption{font-size:12.5px; color:var(--muted);}
.diagram-scroll{overflow-x:auto; border:1px solid var(--border); border-radius:10px; padding:14px; background:var(--surface-2);}
.dx-box{fill:var(--surface); stroke:currentColor; stroke-width:2;}
.dx-box-wide{fill:var(--surface); stroke:currentColor; stroke-width:2; stroke-dasharray:3 3;}
.dx-label{fill:var(--ink); font-family:"IBM Plex Sans",sans-serif;}
.dx-sub{fill:var(--muted); font-family:"IBM Plex Sans",sans-serif;}
.dx-edge{stroke:var(--ink-2); stroke-width:2; fill:none;}
.dx-edge-label{fill:var(--ink-2); font-family:"IBM Plex Mono",monospace;}
.dx-outcome text{font-weight:700; font-family:"IBM Plex Sans",sans-serif;}
.dx-green{fill:var(--tri-green);} .dx-green text{fill:#fff;}
.dx-yellow{fill:var(--tri-yellow);} .dx-yellow text{fill:#1a1a1a;}
.dx-red{fill:var(--tri-red);} .dx-red text{fill:#fff;}
.dx-black{fill:var(--tri-black); stroke:rgba(255,255,255,0.25);} .dx-black text{fill:#fff;}
.dx-white rect{fill:#ffffff; stroke:#1a1a1a; stroke-width:2;} .dx-white text{fill:#1a1a1a;}
figure.diagram svg + svg{margin-top:18px;}

/* ---------- SALT krok 1: segregacja calej grupy ---------- */
.sort-list{display:flex; flex-direction:column; gap:8px;}
.sort-row{display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; justify-content:space-between; padding:10px 12px; background:var(--surface-2); border:1px solid var(--border); border-radius:8px;}
.sort-who{display:flex; flex-direction:column; gap:2px; font-size:13px; color:var(--ink-2); flex:1 1 240px;}
.sort-who b{color:var(--ink); font-size:14px;}
.sort-btns{display:flex; flex-wrap:wrap; gap:6px;}
.sort-btn{border:1.5px solid var(--border-strong); background:var(--surface); color:var(--ink); border-radius:8px; padding:8px 10px; font:inherit; font-size:12.5px; font-weight:600; cursor:pointer;}
.sort-btn:hover:not(:disabled){border-color:var(--accent);}
.sort-btn:disabled{opacity:.35; cursor:default;}
.sort-btn.picked{opacity:1;}
.sort-btn.picked.sort-walk{background:var(--tri-green); color:var(--tri-green-ink); border-color:var(--tri-green);}
.sort-btn.picked.sort-wave{background:var(--tri-yellow); color:var(--tri-yellow-ink); border-color:var(--tri-yellow);}
.sort-btn.picked.sort-none{background:var(--tri-red); color:var(--tri-red-ink); border-color:var(--tri-red);}
.tabs{display:flex; gap:8px; margin-bottom:16px; flex-wrap:wrap;}
.tab-btn{border:1px solid var(--border-strong); background:var(--surface-2); color:var(--ink); padding:8px 14px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer;}
.tab-btn[aria-selected="true"]{background:var(--accent); color:var(--accent-ink); border-color:var(--accent);}

.promo-symprm{
  position:relative; overflow:hidden; display:flex; align-items:center; gap:16px; min-width:0; max-width:100%;
  padding:20px 20px 18px; border-radius:14px; text-decoration:none; color:var(--ink);
  background:linear-gradient(135deg, color-mix(in oklab, var(--accent) 16%, var(--surface)) 0%, var(--surface) 70%);
  border:1px solid color-mix(in oklab, var(--accent) 45%, var(--border)); box-shadow:var(--shadow);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.promo-symprm::before{content:""; position:absolute; inset:0 0 auto 0; height:4px;
  background:linear-gradient(90deg, var(--tri-green) 0 25%, var(--tri-yellow) 25% 50%, var(--tri-red) 50% 75%, var(--strip-black, var(--tri-black)) 75% 100%);}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .promo-symprm{--strip-black:#4a4f57;}}
:root[data-theme="dark"] .promo-symprm{--strip-black:#4a4f57;}
.promo-symprm:hover{transform:translateY(-2px); border-color:var(--accent);}
.promo-symprm:focus-visible{outline:3px solid var(--accent); outline-offset:2px;}
.promo-symprm .promo-icon{width:56px; height:56px; flex:none; border-radius:12px; background:#fff; padding:4px; box-shadow:0 1px 3px rgba(0,0,0,.18);}
.promo-symprm .promo-body{display:flex; flex-direction:column; gap:3px; min-width:0; flex:1 1 auto;}
.promo-symprm .promo-kicker{font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--accent);}
.promo-symprm strong{font-size:18px; line-height:1.2;}
.promo-symprm .promo-desc{font-size:13px; color:var(--ink-2); line-height:1.45;}
.promo-symprm .promo-cta{flex:none; display:inline-flex; align-items:center; padding:9px 16px; border-radius:99px;
  background:var(--accent); color:var(--accent-ink); font-size:13.5px; font-weight:700; white-space:nowrap;}
@media (max-width:560px){
  .promo-symprm{flex-wrap:wrap; gap:12px 14px;}
  .promo-symprm .promo-body{flex-basis:calc(100% - 72px);}
  .promo-symprm .promo-cta{width:100%; justify-content:center;}
}
footer.note a{color:var(--accent);}
.credit-kg{display:flex; width:fit-content; max-width:100%; flex-wrap:wrap; justify-content:center; align-items:baseline; gap:2px 6px; margin:14px auto 0; padding:8px 14px;
  border:1px solid var(--border); border-radius:99px; text-decoration:none; color:var(--muted) !important; font-size:12px;}
.credit-kg b{color:var(--ink); font-weight:700;}
.credit-kg .credit-sub{color:var(--muted);}
.credit-kg:hover{border-color:var(--accent);}
footer.note{font-size:12px; color:var(--muted); text-align:center; margin-top:26px; line-height:1.6;}

@media (prefers-reduced-motion:reduce){ .choice-btn, .step-btn, .tally-tile{transition:none;} .wrong-msg.flash{animation:none;} }

.brand-badge{background:#fff; padding:3px; overflow:hidden;}
.brand-badge img{width:100%; height:100%; display:block;}

/* warunki korzystania */
.legal{max-width:760px; margin:0 auto}
.legal h1{font-size:28px}
.legal h2{font-size:17px; margin-top:8px}
.legal p, .legal li{font-size:15px; line-height:1.6; color:var(--ink-2); margin:0}
.legal ul{margin:0; padding-left:22px; display:flex; flex-direction:column; gap:4px}
.legal-meta{font-size:13px !important; color:var(--muted) !important}
.legal-back{font-size:14px; color:var(--accent); text-decoration:none; font-weight:600}
.copy{display:block; margin-top:6px}
.copy a{color:var(--accent)}