@import "https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;500;600;700&display=swap";:root{color:#e8eeff;font-synthesis:none;--muted:#a5b4d4;--accent:#6f9bff;background:#050a1a;font-family:Comfortaa,Segoe UI,sans-serif;font-weight:500;line-height:1.65}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{background:radial-gradient(at 85% 15%,#182951 0,#0000 45%),#050a1a;margin:0}a{color:inherit;text-decoration:none}button,.button{font:inherit;color:#09122c;cursor:pointer;background:#7fa7ff;border:1px solid #0000;border-radius:99px;padding:13px 22px;font-size:.82rem;font-weight:700;transition:transform .2s,background .2s;display:inline-block}button:hover,.button:hover{background:#a3c0ff;transform:translateY(-2px)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}.secondary,.quiet{color:#d0dfff;background:0 0;border-color:#344568}.secondary:hover,.quiet:hover{background:#18294b}.quiet{padding:7px 14px}header{border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;gap:20px;max-width:1280px;margin:auto;padding:28px 40px;display:flex}.brand{letter-spacing:-2px;font-size:1.6rem;font-weight:700}.brand span{color:#9dbaff;letter-spacing:-1px;margin-left:6px}.brand i{color:#b9eacb;margin-left:9px;font-style:normal}nav{color:var(--muted);gap:28px;font-size:.8rem;display:flex}main{max-width:1200px;margin:auto;padding:0 40px}.hero{grid-template-columns:1.2fr 1fr;align-items:center;gap:20px;min-height:510px;padding:70px 0 55px;display:grid}.eyebrow{color:#9bb9ff;letter-spacing:2px;font-size:.65rem;font-weight:700}.pill{letter-spacing:1px;border:1px solid #506994;border-radius:20px;margin-left:8px;padding:4px 8px;font-size:.53rem;display:inline-block}h1{letter-spacing:-3px;margin:22px 0;font-size:clamp(2.6rem,5vw,4.3rem);line-height:1.13}h2{letter-spacing:-1px;margin:8px 0 16px;font-size:1.65rem;line-height:1.3}h3{margin:10px 0;font-size:1.05rem}.lede{color:#b9c8e4;margin-bottom:26px;font-size:.94rem;line-height:1.9}.small{color:var(--muted);font-size:.68rem}.hero-pets{background:radial-gradient(#5c88e822,#0000 68%);border-radius:50%;min-height:300px;position:relative}.hero-pets div{filter:drop-shadow(0 20px 20px #0003);width:58%;animation:4s ease-in-out infinite bob;position:absolute;top:-30px;left:18%;transform:rotate(-8deg)}.hero-pets div:nth-child(2){width:43%;animation-delay:-1.5s;top:115px;left:-5%;transform:rotate(12deg)}.hero-pets div:nth-child(3){width:47%;animation-delay:-2.5s;top:100px;left:60%}.hero-pets svg{width:100%}#notice{background:#111e39;border:1px solid #2c426b;border-radius:14px;min-height:52px;margin-bottom:28px;padding:14px 20px;font-size:.78rem}#notice.error{color:#ffcebe;border-color:#b97867}.panel{background:linear-gradient(130deg,#101c35,#0b1225);border:1px solid #273754;border-radius:24px;margin:0 0 65px;padding:28px}.section-title{justify-content:space-between;align-items:center;gap:12px;display:flex}#my-pet{color:var(--muted);font-size:.9rem}.actions{flex-wrap:wrap;gap:12px;margin-top:22px;display:flex}.subtle{color:var(--muted);font-size:.78rem}.wardrobe{flex-wrap:wrap;gap:8px;margin:8px 0 4px;display:flex}.wardrobe button{font-size:.74rem}#yard-canvas{background:#6f93c4;border-radius:28px;width:100%;height:420px;margin:8px 0 18px;display:block}.gallery{grid-template-columns:repeat(3,1fr);gap:20px;margin-top:25px;display:grid}.pet-card{background:#0f1930;border:1px solid #263552;border-radius:22px;padding:23px;overflow:hidden}.pet-card.yours{border-color:#789ff5;box-shadow:0 0 25px #5c8aff13}.pet-picture{background:radial-gradient(#829fff20,#0000 70%);height:190px}.pet-picture svg{height:100%;margin:auto;display:block}.card-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.badge{letter-spacing:1px;color:#bcd3ff;background:#234064;border-radius:20px;padding:4px 8px;font-size:.52rem}label{color:#b1c3e1;align-items:center;gap:9px;margin:10px 0;font-size:.65rem;display:flex}meter{accent-color:#93d9bc;flex:1;height:8px}#my-pet .pet-card{grid-template-columns:200px 1fr;gap:2px 24px;max-width:650px;margin:12px 0;display:grid}#my-pet .pet-picture{grid-row:span 7}.pages{gap:12px;margin:25px 0;display:flex}.how{border-top:1px solid #23304a;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:60px;padding:45px 0 65px;display:grid}.how b{letter-spacing:2px;color:#90adeb;font-size:.62rem}.how p{color:var(--muted);font-size:.78rem}footer{color:#9aafd5;border-top:1px solid #23304a;flex-wrap:wrap;justify-content:center;gap:20px;padding:25px 40px;font-size:.65rem;display:flex}a:hover{color:#b5d2ff}:focus-visible{outline-offset:5px;outline:3px solid #a1c2ff}[hidden]{display:none!important}@keyframes bob{50%{translate:0 -12px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media (width<=800px){header,main{padding-left:22px;padding-right:22px}nav{display:none}.hero{grid-template-columns:1fr;padding-top:40px}.hero-pets{width:100%;max-width:420px;min-height:270px;margin:25px auto}.gallery{grid-template-columns:repeat(2,1fr)}.how{grid-template-columns:1fr}.panel{padding:20px}#my-pet .pet-card{display:block}.section-title h2{font-size:1.35rem}}@media (width<=520px){.gallery{grid-template-columns:1fr}header{padding-top:20px;padding-bottom:20px}.brand{font-size:1.3rem}button,.button{padding:11px 16px;font-size:.74rem}h1{letter-spacing:-2px}.hero{gap:0}.hero-pets{min-height:250px}.pill{margin-left:0}footer{padding:24px 20px}.actions>*{width:100%}}@media (width<=800px){.hero-pets div:nth-child(2){width:40%;left:0}.hero-pets div:nth-child(3){width:44%;left:54%}}
