:root{
  --ink:#121110; --ink2:#2a2724; --paper:#eeeeec; --paper2:#e0e0dd; --card:#fafaf8;
  --red:#e0262d; --red-d:#b51a21; --mute:#6f6a62; --line:#121110;
  --display:'Barlow Condensed','Arial Narrow',Impact,sans-serif;
  --nar:'Barlow Condensed','Arial Narrow',sans-serif;
  --body:'Montserrat',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--body);-webkit-font-smoothing:antialiased;
}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url(/img/bg-blotch.jpg?v=5) center/cover no-repeat;mix-blend-mode:multiply;opacity:.7}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}

/* top bar */
.bar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:8px max(16px,env(safe-area-inset-left));background:var(--paper);border-bottom:3px solid var(--ink)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{height:54px;width:auto;}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text b{font:700 24px var(--nar);letter-spacing:.04em}
.brand-text i{font:600 11px var(--nar);letter-spacing:.14em;text-transform:uppercase;color:var(--red);font-style:normal;margin-top:3px}
.nav{display:flex;gap:4px}
.nav a{font:700 14px var(--nar);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:8px 10px}
.nav a:hover{background:var(--ink);color:var(--paper)}

/* hero */
.hero{position:relative;overflow:hidden;border-bottom:3px solid var(--ink);min-height:min(78vh,640px);display:flex;align-items:flex-end}
.peak{position:absolute;right:-6%;bottom:-2px;width:min(68vw,640px);aspect-ratio:1/1.05;background:var(--red);
  clip-path:polygon(0 100%,10% 66%,22% 70%,41% 18%,50% 0,58% 22%,66% 38%,74% 34%,100% 100%);}
.peak::after{content:"";position:absolute;inset:0;background:
  repeating-linear-gradient(112deg,transparent 0 11px,rgba(18,17,16,.22) 11px 13px),
  repeating-linear-gradient(74deg,transparent 0 17px,rgba(18,17,16,.14) 17px 18px);mix-blend-mode:multiply}
.hero-copy{position:relative;padding:48px 20px 36px;max-width:1100px;margin:0 auto;width:100%}
.kicker{font:700 14px var(--nar);letter-spacing:.2em;text-transform:uppercase;margin:0 0 14px;display:inline-block;background:var(--ink);color:var(--paper);padding:5px 12px}
.hero h1{font:800 clamp(56px,12vw,150px)/.88 var(--display);margin:0;text-transform:uppercase;letter-spacing:-.005em}
.when{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 10px;padding:0}
.when span{font:700 clamp(18px,4vw,26px) var(--nar);letter-spacing:.06em;text-transform:uppercase;border:3px solid var(--ink);padding:4px 14px;background:var(--paper)}
.when span:first-child{background:var(--ink);color:var(--paper)}
.tag{font:italic 500 17px var(--body);margin:6px 0 0;max-width:30ch;background:var(--paper);display:inline-block;padding:2px 8px}

/* blocks */
.block{max-width:1100px;margin:0 auto;padding:56px 20px 8px}
.block-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:20px;border-bottom:3px solid var(--ink);padding-bottom:6px}
.block-head h2{font:800 clamp(34px,6vw,52px)/1 var(--display);text-transform:uppercase;margin:0;display:flex;align-items:center;gap:12px}
.clock{font:700 18px var(--nar);letter-spacing:.08em;color:var(--mute);font-variant-numeric:tabular-nums}
.dot{width:14px;height:14px;border-radius:50%;background:var(--mute);flex:none}
.dot.on{background:var(--red);box-shadow:0 0 0 0 rgba(224,38,45,.7);animation:ping 1.6s infinite}
@keyframes ping{70%{box-shadow:0 0 0 12px rgba(224,38,45,0)}100%{box-shadow:0 0 0 0 rgba(224,38,45,0)}}

