:root{color-scheme:light;--ink:#354d49;--paper:#f5f6ee;--white:#fffef4;--gold:#d4a640;font-family:"Songti SC","Noto Serif CJK SC","STSong",serif;letter-spacing:0}
*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#afc5bc;color:var(--ink)}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,canvas:focus-visible{outline:2px solid #ae643e;outline-offset:5px}button:disabled{cursor:wait}button svg{pointer-events:none}#world{position:relative;height:100svh;min-height:320px;overflow:hidden}#sea{display:block;width:100%;height:100%;touch-action:none;outline:none;cursor:crosshair}.paper{position:absolute;inset:0;pointer-events:none;opacity:.065;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.45' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.hud{position:absolute;inset:calc(25px + env(safe-area-inset-top)) 34px auto;display:flex;align-items:center;justify-content:space-between;pointer-events:none;color:var(--white)}.tools,.chapters{display:flex;align-items:center;gap:15px;pointer-events:auto}.icon{position:relative;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:inherit;transition:background .2s,transform .2s;filter:drop-shadow(0 1px 3px #35504c55)}.icon:hover{background:#ffffff24;transform:translateY(-1px)}.icon svg{width:23px;height:23px;stroke-width:1.5}.compass{border:1px dashed #ffffffbf}.compass svg{width:18px;height:18px;transition:transform .8s}.chapters{gap:22px;position:absolute;left:50%;transform:translateX(-50%)}.chapter{position:relative;width:37px;height:37px;border:1px dashed #ffffff7a;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:4px;opacity:.55;transition:opacity 1s,background 1s}.chapter svg{width:19px;height:19px;stroke-width:1.4}.chapter.active{opacity:1;border-style:solid;background:#ffffff1c}.chapter.done{background:#fffdf0;color:#788e71;opacity:1}.chapter b{position:absolute;bottom:-9px;width:3px;height:3px;border-radius:50%;background:#ffffff42}.chapter b:nth-of-type(1){left:12px}.chapter b:nth-of-type(2){right:12px}.chapter b.found{background:var(--white)}#count{position:absolute;right:0;bottom:1px;font:10px Georgia,serif}[data-tip]::after{content:attr(data-tip);position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;background:#f6f6eee8;color:#354d49;padding:7px 10px;border-radius:3px;opacity:0;pointer-events:none;transition:opacity .2s}[data-tip]:hover::after,[data-tip]:focus-visible::after{opacity:1}
.opening{position:absolute;left:7%;bottom:16%;transition:opacity 1.2s,transform 1.2s;text-shadow:0 1px 14px #f7f4e67a}.opening.gone{opacity:0;transform:translateY(15px);pointer-events:none}.eyebrow{font-size:12px;margin:0 0 25px;line-height:1.8}.opening h1{font-weight:400;font-size:58px;line-height:1.35;margin:0 0 24px}.intro-line{font-size:14px;line-height:1.9;margin-bottom:25px}.text-button{display:inline-flex;align-items:center;gap:25px;min-height:44px;padding:9px 0;border:0;border-bottom:1px solid #52665b70;background:transparent;font-size:15px}.text-button svg{width:17px;height:17px;stroke-width:1.4;transition:transform .2s}.text-button:hover svg{transform:translateX(4px)}.shore-footer{position:absolute;inset:auto 40px calc(24px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:20px;font-size:12px;pointer-events:none;color:var(--white);text-shadow:0 1px 4px #35504c55}.coordinates{opacity:.7;font-size:10px}#warmth{margin-left:auto;display:flex;align-items:center;gap:9px}#warmth svg{height:15px;width:15px;stroke-width:1.2}.verse{position:absolute;left:50%;bottom:17%;transform:translate(-50%,8px);max-width:calc(100% - 64px);width:max-content;font-size:22px;line-height:1.8;text-align:center;color:#fffef5;text-shadow:0 1px 9px #3d686377,0 0 20px #3d686340;pointer-events:none;opacity:0;transition:opacity 1s,transform 1s}.verse.show{opacity:1;transform:translate(-50%,0)}.arrival{position:absolute;top:135px;left:50%;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;gap:12px;color:var(--white);pointer-events:none;opacity:0;transition:opacity 1s;text-shadow:0 1px 9px #44666055}.arrival.show{opacity:1}.arrival small{font:10px Georgia,serif}.arrival span{font-size:20px}.loading{position:absolute;inset:0;background:#e0e6da;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:25px;font-size:13px;transition:opacity .8s}.loading.ready{opacity:0;pointer-events:none}.loading-ring{width:29px;height:29px;border:1px dashed #738978;border-radius:50%;animation:turn 10s linear infinite}#retry{border:0;background:transparent;border-bottom:1px solid;padding:10px}dialog{position:fixed;inset:0;border:0;background:#f4f5ecf5;color:var(--ink);padding:55px 48px;max-width:calc(100vw - 36px);width:430px;max-height:calc(100svh - 36px);overflow:auto;box-shadow:0 15px 80px #29484124;border-radius:3px}dialog::backdrop{background:#42665a30;backdrop-filter:blur(5px)}dialog .close{position:absolute;right:13px;top:13px;filter:none}dialog h2{font-size:30px;font-weight:400;margin:12px 0 35px;line-height:1.5}dialog .quiet-button{display:block;background:none;border:0;padding:12px 0;font-size:12px;opacity:.6;margin-top:20px}.journal-foot{margin:32px 0 0;font-size:11px;opacity:.65}#pages{list-style:none;padding:0;margin:0;display:grid;gap:22px}#pages li{font-size:14px;line-height:1.8;display:flex;gap:15px}#pages li span{font:10px/2.5 Georgia,serif;opacity:.5}#pages li.missing{opacity:.25}.ending{text-align:center;width:460px;background:#f4f5ecf0}.ending h2{font-size:42px;margin:22px 0}.ending-question{font-size:14px;opacity:.65}.ending-line{font-size:14px;margin-bottom:25px}.ending .quiet-button{margin:18px auto 0}.ending .eyebrow{font-size:11px}
.chapters{filter:drop-shadow(0 1px 2px #354d4955)}
.ending{background:transparent;box-shadow:none;text-shadow:0 1px 12px #f3f5e6}
.ending::backdrop{background:#eff3e370;backdrop-filter:blur(1px)}
.world-actions{position:absolute;right:34px;bottom:80px;display:flex;gap:14px;color:#fffef1}.world-actions .icon{width:48px;height:48px;background:#486a593d;border:1px solid #fffef177}.world-actions .icon[aria-pressed="true"]{background:#f8f5e5d9;color:#4b6958}.world-actions [data-tip]::after{top:auto;bottom:calc(100% + 12px)}.beckon{animation:beckon 1.5s ease-in-out infinite}.mixing{margin:0 0 24px}.mixing label{display:flex;align-items:center;gap:10px;font-size:13px;margin:16px 0}.mixing label svg{width:17px;height:17px;stroke-width:1.3}.mixing input{margin-left:auto;width:60%;accent-color:#657e64;min-height:28px}.mixing p{font-size:11px;opacity:.6}.mixing button[hidden]{display:none}.discoveries{border-top:1px solid #6b80612b;margin-top:25px;padding-top:12px;font-size:12px;line-height:2.2}.map-dialog{width:750px;padding:35px}.map-dialog h2{margin-bottom:20px}#map-canvas{display:block;width:100%;aspect-ratio:3/2;touch-action:none;border:1px solid #6a816138;cursor:crosshair}#map-places{padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 25px;font-size:12px}.map-dialog .journal-foot{margin-top:15px}
@keyframes beckon{50%{box-shadow:0 0 0 7px #fffef122}}
@media(max-width:600px){.world-actions{right:20px;bottom:80px;gap:10px}.world-actions .icon{width:44px;height:44px}.map-dialog{padding:32px 20px}.map-dialog h2{font-size:24px}.mixing input{width:55%}.verse{bottom:23%;max-width:calc(100% - 70px)}}
@keyframes turn{to{transform:rotate(360deg)}}
@media(max-width:600px){.hud{inset:calc(17px + env(safe-area-inset-top)) 14px auto}.tools{gap:3px}.chapters{gap:10px}.chapter{width:30px;height:30px}.chapter svg{width:15px;height:15px}.chapter b:nth-of-type(1){left:9px}.chapter b:nth-of-type(2){right:9px}.icon{width:38px;height:40px}.icon svg{width:20px;height:20px}.compass{width:35px;height:35px;margin-left:3px}.opening{left:9%;bottom:20%}.opening h1{font-size:42px}.eyebrow{font-size:11px}.intro-line{font-size:12px;max-width:260px}.shore-footer{left:23px;right:23px;bottom:calc(20px + env(safe-area-inset-bottom));font-size:10px;gap:12px}.coordinates{display:none}.verse{font-size:18px;bottom:15%}.arrival{top:110px}dialog{padding:45px 30px}.ending h2{font-size:36px}.hud [data-tip]::after{display:none}}
@media(max-height:520px){.opening{bottom:17%}.opening h1{font-size:34px;line-height:1.2;margin-bottom:10px}.opening .eyebrow{margin-bottom:10px}.intro-line{margin:8px 0}.arrival{top:90px}.shore-footer{bottom:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:600px){.verse{bottom:24%;max-width:calc(100% - 70px)}}
.chapter b{display:none}.journey-guide{position:absolute;left:6%;bottom:85px;max-width:calc(100% - 260px);color:#294c44;pointer-events:none;text-shadow:0 1px 6px #f7f9ea}.journey-guide[hidden],#inspect[hidden]{display:none}.journey-guide p{font-size:23px;line-height:1.65;margin:0 0 9px;letter-spacing:0}.journey-guide small{display:block;font-size:12px;line-height:1.9;letter-spacing:0}.journey-guide.compact .walking-hint{display:none}.journey-guide.compact p{font-size:18px;opacity:.86}.journey-guide button{pointer-events:auto;font-size:15px;margin-top:12px;padding:10px 15px;background:#f5f6eccf;color:#294c44}.journey-guide.enter{animation:guide-arrive 1.8s ease both}.verse{bottom:240px;font-size:17px}#inspect-art{display:block;width:250px;max-width:100%;height:auto;margin:0 auto 20px}#inspect-copy{font-size:16px;line-height:1.9;max-width:32em}#map-canvas{cursor:default}.walking-hint{opacity:.7}#pages:empty::after{content:'路上还没有停下来。遇到小物件时，靠近看看。';font-size:15px;line-height:1.8}@keyframes guide-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.journey-guide{left:24px;right:24px;bottom:118px;max-width:none}.journey-guide p{font-size:18px;line-height:1.55}.journey-guide small{font-size:10px;line-height:1.7}.journey-guide.compact p{font-size:15px}.journey-guide button{font-size:13px;margin-top:8px;padding:8px 11px}.verse{bottom:275px;font-size:14px}.shore-footer #warmth{max-width:60%;text-align:right}.arrival{top:85px}}
@media(max-height:520px){.journey-guide{bottom:45px}.journey-guide p{font-size:18px}.walking-hint{display:none}.verse{bottom:180px}}
.hud,.shore-footer,.arrival,.verse{color:#294c44;text-shadow:0 1px 3px #f5f6ee,0 0 12px #f5f6eecc}
.hud .icon{background:#f5f6ee75;filter:none}.hud .compass,.chapter{border-color:#294c4480}.chapter.active{background:#f5f6eea0}.chapters{filter:none}
.journey-guide button:disabled{opacity:.6;cursor:default}
[hidden]{display:none!important}.skip-intro{z-index:2}
.opening{transition:opacity .45s,transform .45s}
.walking-hint{display:none}.journey-guide{bottom:140px;max-width:45%}.journey-guide p:empty,.journey-guide small:empty{display:none}.journey-guide p{font-size:19px}.journey-guide.compact p{font-size:16px}.verse{bottom:235px;font-size:18px;max-width:65%;line-height:1.8}.skip-intro{position:absolute;right:34px;bottom:85px;background:#f6f6eed9;padding:10px 16px;font-size:13px}
#world:not(.journey-started) .chapters,#world:not(.journey-started) .world-actions,#world:not(.journey-started) .hud .tools:last-child{display:none}.chapters{gap:12px}.chapter.done{background:#f5f6ee80;color:#53765e}.chapter.active{border:1px solid #4e7467;background:#f5f6eed0}
#map-canvas{aspect-ratio:20/7;height:auto}#map-places{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}#map-places button{width:100%;justify-content:center;font-size:13px;background:#d8e3d755;border-bottom:1px solid #7b947f40;padding:10px;min-height:44px}.map-dialog{width:850px}
#touch-pad{position:absolute;left:22px;bottom:73px;display:grid;grid-template-columns:42px 42px 42px;grid-template-rows:42px 42px;gap:3px;touch-action:none}#touch-pad button{display:grid;place-items:center;border:1px solid #f7f7edb0;border-radius:50%;background:#f5f6eebb;color:#355b50;touch-action:none;padding:0}#touch-pad button:active{background:#335a50;color:#f5f6ee}#touch-pad button svg{width:19px;height:19px;pointer-events:none}#touch-pad button:first-child{grid-column:2}#touch-pad button:nth-child(2){grid-row:2;grid-column:1}#touch-pad button:nth-child(3){grid-row:2;grid-column:2}#touch-pad button:nth-child(4){grid-row:2;grid-column:3}
@media(max-width:600px){.chapters{display:none}.journey-guide{left:24px;right:24px;bottom:188px;max-width:none}.journey-guide p{font-size:16px}.verse{font-size:16px;bottom:300px;max-width:calc(100% - 48px)}.skip-intro{right:20px;bottom:85px}.opening{bottom:20%}.opening h1{font-size:40px}.world-actions{bottom:84px}#map-places{grid-template-columns:1fr 1fr;gap:8px}#map-places button{font-size:12px}.map-dialog{padding:32px 18px}.map-dialog h2{font-size:25px}}
@media(max-height:520px){.journey-guide{bottom:72px;max-width:48%}.verse{bottom:165px;font-size:15px}.world-actions{bottom:45px}#touch-pad{bottom:48px}.opening h1{font-size:30px}.skip-intro{bottom:50px}}
#object-cue{position:absolute;z-index:3;transform:translateX(-50%);width:240px;text-align:center;color:#284d46;text-shadow:0 1px 5px #fffef0;pointer-events:none}
#object-name{display:block;font-size:15px;line-height:1.6;margin-bottom:4px}
#object-cue button{pointer-events:auto;min-height:42px;padding:7px 13px;font-size:13px;background:#f7f8efed;color:#31534a;border-bottom:1px solid #8fa89b;box-shadow:0 3px 12px #31534a12}
#object-cue:after{content:'';display:block;width:1px;height:15px;background:#577a6870;margin:4px auto 0}
.journey-guide .walking-hint{display:none!important}
.find-dialog{width:460px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);padding:28px 32px;overflow-y:auto;color:#304d46;background:#f4f5ed;letter-spacing:0}
.find-dialog .eyebrow{margin:0 0 4px;color:#768377;font-size:12px}
.find-dialog #inspect-art{display:block;width:300px;height:220px;max-width:100%;margin:0 auto 8px;object-fit:contain}
.find-dialog h2{font-size:23px;line-height:1.45;margin:8px 0 12px}
.find-dialog #inspect-copy{font-size:15px;line-height:1.8;margin:0 0 18px;min-height:54px}
#find-words{border-top:1px solid #acb8a977;padding-top:18px;margin-bottom:18px}
#find-quote{font-size:20px;line-height:1.65;margin:0 0 8px;color:#31574c}
#find-source{font-size:12px;color:#737f72;text-decoration:none;line-height:1.7}
#find-source[href]:hover{text-decoration:underline}
#find-decisions{display:flex;align-items:center;justify-content:space-between;gap:16px}
#find-decisions button{min-height:44px;margin:0}
#reveal-find,#keep-find{color:#31574c;border-bottom:1px solid #8fa89b;padding:8px 0;font-size:15px}
#pages li{padding:16px 0;border-bottom:1px solid #9fac9b55;line-height:1.7}
#pages li p{font-size:18px;margin:8px 0}#pages li small{display:block;font-size:12px;color:#68766a}#pages li button{margin:6px 0 0;padding:4px 0;font-size:12px}.journal-empty{font-size:15px;color:#68766a}
@media(max-width:600px){.find-dialog{padding:24px}.find-dialog #inspect-art{width:245px;height:180px}.find-dialog h2{font-size:21px}.find-dialog #inspect-copy{font-size:14px}#find-quote{font-size:18px}#object-name{font-size:14px}}
@media(max-height:600px){.find-dialog #inspect-art{height:115px;width:158px}.find-dialog{padding:20px 28px}.find-dialog #inspect-copy{min-height:0;margin-bottom:10px}#find-words{padding-top:10px;margin-bottom:10px}}
#sea{touch-action:none;cursor:crosshair}#sea:active{cursor:grabbing}
.find-dialog{isolation:isolate;width:530px;padding:22px 48px 36px;border:0;box-shadow:none;background:transparent;overflow-y:auto;text-align:center;filter:drop-shadow(0 12px 22px #35554b21)}
.find-dialog::backdrop{background:#57766c35;backdrop-filter:blur(3px)}
.find-dialog:before{content:'';position:absolute;z-index:-1;inset:195px 8px 5px;background:#f1f3e9;clip-path:polygon(1% 2%,18% 1%,29% 2%,48% 0,62% 2%,79% 1%,99% 3%,100% 26%,99% 46%,100% 67%,99% 98%,78% 99%,59% 98%,40% 100%,20% 99%,1% 97%,0 73%,1% 51%,0 29%)}
.find-dialog .eyebrow{color:#294f46;text-shadow:0 1px 4px #f7f9ed;font-size:12px;margin-top:6px}
.find-dialog .close{top:16px;right:18px;color:#31574c;background:#eef2e48c;border-radius:50%}
.find-dialog #inspect-art{width:340px;height:240px;margin:0 auto 4px;filter:drop-shadow(0 8px 8px #3d635222)}
.find-dialog h2{font-size:24px;font-weight:400;margin:12px 0 14px}
.find-dialog #inspect-copy{color:#6a7e70;font-size:14px;line-height:1.95;min-height:0;margin-bottom:22px}
.find-dialog #find-words{border:0;margin:0 0 22px;padding:14px 0 0;position:relative}
.find-dialog #find-words:before{content:'';position:absolute;top:0;left:42%;width:16%;height:1px;background:#a5b59d}
.find-dialog #find-quote{font-size:22px;line-height:1.85;margin:0 0 13px;color:#2e5348;text-wrap:pretty}
.find-dialog #find-source{font-size:11px;color:#8b9787}
.find-dialog #find-decisions{justify-content:center;gap:44px}
.find-dialog #keep-find,.find-dialog #reveal-find{font-size:14px;gap:9px;border-bottom-color:#9aac91}
.find-dialog #leave-find{font-size:13px;color:#72836f}
.find-dialog.unfolded #find-words{animation:shore-unfold .65s ease-out}
@keyframes shore-unfold{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
#object-cue button{background:#f2f5e8db;border:0;border-bottom:1px solid #90a78d75;box-shadow:none}
.map-dialog{width:830px;max-height:calc(100dvh - 32px);overflow:auto;padding:30px}
#map-canvas{width:100%;height:auto;aspect-ratio:47/39;max-height:460px;object-fit:contain}
#map-places{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 12px}
@media(max-width:600px){.find-dialog{padding:18px 30px 30px;width:380px}.find-dialog:before{inset:160px 0 3px}.find-dialog #inspect-art{width:275px;height:190px}.find-dialog h2{font-size:21px}.find-dialog #find-quote{font-size:19px}.find-dialog #find-decisions{gap:28px}.map-dialog{padding:25px 18px}#map-places{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-height:620px){.find-dialog{padding:14px 32px 24px}.find-dialog #inspect-art{width:180px;height:125px}.find-dialog:before{top:110px}.find-dialog h2{font-size:20px}.find-dialog #find-quote{font-size:18px}.find-dialog #inspect-copy{margin-bottom:10px}.find-dialog #find-words{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){.find-dialog.unfolded #find-words{animation:none}}
.opening{inset:0;z-index:5;text-align:center;color:#fbf7e9;text-shadow:0 2px 15px #244d4540;transform:none;transition:opacity .9s ease}
.opening.gone{transform:none;opacity:0}.title-copy{position:absolute;left:55%;top:17%;transform:translateX(-50%);width:760px;max-width:calc(100% - 40px)}
.opening h1{font-family:Baskerville,'Times New Roman',serif;font-size:100px;line-height:1.1;font-weight:400;letter-spacing:0;margin:0 0 18px}
.title-story{font-size:24px;margin:0 0 28px;line-height:1.5}.opening .intro-line{font-size:15px;margin:0 0 36px;max-width:none}
.title-start{display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:12px 3px;min-height:56px;min-width:166px;border:0;border-bottom:1px solid #f4f3e29c;border-radius:0;color:#fffbea;background:transparent;clip-path:none;font-family:'Songti SC','STSong','Noto Serif CJK SC',serif;font-weight:400;letter-spacing:0;font-size:19px;text-shadow:0 1px 7px #25483c66;transition:color .25s,border-color .25s}
.title-start:hover{background:transparent;color:#fff;border-color:#fff;transform:none}.title-start:focus-visible{outline:1px solid #faf6e6;outline-offset:7px}.title-start svg{width:29px;height:20px;stroke-width:1.25;transition:transform .3s}.title-start:hover svg{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){.title-start,.title-start svg{transition:none}.title-start:hover svg{transform:none}}
.title-secondary{display:block;margin:22px auto 0;border:0;border-bottom:1px solid #f5f5e7a1;background:transparent;color:inherit;padding:9px 4px;min-height:44px;font-size:14px}
.title-about,.title-sound{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom));color:#f9f5e8;width:48px;height:48px;background:#36594d45}.title-about{left:30px}.title-sound{right:30px}.title-about svg,.title-sound svg{width:27px;height:27px}.opening [data-tip]::after{top:auto;bottom:calc(100% + 8px)}
#title-freeze{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}
.opening h1{animation:title-arrive 1.8s ease-out both}
.opening .intro-line{animation:title-arrive 1.8s .25s ease-out both}
@keyframes title-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.find-dialog{width:420px;padding:28px 34px 26px;background:#f6f7f2;border:1px solid #afbbaf;border-radius:6px;filter:none;box-shadow:0 18px 70px #183e4433;font-family:'Songti SC','Noto Serif SC',STSong,serif}
.find-dialog:before{inset:8px;clip-path:none;background:none;border:1px solid #d9ded3;border-radius:2px;pointer-events:none}
.find-masthead{display:flex;justify-content:space-between;padding:0 24px 12px 0;border-bottom:1px solid #d3dbcf;font:11px Georgia,serif;color:#718375}
.find-dialog .close{top:17px;right:13px;background:transparent}
.find-dialog .eyebrow{margin:14px 0 0;color:#7a897d;text-shadow:none;font-size:11px}
.find-dialog #inspect-art{width:270px;height:180px;margin:4px auto 0;filter:none}
.find-dialog h2{font-size:21px;margin:8px 0 12px}
.find-dialog #inspect-copy{font-size:14px;line-height:1.9;margin-bottom:18px;color:#64796f}
.find-dialog #find-quote{font-size:18px;line-height:1.85;margin-bottom:12px;color:#36574e}
.find-dialog #find-words{padding-top:18px;margin-bottom:18px}
.find-dialog #find-decisions{gap:28px}
@media(max-width:600px){.find-dialog{width:380px;padding:24px 26px}.find-dialog:before{inset:7px}.find-dialog #inspect-art{width:240px;height:155px}.find-dialog h2{font-size:20px}.find-dialog #find-quote{font-size:17px}}
@media(max-height:620px){.find-dialog{padding:20px 28px}.find-dialog #inspect-art{height:105px;width:160px}.find-dialog:before{inset:7px}.find-dialog #inspect-copy{margin-bottom:12px}.find-dialog #find-quote{font-size:16px}}
@media(prefers-reduced-motion:reduce){.opening h1,.opening .intro-line{animation:none}}
#world:not(.journey-started)>.hud,#world:not(.journey-started)>.shore-footer{display:none}
#kept-art{position:fixed;z-index:8;left:50%;top:50%;width:80px;height:80px;pointer-events:none;transform:translate(-50%,-50%)}
#pages li{display:block}#pages .journal-read{display:block;border:0;border-bottom:1px solid #8a9e8766;padding:4px 0;color:#526d5f;background:transparent;font-size:14px;text-align:left;min-height:40px}#pages .journal-read:hover{color:#294f43}
#about-dialog p,#restart-dialog p{font-size:15px;line-height:1.9}#about-title{font-family:Georgia,serif;font-size:38px}#restart-dialog form{margin-top:12px}
@media(min-width:1700px){.opening h1{font-size:116px}.title-copy{width:900px;top:18%}.title-story{font-size:27px}}
@media(max-width:1000px){.title-copy{left:53%;width:650px}.opening h1{font-size:78px}.title-story{font-size:22px}}
@media(max-width:600px){.title-copy{left:50%;top:21%;max-width:calc(100% - 32px);width:360px}.opening h1{font-size:46px;margin-bottom:18px}.title-story{font-size:19px;margin-bottom:24px}.opening .intro-line{font-size:13px;margin-bottom:30px}.title-start{font-size:16px;min-height:52px;min-width:150px}.title-about{left:18px}.title-sound{right:18px}.title-secondary{font-size:13px}}
@media(max-width:360px){.opening h1{font-size:40px}.title-story{font-size:17px}}
.loading{background:#050706;color:#f3f2e5;transition:opacity 2.2s ease-in-out}
.loading-ring{border-color:#d6ddcf}
.loading.ready{transition-delay:.15s}
.journey-guide{color:#fffef4;text-shadow:0 1px 3px #243e35,0 2px 12px #243e35a6}
.journey-guide small{font-size:13px;opacity:1}
#object-cue{color:#fffef1;text-shadow:0 1px 3px #29483d,0 2px 9px #29483d}
#object-name{font-size:14px}
#object-cue button{padding:5px 8px;gap:12px;background:none;color:#fffef1;border:0;box-shadow:none;text-shadow:inherit;font-size:14px}
#object-cue button:hover{color:#fff}
#object-cue button:focus-visible{outline-color:#fffef1}
#object-cue kbd{display:inline-grid;place-items:center;width:23px;height:23px;border:1px solid #fffde6a8;border-radius:50%;font:11px Georgia,serif}
#object-cue:after{background:#fffde68c;height:12px}
.find-dialog{width:470px;min-height:680px;padding:32px 44px 30px;border:0;border-radius:0;background:#ede8dc url('assets/shore-postcard-v6.png') center/100% 100% no-repeat;box-shadow:0 15px 60px #19372b4d;color:#294c49}
.find-dialog:before{display:none}
.find-dialog::backdrop{background:#153e3945;backdrop-filter:blur(2px)}
.find-masthead{border:0;color:#36544e;font-size:10px;padding:0 20px 0 0;opacity:.7}
.find-dialog .close{top:21px;right:23px;color:#34544e}
.find-dialog .eyebrow{font-size:11px;color:#34544e;margin:13px 0 6px}
.find-dialog h2{font-size:28px;color:#f9f4df;text-shadow:0 1px 3px #496b6470;margin:2px 0 0;line-height:1.5}
.find-dialog #inspect-art{width:340px;height:240px;max-width:100%;margin:8px auto 8px;filter:drop-shadow(0 7px 5px #476e6330)}
.find-dialog #inspect-copy{font-size:14px;line-height:1.85;color:#3d5a51;min-height:52px;margin:10px 0 17px;text-wrap:pretty}
.find-dialog #find-words{padding-top:13px;margin-bottom:12px}
.find-dialog #find-quote{font-size:18px;line-height:1.8;color:#34544c}
.find-dialog #find-source{color:#6d7a69;font-size:10px}
.find-dialog #keep-find,.find-dialog #reveal-find{color:#34544c;font-size:15px;border-bottom-color:#73816d;min-height:44px}
.find-dialog #leave-find{color:#536b59;opacity:.85}
.find-dialog #find-decisions{gap:34px}
.find-dialog #find-guidance{font-size:12px;line-height:1.8;color:#53674f;margin:0 0 12px;text-wrap:pretty}
.find-dialog.first-discovery #inspect-copy{min-height:0;margin-bottom:10px}
.find-dialog.first-discovery #find-quote{font-size:22px;line-height:1.65}
.find-dialog.first-discovery.unfolded #inspect-title{animation:pearl-arrive 1s ease-out both}
@keyframes pearl-arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.find-dialog.first-discovery #find-quote{font-size:19px}}
@media(prefers-reduced-motion:reduce){.find-dialog.first-discovery.unfolded #inspect-title{animation:none}}
@media(max-width:600px){.find-dialog{width:380px;min-height:600px;padding:26px 29px}.find-dialog h2{font-size:24px}.find-dialog #inspect-art{width:280px;height:196px;margin:8px auto}.find-dialog #inspect-copy{font-size:13px;margin:10px 0 12px}.find-dialog #find-quote{font-size:16px}.find-dialog .close{right:16px;top:15px}.journey-guide small{font-size:12px}}
@media(max-height:680px){.find-dialog{min-height:0;padding-top:24px}.find-dialog #inspect-art{height:155px;width:235px}.find-dialog h2{font-size:23px}.find-dialog #find-quote{font-size:16px}}
@media(prefers-reduced-motion:reduce){.loading{transition:opacity .15s}.loading.ready{transition-delay:0}}
button:focus-visible,canvas:focus-visible{outline:1px solid #48685b;outline-offset:4px}
.find-dialog{width:480px;padding:30px 42px 32px;min-height:690px}
.find-dialog h2{font-family:'Kaiti SC',STKaiti,'Songti SC',serif;font-size:27px;font-weight:500;line-height:1.5;max-width:13em;margin:6px auto 0;text-wrap:balance}
.find-dialog #inspect-art{height:222px;width:320px;margin:12px auto 14px}
.find-story{max-width:330px;margin:0 auto;text-align:left}
.find-dialog #inspect-copy,.find-dialog.first-discovery #inspect-copy{font-size:14px;line-height:1.9;min-height:0;margin:0 0 18px;color:#536459;text-align:left;text-wrap:pretty}
.find-dialog #find-guidance{font-size:12px;line-height:1.8;margin:0 0 18px;color:#6a7563}
.find-dialog #find-words{padding:0;margin:22px 0 0;border:0}
.find-dialog #find-words:before{display:none}
.find-dialog #find-quote,.find-dialog.first-discovery #find-quote{font-size:21px;line-height:1.75;font-weight:500;text-align:left;text-wrap:balance;margin:0 0 14px;color:#2f5046}
.mirror-dialog{width:560px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);padding:32px 38px 28px;overflow:auto;background:#e5ece1;color:#355a51;border:1px solid #d2dcca;border-radius:4px;text-align:center;box-shadow:0 18px 70px #122d354d;font-family:'Kaiti SC','STKaiti','Songti SC',serif}
.mirror-dialog .eyebrow{font-size:11px;color:#657d70;margin:8px 0 14px;letter-spacing:0}
.mirror-dialog h2{font-size:28px;font-weight:500;margin:0 0 12px;letter-spacing:0}
#mirror-invitation{font-size:15px;line-height:1.8;margin:0;min-height:27px}
#mirror-touch{position:relative;display:block;width:100%;padding:0;border:0;background:none;color:#fff9e7;box-shadow:none}
#mirror-touch:disabled{cursor:default;opacity:1}
#mirror-touch:focus-visible{outline:1px solid #688f7d;outline-offset:0;border-radius:50%}
#mirror-art{display:block;width:100%;height:auto;aspect-ratio:720/500}
#mirror-touch-label{position:absolute;bottom:22%;left:0;right:0;font-size:14px;text-shadow:0 1px 5px #244a45;pointer-events:none}
#mirror-message{animation:mirror-words .8s ease both}
.mirror-observation{font-size:13px;color:#6b8076;margin:0 0 14px;line-height:1.8}
.mirror-quote{font-size:21px;line-height:1.85;margin:0 0 14px;text-wrap:balance}
.mirror-reassurance{font-size:14px;line-height:1.9;margin:0 0 22px;color:#5d756a}
#mirror-leave{font-size:14px;line-height:1.7;min-height:44px;white-space:normal;justify-content:center;margin:10px auto 0;color:#365d4d;border-bottom:1px solid #7b958655}
#pier-scene{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:32px 24px 7vh;background:linear-gradient(0deg,#173c42df,transparent 58%);color:#fff6de;text-align:center}
#pier-scene[hidden]{display:none}
body:has(#pier-scene:not([hidden])) :is(.hud,.world-actions,#touch-pad,#arrival,#warmth){visibility:hidden;pointer-events:none}
.pier-dialogue{width:min(700px,100%);min-height:148px;font-family:'Kaiti SC','STKaiti','Songti SC',serif}
#pier-speaker{font-size:13px;line-height:1.8;margin:0 0 16px;color:#e2ddbd}
#pier-line{font-size:28px;line-height:1.8;letter-spacing:0;text-wrap:balance;margin:0;text-shadow:0 2px 12px #173a3b}
#pier-scene[data-beat="2"] #pier-line{color:#ffdf91;font-size:32px}
#pier-next{min-height:44px;margin-top:20px;color:#fff6de;border-bottom:1px solid #fff6de70;font-size:14px;background:transparent}
#pier-next:focus-visible{outline:none;box-shadow:0 2px 0 #fff6de}
#pier-scene .pier-dialogue{position:absolute;top:max(60px,calc(50% - 325px));left:50%;transform:translateX(-50%);width:min(410px,calc(100% - 44px));min-height:0;padding:19px 25px;background:#eef1e7f5;border:1px solid #d8e0ce;border-radius:7px;box-shadow:0 6px 25px #233e3820;text-align:left;color:#355348}
#pier-scene .pier-dialogue:after{content:'';position:absolute;bottom:-9px;left:27%;width:16px;height:16px;background:#eef1e7;transform:rotate(45deg);border-bottom:1px solid #d8e0ce;border-right:1px solid #d8e0ce}
#pier-scene[data-beat="2"] .pier-dialogue:after{left:72%}
#pier-scene #pier-speaker{font:12px/1.5 'Songti SC',serif;color:#738475;margin:0 0 8px}
#pier-scene #pier-line,#pier-scene[data-beat="2"] #pier-line{font:21px/1.65 'Songti SC','STSong',serif;color:#355348;text-shadow:none;margin:0}
#pier-choices{display:flex;gap:28px;align-items:center;justify-content:center;flex-wrap:wrap}
#pier-choices[hidden],#pier-feed-tools[hidden],#pier-dawn[hidden],#pier-scene .pier-dialogue[hidden],#pier-plus[hidden]{display:none}
#pier-scene .text-button{min-height:44px;color:#fff6de;font:16px/1.5 'Songti SC',serif;gap:10px;background:none;border-bottom:1px solid #fff6de70}
#pier-feed-tools{display:flex;align-items:center;gap:20px;margin-bottom:22px}
#pier-feed-count{font-size:13px}#pier-leave{margin-top:22px;font-size:13px!important;opacity:.85}
#pier-plus{position:absolute;left:calc(50% + 66px);top:calc(50% - 145px);color:#ffe1a0;font-size:23px;text-shadow:0 1px 5px #47513b}
#pier-dawn{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
#pier-scene[data-mode="watch"]{background:transparent}
#pier-scene[data-mode="watch"] #pier-choices{position:absolute;left:28px;top:24px}
#pier-scene[data-mode="watch"] #pier-leave{position:absolute;right:28px;top:24px;margin:0}
@media(max-width:600px){#pier-scene[data-mode="watch"] #pier-choices{top:22px;left:0;right:0}#pier-scene[data-mode="watch"] #pier-leave{top:auto;bottom:24px;right:24px}}
#pier-scene[data-mode="watch"] #pier-choices,#pier-scene[data-mode="watch"] #pier-leave{color:#fffdf0;text-shadow:0 1px 7px #172f2a}
#pier-error{font-size:13px}
#pier-scene .text-button:focus-visible{outline:none;box-shadow:0 2px 0 #fff6de}
@media(max-width:600px){#pier-scene .pier-dialogue{top:90px;padding:16px 20px}#pier-scene #pier-line,#pier-scene[data-beat="2"] #pier-line{font-size:18px}#pier-choices{gap:16px}#pier-scene .text-button{font-size:15px}#pier-feed-tools{gap:10px;flex-wrap:wrap;justify-content:center}}
@media(max-width:600px){#pier-scene{padding:20px 22px 6vh}.pier-dialogue{min-height:180px}#pier-line{font-size:23px}#pier-scene[data-beat="2"] #pier-line{font-size:26px}}
.mirror-dialog.revealed #mirror-touch{margin-top:-16px}
#mirror-leave:focus-visible{outline:none;box-shadow:0 2px 0 #557b66}
@keyframes mirror-words{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.mirror-dialog{padding:26px 20px 22px}.mirror-quote{font-size:18px}.mirror-reassurance{font-size:13px}#mirror-touch-label{font-size:12px}}
@media(prefers-reduced-motion:reduce){#mirror-message{animation:none}}
.find-dialog #find-source{display:block;text-align:right;font-size:10px;color:#7c8171}
.find-dialog #find-decisions{justify-content:space-between;gap:22px;border-top:1px solid #7c8b6e40;padding-top:14px;margin-top:22px}
.find-dialog #keep-find,.find-dialog #reveal-find{font-size:14px;line-height:1.5;padding:8px 2px;min-height:44px;gap:8px;border-bottom:1px solid #647e6266}
.find-dialog #leave-find{font-size:13px;line-height:1.5;padding:8px 2px;min-height:44px;margin:0}
.find-dialog button:focus-visible{outline:none;box-shadow:0 2px 0 #456650;color:#284c3c}
.find-dialog .close:focus-visible{box-shadow:0 0 0 1px #456650;border-radius:50%}
@media(max-width:600px){.find-dialog{padding:26px 28px;min-height:610px}.find-dialog h2{font-size:23px}.find-dialog #inspect-art{height:185px;width:270px;margin:10px auto 16px}.find-story{max-width:290px}.find-dialog #inspect-copy,.find-dialog.first-discovery #inspect-copy{font-size:14px;line-height:1.85}.find-dialog #find-quote,.find-dialog.first-discovery #find-quote{font-size:19px;line-height:1.7}.find-dialog #find-decisions{margin-top:18px}}
@media(max-height:650px){.find-dialog{min-height:0}.find-dialog #inspect-art{height:135px;width:200px}.find-dialog #find-quote,.find-dialog.first-discovery #find-quote{font-size:18px}}
@media(max-height:540px){.title-copy{top:12%}.opening h1{font-size:54px;margin-bottom:9px}.title-story{font-size:18px;margin-bottom:12px}.opening .intro-line{margin-bottom:16px}.title-start{min-height:44px;padding:9px 20px;font-size:15px}.title-secondary{margin-top:8px}.title-about,.title-sound{bottom:14px}}
