.sprite img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
#petLayer{position:fixed;inset:0;z-index:24;pointer-events:none;overflow:hidden;touch-action:none}
#petLayer[hidden]{display:none}
.rpet{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}
.rpet .flip{transform-origin:50% 100%}
.rpet .body{transform-origin:50% 100%;pointer-events:auto;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;filter:drop-shadow(0 6px 6px #2f68952e)}
.rpet.drag .body{cursor:grabbing}
.rpet img{display:block;height:100%;width:auto;-webkit-user-drag:none;pointer-events:none}
.rpet .shadow{position:absolute;left:50%;bottom:-3px;width:70%;height:8px;margin-left:-35%;border-radius:50%;background:#2f68951f;filter:blur(2px);pointer-events:none}
.rpet .lid{position:absolute;pointer-events:none;opacity:0}
.rbubble{position:absolute;left:0;top:0;width:max-content;background:#fffffff2;color:#3f6a8e;border:1px solid #cfe2f1;border-radius:14px;padding:5px 10px;font-size:13px;line-height:1.4;box-shadow:0 6px 16px #2f689520;opacity:0;transition:opacity .22s;pointer-events:none;will-change:transform}
.rbubble.show{opacity:1}
.rbubble:after{content:"";position:absolute;top:50%;left:-5px;width:8px;height:8px;margin-top:-4px;background:inherit;border-left:1px solid #cfe2f1;border-bottom:1px solid #cfe2f1;transform:rotate(45deg)}
.rbubble.side-l:after{left:auto;right:-5px;border:0;border-right:1px solid #cfe2f1;border-top:1px solid #cfe2f1}
.rheart{position:absolute;pointer-events:none;font-size:16px;color:#ff7fa6;animation:rheart 1.1s ease-out forwards}
@keyframes rheart{0%{opacity:0;transform:translate(0,0) scale(.5)}15%{opacity:1}100%{opacity:0;transform:translate(var(--hx,0),var(--hy,-40px)) scale(1.1)}}
.rzzz{position:absolute;right:-4px;top:-6px;font-size:13px;color:#7ea4c8;font-weight:700;opacity:0;pointer-events:none}
.rzzz.on{animation:rzzz 2s ease-in-out infinite}
@keyframes rzzz{0%{opacity:0;transform:translate(0,6px) scale(.7)}40%{opacity:1}100%{opacity:0;transform:translate(8px,-18px) scale(1.1)}}
.night .rbubble{background:#2c4a66f2;color:#dbe9fb;border-color:#4d6e90}
.sleep-open #petLayer .rbubble{display:none}
#floatingPet{display:none}
body.locked #petLayer{display:none}
body.pets-on .companion .bubble{display:none!important}
@media(max-width:640px){
 .rheart{font-size:12px}
}

/* ===== 重做 M1：手机优先布局 ===== */
html{-webkit-text-size-adjust:100%}
body{overflow-wrap:anywhere}
.login-screen{display:flex;flex-direction:column;align-items:center;gap:14px;padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
.terminal{width:min(450px,100%);flex:none;margin:auto 0}
.login-screen .row{display:flex;flex-wrap:nowrap}
.login-screen .row input{flex:1 1 auto;width:auto;min-width:0}
.login-screen .password-toggle{flex:none;min-width:58px;cursor:pointer}
.terminal button[type=submit]{cursor:pointer;transition:background .15s,transform .1s}
.terminal button[type=submit]:active{transform:translateY(1px);background:#c0d8d2}
.terminal h1:after{content:"_";margin-left:4px;color:#88bbaa;animation:termcaret 1.1s steps(2) infinite}
@keyframes termcaret{50%{opacity:0}}
.terminal.deny{animation:termdeny .32s}
@keyframes termdeny{25%{transform:translateX(-6px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
@media(max-width:600px){
 .login-screen{justify-content:flex-start}
 .entry-label{position:static;align-self:flex-start;font-size:11px;letter-spacing:2px;z-index:1}
 .terminal-bar{font-size:11px;letter-spacing:1px;padding:13px 16px}
 .terminal-body{padding:24px 20px 20px}
 .terminal-code{font-size:12px;line-height:2;letter-spacing:.3px;margin-bottom:22px;padding-left:12px;white-space:nowrap;overflow:hidden}
 .terminal h1{font-size:27px;letter-spacing:4px;margin-bottom:6px}
 .terminal-sub{font-size:12px;letter-spacing:1px;margin-bottom:18px}
 .terminal label{font-size:13px;letter-spacing:1.5px;margin:18px 0 8px}
 .terminal input{font-size:17px;min-height:52px;padding:12px 14px}
 .login-screen .password-toggle{font-size:14px;min-width:64px}
 .terminal button[type=submit]{font-size:15px;letter-spacing:2px;min-height:56px;margin-top:22px}
 .login-error{font-size:13px;line-height:1.5;margin:14px 0 0}
 .terminal-footer{font-size:11px;letter-spacing:.5px;padding:13px 16px}
}
@media(max-width:850px){
 .sidebar{padding-left:max(4px,env(safe-area-inset-left));padding-right:max(4px,env(safe-area-inset-right))}
 .nav button{flex:1 1 0;min-width:0;min-height:50px;font-size:11px;white-space:nowrap;letter-spacing:-.2px;align-items:center;justify-content:center}
 .main{padding-top:max(17px,env(safe-area-inset-top))}
}
.hero-bubble{z-index:3}
@media(max-width:600px){
 .topbar .icon-btn{width:42px;height:42px}
 .hero-art{margin-left:0;display:flex;justify-content:center}
 .hero-bubble{top:-6px;right:4px}
 .hero-spark{z-index:0}
 .lyric-float{bottom:auto;top:30%;right:16px;left:16px;max-width:none;text-align:center}
 .lyric-float strong{font-size:26px}
 .care-item{min-height:64px}
 .btn{min-height:40px}
 dialog{width:calc(100vw - 24px);max-width:none;max-height:calc(100dvh - 32px);overflow:auto}
 .toast{width:max-content;text-align:center;line-height:1.5}
}
@media(max-width:600px){.hero-art{margin-top:16px}.hero-bubble{top:-8px}}

/* ===== 重做 M2：宠物地带 —— 猫狗和气泡都待在这条地板上，正文滚到它后面 ===== */
:root{--deck-l:0px;--deck-b:0px;--deck-h:0px}
#petDeck{display:none;position:fixed;left:var(--deck-l);right:0;bottom:var(--deck-b);height:var(--deck-h);z-index:23;overflow:hidden;background:linear-gradient(#f4f9fe,#e6f1fb 62%,#d6e7f7 62%,#e0edf9);border-top:1px solid #d3e4f3;box-shadow:0 -8px 20px #2f689514}
body.pets-on #petDeck{display:block}
body.pets-on .main{padding-bottom:calc(var(--deck-b) + var(--deck-h) + 22px)!important}
body.pets-on .toast{bottom:calc(var(--deck-b) + var(--deck-h) + 12px)}
#petDeck .cushion{position:absolute;bottom:5px;left:7%;width:84px;height:20px;border-radius:50%;background:radial-gradient(ellipse at 50% 35%,#fff,#c9def2 75%);box-shadow:0 2px 4px #2f689522}
#petDeck .bowl{position:absolute;bottom:6px;right:7%;width:34px;height:15px;border-radius:4px 4px 16px 16px;background:linear-gradient(#8fb9dc,#6d9cc4);box-shadow:0 2px 3px #2f689533}
#petDeck .bowl:before{content:"";position:absolute;left:3px;right:3px;top:-3px;height:6px;border-radius:50%;background:#e8d5b5}
.night #petDeck{background:linear-gradient(#20395a,#1b3350 62%,#16294a 62%,#19304f);border-top-color:#35557a;box-shadow:0 -8px 20px #0003}
.night #petDeck .cushion{background:radial-gradient(ellipse at 50% 35%,#5d7da3,#2d4a6e 75%)}
#petDeck,#petLayer{-webkit-user-select:none;user-select:none}
@media(max-width:850px){.rbubble{font-size:12px;padding:5px 9px;border-radius:12px;line-height:1.35}#petDeck .cushion{width:66px;height:15px}#petDeck .bowl{width:27px;height:12px}}

/* ===== 重做 M3：真眼皮 + 换图淡入 ===== */
.rpet .body{position:relative}
.rpet img.ghost{position:absolute;left:0;top:0;opacity:0}
.rpet img.ghost.fade{transition:opacity .2s ease-out}
.rpet .lid{display:none;opacity:1;border-radius:50%;background:var(--c);transform-origin:50% 0;transform:rotate(var(--r)) scaleY(var(--lid,0))}
.rpet.awake .lid{display:block}
.rpet.cat{--c:#b7a498}.rpet.dog{--c:#ecdcc6}
.rpet.cat .l1{left:44.5%;top:29.8%;width:11.5%;height:8.2%;--r:6deg;--c:#c4b2a6}
.rpet.cat .l2{left:66.2%;top:25.6%;width:11.5%;height:8.2%;--r:-10deg}
.rpet.dog .l1{left:36%;top:27.6%;width:8.6%;height:6.8%;--r:6deg}
.rpet.dog .l2{left:60%;top:22.4%;width:8.6%;height:6.8%;--r:-10deg}
.rpet .lid{filter:blur(.3px);box-sizing:border-box;border-bottom:1.5px solid #5f4e44}
.rpet.dog .lid{border-bottom-color:#6f5840}
.rpet.cat .l1{--c:#bcaa9d}.rpet.cat .l2{--c:#a99689}
@media(prefers-reduced-motion:reduce){.rpet img.ghost{display:none}}

/* ===== 重做 M4：气泡三种朝向 + 落地扬灰 ===== */
.rbubble.side-t:after{top:auto;bottom:-4px;left:var(--tx,50%);margin:0 0 0 -4px;border:0;border-right:1px solid #cfe2f1;border-bottom:1px solid #cfe2f1}
.rbubble.far:after{display:none}
.rbubble.compact{padding:2px 9px;line-height:1.3;white-space:nowrap;max-width:none}
.rbubble.clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines,3);overflow:hidden}
.night .rbubble:after{border-color:#4d6e90}
.no-motion .rbubble{transition:none}
.rpet .shadow{will-change:transform}
.rpuff{position:absolute;width:10px;height:10px;border-radius:50%;background:#fff;opacity:0;pointer-events:none;animation:rpuff .5s ease-out forwards}
.night .rpuff{background:#7f9dbd}
@keyframes rpuff{0%{opacity:.85;transform:translate(0,0) scale(.5)}100%{opacity:0;transform:translate(var(--dx,0),-7px) scale(1.5)}}

/* ===== 重做 M4：全站打磨（只动小屋，不动登录页） ===== */
/* 统一控件：同一层级同样的圆角、字号；按下有反馈 */
.main .btn{min-height:40px;border-radius:12px}
.main .card{border-radius:21px}
.main .btn,.main .chip,.care-item,.tabs button,.topbar .icon-btn,.nav button{transition:transform .12s ease-out,background-color .15s,color .15s,box-shadow .15s}
.main .btn:active,.main .chip:active,.care-item:active,.tabs button:active,.topbar .icon-btn:active{transform:scale(.97)}
.no-motion .main .btn:active,.no-motion .main .chip:active,.no-motion .care-item:active,.no-motion .tabs button:active,.no-motion .topbar .icon-btn:active{transform:none}
.main button:focus-visible,.main a:focus-visible,.main select:focus-visible,.topbar button:focus-visible,.nav button:focus-visible{outline:2px solid #6f9fc7;outline-offset:2px}
/* 空态：小插画 + 两行以内的话 */
.empty{display:block;font-size:13px;line-height:1.8;padding:22px 12px 26px}
.empty:before{content:"";display:block;width:76px;height:76px;margin:0 auto 10px;background:url(assets/sprites/cat_sleep.webp) center/contain no-repeat}
#taskList .empty:before{background-image:url(assets/sprites/dog_wave.webp)}
.journal-empty:before,p.empty:before{background-image:url(assets/sprites/cat_study.webp)}
@media(max-width:600px){
 .main .btn{min-height:44px;font-size:14px}
 .main .chip{min-height:38px;padding:7px 14px;font-size:13px}
 .tabs button{min-height:44px}
 .main select,.main input:not([type=checkbox]):not([type=radio]):not([type=range]){min-height:44px}
 .topbar .icon-btn{width:44px;height:44px}
 .main .edit{min-height:40px;min-width:44px}
 .main .link-btn{min-height:36px;display:inline-flex;align-items:center}
 .main .check{position:relative}
 .main .check:after{content:"";position:absolute;inset:-10px}
 .main h3{font-size:16px}
 .dashboard,.plan-layout,.focus-layout,.settings-grid,.scene-board{gap:16px}
 .stats{margin-bottom:16px}
 .page-intro{margin-bottom:18px}
}
/* 浮层：手机上位置固定，不互相压，也不被底栏/宠物带挡 */
@media(max-width:850px){
 body:not(.pets-on) .toast{bottom:calc(var(--deck-b,72px) + 12px)}
 .toast{max-width:calc(100% - 32px)}
}
.main .pet-room{border-radius:21px}
@media(max-width:600px){
 .main .btn{padding-top:9px;padding-bottom:9px}
 .main select{font-size:14px}
}
@media(max-width:600px){.view>.dashboard+.card,.view>.plan-layout+.card{margin-top:16px}}
