:root{--bg:#081a35;--panel:#102b52;--panel2:#163968;--wall:#4bb8ee;--wall2:#207ac2;--path:#08224a;--text:#f7fbff;--muted:#b9d8f2;--accent:#61e58a;--danger:#ff7184;--fish:#55cfff;--dog:#a9613e;--cat:#ffb33f;--milk:#fff8df;--pink:#ff91bb}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#174477 0,#081a35 58%);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);padding:18px}.game-shell{width:min(1240px,100%);margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.eyebrow{margin:0 0 3px;color:#82d1ff;font-size:.72rem;font-weight:900;letter-spacing:.15em}.topbar h1{margin:0;font-size:clamp(2rem,4vw,3rem);line-height:1}.game-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:16px;align-items:start}.sidebar{display:flex;flex-direction:column;gap:12px}.score-panel,.instructions,.result-panel,.help,.leaderboard-panel{background:rgba(13,44,88,.95);border:1px solid #277db9;border-radius:16px;box-shadow:0 8px 25px #0004}.score-panel{padding:14px}.panel-title{font-size:.82rem;text-transform:uppercase;letter-spacing:.12em;color:#84d2ff;font-weight:900;margin-bottom:8px}.score-row{display:flex;align-items:center;justify-content:space-between;padding:7px 0;border-bottom:1px solid #ffffff13}.score-row:last-of-type{border-bottom:0}.score-row span{color:var(--muted);font-size:.9rem}.score-row strong{font-size:1.18rem}.power-box{display:flex;align-items:center;gap:10px;margin-top:9px;padding:9px;border-radius:12px;background:#08204a;border:1px solid #2b72a8}.power-box span{display:block;color:var(--muted);font-size:.72rem}.power-box strong{display:block;font-size:.82rem;color:#fff}.power-box strong.active{color:#ffe27c}.instructions,.result-panel,.help,.leaderboard-panel{padding:13px 14px}.instructions h2,.help h2,.leaderboard-panel h2,.result-panel h2{margin:0 0 7px;font-size:1rem}.instructions p,.help p,.leaderboard-panel p,.result-panel p{margin:6px 0;color:var(--muted);font-size:.84rem;line-height:1.45}.result-panel{border-color:#57d984;background:linear-gradient(160deg,#123e59,#102b52)}.result-panel h2{font-size:1.3rem}.result-art{height:74px;display:grid;place-items:center}.sidebar-actions{display:grid;grid-template-columns:1fr;gap:8px}button{font:inherit;font-weight:850;border:0;border-radius:11px;padding:11px 14px;cursor:pointer;color:#fff;transition:transform .12s,filter .12s,box-shadow .12s}button:hover{filter:brightness(1.1)}button:active{transform:scale(.97)}button:focus-visible{outline:3px solid #fff;outline-offset:2px}.primary{background:linear-gradient(135deg,#2cc85d,#62e98a);box-shadow:0 5px 14px #2bd26033}.secondary{background:#1765ad;border:1px solid #3a9bd9}.board-column{min-width:0}.board-wrap{position:relative;background:#041126;border:5px solid #1b78bb;border-radius:18px;padding:8px;box-shadow:0 15px 45px #0008;overflow:hidden}.game-board{display:grid;grid-template-columns:repeat(19,1fr);aspect-ratio:19/13;width:100%;background:var(--path);border-radius:10px;overflow:hidden;touch-action:none}.cell{position:relative;display:grid;place-items:center;user-select:none}.wall{background:linear-gradient(145deg,var(--wall),var(--wall2));box-shadow:inset 0 2px 2px #b6ecff55,inset 0 -3px 5px #064c8c66}.path{background:radial-gradient(circle,#0b2c59 1px,transparent 2px);background-size:9px 9px}.entity{position:relative;z-index:2;display:block;width:70%;height:70%;transform-origin:center;filter:drop-shadow(0 3px 2px #0008)}
/* Cute CSS-drawn characters: no emoji or external images. */
.cat{width:72%;height:72%;border-radius:48% 48% 42% 42%;background:var(--cat);animation:cat-bounce .7s ease-in-out infinite}.cat:before,.cat:after{content:"";position:absolute;top:-18%;width:35%;height:35%;background:var(--cat);clip-path:polygon(0 100%,50% 0,100% 100%);border-radius:7px}.cat:before{left:2%}.cat:after{right:2%}.cat.powered{animation:cat-power .35s ease-in-out infinite alternate}.cat.powered:before,.cat.powered:after{background:#ffe16a}.cat.powered{box-shadow:0 0 10px #ffe16a}.dog{width:72%;height:67%;border-radius:48% 48% 42% 42%;background:var(--dog);animation:dog-bob .8s ease-in-out infinite}.dog:before,.dog:after{content:"";position:absolute;top:2%;width:31%;height:58%;background:#74412f;border-radius:55% 45% 55% 45%}.dog:before{left:-18%;transform:rotate(15deg)}.dog:after{right:-18%;transform:rotate(-15deg)}.dog.defeated{opacity:.45;transform:scale(.72)}.fish{width:72%;height:48%;border-radius:55% 45% 45% 55%;background:var(--fish);animation:fish-swim 1s ease-in-out infinite}.fish:before{content:"";position:absolute;right:-25%;top:7%;width:40%;height:86%;background:#55cfff;clip-path:polygon(0 50%,100% 0,100% 100%);border-radius:5px}.fish:after{content:"";position:absolute;left:16%;top:25%;width:15%;height:15%;border-radius:50%;background:#0a2c54;box-shadow:0 0 0 2px #e9fbff}.milk{width:42%;height:62%;border-radius:5px 5px 9px 9px;background:linear-gradient(90deg,#fff8df,#fff,#fff8df);border:2px solid #d8cda8;animation:milk-float 1.2s ease-in-out infinite}.milk:before{content:"";position:absolute;left:-8%;right:-8%;top:-16%;height:20%;background:#ff91bb;border-radius:4px;box-shadow:0 2px 0 #c96892}.milk:after{content:"";position:absolute;left:18%;top:34%;width:48%;height:17%;background:#ff91bb;border-radius:50%}.milk-mini{position:relative;display:block!important;width:19px;height:24px!important;flex:0 0 19px;background:linear-gradient(90deg,#fff8df,#fff,#fff8df);border:1px solid #d8cda8;border-radius:3px}.milk-mini:before{content:"";position:absolute;left:-2px;right:-2px;top:-4px;height:5px;background:#ff91bb;border-radius:2px}.result-cat{position:relative;display:block;width:52px;height:42px;border-radius:48%;background:var(--cat);animation:cat-bounce .7s ease-in-out infinite}.result-cat:before,.result-cat:after{content:"";position:absolute;top:-9px;width:18px;height:18px;background:var(--cat);clip-path:polygon(0 100%,50% 0,100% 100%)}.result-cat:before{left:2px}.result-cat:after{right:2px}.controls{display:flex;align-items:center;gap:16px;padding:10px 4px}.dpad{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(2,44px);gap:5px}.dpad button{padding:0;width:52px;height:44px;background:#1765ad;border:1px solid #3b9ddd;font-size:1rem}.dpad .up{grid-column:2}.dpad .left{grid-column:1;grid-row:2}.dpad .down{grid-column:2;grid-row:2}.dpad .right{grid-column:3;grid-row:2}.control-hint{margin:0;color:var(--muted);font-size:.82rem}.leaderboard-panel{min-height:95px}.leaderboard-panel #mis-leaderboard{min-height:18px}.help[hidden],.result-panel[hidden]{display:none}.help{scroll-margin-top:12px}
@keyframes cat-bounce{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}}@keyframes cat-power{from{transform:scale(1)}to{transform:scale(1.08) rotate(2deg)}}@keyframes dog-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes fish-swim{0%,100%{transform:translateX(0) rotate(0)}50%{transform:translateX(3px) rotate(-2deg)}}@keyframes milk-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-4px) rotate(2deg)}}
@media(max-width:900px){.game-layout{grid-template-columns:205px minmax(0,1fr)}.score-row strong{font-size:1rem}.instructions p,.help p,.leaderboard-panel p{font-size:.77rem}.controls{padding-left:0}}
@media(max-width:700px){body{padding:9px}.topbar{align-items:flex-start}.top-actions{display:none}.game-layout{grid-template-columns:1fr}.sidebar{order:2;display:grid;grid-template-columns:1fr 1fr;gap:9px}.score-panel{grid-column:1}.instructions{grid-column:2}.result-panel{grid-column:1/-1}.sidebar-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}.help,.leaderboard-panel{grid-column:1/-1}.board-column{order:1}.board-wrap{border-width:3px;padding:5px}.control-hint{font-size:.72rem}}
@media(max-width:450px){.sidebar{grid-template-columns:1fr}.score-panel,.instructions,.help,.leaderboard-panel{grid-column:1}.controls{justify-content:center}.control-hint{display:none}.game-board{aspect-ratio:19/13}}
.result-panel.loss{border-color:#ff7184;background:linear-gradient(160deg,#4a2637,#102b52)}.result-dog{position:relative;display:block;width:54px;height:42px;border-radius:48%;background:var(--dog);animation:dog-bob .8s ease-in-out infinite}.result-dog:before,.result-dog:after{content:"";position:absolute;top:2px;width:18px;height:25px;background:#74412f;border-radius:55%}.result-dog:before{left:-7px;transform:rotate(15deg)}.result-dog:after{right:-7px;transform:rotate(-15deg)}

/* Friendly animated faces for the game characters. */
.face{position:absolute;inset:0;display:block;z-index:3;pointer-events:none}
.face .eye{position:absolute;top:34%;width:13%;height:18%;background:#1d2433;border-radius:50%;box-shadow:inset 0 2px 0 #ffffffaa}
.face .eye-left{left:27%}.face .eye-right{right:27%}
.face .nose{position:absolute;left:45%;top:51%;width:10%;height:8%;background:#e9778f;border-radius:55% 55% 50% 50%;transform:rotate(45deg)}
.face .mouth{position:absolute;left:44%;top:61%;width:12%;height:0;border-bottom:2px solid #42263a;border-radius:0}
.cat.powered .face .mouth{top:55%;height:18%;width:18%;left:41%;border-bottom:3px solid #42263a;border-left:2px solid transparent;border-right:2px solid transparent;border-radius:0 0 50% 50%;background:#ff789f}
.cat.powered .face:before,.cat.powered .face:after{content:"";position:absolute;top:52%;width:18%;height:8%;background:#ed7b8f;border-radius:50%;opacity:.8}
.cat.powered .face:before{left:7%}.cat.powered .face:after{right:7%}
.dog .face .eye{top:30%;width:14%;height:20%;background:#251b1a}
.dog .face .nose{top:51%;width:17%;height:11%;left:41%;background:#2b2020}
.dog .face .mouth{top:64%;width:22%;left:39%;height:8%;border-bottom:2px solid #2b2020}
.fish .fish-eye{position:absolute;left:20%;top:25%;width:16%;height:26%;border-radius:50%;background:#102d4b;box-shadow:inset 2px 2px 0 #fff;z-index:3}
@media(prefers-reduced-motion:reduce){.entity,.result-cat,.result-dog{animation:none!important}}