*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100vh;min-height:100dvh}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#7d5132;color:#f6ead9}.stage{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:12px;padding:calc(env(safe-area-inset-top,0px) + 14px) 14px calc(env(safe-area-inset-bottom,0px) + 20px)}.hud{width:100%;max-width:340px}.needs{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px}.need{display:flex;align-items:center;gap:6px}.need__ic{font-size:15px;width:20px;text-align:center}.pips{display:flex;gap:3px}.pip{width:16px;height:9px;border-radius:3px;background:#00000047}.pip.on{background:#f0c674}.meta{margin-top:8px;display:flex;gap:6px;font-size:12px;opacity:.85;flex-wrap:wrap}.device-wrap{display:flex;flex-direction:column;align-items:center;gap:6px}.device{position:relative;width:min(94vw,400px);aspect-ratio:1 / 1;flex-shrink:0}.device-art{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;pointer-events:none;-webkit-user-select:none;user-select:none}.device-screen{position:absolute;left:28.125%;top:48.4375%;width:44.0625%;height:23.75%;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:4px;transition:background .4s ease}.device-screen.is-dark{background:#00000080}.pet-name{position:absolute;top:2px;left:4px;font-size:9px;font-weight:700;color:#3f5230;z-index:2;opacity:.75}.ye-viewport{height:100%;aspect-ratio:1 / 1;overflow:hidden}.dev-btn{position:absolute;top:78.9%;width:14%;aspect-ratio:1 / 1;transform:translate(-50%,-50%);padding:0;border:none;background:transparent;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent}.dev-btn--a{left:36.875%}.dev-btn--b{left:49.375%}.dev-btn--c{left:61.875%}.dev-btn:after{content:"";position:absolute;top:24%;right:24%;bottom:24%;left:24%;border-radius:50%;background:transparent;transition:background .1s ease}.dev-btn:active:after{background:#0000004d}.dev-btn:active{transform:translate(-50%,-50%) scale(.92)}.btn-legend{display:flex;gap:18px;font-size:10px;opacity:.55}.ye-strip{height:100%;width:auto;image-rendering:pixelated;image-rendering:crisp-edges}.ye-strip.is-playing{animation:ye-play var(--dur) steps(var(--frames)) infinite;will-change:transform}@keyframes ye-play{0%{transform:translate(0)}to{transform:translate(-100%)}}@media (prefers-reduced-motion: reduce){.ye-strip.is-playing{animation:none}}.egg{font-size:52px;line-height:1;animation:egg-wobble 1.6s ease-in-out infinite}@keyframes egg-wobble{0%,to{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}.grave{font-size:48px;line-height:1;filter:grayscale(.4);opacity:.85}.overlays{position:absolute;top:2px;right:3px;display:flex;gap:3px;font-size:13px}.ov.att{animation:blink .8s steps(1) infinite}@keyframes blink{50%{opacity:.15}}.poops{position:absolute;bottom:1px;left:3px;display:flex;gap:1px;font-size:12px}.status-panel{position:absolute;left:12%;right:12%;top:26%;bottom:14%;z-index:6;border-radius:12px;background:#2a1a0f;color:#f6ead9;padding:12px 14px;display:flex;flex-direction:column;gap:4px;font-size:13px;box-shadow:0 8px 24px #00000073}.status-panel b{font-size:13px;letter-spacing:2px;opacity:.7}.status-hint{margin-top:auto;font-size:11px;opacity:.5}.toast{position:absolute;top:calc(env(safe-area-inset-top,0px) + 96px);left:50%;transform:translate(-50%);z-index:8;padding:8px 16px;border-radius:12px;background:#2a1a0f;font-size:13px;box-shadow:0 6px 20px #0006;animation:toast-in .18s ease-out;white-space:nowrap}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%)}}.skin-corner{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:12px;display:flex;flex-direction:column;gap:8px;z-index:5}.skin-chip{width:40px;height:40px;padding:2px;border:2px solid transparent;border-radius:10px;background:#0003;cursor:pointer;overflow:hidden}.skin-chip img{width:100%;height:100%;object-fit:contain;object-position:top;image-rendering:pixelated}.skin-chip.is-active{border-color:#f3e3d3;background:#00000057}.menu{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;max-width:360px}.menu-ic{display:flex;flex-direction:column;align-items:center;gap:1px;width:46px;padding:5px 2px;border-radius:10px;border:2px solid transparent;font-size:20px;background:#00000024}.menu-ic span{font-size:9px;opacity:.8}.menu-ic.sel{border-color:#f6ead9;background:#00000052;transform:translateY(-2px)}.menu-icon-img{width:24px;height:24px;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges}.menu-icon-anim{display:block;width:24px;height:24px;background-repeat:no-repeat;background-size:144px 24px;background-position:0 0;image-rendering:pixelated;image-rendering:crisp-edges;animation:menu-icon-play .45s steps(5) 1 forwards}@keyframes menu-icon-play{0%{background-position:0 0}to{background-position:-120px 0}}@media (prefers-reduced-motion: reduce){.menu-icon-anim{animation:none}}.fs-toggle{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);left:12px;z-index:9;padding:8px 12px;font-size:12px;font-weight:600;color:#f6ead9;background:#00000047;border:2px solid rgba(246,234,217,.35);border-radius:10px;cursor:pointer;-webkit-tap-highlight-color:transparent}.fs-toggle:active{transform:scale(.94)}.stage.is-fullscreen .device-wrap,.stage.is-fullscreen>.menu{display:none}.stage.is-fullscreen{justify-content:flex-start}.big-mode{width:100%;flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:16px;padding:8px 0 4px}.big-screen{position:relative;width:min(90vw,460px);aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:20px;background:#b9d17a;box-shadow:inset 0 0 0 4px #0000002e,0 10px 30px #00000059;transition:background .4s ease}.big-screen.is-dark{background:#0000008c}.big-name{position:absolute;top:10px;left:14px;font-size:18px;font-weight:700;color:#3f5230;opacity:.75;z-index:2}.big-viewport{height:88%;aspect-ratio:1 / 1;overflow:hidden}.big-screen .overlays{top:8px;right:10px;font-size:26px;gap:6px}.big-screen .poops{bottom:8px;left:10px;font-size:24px;gap:3px}.big-screen .egg{font-size:120px}.big-screen .grave{font-size:110px}.big-menu{max-width:min(92vw,480px);gap:6px}.big-menu .menu-ic{width:60px;padding:7px 3px}.big-menu .menu-icon-img,.big-menu .menu-icon-anim{width:32px;height:32px}.big-menu .menu-icon-anim{background-size:192px 32px;animation:menu-icon-play-big .45s steps(5) 1 forwards}@keyframes menu-icon-play-big{0%{background-position:0 0}to{background-position:-160px 0}}.big-menu .menu-ic span{font-size:10px}.big-buttons{display:flex;justify-content:center;gap:28px;width:min(92vw,480px);padding-bottom:calc(env(safe-area-inset-bottom,0px) + 6px)}.big-btn-slot{display:flex;flex-direction:column;align-items:center;gap:8px}.big-btn{width:74px;height:74px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:none;color:#5a4a3a;background:radial-gradient(circle at 34% 28%,#fff,#f4efe8 42%,#d8cfc2);box-shadow:0 6px #7a6350,0 8px 10px #00000059,inset 0 2px 2px #ffffffe6,inset 0 -4px 6px #0000002e;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .06s ease,box-shadow .06s ease}.big-btn__key{font-family:Courier New,ui-monospace,monospace;font-size:28px;font-weight:900;line-height:1;text-shadow:0 1px 0 rgba(255,255,255,.8)}.big-btn__cap{font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#f6ead9;opacity:.85}.big-btn--ok{color:#6a4a10;background:radial-gradient(circle at 34% 28%,#fff6e0,#f6e2b0 45%,#e6c479);box-shadow:0 6px #a9832f,0 8px 10px #00000059,inset 0 2px 2px #ffffffd9,inset 0 -4px 6px #0003}.big-btn:active{transform:translateY(5px);box-shadow:0 1px #7a6350,0 2px 4px #0000004d,inset 0 3px 6px #00000040}.big-btn--ok:active{box-shadow:0 1px #a9832f,0 2px 4px #0000004d,inset 0 3px 6px #00000047}.big-status{left:8%;right:8%;top:20%;bottom:30%}@media (max-width: 380px){.big-menu .menu-ic{width:52px}}@media (max-width: 480px){.hud{max-width:100%}.pip{width:18px;height:10px}.need__ic{font-size:17px}.menu{max-width:100%;gap:5px}.menu-ic{width:52px;padding:6px 2px}.menu-icon-img{width:28px;height:28px}.menu-ic span{font-size:10px}.stage:not(.is-fullscreen) .menu-icon-anim{width:28px;height:28px;background-size:168px 28px;animation:menu-icon-play-m .45s steps(5) 1 forwards}@keyframes menu-icon-play-m{0%{background-position:0 0}to{background-position:-140px 0}}}