:root { color-scheme: light; --reveal: 0; }
html,body { margin:0; height:100%; background:#f8f2e8; overflow:hidden; }
body { font-family:Arial,Helvetica,sans-serif; color:#302b2c; }
#c { position:fixed; inset:0; width:100%; height:100%; display:block; touch-action:none; cursor:default; }
#fail { position:fixed; inset:0; display:grid; place-items:center; padding:24px; text-align:center; font:14px/1.6 system-ui,sans-serif; color:#302b2c; background:#f8f2e8; z-index:30; }
#fail[hidden],[hidden] { display:none!important; }
.wordmark { position:fixed; top:40px; left:5vw; font:17px/1.2 Georgia,serif; letter-spacing:.23em; color:#f9f4e8; mix-blend-mode:difference; pointer-events:none; }
.wordmark span { font:9px/1 Arial,sans-serif; letter-spacing:.3em; display:block; margin-top:8px; }
.paper-copy { position:fixed; top:39%; left:12%; opacity:var(--reveal); transform:translateY(calc((1 - var(--reveal))*14px)); pointer-events:none; }
.eyebrow { font-size:10px; letter-spacing:.25em; color:#7b6558; }
h1 { font:clamp(36px,5.2vw,78px)/1.08 Georgia,'Times New Roman',serif; letter-spacing:-.035em; font-weight:400; margin:23px 0; }
.caption { font:14px/1.6 Georgia,serif; color:#75685f; }
footer { position:fixed; bottom:30px; left:5vw; right:5vw; display:flex; align-items:center; justify-content:space-between; gap:16px; color:#faf2df; mix-blend-mode:difference; }
.intro-note { font:12px/1.5 Georgia,serif; font-style:italic; }
nav { display:flex; gap:18px; }
button { font:10px/1.5 Arial,sans-serif; letter-spacing:.16em; text-transform:uppercase; color:inherit; border:0; border-bottom:1px solid currentColor; padding:8px 0; background:transparent; cursor:pointer; }
button:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
button span { padding-left:8px; }
.dg.ac { z-index:20!important; }
@media(max-width:600px) { .wordmark{top:26px;} .paper-copy{left:9%;top:38%;} footer{bottom:22px;} .intro-note{max-width:135px;} }