/* Czcionki z własnego serwera (bez Google Fonts – szybciej i bez wysyłania danych do Google) */
@font-face{font-family:'Anton'; src:url(fonts/Anton-Regular.woff) format('woff'); font-weight:400; font-display:swap}
@font-face{font-family:'Pirata One'; src:url(fonts/PirataOne-Regular.woff) format('woff'); font-weight:400; font-display:swap}
@font-face{font-family:'Public Sans'; src:url(fonts/PublicSans-var.woff) format('woff'); font-weight:100 900; font-style:normal; font-display:swap}
@font-face{font-family:'Public Sans'; src:url(fonts/PublicSans-Italic-var.woff) format('woff'); font-weight:100 900; font-style:italic; font-display:swap}
/* ===== EWANGELIA RIFFU.PL — v2 „Plakat koncertowy” =====
   Nocny (domyślny): czarne tło, kremowe litery i grube ramki, czerwień riffu.
   Jasny: papier z sitodruku, czarna farba, ta sama czerwień. */
:root{
  --ink:#121010;        /* tło */
  --ink-2:#1c1917;      /* pola formularzy, puste okładki */
  --line:#ece3cf;       /* grube ramki */
  --line-soft:#3a332b;  /* cienkie linie pomocnicze */
  --parch:#ece3cf;      /* tekst i ramki */
  --parch-dim:#a49883;  /* daty, podpisy */
  --blood:#d42a1b;      /* czerwień riffu */
  --blood-hi:#ef4a3a;   /* drobna czerwień na ciemnym */
  --on-blood:#f6efe0;   /* tekst na czerwonym */
  --gold:#c9a24b;
  --soft:#d9cfbb;       /* zajawki */
  --strong:#ffffff;
  --bar:rgba(18,16,16,.94);
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .95 0 0 0 0 .85 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  --f-logo:'Pirata One', Georgia, serif;     /* tylko logotyp */
  --f-black:'Anton', 'Oswald', Impact, sans-serif; /* tytuły, etykiety, przyciski */
  --f-serif:'Public Sans', Arial, sans-serif;     /* treść */
  --f-mono:'Anton', 'Oswald', Impact, sans-serif;
  --frame:5px;          /* grubość ramek plakatu */
  --read-size:18px;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --ink:#ece3cf; --ink-2:#e2d7bf; --line:#151210; --line-soft:#c9bb9f;
  --parch:#151210; --parch-dim:#5f5446;
  --blood:#d42a1b; --blood-hi:#c4251a; --soft:#2d2722; --strong:#000;
  --bar:rgba(236,227,207,.95);
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .15 0 0 0 0 .1 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  color-scheme:light;
}
@media (min-width:600px){ :root{ --read-size:19px; --frame:6px } }
@media (min-width:1024px){ :root{ --read-size:20px } }
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{margin:0; background:var(--ink) var(--noise); color:var(--parch); font-family:var(--f-serif); font-size:17px; line-height:1.6; min-height:100vh;
  transition:background-color .25s, color .25s}
a{color:var(--parch)}
img{max-width:100%; height:auto; display:block}
picture{display:block}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.wrap, .wrap-wide{margin:0 auto; padding:0 max(16px, env(safe-area-inset-right, 0px)) 0 max(16px, env(safe-area-inset-left, 0px))}
.wrap{max-width:760px}
.wrap-wide{max-width:1240px}
:focus-visible{outline:3px solid var(--blood); outline-offset:3px}
.narrow{max-width:420px; margin:0 auto}
.mono{font-family:var(--f-mono); letter-spacing:.04em}
.muted{color:var(--parch-dim)}
.center{text-align:center}
.wm-red{color:var(--blood)}

/* ----- Górny pasek: logo, menu, tryb; gruba kreska pod spodem; chowa się przy przewijaniu w dół ----- */
.topbar{position:sticky; top:0; z-index:25; padding-top:env(safe-area-inset-top, 0px); background:var(--bar);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); transition:transform .28s ease}
.topbar.is-hidden{transform:translateY(-100%)}
.topbar-inner{max-width:1240px; margin:0 auto; height:60px; display:flex; align-items:center; gap:14px;
  padding:0 max(16px, env(safe-area-inset-right, 0px)) 0 max(16px, env(safe-area-inset-left, 0px)); border-bottom:var(--frame) solid var(--line)}
.topbar-brand{display:flex; align-items:center; gap:10px; min-height:44px; text-decoration:none; margin-right:auto; min-width:0}
.topbar-name{font-family:var(--f-logo); font-size:27px; line-height:1; color:var(--parch); white-space:nowrap}
.topnav{display:none; gap:22px}
.topnav a{font-family:var(--f-black); font-size:17px; letter-spacing:.05em; text-transform:uppercase; text-decoration:none; min-height:44px; display:flex; align-items:center}
.topnav a:hover{color:var(--blood-hi)}
@media (min-width:1024px){ .topnav{display:flex} }
@media (prefers-reduced-motion:reduce){ .topbar, .progress span{transition:none} }

.theme-toggle{flex:none; width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:transparent;
  border:3px solid var(--line); border-radius:0; color:var(--parch); cursor:pointer}
.theme-toggle:hover{background:var(--parch); color:var(--ink)}
.theme-toggle .ico-moon{display:none}
:root[data-theme="light"] .theme-toggle .ico-sun{display:none}
:root[data-theme="light"] .theme-toggle .ico-moon{display:block}

.progress{position:fixed; top:0; left:0; right:0; height:5px; z-index:30}
.progress span{display:block; height:100%; width:0; background:var(--blood); transition:width .1s linear}

/* ----- Zdjęcia w rastrze (sitodruk): czerwień + czerń; najechanie / powiększenie pokazuje oryginał ----- */
.card-img, .photos figure{position:relative; overflow:hidden; background:var(--blood)}
.card-img img, .photos img{filter:grayscale(1) contrast(1.6) brightness(1.08); mix-blend-mode:multiply; transition:filter .35s, transform .5s}
.card-img::after, .photos figure::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(circle, rgba(0,0,0,.32) 1px, transparent 1.6px) 0 0/6px 6px; mix-blend-mode:multiply; transition:opacity .35s}
@media (hover:hover){
  .card-link:hover .card-img img{filter:none; mix-blend-mode:normal}
  .card-link:hover .card-img::after{opacity:0}
}

/* ----- Etykiety ----- */
.meta{font-family:var(--f-black); font-size:15px; letter-spacing:.05em; text-transform:uppercase; color:var(--parch-dim); margin:0 0 8px}
.meta .num{color:var(--blood-hi)}
.eyebrow{display:inline-block; font-family:var(--f-black); font-size:15px; letter-spacing:.06em; text-transform:uppercase; background:var(--blood); color:var(--on-blood); padding:3px 9px; margin:0 0 12px}
.card-link{text-decoration:none; display:block; color:inherit}
.excerpt{margin:0 0 14px; color:var(--soft); font-size:var(--read-size); line-height:1.55}
.more{display:inline-flex; align-items:center; min-height:44px; font-family:var(--f-black); font-size:16px; letter-spacing:.06em; text-transform:uppercase; color:var(--blood-hi); text-decoration:none}
.sec-title{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(36px, 9vw, 54px); line-height:1; margin:0 0 14px; letter-spacing:.01em}

/* ----- Wyróżniony list = plakat ----- */
.featured{margin:22px 0 46px}
.featured .card-link{border:var(--frame) solid var(--line); display:grid}
.featured .card-img{margin:0; border-bottom:var(--frame) solid var(--line)}
.featured .card-img img, .card-img-featured{aspect-ratio:1/1; width:100%; object-fit:cover}
.featured-text{padding:20px 18px 24px}
.featured h2{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(58px, 17vw, 150px); line-height:.88; margin:4px 0 16px; letter-spacing:-.005em; overflow-wrap:break-word; hyphens:auto}
.featured .excerpt{font-weight:500}
.cta{display:inline-block; margin-top:6px; background:var(--blood); color:var(--on-blood); font-family:var(--f-black); font-size:21px; text-transform:uppercase; letter-spacing:.04em;
  padding:12px 22px; transform:rotate(-2deg); transition:transform .2s}
