:root{--bg:#EDEBE3;--ink:#2b2a26;--ink2:#3b3a34;--mute:#6f6c60;--dark:#1b1a17;--paper:#fff}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.7 'Open Sans',system-ui,sans-serif;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink2)}a:hover{color:#000}
h1,h2,h3{font-family:'Amatic SC',cursive;font-weight:700;line-height:1.05;letter-spacing:.01em;text-wrap:balance}
.wrap{max-width:1100px;margin:0 auto;padding:48px 24px 0}
.narrow{max-width:860px}
.narrow{padding-top:24px}
a.pill{text-decoration:none}

/* hlavička */
.hero{max-width:1100px;margin:0 auto;padding:64px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.logo{margin:0;line-height:0}.logo img{width:min(500px,82vw)}
.tagline{margin:0;max-width:460px;font-size:14px;line-height:1.6;color:#5a584f;text-wrap:pretty}
.social{display:flex;gap:12px;justify-content:center}
.soc{width:44px;height:44px;border-radius:50%;background:#fff;color:#4a483f;display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.soc:hover{background:var(--dark);color:#fff}
.cats{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;max-width:820px}
.pill{font:600 13px/1 'Open Sans',sans-serif;padding:10px 18px;border-radius:999px;border:0;background:#fff;color:var(--ink);cursor:pointer;min-height:36px;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.pill:hover{background:#dcd9cd;color:var(--ink)}
.pill.on{background:var(--dark);color:#fff}

/* papír */
.paper{background:var(--paper)}
.torn{clip-path:polygon(0% 1.6%,5% .2%,11% 1.3%,18% 0%,26% 1.5%,34% .4%,42% 1.4%,50% .1%,58% 1.2%,66% .3%,74% 1.6%,82% .2%,90% 1.3%,96% .4%,100% 1.1%,99.4% 35%,100% 70%,99.6% 98.7%,94% 99.9%,87% 98.6%,79% 99.7%,71% 98.4%,63% 99.8%,55% 98.6%,47% 99.6%,39% 98.3%,31% 99.8%,23% 98.5%,15% 99.6%,8% 98.4%,0% 99.5%,.6% 65%,0% 30%)}
.torn.soft{clip-path:polygon(0% 5px,5% 1px,11% 4px,18% 0px,26% 5px,34% 1px,42% 4px,50% 0px,58% 4px,66% 1px,74% 5px,82% 1px,90% 4px,96% 1px,100% 3px,99.6% 50%,100% calc(100% - 4px),94% calc(100% - 0px),87% calc(100% - 4px),79% calc(100% - 1px),71% calc(100% - 5px),63% calc(100% - 0px),55% calc(100% - 4px),47% calc(100% - 1px),39% calc(100% - 5px),31% calc(100% - 0px),23% calc(100% - 4px),15% calc(100% - 1px),8% calc(100% - 5px),0% calc(100% - 1px),0.4% 50%)}
.meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--mute);align-items:center}
.meta span{display:inline-flex;gap:6px;align-items:center}

/* časová osa */
.tl{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:112px;row-gap:48px;padding-bottom:240px}
.tl-line{position:absolute;top:-40px;bottom:0;left:calc(50% - 1px);width:2px;background:var(--dark);border-radius:2px}
.post{position:relative;filter:drop-shadow(0 2px 6px rgba(40,38,30,.10));width:100%;max-width:440px}
.post.l{justify-self:end}
.post.r{justify-self:start;transform:translateY(200px)}
.post[hidden]{display:none}
.pin{position:absolute;top:28px;width:40px;height:40px;border-radius:50%;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 6px var(--bg);z-index:1}
.post.l .pin{right:-76px}.post.r .pin{left:-76px}
.post .paper{padding:36px 32px 34px;display:flex;flex-direction:column;gap:14px}
.post h2{margin:0;font-size:34px}
.post h2 a{color:var(--dark);text-decoration:none}
.post h2 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.collage{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.collage img{width:100%;aspect-ratio:4/3;object-fit:cover}
.collage .big{grid-column:1/-1;aspect-ratio:16/10}
.perex{margin:0;font-size:13.5px;line-height:1.7;color:var(--ink2);text-wrap:pretty}
.more{align-self:flex-end;font-size:13px;display:inline-flex;gap:8px;align-items:center;min-height:32px;text-underline-offset:3px}
.tl-end{display:flex;justify-content:center;padding-bottom:24px}
.dot{width:16px;height:16px;border-radius:50%;background:var(--dark);margin-top:-2px}
.empty{text-align:center;font-family:'Amatic SC',cursive;font-size:34px;margin:40px 0}

/* článek */
.bar{max-width:1100px;margin:0 auto;padding:32px 24px 8px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px}
.bar img{width:230px}
.article{padding:clamp(28px,6vw,72px) clamp(20px,7vw,88px) clamp(40px,6vw,80px);display:flex;flex-direction:column;gap:22px;filter:drop-shadow(0 2px 6px rgba(40,38,30,.10))}
.article h1{margin:0;font-size:clamp(44px,6vw,68px);line-height:1}
.tags{margin:-6px 0 0;display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12px}
.tags a{color:#4a483f}
.cover,.gallery button{padding:0;border:0;background:none;cursor:zoom-in;display:block;width:100%}
.cover img{width:100%;aspect-ratio:16/10;object-fit:cover}
.lead{margin:0;font-size:18px;line-height:1.75;text-wrap:pretty}
.pending{margin:0;padding:14px 18px;background:#f3efe0;color:#5a584f;font-size:14px}
.prose{font-size:16.5px;line-height:1.8;color:var(--ink2)}
.prose>*:first-child{margin-top:0}
.prose h2{font-size:40px;margin:1.4em 0 .4em;color:var(--dark)}
.prose h3{font-size:30px;margin:1.3em 0 .3em;color:var(--dark)}
.prose p,.prose ul,.prose ol{margin:0 0 1em;text-wrap:pretty}
.prose li{margin:.2em 0}
.prose img{margin:1.4em 0}
.prose blockquote{margin:1.2em 0;padding-left:1em;border-left:2px solid #d8d5c9;color:#5a584f}
.gal-h{margin:16px 0 0;font-size:40px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:4px}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:opacity .15s}
.gallery button:hover img{opacity:.85}
.prevnext{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:16px;margin:40px 0 0}
.prevnext a{text-decoration:none;color:var(--ink);padding:22px 26px;display:flex;flex-direction:column;gap:6px;filter:drop-shadow(0 2px 6px rgba(40,38,30,.08))}
.prevnext a.right{text-align:right}
.prevnext span{font-size:12px;color:var(--mute)}
.prevnext strong{font-family:'Amatic SC',cursive;font-size:28px;line-height:1.05}
.nf{padding:48px;text-align:center}.nf h2{font-size:48px;margin:0 0 8px}

/* lightbox */
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh}
.lightbox::backdrop{background:rgba(20,19,17,.92)}
.lightbox img{position:absolute;inset:0;margin:auto;max-width:92vw;max-height:88vh;width:auto;height:auto}
.lightbox button{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;width:52px;height:52px;border-radius:50%;font-size:30px;line-height:1;cursor:pointer}
.lightbox button:hover{background:rgba(255,255,255,.25)}
.lb-close{top:16px;right:16px}.lb-prev{left:16px;top:calc(50% - 26px)}.lb-next{right:16px;top:calc(50% - 26px)}

/* patička */
.foot{margin-top:24px;border-top:1px solid #d8d5c9;padding:36px 24px 48px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.foot p{margin:8px 0 0;font-size:12px;color:var(--mute)}

@media (max-width:760px){
.tl{grid-template-columns:minmax(0,1fr);padding-left:56px;padding-bottom:40px}
.tl-line{left:20px}
.post.l,.post.r{justify-self:stretch;transform:none;max-width:none}
.post.l .pin,.post.r .pin{left:-56px;right:auto}
.post .paper{padding:30px 22px 28px}
.tl-end{justify-content:flex-start;padding-left:13px}
.bar img{width:170px}
}

/* cookie lišta */
.consent{position:fixed;left:clamp(12px,3vw,32px);right:clamp(12px,3vw,32px);bottom:clamp(12px,3vw,32px);z-index:40;max-width:720px;margin:0 auto;background:#fff;border:1px solid rgba(28,28,28,.12);box-shadow:0 8px 32px rgba(40,38,30,.16);padding:20px 24px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.consent[hidden]{display:none}
.consent p{margin:0;flex:1 1 280px;font-size:14px;line-height:1.55;color:var(--ink);text-wrap:pretty}
.consent-btns{display:flex;gap:10px;flex-wrap:wrap}
.consent .pill{min-height:44px;padding:12px 22px;border:1px solid #d8d5c9}
.consent .pill.on{border-color:var(--dark)}
.consent .pill.on:hover{background:#3b3a34}
.linkbtn{font:inherit;color:inherit;background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
.linkbtn:hover{color:#000}
.prose .video{position:relative;aspect-ratio:16/9;margin:1.4em 0}.prose .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}