@charset "UTF-8";
:root{color-scheme:light;--ink:#243e47;--teal:#27636d;--cream:#f7f1e3;--gold:#dab675;--sunlight:0;--sea-amount:0;--rain-opacity:1;--story-x:0px;--scene-step:200vw;font-family:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{background:#182b38;color:var(--ink)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,main:focus-visible{outline:2px solid #a26736;outline-offset:6px}button:focus:not(:focus-visible),main:focus:not(:focus-visible){outline:none}[hidden]{display:none!important}img{user-select:none;-webkit-user-drag:none}button,svg,img{touch-action:manipulation}
#journey{position:fixed;inset:0;overflow:hidden;isolation:isolate;outline:none;touch-action:none}
.sky{position:absolute;z-index:0;inset:0;pointer-events:none}.sky-rainy{background:linear-gradient(180deg,#142632 0%,#304752 51%,#52676a 100%)}.sky-clear{background:linear-gradient(180deg,#d8e7e2 0%,#eef0db 52%,#f1e8ce 100%);opacity:var(--sunlight)}
.sun{position:absolute;z-index:1;right:10vw;top:11vh;width:clamp(94px,11vw,176px);aspect-ratio:1;opacity:var(--sunlight);pointer-events:none}.sun-core{position:absolute;inset:16%;border-radius:50%;background:#f4d98e;box-shadow:0 0 45px 25px #f6dfa455,0 0 110px 65px #f6dfa433}.sun-ring{position:absolute;inset:-15%;border:1px solid #d8bd7370;border-radius:50%;opacity:.5}
.rainbow{position:absolute;z-index:1;right:7vw;top:4vh;width:min(58vw,900px);height:84vh;opacity:0;pointer-events:none;filter:blur(.6px);transform:rotate(-7deg)}
.cloud-layer{position:absolute;z-index:1;left:-15vw;top:-6vh;width:220vw;height:38vh;color:#607582;opacity:.54;pointer-events:none;will-change:transform}.cloud-layer svg{width:100%;height:100%}
.distant-world{position:absolute;z-index:2;left:0;bottom:21vh;width:270vw;height:27vh;pointer-events:none;will-change:transform}.hills{height:100%;width:100%}
.world{position:absolute;z-index:3;left:0;top:0;width:calc(4 * var(--scene-step) + 130vw);height:100%;will-change:transform}.mainland{position:absolute;left:0;bottom:0;width:calc(2 * var(--scene-step) + 80vw);height:30vh;pointer-events:none;filter:saturate(calc(.65 + .35 * var(--sunlight)))}
.sea{position:absolute;left:calc(2 * var(--scene-step) + 42vw);bottom:0;width:calc(2 * var(--scene-step) + 100vw);height:27vh;background:linear-gradient(180deg,#83b9b8,#4e8f97 46%,#2d6d7d);overflow:visible;pointer-events:none}.sea-horizon{position:absolute;left:0;right:0;top:-7px;height:12px;background:#bad5cb;border-radius:50%;opacity:.65}.sea-shimmer{position:absolute;inset:0;background:repeating-linear-gradient(175deg,transparent 0 26px,#e9e9c70d 27px 30px,transparent 31px 58px);opacity:.9}.wave{position:absolute;left:-1vw;bottom:0;width:calc(100% + 2vw);background-repeat:repeat-x;background-size:480px 100%;pointer-events:none}.wave-back{height:18vh;opacity:.48;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='480' height='180' viewBox='0 0 480 180'%3E%3Cpath d='M0 38Q60 16 120 38T240 38T360 38T480 38V180H0Z' fill='%236facae'/%3E%3Cpath d='M0 38Q60 16 120 38T240 38T360 38T480 38' stroke='%23bad4c9' stroke-width='2' fill='none'/%3E%3C/svg%3E");animation:wave-drift 22s linear infinite}.wave-middle{height:12vh;opacity:.65;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='480' height='120'%3E%3Cpath d='M0 30Q80 6 160 30T320 30T480 30V120H0Z' fill='%23458491'/%3E%3Cpath d='M0 30Q80 6 160 30T320 30T480 30' stroke='%23c1d6c5' stroke-width='2' opacity='.6' fill='none'/%3E%3C/svg%3E");animation:wave-drift 15s linear infinite reverse}.wave-front{height:6vh;opacity:.7;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='480' height='100'%3E%3Cpath d='M0 20Q60 4 120 20T240 20T360 20T480 20V100H0Z' fill='%23336e80'/%3E%3Cpath d='M0 20Q60 4 120 20T240 20T360 20T480 20' stroke='%239dbfb5' stroke-width='2' fill='none'/%3E%3C/svg%3E");animation:wave-drift 18s linear infinite}
@keyframes wave-drift{to{background-position-x:480px}}
.house{position:absolute;left:3vw;bottom:8vh;width:min(38vw,63vh);height:auto;filter:saturate(calc(.7 + .3 * var(--sunlight)));pointer-events:none}.grass{position:absolute;bottom:4vh;width:55vw;height:13vh;border-radius:70% 70% 0 0;background:#839a83;opacity:.25}.grass-one{left:-10vw;transform:rotate(4deg)}.grass-two{left:calc(var(--scene-step) + 45vw);background:#bbc2a2;transform:rotate(-4deg)}
.wildflowers{position:absolute;left:calc(var(--scene-step) + 19vw);bottom:15vh;width:min(20vw,250px);height:auto;display:block;pointer-events:none}
.harbor-zone{position:absolute;left:calc(2 * var(--scene-step) + 17vw);bottom:8vh;width:min(47vw,75vh);aspect-ratio:1000/650}.port-action{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;border-radius:8px}.harbor{display:block;width:100%;height:100%;pointer-events:none}

.ship{position:absolute;width:min(42vw,58vh);left:55vw;bottom:2.2vh;z-index:4;pointer-events:none;will-change:transform,opacity;opacity:0;transition:opacity 1.1s ease}.ship-bob{width:100%;animation:ship-bob 6.5s ease-in-out infinite;transform-origin:50% 90%}.ship img{display:block;width:100%;height:auto;transform:scaleX(-1)}.ship-wake{position:absolute;bottom:2%;left:9%;width:84%;height:7%;border-bottom:2px solid #c4d9c989;border-radius:50%;filter:blur(.3px);animation:wake 5s ease-in-out infinite}.ship.is-visible{opacity:1}
@keyframes ship-bob{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(6px) rotate(.6deg)}}@keyframes wake{50%{transform:scaleX(1.08);opacity:.45}}
.island-zone{position:absolute;left:calc(4 * var(--scene-step) + 26vw);bottom:3.5vh;width:min(66vw,108vh);aspect-ratio:1000/650}.island{width:100%;height:auto;display:block;pointer-events:none}.dig-button{position:absolute;left:47%;top:61%;width:21%;height:29%;border:0;padding:0;background:transparent;z-index:2;color:#a45a42;isolation:isolate}.treasure-x{position:absolute;left:34%;top:31%;width:34%;height:50%;filter:drop-shadow(0 3px 0 #f4d6a055);transition:transform .2s,opacity .15s}.dig-button:hover .treasure-x{transform:scale(1.1) rotate(-7deg)}.soil{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;pointer-events:none}.dig-button[data-stage="1"] .soil-one,.dig-button[data-stage="2"] .soil-two,.dig-button[data-stage="3"] .soil-three,.dig-button[data-stage="4"] .soil-four{opacity:1}.dig-button:disabled{opacity:1;cursor:default}.dig-button:not([data-stage="0"]) .treasure-x{opacity:0}.dig-button.digging{animation:dig-bump .25s ease}.dig-button.digging::after{content:'';position:absolute;left:43%;top:40%;width:8px;height:8px;border-radius:50%;background:#927453;box-shadow:-20px -15px #b29260,25px -18px #95744b,-8px -31px #c4a270;animation:dirt-pop .28s ease-out forwards}
@keyframes dig-bump{50%{transform:translateY(3px)}}@keyframes dirt-pop{to{transform:translateY(-25px) scale(.6);opacity:0}}
.chest-button{position:absolute;left:69%;top:62%;width:17%;border:0;background:transparent;padding:0;z-index:3;animation:chest-appear .8s cubic-bezier(.2,.8,.2,1) both}.chest-button img{display:block;width:100%;position:relative;filter:drop-shadow(0 7px 3px #7e6c4c33);transition:transform .25s}.chest-button:hover img{transform:translateY(-5px) rotate(-2deg)}.treasure-glow{position:absolute;inset:0;border-radius:50%;background:#f9d37080;filter:blur(25px);animation:treasure-glow 3s ease-in-out infinite}@keyframes treasure-glow{50%{opacity:.5;transform:scale(.85)}}@keyframes chest-appear{from{opacity:0;transform:translateY(16px) scale(.85)}to{opacity:1;transform:none}}
.shovel-button{position:absolute;left:35%;top:67%;width:clamp(44px,6.5%,64px);aspect-ratio:100/160;min-height:44px;padding:0;border:0;background:transparent;z-index:3}.shovel-button img{display:block;width:100%;height:auto;pointer-events:none;filter:drop-shadow(0 2px 1px #79694e33);transition:transform .2s}.shovel-button:hover img{transform:translateY(-2px) rotate(-4deg)}
.storm-shade{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(180deg,#0714210d 0%,#0a192d22 35%,#08162599 100%);opacity:calc(1 - var(--sunlight))}#rain{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none;opacity:var(--rain-opacity)}.paper-grain{position:absolute;inset:0;z-index:6;opacity:.065;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.77' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.7' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.greeting{position:absolute;left:6.5vw;top:7.5vh;z-index:7;pointer-events:none;will-change:opacity,transform}.greeting,.story-copy[data-copy="0"]{color:#f4eedf;text-shadow:0 2px 18px #05132130}.greeting h1{margin:0;font-size:clamp(40px,5.3vw,82px);font-weight:400;line-height:1.1;letter-spacing:-.045em}
.story-copies{position:absolute;inset:0;z-index:7;pointer-events:none}.story-copy{position:absolute;left:32.5vw;top:29vh;width:min(58vw,760px);opacity:0;transform:translateY(12px);will-change:opacity,transform;pointer-events:none}.story-copy p{margin:0;font-size:clamp(20px,1.9vw,29px);line-height:1.52;letter-spacing:-.015em;font-weight:400;text-wrap:pretty}.story-copy p>span{display:block}.story-copy em{font-style:italic;color:#356c6e}.copy-sea{left:39vw;top:25vh;width:min(54vw,740px)}.copy-sea p{font-size:clamp(20px,1.85vw,28px);line-height:1.5}.copy-sea .birthday-line{font-size:1.09em;line-height:1.35;margin-bottom:17px;color:#235966}

dialog{color:var(--ink);border:0;padding:0;max-width:none;max-height:none;overscroll-behavior:contain}dialog::backdrop{background:#142d39a8;backdrop-filter:blur(9px)}dialog[open]{animation:dialog-in .3s ease both}@keyframes dialog-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.puzzle-modal{width:calc(100vw - 48px);height:calc(100dvh - 40px);max-width:1600px;border-radius:10px;overflow:hidden;background:#f7f1e3;box-shadow:0 20px 100px #0b1a2866}.puzzle-dialog-bar{height:32px;display:flex;align-items:center;justify-content:flex-end;padding:0 8px;background:#e9e7d9}.icon-close{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:0;border-radius:50%;padding:9px;background:transparent;color:inherit;transition:background .2s}.icon-close svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}.icon-close:hover{background:#294b4510}#puzzle-frame{display:block;border:0;width:100%;height:calc(100% - 32px);background:#f7f1e3}
.puzzle-dialog-bar .icon-close{height:28px;width:28px;padding:7px}.puzzle-modal.is-expanded{width:100vw;height:100dvh;max-width:none;border-radius:0;margin:0;inset:0}.treasure-modal{width:min(520px,calc(100vw - 56px));background:#f8f2e5;border:1px solid #e0d5ba;border-radius:8px;padding:54px 48px 48px;box-shadow:0 30px 120px #061c2866;overflow:auto;max-height:calc(100dvh - 40px);text-align:center}.treasure-modal>.icon-close{position:absolute;top:16px;right:16px}.treasure-kicker{font:10px Arial,sans-serif;letter-spacing:.25em;text-transform:uppercase;color:#927347}.treasure-modal h2{font-size:clamp(34px,4vw,54px);letter-spacing:-.025em;font-weight:400;margin:12px 0 34px}.gift-grid{display:grid;grid-template-columns:minmax(0,1fr);width:min(100%,360px,max(140px,calc(100dvh - 310px)));margin:0 auto;gap:24px}.gift{padding:18px;background:#fffdf8;border:1px solid #d5c9aa80;border-radius:4px}.gift-label{font:14px Georgia,serif;color:#a17b40;letter-spacing:.15em;margin:0 0 17px}.gift img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;image-rendering:auto;display:block;background:white}.qr-placeholder{width:100%;aspect-ratio:1;display:grid;align-content:center;justify-items:center;gap:16px;background:#f1eee3;border:1px dashed #b9ae8e;color:#7d806c;padding:15px;font:12px/1.4 Arial,sans-serif}.qr-placeholder svg{width:48px;height:48px;fill:none;stroke:#b29b6e;stroke-width:1.3}
@media(min-width:1800px){.story-copy{left:36vw}.copy-sea{left:41vw}.house{left:4vw}}
@media(max-height:720px) and (min-width:701px){.greeting{top:5.5vh}.greeting h1{font-size:54px}.story-copy{top:27vh}.story-copy p{font-size:22px;line-height:1.45}.copy-sea{top:20vh}.copy-sea p{font-size:21px}.house{width:60vh;bottom:8vh}.harbor-zone{width:70vh}.island-zone{width:104vh;left:calc(4 * var(--scene-step) + 32vw)}.ship{width:58vh}}
@media(max-width:900px) and (min-width:701px){.story-copy{left:34vw;width:62vw}.story-copy p{font-size:21px}.copy-sea{left:37vw}.greeting h1{font-size:52px}.harbor-zone{width:57vw;left:calc(2 * var(--scene-step) + 9vw)}.island-zone{width:80vw;left:calc(4 * var(--scene-step) + 16vw)}}
@media(max-width:700px){.greeting{left:8vw;top:7vh}.greeting h1{font-size:clamp(39px,10vw,58px);letter-spacing:-.04em}.story-copy,.copy-sea{left:8vw;top:25vh;width:84vw}.story-copy p,.copy-sea p{font-size:clamp(19px,5.1vw,24px);line-height:1.5;letter-spacing:-.018em}.story-copy p>span{display:inline}.story-copy .birthday-line{display:block;font-size:1.08em;line-height:1.4;margin-bottom:12px}.copy-sea{top:15vh}.copy-sea p{font-size:clamp(19px,4.9vw,23px)}.house{left:-5vw;bottom:12vh;width:min(80vw,48vh)}.mainland{height:25vh}.distant-world{bottom:18vh;height:22vh}.cloud-layer{top:0;height:31vh;width:300vw}.sun{right:7vw;top:9vh;width:27vw}.rainbow{right:-13vw;top:4vh;width:106vw}.sea{height:28vh;left:calc(2 * var(--scene-step) + 44vw)}.harbor-zone{left:calc(2 * var(--scene-step) + 5vw);bottom:12vh;width:92vw}.ship{width:min(96vw,48vh);bottom:10vh}.island-zone{left:calc(4 * var(--scene-step) + 2vw);bottom:9vh;width:119vw}.wildflowers{width:38vw;bottom:15vh;left:calc(var(--scene-step) + 24vw)}.puzzle-modal{width:100vw;height:100dvh;border-radius:0}.treasure-modal{width:calc(100vw - 28px);padding:40px 18px 22px;max-height:calc(100dvh - 28px)}.treasure-modal h2{margin:10px 0 24px}.gift-grid{gap:10px}.gift{padding:9px}.gift-label{font-size:12px;margin-bottom:10px}.qr-placeholder{font-size:9px;padding:6px;gap:7px}.qr-placeholder svg{width:25px;height:25px}.treasure-modal>.icon-close{top:9px;right:9px}}
@media(max-width:400px){.story-copy p{font-size:19px}.copy-sea{top:13vh}.copy-sea p{font-size:18px}.gift-grid{gap:7px}.gift{padding:6px}.qr-placeholder{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}.ship,.treasure-x{transition:none!important}#rain{opacity:calc(var(--rain-opacity) * .65)}}

.lock-modal{width:min(360px,calc(100vw - 28px));padding:30px 30px 28px;border:1px solid #e0d5ba;border-radius:14px;background:#f8f2e5;box-shadow:0 28px 100px #061c2866;text-align:center;max-height:calc(100dvh - 28px);overflow:auto}
.lock-modal .lock-close{position:absolute;z-index:2;top:10px;right:10px;width:40px;height:40px;padding:11px;color:#57685e}
.lock-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.lock-figure{position:relative;width:min(100%,280px);aspect-ratio:280/330;margin:0 auto 14px;isolation:isolate;transform-origin:50% 60%}
.lock-art{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.lock-shackle{transform-origin:199px 130px;transition:transform .38s cubic-bezier(.2,.8,.2,1)}
.lock-figure.is-opening .lock-shackle{transform:translateY(-17px) rotate(-18deg)}
.lock-dials{position:absolute;left:25%;right:25%;top:45.5%;height:40%;display:flex;gap:12px;justify-content:center}
.lock-dial{width:calc(50% - 6px);display:grid;grid-template-rows:34px minmax(0,1fr) 34px;min-width:0}
.lock-arrow{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:34px;padding:4px;border:0;border-radius:5px;background:transparent;color:#735c3c;transition:background .15s,color .15s}
.lock-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lock-arrow:hover{background:#6e53251a;color:#443c2b}.lock-arrow:active{background:#6e53252c}
.lock-digit{position:relative;display:block;overflow:hidden;border:1px solid #80653e;border-radius:5px;background:linear-gradient(180deg,#d0c1a0 0%,#f6efda 22%,#fff8e4 48%,#f1e7ca 76%,#cab994 100%);box-shadow:inset 0 2px 5px #66503535,0 1px 0 #f3dfac;cursor:ns-resize;touch-action:none;user-select:none;-webkit-user-select:none;font:42px/1 Georgia,'Times New Roman',serif;color:#354840;font-variant-numeric:tabular-nums}
.lock-digit::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,#80643c26,transparent 27%,transparent 70%,#80643c26)}
.lock-digit:focus-visible{outline:2px solid #27636d;outline-offset:3px}
.lock-number{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.lock-open{min-width:160px;min-height:47px;padding:10px 28px;border:1px solid #23545c;border-radius:7px;background:#27636d;color:#f8f2e5;font-size:18px;letter-spacing:.015em;box-shadow:0 3px 0 #1d4b54;transition:background .15s,transform .15s,box-shadow .15s}
.lock-open:hover{background:#205963}.lock-open:active{transform:translateY(2px);box-shadow:0 1px 0 #1d4b54}.lock-open:disabled{opacity:.75}
.lock-figure.is-shaking{animation:lock-shake .32s ease both}
.lock-figure.is-opening .lock-dials{pointer-events:none}
@keyframes lock-shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-6px) rotate(-1deg)}40%,80%{transform:translateX(6px) rotate(1deg)}}
@media(max-width:360px){.lock-modal{padding:30px 20px 24px}.lock-dials{gap:10px}.lock-dial{width:calc(50% - 5px);grid-template-rows:32px minmax(0,1fr) 32px}.lock-arrow{min-height:32px}.lock-digit{font-size:38px}}
@media(max-height:520px){.lock-modal{padding:20px 28px}.lock-figure{width:210px;margin-bottom:6px}.lock-dials{left:23%;right:23%;top:43%;height:43%;gap:8px}.lock-dial{width:calc(50% - 4px);grid-template-rows:28px minmax(0,1fr) 28px}.lock-arrow{min-height:28px;padding:2px}.lock-digit{font-size:31px}.lock-open{min-height:42px;padding:8px 24px}}
@media(prefers-reduced-motion:reduce){.lock-shackle,.lock-open,.lock-arrow{transition:none!important}.lock-figure[data-state="error"] .lock-digit{outline:2px solid #a45a42;outline-offset:2px}}

.gift-actions{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;padding-top:10px;border-top:1px solid #d5c9aa70}
.gift-action{display:inline-flex;align-items:center;justify-content:center;flex:0 1 40px;width:40px;height:40px;min-width:0;padding:10px;border:0;border-radius:6px;background:transparent;color:#456a69;text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
.gift-action svg{display:block;width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.gift-action:hover{background:#27636d0c;color:#214f58}.gift-action:active{background:#27636d18}.gift-action:focus-visible{outline:2px solid #a26736;outline-offset:2px}.gift-action:disabled{opacity:.45;cursor:default}
.qr-modal{width:min(900px,calc(100vw - 28px),calc(100dvh - 64px));max-height:calc(100dvh - 28px);padding:52px 18px 18px;border:1px solid #e0d5ba;border-radius:10px;background:#f8f2e5;box-shadow:0 30px 120px #061c2866;overflow:auto}
.qr-modal>.icon-close{position:absolute;top:6px;right:8px;width:40px;height:40px;padding:11px}
#qr-expanded-image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:#fff;border:clamp(12px,3vw,28px) solid #fff;image-rendering:pixelated}
@media(max-width:700px){.gift-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:10px;padding-top:6px}.gift-action{width:100%;height:40px;padding:3px;border-radius:4px}.gift-action svg{width:17px;height:17px}}
@media(prefers-reduced-motion:reduce){.gift-action{transition:none!important}}
@media(max-width:700px){.qr-modal{width:min(calc(100vw - 12px),calc(100dvh - 72px));padding:48px 6px 6px}#qr-expanded-image{border-width:0}}