/* live rows */
.live-grid{display:grid;gap:18px;grid-template-columns:1.4fr 1fr}
@media(max-width:860px){.live-grid{grid-template-columns:1fr}}
.live-list{display:flex;flex-direction:column;gap:10px}
.live{position:relative;border:3px solid var(--ink);background:var(--card);overflow:hidden}
.live summary{position:relative;list-style:none;display:flex;gap:12px;align-items:flex-start;padding:14px;cursor:pointer;min-height:44px}
.live summary::-webkit-details-marker{display:none}
.room-tag{font:700 14px var(--nar);letter-spacing:.08em;background:var(--red);color:#fff;padding:3px 9px;flex:none}
.live .t{font:600 16px/1.3 var(--body);flex:1;min-width:0}
.live .t small{display:block;font:italic 400 14px var(--body);color:var(--mute);margin-top:2px}
.live .chev{margin-top:8px;width:12px;height:12px;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(45deg);transition:.2s;flex:none;margin-right:4px}
.live[open] .chev{transform:rotate(-135deg)}
.live .more{position:relative;border-top:3px solid var(--ink);padding:10px 14px;font-size:15px;display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.live .more b{font:700 13px var(--nar);letter-spacing:.1em;text-transform:uppercase;color:var(--red-d)}
.demo-badge{font:700 11px var(--nar);letter-spacing:.14em;border:2px solid var(--ink);padding:1px 6px;margin-left:8px;vertical-align:2px;background:var(--paper)}
.idle{border:3px dashed var(--ink);padding:26px 20px;background:var(--card)}
.idle .big{font:800 clamp(34px,7vw,56px)/1 var(--display);text-transform:uppercase;margin:0 0 6px;font-variant-numeric:tabular-nums}
.idle p{margin:0;color:var(--mute)}
.btn{display:inline-block;margin-top:14px;font:700 14px var(--nar);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;background:var(--ink);color:var(--paper);padding:10px 16px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--red);transition:.12s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--red)}
.btn.ghost{background:transparent;color:var(--ink)}
.link{background:none;border:0;padding:0;font:700 13px var(--nar);letter-spacing:.1em;text-transform:uppercase;text-decoration:underline;text-underline-offset:3px;color:var(--ink)}
.link:hover{color:var(--red)}

