/* 晴芽 · 小世界养成 HUD（与主站米白浅绿风格一致） */
.kinder-hud{position:absolute;top:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;background:#ffffffd9;border:1px solid #fff;border-radius:22px;padding:7px 14px;box-shadow:0 6px 20px #33442214;backdrop-filter:blur(6px);pointer-events:auto;font-size:13px;color:#3f5a3c;white-space:nowrap;z-index:5}
.kinder-hud .stat{display:flex;align-items:center;gap:4px;font-weight:600}
.kinder-hud .stat .ico{font-size:15px;line-height:1}
.kinder-hud .divider{width:1px;height:16px;background:#e3eadb}
.kinder-hud .lv{background:#a7ed62;color:#294f28;border-radius:12px;padding:2px 9px;font-size:12px;font-weight:700;animation:pop .3s}
.kinder-grow{position:absolute;top:56px;left:50%;transform:translateX(-50%);width:176px;height:6px;background:#e3eadb;border-radius:3px;overflow:hidden;pointer-events:none;z-index:5}
.kinder-grow i{display:block;height:100%;background:#7aac6b;border-radius:3px;transition:width .4s ease}
.kinder-rate{position:absolute;top:66px;left:50%;transform:translateX(-50%);font-size:10px;color:#6f8366;pointer-events:none;z-index:5}
.kinder-shop-btn{border:1px solid #fff;border-radius:10px;background:#ffffffc9;color:#546d4b;box-shadow:0 3px 10px #33442206;width:34px;height:34px;font-size:17px;line-height:1;transition:transform .15s}
.kinder-shop-btn:active{transform:scale(.92)}
.kinder-shop-btn .dot{position:absolute;right:-3px;top:-3px;width:9px;height:9px;border-radius:50%;background:#e99e80;border:2px solid #fff}
.kinder-panel{position:absolute;left:18px;bottom:18px;width:min(320px,calc(100% - 36px));background:#fffffff7;border:1px solid #d9e3d2;border-radius:16px;padding:16px;box-shadow:0 12px 40px #33442224;transform:translateY(18px) scale(.98);opacity:0;pointer-events:none;transition:.25s ease;z-index:20;max-height:70%;overflow:auto}
.kinder-panel.open{transform:none;opacity:1;pointer-events:auto}
.kinder-panel .head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.kinder-panel h3{margin:0;font-size:15px;color:#253b30;letter-spacing:-.3px}
.kinder-panel .close{border:none;background:none;color:#9aa897;font-size:18px;padding:2px 6px;border-radius:8px}
.kinder-panel .close:hover{background:#f0f4ec}
.kinder-panel .rate{margin:0 0 12px;font-size:11px;color:#7f8b7c}
.kinder-item{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid #e7eee0;border-radius:13px;margin-bottom:9px;transition:background .15s}
.kinder-item .ficon{font-size:22px;width:28px;text-align:center}
.kinder-item .fbody{flex:1;min-width:0}
.kinder-item .fname{font-size:13px;font-weight:600;color:#31463a}
.kinder-item .fdesc{font-size:10.5px;color:#8b9889;margin-top:2px}
.kinder-item .fbuy{border:1px solid #d5e4c8;background:#f2f8ec;color:#3f693d;border-radius:10px;padding:7px 12px;font-size:12px;font-weight:600;white-space:nowrap;transition:.15s}
.kinder-item .fbuy:not(:disabled):hover{background:#e5f0dc}
.kinder-item .fbuy:disabled{background:#f4f6f1;color:#b7c1b4;border-color:#eef1ea;cursor:default}
.kinder-item .fbuy.owned{background:#a7ed62;color:#294f28;border-color:#a7ed62}
.kinder-item .fbuy .st{font-size:10px;font-weight:500;opacity:.8}
.kinder-toast{position:absolute;top:88px;left:50%;transform:translate(-50%,-8px);background:#253b30ee;color:#f4f4ef;border-radius:20px;padding:9px 16px;font-size:12px;box-shadow:0 8px 24px #253b3033;opacity:0;pointer-events:none;transition:.3s ease;z-index:30;white-space:nowrap}
.kinder-toast.show{opacity:1;transform:translate(-50%,0)}
.kinder-float{position:absolute;font-size:16px;font-weight:700;color:#3f693d;pointer-events:none;z-index:10;animation:floatUp 1.1s ease forwards;text-shadow:0 1px 0 #fff}
@keyframes floatUp{0%{opacity:0;transform:translateY(6px) scale(.8)}20%{opacity:1;transform:translateY(0) scale(1.1)}100%{opacity:0;transform:translateY(-34px) scale(1)}}
@keyframes pop{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
@media(max-width:640px){.kinder-hud{top:10px;padding:6px 11px;font-size:12px;gap:7px}.kinder-grow{top:48px}.kinder-rate{top:58px}.kinder-toast{top:76px}}

/* ---- 互动层：需求气泡 / 限时彩蛋 / 连击 ---- */
.kinder-bubble{position:absolute;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:3px;background:#fffffff2;border:1.5px solid #f2d07e;border-radius:16px;padding:7px 11px 9px;box-shadow:0 6px 18px #3344221f;cursor:pointer;z-index:8;animation:bubbleIn .28s cubic-bezier(.34,1.56,.64,1);user-select:none;-webkit-user-select:none}
.kinder-bubble .need{font-size:19px;line-height:1;animation:bob 1.2s ease-in-out infinite}
.kinder-bubble .want{font-size:10px;color:#7f8b7c;white-space:nowrap;font-weight:600}
.kinder-bubble .cd{width:100%;height:3px;background:#eef1ea;border-radius:2px;overflow:hidden}
.kinder-bubble .cd i{display:block;height:100%;background:#e99e80;border-radius:2px;animation:cdShrink linear forwards}
.kinder-bubble:hover{background:#fff;border-color:#e99e80}
.kinder-bubble:active{transform:translate(-50%,-100%) scale(.93)}
.kinder-bubble.done{animation:bubbleDone .35s ease forwards}
.kinder-bubble.miss{animation:bubbleMiss .5s ease forwards}
.kinder-bonus{position:absolute;transform:translate(-50%,-50%);font-size:30px;cursor:pointer;z-index:8;filter:drop-shadow(0 3px 8px #f2d07e88);animation:bonusSpin 1.6s linear infinite,bonusPulse 1.1s ease-in-out infinite;user-select:none;-webkit-user-select:none}
.kinder-bonus .halo{position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,#f2d07e55 0%,transparent 70%);animation:bonusPulse 1.1s ease-in-out infinite}
.kinder-bonus.got{animation:bonusGot .4s ease forwards}
.kinder-combo{display:none;align-items:center;gap:3px;background:#e99e80;color:#fff;border-radius:12px;padding:2px 8px;font-size:11px;font-weight:700;animation:pop .3s}
.kinder-combo.on{display:flex}
@keyframes bubbleIn{0%{opacity:0;transform:translate(-50%,-100%) scale(.4)}100%{opacity:1;transform:translate(-50%,-100%) scale(1)}}
@keyframes bubbleDone{to{opacity:0;transform:translate(-50%,-140%) scale(1.2)}}
@keyframes bubbleMiss{to{opacity:0;transform:translate(-50%,-100%) translateY(10px) scale(.8)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes cdShrink{from{width:100%}to{width:0%}}
@keyframes bonusSpin{to{transform:rotate(360deg)}}
@keyframes bonusPulse{0%,100%{opacity:1;scale:1}50%{opacity:.75;scale:1.18}}
@keyframes haloPulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes bonusGot{to{opacity:0;scale:2.2}}