:root{
  --papier:#f2e9d2;
  --papier2:#e6dbbd;
  --tusz:#121212;
  --tusz2:#3a3530;
  --czerw:#d3261b;
  --zolty:#f6c21c;
  --bialy:#fffaf0;
  --cien:6px 6px 0 var(--tusz);
  --nag:'Bangers','Impact','Arial Narrow',sans-serif;
  --tekst:'Barlow Condensed','Arial Narrow',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--tekst);font-size:18px;line-height:1.3;color:var(--tusz);
  background:var(--papier);
  background-image:radial-gradient(rgba(0,0,0,.10) 1px,transparent 1.4px);
  background-size:6px 6px;
  min-height:100vh;padding-bottom:calc(84px + env(safe-area-inset-bottom));
  -webkit-tap-highlight-color:transparent;
}
img{display:block;max-width:100%}
button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:0;cursor:pointer}
input{font-family:inherit;font-size:inherit;color:inherit}
h1{font-family:var(--nag);font-size:52px;line-height:.95;letter-spacing:1px;text-transform:uppercase;-webkit-text-stroke:0}
.ekran{max-width:560px;margin:0 auto;padding:0 14px 20px}
.ekran > .panel{margin-top:16px}

/* ---- etykiety, tekst ---- */
.etykieta{font-family:var(--nag);font-size:17px;letter-spacing:2px;color:var(--czerw);margin-bottom:6px}
.etykieta-jasna{font-family:var(--nag);font-size:16px;letter-spacing:2px;color:var(--zolty)}
.mala{font-size:16px;color:var(--tusz2);margin:6px 0}
.mala b{color:var(--tusz)}
.link{color:var(--czerw);text-decoration:underline;font-weight:600;font-size:15px;margin-top:6px}

