:root{--color-paper:#fcf8f0;--color-paper-deep:#f4ead7;--color-ink:#1c3041;--color-muted:#425565;--color-blue:#a5daf4;--color-blue-light:#d9effb;--color-blue-dark:#1c557a;--color-pink:#fabac2;--color-pink-light:#fee8eb;--color-pink-dark:#873043;--color-rule:#a8bac6;--color-brown:#cc8a57;--color-brown-dark:#664432;--color-cat-cream:#fae9cc;--color-cat-orange:#e1ab75;--color-cat-grey:#6d7f92;--color-shadow:#1c30411a;--color-clear:transparent;--color-cover:#d1e5ef;--color-paper-edge:#dbccb3;--color-hill:#a2ccd9;--color-window:#739bb4;--color-table:#e5c096;--paper-cut:polygon(0 3%, 32% 0, 69% 2%, 97% 0, 100% 9%, 99% 69%, 100% 97%, 65% 100%, 28% 98%, 1% 100%);--paper-tag:polygon(3% 0, 97% 2%, 100% 88%, 96% 100%, 0 97%, 1% 10%);--bottle-cut:polygon(25% 0, 74% 0, 95% 14%, 100% 31%, 98% 89%, 86% 100%, 12% 98%, 1% 88%, 0 28%, 7% 13%);--font-display:"Thonburi", "Leelawadee UI", "Tahoma", sans-serif;--font-body:"Sukhumvit Set", "Leelawadee UI", "Tahoma", sans-serif;--font-mono:ui-monospace, monospace;--text-sm:.875rem;--text-base:1rem;--text-lg:1.25rem;--text-xl:clamp(1.5rem, 3vw, 2rem);--text-display:clamp(2rem, 4vw, 3.25rem);--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--radius-sm:.5rem;--radius-md:.75rem;--ease-out:cubic-bezier(.16,1,.3,1);--ease-in:cubic-bezier(.7,0,.84,0);--ease-in-out:cubic-bezier(.65,0,.35,1);--dur-micro:.12s;--dur-short:.22s;--dur-long:.42s}@supports (color:lab(0% 0 0)){:root{--color-paper:lab(97.7277% .350952 4.58053);--color-paper-deep:lab(93.1399% .91809 10.3987);--color-ink:lab(18.7417% -4.00791 -13.2463);--color-muted:lab(35.0177% -4.09153 -11.7598);--color-blue:lab(83.9713% -12.9007 -18.5817);--color-blue-light:lab(93.1441% -5.83798 -8.1264);--color-blue-dark:lab(33.7431% -8.23391 -27.0931);--color-pink:lab(81.7378% 24.7708 5.30094);--color-pink-light:lab(93.9249% 7.96685 1.67214);--color-pink-dark:lab(33.6486% 39.1349 8.91931);--color-rule:lab(74.5446% -4.76357 -8.04514);--color-brown:lab(63.6296% 21.8883 37.9697);--color-brown-dark:lab(32.41% 13.509 16.898);--color-cat-cream:lab(93.1371% 2.85107 16.1575);--color-cat-orange:lab(74.2991% 15.6178 36.0428);--color-cat-grey:lab(52.3816% -3.3887 -12.6011);--color-shadow:lab(18.7417% -4.00791 -13.2463/.1);--color-cover:lab(89.6536% -5.22468 -7.26187);--color-paper-edge:lab(82.6862% 2.49976 14.2237);--color-hill:lab(79.4205% -12.3103 -11.1551);--color-window:lab(61.8125% -9.54545 -17.8412);--color-table:lab(80.2425% 9.42621 26.4444)}}
.story-frame.panel{background:var(--color-paper);width:100%;max-width:700px;color:var(--color-ink);font-family:var(--font-body);border-radius:0;margin-inline:auto;padding:0;line-height:1.7}.story-frame *,.story-frame :before,.story-frame :after{box-sizing:border-box}.story-frame .story-heading{padding:var(--space-lg) var(--space-md) var(--space-sm);background:var(--color-blue-light)}.story-frame .story-heading h2{font-family:var(--font-display);overflow-wrap:anywhere;margin:0;font-size:clamp(1.4rem,4vw,1.9rem);line-height:1.55}.story-eyebrow{margin:0 0 var(--space-xs);color:var(--color-muted);font-size:.75rem}.story-stage{aspect-ratio:1.55;isolation:isolate;background:var(--color-blue-light);width:100%;min-height:190px;position:relative;overflow:hidden}.story-stage svg{width:100%;height:auto;display:block}.story-cloud{background:var(--color-paper);clip-path:polygon(0 52%,12% 26%,32% 32%,44% 0,65% 10%,74% 36%,95% 30%,100% 85%,6% 100%);opacity:.8;width:24%;height:8%;position:absolute}.story-cloud-one{top:14%;left:7%}.story-cloud-two{width:19%;top:5%;right:8%}.story-land{background:var(--color-paper-deep);clip-path:polygon(0 15%,24% 0,62% 12%,100% 2%,100% 100%,0 100%);z-index:-1;width:104%;height:22%;position:absolute;bottom:0;left:-2%}.story-beagle{z-index:2;width:37%;position:absolute;bottom:8%;left:7%}.story-ground-parcel{z-index:3;width:20%;position:absolute;bottom:8%;left:37%}.story-dialogue{gap:var(--space-md);padding:var(--space-lg) var(--space-md);background:var(--color-paper);border-bottom:5px solid var(--color-blue);flex-direction:column;display:flex}.story-dialogue p{overflow-wrap:anywhere;margin:0}.story-spoken{color:var(--color-ink);font-size:clamp(1.05rem,3vw,1.3rem)}.story-note{color:var(--color-muted);font-size:.8rem;line-height:1.8}.story-status{padding-left:var(--space-md);border-left:3px solid var(--color-blue-dark);font-size:var(--text-sm)}.story-actions{gap:var(--space-sm);flex-direction:column;width:100%;display:flex}.story-frame .story-button{width:100%;min-height:48px;padding:.7rem var(--space-md);border:1px solid var(--color-blue-dark);background:var(--color-paper);color:var(--color-blue-dark);font:inherit;white-space:normal;overflow-wrap:anywhere;cursor:pointer;border-radius:3px 8px 4px 6px;font-weight:600;line-height:1.65;display:block}.story-frame .story-button-primary{--button-paper:var(--color-blue-dark);background:var(--color-clear);color:var(--color-paper);box-shadow:none}.story-frame .story-button{border-radius:0}.story-frame .story-letter-choice:before{display:none}.story-frame .story-button[aria-pressed=true]{--button-paper:var(--color-blue-light)}.story-frame .story-status{padding:var(--space-sm) var(--space-md);background:var(--color-blue-light);border-left:0}.story-frame .story-eyebrow{display:none}.story-frame button:focus-visible,.story-frame summary:focus-visible{outline:3px solid var(--color-pink-dark);outline-offset:3px}.story-frame button:disabled{cursor:default}.story-frame .story-button[aria-pressed=true]{background:var(--color-blue-light);box-shadow:inset 0 -3px var(--color-blue-dark)}.story-mock-window{background:var(--color-paper);border:5px solid var(--color-blue);border-radius:48% 46% 2px 3px;width:43%;position:absolute;top:15%;bottom:20%;right:7%}.story-window-label{text-align:center;color:var(--color-blue-dark);font-size:clamp(.65rem,2vw,.8rem);position:absolute;inset:auto -12% -27%}.story-calendar{background:var(--color-paper);text-align:center;width:36%;box-shadow:4px 5px 0 var(--color-blue);border-top:14px solid var(--color-blue-dark);padding:6% 2% 4%;position:absolute;top:14%;right:11%;transform:rotate(3deg)}.story-calendar>span{font-size:clamp(.6rem,1.8vw,.85rem);display:block}.story-calendar>strong{font-family:var(--font-display);color:var(--color-blue-dark);margin-block:.1em;font-size:clamp(3rem,12vw,5rem);font-weight:700;line-height:1;display:block}.story-calendar p{margin:0;font-size:clamp(.85rem,2.7vw,1.1rem)}.story-date{color:var(--color-blue-dark);font-weight:700}.story-stage-caption{width:100%;padding-inline:var(--space-sm);text-align:center;color:var(--color-ink);margin:0;font-size:clamp(.65rem,2vw,.8rem);position:absolute;bottom:4%}.story-gift-parcel{z-index:2;width:38%;position:absolute;bottom:6%;left:15%}.story-open-box{z-index:3;width:36%;height:44%;position:absolute;bottom:9%;left:16%}.story-box-back{background:var(--color-brown-dark);clip-path:polygon(0 10%,40% 0,100% 10%,100% 90%,50% 100%,0 88%);position:absolute;inset:22% 0 0}.story-box-front{background:var(--color-brown);clip-path:polygon(0 0,52% 9%,100% 0,100% 78%,50% 100%,0 78%);position:absolute;inset:52% 0 0}.story-box-flap{background:var(--color-cat-orange);width:58%;height:23%;position:absolute;top:42%}.story-box-flap-left{clip-path:polygon(32% 0,100% 30%,68% 100%,0 61%);left:-19%}.story-box-flap-right{clip-path:polygon(0 30%,71% 0,100% 67%,26% 100%);right:-17%}.story-envelope{aspect-ratio:1.45;background:var(--color-paper-deep);border:1px solid var(--color-paper-edge);width:140px;box-shadow:2px 3px 0 var(--color-shadow);display:block;position:relative}.story-envelope:after{content:"";background:var(--color-paper);clip-path:polygon(0 100%,0 20%,50% 70%,100% 20%,100% 100%);position:absolute;inset:0}.story-envelope-flap{background:var(--color-paper-edge);clip-path:polygon(0 0,100% 0,50% 60%);position:absolute;inset:0}.story-envelope-seal{z-index:1;aspect-ratio:1;background:var(--color-pink);width:23%;color:var(--color-pink-dark);border-radius:50%;place-items:center;font-size:1.1rem;line-height:1;display:grid;position:absolute;top:41%;left:40%}.story-open-box>.story-envelope{width:77%;position:absolute;top:3%;left:11%;transform:rotate(-8deg)}.story-letter-stage{aspect-ratio:3.4;min-height:100px}.story-letter-paper{padding:var(--space-lg) var(--space-md);background:var(--color-paper-deep);border-left:3px solid var(--color-paper-edge)}.story-stash-cabinet{width:37%;height:47%;position:absolute;bottom:10%;right:10%}.story-mailbox-prop{background:var(--color-blue-dark);border-bottom:45px solid var(--color-blue-light);border-radius:42% 44% 3px 4px;width:31%;position:absolute;top:19%;bottom:8%;right:13%}.story-mailbox-prop>span{text-align:center;background:var(--color-paper);color:var(--color-blue-dark);padding:3%;font-size:clamp(.75rem,2vw,1rem);position:absolute;inset:49% 7% auto}@media (prefers-reduced-motion:reduce){.story-frame *,.story-frame :before,.story-frame :after{transition:none!important;animation:none!important}.story-frame button:active:not(:disabled){transform:none}}
*,:before,:after{box-sizing:border-box}html,body{min-height:100dvh;font-family:var(--font-body);color:var(--color-ink);background:var(--color-paper);-webkit-font-smoothing:antialiased;margin:0;padding:0}