.pet-page{--pet-ink:#4a3a36;--pet-muted:#887772;--pet-card:rgba(255,251,246,.91);--pet-pink:#e98ca8;position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;background:#f8eee5;color:var(--pet-ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
.pet-page *{box-sizing:border-box}.pet-page button,.pet-style button,.pet-painter button,.pet-shop button,.pet-adopt-modal button{font-family:inherit;touch-action:manipulation}.pet-nav{height:58px;display:grid;grid-template-columns:78px 1fr 92px;align-items:center;flex:none;padding:0 10px;border-bottom:1px solid rgba(106,75,64,.08);background:rgba(255,249,243,.86);backdrop-filter:blur(18px);z-index:20}.pet-nav>button{min-width:0;height:36px;padding:0 8px;border:0;border-radius:12px;background:transparent;color:#76605a;font-size:13px}.pet-nav>button:first-child{font-size:25px;text-align:left}.pet-nav>button:last-child{text-align:right;white-space:nowrap}.pet-nav>span{text-align:center;min-width:0}.pet-nav b,.pet-nav small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pet-nav b{font-size:14px}.pet-nav small{margin-top:2px;color:#ad928b;font-size:8px;letter-spacing:.09em}
.pet-scroll,.pet-onboard-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:13px 13px 34px;overscroll-behavior-x:none;touch-action:pan-y}.pet-switcher{height:47px;display:flex;align-items:center;gap:7px;padding:6px 12px;overflow-x:auto;flex:none;background:#f9eee5;scrollbar-width:none}.pet-switcher button{height:34px;display:flex;align-items:center;gap:6px;padding:0 11px;border:1px solid rgba(118,83,72,.09);border-radius:99px;background:rgba(255,255,255,.52);color:#927d76;font-size:10px;white-space:nowrap}.pet-switcher button.on{border-color:rgba(219,119,150,.25);background:#fff7fa;color:#bf6684;box-shadow:0 4px 14px rgba(172,91,113,.08)}.pet-switcher button i{font-style:normal}.pet-switcher button.add{margin-left:auto;border-style:dashed;background:transparent}
.pet-vitals{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:7px;margin-bottom:11px}.pet-vitals>div:first-child{grid-row:span 2;display:flex;flex-direction:column;justify-content:center;padding:12px;border:1px solid rgba(139,91,78,.1);border-radius:18px;background:linear-gradient(145deg,#fff9f2,#fae5dc);box-shadow:0 8px 22px rgba(126,82,67,.08)}.pet-vitals>div:first-child small{color:#c3978e;font-size:7px;letter-spacing:.15em}.pet-vitals>div:first-child b{margin-top:6px;color:#865c59;font-size:14px;line-height:1.25}.pet-stat{padding:8px 9px;border:1px solid rgba(139,91,78,.085);border-radius:14px;background:rgba(255,255,255,.72)}.pet-stat span{display:flex;justify-content:space-between;align-items:center;color:#9a8580;font-size:8px}.pet-stat b{font-weight:600}.pet-stat em{font-style:normal;color:#6f5a56}.pet-stat>i{height:4px;display:block;margin-top:7px;overflow:hidden;border-radius:99px;background:#eee1da}.pet-stat u{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e892aa,#efb283);text-decoration:none}.pet-stat.food u{background:linear-gradient(90deg,#f0aa73,#eac75d)}.pet-stat.clean u{background:linear-gradient(90deg,#7fcfd3,#91bfea)}.pet-stat.energy u{background:linear-gradient(90deg,#95c77c,#c0d675)}
.pet-room{position:relative;height:min(58vh,500px);min-height:430px;overflow:hidden;border:1px solid rgba(125,83,67,.11);border-radius:27px;background:#f2d9c5;box-shadow:0 18px 44px rgba(109,71,56,.17);isolation:isolate;cursor:pointer}.pet-room-bg{position:absolute;inset:0;background-image:linear-gradient(180deg,rgba(255,248,239,.02),rgba(92,57,42,.08)),url('assets/pet-room-v1.webp');background-size:cover;background-position:center 48%;transform:scale(1.01);z-index:-2}.pet-page.night .pet-room-bg{filter:brightness(.45) saturate(.78) hue-rotate(8deg)}.pet-page.night .pet-room:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(41,48,88,.38),rgba(37,32,58,.5));pointer-events:none}.pet-night{position:absolute;right:14px;top:14px;display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid rgba(255,255,255,.22);border-radius:99px;background:rgba(39,38,66,.46);backdrop-filter:blur(10px);color:#fff;font-size:8px}.pet-night i{font-size:13px;font-style:normal}.pet-role-chip{position:absolute;left:13px;top:13px;display:flex;align-items:center;gap:7px;max-width:190px;height:34px;padding:0 11px 0 5px;border:1px solid rgba(255,255,255,.52);border-radius:99px;background:rgba(255,252,248,.84);backdrop-filter:blur(10px);color:#7d625c;box-shadow:0 5px 16px rgba(70,48,42,.1)}.pet-role-chip span{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#e896ad,#bd7190);color:#fff;font-size:8px}.pet-role-chip b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px}.pet-role-chip.empty{border-style:dashed}.pet-role-chip.empty span{background:#ebd9d1;color:#9f8178;font-size:12px}.pet-speech{position:absolute;left:50%;top:66px;z-index:6;max-width:76%;padding:9px 12px;border:1px solid rgba(126,85,69,.1);border-radius:15px 15px 15px 5px;background:rgba(255,253,249,.91);box-shadow:0 8px 22px rgba(75,48,38,.1);color:#715851;font-size:10px;line-height:1.45;transform:translateX(-50%);text-align:center}.pet-speech:after{content:"";position:absolute;left:50%;bottom:-7px;border:7px solid transparent;border-top-color:rgba(255,253,249,.91);border-bottom:0}.pet-character{position:absolute;left:50%;bottom:46px;width:min(74%,330px);z-index:4;transform:translateX(-50%);filter:drop-shadow(0 18px 13px rgba(77,48,37,.15))}.pet-character .pet-svg{display:block;width:100%;height:auto;overflow:visible}.pet-room.react-hop .pet-character,.pet-room.react-first .pet-character{animation:petHop .65s cubic-bezier(.2,.9,.24,1)}.pet-room.react-first .pet-character{animation-duration:1.05s}.pet-room.react-play .pet-character{animation:petPlay .85s ease-in-out}.pet-svg .pet-tail{transform-box:fill-box;transform-origin:left center;animation:petTail 1.25s ease-in-out infinite alternate}.pet-svg.is-sad .pet-tail{animation-duration:2.6s}.pet-svg.is-asleep{animation:petSleep 2.8s ease-in-out infinite}.pet-custom-strokes{pointer-events:none}.pet-room-floor-note{position:absolute;left:50%;bottom:13px;z-index:5;padding:5px 10px;border-radius:99px;background:rgba(255,252,247,.7);color:#9d8178;font-size:7px;transform:translateX(-50%);backdrop-filter:blur(8px)}.pet-need-bubble{position:absolute;right:16px;top:61px;z-index:7;width:64px;height:55px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50% 50% 50% 14%;background:rgba(255,251,246,.92);box-shadow:0 7px 20px rgba(74,45,36,.12);color:#bf765f;animation:petFloat 1.7s ease-in-out infinite}.pet-need-bubble i{font-size:17px;font-style:normal}.pet-need-bubble span{font-size:7px}.pet-poops{position:absolute;right:16%;bottom:55px;z-index:5;display:flex;align-items:flex-end}.pet-poops i{display:block;margin-left:-5px;color:#7c5945;font-size:14px;font-style:normal;transform:translateY(calc(var(--i) * 2px))}.pet-flies{position:absolute;right:11%;bottom:90px;z-index:8;width:55px;height:48px}.pet-flies i{position:absolute;color:#55483f;font-size:11px;font-style:normal;animation:petFly 2.2s ease-in-out infinite}.pet-flies i:nth-child(2){left:26px;top:8px;animation-delay:-.7s}.pet-flies i:nth-child(3){left:10px;top:28px;animation-delay:-1.3s}
.pet-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:11px 0}.pet-actions button{min-width:0;height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(136,91,75,.09);border-radius:17px;background:linear-gradient(145deg,#fffaf6,#f8e9df);color:#765d56;box-shadow:0 7px 18px rgba(105,71,60,.07)}.pet-actions button:active{transform:scale(.97)}.pet-actions i{font-size:17px;font-style:normal;color:#d47f99}.pet-actions b{margin-top:5px;font-size:10px}.pet-actions small{margin-top:3px;color:#b19b94;font-size:7px}.pet-care-card,.pet-grow-card,.pet-family-card,.pet-log{margin-top:11px;padding:14px;border:1px solid rgba(135,91,77,.09);border-radius:21px;background:rgba(255,252,248,.83);box-shadow:0 9px 25px rgba(100,67,56,.07)}.pet-care-card header,.pet-grow-card header,.pet-log header{display:flex;align-items:center;justify-content:space-between}.pet-care-card header small,.pet-grow-card header small,.pet-log header small{display:block;color:#c19489;font-size:7px;letter-spacing:.14em}.pet-care-card header b,.pet-grow-card header b,.pet-log header b{display:block;margin-top:3px;font-size:13px}.pet-care-card header button{height:30px;padding:0 10px;border:1px solid rgba(217,119,151,.18);border-radius:10px;background:#fff4f7;color:#bd6684;font-size:8px}.pet-meals{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}.pet-meals span{height:35px;display:flex;align-items:center;justify-content:center;gap:5px;border:1px dashed #e4cfc6;border-radius:11px;color:#aa9188;font-size:8px}.pet-meals span.done{border-style:solid;border-color:#e3a5b7;background:#fff2f6;color:#b65c7d}.pet-meals i{font-style:normal}.pet-care-card p,.pet-grow-card p{margin:10px 1px 0;color:#aa9690;font-size:8px;line-height:1.6}.pet-grow-card header em{padding:4px 7px;border-radius:99px;background:#f5e8d8;color:#a48163;font-size:7px;font-style:normal}.pet-stage-book{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:13px}.pet-stage-book span{min-width:0;padding:8px 2px;border-radius:12px;background:#f4eae4;color:#bca9a2;text-align:center}.pet-stage-book span.seen{background:#f8e1e9;color:#b96381}.pet-stage-book span.now{box-shadow:inset 0 0 0 1px #dc88a4,0 5px 12px rgba(199,104,134,.12)}.pet-stage-book i{width:20px;height:20px;display:grid;place-items:center;margin:0 auto 5px;border-radius:50%;background:rgba(255,255,255,.7);font-size:7px;font-style:normal}.pet-stage-book b{display:block;font-size:6px;white-space:nowrap}.pet-family-card{padding:3px 13px}.pet-family-card>button{width:100%;min-height:57px;display:flex;align-items:center;gap:10px;padding:8px 0;border:0;border-bottom:1px solid rgba(128,87,73,.075);background:transparent;color:#745b54;text-align:left}.pet-family-card>button:last-child{border-bottom:0}.pet-family-card>button>i{width:34px;height:34px;display:grid;place-items:center;border-radius:12px;background:#f7e5eb;color:#c66f8b;font-style:normal}.pet-family-card span{flex:1;min-width:0}.pet-family-card b,.pet-family-card small{display:block}.pet-family-card b{font-size:11px}.pet-family-card small{margin-top:4px;color:#aa9690;font-size:8px}.pet-family-card em{font-style:normal;color:#b6a29c}.pet-log p{display:flex;gap:10px;margin:10px 0 0;padding-top:9px;border-top:1px solid rgba(126,84,70,.07);color:#806b65;font-size:8px;line-height:1.45}.pet-log time{flex:none;color:#b19b94}
.pet-onboard{background:linear-gradient(180deg,#fbf0e6,#f6e1d7)}.pet-onboard-scroll{padding-bottom:45px}.pet-onboard-hero{position:relative;min-height:326px;padding:29px 22px;overflow:hidden;border-radius:28px;background:linear-gradient(145deg,#fff8f1,#f5d9ce 70%,#e8c0bf);box-shadow:0 18px 38px rgba(118,73,60,.13)}.pet-onboard-hero:after{content:"";position:absolute;right:-50px;bottom:-70px;width:230px;height:230px;border:1px solid rgba(146,90,73,.12);border-radius:50%;box-shadow:0 0 0 34px rgba(255,255,255,.14),0 0 0 70px rgba(255,255,255,.08)}.pet-onboard-hero small{color:#c0847c;font-size:8px;letter-spacing:.2em}.pet-onboard-hero h1{margin:15px 0 11px;color:#704f4b;font-size:29px;line-height:1.18}.pet-onboard-hero p{max-width:72%;margin:0;color:#9e7d77;font-size:10px;line-height:1.7}.pet-box-mini{position:absolute;right:25px;bottom:26px;z-index:2;width:118px;height:91px;border-radius:16px;background:linear-gradient(145deg,#c99065,#a86c46);box-shadow:0 13px 25px rgba(92,57,39,.21),inset 0 0 0 5px rgba(255,255,255,.16)}.pet-box-mini i{position:absolute;left:-5px;right:-5px;top:-15px;height:29px;border-radius:12px;background:#d9a377;transform:rotate(-4deg)}.pet-box-mini b{position:absolute;inset:0;display:grid;place-items:center;color:#f7d5b5;font-size:34px}.pet-onboard-scroll>h3{margin:23px 4px 11px;font-size:14px}.pet-species-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.pet-species-grid button{min-width:0;padding:10px;border:1px solid rgba(126,83,68,.1);border-radius:19px;background:#fffaf6;color:#735a53;text-align:center}.pet-species-grid svg{width:100%;height:135px}.pet-species-grid b,.pet-species-grid small{display:block}.pet-species-grid b{font-size:11px}.pet-species-grid small{margin-top:5px;color:#aa928b;font-size:7px;line-height:1.45}.pet-feature-notes{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:12px}.pet-feature-notes span{padding:8px 2px;border-radius:11px;background:rgba(255,255,255,.5);color:#aa817b;font-size:7px;text-align:center}
.pet-box-page{background:#f5e8dc}.pet-box-room{position:relative;flex:1;overflow:hidden;padding:43px 25px;background-image:linear-gradient(180deg,rgba(255,250,246,.18),rgba(93,57,41,.12)),url('assets/pet-room-v1.webp');background-size:cover;background-position:center}.pet-box-copy{position:relative;z-index:2;text-align:center}.pet-box-copy small{color:#b57a71;font-size:8px;letter-spacing:.19em}.pet-box-copy h2{margin:10px 0 7px;font-size:23px}.pet-box-copy p{max-width:270px;margin:0 auto;color:#987c73;font-size:10px;line-height:1.6}.pet-crate{position:absolute;left:50%;bottom:112px;width:190px;height:145px;border:0;border-radius:22px;background:linear-gradient(145deg,#ca8e62,#995f3d);box-shadow:0 23px 35px rgba(83,53,38,.27),inset 0 0 0 7px rgba(255,255,255,.14);color:#fff;transform:translateX(-50%);animation:petCrate 2.4s ease-in-out infinite}.pet-crate .lid{position:absolute;left:-9px;right:-9px;top:-20px;height:39px;border-radius:16px;background:linear-gradient(#dfa779,#bd7c51);box-shadow:0 7px 11px rgba(93,56,35,.18);transform:rotate(-2deg)}.pet-crate .crate-face{position:absolute;inset:25px 0 0;display:flex;justify-content:center;gap:48px}.pet-crate .crate-face u{width:17px;height:23px;border-radius:50%;background:#71462f;box-shadow:inset 0 4px 7px rgba(0,0,0,.18)}.pet-crate span{position:absolute;left:50%;bottom:18px;padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.19);font-size:9px;transform:translateX(-50%);white-space:nowrap}.pet-box-hint{position:absolute;left:50%;bottom:54px;padding:7px 11px;border-radius:99px;background:rgba(255,252,246,.76);color:#94756c;font-size:8px;transform:translateX(-50%);white-space:nowrap}
.pet-adopt-modal{text-align:center}.pet-adopt-modal>small,.pet-style header small,.pet-painter header small,.pet-shop header small{color:#c67a94;font-size:8px;letter-spacing:.18em}.pet-adopt-modal h3{margin:7px 0}.pet-adopt-peek{height:180px;overflow:hidden;margin:5px 0}.pet-adopt-peek svg{height:190px}.pet-adopt-modal .field input{width:100%;height:44px;padding:0 14px;border:1px solid #e2d0c7;border-radius:14px;background:#fffaf6;color:#644d47;text-align:center;outline:0}.pet-adopt-modal .btn{width:100%;margin-top:8px}.modal .pet-species-grid svg{height:125px}
.pet-food-list{display:flex;flex-direction:column;gap:7px;margin-top:12px}.pet-food-list button{width:100%;min-height:52px;display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(128,89,76,.1);border-radius:15px;background:#fffaf6;color:#715851;text-align:left}.pet-food-list i{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:#f6e0d8;color:#c36f84;font-size:17px;font-style:normal}.pet-food-list span{flex:1;min-width:0}.pet-food-list b,.pet-food-list small{display:block}.pet-food-list b{font-size:11px}.pet-food-list small{margin-top:3px;color:#a28c85;font-size:8px}.pet-food-list em{font-size:9px;font-style:normal;color:#b28476}.pet-shop-link{width:100%;margin-top:10px;padding:9px;border:0;background:transparent;color:#bd6684;font-size:9px}
.pet-shop header{position:relative;padding:2px 0 9px}.pet-shop header h3{margin:5px 0}.pet-shop header b{position:absolute;right:0;top:8px;padding:5px 8px;border-radius:99px;background:#f7e4d9;color:#9c725e;font-size:8px}.pet-shop nav{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:11px;padding:4px;border-radius:13px;background:#eee4de}.pet-shop nav button{height:32px;border:0;border-radius:10px;background:transparent;color:#9a8882;font-size:9px}.pet-shop nav button.on{background:#fff;box-shadow:0 4px 10px rgba(94,64,54,.08);color:#b96381}.pet-shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pet-shop-grid>button{min-height:118px;display:flex;flex-direction:column;align-items:flex-start;padding:12px;border:1px solid #eadbd3;border-radius:17px;background:#fffaf6;color:#715951;text-align:left}.pet-shop-grid i{font-size:24px;font-style:normal;color:#d17993}.pet-shop-grid b{margin-top:9px;font-size:11px}.pet-shop-grid small{margin-top:3px;color:#9d8a83;font-size:7px}.pet-shop-grid em{margin-top:auto;color:#b7647f;font-size:8px;font-style:normal}.pet-shop>p{color:#9b8882;font-size:8px;text-align:center}.pet-shop>.btn{width:100%}
.pet-style header,.pet-painter header{text-align:center}.pet-style header h3,.pet-painter header h3{margin:5px 0}.pet-style-preview{position:relative;height:232px;margin:4px 0 8px;overflow:hidden;border:1px solid rgba(213,172,154,.22);border-radius:22px;background:radial-gradient(circle at 50% 60%,#fffaf5,#f2dfd5)}.pet-style-preview>small{position:absolute;left:12px;top:10px;z-index:2;color:#b99588;font-size:7px;letter-spacing:.08em}.pet-style-preview svg{display:block;width:100%;height:226px;margin-top:5px}.pet-color-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:9px 0}.pet-color-row label{height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border:1px solid #e6d7cf;border-radius:12px;background:#fffaf7;color:#88736c;font-size:9px}.pet-color-row input{width:27px;height:27px;padding:0;border:0;background:transparent}.pet-style section{margin-top:11px}.pet-style section>b{display:block;margin-bottom:7px;color:#846e67;font-size:10px}.pet-style section>div{display:flex;gap:6px;overflow-x:auto}.pet-style section button{min-width:94px;height:35px;border:1px solid #e7d7cf;border-radius:11px;background:#fffaf7;color:#9b8580;font-size:8px}.pet-style section button.on{border-color:#dc8ca4;background:#fff0f5;color:#b85e7d}.pet-style-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.pet-style-actions button{height:42px;border:1px solid #dd9eb1;border-radius:13px;background:#fff4f7;color:#b45e7c;font-size:9px}.pet-style>.btn{width:100%;margin-top:12px}
.pet-painter header p{margin:5px 0 10px;color:#9d8983;font-size:8px}.pet-paint-stage{position:relative;width:min(100%,320px);aspect-ratio:1;margin:0 auto;overflow:hidden;border:1px solid #ead9d0;border-radius:22px;background:radial-gradient(circle,#fff9f4,#f2dfd5)}.pet-paint-stage svg,.pet-paint-stage canvas{position:absolute;inset:0;width:100%;height:100%}.pet-paint-stage canvas{z-index:3;touch-action:none}.pet-paint-tools{display:grid;grid-template-columns:40px 1fr 52px 52px;gap:6px;margin-top:9px}.pet-paint-tools input[type=color]{width:40px;height:36px;padding:3px;border:1px solid #e4d2ca;border-radius:10px;background:#fff}.pet-paint-tools input[type=range]{min-width:0}.pet-paint-tools button{border:1px solid #e4d2ca;border-radius:10px;background:#fffaf7;color:#88746e;font-size:8px}.pet-painter .btns{margin-top:10px}
@keyframes petTail{from{transform:rotate(-7deg)}to{transform:rotate(12deg)}}@keyframes petHop{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}45%{transform:translateX(-50%) translateY(-22px) scale(1.04,.97)}}@keyframes petPlay{0%,100%{transform:translateX(-50%) rotate(0)}30%{transform:translateX(-50%) rotate(-6deg) translateY(-9px)}70%{transform:translateX(-50%) rotate(6deg) translateY(-9px)}}@keyframes petSleep{0%,100%{transform:scale(1)}50%{transform:scale(1.01,.985)}}@keyframes petFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes petFly{0%,100%{transform:translate(0,0) rotate(0)}30%{transform:translate(14px,-12px) rotate(18deg)}65%{transform:translate(-9px,-18px) rotate(-15deg)}}@keyframes petCrate{0%,80%,100%{transform:translateX(-50%) rotate(0)}84%{transform:translateX(-50%) rotate(-2deg)}88%{transform:translateX(-50%) rotate(2deg)}92%{transform:translateX(-50%) rotate(-1deg)}}
@media(max-height:720px){.pet-room{height:430px;min-height:410px}.pet-character{width:min(66%,280px)}.pet-vitals{margin-bottom:8px}.pet-actions{margin:8px 0}.pet-actions button{height:64px}.pet-speech{top:58px}.pet-onboard-hero{min-height:285px}.pet-box-room{padding-top:28px}.pet-crate{bottom:88px}}
@media(prefers-reduced-motion:reduce){.pet-svg .pet-tail,.pet-svg.is-asleep,.pet-need-bubble,.pet-crate,.pet-flies i{animation:none!important}}

/* 沉浸式宠物房：背景本身就是玩法空间，不再嵌入卡片或灰色面板。 */
.pet-world,.pet-world *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.pet-world .pet-character .pet-svg,.pet-world .pet-character .pet-room-name{pointer-events:none}
.pet-home-world{position:absolute;inset:0;overflow:hidden;background:#f6dfca}.pet-world{position:absolute;inset:0;overflow:hidden;isolation:isolate;background:#f1d6bd}.pet-world>.pet-room-bg{z-index:-3;transform:none;background-image:url('assets/pet-room-v1.webp');background-size:cover;background-position:center center;filter:none!important}.pet-world:after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(180deg,rgba(255,248,235,.08),transparent 26%,transparent 78%,rgba(62,39,29,.08))}.pet-home-world.is-sleeping .pet-world:after{background:linear-gradient(180deg,rgba(92,89,125,.08),transparent 32%,transparent 77%,rgba(61,45,58,.1))}
.pet-world-top{position:absolute;left:0;right:0;top:0;z-index:30;height:60px;display:grid;grid-template-columns:70px 1fr 86px;align-items:center;padding:0 10px;background:linear-gradient(180deg,rgba(255,250,242,.94),rgba(255,248,238,.72) 76%,transparent);backdrop-filter:blur(6px);color:#6d554e}.pet-world-top>button{height:38px;border:0;background:transparent;color:#745d55;font-size:10px}.pet-world-top>button:first-child{text-align:left;font-size:26px}.pet-world-top>button:last-child{text-align:right}.pet-world-top>div{text-align:center;min-width:0}.pet-world-top b,.pet-world-top small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pet-world-top b{font-size:15px}.pet-world-top small{margin-top:2px;color:#a6897f;font-size:7px;letter-spacing:.03em}
.pet-world-switch{position:absolute;left:12px;right:134px;top:67px;z-index:25;display:flex;flex-wrap:wrap;gap:4px}.pet-world-switch button{max-width:68px;height:27px;padding:0 7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(131,89,73,.11);border-radius:99px;background:rgba(255,251,244,.72);backdrop-filter:blur(10px);color:#9a7d74;font-size:7px;box-shadow:0 5px 15px rgba(86,54,43,.06)}.pet-world-switch button.on{border-color:rgba(218,117,149,.26);background:rgba(255,246,249,.92);color:#bf6683}.pet-mini-vitals{position:absolute;right:12px;top:67px;z-index:25;width:110px;padding:7px 9px;border:1px solid rgba(255,255,255,.48);border-radius:15px;background:rgba(255,250,242,.68);backdrop-filter:blur(10px);box-shadow:0 7px 18px rgba(78,53,44,.07)}.pet-mini-vitals span{height:8px;display:grid;grid-template-columns:13px 1fr;align-items:center;gap:4px}.pet-mini-vitals span+span{margin-top:4px}.pet-mini-vitals i{color:#c4768e;font-size:8px;font-style:normal}.pet-mini-vitals u{height:3px;overflow:hidden;border-radius:99px;background:rgba(120,91,78,.13);text-decoration:none}.pet-mini-vitals b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e587a3,#f0b783)}
.pet-world .pet-role-chip{left:auto;right:13px;top:112px;z-index:24;height:29px;max-width:126px;padding-right:9px;background:rgba(255,252,246,.72)}.pet-world .pet-role-chip span{width:21px;height:21px}.pet-world .pet-role-chip b{font-size:7px}.pet-scene-hotspot{position:absolute;z-index:3;border:0;background:transparent;cursor:pointer}.pet-scene-hotspot:after{content:"";position:absolute;inset:12%;border:1px solid transparent;border-radius:45%;transition:.18s}.pet-scene-hotspot:active:after{border-color:rgba(255,255,255,.82);background:rgba(255,246,224,.16);box-shadow:0 0 28px rgba(255,236,188,.7)}.pet-scene-hotspot.bed{left:0;top:28%;width:45%;height:39%}.pet-scene-hotspot.bowl{right:0;top:29%;width:40%;height:35%}.pet-scene-hotspot.toy{left:0;bottom:0;width:48%;height:31%}
.pet-world .pet-character{position:absolute;left:var(--pet-x);top:var(--pet-y);bottom:auto;width:min(50%,220px);z-index:14;transform:translate(-50%,-60%);filter:drop-shadow(0 13px 10px rgba(77,48,37,.18));touch-action:none;cursor:grab;transition:left .72s cubic-bezier(.2,.8,.2,1),top .72s cubic-bezier(.2,.8,.2,1),filter .2s}.pet-world .pet-character.roommate{z-index:13;width:min(44%,192px);cursor:pointer}.pet-world .pet-character.active{z-index:15}.pet-world .pet-character.is-dragging{z-index:40;cursor:grabbing;filter:drop-shadow(0 20px 18px rgba(77,48,37,.28));transition:none;transform:translate(-50%,-60%) scale(.96)}.pet-world .pet-character .pet-svg{display:block;width:100%;height:auto;overflow:visible}.pet-world .pet-character.is-sleeping{width:min(var(--pet-sleep-width,30%),132px);z-index:var(--pet-sleep-z,18);transform:translate(-50%,-52%);filter:drop-shadow(0 5px 5px rgba(77,48,37,.13))}.pet-world .pet-character.is-sleeping.is-dragging{transform:translate(-50%,-52%) scale(.96)}.pet-room-name{position:absolute;left:50%;bottom:2px;padding:3px 7px;border-radius:99px;background:rgba(255,251,245,.82);color:#8a6d64;font-size:6px;white-space:nowrap;box-shadow:0 3px 10px rgba(72,45,35,.08);transform:translateX(-50%);opacity:.88}.pet-character.is-sleeping .pet-room-name{bottom:-5px}.pet-character.active .pet-room-name{color:#bc6681}
.pet-live-bubble{position:absolute;left:var(--pet-x);top:calc(var(--pet-y) - 19%);z-index:19;max-width:150px;padding:8px 11px;border:1px solid rgba(121,82,68,.1);border-radius:16px 16px 16px 4px;background:rgba(255,253,248,.91);color:#795f57;font-size:9px;line-height:1.35;text-align:center;box-shadow:0 8px 22px rgba(74,47,37,.11);transform:translateX(-50%);animation:petBubbleIn .25s ease-out}.pet-live-bubble:after{content:"";position:absolute;left:50%;bottom:-6px;border:6px solid transparent;border-top-color:rgba(255,253,248,.91);border-bottom:0}.pet-need-bubble.live{left:calc(var(--pet-x) + 10%);right:auto;top:calc(var(--pet-y) - 17%);width:43px;height:39px}.pet-need-bubble.live i{font-size:16px}.pet-zzz{position:absolute;left:calc(var(--pet-x) + 7%);top:calc(var(--pet-y) - 17%);z-index:18;width:58px;height:62px;color:#8b6f8e;pointer-events:none}.pet-zzz i{position:absolute;font-family:Georgia,serif;font-size:14px;font-style:italic;font-weight:700;animation:petZzz 2.2s ease-in-out infinite}.pet-zzz i:nth-child(2){left:18px;top:-14px;font-size:20px;animation-delay:-.7s}.pet-zzz i:nth-child(3){left:39px;top:-32px;font-size:13px;animation-delay:-1.35s}
.pet-live-bubble.pet-sick-bubble{border-color:rgba(178,83,91,.22);background:rgba(255,238,239,.95);color:#a94e58;font-weight:700}.pet-live-bubble.pet-sick-bubble:after{border-top-color:rgba(255,238,239,.95)}.pet-character.is-sick .pet-svg{filter:saturate(.62) brightness(.94)}.pet-sick-card{margin:10px 0;padding:13px;border:1px solid rgba(181,77,88,.18);border-radius:16px;background:rgba(255,235,238,.58);color:#855058}.pet-sick-card b,.pet-sick-card p{display:block;margin:0 0 7px}.pet-sick-card button{margin:4px 5px 0 0;padding:7px 10px;border:0;border-radius:10px;background:#c76f7d;color:#fff;font-size:10px}.pet-shop-grid.medicine{grid-template-columns:1fr}.pet-shop-grid.medicine button{min-height:138px}
.pet-poops.immersive{position:absolute;right:15%;bottom:17%;z-index:16;border:0;background:transparent}.pet-flies.immersive{right:12%;bottom:22%;z-index:17}.pet-world-dock{position:absolute;left:14px;right:14px;bottom:max(14px,env(safe-area-inset-bottom));z-index:31;height:64px;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:6px;border:1px solid rgba(255,255,255,.48);border-radius:23px;background:rgba(255,250,243,.73);backdrop-filter:blur(16px);box-shadow:0 12px 28px rgba(77,48,37,.13)}.pet-world-dock button{min-width:0;border:0;border-radius:17px;background:transparent;color:#7c625a}.pet-world-dock button:active{background:rgba(255,255,255,.72);transform:scale(.96)}.pet-world-dock i,.pet-world-dock span{display:block}.pet-world-dock i{color:#ca718d;font-size:17px;font-style:normal}.pet-world-dock span{margin-top:4px;font-size:7px}
.pet-character.react-hop,.pet-character.react-jump,.pet-character.react-first{animation:petWorldHop .86s cubic-bezier(.2,.9,.24,1)}.pet-character.react-spin{animation:petWorldSpin 1.15s cubic-bezier(.3,.75,.25,1)}.pet-character.react-nuzzle{animation:petWorldNuzzle .95s ease-in-out}.pet-character.react-lick{z-index:35;animation:petWorldLick 1.45s ease-in-out}.pet-character.react-voice{animation:petWorldVoice .48s ease-in-out 2}.pet-character.react-play{animation:petWorldPlay .9s ease-in-out}.pet-character.react-stretch{animation:petWorldStretch 1.05s ease-in-out}.pet-character.react-fetch{animation:petWorldFetch .62s ease-in-out infinite alternate}.pet-tongue{transform-box:fill-box;transform-origin:top center;animation:petTongue .45s ease-in-out infinite alternate}

.pet-toybox{text-align:center}.pet-toybox>small{color:#c67a94;font-size:8px;letter-spacing:.16em}.pet-toybox h3{margin:6px 0}.pet-toybox>p{margin:0 9px 12px;color:#9d847c;font-size:8px;line-height:1.55}.pet-toybox>div{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.pet-toybox>div button{min-width:0;padding:11px 5px;border:1px solid #ead9d0;border-radius:17px;background:#fffaf6;color:#785d55}.pet-toybox i{display:grid;width:46px;height:46px;margin:0 auto 8px;place-items:center;border-radius:50%;font-size:24px;font-style:normal;box-shadow:inset 0 -5px 9px rgba(95,63,50,.12),0 7px 14px rgba(95,63,50,.1)}.pet-toybox .yarn{background:repeating-radial-gradient(circle at 36% 31%,#f7d2df 0 3px,#de91ae 4px 7px);color:#fff}.pet-toybox .tennis{position:relative;background:#a8dba8}.pet-toybox .tennis:after{content:"";position:absolute;inset:5px;border:2px solid rgba(255,255,255,.85);border-left-color:transparent;border-right-color:transparent;border-radius:50%;transform:rotate(24deg)}.pet-toybox .star{background:#f7d782;color:#fff4cf}.pet-toybox b,.pet-toybox small{display:block}.pet-toybox b{font-size:8px}.pet-toybox button small{margin-top:4px;color:#aa9189;font-size:6px;line-height:1.35}.pet-toybox>.btn{width:100%;margin-top:11px}.pet-throw-layer{position:absolute;inset:105px 0 78px;z-index:28;border:0;background:rgba(255,250,230,.03);cursor:crosshair}.pet-throw-layer span{position:absolute;left:50%;top:12px;padding:8px 13px;border:1px solid rgba(255,255,255,.55);border-radius:99px;background:rgba(255,250,241,.9);color:#a66a7d;font-size:8px;white-space:nowrap;box-shadow:0 8px 20px rgba(88,52,39,.12);transform:translateX(-50%);animation:petBubbleIn .25s ease-out}.pet-thrown-ball{position:absolute;left:var(--ball-x);top:var(--ball-y);z-index:19;width:28px;height:28px;border:3px solid rgba(119,79,66,.45);border-radius:50%;box-shadow:inset 0 -5px 8px rgba(91,53,45,.16),0 7px 10px rgba(78,45,35,.18);transform:translate(-50%,-50%)}.pet-thrown-ball i{display:grid;width:100%;height:100%;place-items:center;color:#fff;font-size:14px;font-style:normal}.pet-thrown-ball.yarn{background:repeating-radial-gradient(circle at 36% 31%,#f7d2df 0 2px,#de91ae 3px 5px)}.pet-thrown-ball.tennis{background:#a8dba8}.pet-thrown-ball.star{background:#f2ca68}.pet-thrown-ball.flying{animation:petBallFlight .68s cubic-bezier(.15,.72,.3,1)}.pet-thrown-ball.caught{z-index:22;transition:left .72s cubic-bezier(.2,.8,.2,1),top .72s cubic-bezier(.2,.8,.2,1);transform:translate(-50%,-50%) scale(.76)}
.pet-breed-modal{text-align:center}.pet-breed-modal>small{color:#c67a94;font-size:8px;letter-spacing:.18em}.pet-breed-modal h3{margin:6px 0}.pet-breed-modal>p{margin:0 5px 11px;color:#9f8982;font-size:8px;line-height:1.5}.pet-breed-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pet-breed-grid button{min-width:0;padding:7px 7px 10px;border:1px solid #eadbd3;border-radius:17px;background:#fffaf6;color:#715851}.pet-breed-grid svg{display:block;width:100%;height:112px}.pet-breed-grid b,.pet-breed-grid small{display:block}.pet-breed-grid b{font-size:10px}.pet-breed-grid small{margin-top:4px;color:#aa928b;font-size:6px;line-height:1.45}.pet-breed-modal>.btn{width:100%;margin-top:10px}.pet-care-book>header{text-align:center}.pet-care-book>header small{color:#c67a94;font-size:8px;letter-spacing:.12em}.pet-care-book>header h3{margin:5px 0 13px}.pet-care-book>.btn{width:100%;margin-top:12px}
@keyframes petWorldHop{0%,100%{transform:translate(-50%,-60%)}45%{transform:translate(-50%,-83%) scale(1.05,.96)}}@keyframes petWorldSpin{0%{transform:translate(-50%,-60%) rotate(0)}45%{transform:translate(-50%,-75%) rotate(190deg) scale(.95)}100%{transform:translate(-50%,-60%) rotate(360deg)}}@keyframes petWorldNuzzle{0%,100%{transform:translate(-50%,-60%) rotate(0)}30%{transform:translate(-59%,-63%) rotate(-6deg)}70%{transform:translate(-43%,-63%) rotate(6deg)}}@keyframes petWorldLick{0%,100%{transform:translate(-50%,-60%) scale(1)}30%,72%{transform:translate(-50%,-54%) scale(1.72)}}@keyframes petWorldVoice{0%,100%{transform:translate(-50%,-60%) scaleY(1)}50%{transform:translate(-50%,-62%) scale(1.03,.96)}}@keyframes petWorldPlay{0%,100%{transform:translate(-50%,-60%) rotate(0)}30%{transform:translate(-62%,-72%) rotate(-10deg)}70%{transform:translate(-38%,-72%) rotate(10deg)}}@keyframes petWorldStretch{0%,100%{transform:translate(-50%,-52%) scale(1)}45%{transform:translate(-50%,-58%) scale(1.14,.86)}}@keyframes petWorldFetch{from{transform:translate(-50%,-60%) rotate(-3deg) scaleY(.96)}to{transform:translate(-50%,-68%) rotate(3deg) scaleY(1.04)}}@keyframes petBallFlight{0%{left:var(--ball-from-x);top:var(--ball-from-y);transform:translate(-50%,-50%) scale(.72) rotate(0)}48%{transform:translate(-50%,-190%) scale(1.12) rotate(220deg)}100%{left:var(--ball-x);top:var(--ball-y);transform:translate(-50%,-50%) scale(1) rotate(420deg)}}@keyframes petTongue{from{transform:scaleY(.72)}to{transform:scaleY(1.15)}}@keyframes petZzz{0%{opacity:0;transform:translate(0,7px) scale(.8)}35%{opacity:1}100%{opacity:0;transform:translate(8px,-12px) scale(1.12)}}@keyframes petBubbleIn{from{opacity:0;transform:translate(-50%,8px) scale(.9)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@media(max-height:720px){.pet-world-top{height:52px}.pet-world-switch,.pet-mini-vitals{top:57px}.pet-world .pet-role-chip{top:99px}.pet-world-dock{height:58px}.pet-world .pet-character{width:min(45%,190px)}}
/* Refined two-pet care, wardrobe and growth-book presentation. */
.pet-stage-book{gap:4px}.pet-stage-book span{overflow:hidden;padding:3px 1px 6px}.pet-stage-book svg{display:block;width:100%;height:66px;margin:-4px auto -7px;overflow:visible}.pet-stage-book b,.pet-stage-book small{display:block;white-space:nowrap}.pet-stage-book small{margin-top:2px;font-size:5px;opacity:.74}
.pet-log header>button{height:27px;padding:0 9px;border:1px solid #ead9d3;border-radius:9px;background:#fffaf7;color:#a78d85;font-size:7px}.pet-log p{display:grid;grid-template-columns:35px 1fr 25px;align-items:start;gap:7px}.pet-log p>button{width:25px;height:25px;border:0;border-radius:8px;background:#f2ebe7;color:#ab9690;font-size:11px}
.pet-style section>b em{margin-left:4px;color:#b9a09a;font-size:6px;font-style:normal;font-weight:400}.pet-style section button{min-width:104px;min-height:46px;height:auto;padding:5px 8px}.pet-style section button span,.pet-style section button small{display:block}.pet-style section button small{margin-top:3px;color:#b29d97;font-size:6px;line-height:1.25}.pet-style section button.locked{border-style:dashed;background:#f8f2ee;color:#8d7871}.pet-breed-section>div{display:grid!important;grid-template-columns:repeat(2,1fr);overflow:visible!important}.pet-breed-section .pet-breed-choice{position:relative;min-width:0;height:52px;padding-left:36px;text-align:left}.pet-breed-choice i{position:absolute;left:9px;top:13px;width:24px;height:24px;border:2px solid rgba(255,255,255,.8);border-radius:50%;box-shadow:0 2px 8px rgba(87,56,45,.13)}
.pet-world .pet-role-chip{top:142px}.pet-together-play{position:absolute;right:13px;top:181px;z-index:24;height:28px;padding:0 11px;border:1px solid rgba(219,127,155,.2);border-radius:99px;background:rgba(255,246,249,.79);backdrop-filter:blur(10px);color:#bd6985;font-size:7px;box-shadow:0 5px 15px rgba(86,54,43,.06)}
.pet-action-effect{position:absolute;left:var(--pet-x);top:calc(var(--pet-y) - 12%);z-index:23;width:120px;color:#fff;font-size:19px;font-weight:700;letter-spacing:6px;text-align:center;pointer-events:none;text-shadow:0 2px 9px rgba(86,56,47,.26);transform:translateX(-50%);animation:petActionFloat 2.15s ease-out both}.pet-action-effect.bath{color:#76c7d5}.pet-action-effect.eat{color:#cd8b4d}.pet-action-effect.clean{color:#e2bd58}.pet-action-effect.together{color:#e789a8}
.pet-character.react-eat{animation:petWorldEat .58s ease-in-out 2}.pet-character.react-bath{animation:petWorldBath .72s ease-in-out 2}.pet-character.react-clean{animation:petWorldClean .7s ease-in-out}.pet-character.react-together{animation:petWorldTogether .82s ease-in-out 2}.pet-character.react-lick{z-index:35;animation:petWorldLick 1.45s cubic-bezier(.22,.8,.25,1)}
@keyframes petWorldLick{0%,100%{transform:translate(-50%,-60%) scale(1) rotate(0)}26%{transform:translate(-50%,-66%) scale(1.1) rotate(-2deg)}48%,70%{transform:translate(-50%,-58%) scale(1.24) rotate(2deg)}84%{transform:translate(-50%,-64%) scale(1.08) rotate(-1deg)}}@keyframes petWorldEat{0%,100%{transform:translate(-50%,-60%) rotate(0)}45%{transform:translate(-50%,-53%) rotate(2deg) scale(1.04,.96)}}@keyframes petWorldBath{0%,100%{transform:translate(-50%,-60%) rotate(0)}45%{transform:translate(-50%,-67%) rotate(-3deg) scale(.98,1.04)}}@keyframes petWorldClean{0%,100%{transform:translate(-50%,-60%)}50%{transform:translate(-50%,-68%) scale(1.06)}}@keyframes petWorldTogether{0%,100%{transform:translate(-50%,-60%) rotate(0)}35%{transform:translate(-58%,-70%) rotate(-6deg)}70%{transform:translate(-42%,-67%) rotate(6deg)}}@keyframes petActionFloat{0%{opacity:0;transform:translate(-50%,12px) scale(.8)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,-35px) scale(1.15)}}
@media(max-height:720px){.pet-world .pet-role-chip{top:128px}.pet-together-play{top:163px}}
@media(prefers-reduced-motion:reduce){.pet-world .pet-character,.pet-world .pet-character *,.pet-zzz i{animation:none!important}}
.pet-world .pet-character.is-sleeping .pet-room-name{display:none}
.pet-world .pet-zzz{left:calc(var(--pet-x) + 4%);top:calc(var(--pet-y) - 8%);width:38px;height:36px}
.pet-world .pet-zzz i{font-size:10px}.pet-world .pet-zzz i:nth-child(2){left:11px;top:-8px;font-size:14px}.pet-world .pet-zzz i:nth-child(3){left:24px;top:-17px;font-size:9px}
.pet-species-grid-all button{overflow:hidden}.pet-species-grid-all svg.pet-species-hamster{transform:scale(.88)}.pet-species-grid-all svg.pet-species-rabbit{transform:scale(.93)}.pet-world .pet-svg.pet-species-hamster{transform:scale(.9);transform-origin:center bottom}.pet-world .pet-svg.pet-species-rabbit{transform:scale(.95);transform-origin:center bottom}
.pet-species-grid-all button{overflow:hidden}.pet-species-grid-all svg.pet-species-hamster{transform:scale(.88)}.pet-species-grid-all svg.pet-species-rabbit{transform:scale(.93)}.pet-world .pet-svg.pet-species-hamster{transform:scale(.9);transform-origin:center bottom}.pet-world .pet-svg.pet-species-rabbit{transform:scale(.95);transform-origin:center bottom}