/* ---- panele manga ---- */
.panel{
  background:var(--bialy);border:4px solid var(--tusz);box-shadow:var(--cien);
  padding:14px 16px;position:relative;
}
.panel:nth-child(odd){transform:rotate(-.4deg)}
.panel:nth-child(even){transform:rotate(.3deg)}
.panel-naglowek{display:flex;justify-content:space-between;align-items:center;gap:10px}
.runda{font-family:var(--nag);font-size:30px;letter-spacing:1px}
.runda b{color:var(--czerw);font-size:36px}
.faza{
  font-family:var(--nag);font-size:20px;letter-spacing:2px;color:var(--bialy);
  background:var(--tusz);padding:4px 12px;transform:skew(-8deg);white-space:nowrap
}
.faza.deload{background:var(--czerw)}
.faza.rozbieg{background:#2d6a4f}
.faza-opis{margin-top:8px;font-size:16px;color:var(--tusz2)}

/* ---- hero ---- */
.hero{position:relative;margin:0 -14px;height:56vh;min-height:360px;max-height:520px;overflow:hidden;border-bottom:5px solid var(--tusz);background:#111}
.hero-img{width:100%;height:100%;object-fit:cover;object-position:top}
.hero-cien{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(10,8,6,.55) 70%,rgba(10,8,6,.95) 100%)}
.hero-tresc{position:absolute;left:18px;right:18px;bottom:20px;color:var(--bialy)}
.hero-tytul{font-family:var(--nag);font-size:96px;line-height:.85;letter-spacing:3px;color:var(--bialy);text-shadow:5px 5px 0 var(--czerw),8px 8px 0 var(--tusz)}
.hero-pod{font-family:var(--nag);font-size:18px;letter-spacing:4px;color:var(--zolty);margin-top:8px}

/* ---- alerty ---- */
.alert{
  margin-top:16px;border:4px solid var(--tusz);box-shadow:var(--cien);padding:12px 16px;
  background:var(--zolty);transform:rotate(-.6deg);
}
.alert.czerwony{background:var(--czerw);color:var(--bialy)}
.alert.czerwony .etykieta{color:var(--zolty)}
.alert .etykieta{color:var(--tusz)}
.alert p{font-size:17px;font-weight:600}
.alert .przycisk{margin-top:10px}

/* ---- następny ---- */
.nastepny-nazwa{font-family:var(--nag);font-size:54px;line-height:.9;letter-spacing:1px}
.nastepny-meta{font-size:16px;color:var(--tusz2);margin:6px 0 12px}

/* ---- przyciski ---- */
.przycisk{
  display:block;width:100%;font-family:var(--nag);font-size:26px;letter-spacing:2px;
  padding:14px 12px;border:4px solid var(--tusz);background:var(--czerw);color:var(--bialy);
  box-shadow:var(--cien);transform:skew(-6deg);transition:transform .08s,box-shadow .08s;
  text-transform:uppercase;
}
.przycisk:active{transform:skew(-6deg) translate(4px,4px);box-shadow:2px 2px 0 var(--tusz)}
.przycisk-cichy{font-family:var(--tekst);font-size:16px;font-weight:600;letter-spacing:0;text-transform:none;
  background:var(--bialy);color:var(--tusz);box-shadow:3px 3px 0 var(--tusz);padding:9px 12px;border-width:3px;margin-top:10px}
.przycisk-cichy.jasny{background:transparent;color:var(--bialy);border-color:var(--bialy);box-shadow:3px 3px 0 var(--bialy)}
.przycisk-czerwony{color:var(--czerw)}
.przyciski-rzad{display:flex;gap:10px}
.przyciski-rzad .przycisk{width:auto;flex:1}

/* ---- statystyki ---- */
.statystyki{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}
.stat{background:var(--tusz);color:var(--bialy);padding:10px 6px;text-align:center;transform:skew(-6deg);border:3px solid var(--tusz);box-shadow:4px 4px 0 var(--czerw)}
.stat-liczba{font-family:var(--nag);font-size:40px;line-height:1;color:var(--zolty)}
.stat-nazwa{font-size:12px;letter-spacing:2px;font-weight:600}

/* ---- ranga ---- */
.ranga-nazwa{font-family:var(--nag);font-size:38px;line-height:1}
.ranga-pasek{height:16px;border:3px solid var(--tusz);background:var(--papier2);margin:8px 0 6px}
.ranga-wypelnienie{height:100%;background:repeating-linear-gradient(-45deg,var(--czerw) 0 8px,#a51c13 8px 16px);width:0;transition:width .6s}
.ranga-meta{font-size:15px;color:var(--tusz2)}

/* ---- trener ---- */
.panel-trener{display:flex;gap:12px;align-items:flex-start;padding:12px}
.trener-img{width:96px;height:96px;object-fit:cover;border:4px solid var(--tusz);flex:none;background:#222}
.dymek{flex:1;position:relative;background:var(--bialy);border:3px solid var(--tusz);padding:8px 10px;border-radius:14px}
.dymek::before{content:"";position:absolute;left:-14px;top:22px;border:8px solid transparent;border-right-color:var(--tusz);border-left:0}
.dymek p{font-size:15.5px;line-height:1.3}

/* ---- trening ---- */
.dzien-hero{position:relative;margin:0 -14px;height:34vh;min-height:220px;max-height:340px;overflow:hidden;border-bottom:5px solid var(--tusz);background:#111}
.dzien-img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.dzien-cien{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1) 30%,rgba(10,8,6,.92) 100%)}
.dzien-tytul{position:absolute;left:18px;right:18px;bottom:14px;color:var(--bialy)}
.dzien-tytul .etykieta-jasna{margin-bottom:8px}
.dzien-nazwa{font-family:var(--nag);font-size:64px;line-height:.9;letter-spacing:2px;text-shadow:4px 4px 0 var(--czerw)}
.dzien-meta{font-size:15px;color:#ddd;margin-top:4px}

.wybor-dnia{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 4px}
.wybor-dnia button{font-family:var(--nag);font-size:20px;letter-spacing:1px;padding:8px 4px;border:3px solid var(--tusz);background:var(--bialy);box-shadow:3px 3px 0 var(--tusz);transform:skew(-6deg)}
.wybor-dnia button.aktywny{background:var(--tusz);color:var(--zolty)}
.wybor-dnia button small{display:block;font-family:var(--tekst);font-size:11px;letter-spacing:1px;font-weight:600}

.cwiczenie{margin-top:16px;background:var(--bialy);border:4px solid var(--tusz);box-shadow:var(--cien)}
.cwiczenie.zrobione{border-color:#2d6a4f}
.cw-naglowek{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:3px solid var(--tusz);background:var(--papier2)}
.cw-nazwa{font-family:var(--nag);font-size:22px;line-height:1;letter-spacing:.5px}
.cw-wytyczne{font-size:14px;color:var(--tusz2);margin-top:4px;font-weight:600}
.cw-numer{font-family:var(--nag);font-size:30px;color:var(--czerw);line-height:1;flex:none}
.cw-wskazowka{font-size:14.5px;color:var(--tusz2);padding:8px 12px 0;font-style:italic}
.cw-doloz{margin:10px 12px 0;background:var(--zolty);border:3px solid var(--tusz);padding:8px 10px;font-weight:800;font-size:16px;transform:rotate(-1deg);box-shadow:3px 3px 0 var(--tusz)}
.cw-doloz b{font-family:var(--nag);font-size:22px;letter-spacing:1px;color:var(--czerw);margin-right:6px}
.serie{padding:8px 12px 12px}
.seria{display:grid;grid-template-columns:30px 1fr 1fr 72px;gap:8px;align-items:center;margin-top:8px}
.seria-nr{font-family:var(--nag);font-size:20px;color:var(--tusz2)}
.seria input{width:100%;font-size:22px;font-weight:600;padding:8px 6px;border:3px solid var(--tusz);background:var(--bialy);text-align:center;border-radius:0}
.seria input:focus{outline:0;background:#fff;border-color:var(--czerw)}
.seria .ok{height:48px;border:3px solid var(--tusz);background:var(--zolty);font-family:var(--nag);font-size:22px;letter-spacing:1px;box-shadow:3px 3px 0 var(--tusz)}
.seria.ok-zrobiona .ok{background:#2d6a4f;color:var(--bialy)}
.seria.ok-zrobiona input{background:#eef5ee}
.serie-etykiety{display:grid;grid-template-columns:30px 1fr 1fr 72px;gap:8px;font-size:12px;letter-spacing:1.5px;font-weight:600;color:var(--tusz2);margin-top:4px}
.serie-poprzednio{font-size:13.5px;color:var(--tusz2);padding:0 12px 10px}

.panel-koniec{margin-top:20px}
.sygnal{display:flex;gap:10px;align-items:flex-start;font-size:16px;font-weight:600;margin:8px 0}
.sygnal input{width:24px;height:24px;flex:none;accent-color:var(--czerw);margin-top:1px}
.panel-koniec .przycisk-glowny{margin-top:12px}

.uwaga-rozbieg{margin-top:14px;background:var(--tusz);color:var(--bialy);padding:10px 14px;transform:rotate(.4deg);border:3px solid var(--tusz);box-shadow:4px 4px 0 var(--czerw);font-size:15.5px}
.uwaga-rozbieg b{color:var(--zolty);font-family:var(--nag);letter-spacing:1px;font-size:19px}

/* ---- postępy ---- */
.naglowek-ekranu{padding:22px 0 4px}
.pola{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.pola label,.pole-pelne{display:block;font-size:13px;letter-spacing:1.5px;font-weight:600;color:var(--tusz2)}
.pola input,.pole-pelne input{display:block;width:100%;margin-top:4px;font-size:22px;font-weight:600;padding:8px;border:3px solid var(--tusz);background:var(--bialy);border-radius:0;letter-spacing:0}
.pole-pelne{margin:8px 0}
.wykres{height:180px;border:3px solid var(--tusz);background:var(--bialy);background-image:linear-gradient(rgba(0,0,0,.08) 1px,transparent 1px);background-size:100% 36px;position:relative}
.wykres svg{width:100%;height:100%;display:block}
.wykres .pusty{position:absolute;inset:0;display:grid;place-items:center;color:var(--tusz2);font-weight:600}
.lista-pomiarow{margin-top:10px;font-size:15.5px}
.lista-pomiarow div{display:flex;justify-content:space-between;border-bottom:1px dashed var(--tusz2);padding:4px 0}
.lista-pomiarow .usun{color:var(--czerw);font-weight:700}
.cel-wiersz{display:flex;justify-content:space-between;border-bottom:1px dashed var(--tusz2);padding:5px 0;font-size:16px}
.rekordy div,.historia div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed var(--tusz2);padding:5px 0;font-size:15.5px}
.rekordy b,.historia b{white-space:nowrap}
.historia .sygnaly{color:var(--czerw);font-weight:700}

/* ---- plan ---- */
.plan-dzien{margin-top:16px;background:var(--bialy);border:4px solid var(--tusz);box-shadow:var(--cien);overflow:hidden}
.plan-dzien h2{font-family:var(--nag);font-size:26px;letter-spacing:1px;padding:8px 12px;background:var(--tusz);color:var(--zolty)}
.plan-dzien h2 small{font-family:var(--tekst);font-size:13px;letter-spacing:1px;color:#ccc;margin-left:8px;font-weight:600}
.plan-dzien .tabela{overflow-x:auto}
.plan-dzien table{width:100%;border-collapse:collapse;font-size:15px;min-width:420px}
.plan-dzien th{text-align:left;font-size:12px;letter-spacing:1.5px;padding:6px 10px;border-bottom:3px solid var(--tusz);color:var(--tusz2)}
.plan-dzien td{padding:7px 10px;border-bottom:1px dashed var(--tusz2);vertical-align:top}
.plan-dzien td:first-child{font-weight:600}
.plan-dzien .czas{font-size:14px;color:var(--tusz2);padding:8px 12px}
.kroki{padding-left:26px;font-size:16px;font-weight:600;margin:6px 0}
.kroki li{margin:4px 0}
.ciecie-wybor{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:6px}
.ciecie-wybor button{font-family:var(--nag);font-size:22px;padding:8px 0;border:3px solid var(--tusz);background:var(--bialy);box-shadow:3px 3px 0 var(--tusz)}
.ciecie-wybor button.aktywny{background:var(--czerw);color:var(--bialy)}
.objetosc div{display:grid;grid-template-columns:110px 1fr 70px;gap:8px;align-items:center;font-size:15px;padding:4px 0}
.objetosc .slupek{height:12px;border:2px solid var(--tusz);background:var(--papier2)}
.objetosc .slupek i{display:block;height:100%;background:var(--czerw)}
.objetosc b{text-align:right}

/* ---- nawigacja ---- */
.nawigacja{
  position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--tusz);border-top:4px solid var(--czerw);
  padding-bottom:env(safe-area-inset-bottom);z-index:20
}
.nawigacja button{flex:1;padding:8px 0 8px;color:#aaa;font-family:var(--nag);font-size:14px;letter-spacing:2px;display:flex;flex-direction:column;align-items:center;gap:2px}
.nawigacja button .ikona{font-size:22px;filter:grayscale(1) brightness(1.6)}
.nawigacja button.aktywny{color:var(--zolty)}
.nawigacja button.aktywny .ikona{filter:none}

/* ---- timer ---- */
.timer{position:fixed;inset:0;z-index:40;background:rgba(12,10,8,.94);display:grid;place-items:center;padding:20px;
  background-image:repeating-conic-gradient(from 0deg at 50% 42%,rgba(255,255,255,.05) 0deg 2deg,transparent 2deg 9deg)}
.timer-wnetrze{width:100%;max-width:420px;text-align:center;color:var(--bialy)}
.timer-czas{font-family:var(--nag);font-size:132px;line-height:1;color:var(--zolty);text-shadow:6px 6px 0 var(--czerw);margin:10px 0}
.timer-pasek{height:18px;border:3px solid var(--bialy);margin:10px 0 18px}
.timer-pasek div{height:100%;background:var(--czerw);width:100%;transition:width 1s linear}
.timer .przyciski-rzad{margin-bottom:14px}
.timer.koniec .timer-czas{animation:pulsuj .5s infinite alternate}
@keyframes pulsuj{from{transform:scale(1)}to{transform:scale(1.08)}}

/* ---- SFX ---- */
.sfx{position:fixed;inset:0;z-index:60;display:grid;place-items:center;pointer-events:none;
  background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(0,0,0,.9) 0deg 3deg,rgba(211,38,27,.9) 3deg 6deg)}
.sfx span{font-family:var(--nag);font-size:22vw;color:var(--zolty);text-shadow:8px 8px 0 var(--tusz);transform:rotate(-8deg) scale(1);animation:sfx .7s ease-out forwards;letter-spacing:4px}
@keyframes sfx{0%{transform:rotate(-8deg) scale(.2);opacity:0}30%{transform:rotate(-8deg) scale(1.15);opacity:1}100%{transform:rotate(-8deg) scale(1);opacity:1}}

/* ---- zwycięstwo ---- */
.zwyciestwo{position:fixed;inset:0;z-index:50;background:#111;overflow:auto}
.zwyciestwo-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.zwyciestwo-cien{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(10,8,6,.85) 60%,rgba(10,8,6,.98) 100%)}
.zwyciestwo-tresc{position:relative;min-height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:20px 18px calc(24px + env(safe-area-inset-bottom));color:var(--bialy);max-width:560px;margin:0 auto}
.zwyciestwo-tytul{font-family:var(--nag);font-size:64px;line-height:.9;letter-spacing:2px;text-shadow:5px 5px 0 var(--czerw)}
.zwyciestwo-pod{font-family:var(--nag);font-size:20px;letter-spacing:3px;color:var(--zolty);margin:8px 0 12px}
.zwyciestwo-lista{font-size:16px;margin-bottom:16px}
.zwyciestwo-lista div{padding:4px 0;border-bottom:1px dashed #666}
.zwyciestwo-lista b{color:var(--zolty)}

@media (max-width:380px){
  .hero-tytul{font-size:80px}
  .nastepny-nazwa{font-size:46px}
  .seria{grid-template-columns:26px 1fr 1fr 64px}
}

/* ---- v2: układ tygodnia, kondycja, szybkość ---- */
.uklad{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:12px}
.uk-dzien{border:2px solid var(--tusz);background:var(--papier2);text-align:center;padding:4px 0 5px;font-size:11px;letter-spacing:1px;font-weight:600}
.uk-dzien b{display:block;font-family:var(--nag);font-size:15px;letter-spacing:.5px;color:var(--tusz2)}
.uk-dzien.dzis{background:var(--zolty);border-width:3px}
.uk-dzien.zrob{background:#2d6a4f;color:var(--bialy)}
.uk-dzien.zrob b{color:var(--bialy)}
.kond-wiersz{display:flex;align-items:center;gap:10px;border-bottom:1px dashed var(--tusz2);padding:8px 0}
.kond-wiersz:last-child{border-bottom:0}
.kond-img{width:64px;height:48px;object-fit:cover;border:3px solid var(--tusz);flex:none;background:#222}
.kond-tresc{flex:1;min-width:0}
.kond-tresc b{font-family:var(--nag);font-size:19px;letter-spacing:.5px;display:block;line-height:1}
.kond-tresc span{font-weight:700;font-size:15px;color:var(--czerw)}
.kond-wiersz.ok .kond-tresc span{color:#2d6a4f}
.kond-tresc small{display:block;font-size:12.5px;color:var(--tusz2)}
.kond-plus{width:46px;height:46px;flex:none;border:3px solid var(--tusz);background:var(--czerw);color:var(--bialy);font-family:var(--nag);font-size:30px;box-shadow:3px 3px 0 var(--tusz)}
.cwiczenie.szybkosc .cw-naglowek{background:var(--tusz);color:var(--bialy)}
.cwiczenie.szybkosc .cw-wytyczne{color:var(--zolty)}
.cwiczenie.szybkosc .cw-numer{color:var(--zolty)}
.cw-cel{font-size:14px;font-weight:700;padding:8px 12px 0;color:var(--tusz2)}
.cel-pasek{height:10px;border:2px solid var(--tusz);background:var(--papier2);margin-top:4px}
.cel-pasek i{display:block;height:100%;background:var(--czerw)}
.cel-wiersz small{display:block;font-size:13px;color:var(--tusz2);font-weight:400}
.cel-wiersz b{text-align:right;max-width:55%}
.pola{grid-template-columns:1fr 1fr}
.timer-uwaga{color:#ddd;font-size:15px;margin:0 0 12px}
.plan-dzien tr.szyb td{background:#fff6d6}
.plan-dzien td:last-child{font-size:13.5px;color:var(--tusz2)}
.plan-dzien table{min-width:560px}
.dzien-nazwa.dluga{font-size:44px}
.nastepny-nazwa.dluga{font-size:40px}

.seria-info{font-size:13px;color:var(--tusz2);padding:6px 12px 0}


/* ---- v3: arena i panel ciosu (mechanika Iron Protocol) ---- */
.arena{position:relative;margin:0 -14px;height:62vh;min-height:400px;max-height:640px;overflow:hidden;background:#0d0b09;border-bottom:5px solid var(--tusz)}
.arena-img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .12s}
.arena.cios .arena-img{transform:translate(6px,-4px) scale(1.03)}
.arena.kontra{animation:wstrzas .45s}
@keyframes wstrzas{0%,100%{transform:translate(0)}20%{transform:translate(-8px,3px)}40%{transform:translate(7px,-2px)}60%{transform:translate(-5px,2px)}80%{transform:translate(4px,-1px)}}
.arena-cien{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0) 60%,rgba(10,8,6,.95) 100%)}
.arena-flash{position:absolute;inset:0;background:var(--bialy);opacity:0;pointer-events:none;mix-blend-mode:screen}
.arena.kontra .arena-flash{background:var(--czerw);opacity:.35!important}
.arena-gora{position:absolute;left:14px;right:14px;top:10px;color:var(--bialy)}
.hp-wiersz{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--nag);letter-spacing:1.5px}
.hp-imie{font-size:24px;text-shadow:2px 2px 0 var(--tusz)}
.hp-nr{font-size:15px;color:var(--zolty)}
.hp-pasek{position:relative;height:22px;border:3px solid var(--tusz);background:#2a1d1a;margin-top:4px;box-shadow:3px 3px 0 rgba(0,0,0,.6)}
.hp-duch{position:absolute;inset:0;right:auto;width:100%;background:#f6c21c;transition:width 1.2s ease-out}
.hp-fill{position:absolute;inset:0;right:auto;width:100%;background:repeating-linear-gradient(-45deg,var(--czerw) 0 10px,#a51c13 10px 20px);transition:width .35s}
.hp-tekst{position:absolute;inset:0;text-align:center;font-family:var(--nag);font-size:15px;letter-spacing:1.5px;line-height:16px;color:var(--bialy);text-shadow:1px 1px 0 var(--tusz)}
.garda-wiersz{display:flex;align-items:center;gap:8px;margin-top:6px;font-family:var(--nag);font-size:13px;letter-spacing:2px;color:#ddd}
.garda-pasek{flex:1;height:10px;border:2px solid var(--tusz);background:#1c2a20}
.garda-pasek div{height:100%;background:#4caf7a;transition:width .35s}
.garda-pasek div.nisko{background:var(--czerw)}
.garda-wiersz b{font-size:16px;color:var(--zolty);min-width:28px;text-align:right}
.arena-dol{position:absolute;left:18px;right:18px;bottom:12px;color:var(--bialy)}
.arena-dzien{font-family:var(--nag);font-size:40px;line-height:.9;letter-spacing:2px;text-shadow:4px 4px 0 var(--czerw)}
.arena-stat{font-size:14px;color:#ddd;margin-top:4px}
#ar-liczby{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.liczba{position:absolute;font-family:var(--nag);font-size:44px;letter-spacing:2px;color:var(--zolty);text-shadow:4px 4px 0 var(--tusz),-2px -2px 0 var(--tusz);animation:lec 1.5s ease-out forwards;transform:rotate(-6deg);white-space:nowrap}
.liczba.kryt{font-size:58px;color:var(--bialy);text-shadow:5px 5px 0 var(--czerw),-2px -2px 0 var(--tusz)}
.liczba.rana{font-size:28px;color:#ff8a80}
.liczba.slabo{font-size:22px;color:#ccc}
@keyframes lec{0%{opacity:0;transform:rotate(-6deg) scale(.4) translateY(20px)}15%{opacity:1;transform:rotate(-6deg) scale(1.15)}100%{opacity:0;transform:rotate(-6deg) scale(1) translateY(-90px)}}

.panel-cios{margin-top:14px;background:var(--bialy);border:4px solid var(--tusz);box-shadow:var(--cien);padding:12px 14px}
.pc-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.pc-top b{font-family:var(--nag);font-size:26px;line-height:1;letter-spacing:.5px}
.pc-licznik{font-family:var(--nag);font-size:26px;color:var(--czerw);flex:none}
.pc-wyt{font-size:13.5px;font-weight:700;letter-spacing:1px;color:var(--tusz2);margin-top:4px}
.pc-wsk{font-size:14.5px;font-style:italic;color:var(--tusz2);margin-top:6px}
.pc-wsk.doloz{font-style:normal;font-weight:800;background:var(--zolty);border:3px solid var(--tusz);padding:6px 8px;transform:rotate(-1deg);box-shadow:3px 3px 0 var(--tusz)}
.pc-chipy{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-top:8px}
.pc-chip-et{font-size:11px;letter-spacing:1.5px;font-weight:700;color:var(--tusz2);width:100%;margin-top:2px}
.pc-chip{font-size:14px;font-weight:700;padding:3px 8px;border:2px solid var(--tusz2);color:var(--tusz2);background:var(--papier2)}
.pc-chip.teraz{border-color:var(--czerw);color:var(--czerw);background:#fff1ef}
.pc-chip.dzis{border-color:#2d6a4f;color:#2d6a4f;background:#eef5ee}
.pc-chip.dzis i{font-style:normal;color:var(--czerw);font-size:12px}
.pc-chip.pr{border-color:var(--zolty);background:var(--zolty);color:var(--tusz)}
.pc-przerwa{margin:12px 0 10px}
.pc-przerwa .tor{position:relative;height:16px;border:3px solid var(--tusz);background:var(--papier2)}
.pc-przerwa .fill{position:absolute;inset:0;right:auto;width:0;background:var(--tusz2);transition:width .25s linear}
.pc-przerwa .okno{position:absolute;top:-6px;bottom:-6px;left:60%;right:10%;border:3px solid var(--zolty);background:rgba(246,194,28,.25)}
.pc-przerwa.gotowy .fill{background:repeating-linear-gradient(-45deg,var(--zolty) 0 8px,#e0ad0f 8px 16px)}
.pc-przerwa.zimno .fill{background:#7a9bb5}
.pc-przerwa .stopka{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px;font-size:13px;font-weight:700;letter-spacing:1px;color:var(--tusz2)}
.pc-przerwa .stopka b{font-family:var(--nag);font-size:26px;color:var(--tusz);letter-spacing:1px}
.pc-przerwa.gotowy .stopka{color:#9a7400}
.pc-przerwa.gotowy .stopka b{color:var(--czerw)}
.pc-log{display:flex;gap:8px}
.pc-log input{flex:1;min-width:0;font-size:24px;font-weight:700;text-align:center;padding:10px 4px;border:3px solid var(--tusz);background:var(--bialy);border-radius:0}
.pc-log input:focus{outline:0;border-color:var(--czerw)}
.pc-log input:disabled{background:var(--papier2);color:var(--tusz2);font-size:14px}
.pc-cios{flex:1.6;font-family:var(--nag);font-size:30px;letter-spacing:3px;border:4px solid var(--tusz);background:var(--czerw);color:var(--bialy);box-shadow:var(--cien);transform:skew(-6deg);text-transform:uppercase}
.pc-cios:active{transform:skew(-6deg) translate(4px,4px);box-shadow:2px 2px 0 var(--tusz)}
.pc-cios:disabled{background:var(--tusz2);opacity:.6}
.pc-przerwa.gotowy ~ .pc-log .pc-cios{background:var(--zolty);color:var(--tusz);box-shadow:6px 6px 0 var(--czerw)}
.pc-nav{display:flex;justify-content:space-between;gap:8px;margin-top:10px}
.pc-nav button{font-size:14px;font-weight:700;color:var(--tusz2);padding:6px 4px;letter-spacing:.5px}
.pc-nav #pc-lista{font-family:var(--nag);font-size:16px;letter-spacing:2px;color:var(--czerw);border:3px solid var(--tusz);padding:4px 14px;background:var(--bialy);box-shadow:3px 3px 0 var(--tusz)}
.runda{display:flex;justify-content:space-between;gap:10px;padding:8px 6px;border-bottom:1px dashed var(--tusz2);font-weight:600;font-size:15.5px;cursor:pointer}
.runda.teraz{background:#fff1ef;border-left:4px solid var(--czerw)}
.runda.zrob span{text-decoration:line-through;color:var(--tusz2)}
.runda b{font-family:var(--nag);font-size:20px;color:var(--czerw)}
.runda.zrob b{color:#2d6a4f}
.arena-dol .etykieta-jasna{margin-bottom:8px}
.arena-dzien.dluga{font-size:32px}


/* ---- v4: ekran walki bez scrolla, panel z szufladą (układ Iron Protocol) ---- */
body.w-walce{overflow:hidden;padding-bottom:0}
.ekran-walka{position:fixed;left:0;right:0;top:0;bottom:calc(64px + env(safe-area-inset-bottom));max-width:none;padding:0;overflow:hidden;background:#0d0b09}
.ekran-walka .arena{position:absolute;inset:0;margin:0;height:auto;min-height:0;max-height:none;border-bottom:0}
.ekran-walka .arena-img{object-position:center 12%}
.ekran-walka .arena-cien{background:linear-gradient(180deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 55%,rgba(10,8,6,.85) 100%)}
.arena-etykieta{font-family:var(--nag);font-size:13px;letter-spacing:2px;color:var(--zolty);margin-top:6px;text-shadow:1px 1px 0 var(--tusz)}
#dol{position:absolute;left:8px;right:8px;bottom:8px;z-index:10;display:flex;flex-direction:column;max-width:560px;margin:0 auto;
  background:rgba(255,250,240,.96);border:4px solid var(--tusz);box-shadow:var(--cien)}
#uchwyt{display:flex;align-items:center;gap:10px;width:100%;padding:7px 12px 6px;border-bottom:3px solid var(--tusz);background:var(--papier2);text-align:left}
#uchwyt-opis{flex:1;font-family:var(--nag);font-size:14px;letter-spacing:1.5px;color:var(--tusz2)}
#uchwyt .strzalka{font-size:22px;line-height:1;color:var(--czerw);transition:rotate .28s ease;font-weight:800}
#dol.otwarta .strzalka{rotate:180deg}
#szuflada{max-height:0;overflow:hidden;transition:max-height .3s ease}
#dol.otwarta #szuflada{max-height:52vh;overflow-y:auto;border-bottom:3px solid var(--tusz)}
.szu{padding:10px 12px 12px}
.szu-stat{display:flex;gap:8px;margin-bottom:8px}
.szu-stat span{flex:1;background:var(--tusz);color:#ccc;padding:6px 8px;font-size:11px;letter-spacing:1.5px;font-weight:700;transform:skew(-6deg)}
.szu-stat b{display:block;font-family:var(--nag);font-size:20px;letter-spacing:1px;color:var(--zolty)}
.szu .wybor-dnia{margin:4px 0 8px}
.szu .uwaga-rozbieg{margin-top:8px;font-size:14px}
.szu .pc-wsk{margin-top:8px}
.szu-etykieta{margin-top:12px}
.szu .przycisk-glowny{margin-top:10px;font-size:22px}
#mini{padding:8px 12px 10px}
#mini .pc-top b{font-size:22px}
#mini .pc-licznik{font-size:22px}
#mini .pc-przerwa{margin:8px 0 8px}
#mini .pc-przerwa .tor{height:14px}
#mini .pc-przerwa .stopka b{font-size:22px}
#mini .pc-log input{font-size:22px;padding:8px 4px}
#mini .pc-cios{font-size:26px}
@media (max-height:700px){
  #mini .pc-wyt{display:none}
  #mini .pc-przerwa{margin:6px 0}
  #mini .pc-log input{font-size:20px;padding:6px 4px}
  #dol.otwarta #szuflada{max-height:46vh}
}