@font-face{font-family:Permanent Marker;font-weight:400;font-display:swap;src:url(/fonts/permanent-marker-latin-400-normal.woff2) format("woff2")}@font-face{font-family:Caveat;font-weight:500;font-display:swap;src:url(/fonts/caveat-latin-500-normal.woff2) format("woff2")}@font-face{font-family:Caveat;font-weight:600;font-display:swap;src:url(/fonts/caveat-latin-600-normal.woff2) format("woff2")}@font-face{font-family:Barlow Semi Condensed;font-weight:500;font-display:swap;src:url(/fonts/barlow-semi-condensed-latin-500-normal.woff2) format("woff2")}@font-face{font-family:Barlow Semi Condensed;font-weight:600;font-display:swap;src:url(/fonts/barlow-semi-condensed-latin-600-normal.woff2) format("woff2")}@font-face{font-family:Barlow Semi Condensed;font-weight:700;font-display:swap;src:url(/fonts/barlow-semi-condensed-latin-700-normal.woff2) format("woff2")}@font-face{font-family:Barlow Semi Condensed;font-weight:800;font-display:swap;src:url(/fonts/barlow-semi-condensed-latin-800-normal.woff2) format("woff2")}@font-face{font-family:Michroma;font-weight:400;font-display:swap;src:url(/fonts/michroma-latin-400-normal.woff2) format("woff2")}@font-face{font-family:Caveat;font-weight:400;font-display:swap;src:url(/fonts/caveat-latin-400-normal.woff2) format("woff2")}:root{color-scheme:dark;--canvas: #0d0a08;--paper: #fbf9f2;--paper-dim: #c9c2b6;--rule-room: rgba(201, 194, 182, .24);--head: #c8321f;--head-pressed: #b52c1f;--on-head: #fbefe0;--head-edge: #9a2617;--postit: #f6e56b;--walkman: #f3c419;--stamp-ink: #be281e;--tab: #f1e9cf;--tab-low: #e6dbb9;--on-tab: #3a2e18;--lamp: rgba(255, 207, 152, .07);--marker: "Permanent Marker", "Comic Sans MS", cursive;--pen: "Caveat", "Segoe Print", cursive;--print: "Barlow Semi Condensed", "Arial Narrow", sans-serif;--gutter: clamp(16px, 5vw, 80px);--measure: 1200px}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{margin:0;background:var(--canvas);color:var(--paper);font:500 19px/1.45 var(--print);overflow-x:hidden}img{display:block;max-width:100%;height:auto}a{color:inherit}:focus-visible{outline:2px solid var(--postit);outline-offset:3px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.skip{position:absolute;left:16px;top:-60px;z-index:20;padding:10px 14px;background:var(--tab);color:var(--on-tab);font:700 14px/1 var(--print);text-decoration:none}.skip:focus{top:16px}.top{position:absolute;inset:0 0 auto;z-index:5;display:flex;align-items:center;gap:28px;padding:max(16px,env(safe-area-inset-top)) var(--gutter) 16px}.mark{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:400 26px/1 var(--marker);color:var(--paper)}.mark svg{width:32px;height:32px}.top nav{display:flex;gap:24px;margin-left:auto}.top nav a{font:600 14px/1 var(--print);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--paper-dim);padding:8px 0}.top nav a:hover{color:var(--paper)}.tab{display:inline-block;padding:9px 14px 10px;background:linear-gradient(180deg,var(--tab),var(--tab-low));color:var(--on-tab);font:700 13px/1 var(--print);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-radius:1px;box-shadow:0 4px 10px #00000073,inset 0 -1px #00000014;transform:rotate(-1deg);transition:transform .15s ease}.tab:hover{transform:rotate(-1deg) translateY(-1px)}.rec{display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 26px 0 22px;background:var(--head);color:var(--on-head);font:700 17px/1 var(--print);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:3px;box-shadow:0 4px 0 var(--head-edge),0 10px 22px #00000073;transition:transform .08s ease,box-shadow .08s ease,background-color .12s ease}.rec .dot{width:14px;height:14px;border-radius:50%;background:var(--on-head);flex:none}.rec:hover{background:var(--head-pressed)}.rec:active{transform:translateY(3px);box-shadow:0 1px 0 var(--head-edge),0 4px 10px #00000073}.rec.small{min-height:48px;padding:0 20px 0 18px;font-size:15px}.rec.small .dot{width:12px;height:12px}.fine{margin:0;font:500 15px/1.3 var(--print);color:var(--paper-dim)}.hero{position:relative;display:flex;flex-direction:column}.hero-pic img{width:100%;height:auto}.hero-copy{position:relative;padding:0 var(--gutter) 40px;margin-top:-64px}.hero h1{margin:0 0 18px;font:400 clamp(46px,12vw,96px) / .98 var(--marker);color:var(--paper);text-wrap:balance}.lede{max-width:33em;margin:0 0 26px;color:var(--paper-dim);font-size:19px;line-height:1.45;text-wrap:pretty}.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}@media(max-width:1099px){.hero-pic{position:relative;display:block;overflow:hidden}.hero-pic img{width:100%;height:100%;object-fit:cover}.hero-pic:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,#0d0a088c,#0d0a0800 18%),linear-gradient(to top,var(--canvas) 2%,rgba(13,10,8,0) 34%)}}@media(max-width:699px){.hero-pic{height:min(58svh,125vw)}.hero-pic img{object-position:50% 30%}}@media(min-width:700px)and (max-width:1099px){.hero-pic{height:min(60svh,56.25vw)}.hero-pic img{object-position:75% 50%}.hero-copy{margin-top:-48px}}@media(max-width:999px){.top nav{display:none}.top .tab{margin-left:auto}}@media(max-width:699px){.top .tab{display:none}}@media(min-width:1100px){.hero{min-height:min(100svh,980px);justify-content:center}.hero-pic{position:absolute;inset:0}.hero-pic img{width:100%;height:100%;object-fit:cover;object-position:72% 50%}.hero-pic:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0d0a08e6,#0d0a08cc 36%,#0d0a0800 60%),linear-gradient(to top,var(--canvas) 0%,rgba(13,10,8,0) 22%)}.hero-copy{margin:0;padding:96px var(--gutter);max-width:calc(540px + 2 * var(--gutter))}.hero h1{text-shadow:0 2px 18px rgba(0,0,0,.55)}}.how,.questions{max-width:var(--measure);margin:0 auto;padding:96px var(--gutter)}.how>h2,.questions>h2,.copy h2{margin:0 0 22px;font:400 clamp(36px,4.4vw,58px) / 1.02 var(--marker);color:var(--paper);text-wrap:balance}.how>h2,.questions>h2{margin-bottom:40px}.sides{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(32px,6vw,96px)}.side{position:relative;padding-left:clamp(52px,6vw,80px)}.side .letter{position:absolute;left:0;top:2px;font:800 clamp(46px,5.2vw,68px) / 1 var(--print);color:var(--head)}.lines{margin:0;padding:0;list-style:none;counter-reset:line var(--start, 0);font:500 clamp(24px,2.2vw,30px) / 1.2 var(--pen);color:var(--paper)}.lines li{counter-increment:line;padding:8px 0 12px;border-bottom:1px solid var(--rule-room)}.lines li:before{content:counter(line) ". ";content:counter(line) ". " / "";color:var(--paper-dim)}ol.lines[start="4"]{--start: 3}.stills{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin:80px 0 0;padding:0;list-style:none}.stills figure{margin:0}.stills img{width:100%;border-radius:2px}.stills figcaption{margin-top:14px;font:700 13px/1 var(--print);letter-spacing:.12em;text-transform:uppercase;color:var(--paper-dim)}.phone,.djs{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px;max-width:1080px;margin:0 auto;padding:96px var(--gutter)}.copy p{max-width:30em;margin:0 0 16px;color:var(--paper-dim);text-wrap:pretty}.copy .rec{margin-top:14px}.handset{justify-self:center;width:280px}.handset img{border-radius:36px}.arrives{position:relative;max-width:1600px;margin:0 auto}.arrives-pic{position:relative;display:block}.arrives-pic img{width:100%}.arrives-pic:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,var(--canvas) 0%,rgba(13,10,8,0) 16%),linear-gradient(to top,var(--canvas) 0%,rgba(13,10,8,0) 30%),linear-gradient(90deg,#0d0a08d9,#0d0a088c 30%,#0d0a0800 55%);pointer-events:none}.arrives .copy{position:absolute;z-index:1;left:var(--gutter);bottom:12%;max-width:470px}.copy .rights{font:500 25px/1.2 var(--pen);color:var(--paper-dim)}.c90{justify-self:center;display:grid;justify-items:center;gap:10px;margin:0}.c90-num{font:400 clamp(120px,17vw,230px) / .9 var(--marker);color:var(--walkman)}.c90-side{font:700 15px/1 var(--print);letter-spacing:.12em;text-transform:uppercase;color:var(--paper-dim)}.questions dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:36px clamp(32px,6vw,96px)}.questions dt{font:700 20px/1.25 var(--print);color:var(--paper)}.questions dd{margin:6px 0 0;font:500 18px/1.45 var(--print);color:var(--paper-dim)}.send{padding:96px var(--gutter) 140px;background:radial-gradient(ellipse 60% 70% at 50% 45%,var(--lamp),transparent 70%)}.send .label{position:relative;max-width:760px;margin:0 auto}.send .to{display:flex;align-items:baseline;gap:18px;margin:0 0 36px}.to-word{font:700 22px/1 var(--print);letter-spacing:.08em;color:var(--paper-dim)}.to-name{flex:1;padding-bottom:6px;border-bottom:2px solid var(--rule-room);font:400 clamp(44px,8vw,88px) / 1.05 var(--marker);color:var(--paper)}.label-body{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}.stamp{position:absolute;right:2%;top:-12%;color:var(--stamp-ink);font:800 clamp(34px,6vw,56px) / 1 var(--print);letter-spacing:.08em;transform:rotate(-14deg);pointer-events:none}.label.waiting .stamp{opacity:0;transform:rotate(-14deg) scale(1.6)}.label.stamped .stamp{transition:transform .18s cubic-bezier(.3,1.6,.5,1),opacity .12s}.foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px;padding:40px var(--gutter) max(40px,env(safe-area-inset-bottom));border-top:1px solid rgba(251,249,242,.12)}.foot .mark{font-size:24px}.foot nav{display:flex;flex-wrap:wrap;gap:8px 22px}.foot nav a{font:600 14px/1 var(--print);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--paper-dim);padding:8px 0}.foot nav a:hover{color:var(--paper)}.foot p{margin:0 0 0 auto;font-size:15px;color:var(--paper-dim)}.dock{position:fixed;left:16px;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:10;justify-content:center}.dock[hidden]{display:none}@media(max-width:899px){.how{padding-top:64px;padding-bottom:72px}.sides{grid-template-columns:1fr;row-gap:28px}.stills{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82%;gap:16px;margin:48px calc(-1 * var(--gutter)) 0;padding:0 var(--gutter) 28px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter)}.stills li{scroll-snap-align:start}.phone,.djs{grid-template-columns:1fr;gap:40px;padding:72px var(--gutter)}.handset{width:min(240px,64vw)}.handset img{border-radius:30px}.arrives{display:flex;flex-direction:column}.arrives .copy{position:relative;left:auto;bottom:auto;padding:0 var(--gutter);margin-top:-24px}.arrives-pic:after{background:linear-gradient(to bottom,var(--canvas) 0%,rgba(13,10,8,0) 18%),linear-gradient(to top,var(--canvas) 0%,rgba(13,10,8,0) 30%)}.questions dl{grid-template-columns:1fr;gap:28px}.questions{padding-top:72px;padding-bottom:72px}.send{padding-bottom:140px}.foot p{margin-left:0;width:100%}}@media(min-width:900px){.dock{display:none}}.on-phone{display:none}@media(max-width:699px)and (pointer:coarse){.on-desk{display:none}.on-phone{display:revert}main{display:flex;flex-direction:column}.phone{order:-1}.hero{order:-2}}.say{margin:0 0 10px;font:800 14px/1.1 var(--print);letter-spacing:.1em;text-transform:uppercase;color:var(--paper-dim)}#scene,.story,.story-track,.counter,.scroll-hint{display:none}html.live{scroll-behavior:auto}html.live:not(.ready){overflow:hidden}html.live:not(.ready) main,html.live:not(.ready) .foot{visibility:hidden}@keyframes loading-dots{50%{opacity:.35}}html.live:not(.ready):after{content:"Loading the tape";position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);font:700 12px/1 var(--print);letter-spacing:.2em;text-transform:uppercase;color:var(--paper-dim);animation:loading-dots 1.2s ease-in-out infinite}html.live #scene{display:block;position:fixed;inset:0;width:100%;height:100%;z-index:0}html.live .top{position:fixed;z-index:6}html.live main,html.live .foot{position:relative;z-index:2}html.live .foot{background:var(--canvas)}html.storied .hero,html.storied .how,html.storied .phone,html.storied .arrives,html.storied .djs{display:none}html.storied .story-track{display:block}html.storied .story{display:block;position:fixed;inset:0;z-index:1;pointer-events:none}.beat{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) 36vw minmax(0,1fr);align-items:center;padding:0 clamp(28px,6vw,120px);visibility:hidden}.beat.on{visibility:visible}.beat-say{grid-column:1;justify-self:start;max-width:24vw}.beat-say h1,.beat-say h2,.beat-say h3{margin:0;font:400 clamp(32px,3.5vw,58px) / 1.02 var(--marker);letter-spacing:0;text-transform:none;color:var(--paper);text-wrap:balance}.kicker{margin:0 0 14px;font:800 13px/1 var(--print);letter-spacing:.16em;text-transform:uppercase;color:var(--head)}.beat-copy{grid-column:3;justify-self:end;width:min(300px,21vw)}.beat-copy p,.beat-copy .lede{max-width:none;margin:0 0 14px;font:500 clamp(16px,1.3vw,20px) / 1.42 var(--print);color:var(--paper)}.beat-copy .rights{font:500 clamp(19px,1.5vw,23px) / 1.2 var(--pen);color:var(--paper-dim)}.beat-copy .lines{font-size:clamp(19px,1.55vw,24px)}.beat-copy .lines li{padding:7px 0 9px}.beat-copy .cta-row{margin-top:22px;gap:12px}.beat-copy .rec{margin-top:10px}.beat-copy .fine{font-size:13.5px;margin:0}.beat .kicker,.beat .lines li:before{opacity:var(--on, 0)}.beat .lines li{border-bottom-color:rgba(201,194,182,calc(.24 * var(--on, 0)))}.beat .w{display:inline-block;white-space:nowrap}.beat .w>span{opacity:0}html.live .counter,html.live .scroll-hint{display:flex;position:fixed;z-index:5;bottom:max(22px,env(safe-area-inset-bottom));margin:0;font:700 11px/1 var(--print);letter-spacing:.18em;text-transform:uppercase;color:var(--paper-dim);transition:opacity .4s ease}html.live .counter{right:clamp(28px,6vw,120px);align-items:center;gap:10px}.counter b{padding:5px 7px 4px;background:#050505;color:var(--paper);font:400 13px/1 "Michroma",var(--print);letter-spacing:.22em;border-radius:2px}html.live .scroll-hint{left:50%;transform:translate(-50%)}.counter.off,.scroll-hint.off{opacity:0}html.live-phone .beat{grid-template-columns:minmax(0,1fr);grid-template-rows:47svh auto auto;align-items:start;align-content:start;padding:0 var(--gutter)}html.live-phone .beat-say{grid-column:1;grid-row:2;max-width:none}html.live-phone .beat-say h1,html.live-phone .beat-say h2,html.live-phone .beat-say h3{font-size:clamp(30px,9vw,42px)}html.live-phone .beat-copy{grid-column:1;grid-row:3;justify-self:start;width:auto;margin-top:14px}html.live-phone .beat-copy p,html.live-phone .beat-copy .lede{font-size:16.5px;margin-bottom:10px}html.live-phone .beat-copy .lines{font-size:20px}html.live-phone .beat-copy .lines li{padding:4px 0 6px}html.live-phone .scroll-hint{display:none}html.live-phone .counter{top:max(22px,env(safe-area-inset-top));bottom:auto;right:var(--gutter)}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.rec,.tab,.label.stamped .stamp{transition:none}.label.waiting .stamp{opacity:1;transform:rotate(-14deg)}}
