/* Purrminal site. Colours come from the app icon: lavender paper, plum ink, coin yellow, blush pink, night indigo.
 * Unbounded for headings, Plus Jakarta Sans for text, both self-hosted. Light and dark follow the system. No external requests. */
@font-face{font-family:"Unbounded";src:url(fonts/unbounded-latin.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(fonts/jakarta-latin.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap}

:root{
  --paper:#fcf9ff;--panel:#ffffff;--ink:#2a2140;--muted:#62587d;--line:#ebe4f5;
  --coin:#ffd60a;--on-coin:#2a2140;--blush:#ffe3ea;--blush-ink:#c2335a;--mint:#dcf5ea;--sun:#fff3b8;
  --night:#1e1a33;--night-2:#2e2850;--on-night:#f5f0ff;--on-night-muted:#bdb3dc;
  --sky-1:#efe9ff;--sky-2:#ffe8ef;--bar:rgba(255,255,255,.78);
  --focus:#7c5cff;--stone:#ece4fb;--trail-line:#c9bde8;--good-ink:#1f7a55;--bad-ink:#c2335a;--radius:28px;--shadow:0 1px 2px rgba(42,33,64,.06),0 12px 32px -12px rgba(42,33,64,.18);
  --font:"Plus Jakarta Sans","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,sans-serif;
  --display:"Unbounded","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#17142a;--panel:#221e3a;--ink:#f5f0ff;--muted:#b9b0d8;--line:#352f56;
  --blush:#3a2340;--blush-ink:#ff9db1;--mint:#1d3533;--sun:#3a3320;
  --night:#0f0d1d;--night-2:#221e3a;--sky-1:#2a2450;--sky-2:#3a2547;--bar:rgba(30,26,51,.82);
  --focus:#b6a4ff;--stone:#2c2650;--trail-line:#4a4275;--good-ink:#7ee2a0;--bad-ink:#ff9db1;--shadow:0 1px 2px rgba(0,0,0,.3),0 16px 40px -16px rgba(0,0,0,.6);
}}
:root[data-theme="dark"]{
  --paper:#17142a;--panel:#221e3a;--ink:#f5f0ff;--muted:#b9b0d8;--line:#352f56;
  --blush:#3a2340;--blush-ink:#ff9db1;--mint:#1d3533;--sun:#3a3320;
  --night:#0f0d1d;--night-2:#221e3a;--sky-1:#2a2450;--sky-2:#3a2547;--bar:rgba(30,26,51,.82);
  --focus:#b6a4ff;--stone:#2c2650;--trail-line:#4a4275;--good-ink:#7ee2a0;--bad-ink:#ff9db1;--shadow:0 1px 2px rgba(0,0,0,.3),0 16px 40px -16px rgba(0,0,0,.6);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 clamp(1rem,.96rem + .2vw,1.0625rem)/1.6 var(--font);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:3px}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:12px}
h1,h2{font-family:var(--display);font-weight:700;line-height:1.08;letter-spacing:-.025em;margin:0;text-wrap:balance}
h1{font-size:clamp(1.9rem,1.1rem + 3.6vw,3.9rem)}
h2{font-size:clamp(1.45rem,1.15rem + 1.5vw,2.25rem)}
h3{font-weight:700;font-size:1.2rem;line-height:1.2;margin:0}
p{margin:0}
.wrap{width:min(1080px,100% - 32px);margin-inline:auto}
.narrow{width:min(680px,100% - 32px)}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:12px;background:var(--panel);padding:8px 14px;z-index:9}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;border:0;
  background:var(--coin);color:var(--on-coin);font:700 1.0625rem/1 var(--font);text-decoration:none;cursor:pointer;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.12);transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-1px);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12),0 8px 20px -8px rgba(201,138,0,.7)}
.btn:active{transform:translateY(1px);box-shadow:inset 0 -1px 0 rgba(0,0,0,.12)}
.btn svg{width:20px;height:20px;flex:none}
.btn.small{min-height:44px;padding:0 18px;font-size:.98rem}
.btn.quiet{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--line)}
.btn.quiet:hover{box-shadow:inset 0 0 0 2px var(--muted)}
.btn[aria-disabled]{background:var(--line);color:var(--muted);box-shadow:none;cursor:default;transform:none}

/* header */
.top{padding:18px 0}
.top .wrap{display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:1.15rem;letter-spacing:-.02em;text-decoration:none;margin-right:auto}
.brand img{width:40px;height:40px}
.top nav{display:flex;align-items:center;gap:22px}
.top nav a:not(.btn){text-decoration:none;color:var(--muted);font-weight:500;min-height:44px;display:inline-flex;align-items:center}
.top nav a:not(.btn):hover{color:var(--ink)}

/* hero */
.hero{padding:clamp(24px,5vw,64px) 0 0;text-align:center}
.hero p.lead{max-width:34em;margin:18px auto 0;font-size:clamp(1.1rem,1rem + .5vw,1.3rem);color:var(--muted)}
.cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px;margin-top:28px}
.cta .fine{font-size:.95rem;color:var(--muted)}
.phone-note{display:none;margin-top:10px;font-size:.95rem;color:var(--muted)}

/* the desk scene: a window with a sky, pets sitting on a taskbar */
.desk{position:relative;margin:clamp(32px,6vw,56px) auto 0;max-width:980px;aspect-ratio:980/350;min-height:290px;border-radius:var(--radius);
  background:radial-gradient(120% 90% at 15% 0%,var(--sky-1),transparent 60%),radial-gradient(90% 80% at 100% 10%,var(--sky-2),transparent 55%),var(--panel);
  box-shadow:var(--shadow);overflow:hidden;isolation:isolate}
