:root{--cream:#fff8e9;--ink:#573d57;--muted:#98798b;--pink:#ef83a7;--pink-dark:#d9618a;--mint:#86d8c8;--mint-dark:#48b7a8;--yellow:#ffd77e;--peach:#ffc6a4;--line:#ead9d2;--board:#d5b8a8;--shadow:0 12px 30px rgba(100,57,80,.15)}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Nunito',sans-serif;background-image:radial-gradient(#f5dfcf 1px,transparent 1px);background-size:18px 18px}.page-shell{max-width:1120px;margin:0 auto;padding:28px 24px 38px}.topbar,.hero-row,.game-layout{display:flex;justify-content:space-between;align-items:center;gap:24px}.topbar{margin-bottom:26px}.brand-lockup{display:flex;align-items:center;gap:14px}.brand-mark{width:54px;height:54px;border-radius:17px;background:var(--pink);display:grid;place-items:center;color:#fff;font-size:30px;box-shadow:inset 0 -5px rgba(180,65,105,.18),0 7px 0 #d96e94;transform:rotate(-4deg)}.eyebrow{margin:0;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase}.brand-lockup h1{font:800 27px/22px 'Baloo 2',cursive;margin:4px 0 0}.brand-lockup h1 em{font-style:normal;color:var(--pink-dark)}.top-actions{display:flex;align-items:center;gap:10px}.icon-button,.new-game,.customize-button,.dialog-action{font:800 14px 'Nunito',sans-serif;border:0;cursor:pointer}.icon-button{width:42px;height:42px;border-radius:14px;background:#fff;border:2px solid var(--line);color:var(--pink-dark);font-size:19px;box-shadow:0 4px 0 #ead1cc}.new-game{padding:13px 18px;border-radius:14px;background:var(--pink);color:#fff;box-shadow:0 4px 0 #d6658e}.new-game span{font-size:18px;vertical-align:-1px;margin-right:5px}.hero-row{align-items:flex-end;margin-bottom:20px}.intro-copy{max-width:570px}.ribbon{display:inline-block;padding:6px 12px;background:var(--yellow);border-radius:20px;color:#8c623a;font-size:12px;font-weight:800;box-shadow:0 3px 0 #edc262}.intro-copy p{font:700 20px/1.2 'Baloo 2',cursive;margin:14px 0 0}.scoreboard{display:flex;gap:10px}.score-card{min-width:110px;padding:10px 16px 12px;background:#fff;border:2px solid var(--line);border-radius:15px;text-align:center;box-shadow:0 5px 0 #eadad4}.score-card span{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:1px}.score-card strong{display:block;font:800 25px 'Baloo 2',cursive;color:var(--pink-dark);line-height:1.05;margin-top:2px}.score-card.best strong{color:var(--mint-dark)}.game-layout{align-items:flex-start}.board-wrap{flex:1;min-width:0}.board-frame{position:relative;background:var(--board);padding:14px;border-radius:23px;box-shadow:var(--shadow),inset 0 -5px rgba(117,71,67,.15);max-width:640px;margin:0 auto}.board{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;background:var(--board);aspect-ratio:1;border-radius:12px}.cell{background:transparent;border-radius:14px;position:relative;isolation:isolate}.cell:before{content:'';position:absolute;inset:10% 5% 7%;border-radius:48% 52% 46% 54%;background:radial-gradient(ellipse at 50% 35%,#fff3d3 0 30%,#f0d2a7 31% 70%,#d7ad83 71%);box-shadow:0 5px 0 #b88375,0 9px 12px rgba(85,46,62,.2);transform:rotate(-2deg);z-index:-1}.tile{position:absolute;inset:0;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;color:#fff;animation:pop .18s ease-out;overflow:hidden;background:transparent}.tile .building{position:relative;width:66%;height:65%;margin-top:2%;filter:drop-shadow(0 5px 2px rgba(79,45,54,.25));border-radius:10px 10px 5px 5px;background:linear-gradient(90deg,#b34f64 0 16%,#ee788a 16% 84%,#b34f64 84%);border:3px solid rgba(122,61,73,.35);box-shadow:inset 5px 0 rgba(255,255,255,.24),inset -5px 0 rgba(114,54,70,.18)}.tile .building:before{content:'';position:absolute;left:-9%;right:-9%;top:-28%;height:42%;background:#fff3d6;border-radius:50% 50% 15% 15%;border:3px solid rgba(122,61,73,.3);box-shadow:inset 0 -5px #f19aaa}.tile .building:after{content:'';position:absolute;left:35%;bottom:-2px;width:30%;height:38%;background:#704a58;border-radius:7px 7px 0 0;box-shadow:-18px -16px 0 -10px #ffe5a8,18px -16px 0 -10px #ffe5a8}.tile .b4{background:linear-gradient(90deg,#a86c4c 0 13%,#d68b55 13% 87%,#a86c4c 87%)}.tile .b4:before{background:#f7d487;box-shadow:inset 0 -5px #d98955}.tile .b8{border-radius:14px 14px 7px 7px;background:linear-gradient(90deg,#aa5361 0 12%,#ed8e66 12% 88%,#aa5361 88%)}.tile .b16{border-radius:8px;background:linear-gradient(#6bd2c0 0 45%,#378d91 45%);height:48%}.tile .b16:before{left:8%;right:8%;top:-24%;background:#fce9b1;height:55%;box-shadow:inset 0 -4px #edb85d}.tile .b16:after{left:12%;bottom:7%;width:76%;height:8%;background:#f9df9c;border:0;border-radius:2px;box-shadow:0 10px #f9df9c,0 20px #f9df9c}.tile .b32{height:70%;border-radius:9px;background:linear-gradient(90deg,#4b8eb4,#87d5d1 50%,#4b8eb4)}.tile .b32:before{top:-17%;background:#ffcf84;height:33%;box-shadow:inset 0 -4px #e79b58}.tile .b32:after{left:19%;width:62%;height:28%;bottom:18%;background:#f7e4b2;border:2px solid #6d6176;box-shadow:0 0 0 3px #d97188 inset}.tile .b64,.tile .b128,.tile .b256,.tile .b512,.tile .b1024,.tile .b2048{width:72%;height:72%;border-radius:12px 12px 6px 6px;background:linear-gradient(90deg,#725d9a,#bb91d0 50%,#665189)}.tile .b64:before,.tile .b128:before,.tile .b256:before,.tile .b512:before,.tile .b1024:before,.tile .b2048:before{left:-15%;right:-15%;top:-24%;height:37%;background:#fff1c8;box-shadow:inset 0 -5px #eaa2bf}.tile .b128{background:linear-gradient(90deg,#b65d96,#e59cbd 50%,#a45088)}.tile .b256{background:linear-gradient(90deg,#3d899b,#76c7c0 50%,#327888)}.tile .b512{background:linear-gradient(90deg,#c5674a,#f0ad76 50%,#b45742)}.tile .b1024{background:linear-gradient(90deg,#514475,#a082c7 50%,#433662)}.tile .b2048{background:linear-gradient(90deg,#c18b38,#f1d17b 50%,#a9752d)}.tile .tile-name{font:800 clamp(9px,1.35vw,13px) 'Nunito',sans-serif;text-transform:uppercase;letter-spacing:.3px;text-align:center;text-shadow:0 1px rgba(105,51,69,.2);color:#fff}.board-footer{text-align:center;color:var(--muted);font-size:12px;font-weight:800;padding-top:12px}.board-footer span{color:var(--pink);padding:0 5px}.side-panel{width:260px;display:flex;flex-direction:column;gap:13px}.panel-card{background:#fff;border:2px solid var(--line);border-radius:18px;padding:17px;box-shadow:0 5px 0 #eadad4}.panel-heading{display:flex;align-items:center;justify-content:space-between}.panel-heading h2{font:800 20px 'Baloo 2',cursive;margin:3px 0 0;color:var(--pink-dark)}.goal-icon{width:46px;height:46px;display:grid;place-items:center;background:var(--peach);border-radius:14px;font-size:25px}.progress-track{height:9px;background:#f2e4dc;border-radius:20px;margin:16px 0 8px;overflow:hidden}.progress-fill{height:100%;background:var(--mint);border-radius:20px;width:0%;transition:width .3s}.progress-label{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;font-weight:800}.progress-label b{color:var(--ink)}.tips-card{position:relative;background:#fff5ce;border-color:#f1dfad;min-height:120px}.tips-card p:not(.eyebrow){font:700 14px/1.3 'Baloo 2',cursive;margin:10px 18px 0 0;color:#79585b}.tip-sparkle{position:absolute;right:15px;bottom:12px;color:#edb648;font-size:21px}.customize-button{padding:14px;border-radius:14px;background:var(--mint);color:#fff;box-shadow:0 4px 0 #4daea0}.game-message{display:none;position:absolute;inset:0;background:rgba(255,248,233,.82);border-radius:23px;align-items:center;justify-content:center;text-align:center}.game-message.visible{display:flex}.game-message strong{display:block;font:800 28px 'Baloo 2',cursive;color:var(--pink-dark)}.game-message button{margin-top:10px;border:0;border-radius:12px;padding:10px 16px;background:var(--pink);color:#fff;font-weight:800;cursor:pointer}dialog{border:0;border-radius:22px;padding:24px;width:min(390px,calc(100vw - 32px));color:var(--ink);box-shadow:0 18px 70px rgba(82,43,70,.28);background:#fffaf1}dialog::backdrop{background:rgba(68,38,54,.36)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.dialog-head h2{font:800 26px 'Baloo 2',cursive;margin:4px 0 0}.close-button{border:0;background:#f8e5dd;border-radius:9px;font-size:24px;width:34px;height:34px;color:var(--pink-dark);cursor:pointer}.toggle-row,.theme-row{display:flex;justify-content:space-between;align-items:center;padding:15px 0;border-top:1px solid var(--line)}.toggle-row strong,.theme-row strong{display:block;font-size:15px}.toggle-row small,.theme-row small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.toggle-row input{display:none}.toggle-row i{width:44px;height:24px;background:#e5d7d0;border-radius:20px;position:relative;cursor:pointer}.toggle-row i:after{content:'';position:absolute;width:18px;height:18px;top:3px;left:3px;border-radius:50%;background:#fff;transition:.2s}.toggle-row input:checked+i{background:var(--mint)}.toggle-row input:checked+i:after{left:23px}.swatches{display:flex;gap:8px}.swatch{border:3px solid transparent;width:25px;height:25px;border-radius:50%;cursor:pointer}.swatch.active{border-color:var(--ink)}.pink{background:var(--pink)}.mint{background:var(--mint)}.lemon{background:var(--yellow)}.dialog-action{width:100%;padding:13px;border-radius:13px;background:var(--pink);color:#fff;margin-top:14px;box-shadow:0 4px 0 #d6658e}@keyframes pop{0%{transform:scale(.6);opacity:.4}100%{transform:scale(1);opacity:1}}@media(max-width:800px){.page-shell{padding:20px 15px 30px}.topbar{align-items:flex-start}.top-actions{gap:7px}.new-game{padding:11px 12px;font-size:12px}.icon-button{width:38px;height:38px}.hero-row{align-items:flex-start;flex-direction:column;gap:15px}.scoreboard{width:100%}.score-card{flex:1}.game-layout{flex-direction:column}.side-panel{width:100%;display:grid;grid-template-columns:1fr 1fr}.customize-button{grid-column:1 / -1}.intro-copy p{font-size:18px}.brand-lockup h1{font-size:24px}}