/* DOBROSTANY – identyfikacja kolorystyczna MVP 0.2 */
:root{
  --ink:#182e24;
  --muted:#6a746b;
  --line:#d8d8c7;
  --bg:#f5f2e9;
  --off:#eae6d8;
  --accent:#14503b;
  --card:#fffdf7;
  --paper:#fffcf3;
  --paper-ink:#24261e;
}
body{background:var(--bg)}
button:focus-visible,a:focus-visible,input:focus-visible{outline-color:#22684e}
.site-header{background:#f5f2e9;border-color:#d9d8c8}
.brand{color:#174a37;font-size:23px;letter-spacing:-1.4px;font-weight:870}
.brand span:first-child{font-weight:870}
.header-divider{border-left-color:#c8cfbe}
.header-label{color:#365544}
.test-badge{border-color:#bfd0bf;color:#14503b;background:#e6ede4}
.test-dot{background:#276e4e}
.eyebrow{color:#40654d}
.eyebrow-line{background:#377855}
.welcome h1{color:#202f24}
.welcome h1 em{color:#18583f}
.hero-description{color:#626e64}
.upload-panel{background:#fffdf6;border-color:#cbd4c4;box-shadow:0 20px 35px -34px rgba(24,65,44,.42)}
.upload-panel.is-drag{border-color:#18583f;background:#edf3e9}
.upload-icon{color:#f5efde;background:#194c38}
.upload-button{background:#154a36}
.upload-button:hover{background:#287352}
.upload-content span{color:#6a7869}
.upload-footnote{color:#677769}
.format-tags span{border-color:#d0d9c9;color:#365b43;background:#eef0e8}
.demo-link{color:#667368}
.demo-link strong{color:#164b36;border-bottom-color:#7da18a}
.showcase{
  background:#154b39;
  background-image: radial-gradient(ellipse at 50% 35%,#28634c 0%,#174e3c 47%,#103f30 100%);
}
.showcase:before{border-color:rgba(233,226,197,.18)}
.showcase:after{border-color:rgba(233,226,197,.15)}
.showcase-corner{border-color:rgba(236,231,209,.52)}
.showcase-side-note{color:#cddaca}
.showcase-side-note span{color:#9fb7a3}
.book-stack{filter:drop-shadow(28px 29px 27px rgba(1,19,13,.37))}
.book-shadow{background:#bcb58e;border-color:#a29c77}
.cover-book{
  color:#14271d;
  background:#eee6ce;
  padding:27px 27px 29px;
  box-shadow:inset 8px 0 11px rgba(30,26,10,.18),inset 0 0 0 1px rgba(9,43,28,.12);
}
.cover-book:before{
  content:"";
  position:absolute;
  left:8%;right:8%;top:18%;bottom:21%;
  background:linear-gradient(146deg,#21694f 0%,#0e4836 55%,#093928 100%);
  border:2px solid #173f31;
  box-shadow:inset 0 0 0 6px rgba(240,232,204,.08);
  z-index:0;
}
.cover-book:after{
  content:"";
  position:absolute;
  z-index:1;
  left:13%;right:13%;top:33%;height:25%;
  background:repeating-radial-gradient(ellipse at 49% 60%,transparent 0 16px,rgba(226,236,194,.35) 17px,transparent 18px 31px);
  opacity:.45;
  pointer-events:none;
}
.cover-sheen{z-index:3;opacity:.55}
.cover-orbit{border-color:rgba(224,228,185,.48);z-index:1;left:0;top:25%;height:330px;width:430px;border-radius:47% 55% 50% 45%}
.cover-orbit.orbit-two{left:-120px;top:40%;height:280px;width:440px;border-color:rgba(224,228,185,.21)}
.cover-top{font-size:clamp(10px,1vw,13px);font-weight:870;letter-spacing:.5px;z-index:2}
.cover-top span{font-weight:740;font-size:9px;letter-spacing:1.2px}
.cover-title{color:#f5ead1;text-align:center;letter-spacing:-1.9px;font-weight:700;text-transform:uppercase;font-family:var(--sans);font-size:clamp(37px,3.8vw,56px);line-height:1.04;text-wrap:balance;z-index:2}
.cover-title em{font-style:normal;color:#f5ead1}
.cover-bottom{font-size:12px;font-weight:850;line-height:1.22;letter-spacing:.35px;z-index:2}
.cover-number{font-family:var(--sans);font-size:11px;font-weight:820;color:#164c38}
.showcase-label{color:#d7e1cf}
.label-line{background:#c4d4bc}
.feature-strip{background:#edece0;border-color:#dadaca}
.feature-number{color:#326b4d}
.feature strong{color:#254032}
.feature p{color:#637065}
.welcome-footer{color:#4d6754}
/* Czytnik */
.reader-screen{background:#dfe5d9}
.reader-topbar,.reader-bottom{background:#f5f2e9;border-color:#d4dacd}
.back-home{color:#295941}
.reader-kicker{color:#4a7c5d}
.reader-book-meta strong{color:#1b422e}
.reader-book-meta>span:last-child{color:#637c69}
.icon-btn:hover{background:rgba(28,96,60,.1)}
.reader-paper{box-shadow:0 12px 44px rgba(16,67,36,.12)}
.reader-paper-header,.reader-paper-footer{letter-spacing:1.4px}
.foliate-mount foliate-view{--link-color:#1d6544}
.page-tap-zone{color:#608e75}
.page-tap-zone:hover{color:#14503b}
.reader-chapter{color:#4b745c}
.progress-wrap input{background:#becfbf}
.progress-wrap input::-webkit-slider-thumb{background:#14503b;box-shadow:0 0 0 1px #14503b;border-color:#f5f2e9}
.progress-wrap input::-moz-range-thumb{background:#14503b;border-color:#f5f2e9}
.pager-controls>span{color:#496c53}
.page-button{border-color:#afc3b2;color:#255a40}
.page-button:hover{background:#e0ebde}
.page-button.dark{background:#14503b;border-color:#14503b}
.page-button.dark:hover{background:#27714f}
.drawer{background:#f7f4eb;color:#1d3929}
.drawer-head,.drawer-foot{border-color:#d8ddce}
.drawer-overline{color:#487455}
.toc-entry{color:#294b35;border-color:#e1e6db}
.toc-entry:hover{background:#e9f0e6}
.toc-entry.nested{color:#627466}
.toc-entry.active{color:#14503b;background:#e4eee4}
.toc-empty,.setting-explainer{color:#5f7567}
.font-adjust button{background:#fffdf4;border-color:#cad8c5;color:#18533e}
.font-gauge{background:#d3dfd1}
.font-gauge span{background:#1b6647}
.theme-tile{border-color:#d9e2d2;color:#4d6a54}
.theme-tile.active{border-color:#14503b;box-shadow:inset 0 0 0 1px #14503b}
.cream-preview{background:#fffcf3;color:#284532}
.loading-overlay{background:rgba(245,242,233,.97)}
.loading-overlay span{color:#587362}
.spinner{border-color:#d4dfd0;border-top-color:#18563e}
.toast{background:#153e2f;color:#fff}
html[data-theme=cream]{--paper:#fffcf3;--paper-ink:#24261e;--paper-muted:#778777;--paper-line:#e2e6d8}
html[data-theme=dark] .reader-screen{background:#1d2d25}
@media(max-width:760px){
  .brand{font-size:20px}
  .cover-book{padding:28px}
  .cover-title{font-size:48px}
  .reader-paper{box-shadow:none}
}
@media(max-width:380px){.brand{font-size:17px}}

/* MVP 0.3: czytnik pelnoekranowy bez przewijania calej strony */
html:has(#readerScreen:not([hidden])),
body:has(#readerScreen:not([hidden])){height:100%;overflow:hidden;overscroll-behavior:none}
body:has(#readerScreen:not([hidden])) .site-header{display:none}
body:has(#readerScreen:not([hidden])) #app{height:100dvh;overflow:hidden}
.reader-screen:not([hidden]){height:100dvh;min-height:0;max-height:100dvh;overflow:hidden;position:relative}
.reader-topbar{height:64px;flex:0 0 64px;padding-inline:clamp(14px,3vw,48px)}
.reader-book-meta strong{font-size:clamp(15px,1.5vw,21px)}
.reader-stage{min-height:0;overflow:hidden;padding:clamp(8px,1.4vh,16px) clamp(8px,2vw,35px)}
.reader-paper{height:100%;min-height:0;max-width:1180px;padding:14px clamp(18px,3vw,48px) 10px}
.foliate-mount{min-height:0;overflow:hidden;padding:8px 0}
.reader-bottom{min-height:58px;grid-template-columns:minmax(110px,1fr) minmax(250px,3fr) auto;gap:18px;padding:8px clamp(14px,3vw,48px)}
.page-button{width:37px;height:37px}
@media(max-width:760px){
 .reader-screen:not([hidden]){height:100dvh;max-height:100dvh;min-height:0}
 .reader-topbar{height:55px;flex-basis:55px;padding:0 10px}
 .reader-book-meta strong{font-size:14px}
 .reader-stage{padding:0;min-height:0}
 .reader-paper{height:100%;padding:4px 12px}
 .reader-paper-header{min-height:25px;font-size:7px;padding-bottom:2px}
 .reader-paper-footer{min-height:22px;font-size:7px;padding-top:2px}
 .foliate-mount{padding:2px 0}
 .reader-bottom{min-height:64px;padding:9px 14px calc(9px + env(safe-area-inset-bottom,0px));display:flex;gap:14px;align-items:center}
 .progress-wrap{flex:1;order:0;grid-column:auto}
 .pager-controls{grid-column:auto;gap:6px;order:0}
 .pager-controls>span{display:none}
 .page-button{width:33px;height:35px}
}

/* Dobrostany 0.4 — pojedyncza strona, skupienie, układ responsywny */
.reader-screen:not([hidden]){height:100dvh;max-height:100dvh}
.reader-stage{padding:clamp(8px,1.5vh,18px) clamp(7px,2vw,38px)}
.reader-paper{max-width:850px;transition:max-width .2s ease,padding .2s ease;}
html[data-layout=double] .reader-paper{max-width:1260px}
.reader-topbar{height:58px;flex-basis:58px}
.reader-bottom{min-height:49px;grid-template-columns:minmax(100px,1fr) minmax(180px,3fr) auto;gap:18px;padding:6px clamp(12px,3vw,48px)}
.pager-controls{gap:8px}.page-button{height:32px;width:35px}
.reader-actions{align-items:center}
.reader-actions .icon-btn{min-height:38px;min-width:38px}
.layout-choices{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}
.layout-choices button{background:#fffdf6;border:1px solid #ced8c8;color:#244d38;border-radius:3px;padding:13px 6px;font-size:12px;cursor:pointer}
.layout-choices button.active{background:#e4eee2;border:2px solid #14503b;font-weight:750}
.reader-screen.focus-mode .reader-topbar,.reader-screen.focus-mode .reader-bottom{display:none}
.reader-screen.focus-mode .reader-stage{flex:1;height:100%;padding-top:clamp(8px,2vh,22px);padding-bottom:clamp(8px,2vh,22px)}
.reader-screen.focus-mode .reader-paper-header,.reader-screen.focus-mode .reader-paper-footer{display:none}
.reader-screen.focus-mode .reader-paper{padding-top:clamp(16px,4vh,48px);padding-bottom:clamp(16px,4vh,48px)}
.reader-screen.focus-mode .foliate-mount{padding:0}
.reader-screen:fullscreen{height:100%;max-height:100%;width:100%;background:#dfe5d9}
@media(max-width:760px){
 .reader-topbar{height:53px;flex-basis:53px}
 .reader-actions .icon-btn{min-width:33px;padding:4px}
 .reader-actions .icon-btn svg{width:19px;height:19px}
 .reader-bottom{min-height:51px;padding:6px 12px calc(6px + env(safe-area-inset-bottom,0px))}
 .reader-paper{max-width:none!important}
 .reader-stage{padding:0}
 .reader-book-meta strong{font-size:13px}
 .reader-paper-header{font-size:7px}
 .page-button{width:32px;height:32px}
}
@media(max-width:420px){.reader-actions .icon-btn{min-width:30px}.reader-book-meta strong{font-size:12px}}

/* 0.4.1 — accessible focus controls */
.reader-screen .exit-focus{display:none;position:absolute;right:clamp(12px,2vw,38px);top:clamp(12px,2vw,32px);z-index:9;cursor:pointer;border:1px solid #8ca999;border-radius:3px;padding:11px 16px;background:#f5f2e9;color:#16503c;font:700 12px system-ui,sans-serif;box-shadow:0 5px 20px #0002}
.reader-screen.focus-mode .exit-focus{display:block}
.reader-screen.focus-mode .reader-stage{min-height:0}
.reader-screen.focus-mode .reader-paper{max-height:100%}
.focus-setting-button{margin-top:12px;padding:12px 16px;width:100%;border:1px solid #14503b;background:#14503b;color:#fff;cursor:pointer;font-weight:700}
.focus-setting-button:hover{background:#0d3b2c}
@media(max-width:760px){.reader-screen .exit-focus{font-size:11px;padding:9px 11px;top:8px;right:8px}}

/* MVP 0.4.2 - neutralny ekran startowy i ustawienia kroju */
.brand{display:inline-flex;align-items:center;min-height:44px}
.brand-logo{display:block;max-width:min(210px,45vw);height:auto;max-height:43px;object-fit:contain;object-position:left center}
.showcase-neutral .showcase-message{max-width:460px;padding:50px 35px;text-align:center;position:relative;z-index:2;color:#f6f0df}
.showcase-symbol{width:155px;height:155px;margin:0 auto 24px;color:#e5dfc9}
.showcase-symbol svg{width:100%;height:100%;stroke:none}
.showcase-eyebrow{font-size:10px;letter-spacing:3px;color:#c2dac8;font-weight:750;margin:0 0 22px}
.showcase-message h2{font:400 clamp(35px,3.6vw,59px)/1.13 Georgia,serif;margin:0 0 22px;letter-spacing:-1.5px}
.showcase-message h2 em{color:#dfddbd;font-weight:400}
.showcase-message>p:last-child{font-size:13px;line-height:1.8;color:#d5e4d8;max-width:340px;margin:0 auto}
.type-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:15px}
.type-choices button{min-height:48px;border:1px solid #ced8c8;background:#fffdf6;color:#244d38;border-radius:3px;padding:8px 4px;font-size:11px;cursor:pointer}
.type-choices button:nth-child(2){font-family:Georgia,serif}
.type-choices button:nth-child(3){font-family:Arial,sans-serif}
.type-choices button.active{background:#e4eee2;border:2px solid #14503b;font-weight:750}
@media(max-width:760px){.showcase-neutral{min-height:340px}.showcase-neutral .showcase-message{padding:38px 28px}.showcase-symbol{width:92px;height:92px;margin-bottom:15px}.showcase-message h2{font-size:36px}.brand-logo{max-height:34px}}

/* 0.4.6: page counter is separate from percentage progress */
.progress-wrap .page-count {
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 700;
  color: #14503b;
}
.reader-paper-footer #pageHint { white-space: nowrap; }
@media (max-width:760px) {
  .progress-wrap .page-count { font-size: 10px; }
  .progress-wrap { gap: 8px; }
  .reader-paper-footer #pageHint { font-size: 9px; }
}

/* v0.4.7: no decorative/fictional book illustrations on landing */
#welcome .showcase,#welcome .showcase-neutral,#welcome .book-stack,#welcome .cover-book,#welcome .showcase-symbol{display:none!important}