@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Noto+Serif+SC:wght@400;500;600&display=swap');
:root{--gold:#ba9c66;--paper:#cfb889;--ink:#372e24;--serif:'Noto Serif SC','Songti SC','STSong',serif;--latin:'Cormorant Garamond',Georgia,serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#111411;color:#d6c9ae}body{font-family:var(--serif);overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button:focus-visible,a:focus-visible{outline:1px solid var(--gold);outline-offset:7px}button{cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-decoration:none}.desk{position:fixed;inset:0;background:radial-gradient(ellipse at 49% 48%,#4e4431 0,#282a23 45%,#10140f 90%);z-index:0}.desk:after{content:'';position:absolute;inset:0;background:url('./assets/writing-desk.png') center/cover no-repeat;opacity:.75}.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 25%,#090e0bc7 100%)}.masthead{position:relative;z-index:5;height:114px;display:flex;align-items:center;justify-content:space-between;padding:0 4.5%;color:#c6b58f}.brand{display:flex;gap:14px;align-items:center;font-family:var(--latin);font-size:19px;letter-spacing:3px}.brand-mark{font-size:42px;line-height:1}.brand small{display:block;font:8px var(--serif);letter-spacing:2px;margin-top:6px;opacity:.65}.top-note{font-family:var(--latin);font-size:11px;letter-spacing:3px;opacity:.63;margin-right:90px}.tiny-star{padding-right:14px}.utility{background:none;border:0;display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:1.5px;opacity:.65;padding:10px}.utility:hover{opacity:1}.utility span:first-child{font-size:16px}#experience{position:relative;z-index:2;display:flex;align-items:center;flex-direction:column;padding:0 24px}.chapter-label{display:flex;align-items:center;gap:17px;font:10px var(--latin);letter-spacing:3px;color:#b2a17e;margin:1px 0 27px}.chapter-label span{width:30px;height:1px;background:#8f7b4b77}.book-wrap{width:min(1000px,86vw);perspective:1500px;position:relative}.book{display:flex;position:relative;aspect-ratio:1.7;transform:rotate(-1deg);border:6px solid #39291e;border-radius:8px 11px 12px 8px;box-shadow:0 2px 0 #b69c6e,0 6px 0 #3a2a1d,0 9px 0 #b19b73,0 14px 0 #36271d,0 35px 70px #000c,20px 20px 80px #0008,inset 0 0 0 5px #251e17;isolation:isolate}.page{width:50%;position:relative;color:var(--ink);background-color:#d1ba8e;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%2363401f' opacity='.19' filter='url(%23n)' d='M0 0h220v220H0z'/%3E%3C/svg%3E");}.page:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 30% 40%,#f5e4b447,transparent 70%),radial-gradient(ellipse at 95% 5%,#60471a44,transparent 35%),radial-gradient(ellipse at 0 100%,#5c3d1e55,transparent 33%);box-shadow:inset 0 0 35px #6b4c1b77}.page-left{border-radius:3px 0 0 5px;text-align:center;background-color:#c8ae7c;background-image:linear-gradient(90deg,#0000 70%,#4b32113b 94%,#30200f7a),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%2363401f' opacity='.2' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.page-right{border-radius:0 5px 6px 0;background-image:linear-gradient(90deg,#62401955,transparent 12%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%2363401f' opacity='.18' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.binding{position:absolute;top:0;bottom:0;width:18px;left:calc(50% - 9px);background:linear-gradient(90deg,#1d120700,#29190c77,#8c693644,#2e1b0b88,#0000);pointer-events:none}.ribbon{position:absolute;z-index:-1;left:47%;top:96%;width:24px;height:65px;background:linear-gradient(90deg,#3b1b18,#78352d 50%,#341713);clip-path:polygon(0 0,100% 0,100% 100%,50% 83%,0 100%);transform:rotate(4deg);filter:drop-shadow(3px 5px 2px #0006)}.left-top{position:absolute;top:9%;width:100%;font:9px var(--latin);letter-spacing:4px;opacity:.65}.left-top span{padding:0 16px;font-size:11px}.celestial{width:43%;margin:15% auto 1%;color:#674d2a;opacity:.65}.celestial svg{width:100%;display:block}.book-title{font:italic clamp(22px,2.8vw,35px)/1.08 var(--latin);color:#493b28;letter-spacing:-.5px}.book-title p{margin:2px}.left-divider{font-size:22px;color:#84683d;margin:16px auto 12px;display:flex;align-items:center;gap:12px;justify-content:center}.left-divider:before,.left-divider:after{content:'';width:35px;height:1px;background:#8d704866}.left-caption{font-size:11px;line-height:2.2;letter-spacing:3px;margin:0;opacity:.7}.left-bottom{position:absolute;bottom:10%;width:100%;font:8px var(--latin);letter-spacing:2.5px;opacity:.6}.folio{position:absolute;bottom:4%;left:0;width:100%;font:9px var(--latin);letter-spacing:1px;text-align:center;opacity:.55}.date-line{position:absolute;top:8.7%;left:13%;right:11%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;opacity:.65}.date-line span{font-size:17px;line-height:10px}.diary{position:absolute;inset:19% 10% 12% 14%;}.salutation{font-size:11px;letter-spacing:2px;margin:0 0 21px;opacity:.8}h1{font-weight:500;font-size:clamp(19px,2.5vw,30px);line-height:1.7;letter-spacing:2px;margin:0 0 22px}.body-copy{font-size:12px;line-height:2.3;letter-spacing:1px;margin:0 0 23px;opacity:.8}.question{font-size:13px;letter-spacing:1.5px;margin:0 0 17px}.choices{display:flex;align-items:flex-start;gap:24px;margin-left:-7px}.choice{position:relative;background:none;border:0;color:#332b24;width:110px;height:78px;font:italic 40px var(--latin);line-height:53px;padding:0;transition:color .2s}.choice:hover{color:#74412b}.choice small{display:block;font:8px var(--serif);letter-spacing:3px;opacity:.5;line-height:15px}.choice>svg{position:absolute;inset:-4px -10px 0;width:130px;height:74px;overflow:visible}.choice>svg path{fill:none;stroke:#3e2b20;stroke-width:2;stroke-linecap:round;stroke-dasharray:350;stroke-dashoffset:350}.choice-separator{opacity:.25;margin-top:15px;font:24px var(--latin)}.paper-note{position:absolute;bottom:9.5%;left:14%;font-size:8px;letter-spacing:1.7px;opacity:.46}.corner{position:absolute;width:25px;height:25px;opacity:.35;border-color:#826236}.corner-tl{left:6%;top:5%;border-top:1px solid;border-left:1px solid}.corner-bl{left:6%;bottom:5%;border-bottom:1px solid;border-left:1px solid}.corner-tr{right:6%;top:5%;border-top:1px solid;border-right:1px solid}.corner-br{right:6%;bottom:5%;border-bottom:1px solid;border-right:1px solid}.under-book{display:flex;gap:20px;align-items:center;margin:44px 0 15px;color:#b6a27d}.under-book p{font-size:10px;letter-spacing:3px;opacity:.65}.fine-line{width:45px;height:1px;background:#ac926044}footer{position:relative;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:12px 4.5% 22px;color:#a5977d}.footer-left{font:8px var(--latin);letter-spacing:2px;flex:1}.footer-left span{padding:0 14px}.footer-right{font-size:8px;letter-spacing:2px;text-align:right;flex:1;opacity:.65}footer .utility{font-size:9px}footer .utility span{font-size:9px}.reveal{opacity:0;filter:blur(4px);transform:translateY(3px)}.reveal.visible{animation:ink-appear 1.5s ease forwards}.ink-text.dissolving{animation:ink-dissolve 1.5s ease-in forwards}.reply{position:absolute;inset:7% 0 0;opacity:0;pointer-events:none}.reply.show{animation:ink-appear 1.8s forwards}.reply .reply-greeting{font:italic 42px var(--latin);margin:0 0 25px}.reply h2{font-size:24px;font-weight:500;line-height:1.9;letter-spacing:2px;margin:0 0 22px}.reply p{font-size:12px;line-height:2.5;letter-spacing:1.5px}.reply .signature{font:italic 23px var(--latin);text-align:right;margin-top:35px}.ink-bloom{position:absolute;left:50%;top:65%;width:10px;height:10px;border-radius:46% 54% 62% 38%;background:#292720;opacity:0;pointer-events:none;filter:blur(6px)}.ink-bloom.bloom{animation:bloom 2s ease-out forwards}.transition{position:fixed;z-index:20;inset:0;background:#0d1713;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:45px;opacity:0;visibility:hidden;transition:opacity 1.3s,visibility 1.3s;pointer-events:none}.transition.active{opacity:1;visibility:visible}.transition span{font-size:12px;letter-spacing:5px;color:#bfa779}.portal-ring{width:110px;height:110px;border:1px solid #ab945640;border-radius:50%;box-shadow:0 0 60px #be8f2922,inset 0 0 40px #be8f2911;position:relative;animation:orbit 6s linear infinite}.portal-ring:before{content:'✦';position:absolute;inset:18px;border:1px solid #b2975d77;transform:rotate(45deg);color:#c3a369;font:55px var(--latin);text-align:center}.world{position:relative;z-index:3;max-width:1000px;margin:0 auto;text-align:center;min-height:650px;padding:15px 25px 60px}.world-symbol{font-size:70px;color:#b99a61}.eyebrow{font:10px var(--latin);letter-spacing:4px;color:#b69c6a}.world h2{font-size:40px;line-height:1.7;font-weight:400;letter-spacing:5px;margin:25px 0 20px}.world h2 em{font-style:normal;color:#d3b77d}.world-intro{font-size:12px;line-height:2.4;letter-spacing:2px;color:#b4ac96}.destinations{display:grid;grid-template-columns:repeat(3,1fr);margin:50px auto 25px;border-top:1px solid #b29a5e33;border-bottom:1px solid #b29a5e33}.destinations button{text-align:left;position:relative;border:0;border-right:1px solid #b29a5e33;background:#151c1766;padding:25px 28px 30px;transition:background .4s}.destinations button:last-child{border-right:0}.destinations button:hover{background:#82734922}.room-no{font:10px var(--latin);letter-spacing:2px;color:#a28e60}.room-icon{display:block;font:36px var(--latin);margin:18px 0;color:#bd9d62}.destinations strong{display:block;font-size:19px;font-weight:400;letter-spacing:3px}.destinations small{display:block;font-size:10px;letter-spacing:2px;color:#9e9d88;margin-top:12px}.room-arrow{position:absolute;right:25px;bottom:31px;font-size:18px;color:#b09a69}.world-footnote{font-size:9px;letter-spacing:2px;opacity:.5}.world.entering{animation:world-appear 1.5s forwards}dialog{color:#d3c4a4;background:#18201b;border:1px solid #8e794b66;padding:55px;width:min(500px,90vw);box-shadow:0 30px 100px #0009}dialog::backdrop{background:#060c09bb;backdrop-filter:blur(8px)}dialog h3{font-size:25px;font-weight:400;letter-spacing:3px}dialog p{font-size:12px;line-height:2.5;color:#b4ad98}#close-dialog{position:absolute;right:16px;top:12px;font-size:25px;background:none;border:0}.dialog-back{background:none;border:0;border-bottom:1px solid #8e794b66;padding:15px 0;font-size:11px;letter-spacing:2px}#quill{position:fixed;z-index:40;width:60px;height:104px;pointer-events:none;left:0;top:0;transform:translate(-100px,-200px);filter:drop-shadow(4px 7px 4px #0006);transform-origin:7px 100px}#quill svg{width:100%;height:100%}.mote{position:fixed;width:2px;height:2px;background:#f0ce7a;border-radius:50%;box-shadow:0 0 6px #f6ca68;opacity:0;animation:float-mote var(--duration) linear infinite;animation-delay:var(--delay);pointer-events:none}#motes{position:fixed;inset:0;z-index:3;pointer-events:none}body.pen-cursor,body.pen-cursor button,body.pen-cursor a{cursor:none}[hidden]{display:none!important}@keyframes ink-appear{0%{opacity:0;filter:blur(5px);transform:translateY(3px)}60%{opacity:.75;filter:blur(.7px)}100%{opacity:1;filter:blur(0);transform:translateY(0)}}@keyframes ink-dissolve{0%{opacity:1;filter:blur(0)}60%{opacity:.35;filter:blur(3px)}100%{opacity:0;filter:blur(10px);transform:scale(1.015)}}@keyframes draw-circle{to{stroke-dashoffset:0}}@keyframes bloom{0%{opacity:.2;transform:scale(1)}60%{opacity:.13}100%{opacity:0;transform:scale(60) rotate(60deg)}}@keyframes float-mote{0%{transform:translate(0,40px);opacity:0}30%{opacity:.4}85%{opacity:.15}100%{transform:translate(45px,-150px);opacity:0}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes world-appear{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){.masthead{height:140px}.book-wrap{width:min(1100px,78vw)}.salutation{font-size:13px}.body-copy{font-size:14px}.question{font-size:15px}.choices{margin-top:25px}.left-caption{font-size:13px}.under-book{margin-top:55px}}
@media(max-width:1000px){.top-note{display:none}.book-wrap{width:92vw}.masthead{height:100px}.diary{inset:17% 8% 10% 12%}.salutation{margin-bottom:16px}h1{margin-bottom:14px}.body-copy{font-size:11px;margin-bottom:15px}.question{font-size:12px}.choices{gap:10px}.choice{font-size:35px;width:95px}.choice>svg{width:115px}.left-divider{margin:12px auto 8px}.left-caption{font-size:10px}.reply h2{font-size:21px}.reply p{font-size:11px}.reply .signature{margin-top:20px}}
@media(max-width:650px){.masthead{height:90px;padding:0 6%}.brand{font-size:15px;letter-spacing:2px;gap:9px}.brand-mark{font-size:32px}.brand small{font-size:6px}.utility{font-size:8px;gap:5px}.chapter-label{margin:0 0 23px;font-size:9px}.book-wrap{width:min(440px,89vw)}.book{aspect-ratio:.65;transform:rotate(-1deg);border-width:5px}.page-left{display:none}.page-right{width:100%;border-radius:3px;background-image:linear-gradient(90deg,#62401944,transparent 9%)}.binding{left:-2px;width:10px}.ribbon{left:80%;height:45px;width:18px}.diary{inset:20% 10% 10% 12%}.date-line{top:10%;left:12%}.salutation{font-size:10px;margin-bottom:25px}h1{font-size:26px;margin-bottom:22px}.body-copy{font-size:12px;margin-bottom:26px}.question{font-size:13px;margin-bottom:18px}.choices{gap:20px}.choice{width:105px;font-size:41px}.choice>svg{width:125px}.paper-note{font-size:8px;bottom:10%;left:12%}.folio{bottom:5%}.under-book{margin-top:37px;gap:13px}.under-book p{font-size:9px;letter-spacing:2px}.fine-line{width:20px}.footer-left{display:none}.footer-right{font-size:7px}footer{padding:5px 6% 20px}.reply h2{font-size:25px}.reply p{font-size:12px}.reply .signature{margin-top:35px}.world{padding-top:0;min-height:600px}.world-symbol{font-size:50px}.world h2{font-size:29px}.world-intro{font-size:10px}.destinations{margin-top:30px;grid-template-columns:1fr}.destinations button{padding:20px 22px 22px 75px;border-right:0;border-bottom:1px solid #b29a5e33}.destinations button:last-child{border-bottom:0}.room-no{position:absolute;left:20px;top:15px}.room-icon{position:absolute;left:20px;top:21px;font-size:27px}.destinations strong{font-size:17px}.destinations small{font-size:9px}.room-arrow{bottom:30px}.world h2{margin:15px 0}.desk:after{background-position:30% center}dialog{padding:45px 30px}}
@media(pointer:coarse){#quill{display:none!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}.mote{display:none}.reveal.visible{opacity:1;filter:none;transform:none}.reply.show{opacity:1}.ink-text.dissolving{opacity:0}.world.entering{opacity:1}}

/* Every notebook word is now ink geometry, rather than typeset text. */
.ink-defs{position:absolute;width:0;height:0;pointer-events:none}.writing-controls{display:flex;gap:18px;align-items:center;margin-left:auto;margin-right:22px;font:10px var(--serif);color:#c6b58f}.language-switch{display:flex;align-items:center;gap:8px}.language-switch button{padding:5px 2px;border:0;background:none;opacity:.4;font:12px var(--latin)}.language-switch button[aria-pressed=true]{opacity:1;border-bottom:1px solid #b69c6a}.language-switch span{opacity:.25}.speed-label{font-size:9px;letter-spacing:1px;white-space:nowrap}.speed-label select{background:#192019;color:#c6b58f;border:1px solid #b69c6a44;padding:4px;font:11px var(--latin);margin-left:4px}.writing-controls .utility{font-size:9px;padding:5px}.writing-controls .utility:disabled{opacity:.2}.top-note{margin-right:0;margin-left:35px}.handwritten{font-style:normal!important;letter-spacing:0!important}.written-word{display:inline-block;white-space:nowrap}.written-glyph{display:inline-block;height:1.22em;width:1em;vertical-align:-.18em;overflow:visible;transform:rotate(var(--tilt));color:inherit}.written-glyph.hanzi{height:1.04em;vertical-align:-.12em;margin-right:.03em}.written-glyph.latin{width:.67em;margin-right:-.08em}.written-glyph.narrow{width:.4em;margin-right:-.07em}.written-glyph.wide{width:.84em}.handwritten .written-glyph path{filter:url(#ink-grain)}.written-glyph.hanzi path{opacity:.94}.reveal.visible{animation:none;opacity:1;filter:none;transform:none}.salutation{font-size:15px;margin-bottom:18px}h1.handwritten{font-size:29px;line-height:1.65;letter-spacing:0}.body-copy{font-size:16px;line-height:1.9;letter-spacing:0}.question{font-size:17px;letter-spacing:0}.left-top{font-size:12px;letter-spacing:0}.book-title{font-size:29px;line-height:1.8}.left-caption{font-size:15px;line-height:1.9;letter-spacing:0}.left-bottom{font-size:12px;letter-spacing:0}.date-line{font-size:13px;display:block}.folio{font-size:12px}.paper-note{font-size:11px;letter-spacing:0;right:8%}.choice{width:125px;line-height:1.2;height:73px}.choice-word{display:block;font-size:30px;white-space:nowrap}.choice-word .written-glyph.hanzi{width:.9em}.choice small{display:none}.choice-separator{margin-top:6px}.choices{gap:7px}.choice>svg{width:142px;height:78px;left:-9px;top:-18px;filter:url(#ink-grain)}.choice>svg path{stroke-width:1.65;stroke:#352418;stroke-dasharray:350;stroke-dashoffset:350;filter:drop-shadow(.45px .3px .2px #3a261944)}.choice.selected:after{content:'';position:absolute;width:3px;height:2px;background:#332418b0;border-radius:50%;right:21%;top:1px;box-shadow:-76px 28px 0 -.5px #33241866,15px 32px 0 -1px #33241866}.reply .reply-greeting{font-size:29px;line-height:1.4;margin-bottom:22px}.reply h2{font-size:27px;line-height:1.8}.reply .reply-body{font-size:16px;line-height:1.9}.reply .signature{font-size:18px;line-height:1.6;margin-top:25px}.reply.show{animation:none;opacity:1;filter:none}#quill{width:140px;height:260px;transform-origin:68px 250px;filter:drop-shadow(9px 13px 7px #0007)}#quill img{width:100%;height:100%;object-fit:fill;display:block;pointer-events:none}body[data-language=en] .book-title{font-size:39px;line-height:1.1}body[data-language=en] h1{font-size:34px;line-height:1.3}body[data-language=en] .body-copy{font-size:20px;line-height:1.55}body[data-language=en] .question{font-size:21px}body[data-language=en] .salutation{font-size:18px}body[data-language=en] .choice-word{font-size:43px}body[data-language=en] .choice>svg{top:-8px}body[data-language=en] .reply h2{font-size:35px;line-height:1.2}body[data-language=en] .reply .reply-body{font-size:22px;line-height:1.5}
@media(max-width:1100px){.top-note{display:none}.writing-controls{gap:12px}.salutation{font-size:13px}h1.handwritten{font-size:26px}.body-copy{font-size:14px}.question{font-size:15px}.book-title{font-size:25px}.left-caption{font-size:13px}.choice-word{font-size:26px}.choice{width:112px}.choice>svg{width:128px}.reply .reply-body{font-size:14px}.reply h2{font-size:24px}.reply .reply-greeting{font-size:24px}.reply .signature{font-size:17px}.paper-note{font-size:9px}body[data-language=en] h1{font-size:29px}body[data-language=en] .body-copy{font-size:18px}body[data-language=en] .question{font-size:19px}}
@media(max-width:650px){.masthead{height:112px;align-items:flex-start;padding-top:22px;flex-wrap:wrap}.brand{font-size:13px}.masthead>#sound{margin-left:auto;font-size:7px}.writing-controls{position:absolute;left:6%;right:6%;bottom:6px;justify-content:center;margin:0;gap:24px}.writing-controls .utility{font-size:8px}.language-switch button{font-size:11px}.book{aspect-ratio:.6}.diary{inset:19% 9% 10% 11%}.salutation{font-size:14px;margin-bottom:24px}h1.handwritten{font-size:27px;margin-bottom:21px}.body-copy{font-size:15px;line-height:2;margin-bottom:24px}.question{font-size:16px;margin-bottom:25px}.choice-word{font-size:27px}.choices{gap:17px}.choice{width:112px}.choice>svg{width:128px;top:-15px}.paper-note{font-size:9px;bottom:9%;left:11%}.reply .reply-greeting{font-size:26px}.reply h2{font-size:26px}.reply .reply-body{font-size:15px;line-height:2}.reply .signature{font-size:19px}.date-line{font-size:12px}.folio{font-size:10px}body[data-language=en] h1{font-size:30px}body[data-language=en] .salutation{font-size:17px}body[data-language=en] .body-copy{font-size:19px}body[data-language=en] .question{font-size:19px}body[data-language=en] .reply h2{font-size:32px}body[data-language=en] .reply .reply-body{font-size:21px}.under-book{margin-top:30px}}

.left-top .written-word{padding:0}.celestial{width:40%;margin-top:14%}.book-title{line-height:1.35;font-size:28px}.left-divider{margin:13px auto 10px}.left-bottom{bottom:8%}.left-caption{font-size:14px}#quill{width:174px;transform-origin:82px 250px}.written-glyph.latin>path{stroke-width:1.9}body[data-language=en] h1{font-size:30px}body[data-language=en] .left-caption{font-size:16px}body[data-language=en] .left-bottom{font-size:14px}
@media(max-width:650px){body[data-language=en] h1{font-size:28px}.left-bottom{bottom:8%}}

/* Photographic book material replaces the graphic page stack and ribbon. */
.book{border:0;border-radius:0;box-shadow:none;background:none;isolation:isolate}
.book-material{position:absolute;z-index:0;left:-4.35%;top:-6%;width:108.7%;height:120.5%;object-fit:fill;pointer-events:none;user-select:none;filter:drop-shadow(1px 17px 15px #0009)}
.page,.page-left,.page-right{background:none;border-radius:0;z-index:1}
.page:before{content:none}.binding,.ribbon{display:none}
.page{color:#372a1e}.corner{opacity:.14}.celestial{opacity:.47;mix-blend-mode:multiply}.handwritten{mix-blend-mode:multiply}.left-divider{opacity:.65}.left-top{opacity:.6}.folio{opacity:.5}
.brand{font-family:var(--serif);font-size:22px;letter-spacing:5px}.brand small{font-size:8px;letter-spacing:1.5px}.top-note{font-family:var(--serif);font-size:9px;letter-spacing:2px}.chapter-label,.eyebrow{font-family:var(--serif);font-size:10px;letter-spacing:3px}.footer-left{font-family:var(--serif);font-size:8px;letter-spacing:1.5px}.writing-controls{gap:20px}
html,body,button,a,select,button:disabled{cursor:url('./assets/antique-arrow.svg') 4 2,auto}
body.pen-cursor{cursor:url('./assets/antique-arrow.svg') 4 2,auto}
body.pen-cursor button,body.pen-cursor a{cursor:url('./assets/antique-arrow.svg') 4 2,auto}
body.pen-cursor #book,body.pen-cursor #book *{cursor:none}
#quill{opacity:0;transition:opacity .1s}
@media(max-width:650px){.book{aspect-ratio:.6;border:0}.book-wrap{overflow:visible}.book-material{width:217.4%;left:-108.7%;top:-6%;height:120.5%;clip-path:inset(0 0 0 49.8%)}.brand{font-size:19px;letter-spacing:4px}.brand small{font-size:6px}.writing-controls{gap:30px}.chapter-label{font-size:9px}.page-right{width:100%;background:none}.under-book{margin-top:40px}}
@media(max-width:650px){.book{aspect-ratio:.58}.book-material{width:200%;left:-100%}body[data-language=en] .body-copy{font-size:17px;line-height:1.6;margin-bottom:20px}body[data-language=en] h1{font-size:26px}body[data-language=en] .question{font-size:18px;margin-bottom:20px}.paper-note{bottom:8%}}

/* Keep one consistent quill throughout the diary entrance. */
body.pen-cursor,body.pen-cursor *{cursor:none!important}

/* The ink and feather are driven together by the gesture animation. */
.choice>svg>path,.choice.selected>svg>path{opacity:0;animation:none;filter:none}
.choice.selected:after{display:none}
.choice>svg .ink-segment{animation:none!important;fill:none;stroke:#332619;stroke-linecap:round;stroke-linejoin:round;animation:none;filter:none}
.choice>svg .natural-ink{filter:drop-shadow(0 .3px .3px #3c28192b)}

.ink-line{display:block;min-height:1em;transform-origin:left center}
.left-top .ink-line{padding:0}

/* A full parchment scroll replaces the book on small screens. */
.paper-object{display:contents}
@media(max-width:650px){
  .masthead{height:96px}.writing-controls{bottom:4px}.writing-controls .utility{font-size:8px}
  #experience{padding:0 10px}.chapter-label{margin-bottom:16px}
  .book-wrap{width:min(440px,94vw)}
  .book{aspect-ratio:.55;transform:rotate(-.35deg)}
  .book-material{width:100%;height:100%;left:0;top:0;clip-path:none;object-fit:fill;filter:drop-shadow(1px 12px 12px #0008)}
  .page-right{width:100%}.page-right .corner,.page-right>.folio{display:none}
  .date-line{top:12%;left:12%;right:12%;font-size:12px}
  .diary{inset:20% 11% 14% 11%}
  .paper-note{left:12%;right:12%;bottom:12%;font-size:10px}
  .under-book{margin-top:18px;margin-bottom:8px}
  body[data-language=en] .body-copy{font-size:17px;line-height:1.65}
  body[data-language=en] .question{font-size:18px}
}
@media(max-width:650px){.date-line{top:16%}.paper-note{bottom:19%}}
@media(max-width:360px){.book{aspect-ratio:.5}body[data-language=en] h1{font-size:24px}body[data-language=en] .salutation{font-size:15px}body[data-language=en] .body-copy{font-size:16px}body[data-language=en] .question{font-size:17px}.diary{left:10%;right:10%}}

.music-credit{position:relative;z-index:2;margin:0 auto 25px;padding:0 20px;text-align:center;color:#9f947c;font-size:8px;line-height:1.9;letter-spacing:.5px;opacity:.7}.music-credit a:hover{color:#d2c19c}.room-header-actions{display:flex;align-items:center;gap:28px}#sound[aria-pressed=true]{color:#d8bd86}@media(max-width:650px){.room-header-actions{gap:14px}.room-header-actions #sound{font-size:8px}.music-credit{font-size:7px}}

/* The page becomes the doorway; the canvas covers the actual camera pull. */
html[data-scene="room"] #experience{display:none}
.transition{display:block;background:transparent;gap:0;opacity:0;visibility:hidden;transition:none;overflow:hidden;isolation:isolate}
.transition.active{opacity:1;visibility:visible;pointer-events:auto}
.transition canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.transition.revealing{opacity:0;transition:opacity .7s ease;pointer-events:none}
body.portal-travel{overflow:hidden}
body.portal-travel #experience{will-change:transform,filter}
body.portal-travel .masthead,body.portal-travel footer,body.portal-travel .music-credit,body.portal-travel .under-book,body.portal-travel #quill{opacity:0!important;transition:opacity .45s ease;pointer-events:none}
html[data-scene="room"] .writing-controls{visibility:hidden}
@media(prefers-reduced-motion:reduce){.transition.revealing{transition-duration:.18s!important}}