.card-link:hover .cta{transform:rotate(0) scale(1.03)}
@media (min-width:900px){
  .featured .card-link{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
  .featured .card-img{border-bottom:0; border-right:var(--frame) solid var(--line)}
  .featured .card-img img, .featured .card-img picture, .card-img-featured{height:100%}
  .featured-text{padding:34px 38px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start}
  .featured h2{font-size:clamp(76px, 8.4vw, 132px)}
}

/* Okładka zastępcza, gdy list nie ma zdjęcia */
.card-img-empty{display:flex; align-items:center; justify-content:center; aspect-ratio:16/10; background:var(--parch) !important}
.card-img-empty::after{display:none}
.card-img-empty .mark path[stroke="var(--parch)"]{stroke:var(--ink)}
.ph-num{position:absolute; top:10px; left:12px; font-family:var(--f-black); font-size:20px; color:var(--ink)}

/* ----- Poprzednie listy = małe plakaty ----- */
.recent{margin:0 0 46px}
.grid{display:grid; grid-template-columns:1fr; gap:22px; border-top:var(--frame) solid var(--line); padding-top:22px}
.card{min-width:0}
.card .card-link{border:3px solid var(--line); height:100%; display:flex; flex-direction:column}
.card .card-img{margin:0; border-bottom:3px solid var(--line)}
.card .card-img img, .card .card-img-empty{aspect-ratio:16/10; width:100%; object-fit:cover}
.card .meta, .card h2, .card .excerpt, .card .more{margin-left:16px; margin-right:16px}
.card .meta{margin-top:14px}
.card h2{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(30px, 8vw, 36px); line-height:.98; margin-top:0; margin-bottom:10px; transition:color .2s}
.card .excerpt{font-size:16px}
.card .more{margin-top:auto; margin-bottom:6px}
.card-link:hover h2{color:var(--blood-hi)}
@media (min-width:700px){ .grid{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (min-width:1024px){ .grid{grid-template-columns:repeat(3, minmax(0,1fr)); gap:26px} .card h2{font-size:34px} }

/* ----- Archiwum = lista dat z trasy ----- */
.archive{margin:0 0 30px; scroll-margin-top:80px}
.archive-list{list-style:none; margin:0; padding:0; border-top:var(--frame) solid var(--line)}
.archive-list a{display:grid; grid-template-columns:auto 1fr; grid-template-areas:"num title" "num date"; gap:2px 14px; align-items:center;
  min-height:64px; padding:14px 0; border-bottom:3px solid var(--line); text-decoration:none; color:var(--parch)}
.a-num{grid-area:num; align-self:center; min-width:3.2em; text-align:center; font-family:var(--f-black); font-size:18px; background:var(--blood); color:var(--on-blood); padding:6px 8px}
.a-title{grid-area:title; font-family:var(--f-black); text-transform:uppercase; font-size:24px; line-height:1.02; min-width:0}
.a-date{grid-area:date; font-family:var(--f-black); font-size:14px; letter-spacing:.05em; text-transform:uppercase; color:var(--parch-dim)}
.archive-list a:hover .a-title{color:var(--blood-hi)}
@media (min-width:700px){
  .archive-list a{grid-template-columns:5em 1fr auto; grid-template-areas:"num title date"; padding:16px 0}
  .a-title{font-size:32px}
  .a-date{font-size:16px}
}
.recent{scroll-margin-top:80px}
.featured{scroll-margin-top:80px}

/* ----- Pojedynczy list ----- */
.letter{padding:30px 0 10px}
.letter h1{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(54px, 15vw, 120px); line-height:.9; margin:4px 0 26px; overflow-wrap:break-word; hyphens:auto}
.letter .meta{color:var(--blood-hi); font-size:16px}
.draft-note{font-family:var(--f-black); font-size:15px; text-transform:uppercase; letter-spacing:.06em; background:var(--blood); color:#fff; display:inline-block; padding:4px 10px; margin:0 0 16px}
.photos{display:grid; gap:16px; margin:0 auto 34px}
.photos figure{margin:0; border:var(--frame) solid var(--line)}
.photos img{width:100%; cursor:zoom-in}
.photos figcaption{position:absolute; left:0; bottom:0; z-index:2; background:var(--ink); color:var(--parch); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:14px; padding:5px 10px}
@media (min-width:600px){
  .photos-2{grid-template-columns:1fr 1fr}
  .photos-2 img{aspect-ratio:4/5; object-fit:cover}
}
.lightbox{position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(10,9,8,.95); cursor:zoom-out}
.lightbox[hidden]{display:none}
.lightbox img{max-width:100%; max-height:100%; object-fit:contain}
.lightbox-close{position:absolute; top:calc(10px + env(safe-area-inset-top, 0px)); right:max(10px, env(safe-area-inset-right, 0px)); width:48px; height:48px;
  border:3px solid #ece3cf; background:#121010; color:#ece3cf; font-size:28px; line-height:1; cursor:pointer}

.body{font-size:var(--read-size); line-height:1.75; max-width:680px; margin:0 auto; hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word}
.body p{margin:0 0 1.15em}
.body strong{color:var(--strong); font-weight:700}
.body em{font-style:italic}
.body blockquote{margin:1.4em 0; padding:0; font-family:var(--f-black); font-style:normal; text-transform:uppercase; font-size:clamp(32px, 8vw, 46px); line-height:1; color:var(--blood-hi)}
.body blockquote p{margin:0}
.letter h1, .letter .meta, .letter .photos, .letter .draft-note{max-width:680px; margin-left:auto; margin-right:auto}
.drop-first > p:first-child::first-letter, .drop::first-letter{
  font-family:var(--f-black); float:left; font-size:4.2em; line-height:.84; color:var(--on-blood); background:var(--blood);
  padding:.06em .12em .02em; margin:.08em .14em 0 0}
.amen{display:flex; justify-content:center; margin:34px 0 10px}

/* ----- Koniec listu ----- */
.letter-end{max-width:680px; margin:8px auto 34px; display:flex; flex-direction:column; gap:14px}
.btn-next{display:flex; flex-direction:column; gap:6px; padding:20px 22px; min-height:56px; text-decoration:none; background:var(--blood); color:var(--on-blood); transition:transform .15s}
.btn-next:hover{transform:rotate(-.6deg)}
.btn-next-label{font-family:var(--f-black); font-size:16px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink)}
:root[data-theme="light"] .btn-next-label{color:var(--on-blood); opacity:.85}
.btn-next-title{font-family:var(--f-black); text-transform:uppercase; font-size:34px; line-height:1}
.end-note{margin:0; padding:16px 0 4px; text-align:center; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:20px; color:var(--parch-dim)}
.end-row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.btn-share, .btn-outline, .btn-insta{display:flex; align-items:center; justify-content:center; gap:10px; min-height:54px; padding:10px 14px;
  font-family:var(--f-black); font-size:17px; letter-spacing:.05em; text-transform:uppercase; text-decoration:none; text-align:center;
  background:transparent; color:var(--parch); border:3px solid var(--line); border-radius:0; cursor:pointer}
.btn-share:hover, .btn-outline:hover, .btn-insta:hover{background:var(--parch); color:var(--ink)}
.btn-insta b{font-weight:400; color:var(--blood-hi); text-transform:none}
.btn-insta:hover b{color:var(--blood)}
.prev-link{display:flex; align-items:center; min-height:44px; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:16px; color:var(--parch-dim); text-decoration:none}
.prev-link:hover{color:var(--blood-hi)}
.empty{padding:60px 0; font-size:22px}

/* ----- Stopka ----- */
.colophon{text-align:center; padding:30px 16px 48px; margin-top:20px; border-top:var(--frame) solid var(--line); max-width:1240px; margin-left:auto; margin-right:auto}
.foot-brand{display:inline-flex; flex-direction:column; align-items:center; gap:6px; text-decoration:none}
.foot-brand span{font-family:var(--f-logo); font-size:34px; line-height:1}
.colophon p{margin:6px 0; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:15px; color:var(--parch-dim)}
.colophon .foot-tag{color:var(--parch)}
.foot-links{display:flex; justify-content:center; flex-wrap:wrap; gap:4px 22px; margin-top:10px !important}
.foot-links a{display:inline-flex; align-items:center; gap:6px; min-height:44px; text-decoration:none; color:var(--parch-dim)}
.foot-links a:hover{color:var(--blood-hi)}

/* ===== PANEL ===== */
body.admin{font-size:17px}
.admin-bar{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 16px; border-bottom:var(--frame) solid var(--line); background:var(--bar); position:sticky; top:0; z-index:5}
.admin-brand{font-family:var(--f-logo); font-size:26px; text-decoration:none}
.admin-links{display:flex; align-items:center; gap:16px; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:15px}
.admin-links a{text-decoration:none; color:var(--parch-dim)}
.admin-links a:hover{color:var(--parch)}
.admin-title{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:46px; line-height:1; margin:34px 0 22px}
.btn{display:inline-block; font-family:var(--f-black); font-size:17px; letter-spacing:.05em; text-transform:uppercase;
  background:var(--blood); color:#fff !important; border:0; padding:13px 24px; cursor:pointer; text-decoration:none}
.btn:hover{filter:brightness(1.1)}
.btn-sm{padding:8px 14px; font-size:14px}
.notice{padding:12px 14px; font-size:15px; border-left:5px solid}
.notice.ok{border-color:var(--gold); background:rgba(201,162,75,.1)}
.notice.err{border-color:var(--blood); background:rgba(212,42,27,.14)}
.form{display:flex; flex-direction:column; gap:18px; margin-bottom:60px}
.form label{display:flex; flex-direction:column; gap:7px; font-family:var(--f-black); font-size:15px; letter-spacing:.05em; text-transform:uppercase; color:var(--parch-dim)}
.form input:not([type=checkbox]):not([type=file]), .form textarea{
  font-family:var(--f-serif); font-size:18px; color:var(--parch); background:var(--ink-2);
  border:3px solid var(--line-soft); padding:12px 14px; border-radius:0; width:100%; text-transform:none; letter-spacing:0}
.form textarea{line-height:1.55; resize:vertical; min-height:260px}
.form input:focus, .form textarea:focus{outline:none; border-color:var(--blood)}
.hint{font-size:13px; margin:-10px 0 0; color:var(--parch-dim)}
.form .check{flex-direction:row; align-items:center; gap:10px; text-transform:none; letter-spacing:0; font-family:var(--f-serif); font-size:15px}
.form .check input{width:18px; height:18px; accent-color:var(--blood)}
.photo-slots{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media (max-width:560px){ .photo-slots{grid-template-columns:1fr} }
.slot{border:3px solid var(--line-soft); padding:14px; margin:0; display:flex; flex-direction:column; gap:10px; min-width:0}
.slot legend{font-family:var(--f-black); font-size:15px; letter-spacing:.05em; text-transform:uppercase; padding:0 6px}
.slot-preview{aspect-ratio:4/3; background:var(--ink-2); display:flex; align-items:center; justify-content:center; overflow:hidden; color:var(--parch-dim); font-size:13px}
.slot-preview img{width:100%; height:100%; object-fit:cover}
.file-btn{position:relative; text-align:center; border:3px dashed var(--line-soft); padding:11px; cursor:pointer; color:var(--parch) !important}
.file-btn:hover{border-color:var(--blood)}
.file-btn input{position:absolute; inset:0; opacity:0; cursor:pointer}
.slot input[name^=caption]{font-size:16px !important; padding:9px 11px !important}
.row{display:flex; gap:20px; align-items:flex-end; flex-wrap:wrap}
.actions{display:flex; align-items:center; gap:22px}
.actions a{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:15px}
.post-list{list-style:none; padding:0; margin:0 0 60px; border-top:var(--frame) solid var(--line)}
.post-list li{display:flex; align-items:center; gap:14px; padding:14px 0; border-bottom:3px solid var(--line-soft)}
.thumb{width:64px; height:64px; flex:none; background:var(--ink-2); border:3px solid var(--line)}
.thumb img{width:100%; height:100%; object-fit:cover}
.pl-main{flex:1; min-width:0; display:flex; flex-direction:column}
.pl-title{font-family:var(--f-black); text-transform:uppercase; font-size:24px; line-height:1.05; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pl-meta{font-size:13px; color:var(--parch-dim)}
.tag{color:var(--blood-hi); font-weight:700}
.pl-actions{display:flex; gap:14px; align-items:center; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px}
.pl-actions a{color:var(--parch-dim); text-decoration:none}
.pl-actions a:hover{color:var(--parch)}
.pl-actions form{margin:0}
.link-danger{background:none; border:0; padding:0; color:var(--blood-hi); font:inherit; text-transform:inherit; letter-spacing:inherit; cursor:pointer}
@media (max-width:560px){ .post-list li{flex-wrap:wrap} .pl-actions{width:100%; padding-left:78px} }
.empty-admin{padding:40px 0; display:flex; flex-direction:column; align-items:flex-start; gap:16px}

/* ----- Wyrównanie grubych kresek z treścią + drobne poprawki ----- */
.topbar{padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px))}
.topbar-inner{max-width:1208px; padding:0}
.colophon{max-width:none; margin:20px max(16px, calc((100% - 1208px) / 2)) 0}
.featured .excerpt, .card .excerpt{display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden}
.featured .excerpt{-webkit-line-clamp:4}
.card .excerpt{-webkit-line-clamp:3}
@media (min-width:900px){ .featured .excerpt{-webkit-line-clamp:5} }
/* Okładka bez zdjęcia: ciemne pole w rastrze ze znakiem */
.card-img-empty{background:radial-gradient(circle, var(--line-soft) 1px, transparent 1.6px) 0 0/8px 8px, var(--ink-2) !important}
.card-img-empty .mark path[stroke="var(--parch)"]{stroke:var(--parch)}
.ph-num{color:var(--blood-hi)}
@media (min-width:600px) and (max-width:899px){ .featured .card-img img, .card-img-featured{aspect-ratio:16/10} }
.admin-logo{font-family:var(--f-logo); text-transform:none; font-size:44px}

/* ----- Strona główna: przycisk do całego archiwum ----- */
.btn-archive{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px; padding:18px 20px; min-height:64px;
  border:var(--frame) solid var(--line); text-decoration:none; font-family:var(--f-black); text-transform:uppercase; transition:background .15s, color .15s}
.btn-archive span{font-size:clamp(26px, 6vw, 34px); line-height:1}
.btn-archive b{font-weight:400; font-size:18px; letter-spacing:.04em; color:var(--blood-hi); white-space:nowrap}
.btn-archive:hover{background:var(--parch); color:var(--ink)}
.btn-archive:hover b{color:var(--blood)}

/* ----- Strona archiwum: lata (zwijane), miesiące, wyszukiwarka ----- */
.arch-page{padding:28px 0 20px}
.arch-title{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(64px, 18vw, 130px); line-height:.88; margin:0 0 8px}
.arch-count{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; color:var(--blood-hi); margin:0 0 22px}
.arch-search input{width:100%; font:500 18px var(--f-serif); color:var(--parch); background:transparent; border:3px solid var(--line); border-radius:0; padding:14px 16px; margin-bottom:22px}
.arch-search input::placeholder{color:var(--parch-dim)}
.arch-search input:focus{outline:none; border-color:var(--blood)}
.arch-none{font-family:var(--f-black); text-transform:uppercase; font-size:22px; color:var(--parch-dim)}
.arch-year{border-top:var(--frame) solid var(--line); margin-bottom:6px}
.arch-year > summary{list-style:none; display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; padding:12px 0; min-height:64px}
.arch-year > summary::-webkit-details-marker{display:none}
.arch-year .y{font-family:var(--f-black); font-size:clamp(44px, 12vw, 64px); line-height:1}
.arch-year .c{display:flex; align-items:center; gap:10px; font-family:var(--f-black); font-size:18px; color:var(--parch-dim)}
.arch-year .c::before{content:"wpisów:"; text-transform:uppercase; letter-spacing:.05em; font-size:14px}
.arch-year .c::after{content:"+"; display:grid; place-items:center; width:40px; height:40px; border:3px solid var(--line); color:var(--parch); font-size:26px}
.arch-year[open] .c::after{content:"–"; background:var(--parch); color:var(--ink)}
.arch-month{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:18px; letter-spacing:.06em; color:var(--blood-hi); margin:14px 0 6px}
.arch-year .archive-list{border-top:3px solid var(--line); margin-bottom:10px}
.arch-year .archive-list a{min-height:56px; padding:10px 0}
.arch-year .a-title{font-size:22px}
@media (min-width:700px){ .arch-year .a-title{font-size:28px} }
.archive-list a{grid-template-columns:4.6em 1fr}
.a-num{min-width:0; width:100%; padding:6px 4px; font-size:17px}
@media (min-width:700px){ .archive-list a{grid-template-columns:5.2em 1fr auto} }

/* ----- Kategorie: pasek z przyciskami (przewijany w bok na telefonie) ----- */
.chips{display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; margin:20px calc(-1 * max(16px, env(safe-area-inset-left, 0px))) 0;
  padding:0 max(16px, env(safe-area-inset-left, 0px)) 4px; -webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.chips a{flex:none; display:flex; align-items:center; gap:6px; min-height:44px; padding:8px 14px; border:3px solid var(--line); text-decoration:none;
  font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:16px; white-space:nowrap}
.chips a sup{font-size:12px; color:var(--blood-hi); vertical-align:top; line-height:1}
.chips a:hover{background:var(--parch); color:var(--ink)}
.chips a.on{background:var(--blood); border-color:var(--blood); color:var(--on-blood)}
.chips a.on sup{color:var(--on-blood)}
@media (min-width:700px){ .chips{flex-wrap:wrap; overflow:visible; margin-left:0; margin-right:0; padding:0} }
.cat-title{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(52px, 15vw, 120px); line-height:.9; margin:20px 0 0}
.arch-page .chips{margin-top:0; margin-bottom:18px}
.cat-link{color:inherit; text-decoration:none; border-bottom:2px solid currentColor}
.cat-link:hover{color:var(--parch)}
/* Panel: wybór kategorii jako duże przyciski */
.cat-pick{border:0; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px}
.cat-pick legend{font-family:var(--f-black); font-size:15px; letter-spacing:.05em; text-transform:uppercase; color:var(--parch-dim); padding:0; margin-bottom:8px}
.form .cat-pick label{flex-direction:row; display:block; color:var(--parch)}
.cat-pick label{position:relative}
.cat-pick input{position:absolute; left:0; top:0; width:1px; height:1px; opacity:0; pointer-events:none}
.cat-pick span{display:flex; align-items:center; min-height:46px; padding:8px 14px; border:3px solid var(--line-soft); cursor:pointer; font-size:16px}
.cat-pick input:checked + span{background:var(--blood); border-color:var(--blood); color:var(--on-blood)}
.cat-pick input:focus-visible + span{outline:3px solid var(--blood); outline-offset:2px}
.pl-cat{font-weight:700; color:var(--parch)}
.featured h2, .letter h1, .cat-title, .arch-title{line-height:.94}

/* ----- YouTube w treści: miniatura w rastrze + czerwony przycisk; po stuknięciu odtwarzacz ----- */
.yt{position:relative; margin:1.6em 0; border:var(--frame) solid var(--line); background:var(--blood); overflow:hidden; aspect-ratio:16/9}
.yt.yt-short{aspect-ratio:9/16; max-width:340px; margin-left:auto; margin-right:auto}
.yt-play{position:absolute; inset:0; display:block}
.yt-play img{width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.5) brightness(1.05); mix-blend-mode:multiply; transition:filter .3s}
.yt-play::after{content:""; position:absolute; inset:0; background:radial-gradient(circle, rgba(0,0,0,.3) 1px, transparent 1.6px) 0 0/6px 6px; mix-blend-mode:multiply; pointer-events:none}
.yt-btn{position:absolute; left:50%; top:50%; width:84px; height:84px; transform:translate(-50%,-50%) rotate(-3deg); background:var(--ink); border:4px solid var(--parch); z-index:2; transition:transform .2s}
.yt-btn::before{content:""; position:absolute; left:52%; top:50%; transform:translate(-40%,-50%); border-left:26px solid var(--blood); border-top:16px solid transparent; border-bottom:16px solid transparent}
.yt-tag{position:absolute; left:0; top:0; z-index:2; background:var(--ink); color:var(--parch); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:14px; padding:4px 10px}
.yt-play:hover .yt-btn, .yt-play:focus-visible .yt-btn{transform:translate(-50%,-50%) rotate(0) scale(1.06)}
@media (hover:hover){ .yt-play:hover img{filter:none; mix-blend-mode:normal} }
.yt iframe{position:absolute; inset:0; width:100%; height:100%; border:0; background:#000}
.yt.is-on{background:#000}
.yt figcaption{position:absolute; left:0; bottom:0; z-index:3; max-width:calc(100% - 20px); background:var(--ink); color:var(--parch); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.03em; font-size:15px; line-height:1.2; padding:6px 10px}
.yt.is-on figcaption{display:none}
.body .yt:not(.yt-short){margin-left:0; margin-right:0}

/* ----- Strona informacyjna (polityka prywatności) ----- */
.page .body h2{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(26px, 6vw, 34px); line-height:1; margin:1.6em 0 .5em}
.page .body a{color:var(--blood-hi)}
.lead-box{border:3px solid var(--line); padding:16px 18px}
.body mark{background:var(--blood); color:var(--on-blood); padding:0 4px}
.tag-plan{color:var(--gold)}
.plan-hint{margin:6px 0 0 !important; flex-basis:100%}

/* ----- Karta płyty ----- */
.album{max-width:680px; margin:0 auto 34px; display:grid; grid-template-columns:1fr; border:var(--frame) solid var(--line)}
.album-cover{margin:0; border-bottom:var(--frame) solid var(--line); background:var(--ink-2)}
.album-cover img{width:100%; aspect-ratio:1; object-fit:cover; cursor:zoom-in}
.album-info{padding:18px 18px 20px; display:flex; flex-direction:column; min-width:0}
.album-kick{margin:0 0 10px; align-self:flex-start; background:var(--blood); color:var(--on-blood); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:14px; padding:3px 9px}
.album-artist{margin:0; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:20px; color:var(--blood-hi)}
.album-title{margin:2px 0 8px; font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(34px, 9vw, 48px); line-height:.95; overflow-wrap:break-word}
.album-meta{margin:0 0 14px; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:15px; color:var(--parch-dim)}
.album-foot{margin-top:auto; display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap}
.album-rating{margin:0; display:flex; align-items:baseline; background:var(--parch); color:var(--ink); padding:4px 14px 6px; transform:rotate(-3deg); font-family:var(--f-black)}
.album-rating b{font-weight:400; font-size:64px; line-height:1}
.album-rating span{font-size:24px; margin-left:2px}
.album-listen{display:inline-flex; align-items:center; min-height:48px; padding:10px 16px; border:3px solid var(--line); text-decoration:none; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:16px}
.album-listen:hover{background:var(--parch); color:var(--ink)}
@media (min-width:600px){
  .album{grid-template-columns:260px 1fr}
  .album-cover{border-bottom:0; border-right:var(--frame) solid var(--line)}
  .album-cover img, .album-cover picture{height:100%}
  .album-info{padding:22px 24px}
}
/* ocena na kafelkach */
.card-img{position:relative}
.rate-badge{position:absolute; right:10px; bottom:10px; z-index:2; background:var(--parch); color:var(--ink); font-family:var(--f-black); font-size:26px; line-height:1; padding:4px 10px 5px; transform:rotate(-3deg)}
.rate-badge small{font-size:14px}
.gal-badge{position:absolute; left:10px; bottom:10px; z-index:2; background:var(--ink); color:var(--parch); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:14px; padding:4px 9px}

/* ----- Galeria (szersza niż tekst) ----- */
.gallery{width:min(1208px, calc(100vw - 2 * max(16px, env(safe-area-inset-left, 0px)))); position:relative; left:50%; transform:translateX(-50%); margin:40px 0 10px}
.gallery-title{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(40px, 10vw, 64px); line-height:1; margin:0 0 14px; padding-bottom:10px; border-bottom:var(--frame) solid var(--line)}
.gallery-title span{font-size:20px; color:var(--blood-hi); letter-spacing:.04em}
.g-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px}
.g-item{margin:0; overflow:hidden; background:var(--ink-2); border:3px solid var(--line)}
.g-item img{width:100%; aspect-ratio:1; object-fit:cover; cursor:zoom-in; transition:transform .4s}
.g-item:hover img{transform:scale(1.04)}
.g-big{grid-column:span 2; grid-row:span 2}
@media (min-width:700px){ .g-grid{grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px} }
@media (min-width:1024px){ .g-grid{grid-template-columns:repeat(4, minmax(0,1fr))} }
.gallery-hint{margin:10px 0 0; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px; color:var(--parch-dim)}
@media (hover:hover) and (pointer:fine){ .gallery-hint{display:none} }

/* ----- Pełny ekran: strzałki, licznik, podpis ----- */
.lb-nav{position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:52px; height:72px; border:3px solid #ece3cf; background:rgba(18,16,16,.75); color:#ece3cf;
  font-size:40px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; padding-bottom:6px}
.lb-prev{left:max(10px, env(safe-area-inset-left, 0px))}
.lb-next{right:max(10px, env(safe-area-inset-right, 0px))}
.lb-nav:hover{background:#d42a1b; border-color:#d42a1b}
.lightbox.single .lb-nav{display:none}
@media (hover:none){ .lb-nav{display:none} }
.lb-bar{position:absolute; left:0; right:0; bottom:0; display:flex; gap:14px; align-items:baseline; padding:12px max(16px, env(safe-area-inset-left, 0px)) calc(14px + env(safe-area-inset-bottom, 0px)); color:#ece3cf; pointer-events:none;
  background:linear-gradient(transparent, rgba(0,0,0,.8))}
.lb-count{font-family:var(--f-black); font-size:20px; color:#ef4a3a; flex:none}
.lb-cap{font-size:15px}
.lightbox img{max-height:calc(100% - 60px)}

/* ----- Panel: karta płyty i galeria ----- */
.album-box, .gal-box{border:3px solid var(--line-soft); padding:16px; margin:0; display:flex; flex-direction:column; gap:12px}
.album-box legend, .gal-box legend{font-family:var(--f-black); font-size:17px; letter-spacing:.05em; text-transform:uppercase; padding:0 8px}
.album-box[hidden]{display:none}
.album-grid{display:grid; gap:16px}
@media (min-width:640px){ .album-grid{grid-template-columns:200px 1fr} }
.album-cover-slot{display:flex; flex-direction:column; gap:10px}
.slot-preview.square{aspect-ratio:1}
.album-fields{display:flex; flex-direction:column; gap:12px}
.row3{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.gal-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px}
.gal-row{display:grid; grid-template-columns:64px 1fr; grid-template-areas:"img cap" "img tools"; gap:6px 12px; align-items:center; padding:8px; border:2px solid var(--line-soft)}
.gal-row img{grid-area:img; width:64px; height:64px; object-fit:cover}
.gal-row input[name^=gcap]{grid-area:cap; font-size:16px !important; padding:8px 10px !important}
.gal-tools{grid-area:tools; display:flex; gap:8px; align-items:center}
.gal-tools button{width:40px; height:36px; background:transparent; border:2px solid var(--line-soft); color:var(--parch); font-size:18px; cursor:pointer}
.gal-tools button:hover{border-color:var(--parch)}
.form .gal-del{flex-direction:row; align-items:center; gap:6px; margin-left:auto; color:var(--blood-hi); text-transform:none; letter-spacing:0; font-family:var(--f-serif); font-size:14px}
.file-btn.big{padding:18px; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:17px}
.gal-new{display:grid; grid-template-columns:repeat(auto-fill, minmax(64px, 1fr)); gap:6px}
.gal-new img{width:100%; aspect-ratio:1; object-fit:cover}
.btn-ghost{font-family:var(--f-black); font-size:16px; letter-spacing:.05em; text-transform:uppercase; background:transparent; color:var(--parch); border:3px solid var(--line-soft); padding:10px 16px; cursor:pointer}
.btn-ghost:hover{border-color:var(--parch)}
.actions{flex-wrap:wrap}
.upload-status{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; color:var(--gold); margin:-40px 0 40px}

/* ----- Panel: statystyki ----- */
.st-range{display:flex; gap:8px; margin:-6px 0 20px}
.st-range a{padding:8px 14px; border:3px solid var(--line-soft); text-decoration:none; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px}
.st-range a.on{background:var(--blood); border-color:var(--blood); color:var(--on-blood)}
.st-tiles{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px; margin-bottom:28px}
.st-tile{border:3px solid var(--line); padding:14px 16px; display:flex; flex-direction:column}
.st-tile span{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px; color:var(--parch-dim)}
.st-tile b{font-family:var(--f-black); font-weight:400; font-size:52px; line-height:1.05; color:var(--parch)}
.st-tile small{font-size:13px; color:var(--parch-dim)}
.st-block{margin-bottom:30px}
.st-h{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:26px; margin:0 0 12px; padding-bottom:8px; border-bottom:var(--frame) solid var(--line)}
.st-empty{color:var(--parch-dim)}
.st-chart{display:grid; grid-template-columns:auto 1fr; grid-template-rows:200px auto; gap:4px 8px}
.st-y{display:flex; flex-direction:column; justify-content:space-between; font-size:12px; color:var(--parch-dim); text-align:right; font-variant-numeric:tabular-nums}
.st-bars{display:flex; align-items:flex-end; gap:2px; border-bottom:1px solid var(--line-soft);
  background:linear-gradient(var(--line-soft), var(--line-soft)) 0 0/100% 1px no-repeat, linear-gradient(var(--line-soft), var(--line-soft)) 0 50%/100% 1px no-repeat}
.st-col{position:relative; flex:1; height:100%; display:flex; align-items:flex-end; outline:none; cursor:default}
.st-col i{display:block; width:100%; background:var(--blood); border-radius:4px 4px 0 0; min-height:0}
.st-col:hover i, .st-col:focus i{background:var(--blood-hi)}
.st-tip{display:none; position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); white-space:nowrap; z-index:3;
  background:var(--ink); color:var(--parch); border:2px solid var(--line); padding:6px 10px; font-size:13px; pointer-events:none}
.st-tip b{display:block; font-family:var(--f-black); font-weight:400; text-transform:uppercase; letter-spacing:.04em}
.st-col:hover .st-tip, .st-col:focus .st-tip{display:block}
.st-col:hover::before, .st-col:focus::before{content:""; position:absolute; inset:0; background:rgba(236,227,207,.06)}
.st-x{grid-column:2; display:flex; justify-content:space-between; font-size:12px; color:var(--parch-dim)}
.st-n90{gap:1px} .st-n90 .st-col i{border-radius:2px 2px 0 0}
.st-table{margin-top:12px}
.st-table summary{cursor:pointer; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px; color:var(--parch-dim)}
.st-table table{width:100%; border-collapse:collapse; margin-top:8px; font-size:14px; font-variant-numeric:tabular-nums}
.st-table th, .st-table td{text-align:left; padding:6px 8px; border-bottom:1px solid var(--line-soft)}
.st-two{display:grid; gap:10px}
@media (min-width:900px){ .st-two{grid-template-columns:1fr 1fr; gap:30px} }
.st-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.st-list li{display:grid; grid-template-columns:1fr auto; grid-template-areas:"name num" "bar bar"; gap:4px 12px; align-items:baseline}
.st-list a, .st-src{grid-area:name; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.02em; font-size:18px; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.st-list a:hover{color:var(--blood-hi)}
.st-bar{grid-area:bar; height:8px; background:var(--ink-2)}
.st-bar i{display:block; height:100%; background:var(--blood); border-radius:0 4px 4px 0}
.st-num{grid-area:num; font-family:var(--f-black); font-size:18px; font-variant-numeric:tabular-nums}
.st-num small{font-family:var(--f-serif); font-size:12px; color:var(--parch-dim)}
.st-note{margin:10px 0 50px}
.st-list + .hint{margin-top:14px !important}
.letter h1{line-height:1}
/* karta płyty na telefonie: okładka obok opisu */
@media (max-width:599px){
  .album{grid-template-columns:40% 1fr}
  .album-cover{border-bottom:0; border-right:var(--frame) solid var(--line)}
  .album-cover img, .album-cover picture{height:100%}
  .album-info{padding:12px 12px 14px}
  .album-kick{font-size:12px; margin-bottom:6px}
  .album-artist{font-size:16px}
  .album-title{font-size:26px}
  .album-meta{font-size:12px; margin-bottom:10px}
  .album-rating b{font-size:40px} .album-rating span{font-size:16px}
  .album-listen{grid-column:1 / -1}
}
.album-foot .album-listen{white-space:nowrap}
@media (max-width:599px){ .album-foot{display:contents} .album-listen{margin:0; border:0; border-top:var(--frame) solid var(--line); justify-content:center; min-height:52px} .album-info .album-rating{align-self:flex-start; margin-top:auto} }
.album-title{line-height:1.05}
/* miejsce na polskie ogonki (Ę, Ą) pod wielkimi literami */
.letter h1{line-height:1.08} .album-title{line-height:1.12} .featured h2{line-height:1} .card h2{line-height:1.06}
.featured h2{line-height:1.08} .featured .rate-badge{font-size:48px; right:18px; bottom:18px; padding:6px 14px 8px} .featured .rate-badge small{font-size:22px}

/* ----- Tagi ----- */
.tags{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px}
.tags a{display:inline-flex; align-items:center; min-height:40px; padding:6px 12px; border:3px solid var(--line); text-decoration:none;
  font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px}
.tags a:hover{background:var(--parch); color:var(--ink)}
.post-tags{max-width:680px; margin:30px auto 0; padding-top:18px; border-top:3px solid var(--line)}
.tag-back{margin:20px 0 0; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px}
.tag-back a{color:var(--parch-dim); text-decoration:none}
.tag-back a:hover{color:var(--blood-hi)}
.tag-title{color:var(--parch); overflow-wrap:break-word}
.tag-count{margin:6px 0 0; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; color:var(--blood-hi); font-size:18px}
.tag-cloud{margin:0 0 26px; border:3px solid var(--line); padding:0 16px}
.tag-cloud > summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; min-height:56px;
  font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:22px}
.tag-cloud > summary::-webkit-details-marker{display:none}
.tag-cloud > summary span{font-size:16px; color:var(--blood-hi)}
.tag-cloud[open] > summary{border-bottom:3px solid var(--line); margin-bottom:14px}
.tags-cloud{padding-bottom:16px}
.tags-cloud a sup{font-size:11px; color:var(--blood-hi); margin-left:4px}
.tags-cloud .lv1 a{font-size:17px} .tags-cloud .lv2 a{font-size:20px} .tags-cloud .lv3 a{font-size:24px; background:var(--blood); border-color:var(--blood); color:var(--on-blood)}
.tags-cloud .lv3 a sup{color:var(--on-blood)}
/* panel: podpowiedzi tagów */
.tag-suggest{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:-8px}
.tag-suggest span{font-size:13px; color:var(--parch-dim); margin-right:4px}
.tag-suggest button{background:transparent; border:2px solid var(--line-soft); color:var(--parch); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.03em; font-size:13px; padding:5px 9px; cursor:pointer}
.tag-suggest button:hover{border-color:var(--parch)}
.tag-suggest button.used{opacity:.35}

/* ----- Podgląd przed publikacją ----- */
.preview-bar{position:fixed; left:0; right:0; bottom:0; z-index:45; box-shadow:0 -6px 20px rgba(0,0,0,.4); padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px)) !important; display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:10px max(16px, env(safe-area-inset-left, 0px));
  background:var(--gold); color:#121010; font-size:14px}
.preview-bar b{font-family:var(--f-black); font-weight:400; text-transform:uppercase; letter-spacing:.06em; font-size:18px; background:#121010; color:var(--gold); padding:2px 10px}
.preview-bar span{flex:1; min-width:180px}
.preview-bar button{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px; background:#121010; color:#ece3cf; border:0; padding:9px 14px; cursor:pointer}
body:has(.preview-bar){padding-bottom:110px}
.btn-preview{border-color:var(--gold); color:var(--gold)}
@media (max-width:520px){ .preview-bar span{display:none} .preview-bar b::after{content:" · nic nie zapisano"; font-size:13px; letter-spacing:.03em} .preview-bar button{margin-left:auto} body:has(.preview-bar){padding-bottom:70px} }

/* ----- Śródtytuły, listy i linki w treści ----- */
.body h2.sub{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(30px, 7.5vw, 42px); line-height:1.08; margin:1.6em 0 .6em;
  padding-top:14px; border-top:var(--frame) solid var(--line); scroll-margin-top:80px}
.body ul, .body ol{margin:0 0 1.2em; padding:0; list-style:none; counter-reset:li}
.body li{position:relative; padding-left:34px; margin:0 0 .45em}
.body ul > li::before{content:""; position:absolute; left:6px; top:.62em; width:12px; height:12px; background:var(--blood); transform:rotate(45deg)}
.body ol > li{counter-increment:li}
.body ol > li::before{content:counter(li); position:absolute; left:0; top:.1em; min-width:24px; text-align:center; font-family:var(--f-black); font-size:.95em; line-height:1.5; background:var(--blood); color:var(--on-blood)}
.body a{color:var(--parch); text-decoration:underline; text-decoration-color:var(--blood); text-decoration-thickness:3px; text-underline-offset:3px}
.body a:hover{color:var(--blood-hi)}

/* ----- Spotify / Bandcamp: karta → odtwarzacz po stuknięciu ----- */
.music{margin:1.6em 0; border:var(--frame) solid var(--line); background:var(--ink-2); position:relative}
.music-play{display:grid; grid-template-columns:96px 1fr auto; align-items:center; gap:14px; padding:10px 14px 10px 10px; text-decoration:none !important; color:var(--parch)}
.music-art{width:96px; height:96px; display:grid; place-items:center; background:var(--ink); overflow:hidden}
.music-art img{width:100%; height:100%; object-fit:cover}
.music-txt{display:flex; flex-direction:column; min-width:0}
.music-txt small{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:13px; color:var(--blood-hi)}
.music-txt b{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:22px; line-height:1.08; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin:2px 0 4px}
.music-txt em{font-style:normal; font-size:13px; color:var(--parch-dim)}
.music-btn{width:54px; height:54px; background:var(--blood); position:relative; flex:none; transform:rotate(-3deg); transition:transform .2s}
.music-btn::before{content:""; position:absolute; left:55%; top:50%; transform:translate(-50%,-50%); border-left:18px solid var(--on-blood); border-top:11px solid transparent; border-bottom:11px solid transparent}
.music-play:hover .music-btn{transform:rotate(0) scale(1.06)}
.music-spotify .music-txt small::before{content:"● "; color:#1ed760}
.music iframe{display:block; width:100%; border:0; background:var(--ink-2)}
.music.is-on{border-color:var(--line)}
.music figcaption{border-top:3px solid var(--line); padding:6px 12px; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.03em; font-size:14px; color:var(--parch-dim)}
@media (max-width:420px){ .music-play{grid-template-columns:72px 1fr auto; gap:10px} .music-art{width:72px; height:72px} .music-txt b{font-size:18px} .music-btn{width:46px; height:46px} }

/* ----- Panel: ściąga formatowania ----- */
.fmt-help{border:2px solid var(--line-soft); padding:0 12px; margin-top:-8px}
.fmt-help summary{cursor:pointer; min-height:42px; display:flex; align-items:center; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px; color:var(--gold)}
.fmt-help table{width:100%; border-collapse:collapse; margin:4px 0 12px; font-size:14px}
.fmt-help td{padding:6px 4px; border-top:1px solid var(--line-soft); vertical-align:top}
.fmt-help code{font-family:ui-monospace, monospace; font-size:13px; background:var(--ink); padding:2px 6px; color:var(--parch); white-space:nowrap}
@media (max-width:520px){ .fmt-help code{white-space:normal} }

/* ----- Statystyki: objaśnienie ----- */
.st-legend{border:3px solid var(--line-soft); padding:0 14px; margin:10px 0}
.st-legend summary{cursor:pointer; min-height:48px; display:flex; align-items:center; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:15px; color:var(--gold)}
.st-legend dl{margin:0 0 14px; display:grid; grid-template-columns:max-content 1fr; gap:8px 14px; font-size:14px}
.st-legend dt{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em}
.st-legend dd{margin:0; color:var(--parch-dim)}
@media (max-width:520px){ .st-legend dl{grid-template-columns:1fr} .st-legend dd{margin-bottom:6px} }

/* ----- Panel: pole treści z paskiem wstawiania i przewodnikiem ----- */
.write-area{display:flex; flex-direction:column; gap:14px}
.body-field{display:flex; flex-direction:column; gap:0}
.body-label{font-family:var(--f-black); font-size:15px; letter-spacing:.05em; text-transform:uppercase; color:var(--parch-dim); margin-bottom:7px}
.ins-bar{display:flex; flex-wrap:wrap; gap:0; border:3px solid var(--line-soft); border-bottom:0; background:var(--ink)}
.ins-bar button{flex:1 1 0; min-width:40px; height:46px; background:transparent; border:0; border-right:2px solid var(--line-soft); color:var(--parch); font-size:18px; cursor:pointer; font-family:var(--f-serif)}
.ins-bar button:last-child{border-right:0}
.ins-bar button:hover, .ins-bar button:focus-visible{background:var(--blood); color:var(--on-blood)}
.ins-bar button b{font-weight:800} .ins-bar button i{font-style:italic; font-family:Georgia, serif}
.body-field textarea{min-height:420px !important}
.guide{border:3px solid var(--gold); padding:14px 16px 6px; background:rgba(201,162,75,.05)}
.guide-t{margin:0 0 6px; font-family:var(--f-black); font-weight:400; text-transform:uppercase; letter-spacing:.03em; font-size:22px; color:var(--gold)}
.guide-lead{margin:0 0 10px; font-size:14px; line-height:1.55; color:var(--parch)}
.guide details{border-top:2px solid var(--line-soft)}
.guide summary{cursor:pointer; min-height:46px; display:flex; align-items:center; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px}
.guide summary::marker{color:var(--gold)}
.guide-tab{width:100%; border-collapse:collapse; margin:0 0 10px; font-size:14px}
.guide-tab td{padding:6px 4px; border-top:1px solid var(--line-soft); vertical-align:top; line-height:1.45}
.guide-tab td:first-child{width:42%}
.guide code{font-family:ui-monospace, monospace; font-size:13px; background:var(--ink); padding:2px 6px; color:var(--parch)}
.guide-list{margin:0 0 12px; padding-left:18px; font-size:14px; line-height:1.55}
.guide-list li{margin-bottom:6px}
.guide-tip{font-size:13px; color:var(--parch-dim); margin:0 0 12px}
/* komputer: przewodnik obok pola treści, przyklejony przy przewijaniu */
@media (min-width:1150px){
  body.admin main.wrap:has(.write-area){max-width:1180px}
  body.admin main.wrap:has(.write-area) .form.editor > *:not(.write-area){max-width:760px}
  .write-area{display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:24px; align-items:start}
  .guide{position:sticky; top:84px; max-height:calc(100vh - 100px); overflow:auto}
  .body-field textarea{min-height:620px !important}
}

/* ----- Karta płyty: pieczątka, werdykt, lista utworów ----- */
.stamp{position:relative; width:140px; height:140px; flex:none; transform:rotate(-12deg); color:var(--blood-hi)}
.stamp svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible}
.stamp .st-bg{fill:none}
.stamp .sc{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; font-family:var(--f-black); line-height:.9}
.stamp .sc b{font-weight:400; font-size:38px; line-height:1}
.stamp .sc span{font-size:12px; letter-spacing:.14em; margin-top:2px; border-top:2px solid currentColor; padding-top:3px}
.stamp::after{content:""; position:absolute; inset:0; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle at 30% 40%, rgba(18,16,16,.45) 0 2px, transparent 3px) 0 0/23px 19px, radial-gradient(circle at 70% 60%, rgba(18,16,16,.4) 0 1.5px, transparent 2.5px) 0 0/17px 29px}
.album-cover{position:relative; overflow:visible}
.cover-stamp{position:absolute; right:-22px; bottom:-22px; width:130px; height:130px; z-index:3}
.cover-stamp .st-bg, .tile-stamp .st-bg{fill:var(--ink)}
.tile-stamp{position:absolute; right:10px; bottom:10px; width:92px; height:92px; z-index:3}
.tile-stamp .sc b{font-size:26px} .tile-stamp .sc span{font-size:9px}
.featured .tile-stamp{width:140px; height:140px; right:18px; bottom:18px}
.featured .tile-stamp .sc b{font-size:40px} .featured .tile-stamp .sc span{font-size:12px}
.verdict{margin:0; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:15px; color:var(--parch)}
.verdict b{display:block; font-weight:400; font-size:26px; line-height:1.1; color:var(--blood-hi); letter-spacing:.02em}
.album-foot{align-items:center}
.tracks{grid-column:1 / -1; border-top:var(--frame) solid var(--line); padding:16px 18px 14px}
.tracks h3{margin:0 0 10px; font-family:var(--f-black); font-weight:400; text-transform:uppercase; letter-spacing:.04em; font-size:20px; display:flex; justify-content:space-between; align-items:baseline; gap:10px}
.tracks h3 small{font-size:14px; color:var(--parch-dim)}
.tracks ol{list-style:none; margin:0; padding:0; column-gap:30px}
@media (min-width:600px){ .tracks ol{columns:2} }
.tracks li{break-inside:avoid; display:grid; grid-template-columns:28px 1fr auto; gap:8px; align-items:baseline; padding:7px 0; border-bottom:1px solid var(--line-soft); font-size:15px}
.tracks li .n{font-family:var(--f-black); color:var(--parch-dim); font-size:15px}
.tracks li .d{font-variant-numeric:tabular-nums; color:var(--parch-dim); font-size:13px}
.tracks li.best .t{font-weight:700; color:var(--parch)}
.tracks li.best .n{background:var(--blood); color:var(--on-blood); text-align:center}
.tracks li.best .t::after{content:" ★"; color:var(--blood-hi)}
.tracks li.skip .t{color:var(--parch-dim); text-decoration:line-through; text-decoration-color:var(--blood)}
.tracks .legend{margin:10px 0 0; font-size:12px; color:var(--parch-dim)}
.tracks .legend b{color:var(--blood-hi)}
.album.no-cover .album-info{grid-column:1 / -1}
@media (max-width:599px){
  .album.no-cover{grid-template-columns:1fr}
  .cover-stamp{width:96px; height:96px; right:-14px; bottom:-14px}
  .cover-stamp .sc b{font-size:27px} .cover-stamp .sc span{font-size:9px}
  .verdict b{font-size:20px}
  .album-info .stamp{width:104px; height:104px} .album-info .stamp .sc b{font-size:28px}
  .tracks{padding:12px 12px 10px}
}
.form textarea.tracks-in{min-height:150px; font-size:16px}
:root[data-theme="light"] .stamp{color:var(--blood)}
:root[data-theme="light"] .stamp::after{background:radial-gradient(circle at 30% 40%, rgba(236,227,207,.6) 0 2px, transparent 3px) 0 0/23px 19px, radial-gradient(circle at 70% 60%, rgba(236,227,207,.55) 0 1.5px, transparent 2.5px) 0 0/17px 29px}

/* ----- Statystyki: unikalni, urządzenia, czytanie ----- */
.st-tile.st-main{border-color:var(--blood); background:rgba(212,42,27,.08)}
.st-tile.st-main b{color:var(--blood-hi)}
.st-list li{grid-template-areas:"name num" "bar bar" "sub sub"}
.st-sub{grid-area:sub; font-size:12px; color:var(--parch-dim)}
.st-sub:empty{display:none}
.st-devs{display:grid; gap:12px}
@media (min-width:700px){ .st-devs{grid-template-columns:repeat(3, 1fr); gap:20px} }
.st-dev{display:grid; grid-template-columns:1fr auto; grid-template-areas:"name pct" "bar bar" "n n"; gap:4px 10px; align-items:baseline; border:3px solid var(--line-soft); padding:12px 14px}
.st-dev-n{grid-area:name; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:18px}
.st-dev b{grid-area:pct; font-family:var(--f-black); font-weight:400; font-size:34px; line-height:1}
.st-dev .st-bar{grid-area:bar}
.st-dev small{grid-area:n; font-size:12px; color:var(--parch-dim)}
.st-csv{margin:20px 0 0} .st-csv a{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:15px; color:var(--gold); text-decoration:none} .st-range{flex-wrap:wrap}
.st-tile b{font-size:clamp(34px, 3.4vw, 52px); white-space:nowrap}
.st-col:nth-last-child(-n+4) .st-tip{left:auto; right:0; transform:none}
.st-col:nth-child(-n+3) .st-tip{left:0; transform:none}

/* ----- Panel: autozapis ----- */
.autosave-bar{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; border:3px solid var(--gold); background:rgba(201,162,75,.1); padding:12px 14px; margin:0 0 18px; font-size:15px}
.autosave-bar span{flex:1 1 220px}
.autosave-note{margin:-40px 0 40px; font-size:13px; color:var(--parch-dim)}

/* ----- Menu: ikony, wyszukiwarka, menu na telefonie ----- */
.icon-btn{flex:none; width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:transparent; border:3px solid var(--line); color:var(--parch); cursor:pointer; text-decoration:none}
.icon-btn:hover{background:var(--parch); color:var(--ink)}
.menu-btn{flex-direction:column; gap:4px}
.menu-btn span{display:block; width:20px; height:3px; background:currentColor; transition:transform .2s, opacity .2s}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-search{display:none}
@media (max-width:1023px){
  .topbar-inner{position:relative}
  .topnav{display:none; position:absolute; left:calc(-1 * max(16px, env(safe-area-inset-left, 0px))); right:calc(-1 * max(16px, env(safe-area-inset-right, 0px))); top:calc(100% + var(--frame)); height:calc(100dvh - 60px - var(--frame) - env(safe-area-inset-top, 0px)); z-index:30; flex-direction:column; gap:0;
    background:var(--ink); padding:10px max(16px, env(safe-area-inset-left, 0px)) 40px; overflow-y:auto; border-top:var(--frame) solid var(--line)}
  .topnav.open{display:flex}
  .topnav a{font-size:34px; min-height:64px; border-bottom:3px solid var(--line-soft)}
  .topnav .nav-search{display:flex; margin-top:20px; border:3px solid var(--line)}
  .nav-search input{flex:1; min-width:0; background:transparent; border:0; color:var(--parch); font:500 18px var(--f-serif); padding:12px 14px}
  .nav-search button{width:56px; background:var(--blood); border:0; color:var(--on-blood); display:flex; align-items:center; justify-content:center}
  body.menu-open{overflow:hidden}
  .search-btn{display:none}
}
@media (min-width:1024px){ .menu-btn{display:none} .topnav{gap:18px} }

/* ----- Szukaj ----- */
.search-page, .rank-page, .gig-page{padding:28px 0 20px}
.search-form{display:flex; border:var(--frame) solid var(--line); margin:0 0 20px}
.search-form input{flex:1; min-width:0; background:transparent; border:0; color:var(--parch); font:500 20px var(--f-serif); padding:16px 18px}
.search-form input:focus{outline:none}
.search-form button{width:70px; background:var(--blood); border:0; color:var(--on-blood); display:flex; align-items:center; justify-content:center; cursor:pointer}
.search-tip a{color:var(--blood-hi)}
.search-list{list-style:none; margin:0; padding:0; border-top:var(--frame) solid var(--line)}
.search-list a{display:grid; grid-template-columns:84px 1fr; gap:14px; padding:14px 0; border-bottom:3px solid var(--line-soft); text-decoration:none; color:var(--parch)}
.sr-thumb{width:84px; height:84px; display:grid; place-items:center; background:var(--ink-2); overflow:hidden}
.sr-thumb img{width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.3)}
.sr-body{display:flex; flex-direction:column; min-width:0}
.sr-meta{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:13px; color:var(--blood-hi)}
.sr-title{font-family:var(--f-black); text-transform:uppercase; font-size:24px; line-height:1.08; margin:2px 0 4px}
.sr-snip{font-size:15px; color:var(--soft); line-height:1.5}
.search-list mark, .sr-title mark{background:var(--blood); color:var(--on-blood); padding:0 2px}
.search-list a:hover .sr-title{color:var(--blood-hi)}

/* ----- Ranking ----- */
.rank-years{margin:0 0 20px}
.rank-list{list-style:none; margin:0; padding:0; border-top:var(--frame) solid var(--line)}
.rank-list a{display:grid; grid-template-columns:48px 72px 1fr auto; align-items:center; gap:14px; padding:12px 0; border-bottom:3px solid var(--line-soft); text-decoration:none; color:var(--parch)}
.rk-pos{font-family:var(--f-black); font-size:34px; text-align:center; color:var(--parch-dim)}
.rank-list .top .rk-pos{color:var(--on-blood); background:var(--blood); line-height:1.2}
.rank-list .top1 .rk-pos{font-size:42px}
.rk-cover{width:72px; height:72px; display:grid; place-items:center; background:var(--ink-2); overflow:hidden}
.rk-cover img{width:100%; height:100%; object-fit:cover}
.rk-body{display:flex; flex-direction:column; min-width:0}
.rk-artist{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px; color:var(--blood-hi)}
.rk-title{font-family:var(--f-black); text-transform:uppercase; font-size:24px; line-height:1.08; overflow-wrap:break-word}
.rk-meta{font-size:13px; color:var(--parch-dim)}
.rk-stamp{position:relative; width:84px; height:84px; transform:rotate(-10deg)}
.rk-stamp .st-bg{fill:var(--ink)}
.rk-stamp .sc b{font-size:24px} .rk-stamp .sc span{font-size:8px}
.rank-list a:hover .rk-title{color:var(--blood-hi)}
@media (max-width:520px){ .rank-list a{grid-template-columns:36px 56px 1fr 64px; gap:10px} .rk-cover{width:56px; height:56px} .rk-title{font-size:19px} .rk-pos{font-size:26px}
  .rk-stamp{width:64px; height:64px} .rk-stamp .sc b{font-size:18px} .rk-stamp .sc span{font-size:7px} .rk-stamp svg text{display:none} }

/* ----- Koncerty ----- */
.gig-h{margin-top:22px}
.gig-list{list-style:none; margin:0 0 16px; padding:0; border-top:var(--frame) solid var(--line)}
.gig{display:grid; grid-template-columns:78px 1fr auto; gap:14px; align-items:center; padding:14px 0; border-bottom:3px solid var(--line-soft)}
.gig-date{display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--blood); color:var(--on-blood); padding:6px 4px; font-family:var(--f-black); text-transform:uppercase; line-height:1}
.gig-date b{font-weight:400; font-size:38px}
.gig-date span{font-size:15px; letter-spacing:.05em}
.gig-date small{font-size:11px; letter-spacing:.04em; margin-top:3px; opacity:.85}
.gig-past .gig-date{background:var(--ink-2); color:var(--parch-dim)}
.gig-body{display:flex; flex-direction:column; min-width:0}
.gig-band{font-family:var(--f-black); text-transform:uppercase; font-size:26px; line-height:1.05; overflow-wrap:break-word}
.gig-place{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px; color:var(--parch-dim)}
.gig-note{font-size:14px; color:var(--soft); margin-top:4px}
.gig-act{display:flex; flex-direction:column; align-items:flex-end; gap:6px}
.gig-when{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:14px; background:var(--parch); color:var(--ink); padding:2px 8px; transform:rotate(-3deg)}
.gig-btn{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:14px; border:3px solid var(--line); padding:8px 12px; text-decoration:none; white-space:nowrap}
.gig-btn:hover{background:var(--parch); color:var(--ink)}
@media (max-width:520px){ .gig{grid-template-columns:64px 1fr; } .gig-act{grid-column:2; flex-direction:row; align-items:center; justify-content:flex-start} .gig-band{font-size:21px} .gig-date b{font-size:30px} }
.next-gig{margin:0 0 46px}
.next-gig .gig-list{margin-bottom:6px}
.gig-admin .gig-date{width:64px; flex:none}
.gig-admin .gig-date b{font-size:26px}

/* ----- 404 ----- */
.e404{text-align:center; padding:40px 0 30px; max-width:680px; margin:0 auto}
.e404-num{display:flex; justify-content:center; align-items:center; gap:10px; font-family:var(--f-black); font-size:clamp(120px, 34vw, 220px); line-height:1; color:var(--parch)}
.e404-zero{display:grid; place-items:center; width:.9em; height:.9em; border:var(--frame) solid var(--blood); border-radius:50%; transform:rotate(-8deg)}
.e404-zero .mark{width:70%; height:auto}
.e404-title{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:clamp(40px, 11vw, 72px); line-height:1.05; margin:10px 0 12px}
.e404-lead{font-size:18px; color:var(--soft); margin:0 0 24px}
.e404-btns{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin:0 0 30px}
.e404-btns .cta{transform:none}
.e404-btns .btn-outline{min-height:52px; padding:10px 20px}
.e404-h{text-align:left}
.e404-list{list-style:none; margin:0; padding:0; text-align:left; border-top:var(--frame) solid var(--line)}
.e404-list a{display:flex; flex-direction:column; padding:12px 0; border-bottom:3px solid var(--line-soft); text-decoration:none; font-family:var(--f-black); text-transform:uppercase; font-size:24px; line-height:1.1}
.e404-list small{font-size:13px; letter-spacing:.05em; color:var(--blood-hi)}

/* ----- Panel: konto i bezpieczeństwo ----- */
.sec-box{margin:0 0 34px}
.badge-ok, .badge-off{display:inline-block; vertical-align:middle; font-size:13px; letter-spacing:.05em; padding:3px 8px; margin-left:8px}
.badge-ok{background:#2f6b3a; color:#fff} .badge-off{background:var(--ink-2); color:var(--parch-dim); border:2px solid var(--line-soft)}
.steps-2fa{padding-left:22px; line-height:1.6}
.steps-2fa li{margin-bottom:14px}
.qr{width:220px; max-width:100%; background:#fff; padding:6px; margin:10px 0}
.qr svg{display:block; width:100%; height:auto}
.secret{font-family:ui-monospace, monospace; background:var(--ink); padding:3px 8px; letter-spacing:.1em; word-break:break-all}
.inline-code{flex-direction:row; align-items:center; gap:10px; margin:8px 0 6px !important}
.code-in{font-family:ui-monospace, monospace !important; font-size:26px !important; letter-spacing:.2em; max-width:220px}
.codes-box{border:3px solid var(--gold); padding:14px 16px; margin:0 0 16px; background:rgba(201,162,75,.08)}
.codes{columns:2; font-family:ui-monospace, monospace; font-size:18px; letter-spacing:.06em; padding-left:26px}
.sec-more summary{cursor:pointer; color:var(--parch-dim); font-size:14px; margin:6px 0}
.dev-list{list-style:none; margin:0; padding:0; border-top:3px solid var(--line-soft)}
.dev-list li{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-bottom:2px solid var(--line-soft)}
.dev-list small{display:block; font-size:12px; color:var(--parch-dim)}
.log-tab{width:100%; border-collapse:collapse; font-size:14px}
.log-tab td{padding:7px 6px; border-bottom:1px solid var(--line-soft)}
.log-tab tr.bad td{color:var(--blood-hi)}
.log-tab .ip{font-family:ui-monospace, monospace; font-size:12px; color:var(--parch-dim)}
@media (max-width:520px){ .log-tab .ip{display:none} }
.login-2fa{font-size:15px; line-height:1.55}
.admin-links{flex-wrap:wrap}
a.cta{text-decoration:none}
.autosave-bar[hidden]{display:none}
.codes{columns:auto; list-style:none; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:6px 18px; counter-reset:c}
.codes li{counter-increment:c; background:var(--ink); padding:6px 10px; border:1px solid var(--line-soft)}
.codes li::before{content:counter(c) ". "; color:var(--parch-dim); font-size:13px}

/* ----- Starsze wpisy: zwinięte, rozwijane jednym kliknięciem ----- */
.older-fold > summary{list-style:none; display:flex; align-items:center; gap:12px; cursor:pointer; padding-bottom:12px; border-bottom:var(--frame) solid var(--line)}
.older-fold > summary::-webkit-details-marker{display:none}
.older-fold > summary .sec-title{margin:0}
.fold-n{font-family:var(--f-black); font-size:18px; color:var(--blood-hi)}
.fold-ico{margin-left:auto; width:44px; height:44px; border:3px solid var(--line); display:grid; place-items:center; flex:none}
.fold-ico::before{content:"+"; font-family:var(--f-black); font-size:28px; line-height:1}
.older-fold[open] .fold-ico{background:var(--parch); color:var(--ink)}
.older-fold[open] .fold-ico::before{content:"–"}
.older-fold > summary:hover .fold-ico{background:var(--parch); color:var(--ink)}
.older-fold .archive-list{border-top:0}

/* ----- Kategorie: jedna niska linijka przewijana w bok, z cieniem sygnalizującym „jest więcej” ----- */
.chips-wrap{position:relative}
.chips a{min-height:38px; padding:5px 12px; font-size:15px}
@media (max-width:699px){
  .chips-wrap::before, .chips-wrap::after{content:""; position:absolute; top:20px; bottom:4px; width:34px; pointer-events:none; opacity:0; transition:opacity .2s; z-index:2}
  .chips-wrap::before{left:-16px; background:linear-gradient(90deg, var(--ink), transparent)}
  .chips-wrap::after{right:-16px; background:linear-gradient(-90deg, var(--ink), transparent)}
  .chips-wrap.cw-more::after, .chips-wrap.cw-less::before{opacity:1}
  .chips{flex-wrap:nowrap}
  .chips a sup{display:none}
}
@media (max-width:699px){
  .chips-wrap{margin:20px calc(-1 * max(16px, env(safe-area-inset-left, 0px))) 0; overflow:hidden; max-width:none}
  .chips-wrap .chips{margin:0; width:100%}
  .chips-wrap::before{left:0} .chips-wrap::after{right:0}
  .chips-wrap::before, .chips-wrap::after{top:0}
  .arch-page .chips-wrap{margin-top:0; margin-bottom:18px}
}
.featured .card-link{grid-template-columns:minmax(0,1fr)} @media (min-width:900px){ .featured .card-link{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)} }

/* ----- Kategorie na telefonie: schowane pod przyciskiem „Kategorie ▾” ----- */
.cat-toggle{display:none}
@media (max-width:699px){
  .chips-wrap{overflow:visible; margin-left:0; margin-right:0}
  .chips-wrap::before, .chips-wrap::after{display:none}
  .cat-toggle{display:flex; align-items:center; gap:10px; width:100%; min-height:48px; padding:8px 14px; background:transparent; border:3px solid var(--line); color:var(--parch); cursor:pointer;
    font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:16px; text-align:left}
  .cat-toggle span{color:var(--parch-dim)}
  .cat-toggle b{font-weight:400; color:var(--blood-hi); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .cat-toggle i{width:12px; height:12px; border-right:3px solid currentColor; border-bottom:3px solid currentColor; transform:rotate(45deg) translateY(-3px); transition:transform .2s}
  .cat-open .cat-toggle{background:var(--parch); color:var(--ink)} .cat-open .cat-toggle span{color:var(--ink)} .cat-open .cat-toggle b{color:var(--blood)}
  .cat-open .cat-toggle i{transform:rotate(-135deg) translateY(-3px)}
  .chips-wrap .chips{display:none; flex-direction:column; gap:0; overflow:visible; padding:0; border:3px solid var(--line); border-top:0}
  .chips-wrap.cat-open .chips{display:flex}
  .chips-wrap .chips a{border:0; border-bottom:2px solid var(--line-soft); min-height:50px; padding:8px 14px; font-size:18px; justify-content:space-between}
  .chips-wrap .chips a:last-child{border-bottom:0}
  .chips-wrap .chips a sup{display:inline; font-size:14px}
}
@media (max-width:599px){ .featured h2{font-size:clamp(40px, 12vw, 64px); overflow-wrap:normal; hyphens:manual} .letter h1, .cat-title, .tag-title{overflow-wrap:normal; hyphens:manual} }

/* ----- Panel: kopie zapasowe ----- */
.bk-status{display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:10px; margin:14px 0 18px}
.bk-status div{border:3px solid var(--line-soft); padding:10px 12px; display:flex; flex-direction:column; min-width:0}
.bk-status span{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:13px; color:var(--parch-dim)}
.bk-status b{font-family:var(--f-black); font-weight:400; font-size:20px; overflow-wrap:anywhere}
.err-txt{color:var(--blood-hi)}
.bk-dl{display:grid; gap:12px}
@media (min-width:640px){ .bk-dl{grid-template-columns:1fr 1fr} }
.bk-card{display:flex; flex-direction:column; gap:6px; border:var(--frame) solid var(--line); padding:14px 16px; text-decoration:none; color:var(--parch)}
.bk-card b{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:26px; line-height:1}
.bk-card span{font-size:14px; color:var(--parch-dim)}
.bk-card i{font-style:normal; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; color:var(--blood-hi); margin-top:4px}
.bk-card:hover{background:var(--parch); color:var(--ink)} .bk-card:hover span{color:var(--ink)}
.cron-url{display:inline-block; margin:6px 0 2px; font-size:12px}
.cron-url{display:block; max-width:100%; white-space:normal; word-break:break-all; overflow-wrap:anywhere}

/* social media */
.nav-social{display:flex; align-items:center; gap:2px}
.nav-social a{width:40px; justify-content:center}
.nav-social a span{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
.follow{margin-top:6px; border-top:3px solid var(--line-soft); padding-top:16px}
.follow-h{margin:0 0 10px; text-align:center; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:18px; color:var(--parch-dim)}
.follow-row{display:grid; grid-template-columns:repeat(var(--n,3),minmax(0,1fr)); gap:12px}
.follow-row.n1{--n:1}.follow-row.n2{--n:2}.follow-row.n3{--n:3}
@media (max-width:420px){ .follow-row .btn-insta{flex-direction:column; gap:4px; font-size:14px; padding:10px 6px} }
@media (max-width:1023px){
  .nav-social{gap:0; border-bottom:3px solid var(--line-soft)}
  .nav-social a{flex:1; width:auto; border-bottom:0 !important; border-right:3px solid var(--line-soft)}
  .nav-social a:last-child{border-right:0}
  .nav-social a svg{width:30px; height:30px}
}

/* O projekcie */
.about .about-photo, .about .about-lead, .about .about-nums, .about .about-contact{max-width:680px; margin-left:auto; margin-right:auto}
.about-photo{margin-top:0; margin-bottom:22px; border:3px solid var(--line)}
.about-photo img{display:block; width:100%; height:auto}
.about-lead{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.02em; font-size:clamp(22px, 5.4vw, 30px); line-height:1.12; margin-top:0; margin-bottom:28px; padding-left:16px; border-left:6px solid var(--blood)}
.about-nums{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0; border:3px solid var(--line); margin-top:34px; margin-bottom:28px}
.about-nums div{padding:16px 14px; border-right:3px solid var(--line-soft); border-bottom:3px solid var(--line-soft); display:flex; flex-direction:column; gap:4px}
.about-nums div:nth-child(2n){border-right:0}
.about-nums div:nth-last-child(-n+2){border-bottom:0}
.about-nums b{font-family:var(--f-black); font-weight:400; font-size:clamp(42px, 11vw, 64px); line-height:.9; color:var(--blood-hi)}
.about-nums span{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:15px; color:var(--parch-dim)}
@media (min-width:760px){ .about-nums{grid-template-columns:repeat(4, minmax(0,1fr))} .about-nums div{border-bottom:0} .about-nums div:nth-child(2n){border-right:3px solid var(--line-soft)} .about-nums div:last-child{border-right:0} }
.about-contact{display:flex; flex-direction:column; gap:12px; margin-bottom:40px}
.about-mail span{text-transform:none; overflow-wrap:anywhere}
mark.todo{background:#f2d24b; color:#1a1612; padding:0 .2em; border-radius:2px}
.notice.warn{border-color:#f2d24b}
.about-thumb{display:flex; align-items:center; gap:14px; margin-bottom:10px}
.about-thumb img{width:120px; height:80px; object-fit:cover; border:2px solid var(--line-soft)}
@media (min-width:760px){ .about-nums b{font-size:clamp(32px, 3.6vw, 46px)} }
.form label.chk, label.chk{display:flex; flex-direction:row; align-items:center; gap:10px; text-transform:none}
label.chk input{width:22px; height:22px; flex:none; margin:0}

/* Współpraca / reklama */
.sponsor-note{max-width:680px; margin:-6px auto 26px; display:flex; align-items:stretch; border:3px solid var(--blood); background:rgba(212,42,27,.08)}
.sponsor-note .sp-tag{flex:none; display:flex; align-items:center; padding:8px 12px; background:var(--blood); color:var(--on-blood); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:17px}
.sponsor-note .sp-txt{padding:10px 14px; font-size:16px; line-height:1.45; color:var(--parch)}
.sponsor-note b{font-weight:700}
.sponsor-note a{color:var(--blood-hi)}
.sponsor-note .sp-note{display:block; color:var(--parch-dim); font-size:15px; margin-top:2px}
.sp-mini{display:inline-block; vertical-align:middle; margin-right:8px; padding:2px 7px 3px; border:2px solid var(--blood); color:var(--blood-hi); font-family:var(--f-black); text-transform:uppercase; letter-spacing:.06em; font-size:12px; line-height:1.2}
.a-title .sp-mini{margin:0 0 0 6px; font-size:11px}
.sponsor-box .sp-fields{display:none; margin-top:12px}
.sponsor-box.on .sp-fields{display:flex; flex-direction:column; gap:12px}
.sponsor-box.on{border-color:var(--blood)}
.sp-help span{display:block}
.row2{display:grid; grid-template-columns:minmax(0,1fr); gap:12px} @media (min-width:700px){ .row2{grid-template-columns:repeat(2,minmax(0,1fr))} }
.sp-help span[hidden]{display:none}

/* SEO / Przeczytaj też */
.cat-intro{max-width:720px; margin:14px 0 22px; color:var(--parch-dim); font-size:17px; line-height:1.5}
.related{max-width:680px; margin:10px auto 26px}
.rel-grid{display:flex; flex-direction:column; gap:12px}
.rel-card{display:grid; grid-template-columns:96px minmax(0,1fr); gap:14px; align-items:center; border:3px solid var(--line); text-decoration:none; color:var(--parch); padding:0; min-height:96px}
.rel-card:hover{border-color:var(--blood)}
.rel-img{display:flex; align-items:center; justify-content:center; width:96px; height:96px; overflow:hidden; background:var(--ink-2); border-right:3px solid var(--line)}
.rel-img img, .rel-img picture{width:100%; height:100%; object-fit:cover; display:block}
.rel-body{display:flex; flex-direction:column; gap:4px; padding:8px 12px 8px 0; min-width:0}
.rel-meta{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.04em; font-size:13px; color:var(--blood-hi)}
.rel-title{font-family:var(--f-black); text-transform:uppercase; font-size:20px; line-height:1.05; overflow-wrap:break-word}
@media (min-width:700px){
  .rel-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr))}
  .rel-card{grid-template-columns:1fr; align-items:stretch}
  .rel-img{width:100%; height:auto; aspect-ratio:3/2; border-right:0; border-bottom:3px solid var(--line)}
  .rel-body{padding:10px 12px 12px}
}
.seo-len{float:right; font-size:13px; color:#7fbf7f; text-transform:none}
.seo-len.short{color:var(--parch-dim)} .seo-len.over{color:var(--blood-hi)}

/* Panel → Ekran w salonie */
.scr{display:flex; flex-direction:column; gap:12px}
.scr-tag{margin:0; display:inline-block; align-self:flex-start; padding:4px 10px; font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px; border:2px solid var(--line-soft); color:var(--parch-dim)}
.scr-tag.ok{background:#2f6b3a; border-color:#2f6b3a; color:#fff} .scr-tag.off{border-style:dashed}
.scr-card{display:grid; grid-template-columns:96px minmax(0,1fr); gap:14px; align-items:center; border:3px solid var(--line); padding:10px}
.scr-card img, .scr-ph{width:96px; height:96px; object-fit:cover; display:flex; align-items:center; justify-content:center; background:var(--ink-2); color:var(--parch-dim); font-size:13px}
.scr-card div{display:flex; flex-direction:column; gap:4px; min-width:0}
.scr-card b{font-family:var(--f-black); font-weight:400; text-transform:uppercase; font-size:20px; line-height:1.05}
.scr-rate{font-family:var(--f-black); color:var(--blood-hi); font-size:26px}
.scr-card a{color:var(--blood-hi); overflow-wrap:anywhere}
.scr-json{white-space:pre-wrap; font-size:13px; max-height:360px; overflow:auto; background:var(--ink-2); padding:12px}

.next-gig .gig-sub{margin:-4px 0 14px}

/* licznik „za X dni” w tej samej linii co miejsce – wiersz koncertu nie rośnie */
.gig-line{display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px}
.gig-line .gig-when{font-size:12px; padding:1px 6px; transform:rotate(-2deg); line-height:1.3}
@media (max-width:520px){ .gig-act{margin-top:-4px} .gig-act .gig-btn{font-size:12px; padding:4px 8px; border-width:2px} }

.gig-btn-tix{background:var(--blood); border-color:var(--blood); color:var(--on-blood)}
.gig-btn-tix:hover{background:var(--blood-hi); color:var(--on-blood)}
.gig-act{flex-wrap:wrap}
fieldset{min-width:0}
.row3{grid-template-columns:repeat(2,minmax(0,1fr))}
.row3 input, .row2 input{min-width:0; width:100%; box-sizing:border-box}

/* ----- Koncert jako bilet (odcinek z datą po lewej) ----- */
.gig-list{border-top:0}
.gig-list .tix{display:grid; grid-template-columns:84px minmax(0,1fr); gap:0; align-items:stretch; padding:0; margin:0 0 12px; border:3px solid var(--line); border-bottom:3px solid var(--line)}
.tix-stub{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; background:var(--blood); color:var(--on-blood); border-right:3px dashed var(--line); padding:8px 4px; font-family:var(--f-black); text-transform:uppercase; line-height:1; position:relative}
.tix-stub b{font-weight:400; font-size:36px}
.tix-stub span{font-size:14px; letter-spacing:.05em}
.tix-when{margin-top:5px; font-size:11px; letter-spacing:.04em; background:var(--parch); color:var(--ink); padding:2px 5px; white-space:nowrap}
.tix-main{display:flex; flex-direction:column; justify-content:center; gap:3px; padding:10px 14px; min-width:0}
.tix .gig-band{font-size:24px}
.tix .gig-place{font-size:14px}
.tix-links{display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:4px}
.tix-link{font-family:var(--f-black); text-transform:uppercase; letter-spacing:.05em; font-size:14px; color:var(--parch); text-decoration:none}
.tix-link:hover{text-decoration:underline}
.tix-red{color:var(--blood-hi)}
.gig-list .tix-past{border-color:var(--line-soft)}
.tix-past .tix-stub{background:var(--ink-2); color:var(--parch-dim); border-right-color:var(--line-soft)}
@media (max-width:520px){
  .gig-list .tix{grid-template-columns:66px minmax(0,1fr)}
  .tix-stub b{font-size:28px} .tix-stub span{font-size:12px} .tix-when{font-size:10px; padding:1px 4px}
  .tix-main{padding:8px 10px}
  .tix .gig-band{font-size:19px} .tix .gig-place{font-size:12px}
  .tix-link{font-size:12px}
}

/* Wpis z zaznaczonym „oryginalne kolory” – bez rastra */
.card-img.raw, .photos.raw figure{background:transparent}
.card-img.raw img, .photos.raw img, .sr-thumb.raw img, .rel-img.raw img{filter:none; mix-blend-mode:normal}
.card-img.raw::after, .photos.raw figure::after{display:none}
.raw-check{margin:4px 0 18px}
/* Grafiki (oryginalne kolory) – cały obraz, bez przycinania */
.featured .card-img.raw img, .card .card-img.raw img{aspect-ratio:auto; height:auto; object-fit:contain}
.card-img.raw{background:#121010; display:flex; align-items:center}
.card-img.raw picture{width:100%}
@media (min-width:900px){ .featured .card-img.raw img, .featured .card-img.raw picture{height:auto} }

/* Zdjęcia zawsze w oryginalnych kolorach – raster wyłączony */
.card-img, .photos figure{background:transparent}
.card-img img, .photos img, .yt-play img, .sr-thumb img{filter:none; mix-blend-mode:normal}
.card-img::after, .photos figure::after, .yt-play::after{display:none}