@font-face{font-family:Unna;src:url('assets/unna-bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Garamond;src:url('assets/eb-garamond.ttf') format('truetype');font-weight:400 800;font-display:swap}
:root{--paper:#eee2cb;--ink:#24251f;--terra:#984625;--ochre:#c4974d;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#24251f;color:var(--ink)}
body{font-family:Garamond,Georgia,serif}::selection{background:#d6b26f;color:#24251f}
#stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform:translate(-50%,-50%) scale(var(--scale,1));background:var(--paper);overflow:hidden;isolation:isolate}
.slide{position:absolute;inset:0;background:var(--paper);opacity:0;visibility:hidden;transition:opacity 1.15s ease-in-out,visibility 1.15s;overflow:hidden}
.slide.active{opacity:1;visibility:visible;z-index:2}.slide.leaving{visibility:visible;z-index:1}
.painting{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.content{position:absolute;z-index:1}h1,h2,p,blockquote{margin:0}h1,h2{font-family:Unna,Georgia,serif;font-weight:700}
.active .painting{animation:pigment 2.5s ease-out both}
@keyframes pigment{from{opacity:.42;filter:saturate(.45)}to{opacity:1;filter:saturate(1)}}
@keyframes ink{from{opacity:0;filter:blur(3px);transform:translateY(12px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
.active .entry{animation:ink 1.6s var(--ease) .25s both}
.cover .content{left:135px;top:265px;width:1270px}
.cover h1{font-size:172px;line-height:1.08;letter-spacing:-.025em}
.cover .reference{margin-top:54px;font-size:53px}
.section .content{left:270px;right:270px;top:285px;text-align:center;display:flex;align-items:center;flex-direction:column}
.section h2{font-size:144px;line-height:1.15;text-wrap:balance;text-transform:uppercase;max-width:100%}
.section.long h2{font-size:124px}
.brush{width:min(100%,var(--line-width,900px));height:9px;margin-top:45px;background:var(--ochre);transform-origin:left center}
.active .brush{animation:brush 2.8s var(--ease) .6s both}
@keyframes brush{from{transform:scaleX(0);opacity:.3}to{transform:scaleX(1);opacity:.86}}
.verse .content{left:140px;top:135px;width:1640px}
.verse blockquote{font-size:68px;line-height:1.27;font-weight:500;letter-spacing:-.012em;max-width:100%;text-wrap:pretty}
.verse .reference{font-size:47px;margin-top:62px;line-height:1.2}
.verse.short .content{top:285px;width:1570px}.verse.short blockquote{font-size:82px;line-height:1.3}
mark{color:inherit;background:transparent;position:relative;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 .035em;margin:0 -.035em;background-image:linear-gradient(#d8af65a6,#d8af65a6);background-size:0% 76%;background-repeat:no-repeat;background-position:0 70%}
.active mark{animation:highlight 2.8s linear 1s forwards}
@keyframes highlight{from{background-size:0% 76%}to{background-size:100% 76%}}
.word .content{left:120px;right:120px;top:290px;height:400px;display:flex;align-items:center;justify-content:center;text-align:center}
.word h2{font-size:320px;line-height:1.08;letter-spacing:-.025em;white-space:nowrap;max-width:100%}
.word.active .entry{animation:word-ink 2.2s var(--ease) .15s both}
@keyframes word-ink{from{opacity:.08;filter:blur(5px);transform:translateY(23px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
.phrase .content{left:140px;right:210px;top:245px;text-align:center}
.phrase .lead{font-size:76px;line-height:1.26;font-weight:500;text-wrap:balance;margin:0 auto 30px;max-width:1400px}
.phrase h2{color:var(--terra);font-size:116px;line-height:1.12;text-wrap:balance;text-transform:uppercase}
.phrase.active h2{animation:ink 1.9s var(--ease) .8s both}
#controls{position:absolute;z-index:10;right:35px;bottom:24px;display:flex;align-items:center;gap:12px;padding:24px;background:none;color:#fff2da}
#controls button{display:grid;place-items:center;width:62px;height:62px;border:0;border-radius:50%;color:inherit;cursor:pointer;background:linear-gradient(145deg,#fff7e04a,#33251865);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);box-shadow:inset 0 1px 1px #fff9e5aa,0 4px 14px #24170930;opacity:0;transition:opacity .35s ease,background .2s ease,transform .2s ease}
#controls:hover button,#controls:has(button:focus-visible) button{opacity:1}
#controls button:hover{background:linear-gradient(145deg,#fff7e07a,#33251890);transform:translateY(-2px)}
#controls button:active{transform:translateY(0) scale(.96)}
#controls button:disabled{cursor:default;filter:grayscale(1)}
#controls:hover button:disabled,#controls:has(button:focus-visible) button:disabled{opacity:.35}
#controls button:focus-visible{outline:3px solid #e9be71;outline-offset:4px}
button svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px #1e140e)}
#counter{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#notice{position:fixed;bottom:82px;left:50%;transform:translateX(-50%);font:16px system-ui,sans-serif;background:#24251f;color:#f5ead5;padding:10px 18px;border-radius:8px;z-index:11}#notice:empty{display:none}
/* Os tempos permanecem iguais com prefers-reduced-motion, conforme pedido. */
@media print{html,body{height:auto;overflow:visible;background:var(--paper)}#stage{position:static;transform:none;width:100%;height:auto;overflow:visible}.slide,.slide.active{position:relative;visibility:visible;opacity:1;width:1920px;height:1080px;page-break-after:always}.entry,.painting,mark,.brush{animation:none!important;opacity:1!important;filter:none!important;transform:none!important}mark{background-size:100% 76%}#controls,#notice{display:none}@page{size:20in 11.25in;margin:0}}
/* Aquarela contextual: corte persa. Capa original aprovada preservada integralmente. */
.cover .content{display:none}
.cover.active .painting{animation:cover-arrival 3.2s ease-out both}
@keyframes cover-arrival{from{opacity:.35;transform:scale(1.012)}to{opacity:1;transform:scale(1)}}
.verse .content{top:145px;width:1420px}.verse blockquote{font-size:66px;line-height:1.25}
.verse .reference{margin-top:42px}
.verse.short .content{top:245px;width:1420px}.verse.short blockquote{font-size:84px}
.verse::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f6ebd9dc 0%,#f6ebd9d9 73%,#f6ebd980 83%,transparent 94%);pointer-events:none}
.phrase .content{left:160px;right:160px;top:240px}
.phrase h2{font-size:106px;line-height:1.15}
.expression .content{left:170px;right:170px;top:200px;height:500px;display:flex;align-items:center;justify-content:center;text-align:center}
.expression h2{font-size:156px;line-height:1.12;text-transform:uppercase;text-wrap:balance}
.expression.active .entry{animation:word-ink 2.2s var(--ease) .15s both}
.quote .content{left:200px;right:200px;top:240px;text-align:center}
.quote .citation{font-size:100px;line-height:1.22;text-wrap:balance}
.quote .author{font-size:47px;margin-top:48px;color:#724d2b}
.active .painting:not(.cover .painting){transform-origin:bottom right;animation:pigment 2.5s ease-out both,settle 9s ease-out both}
@keyframes settle{from{transform:scale(1.018)}to{transform:scale(1)}}
/* Revisão de leitura aprovada. */
.section .content{left:180px;right:180px;top:245px}
.section h2{font-size:180px;line-height:1.14}
.section.long h2{font-size:164px}
.quote .content{left:170px;right:170px;top:205px}
.quote .citation{font-size:118px;line-height:1.22}
.quote .author{font-size:51px;margin-top:42px}
.verse:not(.preserved) .content{top:140px;width:1480px}
.verse.short:not(.preserved) .content{top:190px}
/* Expressão A e Frase B: fundos próprios, texto HTML editável. */
@font-face{font-family:Garamond;src:url('assets/eb-garamond-italic.ttf') format('truetype');font-style:italic;font-weight:400 800;font-display:swap}
.expression{background:#071c34;color:#f6ecd6}
.expression .content{left:490px;right:85px;top:160px;height:670px}
.expression h2{width:100%;line-height:1.16}
.expression-line{display:block;white-space:nowrap;font-size:132px;letter-spacing:-.025em}
.expression-line+.expression-line{margin-top:20px}
.expression-line.focal{color:#efd18e;font-size:210px}
.expression.active .focal{animation:ink 1.9s var(--ease) .65s both}
.phrase{background:#35100d;color:#fff0da}
.phrase .content{left:535px;right:95px;top:135px;height:660px;display:flex;align-items:center;justify-content:center}
.phrase-copy{font-family:Unna,Georgia,serif;font-size:100px;font-weight:700;line-height:1.24;letter-spacing:-.025em;text-align:center}
.phrase-copy em{font-family:inherit;font-size:1.08em;font-weight:700;font-style:normal;letter-spacing:inherit;color:#efd18e}
.phrase.active em{animation:phrase-gold 1.9s ease .8s both}
@keyframes phrase-gold{from{color:#fff0da}to{color:#efd18e}}