:root{--paper:#eef0f2;--ink:#30343f;--muted:#686e79;--line:#bfc5cd;--blue:#a9d7e8;--pink:#d887af;--serif:Didot,"Bodoni 72","Times New Roman","Songti SC",serif;color:var(--ink);background:var(--paper);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #795b88;outline-offset:7px}button:disabled{cursor:wait}button{touch-action:manipulation}button,figure,p,h1,h2{margin:0}[hidden]{display:none!important}h1{font-weight:400;font-family:var(--serif);letter-spacing:0}body:not([data-scene="works"]){overflow:hidden}.mask-definitions{position:absolute;width:0;height:0;overflow:hidden}.page-frame{position:fixed;inset:18px;border:1px solid var(--line);pointer-events:none;z-index:10}.page-frame i{position:absolute;width:7px;height:7px;border:1px solid var(--muted);background:var(--paper);transform:rotate(45deg)}.page-frame i:nth-child(1){top:-4px;left:-4px}.page-frame i:nth-child(2){top:-4px;right:-4px}.page-frame i:nth-child(3){bottom:-4px;left:-4px}.page-frame i:nth-child(4){bottom:-4px;right:-4px}
.site-header{position:fixed;z-index:15;top:42px;left:52px;right:52px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.site-header>*{pointer-events:auto}.identity{display:flex;align-items:center;gap:20px;border:0;padding:0;background:none}.identity>span{font-family:var(--serif);font-size:25px}.identity b{font-size:12px;font-weight:400;border-left:1px solid var(--line);padding-left:20px}.header-right{display:flex;gap:42px;align-items:center;font-size:11px}.header-right>span{color:var(--muted)}.header-right a{padding:10px 0}.header-right a span{margin-left:10px}.site-footer{position:fixed;bottom:40px;left:52px;right:52px;display:flex;justify-content:space-between;font-size:9px;color:var(--muted);z-index:10;pointer-events:none}.scene{min-height:100svh;height:100svh;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:95px 50px 80px}.scene-eyebrow{font-size:10px;color:var(--muted)}
.gate-art{position:relative;width:min(1000px,118vw,134svh);aspect-ratio:2388/1668;transform:translate(10%,-1%);perspective:1200px;flex-shrink:0}.gate-art img{position:absolute;width:100%;height:100%;inset:0;filter:brightness(.38) saturate(.35);pointer-events:none}.gate-frame{clip-path:url(#gateFrameMask)}.gate-hat{clip-path:inset(40.5% 59.8% 41.5% 22.7%);transform-origin:31.5% 49.5%}.gate-bell{clip-path:inset(58.2% 31.3% 16% 60.2%);transform-origin:64% 59%}.bell-rope{position:absolute;left:60.7%;top:66%;width:8%;height:19%;background:none;border:0;cursor:grab;touch-action:none;z-index:2}.bell-rope:active{cursor:grabbing}.rope-prompt{position:absolute;left:110%;top:60%;font-family:"Songti SC",serif;font-size:12px;width:max-content;color:var(--muted);opacity:.8;transition:opacity .3s}.bell-rope:hover .rope-prompt{opacity:1}.gate-caption{position:absolute;bottom:12%;text-align:center}.gate-caption p{font:12px var(--serif);margin-bottom:12px}.gate-caption>span{font-size:12px;color:var(--muted)}.gate-art.is-pulling .gate-bell{transform:translateY(var(--rope-pull,0px))}.gate-art.is-ringing .gate-bell{animation:bell-ring 2s ease-in-out both}.gate-art.is-ringing .gate-hat{animation:hat-turn 1s 1s cubic-bezier(.45,0,.25,1) both}.gate-art.is-ringing .rope-prompt{opacity:0}
@keyframes bell-ring{0%{transform:rotate(0)}10%{transform:rotate(16deg)}23%{transform:rotate(-14deg)}36%{transform:rotate(11deg)}49%{transform:rotate(-9deg)}62%{transform:rotate(7deg)}75%{transform:rotate(-5deg)}88%{transform:rotate(2deg)}100%{transform:rotate(0)}}
@keyframes hat-turn{0%{transform:rotateY(0)}55%{transform:rotateY(180deg)}100%{transform:rotateY(360deg)}}
.book-scene>.scene-eyebrow{margin-bottom:16px}.book-scene>h1{font-size:34px;margin-bottom:36px}.spellbook{position:relative;display:grid;grid-template-columns:1fr 1fr;width:min(820px,78vw);min-height:390px;padding:8px 10px 12px;background:#d4d8df;border:1px solid #7f8795;border-radius:5px 5px 3px 3px;box-shadow:0 16px 24px #30343f0a;transform:rotate(-1deg);transition:transform .6s,box-shadow .6s;text-align:left}.spellbook:hover{transform:rotate(0deg) translateY(-4px);box-shadow:0 22px 32px #30343f12}.spellbook:before{content:"";position:absolute;left:50%;top:7px;bottom:8px;width:1px;background:#9799a3;z-index:2}.book-page{position:relative;padding:32px 36px 44px;background:#fafafa;display:flex;flex-direction:column;min-width:0}.page-left{border-right:1px solid #d7d9df}.folio{font-size:9px;color:var(--muted);margin-bottom:30px}.book-name{font:34px "Songti SC",serif;margin-bottom:22px}.book-description{font:21px/1.65 "Songti SC",serif;margin-bottom:25px}.book-bio{font-size:12px;line-height:1.8;color:var(--muted)}.page-number{position:absolute;bottom:18px;width:calc(100% - 72px);text-align:center;font:10px var(--serif);color:var(--muted)}.skill-list{display:grid;gap:24px;margin-top:12px;font-size:13px}.skill-list>span{display:flex;align-items:center;gap:18px}.skill-list i{font:16px var(--serif);color:#9c718e;width:15px}.book-seal{display:flex;align-items:center;gap:12px;font-size:12px;margin-top:auto;padding-top:32px}.book-seal>span{font-size:27px;color:#8c6c90}.book-seal b{font-weight:400;margin-left:auto}.draft-note{font-size:10px;color:var(--muted);margin-top:25px}
.lab-heading{position:absolute;top:115px;text-align:center;z-index:2;pointer-events:none}.lab-heading h1{font-size:29px;margin-top:12px}.lab-stage{width:min(1120px,94vw);height:min(680px,76svh);position:relative;margin-top:60px;isolation:isolate}.cauldron{position:absolute;height:92%;aspect-ratio:1050/1667;left:50%;top:51%;transform:translate(-50%,-50%);mix-blend-mode:multiply;pointer-events:none}.cauldron>img{width:100%;height:100%;object-fit:contain}.potion-surface{position:absolute;left:54%;top:52.5%;width:0;height:0}.brewing-ripples{position:absolute;left:54%;top:52.5%;width:28%;height:5%;transform:translate(-50%,-50%);opacity:0}.brewing-ripples i{position:absolute;inset:0;border:1px solid #cc69a0;border-radius:50%}.cauldron.is-brewing .brewing-ripples{opacity:1}.cauldron.is-brewing .brewing-ripples i{animation:ripple 1.2s ease-out infinite}.cauldron.is-brewing .brewing-ripples i:nth-child(2){animation-delay:.3s}.cauldron.is-brewing .brewing-ripples i:nth-child(3){animation-delay:.6s}.potion{position:absolute;width:155px;background:none;padding:0;border:0;z-index:2}.bottle-float{display:block;aspect-ratio:.85;animation:bottle-drift var(--period,5s) var(--phase,0s) ease-in-out infinite;transform-origin:50% 65%}.bottle-float img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}.potion-media{left:12%;top:5%;--period:5.6s;--tilt:-3deg;--lift:-12px}.potion-brand{right:12%;top:7%;--period:6.7s;--phase:-2s;--tilt:3deg;--lift:-15px}.potion-graphic{left:18%;bottom:4%;--period:4.8s;--phase:-1s;--tilt:2deg;--lift:-10px}.potion-events{right:15%;bottom:2%;--period:6.2s;--phase:-3s;--tilt:-2deg;--lift:-13px}.potion:hover .bottle-float,.potion:focus-visible .bottle-float{animation-play-state:paused}.potion:hover .bottle-caption b{text-decoration:underline;text-underline-offset:6px}.bottle-caption{display:grid;gap:8px;justify-items:center;margin-top:16px;white-space:nowrap}.bottle-caption small{font:9px var(--serif);color:var(--muted)}.bottle-caption b{font:15px "Songti SC",serif}.potion.is-selected .bottle-float{visibility:hidden}.lab-stage.is-mixing .potion:not(.is-selected){opacity:.25;transition:opacity .5s}.lab-stage.is-mixing .potion{pointer-events:none}.lab-annotation{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font:12px "Songti SC",serif;color:var(--muted);white-space:nowrap}.quiet-button{border:0;background:none;padding:12px 0;font-size:12px;border-bottom:1px solid var(--line)}.back-to-book{position:absolute;bottom:12%;left:52px}.quiet-button:hover{color:#9e648b;border-color:currentColor}@keyframes bottle-drift{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(var(--sway,4px),var(--lift,-12px)) rotate(var(--tilt,2deg))}}@keyframes ripple{0%{transform:scale(.3);opacity:1}100%{transform:scale(2.3);opacity:0}}
#spellLayer{position:fixed;inset:0;pointer-events:none;z-index:25}.spell-actor{position:absolute;object-fit:contain;mix-blend-mode:multiply;transform-origin:center}.spell-actor.is-dropper{clip-path:polygon(33% 0,67% 0,67% 25%,58% 27%,58% 82%,50% 90%,42% 82%,42% 27%,33% 25%)}.spell-cap{clip-path:inset(0 32% 74% 32%)}.spell-actor.uncorked{clip-path:inset(25% 0 0 0)}.spell-particle{position:absolute;display:block;width:17px;height:17px;background:#d88aae;border:1px solid #9d628a;box-shadow:inset -3px -3px 4px #9e6c9322}.spell-particle:after{content:"";position:absolute;left:3px;top:3px;width:5px;height:3px;background:#fbe8f3;border-radius:50%}.spell-particle.bead{border-radius:50%}.spell-particle.gummy{border-radius:5px;opacity:.9}.spell-particle.drop{width:13px;height:19px;border-radius:70% 30% 65% 35%;transform:rotate(-45deg)}.pour-stream{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.pour-stream path{fill:none;stroke:#9fcddd;stroke-width:7;stroke-linecap:round}.spell-splash{position:absolute;width:7px;height:7px;background:#d68bb3;border-radius:50%}
.works-scene{width:min(1100px,82%);margin:auto;min-height:100svh;padding:135px 0 130px}.works-toolbar{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--muted);margin-bottom:62px}.works-heading{max-width:700px;margin-bottom:60px}.works-heading h1{font-size:52px;margin:20px 0 24px}.works-heading>p:last-child{font-size:14px;line-height:1.9;color:var(--muted)}.work-list{display:grid;gap:64px}.work-figure button{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}.work-figure img{display:block;width:100%;height:auto}.work-figure figcaption{display:flex;gap:20px;font-size:12px;margin-top:16px;color:var(--muted)}.works-footer{border-top:1px solid var(--line);margin-top:90px;padding-top:40px;display:flex;align-items:center;justify-content:space-between}.works-footer p{font:24px "Songti SC",serif}.work-pending{min-height:36svh;border-block:1px solid var(--line);display:grid;align-content:center;justify-items:center;gap:20px}.work-pending h2{font:28px "Songti SC",serif}.work-pending p{font-size:13px;color:var(--muted);line-height:1.8;max-width:500px;text-align:center}.work-pending span{font:52px var(--serif);color:#8a7494}.works-scene:focus{outline:0}#lightbox{position:fixed;inset:0;max-width:100vw;max-height:100svh;width:100vw;height:100svh;padding:60px 75px;background:#eef0f2f7;border:0;color:var(--ink)}#lightbox::backdrop{background:#eef0f2e8}#lightbox[open]{display:grid;place-items:center}#lightbox figure{max-width:100%;height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;gap:15px}#lightbox img{max-width:100%;max-height:100%;object-fit:contain}#lightbox figcaption{font-size:12px;text-align:center}#lightbox>button{position:absolute;background:var(--paper);border:1px solid var(--line);width:44px;height:44px;border-radius:50%;font-size:21px}.lightbox-close{right:30px;top:25px}.lightbox-prev{left:20px;top:48%}.lightbox-next{right:20px;top:48%}.load-error{position:fixed;z-index:50;bottom:65px;left:50%;transform:translateX(-50%);padding:12px 24px;background:#f8e2eb;font-size:13px}
@media(min-width:821px) and (max-height:740px){.lab-heading{top:88px}.lab-heading h1{font-size:24px}.lab-stage{height:76svh;width:min(1000px,96vw);margin-top:62px}.potion{width:115px}.potion-media{left:15%;top:2%}.potion-brand{right:15%;top:2%}.potion-graphic{left:20%;bottom:1%}.potion-events{right:18%;bottom:0}.bottle-caption{margin-top:8px}.bottle-caption b{font-size:13px}.gate-caption{bottom:10%}.spellbook{min-height:330px}.book-page{padding:22px 28px 36px}.book-scene>h1{margin-bottom:20px;font-size:28px}.folio{margin-bottom:18px}.book-name{font-size:28px;margin-bottom:16px}.book-description{font-size:18px;margin-bottom:18px}.skill-list{gap:20px}.draft-note{margin-top:15px}.scene{padding-top:90px}}
@media(max-width:820px){.page-frame{inset:11px}.site-header{top:28px;left:28px;right:28px}.identity{gap:12px}.identity>span{font-size:20px}.identity b{padding-left:12px}.header-right{gap:20px}.header-right>span{display:none}.site-footer{left:28px;right:28px;bottom:27px;font-size:8px}.site-footer>span:first-child{max-width:150px}.scene{padding:90px 24px 70px}.gate-art{width:150vw;transform:translate(10%,-4%)}.gate-caption{bottom:18%}.rope-prompt{font-size:11px;left:95%}.spellbook{width:90vw;min-height:350px}.book-page{padding:24px 16px 38px}.book-scene>h1{font-size:27px;margin-bottom:30px}.folio{font-size:8px;margin-bottom:22px}.book-name{font-size:27px}.book-description{font-size:17px}.book-bio{font-size:11px}.skill-list{font-size:11px;gap:23px}.skill-list>span{gap:8px}.book-seal{font-size:11px;gap:5px}.book-seal>span{font-size:21px}.page-number{width:calc(100% - 32px)}.lab-heading{top:100px}.lab-heading h1{font-size:25px}.lab-stage{width:94vw;height:68svh;margin-top:70px}.cauldron{height:70%;top:52%}.potion{width:105px}.potion-media{left:2%;top:5%}.potion-brand{right:2%;top:5%}.potion-graphic{left:6%;bottom:3%}.potion-events{right:5%;bottom:2%}.bottle-caption{gap:6px;margin-top:9px}.bottle-caption b{font-size:13px}.bottle-caption small{font-size:8px}.back-to-book{left:28px;bottom:10%}.lab-annotation{bottom:0;font-size:10px}.works-scene{width:86%;padding-top:105px}.works-toolbar{margin-bottom:40px}.works-heading h1{font-size:37px}.works-heading>p:last-child{font-size:13px}.work-list{gap:38px}.works-footer{display:grid;gap:20px}.works-footer p{font-size:22px}.work-figure figcaption{font-size:11px;gap:12px}#lightbox{padding:80px 22px}.lightbox-prev{left:20px;top:auto;bottom:20px}.lightbox-next{right:20px;top:auto;bottom:20px}}
@media(max-height:530px) and (orientation:landscape){.site-header{top:27px}.site-footer{bottom:25px}.scene{padding:70px 30px 50px}.gate-art{width:112svh}.gate-caption{bottom:11%;font-size:10px}.gate-caption p{margin-bottom:6px;font-size:9px}.gate-caption>span{font-size:10px}.lab-heading{top:75px}.lab-heading h1{font-size:20px;margin-top:6px}.lab-stage{height:70svh;margin-top:35px}.potion{width:85px}.cauldron{height:95%}.lab-annotation{font-size:10px}.book-scene>.scene-eyebrow,.draft-note{display:none}.book-scene>h1{font-size:22px;margin-bottom:14px}.spellbook{min-height:260px;width:650px;max-width:85vw}.book-page{padding:16px 25px 28px}.folio{margin-bottom:12px}.book-name{font-size:23px;margin-bottom:8px}.book-description{font-size:16px;margin-bottom:12px}.book-bio{font-size:10px;line-height:1.5}.skill-list{gap:12px;font-size:11px}.book-seal{padding-top:15px}.page-number{bottom:10px}}
.lab-stage{isolation:auto}.potion,#spellLayer{mix-blend-mode:multiply}
.book-footer{width:min(820px,78vw);display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px}
.book-footer .quiet-button{min-height:44px;flex-shrink:0}
.book-footer .draft-note{margin:0;text-align:right}
@media(max-width:820px){.book-footer{width:90vw;gap:12px}.book-footer .draft-note{font-size:9px}}
@media(max-height:530px) and (orientation:landscape){.book-footer{position:absolute;top:70px;left:52px;margin:0;width:auto}.book-footer .draft-note{display:none}}
.gate-bell{clip-path:inset(59.2% 31.3% 16% 60.2%);transform-origin:64% 59.2%}
.gate-cord{clip-path:inset(67.2% 31.3% 16% 60.2%);transform-origin:64% 67.2%;visibility:hidden}
.gate-art.is-pulling .gate-bell{transform:none;clip-path:inset(59.2% 31.3% 32.6% 60.2%)}
.gate-art.is-pulling .gate-cord{visibility:visible;transform:scaleY(var(--rope-stretch,1))}
.gate-art.is-ringing .gate-bell{animation-duration:1.3s}
.gate-art.is-ringing .gate-hat{animation-duration:.7s;animation-delay:.45s}
.spell-actor.is-dropper{clip-path:polygon(33% 0,67% 0,67% 20%,57% 22%,55% 82%,50% 90%,45% 82%,43% 22%,33% 20%)}
.potion-events.is-extracting .bottle-float img{clip-path:url(#bottleWithoutDropper)}
@media(max-height:530px) and (orientation:landscape){.potion-media{left:2%;top:20%;bottom:auto}.potion-graphic{left:20%;top:23%;bottom:auto}.potion-brand{right:20%;top:20%;bottom:auto}.potion-events{right:2%;top:23%;bottom:auto}.bottle-caption{margin-top:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}.bottle-float{animation:none}.gate-art.is-ringing .gate-bell{animation-duration:.2s}.gate-art.is-ringing .gate-hat{animation-duration:.2s;animation-delay:0s}.cauldron.is-brewing .brewing-ripples i{animation:none}.spellbook{transition:none}}
