/* Fold & Squish: the app's sky theme. Misty blue sugar paper behind torn cream sheets, navy ink, blue paint
   swipes behind titles and sunflower for what you tap or have chosen. The paper, swipes and pictures are made
   by ButterflyArt/design/web/web_assets.py. */
:root{--desk:#eef3f6;--desk-deep:#c7d6de;--cream:#fbf6ec;--ink:#1f2a5c;--muted:#4f5a7d;--sun:#f6c531;--blue:#bdd4e0;--shade:15,31,66}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:radial-gradient(ellipse 90% 60% at 50% 0,rgba(255,255,255,.45),transparent 70%) no-repeat,url(sky.jpg?v=2) var(--desk);font:17px/1.6 ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
img{display:block;max-width:100%;height:auto}a{color:inherit}a:focus-visible{outline:3px solid var(--ink);outline-offset:4px;border-radius:4px}
h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.12;letter-spacing:-.02em;font-weight:900}
h1{font-size:clamp(2.6rem,6vw,5.2rem);margin-bottom:.35em}h2{font-size:clamp(1.9rem,3.8vw,3.3rem);margin-bottom:.4em}h3{font-size:clamp(1.3rem,2vw,1.8rem);margin-bottom:.35em}
p{max-width:60ch}.shell{width:min(100% - 44px,1200px);margin:auto}

/* A dry-brush swipe of paint behind a word: the ragged ends keep their shape, only the middle stretches. */
.swipe{padding:0 .32em;margin:0 -.1em;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  background:url(swipe-1-blue-L.png) left center/auto 100% no-repeat,url(swipe-1-blue-R.png) right center/auto 100% no-repeat,url(swipe-1-blue-M.png) center/calc(100% - 2.1em) 100% no-repeat}
.swipe.s2{background-image:url(swipe-2-blue-L.png),url(swipe-2-blue-R.png),url(swipe-2-blue-M.png)}
.swipe.s3{background-image:url(swipe-3-blue-L.png),url(swipe-3-blue-R.png),url(swipe-3-blue-M.png)}
.swipe.s4{background-image:url(swipe-4-blue-L.png),url(swipe-4-blue-R.png),url(swipe-4-blue-M.png)}
.swipe.sun{background-image:url(swipe-3-sun-L.png),url(swipe-3-sun-R.png),url(swipe-3-sun-M.png)}

/* A sheet torn against a ruler, with a short soft shadow. */
.sheet{border:14px solid transparent;border-image:url(paper.png?v=2) 28/14px round;background:url(grain.jpg?v=2) var(--cream) -14px -14px/256px;background-clip:padding-box;filter:drop-shadow(0 1px 1.5px rgba(var(--shade),.14)) drop-shadow(0 6px 14px rgba(var(--shade),.08))}

/* Paper tiles: sunflower for the main thing to tap, cream for the rest. They squish when pressed. */
.tile{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:3.1rem;padding:0 .9rem;line-height:1.2;text-decoration:none;font-weight:800;border:12px solid transparent;border-image:url(paper.png?v=2) 28 fill/12px round;filter:drop-shadow(0 1px 1.5px rgba(var(--shade),.16)) drop-shadow(0 5px 10px rgba(var(--shade),.1));transition:transform .35s cubic-bezier(.3,1.8,.5,1)}
.tile.sun{border-image-source:url(paper-sun.png?v=2);filter:drop-shadow(0 2px 2px rgba(var(--shade),.2)) drop-shadow(0 9px 16px rgba(var(--shade),.16))}
.tile:hover{transform:translateY(-2px)}.tile:active{transform:scale(.92);transition-duration:.12s}
.store-badge{display:inline-flex;transition:transform .35s cubic-bezier(.3,1.8,.5,1)}.store-badge img{height:54px;width:auto}.store-badge:hover{transform:translateY(-2px)}.store-badge:active{transform:scale(.94)}

