:root{--bg:#F8F7F4;--surface:#FFF9F9;--accent:#803C48;--line:#C6BAB2;--soft:#F3E2E7}*{box-sizing:border-box}body{margin:0;color:#24211F;background:var(--bg);transition:background .8s;font-family:'Noto Serif SC',serif}button,input{font:inherit}button{cursor:pointer;color:inherit;background:transparent;border:1px solid var(--line);padding:13px 28px;letter-spacing:.18em;min-height:46px;transition:transform .15s,background .15s}button:active{transform:scale(.97);background:var(--soft)}main{min-height:100svh}.page{min-height:100svh;padding:6vh 7vw;display:flex;align-items:center;justify-content:center;flex-direction:column;animation:enter .6s both;position:relative;overflow:hidden}.frame{position:absolute;inset:24px;border:1px solid var(--line);pointer-events:none}.frame:before{content:'';position:absolute;inset:7px;border:1px solid #c6bab270}.corner{position:absolute;font:100px 'Cormorant Garamond';color:#b99c91;line-height:1}.corner:nth-child(1){left:6px;top:0}.corner:nth-child(2){right:6px;top:0;transform:scaleX(-1)}.corner:nth-child(3){left:6px;bottom:0;transform:scaleY(-1)}.corner:nth-child(4){right:6px;bottom:0;transform:scale(-1)}h1{font:400 clamp(40px,7vw,88px)/.83 'Cormorant Garamond',serif;text-align:center;letter-spacing:.12em;margin:22px 0;color:#38252b}h1 small{font-size:.78em;letter-spacing:.2em}.ornament{color:#a58b7d;font:36px 'Cormorant Garamond';letter-spacing:.3em}.eyebrow{font:14px 'Cormorant Garamond';letter-spacing:.4em;color:#8f8580}p{line-height:2;letter-spacing:.12em;text-align:center}input{background:none;border:0;border-bottom:1px solid #b99c91;text-align:center;padding:12px;width:min(300px,70vw);font-size:22px;color:#803c48;outline-offset:5px;margin:20px 0 30px}.skip{position:absolute;right:40px;bottom:40px;border:0;font-size:12px}.verse{font-size:clamp(18px,3vw,25px);min-height:120px;display:grid;place-items:center;animation:enter .45s}.intro{height:100svh;min-height:680px;padding-top:35px;justify-content:flex-start}.intro h1{font-size:clamp(36px,5vw,65px);z-index:2}.portraits{position:absolute;inset:0;pointer-events:none}.photo{position:absolute;width:23%;height:29%;object-fit:cover;filter:grayscale(1);opacity:.62;mask-image:radial-gradient(ellipse closest-side,#000 45%,#000b 65%,transparent 100%);transition:opacity .6s,transform 1.1s}.photo:nth-child(1){left:2%;top:31%}.photo:nth-child(2){left:20%;top:24%}.photo:nth-child(3){left:39%;top:32%}.photo:nth-child(4){left:57%;top:24%}.photo:nth-child(5){left:76%;top:32%}.drawing{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.drawing path{fill:none;stroke:#39312e;stroke-width:1;stroke-linecap:round;vector-effect:non-scaling-stroke}.hold{position:absolute;top:76%;border-radius:50%;width:54px;height:54px;padding:0;touch-action:none;user-select:none;z-index:4}.hint{position:absolute;top:85%;font-size:12px;letter-spacing:.2em}.white{position:absolute;inset:-100%;background:radial-gradient(ellipse,#fff 42%,#ffffffef 50%,transparent 66%);transform:scale(0);pointer-events:none;z-index:10}.white.spread{transform:scale(2);transition:transform 1.5s ease-in-out}.date{font:40px 'Cormorant Garamond';letter-spacing:.12em}.game{max-width:1100px;margin:auto;padding:30px 25px}.game header{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:15px 0}.scene{height:230px;display:grid;place-content:center;text-align:center;border-bottom:1px solid var(--line);background:radial-gradient(ellipse,var(--surface),var(--bg));margin:20px 0}.avatars{display:flex;justify-content:space-around;gap:12px;flex-wrap:wrap}.person{text-align:center;font-size:13px}.person img{width:70px;height:70px;object-fit:cover;object-position:50% 30%;border-radius:50%;display:block;margin:15px auto}.squares img{width:125px;height:125px;border-radius:2px}.dialogue{padding:26px 5px;border-bottom:1px solid var(--line);line-height:2}.tools{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}details{margin-top:30px}select{padding:10px;background:var(--surface);border:1px solid var(--line)}@keyframes enter{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@media(max-width:600px){.frame{inset:14px}.corner{font-size:75px}.page{padding:60px 32px}.intro{padding-top:65px;min-height:620px}.photo{width:34%;height:24%}.photo:nth-child(1){left:-3%;top:28%}.photo:nth-child(2){left:20%;top:25%}.photo:nth-child(3){left:39%;top:42%}.photo:nth-child(4){left:49%;top:25%}.photo:nth-child(5){left:72%;top:37%}.skip{right:22px;bottom:20px}.squares img{width:90px;height:90px}.game header{font-size:13px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Remastered opening: shared camera and spatial typography */
.prologue .reading{position:absolute;inset:20% 12% 17%;overflow:hidden;mask-image:linear-gradient(transparent,#000 28%,#000 82%,transparent);cursor:pointer;outline-offset:8px}.track{position:absolute;width:100%;top:0;transition:transform .7s cubic-bezier(.22,.65,.22,1);will-change:transform}.track p{margin:0;padding:20px 0;font-size:clamp(18px,3vw,24px);line-height:2}.prologue>.eyebrow{position:absolute;top:15%}.tap{position:absolute;bottom:15%;font:12px 'Cormorant Garamond';letter-spacing:.3em}.prologue .frame{background:radial-gradient(ellipse at 0 0,#e6c4cc50,transparent 35%),radial-gradient(ellipse at 100% 100%,#dcc59c40,transparent 35%)}.floral{position:absolute;width:170px;height:170px;color:#bb9a80;pointer-events:none}.floral svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:.65}.floral.a{left:23px;top:23px}.floral.b{right:23px;bottom:23px;transform:rotate(180deg)}.prologue.leaving .reading{opacity:0;transition:opacity .5s}.prologue.leaving .frame,.prologue.leaving .floral,.prologue.leaving>.eyebrow{opacity:0;transition:opacity .7s .25s}.op{height:100svh;min-height:600px;max-width:900px;margin:auto;position:relative;overflow:hidden;isolation:isolate;background:#f8f7f4;touch-action:none}.op .masthead{position:absolute;top:5%;width:100%;z-index:3;text-align:center}.op h1{font-size:clamp(36px,6vw,65px)}.camera{position:absolute;inset:0;transform-origin:50% 65%;will-change:transform,opacity}.poster{position:absolute;inset:18% 0 12%;isolation:isolate;mask-image:linear-gradient(#000 65%,transparent 99%)}.figure{position:absolute;object-fit:contain;width:45%;height:90%;mix-blend-mode:multiply;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);transform-origin:50% 50%;}.figure:nth-child(1){left:-8%;top:2%;z-index:1}.figure:nth-child(2){left:9%;top:-4%;z-index:0}.figure:nth-child(3){left:27%;top:13%;z-index:3;width:48%}.figure:nth-child(4){left:46%;top:0;z-index:2}.figure:nth-child(5){left:65%;top:10%;z-index:1}.op .drawing{z-index:4}.op .drawing path{stroke:url(#roseGold);stroke-width:1.3}.op .hold{top:83%;left:calc(50% - 27px);border-color:#c89da0;z-index:6}.op .hint{top:90%;width:100%;text-align:center;color:#98787c;z-index:6}.op .skip{z-index:12;bottom:8px}.bloom{position:absolute;inset:-90%;z-index:10;pointer-events:none;background:radial-gradient(ellipse at center,#fff 0%,#fff 26%,#ffffffef 36%,#ffffff80 47%,#ffffff00 62%);transform-origin:50% 59%;transform:scale(.01);opacity:0;will-change:transform,opacity}.op .floral{z-index:0;width:230px;height:230px;opacity:.65}.op .floral.a{top:20%;left:-60px}.op .floral.b{bottom:15%;right:-60px}@media(prefers-reduced-motion:reduce){.camera{transform:none!important}.track{transition-duration:.25s!important}}
.prologue .track{transition:transform .8s cubic-bezier(.25,.7,.2,1)}.book-stage{position:fixed;inset:0;background:transparent;overflow:hidden;touch-action:none;z-index:20}.book-cover{position:absolute;inset:0;background:#f8f7f4;overflow:hidden;transform-origin:50% 65%}.cover-art{position:absolute;width:100%;height:100%;object-fit:contain;object-position:center center}.book-cover .masthead{position:absolute;top:4%;width:100%;text-align:center}.book-cover h1{font-size:clamp(35px,7vw,65px)}.book-cover .floral.b{bottom:8%}.gold-drawing{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.gold-drawing path{fill:none;stroke:#D1B58D;stroke-width:.9;vector-effect:non-scaling-stroke;stroke-linecap:round}.book-cover .hold{left:calc(50% - 27px);top:87%;border-color:#D1B58D}.book-cover .hint{top:95%;width:100%;text-align:center;font-size:10px}.book-stage .skip{z-index:5;bottom:8px;right:5px;font-size:10px}.under-cover{min-height:100svh}body{overflow-x:hidden}
.gothic-stage{position:fixed;inset:0;overflow:hidden;z-index:30;touch-action:none}.gothic-cover{position:absolute;inset:0;background:#F8F7F4}.window-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.gothic-cover h1{position:absolute;top:7%;left:0;width:100%;margin:0;font-size:clamp(40px,9.5vw,76px);line-height:.93;letter-spacing:.035em}.gothic-cover h1 small{letter-spacing:.09em;font-size:.78em}.cover-subtitle{position:absolute;top:18%;width:100%;text-align:center;font:9px 'Cormorant Garamond';letter-spacing:.2em;color:#9b8569}.spiral-touch{position:absolute;left:calc(50% - 32px);top:84%;width:64px;height:64px;border:0;padding:8px;touch-action:none;user-select:none;background:none!important;transform:none!important}.spiral-touch svg{display:block;overflow:visible}.spiral-touch path{fill:none;stroke:#D1B58D;stroke-width:.8;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.hold-caption{position:absolute;top:94%;width:100%;text-align:center;font:10px 'Cormorant Garamond';letter-spacing:.24em;color:#9b8569}.gothic-stage .skip{z-index:3;right:12px;bottom:8px;font-size:10px}.prologue .track{transition:transform .8s cubic-bezier(.22,.61,.25,1)}@media(min-aspect-ratio:3/4){.gothic-cover h1{font-size:min(8vh,76px);top:6%}.cover-subtitle{top:18%}}
/* Current cover: one continuous five-bay gallery and document-flow heading. */
.gothic-cover{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(24px,5vh,48px);padding:calc(30px + env(safe-area-inset-top)) 14px calc(32px + env(safe-area-inset-bottom));height:100%;overflow:hidden}.cover-heading{position:static;text-align:center;flex:none;display:flex;flex-direction:column;gap:20px;width:100%}.gothic-cover .cover-heading h1{position:static;width:auto;margin:0;font-weight:400;font-size:clamp(35px,10vw,76px);line-height:1;letter-spacing:.035em}.cover-heading h1 span,.cover-heading h1 small{display:block}.gothic-cover .cover-heading h1 small{font-size:.8em;letter-spacing:.08em;margin-top:8px}.gothic-cover .cover-subtitle{position:static;display:block;width:auto;font-size:10px;line-height:1.6;letter-spacing:.17em}.gothic-cover .window-art{position:static;order:2;flex:none;display:block;width:min(100%,860px);height:auto;aspect-ratio:1000/520;object-fit:contain}.cover-heading{order:1}.gothic-cover .spiral-touch{position:static;order:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:180px;height:100px;min-height:100px;padding:8px;border:0;border-radius:0;flex:none;-webkit-user-select:none;user-select:none;touch-action:none;z-index:2}.spiral-touch svg{flex:none;width:48px;height:48px;pointer-events:none}.spiral-touch .spiral-base{stroke:#E6DCCB}.spiral-touch .spiral-progress{stroke:#B89A70}.gothic-cover .hold-caption{position:static;display:block;width:auto;pointer-events:none;font-size:10px;white-space:nowrap}.gothic-stage .skip{padding:8px 12px;min-height:32px}.gothic-cover .window-art{pointer-events:none}@media(max-height:580px){.gothic-cover{gap:16px;padding:20px 14px}.gothic-cover .cover-heading h1{font-size:34px}.cover-heading{gap:12px}.gothic-cover .window-art{width:min(100%,520px)}.gothic-cover .spiral-touch{height:84px;min-height:84px;gap:5px}}

/* Prologue first-paint guard: no transition is permitted during measurement. */
.prologue{animation:none}
.prologue .track{transition:transform 1000ms cubic-bezier(.45,0,.25,1);transform:translate3d(0,0,0)}
.prologue.initializing .reading{visibility:hidden}
.prologue.initializing .track{transition:none!important}
.prologue .track p.pending{visibility:hidden}
.prologue .track .first-reveal{animation:prologue-first 550ms ease-in-out both}
@keyframes prologue-first{from{opacity:0}to{opacity:1}}
.gothic-stage.wiping{will-change:mask-image}
@media(prefers-reduced-motion:reduce){.prologue .track{transition-duration:1ms}.prologue .track .first-reveal{animation:none}}

/* Compact continuous monologue: 1.7 line height and 16px paragraph spacing. */
.prologue .track p{padding:0 0 16px;margin:0;line-height:1.7;letter-spacing:.08em}
@media(prefers-reduced-motion:reduce){.prologue .track{transition-duration:1ms!important}}
/* Ornamental title and cathedral facade: presentation only, no interaction changes. */
.gothic-cover{gap:12px;padding:calc(28px + env(safe-area-inset-top)) 12px calc(30px + env(safe-area-inset-bottom));isolation:isolate}
.gothic-cover:before{content:'';position:absolute;inset:7px;background:url('assets/cover-frame.svg') center/100% 100% no-repeat;pointer-events:none;z-index:-1}
.gothic-cover .cover-heading{gap:10px;max-width:860px;flex-shrink:0}
.gothic-cover .cover-heading h1.cover-logo{width:100%;font-size:0;line-height:0;margin:0}
.cover-logo img{display:block;width:100%;height:auto;aspect-ratio:1000/410}
.gothic-cover .cover-subtitle{font-size:9px;letter-spacing:.16em;color:#927449;line-height:1.8}
.gothic-cover .window-art{width:min(100%,860px);aspect-ratio:1000/720}
.gothic-cover .spiral-touch{margin-top:1px}
@media(max-height:650px){.gothic-cover{gap:6px;padding:20px 12px}.gothic-cover .cover-heading{max-width:390px;gap:6px}.gothic-cover .window-art{width:min(100%,560px)}.gothic-cover .spiral-touch{height:84px;min-height:84px;gap:5px}}
@media(min-width:700px){.gothic-cover .cover-heading{max-width:min(66vh,700px)}.gothic-cover .window-art{width:min(65vh,760px)}}
/* Persistent audio control; no page layout or animation ownership. */
.opening-music{position:fixed;right:calc(14px + env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom));z-index:70;width:44px;height:44px;min-height:44px;padding:7px;border:0;background:rgba(248,247,244,.85);color:#A88758;touch-action:manipulation;user-select:none;-webkit-user-select:none;letter-spacing:normal}
.opening-music[hidden]{display:none}
.opening-music svg{display:block;width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.opening-music .music-frame{stroke:#D1B58D;stroke-width:.55}
.opening-music .music-slash{display:none}
.opening-music.is-off .music-slash{display:block}
.opening-music:focus-visible{outline:1px solid #A88758;outline-offset:2px}
.prologue>.skip,.gothic-stage>.skip{right:calc(74px + env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom))}
