:root{--ink: #f3ebdd;--ink-soft: rgba(243,235,221,.66);--rot: 2.8deg;--tilt-y: 3deg}@font-face{font-family:Slight;src:local("Slight"),url(/fonts/Slight.woff2) format("woff2"),url(/fonts/Slight.otf) format("opentype"),url(/fonts/Slight.ttf) format("truetype");font-display:swap}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}.eyebrow,.ring__text span,.date,.note{line-height:1.54}.eyebrow,.ring__text span{text-transform:uppercase;letter-spacing:.2em}body{font-family:Glegoo,Georgia,serif;font-weight:400;color:var(--ink);background:#2a1d14}body:before,body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0}body:before{inset:-6%;background:url(/misto.png) center 40% / cover no-repeat;filter:blur(7px) sepia(.55) saturate(1.4) hue-rotate(-14deg) contrast(1.08) brightness(.4)}body:after{mix-blend-mode:normal;background:radial-gradient(circle 202px at 7% 11%,rgba(255,205,120,.34) 0%,rgba(255,205,120,.27) 40%,rgba(255,205,120,.14) 72%,transparent 100%),radial-gradient(circle 130px at 21% 5%,rgba(255,222,160,.36) 0%,rgba(255,222,160,.29) 40%,rgba(255,222,160,.14) 72%,transparent 100%),radial-gradient(circle 86px at 3% 36%,rgba(255,190,100,.3) 0%,rgba(255,190,100,.24) 40%,rgba(255,190,100,.12) 72%,transparent 100%),radial-gradient(circle 59px at 26% 21%,rgba(255,232,180,.34) 0%,rgba(255,232,180,.27) 40%,rgba(255,232,180,.14) 72%,transparent 100%),radial-gradient(circle 176px at 95% 93%,rgba(255,160,80,.32) 0%,rgba(255,160,80,.26) 40%,rgba(255,160,80,.13) 72%,transparent 100%),radial-gradient(circle 113px at 80% 99%,rgba(255,205,130,.32) 0%,rgba(255,205,130,.26) 40%,rgba(255,205,130,.13) 72%,transparent 100%),radial-gradient(circle 73px at 99% 68%,rgba(255,190,110,.28) 0%,rgba(255,190,110,.22) 40%,rgba(255,190,110,.11) 72%,transparent 100%),radial-gradient(ellipse 65% 75% at 0% 0%,rgba(255,150,40,.78),rgba(255,120,30,.28) 45%,transparent 75%),radial-gradient(ellipse 45% 55% at 100% 100%,rgba(225,85,40,.5),transparent 72%),linear-gradient(155deg,#ffaf4642,#d2642829 55%,#8c321e47),radial-gradient(ellipse 42% 55% at 22% 52%,rgba(18,10,5,.45),transparent 75%),radial-gradient(ellipse at center,transparent 50%,rgba(12,6,3,.68) 100%),url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .9  0 0 0 0 .75  0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}.stage{position:relative;z-index:1}.stage{height:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:3vw;padding:3vh 7vw 3vh 6vw}.left{text-align:center}.eyebrow{font-size:clamp(1rem,1.5vw,1.4rem);font-weight:400;color:var(--ink-soft);margin-bottom:5vh}.rings{display:flex;justify-content:center;gap:clamp(.8rem,2.6vw,2.6rem)}.ring{position:relative;width:clamp(5rem,10.5vw,9.6rem);aspect-ratio:1}.ring svg{width:100%;height:100%;transform:rotate(-90deg);display:block}.ring circle{fill:none;stroke-width:1.4}.ring .track{stroke:#f3ebdd29}.ring .bar{stroke:var(--ink);stroke-linecap:round;stroke-width:2}.ring__text{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}.ring__text b{font-weight:400;font-size:clamp(1.3rem,3vw,2.9rem);line-height:1}.ring__text span{margin-top:.9em;font-size:clamp(.58rem,.78vw,.78rem);font-weight:400;color:var(--ink-soft)}.left{position:relative}.names-wrap{margin-bottom:12vh;text-align:center;white-space:nowrap}.names{font-family:Slight,Pinyon Script,cursive;font-weight:400;font-size:clamp(1.7rem,2.9vw,2.9rem);line-height:1.2;color:var(--ink);pointer-events:none}.names span{margin-left:-.22em}.divider{width:2.4rem;height:1px;margin:7.5vh auto 0;background:#f3ebdd61}.date{margin-top:5vh;font-size:clamp(1rem,1.5vw,1.4rem);font-weight:300}.note{margin:2.6vh auto 0;max-width:30em;font-size:clamp(.85rem,1.15vw,1.1rem);color:var(--ink-soft)}.done{font-size:clamp(2rem,4.5vw,4rem);font-weight:200}.paper-wrap{position:relative;width:calc(71dvh * 1240 / 1748);height:100%;display:grid;place-items:center;perspective:1600px}.paper{position:relative;height:100%;width:100%;transform:rotate(var(--rot)) rotateX(1.5deg) rotateY(var(--tilt-y));overflow:hidden;background:#fdfcf9}.paper img{display:block;width:100%;height:100%;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.shadows{position:absolute;inset:0;transform:rotate(var(--rot)) rotateX(1.5deg) rotateY(var(--tilt-y));pointer-events:none}.shadow{position:absolute;inset:0 -12% -12% 0;-webkit-mask-image:linear-gradient(#000,#000);mask-image:linear-gradient(#000,#000)}.shadow i{position:absolute;left:0;top:0;width:89.29%;height:89.29%;background:#221208;transform-origin:0 0}.shadow.near{filter:blur(2px);opacity:.3}.shadow.near i{transform:translate(1px,2px)}.shadow.mid{filter:blur(10px);opacity:.26}.shadow.mid i{transform:translate(6px,11px)}.shadow.far{filter:blur(26px);opacity:.2}.shadow.far i{transform:translate(16px,30px) scale(.985)}.sway{position:relative;--h: min(65dvh, 100%);height:var(--h);aspect-ratio:1240 / 1748}@media(max-aspect-ratio:1/1),(max-height:500px){html,body{height:auto;min-height:100%;overflow:visible}#root{height:auto;min-height:100%;overflow:visible;overflow-x:clip}.stage{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;height:auto;min-height:100dvh;padding:4.2rem 1.4rem 3rem;gap:0}.left{width:100%}.names-wrap{margin-bottom:2.6rem}.names{font-size:clamp(1.8rem,7.6vw,2.8rem)}.rings{display:grid;grid-template-columns:repeat(2,min(38vw,12rem));justify-content:center;gap:1rem}.ring{width:auto}.ring__text b{font-size:clamp(2rem,10vw,3.4rem)}.ring__text span{font-size:.72rem;margin-top:.6em;letter-spacing:.18em}.divider{margin-top:2.2rem}.date{margin-top:1.6rem;font-size:1.1rem}.note{margin-top:1rem;font-size:1rem}.paper-wrap{width:100%;height:auto;margin-top:3rem;perspective:1200px}.sway{--h: auto;height:auto;width:min(100%,30rem)}.paper{height:auto;aspect-ratio:1240 / 1748}}
