@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap";
:root{--ink:#15131f;--paper:#f7f0dd;--teal:#2fc7d4;--coral:#ff6b5a;--gold:#f4b740;--purple:#9b6de3;--green:#74c365;--blue:#5795e8}*{box-sizing:border-box}html,body{background:var(--ink);min-height:100%;margin:0}body{color:var(--paper);overscroll-behavior:none;font-family:Outfit,sans-serif}button{font:inherit}button:focus-visible{outline:3px solid var(--paper);outline-offset:3px}.app-shell{background:linear-gradient(#2fc7d409 1px, transparent 1px), linear-gradient(90deg, #2fc7d409 1px, transparent 1px), var(--ink);background-size:34px 34px;min-height:100svh;position:relative;overflow:hidden}.app-shell:after{content:"";pointer-events:none;background:radial-gradient(circle at 50% 40%,#0000 35%,#04030a85 110%);position:fixed;inset:0}.topbar,.game-header{z-index:3;justify-content:space-between;align-items:center;width:min(1100px,100% - 36px);height:76px;margin:auto;display:flex;position:relative}.studio-mark,.eyebrow,.side-panel>p{letter-spacing:.2em;color:var(--teal);font-size:12px;font-weight:800}.icon-button,.brand-button,.pause-toggle{color:var(--paper);letter-spacing:.08em;cursor:pointer;background:#15131fcc;border:1px solid #f7f0dd40;border-radius:999px;padding:9px 13px;font-size:10px;font-weight:800}.city-glow{filter:blur(90px);background:#2fc7d421;border-radius:50%;width:70vw;max-width:850px;height:70vw;max-height:850px;position:absolute;top:5%;left:-15%}.hero-card{z-index:2;grid-template-columns:1.05fr .95fr;align-items:center;width:min(1040px,100% - 36px);min-height:calc(100svh - 136px);margin:auto;display:grid;position:relative}.hero-copy{padding:30px 0 50px}.hero-copy h1{letter-spacing:-.07em;text-shadow:7px 7px #00000038;margin:18px 0 34px;font-family:Fredoka,sans-serif;font-size:clamp(72px,10vw,138px);line-height:.72;transform:rotate(-2deg)}.hero-copy h1 span{display:block}.hero-copy h1 span:first-child{color:var(--paper)}.hero-copy h1 span:last-child{color:var(--coral);margin-left:30px}.hook{color:#d8d0bd;font-family:Fredoka,sans-serif;font-size:clamp(18px,2.2vw,27px)}.play-button{background:var(--gold);min-width:210px;color:var(--ink);letter-spacing:.1em;cursor:pointer;border:0;border-radius:13px;justify-content:space-between;align-items:center;gap:40px;margin-top:18px;padding:16px 25px;font-weight:900;transition:transform .15s,box-shadow .15s;display:inline-flex;box-shadow:0 6px #9d6818}.play-button:hover{transform:translateY(-2px)rotate(-1deg);box-shadow:0 8px #9d6818}.play-button:active{transform:translateY(4px);box-shadow:0 2px #9d6818}.instructions{color:#918ba1;flex-wrap:wrap;gap:10px 18px;margin-top:35px;font-size:11px;display:flex}.instructions b{color:var(--paper);margin-right:4px}.menu-best{color:#918ba1;letter-spacing:.13em;font-size:11px}.menu-best strong{color:var(--teal);margin-left:8px}.menu-screen footer{text-align:center;color:#6f697c;z-index:2;width:100%;font-size:11px;position:absolute;bottom:16px;left:0}.hero-art{min-height:500px;position:relative;transform:rotate(1.5deg)}.bin{border:8px solid var(--paper);background:var(--teal);border-radius:17px 17px 35px 35px;width:260px;height:335px;position:absolute;bottom:40px;left:18%;box-shadow:18px 18px #0000003d}.bin:before,.bin:after{content:"";background:var(--ink);border:7px solid var(--paper);border-radius:50%;width:45px;height:45px;position:absolute;bottom:-25px}.bin:before{left:23px}.bin:after{right:23px}.bin-lid{background:var(--coral);border:8px solid var(--paper);border-radius:10px;width:300px;height:32px;position:absolute;top:-26px;left:-28px;transform:rotate(-6deg)}.bin-lines{border-left:8px solid #15131f47;border-right:8px solid #15131f47;position:absolute;inset:55px 52px;transform:skew(-3deg)}.trash-pile{border:6px solid var(--paper);z-index:2;position:absolute}.pile-one{background:var(--gold);border-radius:51% 49% 23% 20%;width:96px;height:72px;bottom:22px;left:5%;transform:rotate(10deg)}.pile-two{background:var(--purple);border-radius:18px 50% 25% 20%;width:80px;height:100px;bottom:28px;right:13%;transform:rotate(-12deg)}.cat{z-index:4;width:120px;height:125px;position:relative}.hero-art .cat{position:absolute;bottom:52px;right:5%;transform:rotate(5deg)scale(1.2)}.cat-body{border:5px solid var(--paper);background:#9b6b4a;border-radius:47% 47% 40% 40%;place-items:center;display:grid;position:absolute;inset:24px 7px 5px;box-shadow:7px 7px #0000002e}.cat-ear{border:5px solid var(--paper);z-index:-1;background:#9b6b4a;width:39px;height:45px;position:absolute;top:-30px}.cat-ear-left{border-radius:9px 80% 0 0;left:5px;transform:rotate(-25deg)}.cat-ear-right{border-radius:80% 9px 0 0;right:5px;transform:rotate(25deg)}.cat-face{color:var(--ink);z-index:2;white-space:nowrap;font-family:Fredoka;font-size:22px;font-weight:700;position:relative}.cat-patch{background:#5d3e33;border-radius:55% 30% 60% 35%;width:42px;height:50px;position:absolute;top:5px;left:7px;transform:rotate(13deg)}.cat-tail{border:13px solid #9b6b4a;border-left:0;border-radius:0 50% 50% 0;width:70px;height:45px;position:absolute;bottom:17px;right:-39px;transform:rotate(-20deg)}.cat-happy{animation:.35s ease-in-out 2 alternate cat-bop}.cat-worried .cat-body{background:var(--gold)}.cat-stunned{transform:rotate(-6deg)}.game-screen{touch-action:none;flex-direction:column;height:100svh;display:flex}.game-header{flex:0 0 58px;height:58px}.brand-button{width:38px;height:38px;color:var(--ink);background:var(--coral);border:2px solid var(--paper);padding:0;font-family:Fredoka;font-size:15px}.score-strip{align-items:center;gap:clamp(15px,5vw,55px);display:flex}.score-strip span{flex-direction:column;align-items:center;display:flex}.score-strip small{letter-spacing:.16em;color:#817b8e;font-size:8px;font-weight:800}.score-strip strong{color:var(--paper);font-family:Fredoka;font-size:19px;line-height:1}.game-layout{z-index:2;flex:auto;grid-template-columns:115px auto 115px;justify-content:center;align-items:center;gap:18px;min-height:0;display:grid;position:relative}.board-wrap{background:#0000003b;border:2px solid #f7f0dd99;border-radius:8px;padding:7px;box-shadow:0 0 45px #2fc7d414}.board{--cell:min(3.65vh, 2.75vw, 34px);width:calc(var(--cell) * 10);height:calc(var(--cell) * 20);background:#0d0c14;grid-template-columns:repeat(10,1fr);display:grid;position:relative;overflow:hidden}.cell{width:var(--cell);height:var(--cell);border:1px solid #f7f0dd09;place-items:center;display:grid;position:relative}.cell.filled{border:2px solid #f7f0dd99;border-radius:4px;box-shadow:inset -3px -3px #00000029,inset 2px 2px #ffffff26}.cell i{font-style:normal;font-size:calc(var(--cell) * .46);color:#15131f80;line-height:1}.teal{background:var(--teal)}.blue{background:var(--blue)}.gold{background:#ea8d3a}.yellow{background:var(--gold)}.green{background:var(--green)}.purple{background:var(--purple)}.coral{background:var(--coral)}.cell.ghost{opacity:.4;background:0 0;border:2px dashed}.cell.ghost.teal{color:var(--teal)}.cell.ghost.blue{color:var(--blue)}.cell.ghost.gold{color:#ea8d3a}.cell.ghost.yellow{color:var(--gold)}.cell.ghost.green{color:var(--green)}.cell.ghost.purple{color:var(--purple)}.cell.ghost.coral{color:var(--coral)}.cell.flash{z-index:3;animation:.46s ease-out row-flash}.side-panel{flex-direction:column;align-self:center;align-items:center;min-height:160px;display:flex}.side-panel>p{margin:0 0 9px}.mini-piece{background:#0000002e;border:1px solid #f7f0dd21;border-radius:9px;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(4,1fr);width:76px;height:76px;padding:6px;display:grid}.mini-block{border:1px solid #f7f0dd80;border-radius:2px;margin:1px}.mini-empty{color:#625d70;border:1px dashed #f7f0dd26;border-radius:9px;place-items:center;width:76px;height:76px;font-size:8px;display:grid}.side-key{color:#8b8497;cursor:pointer;background:0 0;border:1px solid #514c5e;border-radius:6px;margin-top:10px;padding:4px 9px}.side-key:disabled{opacity:.3}.next-panel .mini-piece+.mini-piece{opacity:.44;margin-top:7px;transform:scale(.78)}.cat-watch{flex-direction:column;align-items:center;margin-top:7px;display:flex}.cat-watch .cat{margin:-25px 0 -24px;transform:scale(.55)}.cat-watch span{color:#817b8e;white-space:nowrap;font-family:Fredoka;font-size:10px}.combo-callout{z-index:7;color:var(--gold);white-space:nowrap;text-shadow:3px 3px 0 var(--ink);pointer-events:none;font-family:Fredoka;font-size:clamp(24px,4vw,42px);font-weight:800;animation:.52s ease-out both callout;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)rotate(-4deg)}.debris{pointer-events:none;z-index:8;position:absolute;inset:0}.debris span{--angle:calc(var(--i) * 27deg);color:var(--gold);transform:rotate(var(--angle)) translateY(calc(-35px - var(--i) * 3px));animation:.5s ease-out both burst;position:absolute;top:48%;left:50%}.pause-card{z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#15131fe0;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.pause-card strong{color:var(--gold);font-family:Fredoka;font-size:38px}.pause-card span{color:#aaa2b6;margin:3px 0 22px}.pause-card button{background:var(--teal);color:var(--ink);cursor:pointer;border:0;border-radius:8px;padding:10px 22px;font-weight:900}.pause-toggle{z-index:10;position:fixed;bottom:15px;left:18px}.mobile-controls{display:none}.over-screen{place-items:center;display:grid}.over-card{text-align:center;z-index:2;background:#1e1b2bdb;border:2px solid #f7f0dd59;border-radius:24px;width:min(430px,100% - 32px);padding:36px 28px;position:relative;box-shadow:16px 16px #0000003d}.over-card .cat{margin:-90px auto 5px;transform:rotate(-5deg)}.over-card h2{letter-spacing:-.05em;margin:22px 0 28px;font-family:Fredoka;font-size:clamp(55px,14vw,82px);line-height:.78}.over-card h2 span{color:var(--coral)}.over-scores{background:#f7f0dd2b;grid-template-columns:1fr 1fr;gap:1px;margin:0 0 12px;display:grid}.over-scores div{background:#201d2d;flex-direction:column;padding:15px;display:flex}.over-scores small{color:#7e788b;letter-spacing:.15em;font-size:9px}.over-scores strong{color:var(--gold);font-family:Fredoka;font-size:25px}.over-card .play-button{width:100%}.text-button{color:#938d9e;text-underline-offset:4px;letter-spacing:.1em;cursor:pointer;background:0 0;border:0;margin-top:22px;font-size:11px;text-decoration:underline}@keyframes row-flash{0%{filter:brightness()}35%{filter:brightness(2);background:#fff}to{filter:brightness()}}@keyframes callout{0%{opacity:0;transform:translate(-50%,-50%)scale(.4)rotate(-12deg)}45%{opacity:1;transform:translate(-50%,-50%)scale(1.15)rotate(3deg)}to{opacity:0;transform:translate(-50%,-70%)scale(1)rotate(-3deg)}}@keyframes burst{0%{opacity:1;transform:rotate(var(--angle)) translateY(0) scale(1.3)}to{opacity:0;transform:rotate(var(--angle)) translateY(-115px) scale(.3)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-3px,1px)}50%{transform:translate(3px,-1px)}75%{transform:translate(-1px,2px)}}@keyframes cat-bop{to{transform:translateY(-6px)rotate(3deg)}}.is-shaking .board-wrap{animation:.22s linear shake}@media (max-width:720px){.topbar{height:58px}.hero-card{text-align:center;flex-direction:column;justify-content:center;min-height:calc(100svh - 95px);display:flex}.hero-art{order:0;width:310px;min-height:245px;margin:-52px auto -48px;transform:scale(.7)}.hero-copy{z-index:5;padding:0 0 45px;position:relative}.hero-copy h1{margin:12px 0 22px;font-size:clamp(65px,23vw,94px)}.hero-copy h1 span:last-child{margin-left:13px}.hook{max-width:280px;margin-inline:auto;font-size:17px}.instructions{justify-content:center;max-width:330px;margin:29px auto 0}.menu-screen footer{display:none}.game-header{flex-basis:48px;width:calc(100% - 20px);height:48px}.game-header .icon-button{width:35px;height:35px;padding:0;font-size:0;overflow:hidden}.game-header .icon-button:after{content:"♪";font-size:16px}.score-strip{gap:18px}.score-strip strong{font-size:16px}.game-layout{flex:auto;justify-content:center;align-items:center;min-height:0;display:flex}.board{--cell:min(8.75vw, 3.05vh)}.board-wrap{padding:5px}.side-panel{z-index:5;min-height:0;position:absolute;top:4px}.side-panel>p{margin-bottom:3px;font-size:8px}.hold-panel{left:8px}.next-panel{right:8px}.mini-piece,.mini-empty{width:46px;height:46px;padding:3px}.next-panel .mini-piece+.mini-piece,.cat-watch,.side-key{display:none}.mobile-controls{z-index:5;flex:0 0 112px;grid-template-columns:repeat(6,1fr);align-items:stretch;gap:6px;width:min(460px,100% - 18px);height:112px;margin:3px auto 4px;display:grid;position:relative}.mobile-controls button{color:var(--paper);touch-action:manipulation;background:#242132;border:1px solid #f7f0dd4d;border-radius:12px;font-family:Fredoka;font-size:25px;font-weight:700;box-shadow:0 4px #0b0a11}.mobile-controls button:active{transform:translateY(3px);box-shadow:0 1px #0b0a11}.mobile-controls button small{letter-spacing:.1em;color:#aaa3b5;font:700 7px Outfit;display:block}.mobile-controls button:disabled{opacity:.28}.mobile-controls .rotate-control{background:var(--teal);color:var(--ink)}.mobile-controls .drop-control{background:var(--coral);color:var(--ink)}.pause-toggle{padding:6px 8px;font-size:8px;bottom:119px;left:7px}}@media (max-height:690px) and (max-width:720px){.game-header{flex-basis:42px;height:42px}.board{--cell:min(8.2vw, 2.85vh)}.mobile-controls{flex-basis:92px;height:92px}.pause-toggle{bottom:99px}.hero-art{margin:-70px auto -68px;transform:scale(.58)}.hero-copy h1{font-size:64px}.instructions{margin-top:22px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}