:root{--ink:#26231e;--leather:#4a3b1c;--gold:#8a7a5c;--paper:#fcfbf8}*{box-sizing:border-box;margin:0}html,body{height:100%;color:var(--ink);background:radial-gradient(at 50% 40%,#fbfaf7 0%,#ebe7df 80%);font-family:Georgia,serif;overflow:hidden}#stage{place-items:center;height:100%;padding:max(7vh,70px) 4vw max(7vh,52px);display:grid}#book{position:relative;width:min(94%,166.3vh - 1.663*max(7vh,70px) - 1.663*max(7vh,52px))!important}#floor{filter:blur(8px);pointer-events:none;background:radial-gradient(#463a2347,#0000 70%);width:min(70vw,1100px);height:34px;display:none;position:fixed;bottom:2.2vh;left:50%;transform:translate(-50%)}.page{color:var(--ink);overflow:hidden}.paper{background:linear-gradient(115deg,#ffffff80,transparent 45%,#3c321e08), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .28  0 0 0 0 .18  0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"), var(--paper);position:absolute;inset:6% 0}.page.hard{background:var(--leather)}.page img,.page video{object-fit:cover;width:100%;height:100%;display:block}.page .inner{flex-direction:column;justify-content:space-between;height:100%;padding:12% 10%;display:flex}.page h2{letter-spacing:.02em;text-transform:uppercase;font-size:clamp(16px,min(3.4vw,5vh),44px);line-height:1}.page small{letter-spacing:.2em;text-transform:uppercase;opacity:.55;font:600 11px/1 system-ui}.paper.dark{color:var(--ink);background:#f5f2ec}.paper.dark small{opacity:.5}.slot{opacity:.45;letter-spacing:.15em;text-transform:uppercase;border:1px dashed;place-items:center;height:55%;font:12px system-ui;display:grid}.page.sl .paper:after,.page.sr .paper:after{content:"";pointer-events:none;width:14%;position:absolute;top:0;bottom:0}.page.sl .paper:after{background:linear-gradient(270deg,#28201242,#28201214 30%,#0000);right:0}.page.sr .paper:after{background:linear-gradient(90deg,#28201247,#28201217 30%,#0000);left:0}button{letter-spacing:.22em;text-transform:uppercase;color:var(--ink);cursor:pointer;background:0 0;border:1px solid #26231e80;padding:14px 26px;font:600 12px system-ui}button:hover{background:var(--ink);color:#fcfbf8}#sound{z-index:6;border-radius:50%;place-items:center;width:46px;height:46px;padding:0;display:grid;position:fixed;top:20px;right:20px}#sound .slash,#sound.off .waves{display:none}#sound.off .slash{display:block}#hint{letter-spacing:.16em;text-transform:uppercase;opacity:0;z-index:4;font:11px system-ui;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.paper.metal{background:url(/brass.webp) 50%/cover}#coil{z-index:50;pointer-events:none;width:0;position:absolute;top:0;bottom:0;left:50%}#coil svg{width:48px;height:auto;position:absolute;left:-24px}#coil svg:first-child{top:7%}#coil svg:nth-child(2){top:calc(50% - 45px)}#coil svg:nth-child(3){bottom:7%}#brand{z-index:6;letter-spacing:.28em;text-transform:uppercase;opacity:.65;font:600 11px system-ui;position:fixed;top:22px;left:22px}.page .holes{pointer-events:none;z-index:3;width:48px;position:absolute;top:0;bottom:0;left:-24px}.page.sl .holes{left:auto;right:-24px}.page .holes svg{width:48px;height:auto;position:absolute;left:0}.page .holes svg:first-child{top:7%}.page .holes svg:nth-child(2){top:calc(50% - 45px)}.page .holes svg:nth-child(3){bottom:7%}.page.sr .paper{right:6%}.page.sl .paper{left:6%}.page.lining,#tray .lidtray,#tray .base,#tray .spine{background:url(/cover_back.webp) 50%/cover}.page.lining,#tray .lidtray,#tray .base{box-shadow:inset 0 1px #ffffff24,inset 0 0 0 1px #00000059}.page.lining:before,#tray .lidtray:before,#tray .base:before{content:"";pointer-events:none;position:absolute;inset:3.2%;box-shadow:inset 0 5px 8px #0009,inset 3px 0 5px #00000040,inset 0 0 0 1px #00000073,0 1px #ffffff1a}#tray .base{box-shadow:inset 0 1px #ffffff24,inset 0 0 0 1px #00000059,0 7px #241a0d,4px 7px #241a0d,4px 7px 0 1px #0000004d,0 8px 1px #1e140866,0 14px 9px #281c0c4d,0 27px 30px #281c0c3d}#tray .lidtray{box-shadow:inset 0 1px #ffffff24,inset 0 0 0 1px #00000059,0 7px #241a0d,-4px 7px #241a0d,-4px 7px 0 1px #0000004d,0 8px 1px #1e140866,0 14px 9px #281c0c4d,0 27px 30px #281c0c3d}#tray .spine{width:10px;position:absolute;top:0;bottom:0;left:calc(50% - 5px);box-shadow:inset 3px 0 4px #0000008c,inset -3px 0 4px #0000008c,0 7px #241a0d}#tray{z-index:-1;pointer-events:none;position:absolute;inset:0}#tray .lidtray{position:absolute;inset:0 calc(50% + 5px) 0 0}#tray .base{position:absolute;inset:0 0 0 calc(50% + 5px)}.stf__outerShadow,.stf__hardShadow,.stf__innerShadow{display:none!important}.page.hard:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #00000080,inset 0 2px #ffffff24,inset 2px 0 #ffffff0f,inset 0 -3px 4px #00000059,inset -2px 0 3px #00000040}.page.slide .holes,.page.sl .paper:after,.page.sr .paper:after{display:none}.page.sr .paper{box-shadow:1px 1px #ebe7de,2px 2px #ddd8cd,3px 3px #d2ccbf,4px 4px #c6bfb0,0 3px 6px #00000073,3px 10px 18px #00000073}.page.sl .paper{box-shadow:-1px 1px #ebe7de,-2px 2px #ddd8cd,-3px 3px #d2ccbf,-4px 4px #c6bfb0,0 3px 6px #00000073,-3px 10px 18px #00000073}.paper video.clip{object-fit:cover;cursor:pointer;background:#ddd8cd;position:absolute}.paper .clipmask{position:absolute}#rotate{z-index:20;text-align:center;color:var(--ink);background:radial-gradient(at 50% 40%,#fbfaf7 0%,#ebe7df 80%);flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;display:none;position:fixed;inset:0}#rotate p{letter-spacing:.22em;text-transform:uppercase;font:600 13px system-ui}#rotate small{letter-spacing:.08em;opacity:.55;font:12px system-ui}@media (orientation:portrait) and (width<=640px){#rotate{display:flex}}@media (height<=520px) and (orientation:landscape){#stage{padding:12px max(3vw,env(safe-area-inset-right)) 12px max(3vw,env(safe-area-inset-left))}#book{width:min(94%,166.3vh - 39.912px)!important}#brand{display:none}#sound{top:8px;right:max(10px,env(safe-area-inset-right));width:34px;height:34px}#sound svg{width:17px;height:17px}}