:root{--ink:#eef3f7;--ink-soft:#b9c9d6;--ink-faint:#8ea3b4;--paper:#f5eddc;--paper-shade:#e7dcc4;--paper-edge:#cbbb9b;--paper-ink:#2f2b24;--paper-ink-soft:#6a6152;--glass:#d6eee96b;--glass-rim:#f0fffab8;--cork:#c08f52;--cork-dark:#8c5f2d;--focus:#ffe6a8;--danger:#ffb4a2;--step--1:clamp(.8rem, .78rem + .1vw, .875rem);--step-0:clamp(1rem, .96rem + .2vw, 1.0625rem);--step-1:clamp(1.2rem, 1.1rem + .5vw, 1.4rem);--step-2:clamp(1.5rem, 1.3rem + 1vw, 2rem);--step-3:clamp(2rem, 1.6rem + 2.2vw, 3.25rem);--serif:"EB Garamond", "Iowan Old Style", Palatino, Georgia, serif;--display:"Fraunces", "EB Garamond", Georgia, serif;--sans:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--hand:"Caveat", "Segoe Script", cursive;--measure:34ch;--ease-tide:cubic-bezier(.32, .06, .24, 1);--slow:1.4s;--slower:2.6s}:root,:root[data-sky=night]{--sky-top:#030a14;--sky-mid:#061527;--sky-horizon:#0e2f45;--light-core:#eaf2ff;--light-glow:#bed6ff80;--sea-far:#0c2437;--sea-mid:#071a2a;--sea-near:#03101c;--foam:#cee4ff80;--stars:.85}:root[data-sky=dawn]{--sky-top:#12203c;--sky-mid:#45375a;--sky-horizon:#d9906f;--light-core:#ffe7c4;--light-glow:#ffc48c80;--sea-far:#6a5a6b;--sea-mid:#2f3a52;--sea-near:#131e31;--foam:#ffe2ce80;--stars:.22}:root[data-sky=day]{--sky-top:#16405f;--sky-mid:#2c6f8e;--sky-horizon:#a9d3d8;--light-core:#fdfbef;--light-glow:#fffde96b;--sea-far:#6ea7ac;--sea-mid:#2c6a79;--sea-near:#123444;--foam:#f0ffff94;--stars:0;--ink:#f4f9fb;--ink-soft:#d6e6ec;--ink-faint:#a8c3ce}:root[data-sky=sunset]{--sky-top:#1d2144;--sky-mid:#7a416a;--sky-horizon:#e79a63;--light-core:#fff1cd;--light-glow:#ffb06a8c;--sea-far:#a2696a;--sea-mid:#4a3a58;--sea-near:#16182c;--foam:#ffd8be80;--stars:.15}*,:before,:after{box-sizing:border-box}*{margin:0}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-text-size-adjust:100%}html,body,#root{height:100%}body{background:var(--sea-near);color:var(--ink);font-family:var(--serif);font-size:var(--step-0);text-shadow:0 1px 6px #020911b3,0 1px 2px #02091180;touch-action:manipulation;-webkit-tap-highlight-color:#ffe7c42e;overscroll-behavior:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;line-height:1.6;overflow:hidden}h1,h2,h3{font-family:var(--display);text-wrap:balance;font-weight:300;line-height:1.15}p{text-wrap:pretty}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}a{color:inherit}textarea{font:inherit;color:inherit;text-shadow:none}:where(a,button,textarea,[tabindex]):focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:3px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:40;font-family:var(--sans);font-size:var(--step--1);background:var(--sea-mid);color:var(--ink);border:1px solid var(--glass-rim);transition:transform .16s var(--ease-tide);border-radius:999px;padding:.6rem 1rem;position:absolute;inset-block-start:calc(1rem + env(safe-area-inset-top));inset-inline-start:1rem;transform:translateY(-5rem)}.skip-link:focus-visible{transform:translateY(0)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;transition-delay:0s!important;animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:0s!important}}.shell{height:100dvh;min-height:100%;padding-block:env(safe-area-inset-top) env(safe-area-inset-bottom);padding-inline:env(safe-area-inset-left) env(safe-area-inset-right);isolation:isolate;grid-template-rows:auto 1fr auto;display:grid;position:relative}.ocean-canvas{z-index:-2;width:100%;height:100%;display:block;position:fixed;inset:0}.vignette{z-index:-1;pointer-events:none;background:radial-gradient(120% 90% at 50% 46%,#0000 38%,#030c168c 100%),linear-gradient(#030c1659 0%,#0000 22%,#030c1666 100%);position:fixed;inset:0}.chrome{font-family:var(--sans);font-size:var(--step--1);color:var(--ink-faint);align-items:center;gap:.75rem;padding:clamp(.75rem,2vw,1.25rem);display:flex}.chrome--top{justify-content:space-between}.chrome--bottom{text-align:center;justify-content:center}.stage{overscroll-behavior:contain;scrollbar-width:thin;place-items:center;min-height:0;padding-block:1rem;padding-inline:clamp(1rem,5vw,2.5rem);display:grid;overflow-y:auto}.scene{text-align:center;width:min(100%,46rem);animation:scene-rise var(--slow) var(--ease-tide) both;justify-items:center;gap:clamp(1.25rem,3vh,2.25rem);display:grid}@keyframes scene-rise{0%{opacity:0;transform:translateY(1.25rem)}to{opacity:1;transform:translate(0,0)}}.eyebrow{font-family:var(--sans);font-size:var(--step--1);letter-spacing:.32em;text-transform:uppercase;color:var(--ink-faint)}.title{font-size:var(--step-3);letter-spacing:.01em}.scene-title{font-size:var(--step-2);color:var(--ink-soft);font-weight:300}.lede{max-width:var(--measure);font-size:var(--step-1);color:var(--ink-soft);font-style:italic}.quiet{font-family:var(--sans);font-size:var(--step--1);color:var(--ink-faint);letter-spacing:.04em}@property --glow{syntax:"<color>";inherits:false;initial-value:#ffeccc29}.tide-button{--glow:#ffeccc29;min-height:3rem;font-family:var(--sans);font-size:var(--step-0);letter-spacing:.06em;color:var(--ink);background:linear-gradient(180deg, var(--glow), #091a2880);border:1px solid var(--glass-rim);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .4s var(--ease-tide), --glow .4s var(--ease-tide), border-color .4s var(--ease-tide), box-shadow .4s var(--ease-tide);border-radius:999px;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.75rem;display:inline-flex;position:relative}.tide-button:hover,.tide-button:focus-visible{--glow:#fff0d64d;border-color:var(--light-core);box-shadow:0 0 2.5rem -.5rem var(--light-glow);transform:translateY(-1px)}.tide-button:active{transform:translateY(1px)}.tide-button[aria-disabled=true],.tide-button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.tide-button--quiet{min-height:2.5rem;font-size:var(--step--1);color:var(--ink-soft);background:#091a2859;border-color:#d6eee947;padding:.5rem 1.1rem}.tide-button--text{-webkit-backdrop-filter:none;backdrop-filter:none;min-height:2.5rem;color:var(--ink-faint);text-underline-offset:.25em;background:0 0;border-color:#0000;padding:.4rem .6rem;-webkit-text-decoration:underline #b9c9d666;text-decoration:underline #b9c9d666}.tide-button--text:hover,.tide-button--text:focus-visible{color:var(--ink);box-shadow:none;text-decoration-color:currentColor}.actions{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.divider{background:linear-gradient(to right, transparent, var(--glass-rim), transparent);opacity:.4;border:0;width:min(12rem,40%);height:1px}.notice{max-width:var(--measure);font-family:var(--sans);font-size:var(--step--1);color:var(--ink-soft);line-height:1.6}.notice--problem{color:var(--danger)}.notice:empty{display:none}.desk{text-align:start;gap:1rem;width:min(100%,34rem);display:grid}.paper-field{background:linear-gradient(180deg, var(--paper) 0%, var(--paper-shade) 100%);clip-path:polygon(.4% .6%,99.5% 0%,100% 99.2%,.6% 100%);border-radius:2px 3px;padding:clamp(1.25rem,4vw,2rem);position:relative;box-shadow:0 1.5rem 3rem -1rem #020a12a6,inset 0 0 3rem #cbbb9b59}.paper-field textarea{width:100%;min-height:11.4em;color:var(--paper-ink);font-family:var(--serif);font-size:var(--step-1);resize:none;background:repeating-linear-gradient(#0000 0 calc(1.9em - 1px),#70644e38 calc(1.9em - 1px) 1.9em);border:0;padding:0;line-height:1.9em;display:block}.paper-field textarea:focus{outline:0}.paper-field:focus-within{box-shadow:0 1.5rem 3rem -1rem #020a12b3, inset 0 0 3rem #cbbb9b59, 0 0 0 2px var(--focus)}.paper-field textarea::placeholder{color:var(--paper-ink-soft);opacity:1;font-style:italic}.desk-foot{font-family:var(--sans);font-size:var(--step--1);color:var(--ink-faint);justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.counter{font-variant-numeric:tabular-nums}.counter--over{color:var(--danger)}.stats{font-variant-numeric:tabular-nums;letter-spacing:.06em}.sheet::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#020911b8}.sheet{width:min(92vw,26rem);color:var(--ink);overscroll-behavior:contain;background:linear-gradient(#102638f5,#061420fa);border:1px solid #d6eee947;border-radius:6px;margin:auto;padding:clamp(1.25rem,4vw,1.75rem);box-shadow:0 2rem 4rem -1rem #000000b3}.sheet h2{font-size:var(--step-1);margin-bottom:.5rem}.sheet fieldset{border:0;gap:.25rem;margin:1rem 0 1.25rem;padding:0;display:grid}.sheet legend{font-family:var(--sans);font-size:var(--step--1);color:var(--ink-faint);padding:0}.sheet label{min-height:2.75rem;font-family:var(--sans);font-size:var(--step-0);cursor:pointer;border-radius:4px;align-items:center;gap:.75rem;padding:.25rem .5rem;display:flex}.sheet label:hover{background:#d6eee914}.sheet input[type=radio]{width:1.1rem;height:1.1rem;accent-color:var(--focus)}.sheet-actions{justify-content:flex-end;gap:.5rem;display:flex}.bottle-field{perspective:900px;place-items:center;width:100%;min-height:clamp(12rem,34vh,20rem);display:grid}.bottle-field[data-phase=approach]{animation:bottle-approach 9s var(--ease-tide) both}.bottle-field[data-phase=leaving]{animation:bottle-leaving 4.5s var(--ease-tide) both}@keyframes bottle-approach{0%{opacity:0;transform:translate(18vw,-14vh)scale(.14)}35%{opacity:1}to{opacity:1;transform:translate(0,0)scale(1)}}@keyframes bottle-leaving{0%{opacity:1;transform:translate(0,0)scale(1)rotate(0)}30%{transform:translate(-4vw,6vh)scale(.86)rotate(-8deg)}to{opacity:0;transform:translate(-26vw,-6vh)scale(.1)rotate(-14deg)}}.bottle{transition:filter .6s var(--ease-tide);filter:drop-shadow(0 1.2rem 1.6rem #020a128c);border-radius:50%/22%;animation:11s ease-in-out infinite bottle-sway;display:block}@keyframes bottle-sway{0%,to{transform:translate(0,0)rotate(-5deg)}25%{transform:translate(.6rem,-.5rem)rotate(1deg)}50%{transform:translateY(-.9rem)rotate(5deg)}75%{transform:translate(-.6rem,-.4rem)rotate(1deg)}}.bottle:hover,.bottle:focus-visible{filter:drop-shadow(0 1.2rem 2rem #020a1299) drop-shadow(0 0 1.75rem var(--light-glow))}.bottle:focus-visible{outline:2px solid var(--focus);outline-offset:12px}.bottle-art{width:clamp(6.5rem,22vw,10rem);height:auto;display:block}.bottle-art--small{width:clamp(4.5rem,14vw,6.5rem)}.bottle-art .cork{transform-box:fill-box;transform-origin:50%;transition:transform 1.6s var(--ease-tide)}.bottle-art .bottle-paper{transition:opacity .9s var(--ease-tide) .9s}.bottle[data-open=true] .cork{transform:translate(2px,-46px)rotate(24deg)}.bottle-halo{aspect-ratio:1;background:radial-gradient(circle, var(--light-glow) 0%, transparent 62%);opacity:.5;pointer-events:none;border-radius:50%;width:clamp(9rem,30vw,14rem);animation:7s ease-in-out infinite halo-breathe;position:absolute}@keyframes halo-breathe{0%,to{opacity:.32;transform:scale(.92)}50%{opacity:.58;transform:scale(1.06)}}.bottle-stack{place-items:center;display:grid;position:relative}.letter{text-align:start;width:min(100%,32rem);color:var(--paper-ink);background:radial-gradient(120% 80% at 20% 0%, #fffcf0e6, transparent 60%), linear-gradient(172deg, var(--paper) 0%, var(--paper-shade) 100%);clip-path:polygon(.5% .4%,99.4% 0%,100% 99.4%,.4% 100%);animation:letter-rise 1.6s var(--ease-tide) both, letter-unfold 2.2s var(--ease-tide) .5s both;transform-origin:50% 20%;border-radius:2px;padding:clamp(1.75rem,6vw,3rem) clamp(1.5rem,5vw,2.75rem);position:relative;box-shadow:0 2rem 4rem -1.25rem #020a12b3,inset 0 0 4rem #beac8852}@keyframes letter-rise{0%{opacity:0;transform:translateY(3rem)}to{opacity:1;transform:translate(0,0)}}@keyframes letter-unfold{0%{transform:perspective(1400px)rotateX(-72deg)scale(.86)}to{transform:perspective(1400px)rotateX(0)scale(1)}}.letter:before,.letter:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#786a5047 12% 88%,#0000);height:1px;position:absolute;inset-inline:0}.letter:before{top:33.33%}.letter:after{top:66.66%}.letter-text{font-family:var(--serif);letter-spacing:.005em;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere;min-width:0;font-size:clamp(1.15rem,1rem + 1.1vw,1.6rem);line-height:1.75}.letter-text p{animation:ink-appear 1.4s var(--ease-tide) both;animation-delay:calc(1.1s + var(--line,0) * .42s)}@keyframes ink-appear{0%{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur()}}.letter-text p+p{margin-top:.9em}.letter-meta{font-family:var(--sans);font-size:var(--step--1);color:var(--paper-ink-soft);font-variant-numeric:tabular-nums;border-top:1px solid #786a5038;justify-content:space-between;align-items:baseline;gap:1rem;margin-top:clamp(1.5rem,4vw,2.25rem);padding-top:.9rem;display:flex}.letter-sign{font-family:var(--hand);color:var(--paper-ink-soft);font-size:1.5rem;line-height:1}.letter-actions{animation:ink-appear 1.2s var(--ease-tide) 2.6s both;flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}