.desk::after{content:"";position:absolute;inset:auto 0 0 0;height:15%;min-height:44px;background:var(--bar);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:-1}
.desk .icons{position:absolute;left:50%;bottom:0;height:15%;min-height:44px;transform:translateX(-50%);display:flex;align-items:center;gap:clamp(8px,1.6vw,14px)}
.desk .icons i{display:block;width:clamp(18px,2.6vw,26px);aspect-ratio:1;border-radius:8px;background:color-mix(in srgb,var(--muted) 22%,transparent)}
.desk .icons i:first-child{background:url(icon.svg) center/cover}
.pet{position:absolute;bottom:calc(15% - 2px);width:clamp(150px,22vw,232px);transform:translateX(-50%)}
.pet img{width:100%;height:auto}
.p-work{left:31%}.p-care{left:55%}.p-wave{left:12%}.p-nap{left:84%}
@media (max-width:560px){.desk{aspect-ratio:auto;height:300px}.p-work{left:30%}.p-care{left:74%}.p-wave,.p-nap{display:none}.capsule{left:62%}}

.capsule{position:absolute;bottom:100%;left:50%;transform:translate(-50%,-6px);display:flex;align-items:center;gap:10px;white-space:nowrap;
  padding:9px 16px 9px 12px;border-radius:999px;background:#000;color:#fff;box-shadow:0 10px 24px -8px rgba(0,0,0,.45);text-align:left;
  animation:pop .6s cubic-bezier(.34,1.56,.64,1) .5s both}
.capsule svg{width:22px;height:22px;flex:none}
.capsule b{display:block;font-weight:700;font-size:.95rem;line-height:1.2}
.capsule span{display:block;font-size:.82rem;line-height:1.2;color:#c9c3d8}
.capsule span span{display:inline}
.capsule .coin{color:#ffe896}
@keyframes pop{from{opacity:0;transform:translate(-50%,10px) scale(.85)}to{opacity:1;transform:translate(-50%,-6px) scale(1)}}
.hearts{position:absolute;left:52%;top:-34%;width:48%;pointer-events:none}
.hearts path{fill:#ff6f91;transform-box:fill-box;transform-origin:50% 100%;animation:float 3.2s ease-in-out infinite}
.hearts path+path{animation-delay:1.1s;fill:#ff9db1}
@keyframes float{0%{opacity:0;transform:translateY(6px) scale(.6)}25%{opacity:1}80%{opacity:.9}100%{opacity:0;transform:translateY(-14px) scale(1.05)}}

/* the live desk (desk/desk.js): real pets you can pat, feed, bathe, focus with and answer */
.dpet{position:absolute;bottom:calc(15% - 2px);width:clamp(86px,15vw,160px);aspect-ratio:4/3;transform:translateX(-50%);padding:0;border:0;background:none;
  cursor:pointer;-webkit-tap-highlight-color:transparent;z-index:1}
.dpet:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:18px}
.dsprite,.dfx{position:absolute;inset:0;display:block}
.dsprite .ap-svg{width:100%;height:100%}
.dsprite.left .ap-svg{transform:scaleX(-1)}
.dsprite.nom{animation:nom .42s ease-in-out 4}
@keyframes nom{50%{transform:scale(1.045,.955)}}
.dsprite.hop{animation:hop .5s cubic-bezier(.3,0,.4,1)}
@keyframes hop{40%{transform:translateY(-14%)}}
.dname{position:absolute;left:50%;top:100%;transform:translate(-50%,7px);padding:2px 10px;border-radius:999px;background:var(--panel);color:var(--ink);
  font-size:.78rem;font-weight:700;white-space:nowrap;box-shadow:inset 0 0 0 1px var(--line);opacity:0;transition:opacity .15s ease}
.dpet:hover .dname,.dpet:focus-visible .dname,.dpet.sel .dname{opacity:1}
.dpet.sel .dname{background:var(--coin);color:var(--on-coin);box-shadow:none}

.dfx .ov{position:absolute;pointer-events:none;transform:translate(-50%,-50%)}
.ov svg{display:block;width:100%;height:auto}
.ov.heart{width:14%;animation:rise 1.3s ease-out forwards}
.ov.heart.still{animation:none}
@keyframes rise{0%{opacity:0;transform:translate(-50%,-30%) scale(.5)}20%{opacity:1;transform:translate(-50%,-70%) scale(1)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),-280%) scale(.9)}}
.ov.spark{width:11%;animation:twinkle 1s ease-out forwards}
@keyframes twinkle{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}40%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(45deg)}100%{opacity:0;transform:translate(-50%,-110%) scale(.6) rotate(90deg)}}
.ov.bowl{top:auto;bottom:4%;width:30%;transform:translateX(-50%)}
.ov.toy{top:auto;bottom:4%;width:19%;transform:translateX(-50%);animation:roll 2.4s ease-in-out}
@keyframes roll{25%,75%{transform:translateX(calc(-50% + var(--sx))) rotate(-160deg)}50%{transform:translateX(-50%) rotate(0)}}
.ov.foam{top:auto;bottom:-3%;width:64%;transform:translateX(-50%);animation:foam 2.2s ease-in forwards}
@keyframes foam{0%{opacity:0}15%,70%{opacity:1}100%{opacity:0}}
.ov.bit{width:3.6%;aspect-ratio:1;border-radius:2px;box-shadow:inset -1px -1px 0 rgba(0,0,0,.22);animation:crumb 1.1s ease-out forwards}
@keyframes crumb{0%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),60%) rotate(140deg)}}
.ov.bub{width:calc(9% * var(--s,1));aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,rgba(190,225,240,.6) 60%,rgba(90,200,250,.35));
  box-shadow:inset 0 0 0 1px rgba(90,200,250,.65);animation:bubble 1.6s ease-out forwards}
