
:root{--bg:#07080c;--panel:rgba(20,22,30,.78);--line:rgba(255,255,255,.09);--text:#f5f7fb;--muted:#949cab;--green:#a7ff66;--purple:#b27cff;--pink:#ff79b8;--blue:#65cfff;--warn:#ffb45e;--danger:#ff6f73}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);background:radial-gradient(circle at 50% -10%,#252942 0,#0d0f18 36%,#06070b 72%);overflow-x:hidden}body{padding:28px 18px 48px}.stars{position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.5px);background-size:46px 46px;mask-image:linear-gradient(#000,transparent 82%)}button,input,select{font:inherit}.game-shell{width:min(1120px,100%);margin:auto;position:relative;z-index:1}.glass{background:linear-gradient(180deg,rgba(30,33,45,.86),rgba(13,15,22,.88));border:1px solid var(--line);box-shadow:0 20px 70px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(14px);border-radius:26px}.topbar{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;margin-bottom:16px}.eyebrow{font-size:11px;letter-spacing:.17em;color:#8992a6;font-weight:850}.topbar h1,.panel h2{margin:4px 0 0;font-size:clamp(22px,3vw,34px);letter-spacing:-.04em}.wallet{display:flex;gap:9px;align-items:center;background:#10131b;border:1px solid var(--line);padding:10px 14px;border-radius:999px}.coin{color:#caa7ff;text-shadow:0 0 15px #9c6bff}
.scene{position:relative;overflow:hidden;min-height:570px;padding:18px}.ambient{position:absolute;width:340px;height:340px;filter:blur(75px);opacity:.16;border-radius:50%;pointer-events:none}.ambient-a{background:#7a49ff;left:-110px;top:90px}.ambient-b{background:#73ff98;right:-130px;bottom:-150px}.scene-top{position:relative;z-index:8;display:flex;gap:10px;justify-content:space-between;align-items:center}.scene-tools{display:flex;align-items:center;gap:8px}.anim-badge{font-size:10px;letter-spacing:.13em;font-weight:900;color:#bca3ff;background:rgba(151,102,255,.11);border:1px solid rgba(173,123,255,.22);padding:8px 10px;border-radius:999px}.single-cat-label{font-size:11px;letter-spacing:.16em;font-weight:900;color:#bca3ff;background:rgba(151,102,255,.11);border:1px solid rgba(173,123,255,.22);padding:8px 11px;border-radius:999px}.text-btn,.action,.cat-card{color:inherit;border:0;cursor:pointer}.cat-zone{position:relative;min-height:485px;display:grid;place-items:center;overflow:hidden}.floor-glow{position:absolute;width:440px;height:110px;bottom:63px;border-radius:50%;background:radial-gradient(ellipse,rgba(164,122,255,.18),rgba(0,0,0,0) 68%);filter:blur(5px)}.cat-card{position:relative;z-index:4;width:min(520px,92vw);height:395px;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0;user-select:none;outline:none}.cat-card:focus-visible{border-radius:24px;box-shadow:0 0 0 3px rgba(173,123,255,.5)}.cat-actor{width:340px;height:340px;display:grid;place-items:end center;transform-origin:center bottom;transition:filter .25s ease}.cat-sprite{width:330px;height:330px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 26px 30px rgba(0,0,0,.42));user-select:none;pointer-events:none}.cat-card:hover .cat-actor{filter:brightness(1.04)}.cat-card.pet-pulse .cat-actor{animation:petPulse .55s ease}.cat-actor.motion-walk{animation:walkTravel 1.2s ease-in-out}.cat-actor.motion-run{animation:runTravel .82s ease-in-out}.cat-actor.motion-jump{animation:jumpLift .9s ease-in-out}.cat-actor.motion-play{animation:playBounce 1.15s ease-in-out}.speech{position:absolute;z-index:12;top:78px;left:50%;transform:translateX(-50%);max-width:80%;background:#fff;color:#11141d;padding:10px 14px;border-radius:16px 16px 16px 4px;font-weight:850;box-shadow:0 10px 30px rgba(0,0,0,.2);transition:opacity .18s}.hidden{opacity:0;pointer-events:none}.heart-burst{position:absolute;z-index:13;top:130px;left:50%;font-size:28px;pointer-events:none}.heart{position:absolute;animation:heart 1s ease forwards}
.panel-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:16px;margin-top:16px}.panel{padding:22px}.panel-title-row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.mood{font-size:12px;font-weight:850;padding:8px 10px;border-radius:999px}.mood.good{background:rgba(167,255,102,.11);color:var(--green)}.mood.ok{background:rgba(255,180,94,.1);color:var(--warn)}.mood.bad{background:rgba(255,111,115,.1);color:var(--danger)}.cat-meta{margin-top:6px;color:#97a0b3;font-size:13px}.stat{margin-top:18px}.stat-head{display:flex;justify-content:space-between;font-size:13px;color:#b5bcc9}.track{height:10px;border-radius:999px;background:#0b0d13;overflow:hidden;margin-top:7px;border:1px solid rgba(255,255,255,.05)}.fill{height:100%;width:50%;border-radius:inherit;transition:width .35s ease}.fill.hunger{background:linear-gradient(90deg,#ff9c66,#ffd061)}.fill.love{background:linear-gradient(90deg,#ff6da9,#bd7cff)}.fill.energy{background:linear-gradient(90deg,#5abfff,#85ffd1)}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.action{min-height:86px;background:#10131b;border:1px solid var(--line);border-radius:18px;text-align:left;padding:10px 12px;display:flex;align-items:center;gap:10px;transition:.18s}.action:hover{transform:translateY(-2px);border-color:rgba(173,123,255,.4)}.action:disabled{opacity:.5;cursor:wait;transform:none}.action img,.fallback-icon{width:54px;height:54px;object-fit:contain;display:grid;place-items:center;font-size:30px;flex:0 0 54px}.action b{display:block;margin-bottom:4px}.action small{color:#72798b}.diary-panel{margin-top:16px}.text-btn{background:transparent;color:#9299aa;padding:8px}.text-btn:hover{color:#fff}.log{display:grid;gap:8px;margin-top:15px;max-height:185px;overflow:auto}.log-item{padding:10px 12px;border-radius:13px;background:#0e1118;border:1px solid rgba(255,255,255,.05);font-size:13px;color:#aeb5c3}.log-item b{color:#e8eaf0}.log-item time{color:#666e80;margin-right:8px}.sprite-info{margin-top:16px;padding:15px 18px;color:#8992a6;font-size:12px}.sprite-info summary{cursor:pointer;color:#b5bdca;font-weight:800}.sprite-info p{margin:10px 0 0;line-height:1.6}
.shake{animation:shake .35s ease}.flash{animation:flash .4s ease}
@keyframes petPulse{0%{transform:scale(1)}40%{transform:scale(1.04) rotate(-1deg)}72%{transform:scale(1.02) rotate(1deg)}100%{transform:scale(1)}}@keyframes heart{0%{opacity:0;transform:translate(0,10px) scale(.5)}20%{opacity:1}100%{opacity:0;transform:translate(var(--x),-95px) scale(1.35)}}@keyframes walkTravel{0%,100%{transform:translateX(-38px)}50%{transform:translateX(45px)}}@keyframes runTravel{0%,100%{transform:translateX(-80px)}50%{transform:translateX(95px)}}@keyframes jumpLift{0%,100%{transform:translateY(0)}45%{transform:translateY(-42px)}}@keyframes playBounce{0%,100%{transform:translateX(0) rotate(0)}35%{transform:translateX(-30px) rotate(-2deg)}70%{transform:translateX(28px) rotate(2deg)}}@keyframes shake{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}@keyframes flash{50%{filter:brightness(1.4)}}
@media(max-width:760px){
  body{padding:12px 10px 30px}
  .glass{border-radius:20px}
  .topbar{padding:16px}
  .panel-grid{grid-template-columns:1fr;margin-top:6px}
  .actions-panel{order:-1}
  .scene{min-height:430px;padding:14px 14px 6px}
  .cat-zone{min-height:348px}
  .cat-card{height:325px}
  .cat-actor{width:290px;height:290px}
  .cat-sprite{width:280px;height:280px}
  
  .action-grid{grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}
  .action{min-height:72px;padding:8px 10px;gap:8px;border-radius:16px}
  .action img,.fallback-icon{width:46px;height:46px;flex-basis:46px;font-size:26px}
  .action b{font-size:13px;margin-bottom:2px}
  .action small{font-size:11px}
  .panel{padding:15px}
  .speech{top:55px}
  .anim-badge{display:none}
}
@media(max-width:430px){
  .scene{min-height:395px;padding:12px 10px 2px}
  .cat-zone{min-height:315px}
  .cat-card{height:300px;width:100%}
  .cat-sprite{width:255px;height:255px}
  .cat-actor{width:265px;height:265px}
  .action-grid{grid-template-columns:1fr 1fr;gap:7px}
  .action{min-height:66px;padding:7px 8px;gap:7px}
  .action img,.fallback-icon{width:39px;height:39px;flex-basis:39px;font-size:23px}
  .action b{font-size:12px}
  .action small{font-size:10px;line-height:1.2}
  .wallet{padding:9px 11px}
}

