@font-face{font-family:Uncial;src:url('fonts/uncial.ttf') format('truetype');font-display:swap}
@font-face{font-family:Fell;src:url('fonts/fell.ttf') format('truetype');font-display:swap}
*{box-sizing:border-box}html{color-scheme:dark;scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:#000;color:#fff0d0;font:20px/1.55 Fell,Georgia,serif}a{color:inherit;text-underline-offset:5px}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid #e9d798;outline-offset:5px}[hidden]{display:none!important}h1,h2,p,figure{margin:0}.skip{position:absolute;z-index:30;left:20px;top:-100px;padding:12px 18px;background:#f5dda8;color:#14321d}.skip:focus{top:16px}
.ouro-hero{position:relative;width:100%;margin:0;line-height:0;isolation:isolate}.ouro-hero>img{display:block;width:100%;height:auto;max-width:none}.ouro-stars{position:absolute;inset:0;pointer-events:none}.ouro-stars i{position:absolute;left:var(--x);top:var(--y);width:clamp(8px,1.1vw,19px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff3bc80,transparent 70%);transform:translate(-50%,-50%);opacity:.12;animation:ouro-star-breathe var(--speed,6.2s) ease-in-out var(--delay,0s) infinite}.ouro-stars i:before{content:"";position:absolute;inset:27%;background:#fff5d2;clip-path:polygon(50% 0,57% 42%,100% 50%,57% 58%,50% 100%,43% 58%,0 50%,43% 42%)}
@keyframes ouro-star-breathe{0%,15%,100%{opacity:.08;transform:translate(-50%,-50%) scale(.7)}48%{opacity:.8;transform:translate(-50%,-50%) scale(1.15)}72%{opacity:.14}}
.ouro-archive{position:relative;z-index:2;width:min(1536px,100%);margin:clamp(-74px,-4.8vw,-16px) auto 0;scroll-margin-top:20px}.ouro-stone{position:relative;width:100%;height:clamp(820px,100svh,1040px);isolation:isolate}.ouro-wall{display:none}.ouro-stone:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border:solid transparent;border-width:min(13.020833vw,200px) min(14.322917vw,220px) min(11.067708vw,170px);border-image-source:url('assets/tale/ouroboros-stone-archive-blank-v1.webp');border-image-slice:200 220 170 fill;border-image-repeat:stretch round}.archive-heading{position:absolute;left:15%;right:15%;top:20.5%;text-align:center;text-shadow:0 2px 4px #000}.archive-heading>p{font-size:clamp(10px,1vw,14px);line-height:1.4;text-transform:uppercase;letter-spacing:2px;color:#d8d5b0;margin-bottom:12px}.archive-heading h1{font:400 clamp(29px,3.5vw,54px)/1.2 Uncial,Georgia,serif;color:#fff0c8;letter-spacing:-.7px}
.archive-reader{position:absolute;top:33%;bottom:19%;left:15.5%;right:15.5%;overflow-y:auto;overscroll-behavior-y:auto;scroll-snap-type:y proximity;scrollbar-width:thin;scrollbar-color:#a5ad84 #343931;scroll-padding-top:0;outline-offset:7px}.lore-chapter{display:flex;flex-direction:column;min-height:100%;padding:18px clamp(12px,4vw,64px) 40px;scroll-snap-align:start;font-size:clamp(21px,1.85vw,28px);line-height:1.5;text-shadow:0 1px 2px #000}.chapter-kicker{font-size:clamp(10px,.95vw,13px);line-height:1.4;letter-spacing:2px;text-transform:uppercase;color:#d8d5b0;margin-bottom:15px}.lore-chapter h2{font:400 clamp(28px,3vw,44px)/1.25 Uncial,Georgia,serif;color:#f7e1a5;margin:0 0 22px}.lore-chapter .chapter-lead{font-size:clamp(24px,2.15vw,32px);line-height:1.4;color:#fff0cf;margin-bottom:22px}.lore-chapter>p+p:not(.chapter-lead){margin-top:18px}.lore-chapter em{color:#f9e4b4}.chapter-link{display:inline-flex;align-items:center;align-self:flex-start;min-height:44px;gap:14px;color:#d9edc5;font-size:clamp(18px,1.6vw,23px);margin-top:24px}.chapter-link:hover{color:#fff3ba}.circle-closing{font-weight:700;color:#f4e0a4;margin-top:24px!important}
.archive-controls{position:absolute;top:83.6%;left:20%;right:20%;display:flex;align-items:center;justify-content:space-between;gap:12px}.archive-controls button{display:inline-flex;justify-content:center;align-items:center;gap:12px;min-height:44px;min-width:105px;padding:6px 12px;background:#adae9a;color:#14221a;border:2px solid #10180f;border-radius:5px;box-shadow:0 3px #11180f;font-size:17px;line-height:1.2}.archive-controls button:hover:not(:disabled){background:#d3d4b7}.archive-controls button:disabled{opacity:.42;cursor:default}.archive-controls p{font-size:14px;letter-spacing:2px;white-space:nowrap;color:#fff0c8;text-shadow:0 1px 3px #000;background:#26382be6;border:1px solid #7a8864;border-radius:4px;padding:8px 10px}.archive-note{font-size:16px;text-align:center;color:#a0b498;margin:0 20px 25px}.ouro-footer{text-align:center;padding:14px 20px 25px}.return-to-tale{display:inline-flex;align-items:center;gap:18px;font-size:20px;min-height:44px;text-decoration:none;color:#d2dabb}.return-to-tale:hover{color:#fff1bc}.music-credit{font-size:10px;line-height:1.5;color:#63725d;margin-top:35px}
@media(max-width:700px){.ouro-archive{margin-top:-4vw}.ouro-stone{height:max(820px,100svh)}.archive-heading{left:14%;right:14%;top:12%}.archive-heading>p{font-size:9px;letter-spacing:1px;margin-bottom:10px}.archive-heading h1{font-size:clamp(23px,6.1vw,38px);letter-spacing:-.6px}.archive-reader{top:23%;bottom:19%;left:13.7%;right:13.7%}.lore-chapter{padding:14px 10px 32px;font-size:20px;line-height:1.5}.lore-chapter h2{font-size:28px;margin-bottom:20px}.lore-chapter .chapter-lead{font-size:23px}.chapter-kicker{font-size:10px;letter-spacing:1.2px;margin-bottom:15px}.chapter-link{font-size:19px}.archive-controls{left:14%;right:14%;gap:7px}.archive-controls button{min-width:76px;font-size:14px;gap:6px;padding-inline:7px}.archive-controls p{font-size:11px;letter-spacing:1px}.archive-note{font-size:14px;margin-top:3px}.return-to-tale{font-size:17px;gap:10px}}
@media(max-width:370px){.archive-heading h1{font-size:22px}.archive-heading>p{font-size:8px}.lore-chapter{font-size:19px;padding-inline:5px}.lore-chapter h2{font-size:25px}.lore-chapter .chapter-lead{font-size:22px}.archive-controls{left:12%;right:12%;gap:5px}.archive-controls button{min-width:72px;font-size:13px;padding-inline:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ouro-stars i{animation:none;opacity:.15}}

/* Keep the supplied crest independent of the responsive stonework. */
.ouro-crest{position:absolute;z-index:1;left:50%;top:min(2.54vw,39px);width:min(10.026vw,154px);height:min(9.245vw,142px);transform:translateX(-50%);pointer-events:none}

/* A little floor space separates the archive from the low wall. */
body.ouro-lore-page .interior-stone-footer{margin-top:clamp(22px,3vw,48px)!important;height:calc(10.3515625vw - clamp(4px,1vw,14px));min-height:20px;overflow:hidden}

/* Full-width archive with a 26-pixel crop at both screen edges. */
html,body{overflow-x:clip}
.ouro-archive{width:calc(100% + 52px);max-width:none;margin-left:-26px;margin-right:-26px}

/* Let titles and subtitles sit directly on the stone artwork. */
.archive-heading,.archive-heading h1,.archive-heading>p,.lore-chapter h2,.chapter-kicker{background:none;box-shadow:none;text-shadow:none;filter:none}

/* Warm star glints stay aligned to the painted sky on every screen size. */
.ouro-stars i{width:clamp(9px,1.05vw,19px);background:radial-gradient(circle,#fff2bca6,transparent 68%);animation-name:ouro-star-glint}
.ouro-stars i:before{inset:22%;background:#fff9e2}
@keyframes ouro-star-glint{0%,20%,100%{opacity:.06;transform:translate(-50%,-50%) scale(.55)}44%,50%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}70%{opacity:.18;transform:translate(-50%,-50%) scale(.8)}}
@media(prefers-reduced-motion:reduce){.ouro-stars i{animation:none;opacity:.2}}

/* The stone artwork extends another 50px beyond either side of its archive. */
.ouro-stone::before{left:-50px;right:-50px}