@keyframes bubble{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}25%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),-240%) scale(1)}}
.ov.gain{display:flex;align-items:center;gap:4px;white-space:nowrap;font-weight:800;font-size:.9rem;color:var(--ink);animation:rise 1.4s ease-out forwards}
.ov.gain svg{width:18px;height:18px}

.dcap{position:absolute;bottom:100%;left:50%;--shift:0px;transform:translateX(calc(-50% + var(--shift)));display:flex;align-items:center;gap:9px;
  width:max-content;max-width:min(290px,78vw);padding:8px 14px 8px 10px;border-radius:999px;background:#000;color:#fff;text-align:left;white-space:nowrap;
  box-shadow:0 10px 24px -8px rgba(0,0,0,.45);animation:cap-in .45s cubic-bezier(.34,1.56,.64,1);z-index:2}
.dcap .ic svg{display:block;width:20px;height:20px}
.dcap .tx{min-width:0}
.dcap b{display:block;font-size:.88rem;line-height:1.2;overflow:hidden;text-overflow:ellipsis}
.dcap small{display:block;font-size:.76rem;line-height:1.25;color:#c9c3d8;overflow:hidden;text-overflow:ellipsis}
.dcap.ask{box-shadow:0 0 0 2px #ff453a,0 10px 24px -8px rgba(0,0,0,.45);animation:cap-in .45s cubic-bezier(.34,1.56,.64,1),nudge 1.6s ease-in-out .5s infinite}
.dcap.good small{color:#7ee2a0}
.dcap.bad small{color:#ff9b94}
@keyframes cap-in{from{opacity:0;transform:translate(calc(-50% + var(--shift)),8px) scale(.85)}}
@keyframes nudge{50%{transform:translate(calc(-50% + var(--shift)),-3px)}}

.hud{position:absolute;top:14px;left:14px;right:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;z-index:3;pointer-events:none}
.hud>*{pointer-events:auto}
.wallet{display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 8px;border-radius:999px;background:var(--panel);box-shadow:var(--shadow);
  font-weight:800;font-variant-numeric:tabular-nums}
.wallet svg{width:20px;height:20px}
.hud.bump .wallet{animation:bump .3s ease-out}
@keyframes bump{50%{transform:scale(1.08)}}
.next{display:inline-flex;align-items:center;gap:8px;font-size:.84rem;font-weight:600;color:var(--muted)}
.next[hidden],.unlock[hidden]{display:none}
.next i{display:block;width:84px;height:8px;border-radius:99px;background:color-mix(in srgb,var(--muted) 22%,transparent);overflow:hidden}
.next i b{display:block;height:100%;border-radius:99px;background:var(--coin);transition:width .4s ease}
.hud .unlock{min-height:40px;animation:cap-in .45s cubic-bezier(.34,1.56,.64,1)}
.dtoast{position:absolute;top:14px;left:50%;transform:translate(-50%,-160%);width:max-content;max-width:calc(100% - 24px);padding:8px 16px;border-radius:18px;
  background:#000;color:#fff;font-size:.86rem;font-weight:600;text-align:center;visibility:hidden;opacity:0;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .2s ease,visibility 0s .35s;z-index:4}
.dtoast.on{transform:translate(-50%,0);visibility:visible;opacity:1;transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .2s ease}

.dcard{position:absolute;top:60px;z-index:5;width:min(320px,calc(100% - 24px));padding:16px;border-radius:20px;background:#0c0b10;color:#f5f5f7;text-align:left;
  box-shadow:0 24px 60px -12px rgba(0,0,0,.55);font-size:.9rem;animation:card-in .2s ease-out}
@keyframes card-in{from{opacity:0;transform:translateY(8px)}}
.dcard .who b{display:block;font-size:1rem}
.dcard .who small{color:#a9a3b8}
.dcard .q{margin:12px 0 6px;color:#c9c3d8}
.dcard pre{margin:0;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.08);font:600 .85rem/1.4 ui-monospace,Consolas,monospace;white-space:pre-wrap;word-break:break-all}
.dcard .risks{margin-top:8px}
.dcard .risks span{display:inline-block;padding:2px 10px;border-radius:99px;font-size:.78rem;font-weight:700;color:#ff6b61;background:rgba(255,69,58,.18)}
.dcard .row{display:flex;gap:8px;margin-top:14px}
.dcard .row button{flex:1;min-height:44px;border:0;border-radius:12px;font:700 .95rem var(--font);cursor:pointer}
.dcard .deny{background:rgba(255,255,255,.1);color:#ff6b61}
.dcard .allow{background:#f5f5f7;color:#000}
.dcard .fine{margin-top:10px;font-size:.76rem;color:#8e889c}

.dock{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:980px;margin:18px auto 0}
.dock button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 11px;border:0;border-radius:999px;background:var(--panel);color:var(--ink);
  box-shadow:inset 0 0 0 1.5px var(--line);font:700 .95rem var(--font);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}
.dock button:hover{box-shadow:inset 0 0 0 1.5px var(--muted)}
.dock button:active{transform:scale(.96)}
.dock .g{display:grid;place-items:center;width:22px;height:22px}
.dock .g svg{width:22px;height:22px}
.dock .focus[aria-pressed="true"]{background:var(--coin);color:var(--on-coin);box-shadow:none}
.dock-hint{margin-top:12px;font-size:.88rem;color:var(--muted)}
.dock-hint b{color:var(--ink)}
/* Purr Focus on the desk: the app's purr ring, cushion, time tag and bubbles (app/renderer/css/focus.css), scaled to the bigger pets */
.dpet .dsprite{transition:transform .5s ease}
.fz-settled .dsprite{transform:translateY(-24%)}
.fz-pet .dname{opacity:0!important}
.fz-cush{position:absolute;bottom:3%;transform:translateX(-50%) scale(.3);transform-origin:50% 100%;opacity:0;pointer-events:none;
  transition:opacity .35s ease,transform .5s cubic-bezier(.34,1.56,.64,1)}
.fz-cush svg{display:block;width:100%;height:auto}
.fz-settled .fz-cush{opacity:1;transform:translateX(-50%) scale(1)}
.fz-cush.off{opacity:0;transform:translateX(-50%) scale(.3)}
.fz-ring{position:absolute;left:-7.5%;top:-35%;width:115%;aspect-ratio:1;pointer-events:none;opacity:0;transition:opacity .7s ease;animation:fz-breathe 4.4s ease-in-out infinite}
.fz-ring::before{content:"";position:absolute;inset:5.5%;border-radius:50%;
  background:radial-gradient(circle at 50% 55%,rgba(255,190,222,.32),rgba(190,160,255,.18) 62%,rgba(190,160,255,0) 72%)}
.fz-ring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fz-ring circle{fill:none;stroke-width:3}
.fz-ring .trk{stroke:color-mix(in srgb,var(--muted) 28%,transparent)}
.fz-ring .fil{stroke:#ff9ec7;stroke-linecap:round;filter:drop-shadow(0 0 2.5px rgba(255,130,185,.75));transition:stroke-dasharray 1s linear}
.fz-ring.done .fil{stroke:#ffd24a;filter:drop-shadow(0 0 3px rgba(255,200,60,.85))}
.fz-settled .fz-ring,.fz-up .fz-ring{opacity:1}
@keyframes fz-breathe{50%{scale:1.035}}
.fz-tag{position:absolute;left:50%;top:-35%;transform:translate(-50%,-50%);padding:3px 9px 4px;border-radius:10px;background:rgba(58,42,96,.9);color:#ffe6f2;
  font:700 .78rem/1 var(--font);font-variant-numeric:tabular-nums;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.3);pointer-events:none;opacity:0;transition:opacity .6s ease}
.fz-settled .fz-tag,.fz-up .fz-tag{opacity:1}
.fz-bub{position:absolute;--shift:0px;transform:translateX(calc(-50% + var(--shift)));display:flex;align-items:center;gap:8px;padding:7px 14px;border-radius:16px;
  background:rgba(255,255,255,.97);color:#3a2f55;box-shadow:0 2px 10px rgba(0,0,0,.25);font:600 .88rem/1.25 var(--font);white-space:nowrap;z-index:4;
  animation:fz-pop .22s cubic-bezier(.34,1.56,.64,1)}
.fz-bub::after{content:"";position:absolute;left:calc(50% - var(--shift));bottom:-5px;width:10px;height:10px;margin-left:-5px;transform:rotate(45deg);background:inherit;border-radius:0 0 3px 0}
@keyframes fz-pop{from{opacity:0;transform:translateX(calc(-50% + var(--shift))) translateY(5px) scale(.85)}}
.fz-bub .lt{font-variant-numeric:tabular-nums}
.fz-bub .dot{color:#b9a9d9}
.fz-bub button{min-height:32px;padding:0 12px;border:0;border-radius:11px;background:#efe6ff;color:#5b3fa3;font:700 .84rem/1 var(--font);cursor:pointer}
.fz-bub button:hover{background:#e2d3ff}
.fz-bub button.stop{background:#ffe1e8;color:#b02a52}
.fz-bub button.stop:hover{background:#ffd0dc}
.fz-bub .sub{color:#8d7db0;font-weight:500;font-size:.8rem}
.fz-bub.confirm,.fz-bub.win,.fz-bub.plain{flex-direction:column;gap:3px;padding:9px 16px 10px}
.fz-bub .btns{display:flex;gap:8px;margin-top:6px}
.fz-bub.win{background:linear-gradient(180deg,#fffaf0,#ffeef6);color:#7a2f5a;box-shadow:0 2px 12px rgba(255,140,190,.55),0 2px 8px rgba(0,0,0,.22)}
.fz-bub.win b{font-size:1rem}
.fz-bub .co{display:inline-flex;align-items:center;gap:3px;font-style:normal;font-weight:700;color:#b9780a}
.fz-bub .co svg{width:14px;height:14px}
@media (prefers-reduced-motion:reduce){.fz-ring,.fz-bub,.fz-cush,.dpet .dsprite{animation:none!important;transition:none!important}}
@media (max-width:560px){.dcard{top:10px}.next i{width:56px}.dock button{padding:0 14px 0 10px;font-size:.9rem}}

/* sections */
section{padding:clamp(64px,10vw,112px) 0 0}
.head{max-width:36em;margin:0 auto clamp(28px,4vw,44px);text-align:center}
.head p{margin-top:12px;color:var(--muted);font-size:1.1rem}

/* work / care / grow */
.loop{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,32px);list-style:none;margin:0;padding:0}
.loop li{text-align:center}
.cushion{display:grid;place-items:end center;height:170px;max-width:250px;margin:0 auto 18px;border-radius:999px 999px var(--radius) var(--radius);padding-bottom:10px}
.cushion img{width:178px}
.work .cushion{background:var(--sun)}.care .cushion{background:var(--blush)}.grow .cushion{background:var(--mint)}
.loop h3{margin-bottom:6px}
.loop p{color:var(--muted);max-width:22em;margin-inline:auto}
@media (max-width:760px){.loop{grid-template-columns:1fr;max-width:420px;margin-inline:auto}}

/* any pet picture (.pic): the sitting art, with the happy pose (.hov) on top for hover, tap or .awake */
.pic{position:relative;display:block}
.pic>img{width:100%;transition:opacity .12s ease}
.pic>.hov{position:absolute;inset:0;opacity:0}
@media (hover:hover){
  .pic:hover>img:first-child,.stop:hover .pic>img:first-child,.loop li:hover .pic>img:first-child{opacity:0}
  .pic:hover>.hov,.stop:hover .pic>.hov,.loop li:hover .pic>.hov{opacity:1}
  .stop:hover .pic,.loop li:hover .pic,.peek:hover,.peek-faq:hover{animation:pet-hop .55s cubic-bezier(.3,0,.4,1)}
}
.pic:active>img:first-child,.stop:active .pic>img:first-child,.pic.awake>img:first-child{opacity:0}
.pic:active>.hov,.stop:active .pic>.hov,.pic.awake>.hov{opacity:1}
@keyframes pet-hop{35%{transform:translateY(-12%) scale(1.03,.97)}60%{transform:translateY(0) scale(.97,1.03)}}

/* the pet trail: 16 pets in unlock order on a wavy path you scroll along */
.trail{--stop:156px;--pad:max(16px,calc((100vw - 1080px) / 2))}
.trail-scroll{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--pad),#000 calc(100% - var(--pad)),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 var(--pad),#000 calc(100% - var(--pad)),transparent)}
.trail-scroll::-webkit-scrollbar{display:none}
.trail-scroll:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;border-radius:var(--radius)}
@media (hover:hover){.trail-scroll{cursor:grab}}
.trail-scroll.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.trail-track{position:relative;display:flex;width:max-content;list-style:none;margin:0;padding:34px var(--pad) 30px}
.trail-track::before{content:"";position:absolute;left:var(--pad);right:var(--pad);top:116px;height:60px;background:var(--trail-line);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 312 60'%3E%3Cpath d='M0 30.0 L6 32.2 L12 34.3 L18 36.4 L24 38.4 L30 40.2 L36 41.9 L42 43.5 L48 44.8 L54 45.9 L60 46.8 L66 47.5 L72 47.9 L78 48.0 L84 47.9 L90 47.5 L96 46.8 L102 45.9 L108 44.8 L114 43.5 L120 41.9 L126 40.2 L132 38.4 L138 36.4 L144 34.3 L150 32.2 L156 30.0 L162 27.8 L168 25.7 L174 23.6 L180 21.6 L186 19.8 L192 18.1 L198 16.5 L204 15.2 L210 14.1 L216 13.2 L222 12.5 L228 12.1 L234 12.0 L240 12.1 L246 12.5 L252 13.2 L258 14.1 L264 15.2 L270 16.5 L276 18.1 L282 19.8 L288 21.6 L294 23.6 L300 25.7 L306 27.8 L312 30.0' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-dasharray='2 10'/%3E%3C/svg%3E") 0 0/312px 60px repeat-x;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 312 60'%3E%3Cpath d='M0 30.0 L6 32.2 L12 34.3 L18 36.4 L24 38.4 L30 40.2 L36 41.9 L42 43.5 L48 44.8 L54 45.9 L60 46.8 L66 47.5 L72 47.9 L78 48.0 L84 47.9 L90 47.5 L96 46.8 L102 45.9 L108 44.8 L114 43.5 L120 41.9 L126 40.2 L132 38.4 L138 36.4 L144 34.3 L150 32.2 L156 30.0 L162 27.8 L168 25.7 L174 23.6 L180 21.6 L186 19.8 L192 18.1 L198 16.5 L204 15.2 L210 14.1 L216 13.2 L222 12.5 L228 12.1 L234 12.0 L240 12.1 L246 12.5 L252 13.2 L258 14.1 L264 15.2 L270 16.5 L276 18.1 L282 19.8 L288 21.6 L294 23.6 L300 25.7 L306 27.8 L312 30.0' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-dasharray='2 10'/%3E%3C/svg%3E") 0 0/312px 60px repeat-x}
.stop{position:relative;top:var(--y);width:var(--stop);flex:none;display:flex;flex-direction:column;align-items:center;text-align:center;scroll-snap-align:center}
.stop:nth-child(odd){--y:18px}.stop:nth-child(even){--y:-18px}
.stop .num{display:grid;place-items:center;width:24px;height:24px;margin-bottom:6px;border-radius:50%;background:var(--panel);color:var(--muted);
  font:700 .75rem/1 var(--font);box-shadow:inset 0 0 0 1.5px var(--line)}
.stop:first-child .num{background:var(--coin);color:var(--on-coin);box-shadow:none}
.stop .pic{width:156px;margin-top:-28px;isolation:isolate}
.stop .pic::before{content:"";position:absolute;left:14%;right:14%;bottom:-4%;height:20%;border-radius:50%;background:var(--stone);z-index:-1}
.stop b{margin-top:10px;font-weight:700;font-size:1rem}
.stop small{font-size:.82rem;color:var(--muted)}
.stop .cost{display:inline-flex;align-items:center;gap:5px;margin-top:6px;padding:3px 10px;border-radius:999px;background:var(--panel);
  box-shadow:inset 0 0 0 1px var(--line);font-size:.84rem;font-weight:600;font-variant-numeric:tabular-nums}
.stop .cost::before{content:"";width:11px;height:11px;border-radius:50%;background:var(--coin);box-shadow:inset 0 -2px 0 rgba(0,0,0,.15)}
.stop .cost.free{background:var(--mint)}
.stop .cost.free::before{display:none}
.stop::after{content:"";position:absolute;top:30px;right:22px;width:18px;height:18px;opacity:0;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21C5 15.5 2 12.2 2 8.6 2 5.7 4.2 3.5 7 3.5c2 0 3.7 1.1 5 3 1.3-1.9 3-3 5-3 2.8 0 5 2.2 5 5.1 0 3.6-3 6.9-10 12.4z' fill='%23ff6482'/%3E%3C/svg%3E") center/contain no-repeat}
@media (hover:hover){.stop:hover::after{animation:float-heart 1.2s ease-out}}
.stop:active::after{animation:float-heart 1.2s ease-out}
@keyframes float-heart{0%{opacity:0;transform:translateY(8px) scale(.5)}25%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-20px) scale(.9)}}
.rv .trail-track .stop{opacity:0;transform:translateY(18px) scale(.9)}
.rv .trail-track.in .stop{opacity:1;transform:none;transition:opacity .4s ease calc(var(--i) * 45ms),transform .55s cubic-bezier(.34,1.56,.64,1) calc(var(--i) * 45ms)}
.trail-foot{display:flex;align-items:center;gap:16px;margin-top:4px}
.trail-bar{position:relative;flex:1;height:52px;border-bottom:2px dashed var(--line)}
.trail-walker{position:absolute;bottom:-3px;left:0;width:80px;transition:left .12s linear}
.trail-walker img{width:100%}
.trail-walker .w-walk{position:absolute;inset:0;opacity:0}
.trail-walker.walking .w-walk{opacity:1}
.trail-walker.walking .w-sit{opacity:0}
.trail-walker.left img{transform:scaleX(-1)}
.trail-nav{display:flex;gap:8px}
.trail-nav button{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--panel);color:var(--ink);
  box-shadow:inset 0 0 0 1.5px var(--line);cursor:pointer;transition:transform .12s ease}
.trail-nav button:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px var(--muted)}
.trail-nav button:active:not(:disabled){transform:scale(.92)}
.trail-nav button:disabled{opacity:.4;cursor:default}
.trail-nav svg{width:22px;height:22px}
.gang-note{text-align:center;margin-top:22px;color:var(--muted)}

/* Claude Code band */
.agents{background:var(--night);color:var(--on-night);border-radius:var(--radius);padding:clamp(24px,5vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:center}
.agents p{color:var(--on-night-muted);margin-top:12px;font-size:1.1rem}
.agents .stack{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;justify-items:start;min-width:0}
.agents .capsule{position:static;transform:none;animation:none;max-width:100%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.agents .capsule b,.agents .capsule span{overflow:hidden;text-overflow:ellipsis}
.agents .capsule>div{min-width:0}
.agents .capsule::before{content:"";align-self:stretch;width:4px;border-radius:4px;margin:-2px 0;background:var(--bar-c,#ff9f0a)}
@media (max-width:760px){.agents{grid-template-columns:minmax(0,1fr)}}

/* pricing */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2.4vw,24px);max-width:860px;margin:0 auto}
.plan{display:flex;flex-direction:column;align-items:flex-start;border-radius:var(--radius);padding:clamp(24px,3.4vw,36px);background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line)}
.plan>.btn{margin-top:auto}
.plan.premium{background:var(--night-2);color:var(--on-night);box-shadow:var(--shadow)}
.plan .price{font-family:var(--display);font-size:2.4rem;font-weight:700;letter-spacing:-.03em;line-height:1;margin:16px 0 6px}
.plan .price small{font-family:var(--font);font-size:1rem;font-weight:500;letter-spacing:0;opacity:.75}
.plan .per{color:var(--muted);min-height:1.6em}
.plan.premium .per,.plan.premium li{color:var(--on-night-muted)}
.plan ul{list-style:none;padding:0;margin:20px 0 24px;display:grid;gap:10px;align-self:stretch}
.plan li{display:flex;gap:10px;align-items:flex-start;color:var(--muted)}
.plan li::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:50%;
  background:var(--mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.3l2.6 2.5L13 6.4' fill='none' stroke='%231f7a55' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.plan.premium li::before{background-color:var(--coin);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.3l2.6 2.5L13 6.4' fill='none' stroke='%232a2140' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.plan.premium .btn[aria-disabled]{background:rgba(255,255,255,.1);color:var(--on-night-muted)}
.plan .row{display:flex;flex-wrap:wrap;gap:10px}
.plan .note{margin-top:14px;font-size:.92rem;color:var(--on-night-muted)}
.trial{display:inline-block;padding:4px 12px;border-radius:999px;background:var(--coin);color:var(--on-coin);font-weight:700;font-size:.88rem;margin-left:8px;vertical-align:3px}
.packs{max-width:860px;margin:clamp(14px,2.4vw,24px) auto 0;border-radius:var(--radius);padding:20px clamp(20px,3vw,32px);background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line);
  display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.packs h3{font-size:1.1rem}
.packs ul{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.packs li{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:var(--sun);font-variant-numeric:tabular-nums}
.packs li b{font-weight:600}
.packs .muted{flex-basis:100%;font-size:.92rem}
.packs .muted b{color:var(--ink)}
.fair{max-width:40em;margin:24px auto 0;text-align:center;color:var(--muted)}
@media (max-width:700px){.plans{grid-template-columns:1fr;row-gap:76px}}

/* FAQ */
.faq details{border-bottom:1.5px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:12px 0;font-weight:700;font-size:1.1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;background:var(--line) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M9 12l5 5 5-5' fill='none' stroke='%2362587d' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center no-repeat;transition:transform .2s ease}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq details p{color:var(--muted);padding:0 0 20px;max-width:38em}

/* closing call */
.end{text-align:center}
.end img{width:224px;margin:0 auto 4px}

/* footer */
.foot{margin-top:clamp(72px,10vw,120px);padding:36px 0 calc(40px + env(safe-area-inset-bottom));border-top:1.5px solid var(--line);color:var(--muted);font-size:.95rem}
.foot .wrap{display:grid;gap:10px;justify-items:center;text-align:center}
.foot nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px}
.foot nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;color:var(--ink);font-weight:500}

/* policy pages */
.policy{padding:clamp(24px,5vw,56px) 0 0}
.policy h1{font-size:clamp(1.8rem,1.3rem + 2.2vw,2.8rem)}
.policy .updated{margin-top:10px;color:var(--muted)}
.policy h2{font-size:1.15rem;margin:36px 0 8px}
.policy p,.policy li{color:var(--muted)}
.policy p+p{margin-top:12px}
.policy ul,.policy ol{padding-left:1.3em;display:grid;gap:6px;margin:10px 0 0}
.policy a{color:var(--ink)}
.policy a.btn{color:var(--on-coin)}
.policy code{font-size:.92em;background:var(--line);padding:1px 6px;border-radius:6px;word-break:break-all}
.policy .lead{font-size:1.15rem;margin-top:14px}
.policy .note{margin-top:18px;font-size:.95rem;color:var(--muted)}
.policy .mascot{width:176px;height:auto;margin:0 0 10px -8px}
.policy[style*="center"] .mascot{margin:0 auto 10px}
.policy .btn{margin-top:20px}
.key{font:600 1.1rem/1.4 ui-monospace,Consolas,monospace;background:var(--sun);border-radius:20px;padding:18px;word-break:break-all;text-align:center;margin:24px 0 0}

/* stage: waitlist before launch, live after (js/site.js; data-stage on <html>) */
html[data-stage="waitlist"] .only-live,html[data-stage="live"] .only-waitlist{display:none!important}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.trap{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}

/* "coming soon" chip above the headline */
.soon{display:inline-flex;align-items:center;gap:9px;margin:0 0 18px;padding:7px 15px;border-radius:999px;background:var(--panel);
  box-shadow:inset 0 0 0 1.5px var(--line);color:var(--muted);font-size:.92rem;font-weight:600}
.soon b{color:var(--ink)}
.soon-dot{position:relative;width:9px;height:9px;border-radius:50%;background:#ff6482}
.soon-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#ff6482;animation:ping 1.8s ease-out infinite}
@keyframes ping{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(2.8)}}

/* waitlist forms */
.wl{width:min(540px,100%);margin:28px auto 0}
.wl-row{display:flex;gap:8px;padding:6px;border-radius:999px;background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line),var(--shadow);transition:box-shadow .15s ease}
.wl-row:focus-within{box-shadow:inset 0 0 0 2px var(--focus),var(--shadow)}
.wl input[type="email"]{flex:1;min-width:0;min-height:50px;padding:0 18px;border:0;background:transparent;color:var(--ink);font:500 1.02rem/1 var(--font);outline:none}
.wl input[type="email"]::placeholder{color:var(--muted);opacity:.8}
.wl .btn{flex:none}
.wl .btn .paw{width:20px;height:20px}
@media (hover:hover){.wl .btn:hover .paw{animation:wiggle .5s ease-in-out}}
.wl.busy .btn{opacity:.7;cursor:progress}
.wl-msg{min-height:1.5em;margin-top:10px;font-size:.95rem;font-weight:600}
.wl-msg[data-kind="good"]{color:var(--good-ink)}
.wl-msg[data-kind="bad"]{color:var(--bad-ink)}
.wl.joined .wl-row{display:none}
.wl.joined .wl-msg{font-size:1.05rem;animation:pop-in .45s cubic-bezier(.34,1.56,.64,1)}
.wl .share{margin-top:6px}
.hero .fine{margin-top:2px;font-size:.92rem;color:var(--muted)}
@media (max-width:480px){.wl-row{flex-direction:column;border-radius:26px}.wl input[type="email"]{text-align:center}.wl .btn{width:100%}}
@keyframes pop-in{from{opacity:0;transform:scale(.85)}}
@keyframes wiggle{25%{transform:rotate(-14deg)}75%{transform:rotate(14deg)}}

/* work / care / grow: pets hop onto their cushions as they scroll in */
.rv .loop li[data-reveal] .pic{opacity:0;transform:translateY(40%) scale(.8)}
.rv .loop li[data-reveal].in .pic{opacity:1;transform:none;transition:opacity .3s ease,transform .6s cubic-bezier(.34,1.56,.64,1)}
.rv .loop li.in:nth-child(2) .pic{transition-delay:.12s}
.rv .loop li.in:nth-child(3) .pic{transition-delay:.24s}
.cushion .pic{width:236px}

/* pets peeking over the Premium card and next to the FAQ title */
.plan.premium{position:relative}
.peek{position:absolute;right:22px;bottom:calc(100% - 16px);width:128px;cursor:pointer;transform-origin:50% 100%}
.faq-head{display:flex;align-items:center;justify-content:center;gap:6px}
.peek-faq{width:112px;cursor:pointer;transform-origin:50% 100%}
.rv .peek[data-reveal],.rv .peek-faq[data-reveal]{opacity:0;transform:scale(.3)}
.rv .peek[data-reveal].in,.rv .peek-faq[data-reveal].in{opacity:1;transform:none;transition:opacity .25s ease,transform .6s cubic-bezier(.34,1.56,.64,1)}

/* the launch section: a pet dreaming of launch day, the countdown (or TBA) and the waitlist */
.launch{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(20px,4vw,48px);align-items:center;padding:clamp(24px,5vw,56px);
  border-radius:var(--radius);background:radial-gradient(90% 80% at 0% 0%,var(--sky-1),transparent 60%),radial-gradient(80% 80% at 100% 100%,var(--sky-2),transparent 60%),var(--panel);
  box-shadow:var(--shadow)}
.launch-copy .wl{margin:22px 0 0}
.launch-lead{margin-top:12px;color:var(--muted);font-size:1.1rem;max-width:30em}
.launch-copy .fine{margin-top:4px;font-size:.92rem;color:var(--muted)}
.launch-art{position:relative;display:grid;place-items:end center;min-height:250px}
.nap{position:relative;display:block;width:min(300px,100%);padding:0;border:0;background:none;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nap:focus-visible{border-radius:24px}
.nap-cush{position:absolute;left:6%;bottom:0;width:88%;height:auto}
.nap-pet{position:relative;display:block;width:100%;aspect-ratio:4/3;margin-bottom:11%}
.nap-pet img{position:absolute;inset:0;width:100%;opacity:0}
.nap-pet[data-pose="sleep"] img[data-p="sleep"],.nap-pet[data-pose="yawn"] img[data-p="yawn"],
.nap-pet[data-pose="stretch"] img[data-p="stretch"],.nap-pet[data-pose="happy"] img[data-p="happy"]{opacity:1}
.nap-pet.twitch{animation:nap-land .5s ease-out}
@keyframes nap-land{30%{transform:translateY(2%) scale(1.02,.97)}}
.dream{position:absolute;top:0;right:4%;display:flex;align-items:flex-end;gap:6px;animation:bob 3.4s ease-in-out infinite}
.dream span{display:block;border-radius:50%;background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line)}
.dream .d1{width:10px;height:10px;align-self:flex-end;margin-bottom:-26px}
.dream .d2{width:16px;height:16px;margin-bottom:-6px}
.dream .d3{display:flex;align-items:center;gap:8px;padding:10px 16px 10px 12px;border-radius:24px;font-weight:700;white-space:nowrap}
.dream .d3 svg{width:34px;height:34px}
.dream.dated .d3 svg{width:26px;height:26px}
.dream.dated .q{display:none}
.q{transform-box:fill-box;transform-origin:50% 90%;animation:q-wobble 2.4s ease-in-out infinite}
@keyframes q-wobble{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-14deg)}80%{transform:rotate(12deg)}90%{transform:rotate(-6deg)}}
.cal-q{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--sun);flex:none}
.cal-q svg{width:30px;height:30px}
@keyframes bob{50%{transform:translateY(-6px)}}
.countdown{margin-top:18px}
.cd-tba{display:flex;align-items:center;gap:12px;color:var(--muted);max-width:30em}
.cd{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:420px}
.cd[hidden]{display:none}
.cd span{display:flex;flex-direction:column;align-items:center;padding:12px 6px;border-radius:18px;background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line)}
.cd b{font-family:var(--display);font-size:clamp(1.5rem,1.1rem + 1.6vw,2.2rem);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
.cd b.flip{animation:flip .4s cubic-bezier(.34,1.56,.64,1)}
.cd small{margin-top:6px;font-size:.78rem;color:var(--muted)}
.cd-when{margin-top:10px;color:var(--muted);font-size:.95rem}
@keyframes flip{from{opacity:.2;transform:translateY(-40%) scale(.9)}}
@media (max-width:760px){.launch{grid-template-columns:minmax(0,1fr)}.launch-art{min-height:210px}.launch-copy{text-align:center}.launch-lead{margin-inline:auto}
  .cd-tba{justify-content:center;margin-inline:auto;text-align:left}.cd{margin-inline:auto}.launch-copy .wl{margin:22px auto 0}}

/* the sleepy pet on the footer line */
.foot{position:relative}
.foot-pet{position:absolute;left:50%;top:0;width:122px;padding:0;border:0;background:none;transform:translate(-50%,-93%);cursor:pointer}
.foot-pet:focus-visible{border-radius:18px}

/* little flourishes: paw prints where you tap, hearts, a wiggly logo, answers that slide in */
.fx-paw{position:fixed;z-index:60;width:22px;height:22px;margin:-11px 0 0 -11px;color:var(--blush-ink);pointer-events:none;animation:paw-pop .9s ease-out forwards}
.fx-paw svg,.fx-heart svg{display:block;width:100%;height:100%}
@keyframes paw-pop{0%{opacity:0;transform:rotate(var(--r)) scale(.4)}20%{opacity:.6;transform:rotate(var(--r)) scale(1)}100%{opacity:0;transform:rotate(var(--r)) scale(.9) translateY(-6px)}}
.fx-heart{position:fixed;z-index:60;width:22px;height:22px;margin-left:-11px;pointer-events:none;animation:heart-up 1.3s ease-out forwards}
@keyframes heart-up{0%{opacity:0;transform:translateY(0) scale(.5)}20%{opacity:1;transform:translateY(-10px) scale(1)}100%{opacity:0;transform:translate(var(--dx),-70px) scale(.9)}}
@media (hover:hover){.brand:hover img{animation:wiggle .6s ease-in-out}}
.faq details[open] p{animation:fade-up .3s ease-out}
@keyframes fade-up{from{opacity:0;transform:translateY(-4px)}}

@media (max-width:640px){
  .top nav a.hide-sm{display:none}
  .phone-note{display:block}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}
  .hearts{display:none}
}
