:root{color:#fff;font-synthesis:none;text-rendering:optimizelegibility;--ink:#211c4f;--panel:#ffffff1c;--panel-border:#ffffff26;background:#17153b;font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}body{background:radial-gradient(circle at 15% 8%,#6f5dff70,#0000 34rem),radial-gradient(circle at 88% 86%,#ff5ca847,#0000 30rem),linear-gradient(150deg,#18153e 0%,#29215f 52%,#1c3c6a 100%);min-width:320px;min-height:100dvh;margin:0}body.game-active{overscroll-behavior:none;width:100%;height:100dvh;overflow:hidden}body.game-active,body.game-active *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}h1,h2{letter-spacing:-.035em;margin:0;font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif}.login-shell,.loading-screen{place-items:center;min-height:100dvh;padding:24px;display:grid}.login-card{border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#191442b8;border-radius:30px;width:min(100%,420px);padding:38px;box-shadow:0 26px 80px #0302197a}.brand-mark{grid-template-columns:repeat(2,27px);gap:4px;width:max-content;margin-bottom:24px;display:grid;rotate:-5deg}.brand-mark span{background:linear-gradient(145deg,#ffe46f,#ff9d2f);border-radius:8px;width:27px;height:27px;box-shadow:inset 0 -5px #963d1740,0 6px 14px #ffab3440}.brand-mark span:nth-child(2){background:linear-gradient(145deg,#fe86bd,#ef3c92)}.brand-mark span:nth-child(3){background:linear-gradient(145deg,#70e3ff,#328be8)}.brand-mark span:nth-child(4){background:linear-gradient(145deg,#8ff5a0,#2fc76b)}.eyebrow{color:#bdb2ff;letter-spacing:.13em;text-transform:uppercase;margin:0 0 5px;font-size:.78rem;font-weight:800}.login-card h1{font-size:clamp(3rem,14vw,4.4rem);line-height:.95}.login-intro{color:#d3d0eb;margin:18px 0 24px;line-height:1.55}.login-card form{gap:17px;display:grid}.login-card label{color:#e9e7f8;gap:7px;font-weight:800;display:grid}.login-card input{width:100%;color:var(--ink);background:#fff;border:2px solid #0000;border-radius:14px;outline:none;padding:13px 14px}.login-card input:focus{border-color:#8e7dff;box-shadow:0 0 0 4px #8e7dff38}.form-error{color:#ffb9d4;margin:-4px 0 0;font-weight:700}.primary-button{color:#231a4b;cursor:pointer;background:linear-gradient(135deg,#ffe16b,#ff9e42);border:0;border-radius:15px;padding:14px 20px;font-weight:900;transition:transform .12s,box-shadow .12s;box-shadow:0 8px #b95a2d,0 14px 28px #ff964038}.primary-button:hover{transform:translateY(-2px);box-shadow:0 10px #b95a2d,0 16px 30px #ff96404d}.primary-button:active{transform:translateY(5px);box-shadow:0 3px #b95a2d}.primary-button:disabled{opacity:.65;cursor:wait}.loading-screen{color:#d9d4ff;align-content:center;gap:16px;font-weight:800}.loading-pop{background:#ffe16b;border-radius:9px;width:32px;height:32px;animation:.8s ease-in-out infinite alternate loading-bounce}.portrait-orientation-screen{width:100%;height:100dvh;padding:max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));place-items:center;display:grid;overflow:hidden}.portrait-orientation-card{border:1px solid var(--panel-border);text-align:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#191442c2;border-radius:28px;width:min(100%,460px);padding:30px;box-shadow:0 26px 80px #0302197a}.portrait-orientation-card h1{font-size:clamp(2rem,6vw,3.4rem);line-height:1}.portrait-orientation-card p:last-child{color:#d3d0eb;margin:16px auto 0;line-height:1.5}.portrait-orientation-icon{color:#322056;background:linear-gradient(135deg,#ff9ec8,#ffe47a);border-radius:18px;place-items:center;width:58px;height:58px;margin:0 auto 16px;font-size:2.2rem;font-weight:900;display:grid;box-shadow:0 10px 24px #ff87be47}.game-shell{width:min(100%,650px);height:100dvh;min-height:100dvh;padding:max(18px, env(safe-area-inset-top)) 20px max(18px, env(safe-area-inset-bottom));overscroll-behavior:none;flex-direction:column;margin:0 auto;display:flex;position:relative;overflow:hidden}.game-header{justify-content:space-between;align-items:end;gap:14px;margin-bottom:10px;display:flex}.game-header h1{font-size:clamp(2rem,8vw,3.4rem);line-height:1}.player-name{color:#bdb7e3;margin:0 0 2px;font-size:.78rem;font-weight:800}.header-actions{gap:8px;padding-bottom:3px;display:flex}.text-button{color:#d9d5f5;cursor:pointer;background:#ffffff14;border:0;border-radius:10px;padding:8px 10px;font-size:.78rem;font-weight:800}.text-button:hover{background:#ffffff29}.text-button:disabled{opacity:.48;cursor:default}.sound-button{place-items:center;min-width:38px;min-height:38px;padding:6px;font-size:1rem;display:grid}.score-strip{border:1px solid var(--panel-border);background:var(--panel);border-radius:18px;grid-template-columns:1fr auto 1fr;align-items:center;min-height:67px;margin-bottom:14px;padding:9px 18px;display:grid;box-shadow:0 14px 32px #06051d2e}.score-strip>div:first-child{text-align:left}.score-strip>div:last-child{text-align:right}.score-strip span{color:#bcb6dc;letter-spacing:.1em;text-transform:uppercase;font-size:.67rem;font-weight:900;display:block}.score-strip strong{font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif;font-size:1.55rem}.combo-badge{color:#3b2157;background:linear-gradient(135deg,#ff9ec8,#ffe47a);border-radius:999px;padding:7px 11px;font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif;font-size:.9rem;animation:.26s ease-out combo-pop}.board-stage{isolation:isolate;touch-action:none;width:100%;position:relative}.board{--gap:clamp(3px, .9vw, 6px);aspect-ratio:1;gap:var(--gap);touch-action:none;background:#0707226e;border:1px solid #ffffff1f;border-radius:clamp(16px,4vw,25px);grid-template-columns:repeat(8,1fr);width:100%;padding:clamp(7px,1.8vw,12px);display:grid;box-shadow:inset 0 2px 6px #0000004d,0 24px 50px #0603244d}.cell{aspect-ratio:1;background:#ffffff13;border-radius:clamp(4px,1.2vw,9px);transition:transform .12s,opacity .12s,background .1s;position:relative;box-shadow:inset 0 2px 2px #ffffff05}.cell--filled,.piece-block{background:var(--block-base);box-shadow:inset 0 4px #ffffff45,inset 0 -5px #30194b33,0 3px 5px #04031e40}.cell--filled:after,.cell--preview-valid:after,.piece-block:after{content:"";background:linear-gradient(145deg,#ffffff29,#0000 58%);border-radius:22%;position:absolute;inset:13%}.block--coral{--block-base:linear-gradient(145deg, #ff8a78, #ed456b)}.block--gold{--block-base:linear-gradient(145deg, #ffe06a, #f79b32)}.block--green{--block-base:linear-gradient(145deg, #79e88b, #27bd72)}.block--blue{--block-base:linear-gradient(145deg, #76a4ff, #5261ed)}.block--purple{--block-base:linear-gradient(145deg, #c17bff, #7547db)}.block--cyan{--block-base:linear-gradient(145deg, #68e2ff, #269bdc)}.cell--preview-valid{background:var(--block-base);opacity:1;transform:scale(.96);box-shadow:inset 0 4px #ffffff45,inset 0 -5px #30194b33,0 3px 5px #04031e40,0 0 0 2px #ffffff2e}.cell--preview-invalid{background:#ff688799;transform:scale(.92)}.cell--clearing{z-index:2;animation:.22s ease-in forwards clear-flash}.board--multi-clear{animation:.26s ease-out board-clear-pulse}.board--perfect-clear{animation:.72s ease-out perfect-board-pulse}.move-feedback{z-index:8;color:#fff;text-align:center;text-shadow:0 2px 8px #260d458c;pointer-events:none;background:#1f164dd1;border:1px solid #ffffff42;border-radius:999px;gap:1px;min-width:max-content;padding:8px 14px;animation:.42s cubic-bezier(.2,.95,.3,1.12) both score-burst;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 12px 30px #08052457}.move-feedback strong{text-transform:uppercase;font-size:clamp(1rem,4.5vw,1.45rem);line-height:1.05}.move-feedback span{color:#ffe879;font-size:.84rem;font-weight:900}.move-feedback--placement{background:#1f164dad;padding:5px 10px;top:72%}.move-feedback--multi{background:linear-gradient(135deg,#ea4299eb,#6448e2f0);animation-name:multi-score-burst}.move-feedback--board-clear{z-index:12;color:#31194f;text-shadow:none;background:linear-gradient(135deg,#fff8a1,#ffae68 50%,#ff8bd3);padding:10px 20px;animation:2.5s cubic-bezier(.2,.9,.28,1.12) both perfect-label-pop;top:auto;bottom:7%;box-shadow:0 12px 35px #ff73be6b}.move-feedback--board-clear strong{font-size:clamp(1.25rem,5vw,2rem)}.move-feedback--board-clear span{color:#602667;font-size:.95rem}.perfect-clear-celebration{z-index:7;pointer-events:none;place-items:center;animation:2.5s ease-out both celebration-container;display:grid;position:absolute;inset:-3%;overflow:visible}.perfect-clear-celebration img{z-index:2;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;border:2px solid #fff9;border-radius:clamp(18px,5vw,32px);width:94%;animation:2.5s cubic-bezier(.16,.9,.25,1.08) both celebration-image-pop;position:relative;box-shadow:0 20px 65px #ff68b67a,0 0 40px #ffe37566}.perfect-clear-glow{z-index:1;filter:blur(22px);opacity:0;background:conic-gradient(from 20deg,#ffe774,#ff75bc,#a781ff,#6ce5ff,#ffe774);border-radius:50%;animation:1.1s ease-out both perfect-glow;position:absolute;inset:-10%}.perfect-clear-sparks{z-index:4;position:absolute;inset:50%}.perfect-clear-sparks i{--spark-angle:0deg;--spark-delay:0s;aspect-ratio:1;opacity:0;width:clamp(6px,1.8vw,12px);animation:spark-fly .7s var(--spark-delay) ease-out both;transform:rotate(var(--spark-angle)) translateX(0) rotate(calc(-1 * var(--spark-angle)));background:#fff3a3;border-radius:3px;position:absolute;box-shadow:0 0 12px #fff,0 0 22px #ffcf50}.new-best-celebration{z-index:60;padding:max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom));pointer-events:none;isolation:isolate;place-items:center;animation:2.4s ease-out both new-best-overlay;display:grid;position:fixed;inset:0;overflow:hidden}.new-best-celebration img{z-index:2;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 24px 34px #0a042b8c);width:min(88vw,560px);max-height:min(88dvh,720px);animation:2.4s cubic-bezier(.16,.9,.25,1.08) both new-best-art;position:relative}.new-best-shine{z-index:1;aspect-ratio:1;filter:blur(2px);background:repeating-conic-gradient(from 8deg,#ffee5d6b 0deg 8deg,#0000 8deg 22deg),radial-gradient(circle,#ff69c48c,#6a5cff47 42%,#0000 70%);border-radius:50%;width:min(125vw,760px);animation:2.4s ease-out both new-best-shine;position:absolute}.tray{--tray-height:clamp(104px, 23vw, 142px);height:var(--tray-height);flex:0 0 var(--tray-height);touch-action:none;overscroll-behavior:none;grid-template-columns:repeat(3,1fr);align-items:stretch;gap:12px;padding:13px 4px 3px;display:grid}.tray-slot{grid-template-rows:minmax(0,1fr);place-items:stretch stretch;min-width:0;min-height:0;display:grid}.tray-slot--invalid{animation:.25s ease-in-out invalid-shake}.piece{--tray-cell:clamp(14px, 4.2vw, 27px);appearance:none;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;background:0 0;border:0;place-items:center;width:100%;min-width:0;max-width:100%;padding:10px;display:grid}.piece:active{cursor:grabbing}.piece-grid{grid-template-columns:repeat(var(--piece-cols), var(--tray-cell));grid-template-rows:repeat(var(--piece-rows), var(--piece-cell-height,var(--tray-cell)));column-gap:var(--piece-column-gap,2px);row-gap:var(--piece-row-gap,2px);display:grid}.piece-block{pointer-events:none;border-radius:5px;position:relative}.piece-gap{pointer-events:none}.piece--source-hidden .piece-grid{opacity:0}.game-footer{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-height:25px;display:grid}.game-footer-actions{align-items:center;gap:7px;display:flex}.app-version{color:#9690be;white-space:nowrap;font-size:.62rem;font-weight:800}.save-status{text-align:center;color:#aaa4cd;place-items:center;min-height:25px;font-size:.74rem;font-weight:800;display:grid}.save-status--error{color:#ffc1d5}.save-status--conflict{color:#ffe193}.fullscreen-button{color:#c9c4e8;cursor:pointer;background:#ffffff12;border:0;border-radius:8px;align-items:center;gap:5px;min-height:25px;padding:3px 8px;font-size:.68rem;font-weight:900;display:inline-flex}.fullscreen-button:hover{color:#fff;background:#ffffff24}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0c082ab8;place-items:center;padding:22px;display:grid;position:fixed;inset:0}.game-over-card{text-align:center;background:linear-gradient(145deg,#342b76,#211b50);border:1px solid #ffffff30;border-radius:28px;width:min(100%,390px);padding:36px;animation:.3s cubic-bezier(.2,.9,.25,1.15) modal-pop;box-shadow:0 30px 90px #04021a8c}.game-over-card h2{font-size:2.5rem}.final-score{color:#ffe172;margin:15px 0 0;font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif;font-size:3.8rem;line-height:1}.game-over-card .primary-button{width:100%;margin-top:14px}.fullscreen-help-card p:not(.eyebrow){color:#d8d4ef;line-height:1.55}@keyframes loading-bounce{to{border-radius:50%;transform:translateY(-14px)rotate(25deg)}}@keyframes combo-pop{0%{transform:scale(.65)rotate(-6deg)}to{transform:scale(1)}}@keyframes clear-flash{45%{filter:brightness(1.7);transform:scale(1.12)}to{opacity:0;transform:scale(.05)}}@keyframes board-clear-pulse{45%{filter:brightness(1.12);transform:scale(1.018)}}@keyframes perfect-board-pulse{35%{filter:brightness(1.3)saturate(1.18);transform:scale(1.025)}to{filter:brightness(1.08)}}@keyframes score-burst{0%{opacity:0;transform:translate(-50%,-35%)scale(.55)}55%{opacity:1;transform:translate(-50%,-52%)scale(1.08)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes multi-score-burst{0%{opacity:0;transform:translate(-50%,-42%)scale(.45)rotate(-7deg)}60%{opacity:1;transform:translate(-50%,-52%)scale(1.12)rotate(2deg)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes celebration-container{0%,to{opacity:0}10%,78%{opacity:1}}@keyframes celebration-image-pop{0%{clip-path:circle(8% at 50% 58%);filter:brightness(1.7);transform:scale(.48)rotate(-8deg)}22%{clip-path:circle(74%);filter:brightness(1.12);transform:scale(1.06)rotate(2.5deg)}34%,76%{clip-path:circle(74%);filter:brightness();transform:scale(1)rotate(0)}to{clip-path:circle(74%);filter:brightness(1.05);transform:scale(.94)translateY(-4%)}}@keyframes perfect-label-pop{0%,8%{opacity:0;transform:translate(-50%,35%)scale(.5)}28%,78%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:0;transform:translate(-50%,-20%)scale(.92)}}@keyframes perfect-glow{0%{opacity:0;transform:scale(.2)rotate(0)}30%{opacity:.7}to{opacity:0;transform:scale(1.1)rotate(45deg)}}@keyframes spark-fly{0%{opacity:0;transform:rotate(var(--spark-angle)) translateX(10px) rotate(calc(-1 * var(--spark-angle))) scale(.3)}18%{opacity:1}to{opacity:0;transform:rotate(var(--spark-angle)) translateX(clamp(130px, 39vw, 260px)) rotate(calc(-1 * var(--spark-angle))) scale(.9)}}@keyframes new-best-overlay{0%,to{opacity:0}10%,82%{opacity:1}}@keyframes new-best-art{0%{opacity:0;transform:scale(.38)rotate(-9deg)translateY(12%)}18%{opacity:1;transform:scale(1.06)rotate(1.5deg)translateY(-1%)}30%,78%{opacity:1;transform:scale(1)rotate(0)translateY(0)}to{opacity:0;transform:scale(.92)rotate(1deg)translateY(-5%)}}@keyframes new-best-shine{0%{opacity:0;transform:scale(.2)rotate(-18deg)}24%{opacity:.9}to{opacity:0;transform:scale(1.25)rotate(34deg)}}@keyframes reduced-celebration-fade{0%,to{opacity:0}12%,86%{opacity:1}}@keyframes invalid-shake{25%{transform:translate(-8px)}50%{transform:translate(7px)}75%{transform:translate(-4px)}}@keyframes modal-pop{0%{opacity:0;transform:translateY(20px)scale(.9)}}@media (height<=720px) and (width>=500px){.game-shell{width:min(100%,540px,100dvh - 240px);padding-top:10px}.game-header h1{font-size:2rem}.score-strip{min-height:54px;margin-bottom:8px}.tray{--tray-height:90px;padding-top:6px}.piece{--tray-cell:16px;padding:6px}}@media (width>=500px) and (height>=721px){.game-shell{width:min(100%,650px,100dvh - 370px)}}@media (width<=430px){.game-shell{padding-left:12px;padding-right:12px}.game-header{align-items:center}.player-name{text-overflow:ellipsis;white-space:nowrap;max-width:120px;overflow:hidden}.header-actions{gap:4px}.text-button{padding:7px;font-size:.7rem}.sound-button{min-width:32px;min-height:32px;padding:4px;font-size:.88rem}.login-card{border-radius:24px;padding:30px 24px}}@media (width<=499px) and (height<=700px){.game-shell{padding-top:max(8px, env(safe-area-inset-top));padding-bottom:max(8px, env(safe-area-inset-bottom))}.game-header{margin-bottom:5px}.game-header h1{font-size:1.85rem}.player-name{font-size:.64rem}.score-strip{border-radius:14px;min-height:48px;margin-bottom:7px;padding:5px 14px}.score-strip strong{font-size:1.25rem}.board{--gap:3px;border-radius:14px;padding:6px}.tray{--tray-height:76px;gap:6px;padding-top:4px}.piece{--tray-cell:clamp(11px, 3.8vw, 17px);gap:1px;padding:6px}.game-footer,.save-status{min-height:18px}.save-status{font-size:.66rem}.fullscreen-button{min-height:22px;padding:2px 6px;font-size:.62rem}.app-version{font-size:.56rem}}@media (width<=350px) and (height<=600px){.login-shell{padding:10px}.login-card{border-radius:22px;padding:20px}.brand-mark{grid-template-columns:repeat(2,23px);gap:3px;margin-bottom:13px}.brand-mark span{border-radius:7px;width:23px;height:23px}.eyebrow{font-size:.67rem}.login-card h1{font-size:2.65rem}.login-intro{margin:11px 0 14px;font-size:.88rem;line-height:1.35}.login-card form{gap:11px}.login-card label{gap:4px;font-size:.88rem}.login-card input{padding:9px 11px}.login-card .primary-button{padding:11px 16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important}.perfect-clear-celebration,.move-feedback--board-clear{animation:2.5s ease-out both reduced-celebration-fade!important}.perfect-clear-celebration img{clip-path:none;filter:none;transform:none;animation:none!important}.perfect-clear-glow,.perfect-clear-sparks{display:none}.new-best-celebration{animation:2.4s ease-out both reduced-celebration-fade!important}.new-best-celebration img{filter:none;transform:none;animation:none!important}.new-best-shine{display:none}}
