@font-face{font-family:Cinzel;src:url('/fonts/web/cinzel-latin-400-normal.woff2') format('woff2');font-display:swap}
@font-face{font-family:Poppins;src:url('/fonts/web/poppins-latin-400-normal.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Cinzel Decorative';src:url('/fonts/web/cinzel-decorative-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

/* Biosite em formato de lista de links: uma coluna estreita, arte preservada, pouca rolagem. */
:root{color-scheme:dark;--ink:#050505;--paper:#fff3dd;--gold:#e5c28a;--gold-soft:#f2d5a4;--muted:#d6ddd7;--line:#e5c28a45}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--paper);font:15px/1.6 Poppins,sans-serif}
a{color:inherit;text-decoration:none;touch-action:manipulation}
a:focus-visible,summary:focus-visible{outline:3px solid #ffe2a6;outline-offset:4px}
h1,h2,h3,p{margin:0}
.skip{position:absolute;top:-100px;left:12px;z-index:10;background:var(--paper);color:var(--ink);padding:12px}
.skip:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.nobr{white-space:nowrap}
.page{max-width:480px;margin:0 auto;padding:0 16px 8px}

/* Topo: dragão azul como fundo, texto compacto por cima. */
.hero{position:relative;isolation:isolate;margin:0 -16px;padding:18px 24px 22px;text-align:center;background:url('./assets/dragon-blue-900.webp') 62% top/auto 300px no-repeat}
.hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#05050522 0,#05050533 175px,#050505cc 218px,var(--ink) 292px)}
.brand{display:inline-flex;flex-direction:column;justify-content:center;min-height:44px;font-family:'Cinzel Decorative',Georgia,serif;line-height:1.15;text-shadow:0 2px 14px #001c29}
.brand span{font-size:8px;letter-spacing:2px}
.brand strong{font-size:24px;letter-spacing:5px;font-weight:400}
.eyebrow{margin-top:124px;color:var(--gold);font-size:9px;letter-spacing:1.6px;text-transform:uppercase}
h1{margin-top:8px;font-family:Cinzel,Georgia,serif;font-weight:400;font-size:21px;line-height:1.3}
h1 em{font-style:normal;color:#f0d5a6}
.welcome{margin-top:10px;font-family:Cinzel,Georgia,serif;font-size:15px;line-height:1.5}
.welcome strong{font-weight:400;color:#efd19a}
.welcome span{display:block;margin-top:2px;font-family:'Cinzel Decorative',Georgia,serif}

/* Livros: uma faixa por livro, capa pequena e ações à direita. */
main{display:grid;gap:12px}
.book{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:84px 1fr;gap:14px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:18px;background:#0c3038;box-shadow:0 10px 26px #00161d44}
.book-scene{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center}
.book:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#09272e99,#09272ef0 55%)}
.book-1 .book-scene{background-image:url('./assets/portal-background-900.webp');background-position:center 40%}
.book-2 .book-scene{background-image:url('./assets/liberation-castle.webp')}
.book-3 .book-scene{background-image:url('./assets/resistance-castle.webp')}
.book-2:after{background:linear-gradient(90deg,#191d3299,#191d32f0 55%)}
.book-3:after{background:linear-gradient(90deg,#23342d99,#23342df0 55%)}
.book-1{border-color:#e5c28aa6;box-shadow:0 0 0 1px #e5c28a33,0 12px 30px #00161d55}
.book-cover{display:block;width:84px;height:auto;aspect-ratio:500/773;object-fit:cover;border:1px solid #eed19f66;box-shadow:6px 8px 18px #0009;background:#091b20;align-self:start}
.book-info{min-width:0}
.book-act{display:block;font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--gold-soft)}
.book h2{margin-top:2px;font-family:'Cinzel Decorative',Georgia,serif;font-weight:400;font-size:19px;line-height:1.25}
.book-meta{display:block;margin-top:2px;font-size:11px;color:var(--muted)}
.tropes{margin-top:4px;font-size:11px;line-height:1.5;color:var(--muted)}
.book-btn{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;margin-top:10px;padding:8px 12px;border:1px solid #ffe4b1;border-radius:14px;background:linear-gradient(120deg,#f0d6a0,#d3ab6d);color:#172d2d;font-size:13px;line-height:1.3;text-align:center;transition:filter .2s}
.book-btn:hover{filter:brightness(1.08)}
[hidden]{display:none!important}

/* Seletor de região: discreto, logo acima dos livros. */
.region{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.region-label{margin-right:2px}
.region button{min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:22px;background:transparent;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;touch-action:manipulation}
.region button[aria-pressed="true"]{border-color:#e5c28aa6;background:#11191b;color:var(--gold-soft)}
.region button:focus-visible{outline:3px solid #ffe2a6;outline-offset:3px}
.ku-signup{text-align:center;font-size:12px;color:var(--muted)}
.ku-signup a{display:inline-block;padding:13px 2px;margin:-13px 0;color:var(--gold-soft);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}

.ku-link{display:flex;align-items:center;justify-content:center;min-height:44px;margin-bottom:-8px;font-size:12px;color:var(--gold-soft);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}

/* Links secundários: pílulas finas, abaixo dos livros. */
.links{display:grid;gap:8px;margin-top:10px}
.pill{display:flex;align-items:center;justify-content:center;min-height:46px;padding:10px 16px;border:1px solid var(--line);border-radius:14px;background:#11191b;box-shadow:0 6px 16px #000c;font-size:13px;text-align:center;transition:border-color .2s,background .2s}
.pill:hover{border-color:var(--gold);background:#182326}

/* Epílogo: ornamento entre seções e botão só de contorno, abaixo dos livros na hierarquia. */
.epilogue{display:flex;flex-direction:column;align-items:center;margin-top:6px;text-align:center}
.divider{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;height:64px}
.divider span{width:56px;height:1px;background:linear-gradient(90deg,transparent,var(--line))}
.divider span:last-child{transform:rotate(180deg)}
.divider img{flex:none;width:44px;height:44px;object-fit:contain}
.epilogue-label{display:block;margin-top:2px;font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--gold-soft)}
.epilogue h2{max-width:100%;margin-top:4px;font-family:'Cinzel Decorative',Georgia,serif;font-weight:400;font-size:17px;line-height:1.3}
.outline-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;margin-top:12px;padding:8px 22px;border:1px solid #e5c28aa6;border-radius:14px;background:#11191b;box-shadow:0 6px 16px #000c;color:var(--gold-soft);font-size:13px;transition:border-color .2s,color .2s,background .2s}
.outline-btn:hover{border-color:var(--gold);background:#182326;color:var(--paper)}
.epilogue-actions{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:12px}
.epilogue-actions .outline-btn{min-width:250px;margin-top:0}
.affiliate-note{max-width:340px;margin-top:14px;font-size:11px;line-height:1.6;color:var(--muted)}
#contato{margin-top:2px;justify-items:center}

.author{display:flex;align-items:center;gap:12px;margin-top:10px;padding:12px 4px}
.author img{flex:none;width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 30%;border:1px solid var(--line)}
.author p{font-size:13px;line-height:1.55;color:var(--muted)}
.author a{display:inline-block;padding:12px 0;margin:-12px 0;color:var(--gold)}

footer{margin-top:8px;padding:18px 4px 6px;border-top:1px solid var(--line);text-align:center}
blockquote{margin:0}
blockquote p{font:italic 15px/1.6 Georgia,serif}
cite{display:block;margin-top:4px;font-size:11px;font-style:normal;color:var(--gold)}
.legal{margin-top:12px;font-size:11px;color:var(--muted)}
.legal a{display:inline-block;padding:14px 4px;margin:-14px 0;text-decoration:underline;text-underline-offset:3px}
.art-rights{margin-top:8px;text-align:left;color:#c9d2cc}
.art-rights summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;cursor:pointer;font-size:11px;list-style:none}
.art-rights summary::-webkit-details-marker{display:none}
.art-rights summary:after{content:'▸';color:var(--gold);transition:transform .2s}
.art-rights[open] summary:after{transform:rotate(90deg)}
.art-rights h3{margin:12px 0 4px;font-size:11px;font-weight:400;color:var(--paper)}
.art-rights p{margin-bottom:8px;font-size:11px;line-height:1.75}

/* Telas maiores: mesma coluna, arte do topo em resolução maior. */
@media(min-width:481px){.hero{margin:0;border-radius:0 0 22px 22px;background-image:url('./assets/dragon-blue-1600.webp');background-size:cover;background-position:center 40%}.eyebrow{margin-top:120px}.page{padding-top:0}}

/* Celulares estreitos: botão do Livro 1 em uma linha só. */
@media(max-width:374px){.book{grid-template-columns:72px 1fr;gap:12px;padding:12px}.book-cover{width:72px}.book-btn{padding:8px;font-size:12.5px}}

/* Revelação progressiva usada por biosite.js. */
.scroll-reveal{opacity:0;transform:translateY(12px);transition:opacity .5s ease-out,transform .5s ease-out}
.scroll-reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.scroll-reveal{opacity:1;transform:none}}