/* The company cast, DreamBook ink, and a book that leaves room to write. */
@font-face{font-family:'Berkshire Swash';src:url('/fonts/BerkshireSwash-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.referral-page{--paper:#fff;--referral-ink:#343f58;background:var(--paper);color:var(--referral-ink)}
.referral-page .header{background:#fff}
.referral-page h1,.referral-page h2{letter-spacing:-.015em}
.referral-page h3{font:1.45rem/1.3 var(--font-display);color:var(--navy)}
.referral-page .eyebrow{font-size:.72rem;letter-spacing:.065em}
.referral-page .header #navigation a[aria-current=page]{text-decoration-color:var(--gold)!important}
/* Keep both illustrated placards still, with instant, understated state feedback. */
.referral-page .art-button{mix-blend-mode:multiply;transform:none;transition:none}
.referral-page .art-button::before{transition-property:none}
.referral-page [hidden]{display:none!important}
.referral-hero{padding-top:24px;overflow:hidden}
.referral-hero-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:12px;padding-block:35px 30px}
.referral-hero h1{font-size:clamp(2.7rem,3.9vw,3.5rem);line-height:1.13;max-width:590px}
.referral-hero h1 span{display:inline-block;position:relative;isolation:isolate}
.referral-hero h1 span:after{content:'';position:absolute;inset:auto -4px 2px;height:9px;background:var(--gold);border-radius:50%;transform:rotate(-2deg);z-index:-1}
.referral-intro{max-width:450px;margin-block:24px 21px;font-size:1rem;line-height:1.9}
.referral-hero-note{font-size:.74rem;line-height:1.8;margin-top:16px;color:var(--referral-ink);max-width:400px}
.referral-hero-art{width:113%;margin-left:-3%;align-self:center}
.referral-hero-art img{width:100%;height:auto;aspect-ratio:3/2}
.referral-hero-art figcaption{text-align:center;font-size:.8rem;font-style:italic;margin-top:10px}
@media(min-width:701px) and (max-width:1350px){.referral-hero-art{width:100%;margin-left:0}}
.referral-offer-lettering{display:flex;justify-content:center;padding-block:5px 12px}
.referral-offer-lettering h2{width:min(430px,80vw);margin:0}
.referral-offer-lettering img{display:block;width:100%;height:auto}
.referral-how{padding-block:32px 80px}
.referral-section-heading{text-align:center}
.referral-section-heading h2{font-size:clamp(2rem,3vw,2.8rem)}
.referral-section-heading>p:last-child{margin:16px auto 0;max-width:550px;font-size:.9rem;line-height:1.9}
.referral-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px;list-style:none;padding:0;margin:36px 0 0}
.referral-steps>li{min-width:0}
.referral-step-art{width:250px;max-width:100%;margin:0 auto 18px}
.referral-step-art img{width:100%;height:auto;display:block}
.referral-step-copy{position:relative;padding-top:18px;border-top:1px solid #dbe2ee}
.referral-step-number{position:absolute;right:0;top:15px;color:var(--navy);font:.78rem/1.8 var(--font-display)}
.referral-step-copy h3{font-size:1.3rem;padding-right:35px}
.referral-step-copy p{margin-top:12px;font-size:.84rem;line-height:1.9}
.referral-form-section{padding-block:66px 62px;scroll-margin-top:20px;border-top:1px solid #e4eaf2}
.referral-letter{position:relative;aspect-ratio:3/2;margin-top:20px;isolation:isolate}
.referral-book-art{position:absolute;inset:0;z-index:-1}
.referral-book-art img{display:block;width:100%;height:100%;object-fit:contain}
.referral-mobile-companion{display:none}
.referral-book-content{position:absolute;inset:29% 16% 16% 13%;min-width:0}
.referral-book-content fieldset{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:15%;row-gap:20px;padding:0;margin:0;border:0;min-width:0}
.referral-field{min-width:0}
.referral-page-kicker,.referral-field .referral-page-kicker{font:.63rem/1.6 var(--font-display);letter-spacing:.1em;color:#655434;margin:0 0 12px}
.referral-field label{display:block;font:clamp(1rem,1.45vw,1.25rem)/1.35 var(--font-display);color:var(--navy);margin-bottom:18px}
.referral-field input{display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;border:1.5px solid #7182a8;border-radius:8px 10px 8px 7px;padding:13px 14px;min-height:54px;color:#27334a;background:#fffdf5;font:1rem/1.5 var(--font-body);outline:2px solid transparent;outline-offset:3px;box-shadow:inset 0 2px 4px #65543406,0 0 0 0 #f6cc6b00;transition:border-color 360ms cubic-bezier(.4,0,.2,1),outline-color 360ms cubic-bezier(.4,0,.2,1),box-shadow 360ms cubic-bezier(.4,0,.2,1),background-color 360ms cubic-bezier(.4,0,.2,1);scroll-margin-block:100px}
.referral-field input::placeholder{color:#6b7590;opacity:1}
.referral-field input:hover{border-color:var(--navy)}
.referral-field input:focus{outline-color:var(--navy);border-color:var(--navy);box-shadow:0 0 0 7px #f6cc6b44,inset 0 1px 2px #65543406;background:#fff}
.referral-field input[aria-invalid=true]{border-color:#9c3247}
.referral-field p:not(.referral-page-kicker){font-size:.71rem;line-height:1.8;color:#50596b;margin-top:9px}
.referral-book-action{min-width:0}
.referral-submit{width:100%;max-width:265px;min-width:0;font-size:.9rem}
.referral-privacy{font-size:.65rem;line-height:1.85;color:#50596b;margin-top:15px;max-width:300px}
.referral-error{font-size:.73rem;color:#933044;margin:0 0 13px;line-height:1.6}
.referral-book-note{max-width:210px;padding:3px 14px 0 0}
.referral-note-rule{display:block;width:38px;height:3px;border-radius:50%;background:#e8ae25;margin-bottom:13px;transform:rotate(-3deg)}
.referral-book-note p{font:1.05rem/1.5 var(--font-display);color:var(--navy)}
.referral-book-note small{display:block;font-size:.69rem;line-height:1.85;margin-top:12px;max-width:170px;color:#50596b}
.referral-unavailable{font-size:.76rem;line-height:1.7;color:var(--navy);margin-top:12px;max-width:300px}
.referral-receipt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16%}
.referral-receipt h3{font-size:1.65rem;margin-bottom:16px;outline:none}
.referral-receipt p:not(.referral-page-kicker){font-size:.8rem;line-height:1.85}
.referral-receipt-addresses{margin-top:18px;font-size:.7rem;line-height:1.6}
.referral-receipt-addresses dt{font-family:var(--font-display);color:var(--navy);margin-top:8px}
.referral-receipt-addresses dd{overflow-wrap:anywhere;margin:3px 0 0}
.referral-back{display:block;cursor:pointer;font:.74rem/1.7 var(--font-body);margin-top:15px;min-height:44px;text-align:left}
.referral-receipt-next{max-width:245px}
.referral-receipt-next a{display:inline-flex;align-items:center;min-height:44px;font-size:.73rem;margin-top:13px}
.referral-closing{background:var(--sky);padding-block:52px 55px;overflow:hidden}
.referral-closing-layout{display:flex;align-items:center;justify-content:space-between;gap:50px;max-width:950px}
.referral-closing h2{font-size:clamp(2rem,3.4vw,3.1rem)}
.referral-closing p:not(.eyebrow){font-size:.9rem;line-height:1.8;margin-top:18px}
.referral-closing .app-store-badge{display:inline-flex;margin-top:26px;min-height:60px;align-items:center}
.referral-closing .app-store-badge img{width:180px;height:60px;display:block;object-fit:contain}
.referral-closing p.referral-device-note{font-size:.7rem;margin-top:11px}
.referral-closing-art{width:240px;flex:none;transform:rotate(3deg)}
.referral-closing-art img{display:block;width:100%;height:auto}
.referral-page .site-footer{background:#fff;padding-top:50px}
@media(min-width:1101px) and (max-width:1300px){.header #navigation{gap:8px;font-size:.74rem}.header{gap:17px}.header #navigation a{padding-inline:4px}}
@media(min-width:1050px) and (max-width:1190px){.referral-book-content{inset:28% 16% 13% 13%}.referral-book-content fieldset{gap:12px 15%}.referral-field label{margin-bottom:12px}.referral-field .referral-page-kicker{margin-bottom:8px}.referral-book-note{max-width:200px}.referral-privacy{font-size:.62rem}.referral-book-note small{font-size:.63rem;max-width:140px}.referral-receipt h3{font-size:1.4rem}.referral-receipt p:not(.referral-page-kicker){font-size:.72rem}.referral-receipt-next{max-width:200px}}
@media(max-width:1049px){
 .referral-letter{aspect-ratio:auto;max-width:580px;margin:100px auto 32px;padding:40px 42px;background:#fff8e7;border:3px solid var(--navy);border-radius:10px 24px 13px 9px;box-shadow:4px 5px 0 #ecdab9,6px 7px 0 var(--navy),9px 11px 0 #fff8e7,11px 13px 0 var(--navy)}
 .referral-letter:before{content:'';position:absolute;inset:10px;border:1px solid #d9b977;border-radius:4px 16px 6px 4px;pointer-events:none;z-index:-1}
 .referral-letter:after{content:'';position:absolute;top:-3px;right:24px;width:23px;height:42px;background:var(--sky);clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%);z-index:-1}
 .referral-book-art{display:none}
 .referral-mobile-companion{display:block;position:absolute;width:115px;height:115px;top:-98px;left:22px;z-index:-1}
 .referral-mobile-companion img{display:block;width:100%;height:auto}
 .referral-book-content{position:static}
 .referral-book-content fieldset{grid-template-columns:1fr;gap:25px}
 .referral-field label{font-size:1.15rem;margin-bottom:13px}
 .referral-page-kicker,.referral-field .referral-page-kicker{margin-bottom:8px}
 .referral-field p:not(.referral-page-kicker){font-size:.74rem}
 .referral-submit{width:100%;max-width:300px}
 .referral-privacy{max-width:none;font-size:.7rem}
 .referral-book-note{max-width:none;padding:18px 0 0;border-top:1px solid #dac698}
 .referral-note-rule{display:none}
 .referral-book-note p{display:none}
 .referral-book-note small{max-width:none;margin:0;font-size:.7rem}
 .referral-receipt{display:block}
 .referral-receipt-next{max-width:none;margin-top:25px;padding-top:25px;border-top:1px solid #dac698}
 .referral-receipt-addresses{font-size:.8rem}
 .referral-unavailable{max-width:none}
 .referral-steps{gap:30px}
 .referral-step-copy h3{font-size:1.16rem}
}
@media(max-width:700px){
 .referral-page .wrap{width:calc(100% - 40px)}
 .referral-hero{padding-top:10px}
 .referral-hero-layout{grid-template-columns:1fr;gap:23px;padding-block:18px 18px}
 .referral-hero-copy{text-align:center}
 .referral-hero h1{font-size:clamp(2.5rem,8.3vw,3.7rem);max-width:500px;margin-inline:auto}
 .referral-hero h1 br{display:none}
 .referral-intro{font-size:.91rem;max-width:460px;margin:22px auto 18px}
 .referral-hero-note{font-size:.69rem;max-width:270px;margin:12px auto 0}
 .referral-hero-art{width:106%;margin-left:-3%}
 .referral-hero-art figcaption{margin-top:7px;font-size:.72rem}
 .referral-offer-lettering{padding-block:14px 22px}
 .referral-how{padding-block:14px 47px}
 .referral-section-heading h2{font-size:2.15rem}
 .referral-section-heading>p:last-child{font-size:.83rem}
 .referral-steps{grid-template-columns:1fr;gap:28px;margin-top:30px}
 .referral-steps>li{display:grid;grid-template-columns:130px minmax(0,1fr);gap:17px;align-items:center}
 .referral-step-art{width:140px;max-width:none;margin:0 0 0 -10px}
 .referral-step-copy{padding-top:13px}
 .referral-step-copy h3{font-size:1.08rem;padding-right:25px}
 .referral-step-copy p{font-size:.75rem;line-height:1.85;margin-top:10px}
 .referral-step-number{font-size:.61rem;top:12px}
 .referral-form-section{padding-block:45px 42px}
 .referral-letter{padding:32px 26px;margin-right:8px;margin-top:92px}
 .referral-field label{font-size:1rem}
 .referral-field p:not(.referral-page-kicker){font-size:.7rem}
 .referral-privacy,.referral-book-note small{font-size:.66rem}
 .referral-closing{padding-block:40px 43px}
 .referral-closing-layout{gap:15px;position:relative;align-items:flex-end}
 .referral-closing h2{font-size:2.1rem;max-width:310px}
 .referral-closing h2 br{display:none}
 .referral-closing p:not(.eyebrow){font-size:.8rem}
 .referral-closing .eyebrow{font-size:.65rem}
 .referral-closing-art{position:absolute;width:120px;right:-12px;bottom:3px;pointer-events:none}
 .referral-closing .app-store-badge{margin-top:25px}
 .referral-closing p.referral-device-note{font-size:.66rem}
}
@media(max-width:380px){.referral-steps>li{grid-template-columns:100px minmax(0,1fr);gap:14px}.referral-step-art{width:115px}.referral-step-copy h3{font-size:1rem}.referral-closing-art{width:95px;right:-5px}}
@media(prefers-reduced-motion:reduce){.referral-page{scroll-behavior:auto}.referral-field input{transition:none}}
.motion-paused .referral-field input{transition:none}

/* The source drawing stays available beneath a retained, locally animated surface. */
.monster-scene{position:relative;isolation:isolate;line-height:0}
.monster-scene>img,.monster-scene>picture,.monster-scene>picture>img{display:block;width:100%;height:auto}
.monster-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.monster-hit{position:absolute;z-index:2;display:block;min-width:44px;min-height:44px;border:0;border-radius:45% 50% 42% 48%;padding:0;background:transparent;color:var(--navy);touch-action:pan-y pinch-zoom;cursor:pointer;outline-offset:3px}
.monster-hit:focus-visible{outline:2px dashed var(--navy);background:#f9b9190d}
.referral-book-art.monster-scene{position:absolute;z-index:-1}
.referral-book-art>picture,.referral-book-art>picture>img{height:100%}
.referral-mobile-companion.monster-scene{position:absolute;z-index:1}
.referral-closing-art.monster-scene{pointer-events:auto}
/* An illustrated coda inside the App Store invitation. */
.referral-closing-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);max-width:1200px;gap:48px;align-items:center}
.referral-sleeping-gang{width:100%;max-width:610px;margin:0;justify-self:end}
.referral-sleeping-gang img{aspect-ratio:3/2}
.referral-sleeping-gang figcaption{text-align:center;font-size:.76rem;font-style:italic;color:#294e86;margin-top:8px}
/* Live lettering inside custom, hand-inked comic balloons. */
.monster-bubble{--speaker-ink:var(--navy);position:fixed;z-index:1000;width:334px;color:#28365b;line-height:1.65;overflow-wrap:break-word;isolation:isolate;max-height:calc(100dvh - 24px);filter:drop-shadow(0 4px 3px #15327116);opacity:1;transition:opacity 600ms ease-in-out}
.monster-bubble[data-fading=true]{opacity:0}
.monster-balloon{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:-1}
.balloon-outline{fill:#fffefb;stroke:#263e7d;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.balloon-accent{fill:none;stroke:var(--speaker-ink);stroke-width:2.8;stroke-linecap:round;opacity:.45;vector-effect:non-scaling-stroke}
.balloon-thoughts{display:none;fill:#fffefb;stroke:#263e7d;stroke-width:1.8}
.monster-bubble-content{padding:23px 32px 52px}
.monster-bubble[data-side=below] .monster-bubble-content{padding-top:51px;padding-bottom:24px}
.monster-bubble-heading{display:flex;justify-content:center;align-items:center;position:relative;margin-bottom:10px}
.monster-bubble-heading>span{font:1.7rem/1.15 'Berkshire Swash',Georgia,serif;color:var(--speaker-ink);letter-spacing:-.015em}
.monster-bubble p{font:italic 1rem/1.65 var(--font-body);text-align:center;margin:0;text-wrap:pretty}
.monster-bubble[data-sleepy=true]{width:280px}
.monster-bubble[data-sleepy=true] .balloon-outline{fill:#eaf2fc;stroke:#7a96be;stroke-width:1.6}
.monster-bubble[data-sleepy=true] .balloon-thoughts{fill:#f5f9ff;stroke:#7a96be}
.monster-bubble[data-sleepy=true] .monster-bubble-content{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:3px;padding:21px 32px 48px}
.monster-bubble[data-sleepy=true] .monster-bubble-heading{margin:0}
.monster-bubble[data-sleepy=true] .monster-bubble-heading>span{font-size:1.6rem}
.monster-bubble[data-sleepy=true][data-side=below] .monster-bubble-content{padding-top:48px;padding-bottom:21px}
.monster-bubble[data-sleepy=true] .balloon-thoughts{display:block}
.monster-bubble[data-sleepy=true] .balloon-accent{opacity:.25}
.monster-snores:empty{display:none}
/* Little cloud sculptures: all shading stays in the SVG; only transforms move. */
.monster-snores{display:grid;height:128px;align-content:center;gap:2px;padding:8px 0 0;text-align:center;translate:0 -4px}
.monster-snore-line{display:flex;justify-content:center;align-items:center;white-space:pre;min-height:1.1em;isolation:isolate}
.monster-snore-line>span{display:inline-flex;flex:0 0 var(--z-width);justify-content:center;align-items:center;line-height:1;transform:rotate(var(--z-tilt));animation:snore-arrives 800ms cubic-bezier(.22,.61,.36,1) var(--z-delay) both}
.cloud-z{display:block;width:calc(1em * var(--z-size));height:calc(1.13em * var(--z-size));overflow:visible;flex:none}
.cloud-z-float{transform-origin:45px 50px;animation:cloud-breathe var(--z-drift) ease-in-out calc(var(--z-delay) * -3) infinite alternate}
.cloud-echo{transform-origin:center;opacity:.6;animation:cloud-whisper 1800ms ease-in-out calc(var(--z-delay) + 310ms) both}
.snore-punctuation{font: .58em/1 var(--font-display);color:#7895bb;opacity:.7}
@keyframes snore-arrives{from{opacity:0;translate:0 8px;scale:.82}to{opacity:1;translate:0 0;scale:1}}
@keyframes cloud-breathe{from{transform:translate(0,2px) rotate(-2deg)}to{transform:translate(1px,-5px) rotate(2deg)}}
@keyframes cloud-whisper{0%{opacity:0;transform:translateY(5px) scale(.55)}35%{opacity:.85}100%{opacity:.3;transform:translateY(-7px) scale(1.1)}}
/* A hand-drawn pillow switch, revealed after the first deliberate sound. */
.referral-sleeping-gang figcaption{display:flex;flex-direction:column;align-items:center;gap:4px}
.sleep-sound-slot{height:44px;display:flex;justify-content:center}
.sleep-sound{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:116px;min-height:44px;padding:0 10px 0 3px;border:0;background:transparent;color:#244b80;cursor:pointer;border-radius:48% 44% 47% 42%;touch-action:manipulation;font: .73rem/1.2 var(--font-body);transition:background-color 420ms ease,color 420ms ease,transform 420ms cubic-bezier(.22,.61,.36,1);animation:sound-unfold 600ms cubic-bezier(.22,.61,.36,1) both}
.sleep-sound svg{width:44px;height:36px;overflow:visible;flex:none;transition:transform 500ms cubic-bezier(.22,.61,.36,1)}
.sound-pillow{fill:#eaf4ff;stroke:#34589b;stroke-width:1.5;transition:fill 500ms ease}
.sound-moon{fill:#f9c341;transform-origin:21px 18px;transition:transform 550ms cubic-bezier(.22,.61,.36,1)}
.sound-eye,.sound-waves,.sound-hush{fill:none;stroke:#34589b;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sound-waves{transform-origin:28px 18px;transition:transform 500ms ease,opacity 420ms ease}
.sound-hush{opacity:0;transform:translateY(3px);transition:transform 500ms ease,opacity 420ms ease}
.sleep-sound[data-state=off] .sound-waves{opacity:0;transform:scale(.45)}
.sleep-sound[data-state=off] .sound-hush{opacity:1;transform:translateY(0)}
.sleep-sound[data-state=off] .sound-moon{transform:rotate(-18deg) translateY(1px)}
.sleep-sound[data-state=off] .sound-pillow{fill:#d9eaff}
.sleep-sound:hover{background:#e4f4ff66}
.sleep-sound:hover svg{transform:rotate(-4deg) scale(1.06)}
.sleep-sound:active{transform:scale(.96)}
.sleep-sound:active svg{transform:rotate(3deg) scale(.93)}
.sleep-sound:focus-visible{outline:2px dashed #34589b;outline-offset:2px;background:#e4f4ff66}
@keyframes sound-unfold{from{opacity:0;transform:translateY(3px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){.referral-closing-layout{grid-template-columns:1fr;gap:23px}.referral-closing-layout>div:first-child{max-width:470px}.referral-sleeping-gang{width:100%;max-width:500px;justify-self:center}.referral-sleeping-gang figcaption{font-size:.7rem}.referral-closing{padding-bottom:32px}.referral-page .site-footer{padding-top:38px}.monster-bubble{width:310px}.monster-bubble-content{padding-inline:29px}.monster-bubble p{font-size:.94rem}}
@media(max-width:360px){.monster-bubble-content{padding-inline:25px}.monster-bubble p{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.monster-snore-line span{animation:none}.monster-bubble{transition:none}.monster-motion{display:none}}
.motion-paused .monster-bubble{transition:none}
.motion-paused .monster-snore-line span{animation:none}
.motion-paused .monster-motion{display:none}

@media(prefers-reduced-motion:reduce){.cloud-z-float,.cloud-echo,.sleep-sound{animation:none}.sleep-sound,.sleep-sound svg,.sleep-sound svg *{transition:none}}
.motion-paused .cloud-z-float,.motion-paused .cloud-echo,.motion-paused .sleep-sound,.monster-bubble[data-page-hidden=true] .cloud-z-float,.monster-bubble[data-page-hidden=true] .cloud-echo{animation:none}
.motion-paused .sleep-sound,.motion-paused .sleep-sound svg,.motion-paused .sleep-sound svg *{transition:none}