.story-page{--story-night:oklch(9% .01 25);--story-paper:oklch(93% .01 90);--story-paper-aged:oklch(82% .035 88);--story-stain:oklch(55% .06 70);--story-shell:oklch(18% .008 80);--story-shell-dark:oklch(11% .006 80);--story-shell-edge:oklch(32% .01 80);--story-dust:oklch(75% .02 85);--story-label-ink:oklch(34% .025 60/.85);--story-label-ink-soft:oklch(48% .02 60/.6);--story-label-rule:oklch(62% .04 240/.28);--story-crt-black:oklch(5% 0 0);--story-crt-white:oklch(99% .005 200);--story-vcr-blue:oklch(35% .16 262);--story-osd-ink:oklch(97% .01 200);--story-osd-glow:oklch(85% .09 230/.55);--story-osd-r:oklch(62% .21 25/.55);--story-osd-c:oklch(78% .13 200/.55);--story-glow:oklch(78% .06 230/.3);--story-shell-grime:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch' seed='29'/%3E%3CfeColorMatrix values='0 0 0 0 0.07 0 0 0 0 0.055 0 0 0 0 0.04 0 0 0 0.6 -0.24'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23g)'/%3E%3C/svg%3E");--story-shell-dusting:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='120'%3E%3Cfilter id='d'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.06 0.4' numOctaves='3' stitchTiles='stitch' seed='11'/%3E%3CfeColorMatrix values='0 0 0 0 0.72 0 0 0 0 0.68 0 0 0 0 0.58 0 0 0 0.5 -0.31'/%3E%3C/filter%3E%3Crect width='260' height='120' filter='url(%23d)'/%3E%3C/svg%3E");--story-shell-mottle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.028' numOctaves='3' stitchTiles='stitch' seed='5'/%3E%3CfeColorMatrix values='0 0 0 0 0.05 0 0 0 0 0.04 0 0 0 0 0.03 0 0 0 0.7 -0.32'/%3E%3C/filter%3E%3Crect width='420' height='420' filter='url(%23b)'/%3E%3C/svg%3E");--story-label-water:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='380' height='380'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.045 0.03' numOctaves='3' stitchTiles='stitch' seed='17'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.38 0 0 0 0 0.22 0 0 0 0.65 -0.33'/%3E%3C/filter%3E%3Crect width='380' height='380' filter='url(%23w)'/%3E%3C/svg%3E");--story-label-mould:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='4' stitchTiles='stitch' seed='47'/%3E%3CfeColorMatrix values='0 0 0 0 0.42 0 0 0 0 0.33 0 0 0 0 0.2 0 0 0 0.5 -0.22'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23m)'/%3E%3C/svg%3E");background:var(--story-night);min-height:100vh;color:var(--fg);font-family:var(--font-sans-stack)}.story-veil{z-index:10;background:var(--story-crt-black);opacity:0;pointer-events:none;position:fixed;inset:0}@media (prefers-reduced-motion:no-preference){.story-veil{animation:story-arrive 1.6s var(--ease-out-soft) both}}@keyframes story-arrive{0%{opacity:1}to{opacity:0}}.story-darkroom{flex-direction:column;gap:22vh;max-width:44rem;margin:0 auto;padding:24vh 1.5rem 0;display:flex}.story-print{flex-direction:column;align-items:center;gap:1.25rem;display:flex}.story-print:nth-child(odd){transform:rotate(-1deg)}.story-print:nth-child(2n){transform:rotate(.8deg)}.story-print img{aspect-ratio:4/3;object-fit:cover;border:.9rem solid var(--story-paper);width:min(30rem,86vw);box-shadow:var(--shadow-lg);filter:brightness(6)contrast(0)sepia(.25);transition:filter 3.2s var(--ease-out-soft);border-bottom-width:2.6rem;display:block}.story-print.is-developed img{filter:brightness()contrast()sepia(.18)}.story-print figcaption{font-family:var(--font-sans-stack);text-align:left;max-width:34rem;color:var(--fg-muted);opacity:0;transition:opacity var(--dur-slow) var(--ease-out-soft) 2.2s;font-size:1.05rem;line-height:1.75}.story-print.is-developed figcaption{opacity:1}.story-tape{flex-direction:column;align-items:center;gap:3rem;padding:22vh 1.5rem 30vh;display:flex}.story-tape-line{font-family:var(--font-sans-stack);text-align:left;max-width:34rem;color:var(--fg-muted);margin:0;font-size:1.05rem;line-height:1.75}.story-cassette{aspect-ratio:24/15;background:radial-gradient(circle .3rem at 3.5% 6.5%, oklch(7% .005 80) 45%, oklch(30% .012 80/.5) 60%, transparent 70%), radial-gradient(circle .3rem at 96.5% 6.5%, oklch(7% .005 80) 45%, oklch(30% .012 80/.5) 60%, transparent 70%), radial-gradient(circle .3rem at 3.5% 93%, oklch(7% .005 80) 45%, oklch(30% .012 80/.5) 60%, transparent 70%), radial-gradient(circle .3rem at 96.5% 93%, oklch(7% .005 80) 45%, oklch(30% .012 80/.5) 60%, transparent 70%), radial-gradient(ellipse 120% 90% at 30% 0%, oklch(24% .012 80/.9) 0%, transparent 55%), var(--story-shell-mottle), var(--story-shell);border-radius:var(--radius-xs);width:min(24rem,86vw);box-shadow:var(--shadow-lg), inset 0 1px 0 oklch(32% .012 80/.6), inset 0 -14px 24px oklch(6% .005 80/.8);border:1px solid oklch(26% .01 80);justify-content:center;align-items:flex-start;padding-top:1.5rem;display:flex;position:relative;overflow:hidden}.story-cassette:after{content:"";pointer-events:none;background:linear-gradient(115deg, transparent 0 34%, color-mix(in oklch, var(--story-dust) 9%, transparent) 46%, color-mix(in oklch, var(--story-dust) 4%, transparent) 55%, transparent 68%), repeating-linear-gradient(98deg, transparent 0 9px, color-mix(in oklch, var(--story-dust) 3%, transparent) 9px 10px), radial-gradient(ellipse 40% 22% at 78% 88%, color-mix(in oklch, var(--story-dust) 10%, transparent) 0%, transparent 70%), var(--story-shell-dusting), var(--story-shell-grime);position:absolute;inset:0}.story-cassette-label{background:var(--story-paper-aged);width:78%;color:var(--story-label-ink);clip-path:polygon(.5% 4%,5% .5%,38% 2%,70% 0%,99.5% 2.5%,99% 40%,100% 74%,93% 100%,60% 98.5%,28% 100%,1% 98%,0% 60%);background-image:radial-gradient(ellipse 3.5rem 2rem at 82% 12%, color-mix(in oklch, var(--story-stain) 22%, transparent) 0%, transparent 70%), radial-gradient(ellipse 2.2rem 1.4rem at 12% 85%, color-mix(in oklch, var(--story-stain) 18%, transparent) 0%, transparent 70%), radial-gradient(ellipse 1.2rem .9rem at 38% 30%, color-mix(in oklch, var(--story-stain) 12%, transparent) 0%, transparent 70%), linear-gradient(160deg, transparent 0 60%, color-mix(in oklch, var(--story-stain) 14%, transparent) 100%), var(--story-label-mould), var(--story-label-water), repeating-linear-gradient(to bottom, transparent 0 1.55rem, var(--story-label-rule) 1.55rem calc(1.55rem + 1px));flex-direction:column;gap:.3rem;padding:.8rem 1rem 1rem;display:flex;rotate:-.7deg}.story-cassette-title{font-family:var(--font-press-stack);font-size:1.5rem;line-height:1.55rem}.story-cassette-over{font-family:var(--font-press-stack);color:var(--story-label-ink-soft);font-size:.95rem;line-height:1.55rem;text-decoration:line-through;text-decoration-thickness:2px}.story-cassette-spools{background:linear-gradient(160deg,oklch(16% .008 80/.9),oklch(8% .005 80/.95) 60%);border:1px solid oklch(30% .012 80/.7);border-radius:.5rem;justify-content:space-around;align-items:center;height:34%;display:flex;position:absolute;bottom:10%;left:19%;right:19%;box-shadow:inset 0 2px 6px oklch(3% 0 0/.9),inset 0 -1px oklch(32% .012 80/.4)}.story-cassette-spool{background:radial-gradient(circle,oklch(28% .01 80) 0 26%,oklch(10% .004 80) 27% 88%,#0000 89%);border:2px solid oklch(34% .012 80/.8);border-radius:50%;width:3.4rem;height:3.4rem}.story-cassette-spool:last-child{background:radial-gradient(circle,oklch(28% .01 80) 0 26%,oklch(10% .004 80) 27% 62%,oklch(14% .006 80/.5) 63% 88%,#0000 89%)}.story-print-paper{aspect-ratio:4/3;border:.9rem solid var(--story-paper);width:min(30rem,86vw);box-shadow:var(--shadow-lg);border-bottom-width:2.6rem;display:block;overflow:hidden}.story-print .story-print-paper img{aspect-ratio:auto;width:100%;height:100%;box-shadow:none;border:0}@media (prefers-reduced-motion:no-preference){.story-tape-deck.is-inserting{animation:story-eject .45s var(--ease-out-soft) both}.story-vhs-set{animation:story-tube-on .6s var(--ease-out-soft) both}}@media (prefers-reduced-motion:reduce){.story-tape-deck.is-inserting{opacity:0}}@keyframes story-eject{to{opacity:0;transform:translateY(.5rem)scale(.985)}}@keyframes story-tube-on{0%{opacity:0}to{opacity:1}}.story-tape-deck{flex-direction:column;align-items:center;gap:3rem;display:flex}.story-experience{width:min(52rem,92vw);padding-top:4rem}@media (prefers-reduced-motion:no-preference){.story-experience{animation:story-experience-in 1.2s var(--ease-out-soft) both}}@keyframes story-experience-in{0%{opacity:0;transform:translateY(.6rem)}to{opacity:1;transform:none}}.story-vhs-set{position:relative}.story-vhs-glow{pointer-events:none;background:radial-gradient(ellipse 72% 68% at 50% 50%, var(--story-glow) 0%, color-mix(in oklch, var(--story-glow) 40%, transparent) 45%, transparent 72%);transition:opacity var(--dur-slow) var(--ease-out-soft);position:absolute;inset:-9%}@media (prefers-reduced-motion:no-preference){.story-vhs-glow{animation:story-vhs-glow-breathe 3.4s var(--ease-out-soft) infinite, story-vhs-glow-flick .14s steps(2) infinite}}@keyframes story-vhs-glow-breathe{50%{opacity:.78}}@keyframes story-vhs-glow-flick{50%{opacity:.92}}.is-paused .story-vhs-glow{opacity:.3;animation:none}.story-vhs-screen{appearance:none;cursor:pointer;aspect-ratio:4/3;background:var(--story-crt-black);width:min(52rem,92vw);box-shadow:var(--shadow-lg), 0 0 22px color-mix(in oklch, var(--story-glow) 90%, transparent), 0 0 72px color-mix(in oklch, var(--story-glow) 60%, transparent);isolation:isolate;transition:box-shadow var(--dur-slow) var(--ease-out-soft);border:0;padding:0;display:block;position:relative;overflow:hidden}.is-paused .story-vhs-screen{box-shadow:var(--shadow-lg)}.story-vhs-screen:focus-visible{outline:2px solid var(--accent-ring);outline-offset:4px}.is-paused .story-vhs-frame,.is-paused .story-vhs-ghost,.is-paused .story-vhs-bloom{animation-play-state:paused}.story-vhs-transport{animation:6s steps(60,end) infinite story-vhs-wobble,7.3s steps(2,end) infinite story-vhs-slip;position:absolute;inset:0}@keyframes story-vhs-wobble{0%,to{transform:translateY(0)skew(0)}18%{transform:translateY(2.4px)skew(.22deg)}41%{transform:translateY(-2px)skew(-.18deg)}66%{transform:translateY(1.6px)skew(.16deg)}83%{transform:translateY(-2.6px)skew(-.12deg)}}@keyframes story-vhs-slip{0%,96.5%,to{translate:0}97%{translate:0 13px}98.5%{translate:0 -6px}}.story-vhs-frame{object-fit:cover;filter:saturate(.32)contrast(1.02)brightness(.66)blur(1.5px)sepia(.35);width:100%;height:100%;animation:story-vhs-pan 16s var(--ease-out-soft) both;position:absolute;inset:0}@keyframes story-vhs-pan{0%{transform:scale(1.18)translate(-1.5%)}to{transform:scale(1.18)translate(1.5%)}}.story-vhs-ghost{object-fit:cover;mix-blend-mode:screen;opacity:.4;width:100%;height:100%;animation:story-vhs-pan 16s var(--ease-out-soft) both;position:absolute;inset:0}.story-vhs-ghost.is-r{filter:saturate(3)sepia()hue-rotate(-45deg)brightness(.5)blur(3px);translate:5px}.story-vhs-ghost.is-c{filter:saturate(3)sepia()hue-rotate(160deg)brightness(.45)blur(3px);translate:-5px}.story-vhs-bloom{object-fit:cover;mix-blend-mode:screen;opacity:.55;filter:brightness(1.55)contrast(2.3)saturate(.18)blur(9px);width:100%;height:100%;animation:story-vhs-pan 16s var(--ease-out-soft) both;position:absolute;inset:0}.story-vhs-frame.is-bleed{filter:saturate(.3)contrast(1.3)brightness(.5)blur(1.4px)sepia(.4);animation:.18s steps(2,end) infinite story-vhs-bleed-shake}@keyframes story-vhs-bleed-shake{0%,to{transform:scale(1.14)translateY(0)}50%{transform:scale(1.14)translateY(-3px)}}.story-vhs-grain{mix-blend-mode:screen;opacity:.3;filter:blur(.6px);pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.story-vhs-scanlines{pointer-events:none;background:repeating-linear-gradient(#0000 0 2px,oklch(0% 0 0/.28) 2px 3px);position:absolute;inset:0}.story-vhs-flicker{pointer-events:none;background:oklch(100% 0 0/.05);animation:.12s steps(2,end) infinite story-vhs-flick;position:absolute;inset:0}@keyframes story-vhs-flick{50%{opacity:.5}}.story-vhs-vignette{pointer-events:none;background:radial-gradient(75% 65%,#0000 46%,oklch(0% 0 0/.62) 100%);position:absolute;inset:0}.story-vhs-dropout{filter:blur(.4px);opacity:0;background:linear-gradient(90deg,#0000 0%,oklch(100% 0 0/.7) 12%,oklch(100% 0 0/.15) 45%,oklch(100% 0 0/.8) 70%,#0000 100%);height:2px;animation:3.1s step-end infinite story-vhs-dropout;position:absolute;top:22%;left:0;right:0}.story-vhs-dropout.is-second{animation:4.3s step-end infinite reverse story-vhs-dropout;top:61%}@keyframes story-vhs-dropout{0%,to{opacity:0}31%{opacity:.9;top:22%}32%{opacity:0}68%{opacity:.7;top:74%}69.5%{opacity:0}}.story-vhs-headswitch{background:repeating-linear-gradient(90deg,oklch(100% 0 0/.14) 0 7px,oklch(0% 0 0/.6) 7px 11px,oklch(100% 0 0/.05) 11px 23px);height:12px;animation:90ms steps(3,end) infinite story-vhs-head;position:absolute;bottom:0;left:0;right:0;transform:skew(-20deg)}@keyframes story-vhs-head{50%{transform:skew(-20deg)translate(-8px)}}.story-vhs-band{filter:blur(1px);opacity:.3;background:repeating-linear-gradient(90deg,oklch(100% 0 0/.25) 0 3px,oklch(0% 0 0/.5) 3px 5px,oklch(100% 0 0/.1) 5px 9px);height:42px;animation:13s linear infinite story-vhs-band-crawl;position:absolute;left:0;right:0}.is-bleeding .story-vhs-band{opacity:.8;animation:1.9s linear both story-vhs-band-drift}@keyframes story-vhs-band-crawl{0%{top:104%}to{top:-10%}}@keyframes story-vhs-band-drift{0%{top:100%}to{top:-10%}}.story-vhs-blue{background:var(--story-vcr-blue);position:absolute;inset:0}.story-vhs-osd{pointer-events:none;font-family:var(--font-mono-stack);color:var(--story-osd-ink);opacity:.8;filter:blur(1.3px);text-shadow:1px 1px 0 oklch(0% 0 0/.8), 3px 0 4px var(--story-osd-r), -3px 0 4px var(--story-osd-c), 5px 0 7px oklch(100% 0 0/.32), -5px 0 7px oklch(100% 0 0/.26), 8px 0 14px oklch(100% 0 0/.14), 0 0 12px var(--story-osd-glow), 0 0 28px var(--story-osd-glow);letter-spacing:.18em;font-weight:700;animation:.28s steps(2,end) infinite story-vhs-osd-shiver;position:absolute;inset:0}@keyframes story-vhs-osd-shiver{50%{opacity:.7;filter:blur(1.5px)}}.story-vhs-osd-mode{font-size:1.3rem;position:absolute;top:1.2rem;left:1.5rem}.story-vhs-osd-date{font-variant-numeric:tabular-nums;font-size:1.1rem;position:absolute;bottom:1.4rem;right:1.5rem}.story-vhs-osd-counter{font-variant-numeric:tabular-nums;font-size:1.1rem;position:absolute;top:1.2rem;right:1.5rem}.story-vhs-snow{width:100%;height:100%;image-rendering:pixelated;position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.story-vhs-transport,.story-vhs-frame,.story-vhs-ghost,.story-vhs-bloom,.story-vhs-flicker,.story-vhs-headswitch,.story-vhs-dropout,.story-vhs-band,.story-vhs-osd,.story-vhs-frame.is-bleed{animation:none}.story-vhs-dropout{opacity:0}.is-bleeding .story-vhs-band{animation:none;top:30%}}