@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@400;500;600&display=swap');
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Inter,'Segoe UI',sans-serif}body{color:#fff;background:#100f12;--accent:#f0c47c;--accent-soft:rgba(242,193,111,.19);--border:rgba(248,205,139,.38);--glass:rgba(19,14,12,.68);--glass2:rgba(19,14,12,.86)}body.death{--accent:#d7a8ee;--accent-soft:rgba(169,104,201,.2);--border:rgba(202,155,226,.35);--glass:rgba(17,12,25,.69);--glass2:rgba(17,12,25,.88)}button,a{font:inherit}button{cursor:pointer}.backdrop{position:fixed;inset:0;background-position:center 42%;background-size:cover;transition:background-image .25s,filter .5s;transform:scale(1.015);z-index:0}.backdrop.muted{filter:grayscale(.55) brightness(.65)}.shade{position:fixed;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(9,7,6,.6) 0%,rgba(7,7,7,.16) 33%,transparent 63%),linear-gradient(0deg,rgba(6,6,7,.82) 0%,rgba(7,6,6,.08) 46%,rgba(7,6,6,.48) 100%)}.death .shade{background:linear-gradient(270deg,rgba(7,5,12,.7) 0%,rgba(7,5,12,.13) 42%,transparent 68%),linear-gradient(0deg,rgba(6,4,10,.82),transparent 55%,rgba(6,4,10,.5))}.app{position:relative;z-index:2;height:100dvh;min-height:540px;display:flex;flex-direction:column;padding:24px clamp(20px,4vw,75px) 16px;gap:22px}.topbar{height:65px;flex-shrink:0;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;gap:15px;border-bottom:1px solid var(--border);background:linear-gradient(90deg,transparent,var(--glass),transparent);backdrop-filter:blur(13px)}.back{color:#f5e5d3;text-decoration:none;white-space:nowrap;font-size:13px;letter-spacing:.03em;padding:10px 0}.back:hover,.lang button:hover{color:var(--accent)}.brand{text-align:center;display:flex;align-items:center;justify-content:center;gap:14px}.brand-mark{font-size:26px;color:var(--accent)}.brand-title{font:600 clamp(24px,2.5vw,39px)/.95 'Cormorant Garamond',Georgia,serif;letter-spacing:.055em;text-transform:uppercase;color:#f9eee2}.brand-sub{font-size:10px;color:var(--accent);letter-spacing:.19em;text-transform:uppercase;margin-top:6px}.lang{display:flex;align-items:center;justify-content:flex-end;gap:9px}.lang button{border:0;background:transparent;color:#d7cbc5;padding:9px 5px;font-size:12px;letter-spacing:.1em}.lang button.active{color:var(--accent);font-weight:600}.lang span{opacity:.35}.stage{flex:1;display:grid;grid-template-columns:minmax(230px,300px) minmax(0,1fr);gap:22px;min-height:0}.death .stage{grid-template-columns:minmax(0,1fr) minmax(230px,300px)}.death .chapters{grid-column:2;grid-row:1}.death .hero{grid-column:1;grid-row:1}.chapters{min-height:0;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:7px;background:var(--glass);backdrop-filter:blur(24px) saturate(1.1);box-shadow:0 20px 70px #0005, inset 0 1px #fff2;overflow:hidden}.aside-top{padding:23px 18px 14px;display:flex;align-items:center;gap:13px}.aside-top h2{margin:0;color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.2em;white-space:nowrap}.line{height:1px;background:var(--border);flex:1}.chapter-scroll{overflow-y:auto;flex:1;min-height:0;padding:0 12px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.chapter-row{display:flex;align-items:center;text-align:left;gap:13px;width:100%;min-height:77px;padding:15px 12px;border:0;border-bottom:1px solid #ffffff18;background:transparent;color:#e5ded6;transition:background .2s}.chapter-row:hover{background:var(--accent-soft)}.chapter-row.active{background:var(--accent-soft);box-shadow:inset 2px 0 var(--accent);color:#fff}.num{font-size:10px;color:var(--accent);font-weight:600;letter-spacing:.13em}.chapter-name{flex:1;font:500 18px/1.05 'Cormorant Garamond',Georgia,serif}.state-icon{font-size:13px;color:var(--accent);opacity:.8}.unavailable{opacity:.52}.aside-foot{padding:13px 22px;border-top:1px solid var(--border);display:flex;justify-content:space-between;color:var(--accent);font-size:9px;letter-spacing:.17em}.hero{display:flex;align-items:flex-end;min-width:0;min-height:0}.story{width:min(100%,690px);margin:0 0 18px auto;padding:27px clamp(24px,3vw,44px) 29px;background:var(--glass2);border:1px solid var(--border);border-radius:7px;backdrop-filter:blur(24px);box-shadow:0 20px 65px #0007,inset 0 1px #ffffff1b}.death .story{margin-left:0;margin-right:auto}.eyebrow{font-size:10px;letter-spacing:.22em;color:var(--accent);font-weight:600}.story h1{font:500 clamp(38px,4vw,66px)/.98 'Cormorant Garamond',Georgia,serif;margin:13px 0 14px;color:#fff3e7}.story p{font-size:14px;line-height:1.75;color:#f0e8e4;margin:0 0 22px;max-width:560px}.actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.actions a{display:inline-flex;padding:12px 19px;text-decoration:none;background:var(--accent);color:#1d1210;border-radius:3px;font-size:12px;font-weight:600}.death .actions a{color:#170f1d}.actions span{font-size:11px;color:#e6d2c5;opacity:.75}.footer{height:23px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.18em;color:#e5d7c3a8}.death .footer{color:#e2d0e8a8}
@media(max-width:760px){.app{padding:12px 12px 9px;gap:10px;min-height:0}.topbar{height:auto;min-height:60px;grid-template-columns:1fr auto;gap:5px}.brand{grid-column:1/3;grid-row:2;padding-bottom:10px}.back{grid-column:1;grid-row:1;font-size:11px}.lang{grid-column:2;grid-row:1}.stage,.death .stage{display:flex;flex-direction:column;gap:10px}.chapters,.death .chapters{order:2;flex:0 0 32%;min-height:150px}.hero,.death .hero{order:1;flex:1;min-height:0}.chapter-scroll{display:flex;overflow-x:auto;overflow-y:hidden;padding:4px 8px}.chapter-row{flex:0 0 165px;min-height:75px;border-right:1px solid #ffffff20;border-bottom:0}.chapter-name{font-size:15px}.aside-top{padding:8px 12px}.aside-foot{display:none}.story{margin:0!important;width:100%;padding:18px 19px}.story h1{font-size:38px;margin:7px 0}.story p{font-size:12px;line-height:1.55;margin-bottom:12px}.eyebrow{font-size:9px}.footer{font-size:8px}.backdrop{background-position:58% center}.death .backdrop{background-position:43% center}}
@media(max-height:650px) and (min-width:761px){.app{padding-top:10px;gap:8px}.topbar{height:56px}.story{padding:18px 24px}.chapter-row{min-height:64px}}

/* Jednotna typografie webu: pismo pouzite v listach */
html,body,button,a,input,textarea,select,.brand-title,.chapter-name,.story h1,.reading h1,.byline,.chapter-text,.notice,.eyebrow{font-family:Cinzel,Georgia,serif!important;}

/* 1.0.3: Keep empty chapter states visually coherent */
.backdrop.muted{background-color:#18131a}

/* 1.1 — chladna modrofialova paleta Kroniky smrti */
body.death{--accent:#c0cee8;--accent-soft:rgba(112,138,191,.23);--border:rgba(125,151,204,.43);--glass:rgba(17,24,39,.73);--glass2:rgba(17,24,39,.90);background:#101622}
.death .shade{background:linear-gradient(270deg,rgba(9,17,31,.73),rgba(11,17,31,.15) 42%,transparent 68%),linear-gradient(0deg,rgba(8,13,25,.83),transparent 55%,rgba(9,14,26,.54))}
.death .backdrop.muted{background-color:#101622}

/* 1.2.6: typografie Kroniky zivota sjednocena se cteckou */
.life .story p,.life .chapter-name,.life .brand-title,.life .story h1{font-family:"Cormorant Garamond",Georgia,serif!important}
.life .story p{font-size:20px;line-height:1.5}
/* 1.2.12 – jednotné projektové písmo také v knihovně kapitol */

html,body,.brand-title,.brand-sub,.chapter-name,.story h1,.story p,.aside-top h2,.chapter-row,.footer,.back,.lang button{font-family:'Cinzel',Georgia,serif!important}

/* 1.2.13: konzistentni pismo knihovny */
html body,html body .brand-title,html body .brand-sub,html body .chapter-name,html body .story h1,html body .story p,html body .aside-top h2,html body .chapter-row,html body .footer,html body .back,html body .lang button,html body button{font-family:"Cinzel",Georgia,serif!important}

.chapter-confirm{display:inline-flex;align-items:center;gap:7px;margin-left:14px;font-size:12px;cursor:pointer}.chapter-confirm[hidden]{display:none}.chapter-confirm input{accent-color:#c6a36b}
