:root{--bg-0: #0f1222;--bg-1: #171a30;--bg-2: #222746;--panel: rgba(255, 255, 255, .08);--panel-strong: rgba(255, 255, 255, .14);--text: #eef3ff;--muted: #b8c2e3;--accent: #8fd3ff;--accent-2: #a78bfa;--success: #8ef0b6;--danger: #ff9e9e;--shadow: 0 20px 40px rgba(0, 0, 0, .28);--radius-xl: 24px;--radius-lg: 18px;--radius-md: 14px;--gap: 18px;--bottle-width: 88px;--bottle-height: 220px;--liquid-height: 35px;--glass: rgba(255, 255, 255, .14);--glass-edge: rgba(255, 255, 255, .45)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text);background:radial-gradient(circle at top,rgba(143,211,255,.13),transparent 32%),radial-gradient(circle at 85% 20%,rgba(167,139,250,.18),transparent 22%),linear-gradient(160deg,var(--bg-0),#090b17 65%)}body{display:flex;justify-content:center;padding:20px}.app{width:min(1180px,100%);display:grid;grid-template-rows:auto auto 1fr;gap:18px}.card{background:linear-gradient(180deg,#ffffff14,#ffffff0d);border:1px solid rgba(255,255,255,.09);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--radius-xl);box-shadow:var(--shadow)}.header{padding:22px;display:grid;grid-template-columns:1.25fr auto;gap:18px;align-items:center}.title-wrap h1{margin:0;font-size:clamp(1.8rem,3vw,2.7rem);line-height:1;letter-spacing:-.04em}.title-wrap p{margin:10px 0 0;color:var(--muted);max-width:64ch;font-size:.98rem}.stats{display:grid;grid-template-columns:repeat(4,minmax(90px,1fr));gap:12px;min-width:min(520px,100%)}.stat{padding:14px 16px;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:18px}.stat .label{display:block;color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px}.stat .value{display:block;font-size:1.28rem;font-weight:700;letter-spacing:-.02em}.toolbar{padding:16px 18px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}.button-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}button{border:0;cursor:pointer;color:var(--text);background:linear-gradient(180deg,#ffffff1f,#ffffff0f);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:11px 16px;font-weight:700;letter-spacing:.01em;transition:transform .12s ease,background .12s ease,border-color .12s ease,opacity .12s ease}button:hover{transform:translateY(-1px)}button:active{transform:translateY(1px) scale(.99)}button.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0c1020;border-color:transparent}button.ghost{background:#ffffff0d}button:disabled{opacity:.45;cursor:not-allowed;transform:none}.status{color:var(--muted);font-size:.95rem;min-height:1.4em}.game-area{position:relative;padding:24px 20px 28px;overflow:hidden;min-height:520px}.bottle-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px 18px;align-items:flex-end;padding:8px 4px 0}.bottle-slot{width:112px;display:flex;flex-direction:column;align-items:center;gap:10px;-webkit-user-select:none;user-select:none}.bottle-button{border:0;padding:0;background:transparent;width:100%;display:flex;justify-content:center;position:relative;border-radius:24px;cursor:pointer;will-change:transform}.bottle-button:focus-visible{outline:3px solid rgba(143,211,255,.65);outline-offset:6px}.bottle{position:relative;width:var(--bottle-width);height:var(--bottle-height);border-radius:0 0 26px 26px;border:4px solid var(--glass-edge);border-top:0;background:linear-gradient(180deg,#ffffff08,#ffffff14);box-shadow:inset 10px 0 16px #ffffff0a,inset -10px 0 16px #ffffff08,0 20px 30px #0003;overflow:hidden;transition:transform .18s ease,filter .18s ease,opacity .18s ease}.bottle:before,.bottle:after{content:"";position:absolute;top:0;width:18px;height:18px;border-top:4px solid var(--glass-edge);opacity:.95}.bottle:before{left:-4px;border-left:4px solid var(--glass-edge);border-top-left-radius:12px}.bottle:after{right:-4px;border-right:4px solid var(--glass-edge);border-top-right-radius:12px}.bottle .shine{position:absolute;left:8px;top:10px;width:10px;height:72%;background:linear-gradient(180deg,#ffffff42,#fff0);border-radius:999px;pointer-events:none}.liquid-layer{position:absolute;left:0;width:100%;height:var(--liquid-height);border-top:1px solid rgba(255,255,255,.22);transition:transform .18s ease,opacity .18s ease}.liquid-layer:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#ffffff29,#fff0);pointer-events:none}.liquid-layer.hidden-liquid{background:linear-gradient(180deg,#ffffff2e,#ffffff0a),repeating-linear-gradient(-45deg,#e7eeff4d 0 8px,#6c79a085 8px 16px),linear-gradient(180deg,#3b4260f5,#1d2234fa)}.liquid-layer.hidden-liquid:after{content:"?";position:absolute;inset:0;display:grid;place-items:center;color:#f4f7ffe6;font-size:1rem;font-weight:800;letter-spacing:.04em;text-shadow:0 1px 8px rgba(9,11,23,.55);pointer-events:none}.bottle-label{font-size:.83rem;color:var(--muted);letter-spacing:.02em}.bottle-button.selected .bottle{transform:translateY(-8px) scale(1.02);filter:drop-shadow(0 0 14px rgba(143,211,255,.55))}.bottle-button.sealed .bottle{filter:grayscale(.28) brightness(.86)}.bottle-button.sealed .lock{opacity:1;transform:scale(1)}.lock{position:absolute;inset:0;display:grid;place-items:center;font-size:2rem;opacity:0;transform:scale(.92);transition:opacity .18s ease,transform .18s ease;text-shadow:0 6px 16px rgba(0,0,0,.35);pointer-events:none}.shake{animation:shake .26s ease-in-out 1}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.pouring{animation:pourPulse .26s ease-in-out}@keyframes pourPulse{0%{transform:scale(1)}50%{transform:scale(1.04)}to{transform:scale(1)}}.legend{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:22px;padding:0 14px}.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:#ffffff0f;border:1px solid rgba(255,255,255,.08);color:var(--muted);font-size:.86rem}.chip .swatch{width:14px;height:14px;border-radius:999px;border:1px solid rgba(255,255,255,.35);box-shadow:inset 0 0 0 1px #ffffff1f}.overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at center,#090b1780,#090b17d1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:20}.overlay.show{display:flex}.win-panel{position:relative;width:min(840px,100%);min-height:380px;border-radius:32px;overflow:hidden;background:radial-gradient(circle at top,rgba(143,211,255,.18),transparent 34%),linear-gradient(180deg,#ffffff1a,#ffffff0f);border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 80px #00000073;display:grid;place-items:center;text-align:center;padding:28px;isolation:isolate}.win-copy{position:relative;z-index:3;max-width:560px}.win-copy h2{margin:0;font-size:clamp(2rem,4vw,3.6rem);line-height:.95;letter-spacing:-.05em}.win-copy p{margin:14px auto 22px;color:var(--muted);font-size:1rem;line-height:1.55}.overlay-actions{justify-content:center}.cat-field{position:absolute;inset:0;overflow:hidden;z-index:1;pointer-events:none}.cat{position:absolute;white-space:nowrap;opacity:.95;will-change:transform;animation:catWalk linear infinite}.cat-inner{display:inline-flex;align-items:center;gap:6px;transform:scale(var(--cat-scale, 1));transform-origin:center;animation:bodyBounce ease-in-out infinite;text-shadow:0 8px 18px rgba(0,0,0,.25)}.cat .body{font-size:clamp(1.3rem,2vw,2rem)}.cat .toy{display:inline-block;font-size:clamp(1rem,1.4vw,1.3rem);transform-origin:center}.cat .toy.toy-fish{animation:bounceToy 1.1s ease-in-out infinite}.cat .toy.toy-yarn{animation:spinToy 1.8s linear infinite}.cat .toy.toy-milk{animation:floatToy 1.9s ease-in-out infinite}.cat .toy.toy-cookie{animation:bounceToy 1.45s ease-in-out infinite}@keyframes catWalk{0%{transform:translate(-14vw)}to{transform:translate(114vw)}}@keyframes bodyBounce{0%,to{scale:1}50%{scale:1.08}}@keyframes bounceToy{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes spinToy{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes floatToy{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(4deg)}}.help{padding:16px 18px 18px;color:var(--muted);font-size:.92rem;line-height:1.6}.help strong{color:var(--text)}@media(max-width:940px){.header{grid-template-columns:1fr}.stats{min-width:0;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){body{padding:12px}.game-area{padding:18px 12px 24px}.bottle-slot{width:100px}.toolbar{align-items:flex-start}.button-row{width:100%}button{flex:1 1 auto}}