/* news */
.news{border:3px solid var(--ink);background:var(--ink);color:var(--paper);align-self:start}
.news h3{margin:0;padding:8px 14px;font:700 14px var(--nar);letter-spacing:.16em;text-transform:uppercase;background:var(--red);color:#fff}
.news ul{list-style:none;margin:0;padding:0;max-height:420px;overflow:auto}
.news li{padding:12px 14px;border-top:1px solid rgba(233,230,223,.2)}
.news li:first-child{border-top:0}
.news time{font:600 12px var(--nar);letter-spacing:.12em;color:#ff8d92;text-transform:uppercase}
.news strong{display:block;font:700 17px/1.25 var(--body);margin:2px 0}
.news p{margin:0;font-size:15px;opacity:.88}
.news .pin{color:var(--red);margin-right:4px}
.news .empty{padding:16px 14px;opacity:.7}
.notice{margin:14px 0 0;font-size:14px;color:var(--mute);border-left:4px solid var(--red);padding-left:10px}

/* tabs / chips */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.tab{font:700 16px var(--nar);letter-spacing:.08em;text-transform:uppercase;border:3px solid var(--ink);background:transparent;padding:8px 16px}
.tab small{font-weight:500;opacity:.7;margin-left:6px}
.tab[aria-selected=true]{background:var(--ink);color:var(--paper)}
.tab:hover:not([aria-selected=true]){background:var(--paper2)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.chip{font:700 13px var(--nar);letter-spacing:.08em;text-transform:uppercase;border:2px solid var(--ink);background:var(--card);padding:5px 12px;border-radius:99px}
.chip[aria-pressed=true]{background:var(--red);border-color:var(--red);color:#fff}

/* agenda */
.slot{display:grid;grid-template-columns:96px 1fr;gap:14px;margin-bottom:12px}
.slot .time{font:700 20px/1.1 var(--nar);padding-top:14px;font-variant-numeric:tabular-nums;border-top:3px solid var(--ink)}
.slot .time small{display:block;font-weight:500;font-size:14px;color:var(--mute)}
.slot .items{display:grid;gap:10px}
.sess{position:relative;background:var(--card);border:3px solid var(--ink);padding:12px 14px 12px 18px;display:grid;gap:4px}
.sess::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--red)}
.sess.past{opacity:.5}
.sess.live-now{box-shadow:5px 5px 0 var(--red)}
.sess .row1{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sess .tg{font:600 12px var(--nar);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.sess h4{margin:0;font:600 19px/1.25 var(--body)}
.sess .sp{font:italic 400 15px var(--body);color:var(--ink2)}
.sess p{margin:2px 0 0;font-size:15px;color:var(--ink2)}
.sess .acts{margin-top:6px}
.now-pill{font:700 11px var(--nar);letter-spacing:.14em;background:var(--red);color:#fff;padding:2px 7px}
@media(max-width:560px){.slot{grid-template-columns:1fr;gap:6px}.slot .time{display:flex;gap:10px;align-items:baseline;padding-top:6px}}
.none{padding:22px;border:3px dashed var(--ink);background:var(--card)}

/* map */
.map-wrap{display:grid;grid-template-columns:1fr 300px;gap:18px;align-items:start}
@media(max-width:900px){.map-wrap{grid-template-columns:1fr}}
.stage{position:relative;border:3px solid var(--ink);background:#fff;overflow:hidden}
.stage img{width:100%;height:auto}
.stage svg{position:absolute;inset:0;width:100%;height:100%}
.zone{fill:rgba(224,38,45,0);stroke:rgba(224,38,45,0);stroke-width:2;stroke-linejoin:round;cursor:pointer;transition:fill .18s,stroke .18s}
.zone:hover,.zone.focus{fill:rgba(224,38,45,.34);stroke:#e0262d}
.zone.live{fill:rgba(224,38,45,.28);stroke:#e0262d;animation:glow 1.8s ease-in-out infinite}
.zone.focus{stroke-width:3.5}
.poi{fill:rgba(18,17,16,0);stroke:rgba(18,17,16,0);stroke-width:2;cursor:pointer;transition:.18s}
.poi:hover,.poi.focus{fill:rgba(18,17,16,.28);stroke:#121110}
@keyframes glow{50%{fill:rgba(224,38,45,.5)}}
.pin circle{fill:var(--ink);stroke:#fff;stroke-width:2}
.pin text{font:700 13px 'Archivo Narrow',sans-serif;fill:#fff;text-anchor:middle;dominant-baseline:central;letter-spacing:.04em;pointer-events:none}
.pin.live circle{fill:var(--red)}
.pin{pointer-events:none}
.pin .ring{fill:none;stroke:var(--red);stroke-width:2;opacity:0}
.pin.live .ring{animation:ring 1.8s ease-out infinite}
@keyframes ring{0%{r:12;opacity:.9}100%{r:30;opacity:0}}
.poi-pin{pointer-events:none}
.poi-pin circle{fill:#fff;stroke:var(--ink);stroke-width:2}
.poi-pin text{font:700 11px 'Archivo Narrow',sans-serif;text-anchor:middle;dominant-baseline:central;fill:var(--ink)}
.tip{position:absolute;pointer-events:none;background:var(--ink);color:var(--paper);padding:8px 11px;font-size:13px;line-height:1.35;max-width:230px;border-left:4px solid var(--red);z-index:3;transform:translate(-50%,calc(-100% - 12px))}
.tip b{font:700 14px var(--nar);letter-spacing:.06em;text-transform:uppercase;display:block}
.legend{display:flex;flex-direction:column;gap:8px}
.leg{display:block;width:100%;text-align:left;border:3px solid var(--ink);background:var(--card);padding:9px 12px;transition:.12s}
.leg:hover,.leg.focus{background:var(--ink);color:var(--paper)}
.leg .n{font:700 15px var(--nar);letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:8px}
.leg .n i{font-style:normal;background:var(--red);color:#fff;padding:0 7px;font-size:13px}
.leg .s{font-size:13px;opacity:.8;margin-top:2px}
.leg .s.on{color:var(--red-d);font-weight:600;opacity:1}
.leg:hover .s.on,.leg.focus .s.on{color:#ff8d92}
.switch{display:flex;align-items:center;gap:10px;margin-top:14px;font:600 14px var(--nar);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.switch input{accent-color:var(--red);width:20px;height:20px}

/* info */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:40px}
.info h3{font:700 16px var(--nar);letter-spacing:.14em;text-transform:uppercase;color:var(--red-d);margin:0 0 6px}
.info p{margin:0}
.foot{margin-top:60px;background:var(--ink);color:var(--paper);display:flex;gap:18px;align-items:center;justify-content:center;padding:34px 20px;border-top:6px solid var(--red)}
.foot p{margin:0;font-size:15px}
.foot small{opacity:.6}
.foot a{color:#ff8d92}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ---- v2: czytelność, pasek postępu, język, mobile ---- */
body{font-size:16px;line-height:1.55}
.hero h1{margin-left:-2px}
.kicker,.when span,.tab,.chip,.btn,.room-tag,.leg .n,.brand-text b,.nav a,.news h3{font-family:var(--nar)}
.kicker{font-weight:700;font-size:15px}
.nav a{font-size:17px;font-weight:700}
.tab,.chip{font-size:17px;font-weight:700;min-height:44px}
.chip{font-size:15px;min-height:40px;display:inline-flex;align-items:center}
.room-tag{font-size:16px;font-weight:700;line-height:1.3}
.btn{font-size:16px;font-weight:700;min-height:44px}
.link{font-family:var(--nar);font-size:16px;font-weight:700;min-height:32px}
.brand-text b{font-size:30px;font-weight:800}
.brand-text i{font-size:13px;font-weight:700}
.sess h4{font:700 18px/1.3 var(--body)}
.slot .time{font-weight:800;font-size:24px}
.live .tt{display:block;font-weight:700}
.live .t small{font:italic 400 14px var(--body)}
.prog{display:block;margin-top:10px}
.prog .track{display:block;height:10px;background:rgba(18,17,16,.14);border:2px solid var(--ink);position:relative;overflow:hidden}
.prog .track i{display:block;height:100%;background:var(--red);position:relative;transition:width 1s linear;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.28) 0 6px,transparent 6px 12px)}
.prog .pt{display:flex;justify-content:space-between;margin-top:4px;font:700 14px var(--nar);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.prog .pt b:nth-child(2){color:var(--red-d)}
.lang{display:flex;border:3px solid var(--ink);margin-left:auto}
.lang button{background:transparent;border:0;font:800 15px var(--nar);letter-spacing:.08em;padding:6px 12px;min-height:38px}
.lang button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.lang button:focus-visible,.tab:focus-visible,.chip:focus-visible,.leg:focus-visible,.btn:focus-visible,.link:focus-visible,.nav a:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.tabs.levels{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.tabs.levels .tab{flex:none}

@media(max-width:700px){
  html{scroll-padding-top:112px}
  .bar{flex-wrap:wrap;gap:6px 10px;padding:8px 14px 0;align-items:center}
  .brand img{width:48px;height:48px}
  .brand-text b{font-size:26px}
  .lang{margin-left:auto}
  .nav{order:3;width:100%;margin:0 -14px;padding:0 14px;border-top:2px solid var(--ink);justify-content:space-between;width:calc(100% + 28px)}
  .nav a{flex:1;text-align:center;padding:11px 4px;font-size:16px}
  .hero{min-height:0;align-items:flex-start}
  .peak{width:86vw;right:-14%;opacity:.95}
  .hero-copy{padding:26px 16px 30px}
  .kicker{font-size:13px;padding:4px 10px;letter-spacing:.14em}
  .hero h1{font-size:clamp(58px,19vw,100px);line-height:.9}
  .when{margin:18px 0 8px;gap:8px}
  .when span{font-size:20px;padding:3px 10px}
  .tag{font-size:15px}
  .block{padding:36px 16px 4px}
  .block-head{flex-wrap:wrap;align-items:flex-end;gap:2px 12px}
  .block-head h2{font-size:38px}
  .clock{font-size:16px}
  .live summary{padding:12px}
  .live .more{flex-direction:column;align-items:flex-start;gap:6px}
  .news ul{max-height:none}
  .tab{padding:8px 14px}
  .slot .time{font-size:20px}
  .sess{padding:12px 12px 12px 16px}
  .foot{flex-direction:column;text-align:center;padding-bottom:calc(30px + env(safe-area-inset-bottom))}
  .map-wrap{gap:12px}
  .legend{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .leg{padding:9px 10px}
  .leg .s{font-size:12px}
  .tip{display:none}
  body{padding-bottom:70px}
}
@media(max-width:420px){.legend{grid-template-columns:1fr}}

/* v3: serce z plakatu 24. KFG zamiast góry */
.peak{clip-path:none;aspect-ratio:auto;background:none;height:auto;width:min(46vw,420px);right:4%;bottom:6%;transform:rotate(4deg)}
.peak::after{display:none}
@media(max-width:700px){.peak{width:62vw;right:-4%;bottom:auto;top:10px;opacity:1}.brand img{height:44px}}

/* v4: znak 24. KFG w wysokiej jakości */
.brand img{height:48px;width:auto;filter:none}
.peak{filter:none;width:min(40vw,400px)}
@media(max-width:700px){.brand img{height:38px}.peak{width:56vw}}

/* v4: pędzlowy nagłówek jak w materiałach KFG */
:root{--brush:'Bangers','Barlow Condensed',Impact,sans-serif}
.hero h1{font:400 clamp(46px,9.4vw,112px)/1.02 var(--brush);letter-spacing:0;text-transform:uppercase}
.block-head h2,.info h2,h2{font-family:var(--brush);font-weight:400;letter-spacing:.005em;text-transform:uppercase}
@media(max-width:700px){.hero h1{font-size:clamp(42px,13.5vw,76px);line-height:1.04}}

/* v5: karta programu jak w MSHP – godziny i sala od razu widoczne */
#agenda-list{display:grid;gap:12px}
.sess{padding:14px 16px 14px 20px;gap:6px}
.sess .row1{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.tpill{font:800 clamp(20px,5.2vw,26px)/1 var(--nar);letter-spacing:.03em;background:var(--red);color:#fff;padding:7px 14px;white-space:nowrap}
.where{display:inline-flex;align-items:center;gap:6px;font:600 clamp(15px,4vw,17px) var(--nar);letter-spacing:.04em;text-transform:uppercase;color:var(--ink)}
.where i{font-style:normal;background:var(--ink);color:var(--paper);padding:1px 7px;font-weight:700}
.pinic{width:18px;height:18px;fill:var(--red);flex:none}
.sess h4{font:700 clamp(19px,5vw,23px)/1.2 var(--body);margin:4px 0 0}
.sess .sp{font-size:15px;color:var(--mute)}
.sess .sp .tg{font:700 12px var(--nar);letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--ink);color:var(--ink);padding:0 6px;margin-left:2px}
.sess.live-now{background:#fff;box-shadow:6px 6px 0 var(--red)}
.sess.live-now .tpill{background:var(--ink)}
.sess.past{opacity:.55}

/* Bangers: pełne polskie znaki, trochę węższy niż Knewave */
.hero h1{font-size:clamp(54px,11vw,132px);line-height:.98;letter-spacing:.015em}
.block-head h2,h2{letter-spacing:.03em}
@media(max-width:700px){.hero h1{font-size:clamp(50px,16vw,92px)}}

/* serce blisko treści także na szerokich ekranach */
@media(min-width:701px){.peak{right:max(3%,calc((100% - 1100px)/2 + 10px));bottom:50%;transform:translateY(50%) rotate(4deg);width:min(38vw,430px)}}

/* interlinia na akcenty (Ó, Ę, Ż, Ł) – nie mogą wchodzić w linię wyżej */
.hero h1{line-height:1.24 !important;padding-top:.08em}
.block-head h2,h2{line-height:1.3}
@media(max-width:700px){.hero h1{line-height:1.22 !important}}

/* po rozwinięciu „Teraz na żywo”: co będzie następne */
.live .more{display:grid;gap:10px}
.nx{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:4px 10px;border-top:2px dashed var(--ink);padding-top:10px}
.nx-l{font:800 13px var(--nar);letter-spacing:.16em;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:2px 8px}
.nx-w{font:800 20px var(--nar);letter-spacing:.03em;color:var(--red)}
.nx-r{font:600 14px var(--nar);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.nx-t{grid-column:1/-1;font:700 17px/1.25 var(--body)}
.nx small{grid-column:1/-1;color:var(--mute);font-size:14px}
.live .more .nx-t{font:700 18px/1.25 var(--body);text-transform:none;letter-spacing:0;color:var(--ink)}
.live .more .nx small{font:400 14px var(--body);color:var(--mute);text-transform:none}
.live .more .link{justify-self:start;margin:0}
/* telefon: serce w wolnym miejscu obok krótszych linii nagłówka, nie na napisie */
@media(max-width:700px){
  .peak{width:34vw;right:4vw;left:auto;bottom:auto;top:calc(104px + 1.22 * clamp(50px,16vw,92px));transform:rotate(4deg)}
}

/* v6: góra z plakatu 24. KFG (wysoka jakość) zamiast serca */
.peak{display:block;height:auto;filter:none;mix-blend-mode:normal;aspect-ratio:auto;clip-path:none;background:none}
@media(min-width:701px){
  .peak{position:absolute;left:auto;top:auto;bottom:-3px;right:max(3%,calc((100% - 1100px)/2 + 10px));width:min(44vw,520px);transform:none}
}
@media(max-width:700px){
  .hero{flex-direction:column;align-items:stretch}
  .peak{position:relative;order:2;left:auto;right:auto;top:auto;bottom:auto;transform:none;width:76vw;max-width:420px;margin:-4px 0 -3px auto}
}

/* v7: spójna skala odstępów (8 / 12 / 16 / 24 / 40 / 64) */
:root{--s1:8px;--s2:12px;--s3:16px;--s4:24px;--s5:40px;--s6:64px}
.block{padding:var(--s6) 20px 0}
.block-head{margin-bottom:var(--s4);padding-bottom:var(--s2);gap:var(--s1) var(--s2)}
.block-head h2,h2{line-height:1.15;padding-top:.12em}
.hero-copy{padding-bottom:var(--s5)}
.hero-copy .kicker{margin-bottom:var(--s3)}
.when{margin:var(--s4) 0 var(--s3)}
.tag{margin:var(--s2) 0 0}
#live-body{display:grid;gap:var(--s3)}
#live-body .live{margin:0}
.notice{margin-top:var(--s4)}
.tabs{gap:var(--s1);margin-bottom:var(--s3)}
.chips{gap:var(--s1);margin-bottom:var(--s4)}
#agenda-list{gap:var(--s3)}
.sess{padding:var(--s3) var(--s3) var(--s3) 22px;gap:var(--s2)}
.sess .row1{gap:var(--s2) var(--s3)}
.sess h4{margin:0}
.sess .acts{margin-top:var(--s1)}
.info-grid{gap:var(--s5) var(--s4);margin-bottom:0}
.info-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2)}
.info-grid h3{margin:0}
.info-grid p{margin:0;max-width:44ch}
.info-grid .btn{margin-top:var(--s1)}
.foot{margin-top:var(--s6)}
.stage{margin-bottom:var(--s3)}
#legend{gap:var(--s2)}
@media(max-width:700px){
  .block{padding:var(--s5) 16px 0}
  .hero-copy{padding:var(--s4) 16px var(--s3)}
  .peak{margin-top:0}
  .chips{flex-wrap:nowrap;overflow-x:auto;margin-inline:-16px;padding:2px 16px var(--s1);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .chips::-webkit-scrollbar{display:none}
  .chip{flex:none}
  .tabs{margin-bottom:var(--s2)}
  .sess{padding:var(--s3) var(--s3) var(--s3) 20px}
}
@media(max-width:700px){.peak{margin-top:-28px}}

/* v8: góra na środku jak na kfg.pl */
.hero{border-bottom:3px solid var(--ink)}
@media(max-width:900px){
  .hero{display:flex;flex-direction:column;align-items:stretch;min-height:0}
  .peak{position:relative;order:2;left:auto;right:auto;top:auto;bottom:auto;transform:none;width:min(72vw,400px);max-width:none;margin:-24px auto var(--s5)}
  .hero-copy{padding:var(--s4) 16px 0}
}
@media(min-width:901px){
  .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,460px) minmax(0,1fr);grid-template-rows:auto 1fr auto auto;
    column-gap:24px;padding:var(--s5) max(20px,calc((100% - 1100px)/2 + 20px));min-height:0;align-items:start}
  .hero-copy{display:contents}
  .hero .kicker{grid-column:1/3;grid-row:1;justify-self:start;margin:0}
  .hero h1{grid-column:1;grid-row:2;align-self:center;margin:var(--s3) 0;font-size:clamp(46px,5.6vw,86px)}
  .peak{position:static;grid-column:2;grid-row:1/5;align-self:center;justify-self:center;width:100%;transform:none;margin:0}
  .hero .when{grid-column:3;grid-row:2;align-self:center;justify-self:end;margin:0;flex-direction:column;align-items:flex-end;gap:var(--s2)}
  .hero .tag{grid-column:3;grid-row:3;justify-self:end;text-align:right;align-self:start;margin:var(--s3) 0 0}
}
@media(max-width:900px){.peak{margin-top:var(--s2) !important;margin-bottom:var(--s5) !important}}

/* v9: desktop – tekst po lewej, góra po prawej (wyśrodkowana w pionie) */
@media(min-width:901px){
  .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,500px);grid-template-rows:auto;column-gap:var(--s5);align-items:center;
    padding:var(--s5) max(20px,calc((100% - 1100px)/2 + 20px))}
  .hero-copy{display:block;grid-column:1;grid-row:1;padding:0;margin:0;max-width:none;width:auto}
  .hero .kicker,.hero h1,.hero .when,.hero .tag{grid-column:auto;grid-row:auto;justify-self:auto;align-self:auto;text-align:left}
  .hero h1{margin:var(--s3) 0;font-size:clamp(54px,7.4vw,112px)}
  .hero .when{flex-direction:row;align-items:center;margin:var(--s4) 0 var(--s3)}
  .hero .tag{margin:var(--s2) 0 0}
  .peak{grid-column:2;grid-row:1;align-self:center;justify-self:end;width:100%;position:static;transform:none;margin:0}
}

/* v10: telefon/tablet – góra w tle za tekstem */
@media(max-width:900px){
  .hero{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:min(640px,calc(100svh - 150px))}
  .peak{position:absolute !important;order:0;z-index:0;left:50% !important;right:auto !important;top:52% !important;bottom:auto !important;
    transform:translate(-50%,-50%) !important;width:min(128vw,620px) !important;max-width:none;margin:0 !important;pointer-events:none}
  .hero-copy{position:relative;z-index:1;padding:var(--s5) 16px}
  .hero .when span:not(:first-child),.hero .tag{background:var(--paper)}
}
@media(max-width:900px){.peak{left:61% !important;top:55% !important}}

/* v11: hero na telefonie – mieści się w ekranie, treść od góry, góra w tle nieco w prawo */
@media(max-width:900px){
  .hero{justify-content:flex-start;min-height:min(680px,calc(100dvh - 128px))}
  .hero-copy{padding:var(--s4) 16px var(--s5)}
  .peak{left:64% !important;top:57% !important;width:min(124vw,640px) !important}
  .hero h1{text-shadow:0 0 18px rgba(238,238,236,.55)}
}
@media(max-width:900px){
  .hero{min-height:0}
  .peak{left:63% !important;top:57% !important;width:min(84vw,430px) !important}
  .hero-copy{padding-bottom:var(--s5)}
}
@media(max-width:900px){.peak{left:57% !important}.hero .tag{width:fit-content;max-width:100%}}
@media(max-width:900px){.hero h1{text-shadow:none}}

/* v12: pasek postępu na całym kafelku (wypełnienie od lewej + czerwona krawędź), jak w MSHP */
@property --p{syntax:'<percentage>';inherits:false;initial-value:0%}
.live,.sess.live-now{--p:0%;transition:--p 1s linear;
  background:linear-gradient(90deg,rgba(224,38,45,.2) 0,rgba(224,38,45,.2) calc(var(--p) - 5px),var(--red) calc(var(--p) - 5px),var(--red) var(--p),var(--card) var(--p))}
.live .prog{margin-top:8px}
.live .prog .pt{margin-top:0;font-size:15px}
.live .prog .pt b:nth-child(2){color:var(--ink)}
.btn:active,.tab:active,.chip:active{transform:translateY(1px)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}}

/* v13: hasło jako czerwona taśma jak na plakatach KFG; miękka dolna krawędź góry */
.hero .tag{font:400 clamp(20px,5.4vw,26px)/1.1 var(--brush);letter-spacing:.05em;text-transform:uppercase;font-style:normal;
  background:var(--red);color:#fff;padding:8px 16px 7px;transform:rotate(-1.5deg);transform-origin:left center;display:inline-block;max-width:none;
  clip-path:polygon(0 8%,3% 0,97% 4%,100% 0,99% 92%,96% 100%,2% 96%,0 100%)}
@media(max-width:900px){.hero .tag{margin-top:var(--s4)}.hero .tag{width:fit-content;max-width:100%}}
@media(max-width:900px){.peak{top:49% !important;width:min(80vw,410px) !important}.hero .tag{margin-top:var(--s5)}}

/* v14: zwarte kafelki programu z przyciskiem „Pokaż więcej” */
details.sess{display:block;padding:0}
details.sess>summary{list-style:none;cursor:pointer;display:grid;gap:6px;padding:12px 14px 12px 18px}
details.sess>summary::-webkit-details-marker{display:none}
details.sess .tpill{font-size:clamp(18px,4.8vw,22px);padding:5px 10px}
details.sess .where{font-size:clamp(13px,3.6vw,15px);gap:5px}
details.sess .where i{padding:0 6px}
details.sess .pinic{width:15px;height:15px}
details.sess .row1{gap:6px 10px}
details.sess .now-pill,details.sess .demo-badge{font-size:11px;padding:2px 6px;margin:0}
details.sess h4{font:700 clamp(16px,4.4vw,19px)/1.25 var(--body);margin:2px 0 0}
details.sess .sp{font-size:14px;margin:0}
.morebtn{display:inline-flex;align-items:center;gap:6px;justify-self:start;margin-top:4px;font:700 13px var(--nar);letter-spacing:.1em;text-transform:uppercase;color:var(--red-d)}
.morebtn::after{content:"";width:8px;height:8px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s}
details.sess[open] .morebtn::after{transform:rotate(-135deg) translateY(-2px)}
.morebtn .m-close,details.sess[open] .morebtn .m-open{display:none}
details.sess[open] .morebtn .m-close{display:inline}
details.sess>summary:focus-visible{outline:3px solid var(--red);outline-offset:2px}
details.sess .body{display:grid;gap:10px;justify-items:start;padding:10px 14px 14px 18px;border-top:2px dashed var(--ink)}
details.sess .body p{margin:0;font-size:15px;max-width:60ch}
details.sess .body .tg{font:700 12px var(--nar);letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--ink);padding:0 6px}
#agenda-list{gap:var(--s2)}

/* v15: filtry sal bez przewijania w bok: siatka 2 kolumny, wszystko na jednym ekranie */
@media(max-width:700px){
  .chips{display:grid;grid-template-columns:1fr 1fr;gap:var(--s1);overflow:visible;flex-wrap:wrap;margin-inline:0;padding:0}
  .chips .chip{width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.15;font-size:14px;padding:6px 10px;border-radius:12px;white-space:normal}
  .chips .chip:first-child{grid-column:1/-1}
}

/* aktualności: na głównej tylko najnowsze + link do podstrony; podstrona z pełną listą */
.news ul{max-height:none;overflow:visible}
.news-all{display:block;padding:12px 14px;border-top:2px solid var(--red);font:800 14px var(--nar);letter-spacing:.12em;text-transform:uppercase;color:#fff;text-decoration:none;background:rgba(224,38,45,.18)}
.news-all:hover,.news-all:focus-visible{background:var(--red)}
.news-all::after{content:" \2192"}
.posts{display:grid;gap:var(--s3);max-width:760px}
.npost{background:var(--card);border:3px solid var(--ink);padding:var(--s3) var(--s3) var(--s3) 22px;position:relative}
.npost::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--red)}
.npost.pinned{box-shadow:5px 5px 0 var(--red)}
.nmeta{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap}
.nmeta time{font:700 13px var(--nar);letter-spacing:.12em;text-transform:uppercase;color:var(--red-d)}
.npost h3{margin:6px 0 4px;font:700 clamp(18px,4.6vw,22px)/1.25 var(--body)}
.npost p{margin:0;font-size:16px;max-width:62ch;white-space:pre-line}
.row-more{margin-top:var(--s4)}
.none{color:var(--mute)}

/* v16: postęp tylko jako kolorowe wypełnienie kafelka, bez czerwonej krawędzi (czytelność tekstu) */
.live,.sess.live-now{background:linear-gradient(90deg,rgba(224,38,45,.17) 0,rgba(224,38,45,.17) var(--p),var(--card) var(--p))}

/* ===== v17: paleta z plakatów 24. KFG + porządek obrazów =====
   Neutralne chłodne szarości (jak papier i plamy na plakatach), jedna czerwień z plakatu (#e31d2b).
   Czerwień oznacza „teraz / aktywne”; struktura i pozostałe stany są w czerni i szarości. */
:root{
  --ink:#151515; --ink2:#2b2b2b; --paper:#efefed; --paper2:#e2e2df; --card:#fff;
  --red:#e31d2b; --red-d:#b3121e; --mute:#5c5c5c; --line:#151515;
  --tint:#fde3e4;           /* wypełnienie postępu: jasna czerwień, pełny kolor (bez przezroczystości) */
}
body{background:var(--paper)}

/* postęp: pełny jasny odcień zamiast półprzezroczystego różu */
.live,.sess.live-now{background:linear-gradient(90deg,var(--tint) 0,var(--tint) var(--p),var(--card) var(--p))}

/* program: godziny czarne, czerwone tylko dla trwających; pasek z lewej szary, czerwony gdy „teraz” */
.tpill,details.sess .tpill{background:var(--ink);color:#fff}
.sess.live-now .tpill,details.sess.live-now .tpill{background:var(--red)}
.sess::before{background:var(--paper2)}
.sess.live-now::before{background:var(--red)}
.sess.past{opacity:.5}
.sess.past .tpill{background:var(--mute)}
.sess .sp,.sess .sp i{color:var(--mute)}

/* mapa: przełącznik nad planem, legenda – sale jako karty, udogodnienia jako zwarte chipy */
#mapa .switch{margin:0 0 var(--s3)}
.legend{gap:var(--s1)}
.pois{margin-top:var(--s2)}
.pois-h{display:block;font:700 12px var(--nar);letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin-bottom:var(--s1)}
.pois-list{display:flex;flex-wrap:wrap;gap:6px}
.poi-chip{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:4px 12px 4px 5px;border:2px solid var(--ink);background:var(--card);border-radius:99px;
  font:700 13px var(--nar);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);cursor:pointer}
.poi-chip .ic{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:2px solid var(--ink);font:700 11px var(--nar);line-height:1}
.poi-chip:hover,.poi-chip.focus{background:var(--ink);color:#fff}
.poi-chip:hover .ic,.poi-chip.focus .ic{border-color:#fff}
.poi-chip:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.stage{background:#fff;border-color:var(--ink)}

/* stopka: znak „I ♥ KFG” w wersji jasnej */
.foot{gap:var(--s4)}
.foot-logo{height:56px;width:auto}

@media(max-width:700px){
  /* zakładki pięter w jednym rzędzie, bez ucinania */
  .tabs.levels{display:grid;grid-template-columns:repeat(4,1fr);overflow:visible;gap:6px}
  .tabs.levels .tab{padding:8px 4px;font-size:14px;text-align:center}
  /* plan piętra na całą szerokość ekranu */
  .stage{margin-inline:-16px;border-left:0;border-right:0}
  .legend{grid-template-columns:1fr}
  .foot-logo{height:48px}
}
/* mniej czerwieni naraz: bez czerwonego cienia, aktywny filtr czarny (czerwień = „teraz”) */
.sess.live-now,details.sess.live-now{box-shadow:none}
.chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}