:root{--paper:#fbf4e6;--paper-2:#f3e7d0;--ink:#3e2c20;--ink-soft:#85694f;--rust:#b8573a;--tape:#d6b680b8;--hand:"Long Cang", "Kaiti SC", "STKaiti", cursive;--body:"LXGW WenKai", "Kaiti SC", "STKaiti", serif;--scrib:"Caveat", "Bradley Hand", cursive}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;background:#efe0c6;margin:0;overflow:hidden}#app,#app canvas{display:block;position:fixed;inset:0}#app canvas{touch-action:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}.scribble{font-family:var(--scrib);color:var(--ink-soft);margin:0;font-size:22px}.rough-btn{letter-spacing:.2em;padding:12px 30px;font-size:18px;position:relative}.rough-btn:before{content:"";border:2px solid var(--ink);background:var(--paper);filter:url(#rough);border-radius:14px 10px 16px 9px;transition:background .3s,transform .3s;position:absolute;inset:0}.rough-btn span{position:relative}.rough-btn:hover:before{background:#f6dfb9;transform:rotate(-1deg)}.rough-btn.small{letter-spacing:.1em;padding:7px 16px;font-size:15px}.brand{z-index:6;flex-direction:column;display:flex;position:fixed;top:18px;left:24px}.brand-en{font-family:var(--scrib);font-size:30px;line-height:1}.brand-cn{font-family:var(--hand);color:var(--ink-soft);font-size:18px}.switch{color:var(--ink-soft);border-bottom:1px dashed;align-self:flex-start;margin-top:6px;font-size:13px;text-decoration:none}.switch:hover{color:var(--rust)}#intro,#finale{-webkit-backdrop-filter:blur(3px);z-index:20;background:#efe0c68c;place-items:center;transition:opacity 1s,visibility 1s;display:grid;position:fixed;inset:0}#intro.gone,#finale:not(.show){opacity:0;visibility:hidden}.intro-paper{text-align:center;width:min(460px,88vw);padding:44px 46px 40px;position:relative;transform:rotate(-1.2deg)}.intro-paper:before{content:"";background:var(--paper);filter:url(#rough);z-index:-1;border:1.5px solid #3e2c2080;position:absolute;inset:0;box-shadow:0 24px 50px -20px #50321473,6px 6px #3e2c2014}.intro-paper h1{font-family:var(--hand);white-space:nowrap;letter-spacing:.06em;margin:4px 0 14px;font-size:50px;font-weight:400}.lede{margin:0 0 20px;font-size:17px;line-height:1.9}.lede b{color:var(--rust);font-weight:400;font-family:var(--scrib);font-size:26px}.howto{text-align:left;color:var(--ink-soft);margin:0 auto 28px;padding:0;font-size:15px;line-height:2;list-style:none;display:table}.howto i{width:44px;color:var(--rust);font-style:normal;display:inline-block}.nav-arrow{z-index:5;opacity:0;pointer-events:none;filter:drop-shadow(0 2px 6px #fbf4e6e6);width:64px;height:64px;margin-top:-32px;transition:opacity .4s,transform .3s;position:fixed;top:50%}.nav-arrow svg{width:100%;height:100%}.nav-arrow path{fill:none;stroke:var(--paper);stroke-width:7px;stroke-linecap:round;stroke-linejoin:round}.nav-arrow svg path+path,.nav-arrow path{paint-order:stroke}.nav-arrow svg{overflow:visible}.nav-arrow svg path{stroke:var(--ink);stroke-width:3.2px}.nav-arrow.on{opacity:.85;pointer-events:auto}.nav-arrow.on:hover{opacity:1}#turn-left{left:22px}#turn-right{right:22px}#turn-left.on:hover{transform:translate(-4px)}#turn-right.on:hover{transform:translate(4px)}#go-back{flex-direction:column;align-items:center;height:auto;margin:0 0 0 -32px;display:flex;top:auto;bottom:22px;left:50%}#go-back svg{width:54px;height:40px}#go-back span{font-family:var(--hand);text-shadow:0 0 6px var(--paper);margin-top:-6px;font-size:18px}#go-back.on:hover{transform:translateY(3px)}#minimap{z-index:6;text-align:center;width:112px;transition:opacity .5s;position:fixed;bottom:22px;right:22px}#minimap svg{width:100%;overflow:visible}#minimap path,#minimap polyline{fill:none;stroke:var(--ink);stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round}#minimap .closed{fill:#3e2c2014;stroke-dasharray:3 3;stroke-width:1px}#minimap .cone{fill:#b8573a40;stroke:none}#minimap .you{fill:var(--rust);stroke:none}#view-name{font-family:var(--hand);color:var(--ink-soft);font-size:17px}#note{opacity:0;visibility:hidden;z-index:9;width:min(340px,86vw);padding:34px 34px 22px;transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.3,1.2),visibility .5s;position:fixed;top:50%;right:6vw;transform:translate(30px,-50%)rotate(2deg)}#note.show{opacity:1;visibility:visible;transform:translateY(-50%)rotate(-1.5deg)}.note-paper{background:repeating-linear-gradient(transparent 0 31px, #7896b42e 31px 32px), var(--paper);filter:url(#rough);background-position:0 14px;position:absolute;inset:0;box-shadow:0 26px 50px -22px #46280f8c,2px 3px #3e2c200f}.tape{background:var(--tape);filter:url(#rough-strong);mix-blend-mode:multiply;width:104px;height:30px;margin-left:-52px;position:absolute;top:-14px;left:50%;transform:rotate(-4deg)}.note-body{position:relative}.stamp{border:2px solid var(--rust);width:64px;height:64px;color:var(--rust);font-family:var(--scrib);opacity:.8;filter:url(#rough);border-radius:50%;place-items:center;font-size:19px;display:grid;position:absolute;top:-12px;right:-10px;transform:rotate(14deg)}#note-title{font-family:var(--hand);letter-spacing:.04em;margin:0 0 14px;font-size:42px;font-weight:400;line-height:1.1}#note-story{min-height:64px;margin:0 0 18px;font-size:18px;line-height:32px}#note.closed #note-story{color:var(--ink-soft)}.note-foot{color:var(--ink-soft);justify-content:space-between;align-items:center;font-size:14px;display:flex}#note-back{font-family:var(--hand);color:var(--ink);font-size:20px}#note-back:hover{color:var(--rust)}#note-found{font-family:var(--hand);color:var(--rust);font-size:18px}#journal-btn,#hint-btn{z-index:6;transition:opacity .5s;position:fixed;bottom:24px}#journal-btn{left:24px}#hint-btn{left:150px}#hint-btn.off{opacity:.55}#journal-btn b{font-family:var(--scrib);color:var(--rust);font-size:19px;font-weight:600}#journal-btn.bump:before{animation:.6s bump}@keyframes bump{40%{background:#f6d3a8;transform:scale(1.15)rotate(-3deg)}}#journal{z-index:15;opacity:0;visibility:hidden;background:#3e2c2040;place-items:center;transition:opacity .4s,visibility .4s;display:grid;position:fixed;inset:0}#journal.show{opacity:1;visibility:visible}.journal-paper{background:radial-gradient(circle at 20px 20px, #3e2c200f 1.2px, transparent 1.6px) 0 0 / 22px 22px, var(--paper);width:min(860px,92vw);max-height:84vh;padding:34px 40px 40px;position:relative;overflow-y:auto;transform:rotate(-.5deg);box-shadow:0 40px 80px -30px #28140599}.journal-head{margin-bottom:20px;position:relative}.journal-head h2{font-family:var(--hand);margin:0;font-size:40px;font-weight:400}#journal-close{font-size:34px;font-family:var(--scrib);color:var(--ink-soft);position:absolute;top:-14px;right:-10px}#journal-grid{grid-template-columns:repeat(auto-fill,minmax(124px,1fr));gap:26px 20px;display:grid}.polaroid{transform:rotate(var(--r,0deg));text-align:center;background:#fffdf8;padding:8px 8px 6px;transition:transform .25s;box-shadow:0 6px 14px -6px #3c230a73}.polaroid:hover{transform:rotate(0)scale(1.05)}.polaroid img,.polaroid .ph{aspect-ratio:1;object-fit:cover;background:var(--paper-2);width:100%;display:block}.polaroid .ph{font-family:var(--scrib);color:#3e2c2040;border:1.5px dashed #3e2c2040;place-items:center;font-size:40px;display:grid}.polaroid span{font-family:var(--hand);white-space:nowrap;text-overflow:ellipsis;margin-top:4px;font-size:19px;display:block;overflow:hidden}.polaroid.locked{cursor:default;opacity:.75}.polaroid.locked span{color:#3e2c2059}#tip{pointer-events:none;font-family:var(--hand);color:var(--ink);text-shadow:0 0 4px var(--paper), 0 0 10px var(--paper), 0 0 2px var(--paper);opacity:0;z-index:7;white-space:nowrap;font-size:22px;transition:opacity .2s;position:fixed;transform:translate(16px,-6px)rotate(-3deg)}#tip.show{opacity:1}#tip small{font-family:var(--scrib);color:var(--rust);margin-left:6px;font-size:18px}#toast{font-family:var(--hand);opacity:0;z-index:12;pointer-events:none;padding:8px 24px;font-size:24px;transition:opacity .4s,transform .5s;position:fixed;top:22px;left:50%;transform:translate(-50%,-20px)rotate(-1deg)}#toast:before{content:"";background:var(--paper);border:1.5px solid var(--ink);filter:url(#rough);z-index:-1;border-radius:10px;position:absolute;inset:0}#toast.show{opacity:1;transform:translate(-50%)rotate(-1deg)}body.intro #journal-btn,body.intro #hint-btn,body.intro #minimap,body.focused #minimap,body.focused #hint-btn{opacity:0;pointer-events:none}@media (width<=760px){#note{padding:28px 24px 16px;top:auto;bottom:14px;right:50%;transform:translate(50%,30px)rotate(1deg)}#note.show{transform:translate(50%)rotate(-1deg)}#note-title{font-size:32px}#note-story{min-height:0;font-size:16px;line-height:28px}#minimap{width:80px}.intro-paper{padding:34px 26px}.intro-paper h1{font-size:42px}body.focused #journal-btn{opacity:0;pointer-events:none}}#app canvas.lens{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Ccircle cx='13' cy='13' r='9' fill='rgba(251,244,230,0.35)' stroke='%233e2c20' stroke-width='2.4'/%3E%3Cpath d='M20 20 L30 30' stroke='%233e2c20' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E") 13 13,pointer}#app canvas{cursor:grab}#app canvas.grabbing{cursor:grabbing}#note-hint{font-family:var(--hand);color:var(--rust);margin:-10px 0 16px;font-size:18px}#note-hint:empty{display:none}