/* Out now */
.soon{display:block;padding:.6rem 1rem;background:var(--ink);color:#fff;text-align:center;font-weight:800;font-size:.95rem;line-height:1.35;text-decoration:none}
.soon span{color:#c6d3ef;font-weight:700}.soon b{color:var(--sun)}.soon:hover b{text-decoration:underline;text-underline-offset:3px}

.back-row{padding-top:14px}.back{display:inline-flex;align-items:center;gap:7px;margin-left:-4px;padding:4px 10px 4px 4px;border-radius:999px;font-size:.84rem;font-weight:800;color:var(--muted);text-decoration:none;transition:background .2s,color .2s}.back svg{width:9px;height:14px;flex:none}.back img{width:22px;height:22px;border-radius:6px}.back:hover{background:rgba(var(--shade),.06);color:var(--ink)}
.site-header .header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand-wrap{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-weight:900;letter-spacing:-.01em}.brand img{width:48px;height:48px;border-radius:12px;box-shadow:0 3px 10px rgba(var(--shade),.18)}.brand span{font-size:1.2rem}
.maker{font-size:.8rem;font-weight:700;color:var(--muted);text-decoration:none;white-space:nowrap}.maker b{font-weight:800;color:var(--ink)}.maker:hover b{text-decoration:underline;text-underline-offset:3px}
.nav{display:flex;gap:clamp(10px,2.2vw,26px);align-items:center}.nav a{text-decoration:none;font-weight:800;font-size:.95rem;padding:.15em .3em}.nav a:hover{text-decoration:underline;text-underline-offset:4px}.nav a[aria-current]{text-decoration:none}
.eyebrow{font-weight:800;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

.hero{padding-block:clamp(36px,6vw,80px) 0;text-align:center}.hero .lead{font-size:clamp(1.1rem,1.6vw,1.35rem);margin-inline:auto;color:var(--muted);max-width:46ch}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:center;margin:26px 0 0}
.film-link{position:relative;display:block;width:min(100%,940px);margin:clamp(10px,2vw,24px) auto 0;text-decoration:none}
.film-play{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);display:grid;place-items:center;width:clamp(72px,10vw,118px);aspect-ratio:1;border-radius:50%;background:var(--sun);color:var(--ink);border:4px solid var(--cream);box-shadow:0 12px 34px rgba(var(--shade),.35);transition:transform .35s cubic-bezier(.3,1.8,.5,1)}
.film-play svg{width:44%;height:44%;margin-left:8%}
.film-link:hover .film-play,.film-link:focus-visible .film-play{transform:translate(-50%,-50%) scale(1.08)}
.film-label{position:absolute;left:50%;bottom:7%;transform:translateX(-50%) rotate(-1deg);white-space:nowrap;font-size:.95rem;pointer-events:none}

.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-block:30px 10px}.facts .sheet{padding:6px 8px}.facts b{display:block;font-size:1.05rem;line-height:1.3;margin-bottom:.2em}.facts span{color:var(--muted);font-size:.92rem;line-height:1.45;display:block}

.section{padding-block:clamp(56px,7vw,100px)}.section-heading{max-width:780px;margin-bottom:30px}.section-heading p{color:var(--muted);font-size:1.12rem}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:end}.steps figure{min-width:0;margin:0;display:flex;flex-direction:column}.steps img{margin-inline:auto}
.steps figcaption{font-weight:800;font-size:1.1rem;text-align:center}.steps figcaption span:not(.num){display:block;font-weight:600;color:var(--muted);font-size:.95rem}
.num{display:inline-grid;place-items:center;width:1.8em;height:1.8em;margin-right:.35em;border-radius:50%;background:var(--ink);color:#fff;font-size:.8em;vertical-align:.08em}

.devices{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,5vw,70px);align-items:center;padding:clamp(14px,3vw,36px)}
.devices>*{min-width:0}.devices p{color:var(--muted);font-size:1.12rem}.device-shots{display:grid;gap:18px}.device-shots img{border-radius:14px;box-shadow:0 10px 26px rgba(var(--shade),.16)}

/* Prints taped up on the wall, like the app's gallery. */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,34px);padding-top:14px}.gallery figure{position:relative;margin:0;min-width:0}.gallery img{width:100%}
.gallery img{border-radius:10px;box-shadow:0 10px 26px rgba(var(--shade),.15)}
.gallery figure::before{content:"";position:absolute;z-index:1;left:50%;top:-12px;width:30%;height:26px;transform:translateX(-50%) rotate(-2deg);background:rgba(189,212,224,.82);box-shadow:0 1px 2px rgba(var(--shade),.12)}
.gallery figure:nth-child(2)::before{transform:translateX(-50%) rotate(1.5deg)}.gallery figure:nth-child(3)::before{transform:translateX(-50%) rotate(-.5deg)}
.gallery figcaption{margin-top:12px;font-weight:700;color:var(--muted);font-size:.95rem;text-align:center}

.closing{padding-block:0 clamp(60px,8vw,100px)}.closing .sheet{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:clamp(14px,3.5vw,44px)}
.closing h2{max-width:18ch}.closing p{color:var(--muted);font-size:1.08rem}.closing .hero-actions{justify-content:flex-start}.closing img.butterfly{width:min(280px,36vw);flex:none}

