.pocket-pet-page{--pet-mint:#80f2cd;--pet-violet:#b59cff;--pet-gold:#ffd57c}
.pocket-pet-intro{margin-bottom:1rem}.pocket-pet-console{display:grid;grid-template-columns:minmax(260px,.92fr) minmax(320px,1.08fr);gap:clamp(1rem,3vw,2.25rem);padding:clamp(1rem,3vw,2rem);border:1px solid rgba(128,242,205,.2);overflow:hidden}
.pet-screen{min-height:430px;padding:1rem;border:1px solid rgba(128,242,205,.25);border-radius:22px;background:radial-gradient(ellipse at 50% 65%,rgba(69,127,142,.26),transparent 60%),linear-gradient(150deg,#101c29,#0b111d 72%);box-shadow:inset 0 0 35px rgba(36,201,171,.06);display:flex;flex-direction:column}
.pet-screen-top{display:flex;justify-content:space-between;color:#91b7be;font:700 .67rem/1.2 ui-monospace,SFMono-Regular,monospace;letter-spacing:.13em}.pet-scene{height:265px;position:relative;display:grid;place-items:center;overflow:hidden}.pet-scene:before{content:"";position:absolute;inset:20% 10% 0;border-radius:50%;background:radial-gradient(ellipse,rgba(99,189,182,.13),transparent 66%)}
.pet-character{z-index:1;position:relative;width:132px;height:128px;border-radius:48% 48% 43% 43%;background:linear-gradient(145deg,#b8a1ff,#8367d9 70%);box-shadow:inset -9px -10px 0 rgba(66,46,130,.23),inset 8px 7px 0 rgba(255,255,255,.22),0 18px 30px rgba(0,0,0,.3);animation:pet-bob 2.4s ease-in-out infinite;image-rendering:pixelated;transform-origin:center bottom}
.pet-ear{position:absolute;top:-13px;width:40px;height:42px;background:#a38af0;border-radius:8px 22px 5px 19px;z-index:-1}.pet-ear-left{left:1px;transform:rotate(-25deg)}.pet-ear-right{right:1px;transform:scaleX(-1) rotate(-25deg)}.pet-antenna{position:absolute;width:8px;height:25px;top:-25px;left:62px;background:#80f2cd;border-radius:8px}.pet-antenna:before{content:"";position:absolute;left:-6px;top:-8px;width:20px;height:20px;border-radius:50%;background:#80f2cd;box-shadow:0 0 16px rgba(128,242,205,.7)}
.pet-eyes{position:absolute;top:44px;left:35px;right:35px;display:flex;justify-content:space-between}.pet-eyes i{width:12px;height:17px;border-radius:50%;background:#152238;box-shadow:inset 3px 2px 0 #fff;animation:pet-blink 5s infinite}.pet-eyes i:nth-child(2){animation-delay:.04s}.pet-mouth{position:absolute;width:20px;height:10px;left:56px;top:77px;border-bottom:3px solid #593f88;border-radius:0 0 50% 50%}.pet-cheek{position:absolute;top:70px;width:16px;height:8px;border-radius:50%;background:rgba(255,143,179,.45)}.pet-cheek-left{left:18px}.pet-cheek-right{right:18px}.pet-ground{position:absolute;bottom:27px;width:160px;height:18px;border-radius:50%;background:rgba(0,0,0,.24);filter:blur(5px);transition:transform .2s ease,opacity .2s ease}.pet-spark{position:absolute;color:var(--pet-gold);font-size:1.3rem;animation:pet-twinkle 2s ease-in-out infinite}.pet-spark-one{left:22%;top:27%}.pet-spark-two{right:23%;top:42%;font-size:2rem;color:var(--pet-mint);animation-delay:.7s}.pet-effect{display:none;position:absolute;z-index:3;left:50%;top:15%;font-size:1.8rem;filter:drop-shadow(0 3px 5px rgba(0,0,0,.35));pointer-events:none}
.pet-screen-caption{text-align:center;display:flex;flex-direction:column;gap:.22rem}.pet-screen-caption strong{font-size:1.35rem;color:#fff}.pet-screen-caption span{font-size:.83rem;color:#9aaac0}.pet-message{min-height:1.35em;text-align:center;color:#a9edd6;font-size:.9rem;margin:.7rem 0 0}
.pet-dashboard{display:flex;flex-direction:column;gap:1.15rem;padding:.3rem 0}.pet-name-row label{display:block;font-size:.85rem;color:#b9c6d6;margin-bottom:.4rem}.pet-name-control{display:flex;gap:.55rem}.pet-name-control input{min-width:0;flex:1;border:1px solid rgba(154,174,201,.28);border-radius:11px;background:rgba(10,18,29,.72);color:#fff;padding:.72rem .85rem;font:inherit}.pet-small-button{border:1px solid rgba(128,242,205,.35);border-radius:10px;background:rgba(43,117,107,.2);color:#a8f2d7;padding:.6rem .9rem;font:700 .85rem inherit;cursor:pointer}.pet-small-button:hover{background:rgba(43,117,107,.4)}
.pet-stats{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.15rem}.pet-stat-label{display:flex;justify-content:space-between;margin-bottom:.38rem;color:#c8d2df;font-size:.82rem}.pet-stat-label span:last-child{color:#99aac0;font-variant-numeric:tabular-nums}.pet-meter{height:9px;overflow:hidden;border-radius:10px;background:rgba(151,169,195,.16)}.pet-meter span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#51d7b0,#c4f39e);transition:width .35s ease,background .35s ease}
.pet-actions{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.pet-actions button{display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left;column-gap:.55rem;padding:.7rem .8rem;min-height:64px;border:1px solid rgba(154,174,201,.19);border-radius:14px;background:rgba(14,23,36,.72);color:#f0f4fa;font:inherit;cursor:pointer;transition:transform .15s ease,border-color .15s ease,background .15s ease}.pet-actions button:hover{transform:translateY(-2px);border-color:rgba(128,242,205,.55);background:rgba(30,54,63,.65)}.pet-actions button:active{transform:translateY(0)}.pet-actions button:focus-visible,.pet-name-control input:focus-visible,.pet-small-button:focus-visible{outline:2px solid var(--pet-mint);outline-offset:3px}.pet-action-icon{grid-row:1/3;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(128,242,205,.12);color:var(--pet-mint);font-size:1.15rem}.pet-actions button:nth-child(2) .pet-action-icon{color:var(--pet-gold);background:rgba(255,213,124,.1)}.pet-actions button:nth-child(3) .pet-action-icon{color:#93c4ff;background:rgba(91,155,230,.12)}.pet-actions button:nth-child(4) .pet-action-icon{color:#c0adff;background:rgba(181,156,255,.12)}.pet-actions button>span:nth-child(2){font-weight:700;font-size:.9rem}.pet-actions small{color:#8e9eb3;font-size:.73rem}.pet-footnote{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;color:#91a0b5;font-size:.74rem}.pet-saved-dot{width:7px;height:7px;border-radius:50%;background:#66e1b5;box-shadow:0 0 8px rgba(102,225,181,.7)}#care-days{margin-left:auto;color:#adbbce}.pocket-pet-note{margin-top:1rem;padding:1.2rem 1.4rem}.pocket-pet-note h2{margin-top:0;font-size:1.12rem}.pocket-pet-note p{margin-bottom:0;color:#b5c1d0;max-width:75ch}
.mood-happy .pet-character{filter:saturate(1.04)}.mood-sad .pet-character{filter:saturate(.72) brightness(.9)}.mood-sad .pet-mouth{top:83px;border-bottom:0;border-top:3px solid #593f88;border-radius:50% 50% 0 0}.mood-sleepy .pet-eyes i{height:4px;transform:translateY(6px);box-shadow:none}.mood-sleepy .pet-mouth{width:8px;height:8px;top:76px;border:2px solid #593f88;border-radius:50%}.mood-loves .pet-character{background:linear-gradient(145deg,#ffa1be,#e66e9a 70%)}
.action-feed .pet-character{animation:pet-munch .72s ease-in-out 2}.action-feed .pet-effect{display:block;animation:effect-feed 1.25s ease-out both}.action-feed .pet-effect:before{content:"🍓"}.action-play .pet-character{animation:pet-hop 1.15s cubic-bezier(.3,.65,.4,1)}.action-play .pet-ground{transform:scaleX(.7);opacity:.55}.action-play .pet-effect{display:block;animation:effect-play 1.2s ease-out both}.action-play .pet-effect:before{content:"✦  ✧";color:#ffe18b;text-shadow:0 0 12px #ffd56c}.action-clean .pet-character{animation:pet-shake .85s ease-in-out 2}.action-clean .pet-effect{display:block;animation:effect-clean 1.25s ease-out both}.action-clean .pet-effect:before{content:"🫧"}.action-nap .pet-character{animation:pet-doze 1.35s ease-in-out both}.action-nap .pet-eyes i{animation:none;height:3px;transform:translateY(7px);box-shadow:none}.action-nap .pet-effect{display:block;left:68%;top:28%;animation:effect-nap 1.35s ease-out both}.action-nap .pet-effect:before{content:"Z z z";color:#b7a8ff;font-size:1.05rem;font-weight:800}
.pocket-pet-preview{display:flex;align-items:center;justify-content:center;gap:1rem;background:radial-gradient(ellipse at center,rgba(116,99,198,.26),transparent 65%),linear-gradient(135deg,#111b2c,#0c1521)}.pocket-pet-mini{position:relative;width:58px;height:56px;border-radius:44% 44% 40% 40%;background:linear-gradient(145deg,#b8a1ff,#8367d9);box-shadow:inset -5px -5px rgba(66,46,130,.22),0 7px 20px rgba(128,103,217,.28)}.pocket-pet-mini .pet-antenna{left:27px;top:-12px;width:4px;height:13px}.pocket-pet-mini .pet-antenna:before{width:10px;height:10px;left:-3px;top:-5px}.pocket-pet-mini .pet-eyes{top:22px;left:15px;right:15px}.pocket-pet-mini .pet-eyes i{width:6px;height:9px;box-shadow:inset 2px 1px #fff}.pocket-pet-mini .pet-smile{position:absolute;width:9px;height:5px;top:35px;left:24px;border-bottom:2px solid #593f88;border-radius:0 0 50% 50%}.pocket-pet-hearts{color:#b5a1ff;font-size:.9rem}
@keyframes pet-bob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}@keyframes pet-twinkle{0%,100%{opacity:.45;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}@keyframes pet-blink{0%,45%,48%,100%{transform:scaleY(1)}46%,47%{transform:scaleY(.08)}}@keyframes pet-munch{0%,100%{transform:scale(1)}22%,66%{transform:scale(1.08,.89)}44%,88%{transform:scale(.94,1.08)}}@keyframes pet-hop{0%,100%{transform:translateY(0) rotate(0)}18%{transform:translateY(4px) scale(1.1,.85)}42%{transform:translateY(-48px) rotate(-9deg) scale(.96,1.06)}62%{transform:translateY(-35px) rotate(9deg)}78%{transform:translateY(3px) scale(1.12,.86)}88%{transform:translateY(-9px) scale(.97,1.04)}}@keyframes pet-shake{0%,100%{transform:translateX(0) rotate(0)}20%{transform:translateX(-8px) rotate(-6deg)}40%{transform:translateX(8px) rotate(6deg)}60%{transform:translateX(-5px) rotate(-4deg)}80%{transform:translateX(4px) rotate(4deg)}}@keyframes pet-doze{0%{transform:rotate(0) translateY(0)}35%,80%{transform:rotate(9deg) translateY(5px)}100%{transform:rotate(0) translateY(0)}}@keyframes effect-feed{0%{opacity:0;transform:translate(-25px,30px) scale(.6)}35%{opacity:1;transform:translate(-35px,6px) scale(1.15)}75%{opacity:1;transform:translate(-12px,42px) scale(.8)}100%{opacity:0;transform:translate(-5px,68px) scale(.45)}}@keyframes effect-play{0%{opacity:0;transform:translate(-12px,48px) scale(.4) rotate(0)}35%{opacity:1;transform:translate(14px,-10px) scale(1.25) rotate(75deg)}75%{opacity:1;transform:translate(-39px,-28px) scale(.9) rotate(150deg)}100%{opacity:0;transform:translate(-55px,-46px) scale(.4) rotate(210deg)}}@keyframes effect-clean{0%{opacity:0;transform:translate(-54px,40px) scale(.5)}35%{opacity:1;transform:translate(20px,0) scale(1.2)}70%{opacity:1;transform:translate(-48px,-35px) scale(.9)}100%{opacity:0;transform:translate(45px,-55px) scale(.4)}}@keyframes effect-nap{0%{opacity:0;transform:translateY(15px) scale(.6)}30%,75%{opacity:1;transform:translateY(-8px) scale(1)}100%{opacity:0;transform:translateY(-24px) scale(1.1)}}
@media(max-width:760px){.pocket-pet-console{grid-template-columns:1fr}.pet-screen{min-height:380px}.pet-scene{height:225px}.pet-dashboard{padding:.1rem 0}.pet-stats{gap:.85rem}.pet-footnote{font-size:.7rem}}
@media(prefers-reduced-motion:reduce){.pet-character,.pet-spark,.pet-eyes i,.pet-effect{animation:none!important}.pet-actions button,.pet-meter span,.pet-ground{transition:none}}