:root{--pet-shell: linear-gradient(160deg, #fdfdff 0%, #dfe3ef 45%, #b6bdd4 100%);--pet-shell-edge: #99a1b8;--pet-shell-ink: #5c6478;--pet-shell-shadow: rgba(0, 0, 0, 0.3);--pet-bezel: linear-gradient(160deg, #3a4157, #222738);--pet-bezel-edge: #171b27;--pet-lcd: #c4d293;--pet-lcd-2: #a9ba76;--pet-lcd-ink: #232c17;--pet-lcd-dim: rgba(35, 44, 23, 0.45);--pet-lcd-off: rgba(35, 44, 23, 0.15);--pet-lcd-sel: rgba(35, 44, 23, 0.85);--pet-lcd-sel-ink: #c4d293;--pet-grid: rgba(35, 44, 23, 0.07);--pet-glare: rgba(255, 255, 255, 0.35);--pet-key: linear-gradient(180deg, #f5f7fc, #c6ccdd);--pet-key-edge: #9aa2ba;--pet-key-ink: #3c4257}html[data-theme=dark]{--pet-shell: linear-gradient(160deg, #343a4e 0%, #262b3b 45%, #1a1e2a 100%);--pet-shell-edge: #454d66;--pet-shell-ink: #98a0b8;--pet-shell-shadow: rgba(0, 0, 0, 0.55);--pet-bezel: linear-gradient(160deg, #1b1f2c, #10131c);--pet-bezel-edge: #0a0c12;--pet-lcd: #a9b87a;--pet-lcd-2: #91a163;--pet-lcd-ink: #1c2412;--pet-lcd-dim: rgba(28, 36, 18, 0.5);--pet-lcd-off: rgba(28, 36, 18, 0.2);--pet-lcd-sel: rgba(28, 36, 18, 0.85);--pet-lcd-sel-ink: #a9b87a;--pet-grid: rgba(28, 36, 18, 0.08);--pet-glare: rgba(255, 255, 255, 0.08);--pet-key: linear-gradient(180deg, #3c445c, #262b3b);--pet-key-edge: #171b27;--pet-key-ink: #d3d9ec}.pet-section{background:var(--surface);padding:20px;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,0.1);text-align:center}.pet-section h2{color:var(--brand-text);margin-bottom:4px}.pet-subtitle{color:var(--text-muted);font-size:0.9rem;margin-bottom:16px}#pet-stage{display:flex;flex-direction:column;align-items:center;gap:10px}.pet-device{position:relative;width:min(340px,92vw);padding:16px 18px 18px;border-radius:46px / 40px;background:var(--pet-shell);border:1px solid var(--pet-shell-edge);isolation:isolate;box-shadow:0 14px 28px var(--pet-shell-shadow),inset 0 2px 3px rgba(255,255,255,0.55),inset 0 -6px 12px rgba(0,0,0,0.12)}.pet-device::before{content:"";position:absolute;z-index:-1;inset:4px 4px auto 4px;height:46%;border-radius:42px 42px 60% 60% / 36px 36px 100% 100%;background:linear-gradient(180deg,var(--pet-glare),transparent);pointer-events:none}.pet-device-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.pet-brand{font-family:"Pixelify Sans",monospace;font-weight:bold;font-size:0.75rem;letter-spacing:0.18em;color:var(--pet-shell-ink)}.pet-speaker{width:54px;height:12px;border-radius:6px;background-image:radial-gradient(circle,var(--pet-shell-edge) 1.2px,transparent 1.4px);background-size:7px 6px;opacity:0.85}.pet-screen-frame{padding:12px;border-radius:22px;background:var(--pet-bezel);border:1px solid var(--pet-bezel-edge);box-shadow:inset 0 2px 6px rgba(0,0,0,0.5)}.pet-screen{position:relative;display:flex;flex-direction:column;gap:6px;padding:8px 10px 10px;border-radius:10px;background:linear-gradient(180deg,var(--pet-lcd),var(--pet-lcd-2));color:var(--pet-lcd-ink);font-family:"Pixelify Sans",monospace;overflow:hidden}.pet-screen *{font-family:inherit}.pet-screen::after{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,var(--pet-grid) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,var(--pet-grid) 0 1px,transparent 1px 3px);pointer-events:none}.pet-lcd-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:0.68rem;letter-spacing:0.08em;text-transform:uppercase}.pet-lcd-clock{color:var(--pet-lcd-dim)}.pet-lcd-clock.ready{color:var(--pet-lcd-ink);animation:pet-blink 1.1s steps(1,end) infinite}@keyframes pet-blink{0%,60%{opacity:1}61%,100%{opacity:0.15}}.pet-icons{display:flex;align-items:center;justify-content:center;gap:14px}.pet-icon{display:flex;color:var(--pet-lcd-off)}.pet-icon svg{display:block}.pet-icon.on{color:var(--pet-lcd-ink)}.pet-icon.blink{animation:pet-blink 0.9s steps(1,end) infinite}.pet-view{display:flex;align-items:center;justify-content:center;height:clamp(150px,42vw,196px)}.pet-figure{height:100%;aspect-ratio:5 / 6;padding:0;border:none;background:transparent;cursor:pointer;mix-blend-mode:multiply}.pet-figure img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(0.6) contrast(1.12)}.pet-figure.bounce{animation:pet-bounce 0.45s ease}@keyframes pet-bounce{0%,100%{transform:scale(1,1)}30%{transform:scale(1.08,0.92)}60%{transform:scale(0.96,1.04)}}.pet-menu{width:100%;height:100%;margin:0;padding:0;list-style:none;display:flex;flex-direction:column;justify-content:center;gap:2px}.pet-menu-item{width:100%;padding:4px 8px;border:none;background:transparent;color:var(--pet-lcd-ink);font-family:inherit;font-size:0.8rem;letter-spacing:0.06em;text-align:left;text-transform:uppercase;cursor:pointer}.pet-menu-item.sel{background:var(--pet-lcd-sel);color:var(--pet-lcd-sel-ink);border-radius:4px}.pet-menu-item .pet-menu-mark{opacity:0}.pet-menu-item.current .pet-menu-mark{opacity:1}.pet-meter{display:flex;gap:3px;width:100%}.pet-meter-seg{flex:1;height:9px;border:1px solid var(--pet-lcd-dim);border-radius:2px;overflow:hidden}.pet-meter-seg i{display:block;height:100%;width:0;background:var(--pet-lcd-ink);transition:width 0.4s ease}.pet-streak{display:flex;align-items:center;gap:6px;font-size:0.62rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--pet-lcd-dim)}.pet-streak-bar{flex:1;height:6px;border:1px solid var(--pet-lcd-dim);border-radius:2px;overflow:hidden}.pet-streak-bar i{display:block;height:100%;width:0;background:var(--pet-lcd-ink);transition:width 0.4s ease}.pet-streak-count{color:var(--pet-lcd-ink)}.pet-streak.done .pet-streak-label,.pet-streak.done{color:var(--pet-lcd-ink)}.pet-msg{min-height:2.6em;font-size:0.74rem;line-height:1.3;text-align:center;color:var(--pet-lcd-ink)}.pet-msg:empty::before{content:"·";color:var(--pet-lcd-off)}.pet-buttons{display:flex;align-items:flex-start;justify-content:center;gap:22px;margin-top:14px}.pet-btn{display:flex;flex-direction:column;align-items:center;gap:5px;padding:0;border:none;background:transparent;cursor:pointer;color:var(--pet-shell-ink)}.pet-btn-key{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--pet-key);border:1px solid var(--pet-key-edge);color:var(--pet-key-ink);font-family:"Pixelify Sans",monospace;font-weight:bold;font-size:0.95rem;box-shadow:0 4px 0 var(--pet-key-edge),0 6px 10px var(--pet-shell-shadow),inset 0 2px 2px rgba(255,255,255,0.45);transition:transform 0.06s ease,box-shadow 0.06s ease}.pet-btn-label{font-family:"Pixelify Sans",monospace;font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase}.pet-btn:hover:not(:disabled) .pet-btn-key{filter:brightness(1.06)}.pet-btn:active:not(:disabled) .pet-btn-key,.pet-btn.press .pet-btn-key{transform:translateY(4px);box-shadow:0 0 0 var(--pet-key-edge),0 2px 5px var(--pet-shell-shadow),inset 0 2px 3px rgba(0,0,0,0.2)}.pet-btn:disabled{cursor:default;opacity:0.45}.pet-device-bottom{margin-top:12px;text-align:center;font-family:"Pixelify Sans",monospace;font-size:0.58rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--pet-shell-ink);opacity:0.75}.pet-stats{color:var(--text-soft);font-size:0.8rem}.pet-reward{display:flex;gap:16px;width:min(560px,100%);margin-top:6px;padding:16px;text-align:left;background:var(--surface-2);border:1px solid var(--border);border-radius:10px}.pet-reward-art{position:relative;flex:0 0 auto}.pet-reward-card{display:block;width:92px;aspect-ratio:5 / 6;object-fit:cover;border-radius:6px;border:1px solid var(--border);background:var(--surface-3)}.pet-reward-coin{position:absolute;right:-12px;bottom:-10px;width:46px;height:46px;border-radius:50%;object-fit:cover;background:var(--surface);box-shadow:0 2px 6px rgba(0,0,0,0.3)}.pet-reward-body{flex:1;min-width:0}.pet-reward-body h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;color:var(--brand-text);font-size:1rem}.pet-reward-tag{padding:2px 8px;border-radius:999px;background:var(--surface-3);color:var(--text-muted);font-size:0.78rem;font-weight:700;white-space:nowrap}.pet-reward.earned .pet-reward-tag{background:var(--surface-ok);color:var(--ok-text)}.pet-reward-what{margin:0 0 8px;color:var(--text);font-size:0.88rem;line-height:1.45}.pet-reward-rules{margin:0 0 12px;padding-left:18px;color:var(--text-muted);font-size:0.82rem;line-height:1.5}.pet-reward-bar{height:8px;border-radius:4px;background:var(--surface-3);overflow:hidden}.pet-reward-bar i{display:block;height:100%;width:0;background:var(--brand);transition:width 0.4s ease}.pet-reward.earned .pet-reward-bar i{background:var(--ok-text)}.pet-reward-state{margin:6px 0 0;color:var(--text-muted);font-size:0.8rem}.pet-reward.earned .pet-reward-state{color:var(--ok-text)}@media (max-width: 480px){.pet-reward{flex-direction:column;align-items:center}.pet-reward-art{margin-bottom:6px}.pet-reward-body{width:100%}}@media (prefers-reduced-motion: reduce){.pet-figure.bounce,.pet-lcd-clock.ready,.pet-icon.blink{animation:none}}