.site-footer{background:var(--ink);color:#e9edf8;padding:40px 0}.footer-inner{display:flex;justify-content:space-between;gap:24px;align-items:start}
.site-footer .brand img{width:38px;height:38px;border-radius:9px;box-shadow:none}.site-footer p{color:#c0c8e2;font-size:.9rem;margin:12px 0 0}.site-footer p a{color:#fff;font-weight:800;text-underline-offset:3px}
.footer-links{display:flex;gap:22px;flex-wrap:wrap}.footer-links a{text-decoration:none;font-weight:700;font-size:.92rem}.footer-links a:hover{text-decoration:underline;text-underline-offset:4px}

/* Support and privacy */
.legal-main{padding-block:clamp(48px,6vw,90px) clamp(70px,8vw,120px)}.legal-header{max-width:800px;margin-bottom:40px}.legal-header h1{font-size:clamp(2.4rem,5vw,4.2rem)}.legal-header .intro{font-size:1.18rem;color:var(--muted)}
.legal-grid{display:grid;grid-template-columns:220px minmax(0,780px);gap:56px;align-items:start}.legal-aside{font-weight:700;font-size:.85rem;line-height:1.9;color:var(--muted)}
.legal-content{padding:4px clamp(10px,2.5vw,30px)}.legal-content section{padding:24px 0;border-bottom:2px dashed rgba(var(--shade),.12)}.legal-content section:last-child{border-bottom:0}.legal-content h2{font-size:1.5rem;margin-bottom:.4em}.legal-content p{color:#3c4670}.legal-content a{text-underline-offset:3px}
.contact-card{margin-top:18px;padding:6px 10px}.contact-card strong{display:block;margin-bottom:4px}.contact-card a{font-size:clamp(1rem,2vw,1.25rem);font-weight:800;overflow-wrap:anywhere}
.pill{display:inline-block;font-weight:800;font-size:.9rem}
.answers{display:grid;gap:10px;margin:0}.answers div{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:12px 16px;border-radius:10px;background:rgba(220,230,235,.55)}.answers dt{font-weight:700;color:var(--ink)}.answers dd{margin:0;flex:none;font-weight:900}

@media(max-width:900px){.facts{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr;gap:34px}.steps img{max-width:min(100%,560px)}.gallery{grid-template-columns:1fr;gap:38px}.devices{grid-template-columns:1fr}.legal-grid{grid-template-columns:1fr;gap:16px}.legal-aside{display:none}.closing .sheet{flex-direction:column-reverse;align-items:start}}
@media(max-width:640px){.shell{width:min(100% - 32px,1200px)}.site-header .header-inner{min-height:0;padding-block:10px 14px;flex-direction:column;align-items:flex-start;gap:10px}.brand img{width:40px;height:40px}.nav{gap:6px;flex-wrap:wrap}.nav a{font-size:.88rem}.facts{grid-template-columns:1fr}.footer-inner{display:block}.footer-links{margin-top:20px}.soon{font-size:.85rem}.film-label{font-size:.82rem}.store-badge img{height:48px}}
@media(min-width:641px){.swipe{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tile,.store-badge,.film-play{transition:none}}
/* Press kit */
.press-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.press-note{margin-top:12px;font-size:.9rem;color:var(--muted)}
.press-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:start}
.press-facts{padding:8px 12px}.press-facts h2,.press-copy h2,.press-section h2{font-size:1.5rem;margin-bottom:.5em}
.press-facts dl{margin:0;display:grid;gap:0}.press-facts dl div{display:grid;grid-template-columns:8.5em 1fr;gap:10px;padding:9px 0;border-bottom:2px dashed rgba(var(--shade),.1)}.press-facts dl div:last-child{border:0}
.press-facts dt{font-weight:800}.press-facts dd{margin:0;color:#3c4670;overflow-wrap:anywhere}.press-facts a{text-underline-offset:3px}
.press-copy section{margin-bottom:28px}.press-copy p,.press-section p{color:#3c4670}.press-copy ul{padding-left:1.2em;color:#3c4670}.press-copy li{margin-bottom:.35em}
.press-section{margin-top:clamp(40px,5vw,64px)}.press-section h3{font-size:1.15rem;margin:26px 0 12px}
.press-media{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}.press-media figure{margin:0;min-width:0}
.press-media img{width:100%;aspect-ratio:4/3;object-fit:contain;background:rgba(220,230,235,.6);border-radius:10px}
.press-media figcaption{margin-top:8px;font-weight:700;font-size:.9rem;line-height:1.35}.press-media figcaption span{display:block;font-weight:600;color:var(--muted);font-size:.8rem}
.press-release{padding:10px 16px}.press-release h3{font-size:1.35rem;margin:.2em 0 .4em}.press-release .sub{font-weight:700;color:var(--ink)}
@media(max-width:900px){.press-grid{grid-template-columns:1fr}}
@media(max-width:640px){.press-facts dl div{grid-template-columns:1fr;gap:2px}}