/* Full-screen candy arcade. No white card surfaces. */
:root{--ink:#fff1ce;--muted:#c5f0ff;--pink:#ff7439;--purple:#32aed8;--cream:#ffc841}
html,body{height:100%;min-height:100%;overflow-x:hidden;background:#2490b4}
body{background:radial-gradient(ellipse at 10% 15%,#4bc2ea 0,transparent 42%),radial-gradient(ellipse at 92% 85%,#ed6931 0,transparent 38%),linear-gradient(145deg,#30a4ca,#105f79);background-attachment:fixed;color:#fff1ce}
.game-layout{display:flex;justify-content:center;align-items:stretch;max-width:none;width:100%;min-height:100svh;padding:0;margin:0;gap:0}
.intro,.friends{display:none}
#app{width:min(100%,620px);max-width:620px;height:100svh;min-height:620px;margin:0;padding:16px 18px 12px;gap:0;border:0;border-radius:0;background:radial-gradient(ellipse at 50% -15%,#5ad2fa,transparent 50%),linear-gradient(180deg,#3cb2da,#228cb0 65%,#2594b9);box-shadow:0 0 80px #063f5277;overflow:hidden}
.app-header{padding:0 6px 16px;flex:none}.wordmark{color:#ffd43c;font-size:34px;letter-spacing:-1px;text-shadow:0 3px 0 #9e3d2b,2px 0 #266c83,-2px 0 #266c83}.wordmark-dot{color:#ffb798;text-shadow:0 2px 0 #bb5225}
#mute{width:46px;height:44px;border-radius:15px;background:linear-gradient(#ffbf35,#fa8b20);border:2px solid #ffc94e;color:#752a13;box-shadow:0 4px 0 #a74d16,inset 0 2px 0 #ffe687;font-size:25px}#mute.off{background:#66b2cb;border-color:#89c6db;color:#175468;box-shadow:0 4px 0 #21657b}
.row{gap:10px;margin:0 2px}.stat{background:linear-gradient(#38daea,#0db3d6);border:2px solid #75f1ee;box-shadow:0 5px 0 #087392,inset 0 2px 0 #a1fbf2;min-width:90px;padding:10px 12px;border-radius:18px}.stat b{color:#083c64;font-size:33px;text-shadow:0 1px #b7fcff}.stat .lbl{color:#17486c;font-size:14px}.stat.wide{background:linear-gradient(#ffdb50,#ffad23);border-color:#ffe482;box-shadow:0 5px 0 #ba6919,inset 0 2px 0 #fff29c}.stat.wide b,.stat.wide .lbl{color:#713907}.stat.moves-stat{background:linear-gradient(#ff976b,#fa7035);border-color:#ffb89a;box-shadow:0 5px 0 #a74216,inset 0 2px 0 #ffcfba;min-width:135px}.stat.moves-stat b{color:#fff5cc;text-shadow:0 2px #ab4a20}.stat.moves-stat .lbl{color:#6a2f16}.moves-stat img{width:42px;height:44px;filter:drop-shadow(0 2px 0 #c35a2d)}
#goalbar{background:#196e8b;border:2px solid #6bcced;box-shadow:inset 0 3px 0 #105268,0 2px 0 #54b0cf;border-radius:16px;margin:16px 2px 10px;padding:8px 12px;min-height:58px}.goal-label{font-size:15px;color:#ffe090}.goal-label img{filter:drop-shadow(0 2px 0 #12495b);width:33px;height:33px}.goal{background:#3c9cbc;border:1px solid #81d4ef;padding:3px 9px 3px 3px;box-shadow:0 2px 0 #104e63}.goal .ico{width:35px;height:35px}.goal b{color:#fff1c0;font-size:16px}.goal.done{background:#12b99a;border-color:#83ffe3}.goal.done b{color:#063f39}
.combo-status{background:#145e77;color:#bbecfc;border:1px solid #57b4d3;border-radius:12px;padding:7px 11px;margin:0 4px 7px;min-height:32px}.combo-status strong{color:#c8f1ff;font-size:14px}.combo-status i b{background:#519bb4;box-shadow:inset 0 1px 0 #87c3d7}.combo-status.active{background:#ffb22d;border-color:#ffe56c;box-shadow:0 3px 0 #bc6720}.combo-status.active strong{color:#6c2709}.combo-status.active i b.on{background:#e65d22;box-shadow:0 2px 0 #aa4114}
#stage{flex:1 1 auto;min-height:240px;aspect-ratio:auto;align-items:center;justify-content:center;margin:0;overflow:visible}
#board{background:#19647d;border:0;border-radius:20px;box-shadow:0 0 0 4px #ffcb36,0 0 0 7px #ae650c,0 8px 0 7px #11576e,inset 0 2px 0 #64c1e0;overflow:hidden}
.tile{border-width:2px;border-radius:12px;background-color:#56b4d3;background-clip:padding-box;box-shadow:none}.tile:nth-child(2n){background-color:#63bfde}.tile:nth-child(3n){background-color:#56b4d3}.kit .pic{inset:0;filter:drop-shadow(0 2px 1px #09405366)}.kit.sel:after{border:3px solid #fff253;background:#fff84a25;box-shadow:inset 0 0 0 1px #ac7a0e,0 0 10px #ffdc4e}.kit.key-focus:after{border-color:#fff253}.kit.sel .pic{filter:drop-shadow(0 0 4px #ffed73);scale:1.05}
.tip-wrap{margin:13px 2px 0;padding:8px 10px;min-height:38px;border-radius:12px;background:#175f77;border:1px solid #64b4cf;align-items:center;flex:none}.tip-wrap>span{background:#ffbf32;color:#6c3514;font-size:11px}#tip{color:#d9f6ff;font-size:14px;text-align:center}.app-footer{display:none}
.screen{inset:72px 0 0;border-radius:0;padding:0;background:radial-gradient(ellipse at 50% 30%,#46c5ef 0,#299dc4 54%,#166f8d 100%);backdrop-filter:none;overflow:auto}
.card{width:100%;max-width:none;min-height:100%;border:0;border-radius:0;padding:24px 32px;box-shadow:none;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}
.start-card:before,.result-card:before{content:'';position:absolute;inset:0;pointer-events:none;background:url('art/ui-star.png') 5% 13%/57px no-repeat,url('art/ui-heart.png') 94% 64%/63px no-repeat,url('art/ui-paw.png') 5% 86%/66px no-repeat;opacity:.85}
.pill{background:#ffcd3d;color:#6e2b0d;border:2px solid #ffe47c;box-shadow:0 4px 0 #bb621f;padding:8px 20px;font-size:16px;transform:rotate(-4deg);z-index:1}.logo{width:100%;position:relative;z-index:1}.logo .cats{height:195px;margin:14px 0 0;gap:0}.logo .cats span{width:145px;height:145px;filter:drop-shadow(0 8px 0 #125c7455)}.logo .cats span:nth-child(2){width:195px;height:195px;margin:0 -28px}.logo .cats span:nth-child(1){transform:rotate(-17deg) translate(12px,17px)}.logo .cats span:nth-child(3){transform:rotate(17deg) translate(-12px,17px)}
.logo h2{font-size:68px;color:#ffdc44;letter-spacing:-3px;text-shadow:0 5px 0 #b7630a,0 9px 0 #11566d;-webkit-text-stroke:2px #7d442b;paint-order:stroke fill;margin:3px 0 24px}.logo p,.card>p{color:#fff0d9;font-size:19px;line-height:1.6;text-shadow:0 2px 0 #21657b;margin:0 0 25px}.big{position:relative;z-index:1;max-width:390px;background:linear-gradient(#fff260 0,#ffce2b 48%,#ffaf19 100%);border:3px solid #ffe990;color:#71300d;border-radius:23px;padding:18px 24px;font-size:26px;box-shadow:0 7px 0 #c26614,0 11px 0 #104a5e66,inset 0 3px 0 #fff6ac;text-shadow:0 1px 0 #fff0a2}.big:active{transform:translateY(5px);box-shadow:0 2px 0 #c26614}.big:disabled{opacity:.7}.ghost{position:relative;z-index:1;background:#237f9e;border:2px solid #6cc6e4;border-radius:16px;color:#ffeee6;text-decoration:none;font-size:16px;min-width:170px;box-shadow:0 3px 0 #115166;padding:11px 20px;margin:18px auto 0}.foot{color:#a6dff2;font-size:11px;position:relative;z-index:1}#sound-note{color:#d5f4ff;font-size:13px;margin-top:22px}.result-paw{width:85px;height:85px;position:relative;z-index:1;filter:drop-shadow(0 4px 0 #135065)}#r-stars{position:relative;z-index:1;margin:3px 0 10px;gap:6px}#r-stars span{width:80px;height:80px;filter:drop-shadow(0 4px 0 #286377)}#r-stars .dim{filter:grayscale(.7);opacity:.35}.result-card h2{position:relative;z-index:1;color:#ffdf4d;font-size:42px;text-shadow:0 3px #9c531a;margin:4px 0 16px}.result-card>p{position:relative;z-index:1}
.float{color:#fff248;-webkit-text-stroke:3px #944929;paint-order:stroke fill;text-shadow:0 3px 0 #11576e}.combo-banner b{color:#ffe12c;-webkit-text-stroke-color:#924422;filter:drop-shadow(0 2px 0 #11576e)}.combo-banner.mega b{color:#71ffde;-webkit-text-stroke-color:#23738e}.combo-banner span{border-color:#ffe992;background:#fc7136;color:#fff0d9;box-shadow:0 3px 0 #ad481d}.goal-toast{background:#0bc2a0;border-color:#85ffdf;color:#073f38}.fx-ring{border-color:#ffe137}.low-moves{outline-color:#fff141}.low-moves b{color:#fff26b!important}
@media(min-width:900px){#app{border-left:3px solid #6cc6e4;border-right:3px solid #6cc6e4;padding-left:24px;padding-right:24px}body:before,body:after{content:'';position:fixed;top:20%;width:130px;height:130px;pointer-events:none;background:url('art/ui-star.png') center/contain no-repeat;filter:drop-shadow(0 6px 0 #10546a55);transform:rotate(-15deg);left:calc(50% - 475px)}body:after{top:auto;bottom:15%;left:auto;right:calc(50% - 475px);background-image:url('art/ui-heart.png');transform:rotate(15deg)}}
@media(max-width:730px){.game-layout{max-width:none;padding:0}#app{min-height:570px;padding:12px 12px max(10px,env(safe-area-inset-bottom));border:0;border-radius:0}.app-header{padding-bottom:13px}.wordmark{font-size:29px}.row{gap:8px}.stat{min-width:72px;padding:8px 9px}.stat b{font-size:29px}.stat .lbl{font-size:13px}.stat.moves-stat{min-width:117px}.moves-stat img{width:35px;height:38px}#goalbar{margin-top:14px;min-height:53px;padding:7px 9px}.goal-label{font-size:14px}.goal .ico{width:30px;height:30px}.goal b{font-size:14px}.combo-status{min-height:28px;padding:5px 8px;margin-bottom:9px}.combo-status strong{font-size:13px}#stage{min-height:220px}.tip-wrap{margin-top:13px;padding:7px 8px}#tip{font-size:13px}.screen{inset:68px 0 0}.card{padding:21px 23px}.logo .cats{height:160px}.logo .cats span{width:110px;height:110px}.logo .cats span:nth-child(2){width:164px;height:164px;margin:0 -23px}.logo h2{font-size:55px;margin-bottom:23px}.logo p,.card>p{font-size:17px}.big{font-size:24px;padding:16px}.pill{font-size:14px}.result-card h2{font-size:34px}#r-stars span{width:68px;height:68px}}
@media(max-height:700px){#app{min-height:560px;padding-top:8px}.app-header{padding-bottom:9px}.stat{padding-top:6px;padding-bottom:6px}#goalbar{margin-top:11px;margin-bottom:7px;min-height:48px}.tip-wrap{margin-top:10px;padding-top:5px;padding-bottom:5px}.screen{inset:61px 0 0}.card{padding:17px 24px}.logo .cats{height:120px;margin-top:8px}.logo .cats span{width:100px;height:100px}.logo .cats span:nth-child(2){width:135px;height:135px}.logo h2{font-size:47px;margin-bottom:17px}.logo p,.card>p{margin-bottom:18px;font-size:16px}.big{font-size:22px;padding:13px}.result-paw{width:58px;height:58px}#r-stars span{width:57px;height:57px}.result-card h2{font-size:31px}#sound-note{margin-top:17px}}
@media(max-width:365px){.stat{min-width:62px}.stat.moves-stat{min-width:103px}.stat .lbl{font-size:12px}.goal-label img{display:none}.goal .ico{width:26px;height:26px}.goal-label,.goal b{font-size:13px}.logo h2{font-size:46px}.logo .cats span:nth-child(2){width:145px;height:145px}}

/* Garden arcade direction, informed by real mobile puzzle references. */
html,body{background:#24b7cf}.game-layout{background:linear-gradient(#27bfe300,#087bba22),url('art/bg-garden.jpg') center/cover fixed no-repeat}
#app{background:linear-gradient(180deg,#13a5dacc,#039ba924 35%,#168e7622 80%,#176c4599);box-shadow:0 0 50px #063f5344;border-color:#77e8df}
.app-header{background:linear-gradient(#f69d24,#ee6c17);margin:-16px -18px 15px;padding:15px 23px 12px;border-bottom:4px solid #b94c0f;box-shadow:inset 0 -2px #ffbd4d}.wordmark{color:#fff166;text-shadow:0 3px 0 #ac4012,2px 0 #85370d,-2px 0 #85370d}.wordmark-dot{color:#fff399}
#goalbar{background:#05658a;border-color:#68dff0;box-shadow:inset 0 3px #034b6a,0 2px #37b5c7}.goal{background:#139bb2;border-color:#8ae9e7;box-shadow:0 2px #055b72}.goal b{color:#fff1a5}.goal-label{color:#fff1af}
#board{background:#09577e;box-shadow:0 0 0 5px #ffb72f,0 0 0 8px #ac5215,0 9px 0 8px #104b4f,inset 0 2px #79dbe4}.tile,.tile:nth-child(3n){background-color:#3ea5c6}.tile:nth-child(2n){background-color:#56b4cf}.combo-status{background:#075e7d;border-color:#5adae6}.combo-status strong{color:#dcffeb}.combo-status i b{background:#248ea2;box-shadow:inset 0 1px #63cdcf}
.screen{background:linear-gradient(180deg,#20afd455 0,#038cad44 45%,#067a8ac9 100%),url('art/bg-garden.jpg') center/cover no-repeat}.card{background:none}.start-card:before,.result-card:before{background:url('art/ui-star.png') 5% 14%/58px no-repeat,url('art/ui-star.png') 94% 64%/45px no-repeat;opacity:1}
.logo h2{color:#ffe545;-webkit-text-stroke-color:#ae4614;text-shadow:0 5px #c56314,0 9px #075977}.logo p,.card>p{color:#fff3c7;text-shadow:0 2px #055273}.result-card h2{color:#fff05c;text-shadow:0 3px #985516}.pill{background:#f87824;border-color:#ffca65;color:#fff2b0;box-shadow:0 4px #a64b14}.big{background:linear-gradient(#ffed50,#ffc623 50%,#ffa118);border-color:#fff07b;color:#7c350b;box-shadow:0 7px #ba5711,0 11px #07536f88,inset 0 3px #fff8a0}.ghost{background:#0794b8;border-color:#6aebed;color:#edffd8;box-shadow:0 3px #075771}
#sound-note,.foot{color:#ddffe9}.tip-wrap{background:#075b6dde;border-color:#5cddc9}#tip{color:#efffc9}.combo-banner b{color:#fff045;-webkit-text-stroke-color:#b34c11;filter:drop-shadow(0 2px #064c6a)}.combo-banner.mega b{color:#a3ff55;-webkit-text-stroke-color:#0b6670}.combo-banner span{background:#f67422;border-color:#ffe076;color:#fff4b8;box-shadow:0 3px #a3420e}.float{color:#fff345;-webkit-text-stroke-color:#a64d16;text-shadow:0 3px #085371}.kit.sel .pic{filter:drop-shadow(0 0 4px #ffef56)}.low-moves{outline-color:#fff238}
body:before,body:after{display:none}
@media(min-width:900px){.app-header{margin-left:-24px;margin-right:-24px;padding-left:29px;padding-right:29px}}
@media(max-width:730px){.app-header{margin:-12px -12px 13px;padding:12px 18px 10px}.screen{inset:73px 0 0}#app{background:linear-gradient(#05a7cedd,#04a5ba11 45%,#007f7299)}}
@media(max-height:700px){.app-header{margin-top:-8px;padding-top:9px;padding-bottom:8px;margin-bottom:10px}.screen{inset:68px 0 0}}