:root{--cream:#fff8e8;--ink:#24314d;--blue:#4fa9f8;--pink:#f66087;--yellow:#ffc943;--purple:#9269f8;--mint:#4fd2b0;--cell:#ece6d8}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;overscroll-behavior:none;background:var(--cream);font-family:ui-rounded,"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;color:var(--ink)}
body{height:100dvh;display:flex;justify-content:center;overflow:hidden;touch-action:none;background:radial-gradient(circle at 18% 7%,#fff 0 4%,transparent 17%),radial-gradient(circle at 90% 35%,#c5f4ff88,transparent 29%),linear-gradient(160deg,#fffaf0 0 48%,#f0e5ff 100%)}
button{font:inherit;color:inherit}.app{width:min(100%,520px);height:100dvh;min-height:0;padding:max(12px,env(safe-area-inset-top)) 18px max(12px,env(safe-area-inset-bottom));display:flex;flex-direction:column;position:relative;isolation:isolate;user-select:none;-webkit-user-select:none}
.app:before,.app:after{content:"";position:fixed;border-radius:50%;z-index:-1;filter:blur(2px);opacity:.25}.app:before{width:170px;height:170px;background:#ffd36b;left:-80px;top:36%}.app:after{width:140px;height:140px;background:#8fdccc;right:-70px;top:9%}
.topbar{display:flex;align-items:center;justify-content:space-between;height:62px}.icon-btn{width:44px;height:44px;border:2px solid #fff;border-radius:15px;background:linear-gradient(#767ca4,#4f567d);box-shadow:0 5px 0 #373c60,0 7px 14px #5b527a55;color:#fff;font-size:22px;font-weight:900;cursor:pointer}.icon-btn:active{transform:translateY(3px);box-shadow:0 2px 0 #373c60}
.brand{display:flex;align-items:center;gap:7px;font-size:10px;line-height:.9;letter-spacing:2px;font-weight:800}.brand b{font-size:15px;color:#e54c75}.gem{font-size:26px;color:var(--purple);text-shadow:9px 2px 0 var(--yellow),4px 8px 0 var(--blue)}
.score-row{display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:10px;margin:10px 0 8px;text-align:center}.score-row span{font-size:9px;font-weight:900;letter-spacing:1.4px;opacity:.55}.score-row strong{display:block;font-size:22px;line-height:1.1}.score-main{position:relative}.score-main strong{font-size:40px;letter-spacing:-2px}.score-card{background:#fff;border-radius:17px;padding:9px 4px;box-shadow:0 4px 14px #dfd1aa70}.score-card.best strong{color:var(--blue)}.score-card.combo strong{color:var(--pink)}#scorePop{position:absolute;color:var(--pink);font-weight:900;top:0;right:-8px;opacity:0}.pop{animation:scorepop .65s ease-out}@keyframes scorepop{0%{opacity:1;transform:translateY(8px) scale(.7)}100%{opacity:0;transform:translateY(-22px) scale(1.25)}}
.power-panel{width:min(100%,410px);align-self:center;display:grid;grid-template-columns:38px 1fr 42px;align-items:center;gap:7px;border:2px solid #ffe19a;border-radius:17px;padding:6px 9px;margin-bottom:10px;background:#fff4d2;box-shadow:0 4px 0 #e9d393;color:var(--ink);transition:.2s}.power-panel:disabled{opacity:1}.power-gem{font-size:25px;color:#c2b89f;text-shadow:3px 2px #fff}.power-info{text-align:left}.power-info b{display:block;font-size:11px;line-height:1.2}.power-info i{display:block;height:8px;margin-top:5px;background:#e1d7bd;border-radius:9px;overflow:hidden}.power-info em{display:block;width:0;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--blue),var(--purple),var(--pink),var(--yellow));transition:width .45s cubic-bezier(.2,.8,.3,1)}.power-panel>strong{font-size:13px;color:#8b806a}.power-panel.ready{cursor:pointer;border-color:#fff;background:linear-gradient(120deg,#bff2ff,#f4ccff,#fff2a6);box-shadow:0 0 0 4px #ffcf44,0 7px 0 #d79527,0 0 25px #9b6dff99;animation:powerReady .75s ease-in-out infinite alternate}.power-panel.ready .power-gem{color:var(--purple);text-shadow:4px 2px var(--yellow)}.power-panel.ready>strong{color:#d53b72}.power-panel.ready:active{transform:translateY(4px)}@keyframes powerReady{to{filter:hue-rotate(30deg);transform:scale(1.025)}}
.board-wrap{position:relative;width:min(100%,410px,calc(100dvh - 480px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));align-self:center;aspect-ratio:1;flex:none;margin-bottom:25px}.board{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr);gap:5px;padding:8px;background:#d9d1c2;border:3px solid #fff;border-radius:21px;box-shadow:0 10px 0 #bdb29f,0 18px 30px rgba(81,62,27,.19);touch-action:none}.cell{min-width:0;border-radius:7px;background:var(--cell);box-shadow:inset 0 2px 2px rgba(89,69,35,.08);transition:transform .12s,background .15s,opacity .2s}.cell.filled{background:var(--c);box-shadow:inset 0 -4px 0 rgba(0,0,0,.13),inset 0 2px 1px rgba(255,255,255,.38),0 2px 4px rgba(60,45,20,.18);transform:scale(.98)}.cell.ghost{background:color-mix(in srgb,var(--ghost) 55%,white);transform:scale(.88);outline:2px dashed var(--ghost)}.cell.bad{background:#f8a1a1}.cell.hint{animation:hint 1s ease-in-out infinite;outline:3px solid #fff;box-shadow:0 0 0 5px #ffb823}.cell.clearing{animation:clear .42s ease forwards}@keyframes clear{50%{transform:scale(1.18) rotate(5deg);filter:brightness(1.5)}100%{transform:scale(0);opacity:0}}@keyframes hint{50%{transform:scale(.78);background:#fff3a4}}
.danger-glow{position:absolute;inset:-5px;border-radius:25px;opacity:0;box-shadow:0 0 28px 7px #ff6a6a;transition:opacity .3s}.danger .danger-glow{opacity:.55;animation:pulse 1.4s infinite}@keyframes pulse{50%{opacity:.2}}
.power-hit{animation:powerHit .55s ease-in forwards!important}@keyframes powerHit{0%{filter:brightness(1)}35%{transform:scale(1.35) rotate(12deg);filter:brightness(2) hue-rotate(120deg)}100%{transform:scale(0) rotate(100deg);opacity:0}}.board.power-shake{animation:boardShake .55s ease-in-out}@keyframes boardShake{20%{transform:translateX(-8px) rotate(-1deg)}40%{transform:translateX(8px) rotate(1deg)}60%{transform:translateX(-5px)}80%{transform:translateX(4px)}}
.power-flash{position:fixed;inset:0;z-index:80;display:grid;place-items:center;pointer-events:none;opacity:0;background:radial-gradient(circle,#fff 0 6%,#fff49cbb 20%,#c66bff88 45%,transparent 72%)}.power-flash span{text-align:center;font-weight:1000;font-size:36px;line-height:.9;color:#fff;text-shadow:0 4px 0 #7b3ec5,0 0 20px #ff4fa7;transform:scale(.2) rotate(-8deg)}.power-flash.show{animation:flashShow .85s ease-out}.power-flash.show span{animation:wordShow .85s cubic-bezier(.2,1.6,.3,1)}@keyframes flashShow{0%{opacity:0}18%{opacity:1}70%{opacity:.9}100%{opacity:0}}@keyframes wordShow{25%{transform:scale(1.25) rotate(4deg)}65%{transform:scale(1) rotate(-2deg)}100%{transform:scale(1.5);opacity:0}}
.particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}.particle{position:absolute;width:10px;height:10px;border-radius:3px;background:var(--p);animation:burst .65s ease-out forwards}@keyframes burst{to{transform:translate(var(--x),var(--y)) rotate(180deg);opacity:0}}
.guide{align-self:center;text-align:center;font-size:12px;font-weight:900;letter-spacing:.03em;color:#77758a;background:#ffffffaa;border:1px solid #fff;border-radius:999px;padding:5px 14px;margin:0 0 12px;box-shadow:0 3px 8px #7b719d1c}.tray{height:110px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:center;padding:5px 8px;margin-bottom:16px;background:#ffffff72;border:1px solid #ffffffcc;border-radius:24px;box-shadow:inset 0 1px 0 #fff,0 6px 16px #7b719d16}.piece-slot{height:96px;display:flex;align-items:center;justify-content:center;border:2px solid transparent;background:transparent;border-radius:18px;position:relative;cursor:grab;touch-action:none}.piece-slot.selected{background:#fff8db;border-color:#efbe45;box-shadow:0 4px 10px #dcae4833}.piece-slot.used{pointer-events:none}.piece-slot.used .piece{opacity:0;transform:scale(.2)}.piece{display:grid;gap:3px;transition:transform .15s,opacity .2s}.piece-slot:active .piece{transform:scale(1.07)}.block{width:var(--bs);height:var(--bs);border-radius:6px;background:var(--c);border:1px solid #ffffff80;box-shadow:inset 0 -3px 0 rgba(35,36,63,.17),inset 0 2px 0 rgba(255,255,255,.25),0 2px 3px #6e5d3a25}.blank{visibility:hidden}
.drag-piece{position:fixed;z-index:50;pointer-events:none;display:none;filter:drop-shadow(0 8px 7px #4a371b55);transform:translate(-50%,-50%)}.drag-piece.active{display:grid}
.actions{margin-top:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:11px;padding-top:2px}.action-btn{min-height:57px;border:0;background:#fff;border-radius:17px;padding:8px 2px;font-size:10px;font-weight:800;box-shadow:0 4px 12px #decfa988;cursor:pointer}.action-btn span{display:block;font-size:20px;color:var(--purple);line-height:1.15}.action-btn:disabled{opacity:.35}.action-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 4px #decfa9}
.modal{border:0;padding:0;background:transparent;max-width:none;width:100%;height:100%;overflow:hidden}.modal::backdrop{background:rgba(34,40,60,.57);backdrop-filter:blur(5px)}.modal[open]{display:flex;align-items:center;justify-content:center;padding:20px}.modal-card{width:min(100%,420px);background:var(--cream);border:4px solid #fff;border-radius:28px;padding:28px 22px 22px;text-align:center;box-shadow:0 18px 0 #c5b79f,0 25px 60px #0005;position:relative;animation:modalin .25s cubic-bezier(.2,1.3,.4,1)}@keyframes modalin{from{transform:scale(.75);opacity:0}}.close{position:absolute;right:13px;top:11px;width:36px;height:36px;border:0;background:#eee5d6;border-radius:50%;font-size:25px;cursor:pointer}.modal-icon{font-size:46px;color:var(--purple);text-shadow:10px 2px var(--yellow)}.modal h2{margin:6px 0 18px;font-size:28px}.modal p{font-size:13px;line-height:1.7}.howto{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.howto div{background:#fff;border-radius:16px;padding:12px 4px;font-size:10px;font-weight:700}.howto b{display:grid;place-items:center;width:28px;height:28px;margin:0 auto 8px;border-radius:50%;background:var(--blue);color:#fff;font-size:16px}.howto div:nth-child(2) b{background:var(--pink)}.howto div:nth-child(3) b{background:var(--purple)}.primary{width:100%;border:0;border-radius:17px;background:linear-gradient(#65b8ff,#3d99ec);box-shadow:0 6px 0 #2778bd;color:#fff;font-weight:900;font-size:17px;padding:14px;margin-top:10px;cursor:pointer}.primary:active{transform:translateY(4px);box-shadow:0 2px 0 #2778bd}
.setting{display:flex;align-items:center;justify-content:space-between;background:#fff;border-radius:17px;padding:15px;margin:10px 0;font-weight:800}.setting input{display:none}.setting i{width:50px;height:28px;border-radius:20px;background:#cec8bc;position:relative;transition:.2s}.setting i:after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:#fff;left:3px;top:3px;box-shadow:0 2px 3px #0003;transition:.2s}.setting input:checked+i{background:var(--mint)}.setting input:checked+i:after{transform:translateX(22px)}.safe-note{background:#e2f7ed;color:#277f66;border-radius:12px;padding:7px!important}.trophy{width:80px;height:80px;display:grid;place-items:center;margin:-65px auto 12px;border-radius:50%;background:var(--yellow);border:5px solid #fff;color:#fff;font-size:44px;box-shadow:0 7px 0 #dfa625}.result-card h2{font-size:56px;margin:-4px 0;color:var(--pink)}.record{margin:10px;background:#fff0be;border-radius:13px;padding:10px;font-weight:900;color:#cc7a16}
.confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.confirm-actions .primary{margin-top:10px}.secondary{width:100%;border:0;border-radius:17px;background:#ece5d8;box-shadow:0 5px 0 #c9bead;color:#5e6574;font-weight:900;font-size:15px;padding:14px;margin-top:10px;cursor:pointer}
.power-tip{background:linear-gradient(90deg,#e7dbff,#fff0a8);border-radius:13px;padding:8px!important;font-weight:900;color:#784aaf}
.music-credit{font-size:9px!important;line-height:1.35!important;opacity:.55;margin:5px 0!important}
.hud-right{display:flex;align-items:center;gap:5px}.help-mini{width:29px;height:29px;border:2px solid #fff;border-radius:50%;background:#596187;color:#fff;font-weight:1000;box-shadow:0 3px 0 #373c60;cursor:pointer}.power-orb{--powerAngle:0deg;position:relative;width:58px;height:58px;border:0;border-radius:50%;padding:5px;background:conic-gradient(#ffcc3d 0,var(--powerAngle),#c8c3d1 var(--powerAngle),#c8c3d1 360deg);box-shadow:0 5px 0 #5b4a76,0 7px 14px #69519266;cursor:default}.power-orb:before{content:"";position:absolute;inset:5px;border-radius:50%;background:linear-gradient(145deg,#7966b7,#4a437b);box-shadow:inset 0 3px 4px #ffffff55,inset 0 -5px 5px #2d2855}.orb-core{position:relative;z-index:1;display:block;color:#bbb3cf;font-size:22px;line-height:25px;text-shadow:0 2px #2f295b}.power-orb strong{position:relative;z-index:1;display:block;color:#fff;font-size:9px;line-height:10px}.power-orb.ready{cursor:pointer;background:conic-gradient(#ff518e,#ffdf41,#4ed8d1,#8069ff,#ff518e);box-shadow:0 5px 0 #75458e,0 0 0 3px #fff,0 0 23px 8px #ff4fbc88;animation:orbReady .55s ease-in-out infinite alternate}.power-orb.ready:before{background:radial-gradient(circle at 35% 25%,#fff,#ffe762 22%,#c54cff 68%,#6839ac)}.power-orb.ready .orb-core{color:#fff;font-size:26px;text-shadow:0 0 8px #fff,0 3px #8139a6}.power-orb.ready:active{transform:scale(.9)}@keyframes orbReady{to{transform:translateY(-3px) scale(1.07);filter:hue-rotate(25deg)}}
.mission{align-self:center;display:flex;align-items:center;justify-content:center;gap:6px;background:linear-gradient(#fff7cf,#ffe6a3);border:2px solid #fff;border-radius:999px;padding:5px 14px;margin-bottom:8px;box-shadow:0 3px 0 #d9b957;color:#77512e;font-size:11px}.mission span{color:#ea8d1c;font-size:15px}.mission b{font-weight:900}
.score-card{border:2px solid #fff}.score-card.best{background:linear-gradient(145deg,#effaff,#d9f1ff);box-shadow:0 5px 0 #82bcdc,0 8px 15px #65749833}.score-card.combo{background:linear-gradient(145deg,#fff2f7,#ffdce7);box-shadow:0 5px 0 #dc8da7,0 8px 15px #7d587333}.score-main{background:linear-gradient(145deg,#fff,#fff2be);border:2px solid #fff;border-radius:19px;padding:5px;box-shadow:0 5px 0 #d2aa4b,0 8px 15px #7d6a3e33}.score-main strong{color:#34395e;text-shadow:0 2px #fff}
.board{gap:6px;padding:9px;background:linear-gradient(145deg,#dfe3f1,#c9ccdf);border:5px solid #fff;box-shadow:0 8px 0 #9da3bf,0 12px 0 #d8ba62,0 18px 25px rgba(75,71,109,.2)}.cell{background:#fffaf0;box-shadow:inset 0 2px 3px rgba(77,73,106,.12),0 1px 0 #fff;border:1px solid #ece5d8}.cell.filled{border-color:#ffffff99;box-shadow:inset 0 -4px 0 rgba(0,0,0,.12),inset 0 2px 1px rgba(255,255,255,.6),0 2px 4px rgba(66,56,83,.2)}.cell.ghost{background:color-mix(in srgb,var(--ghost) 66%,white);outline:3px solid #fff;box-shadow:0 0 0 2px var(--ghost),0 0 12px var(--ghost)}
.cell.filled{background:var(--c);border:1px solid #ffffff80;box-shadow:inset 0 -3px 0 rgba(35,36,63,.17),inset 0 2px 0 rgba(255,255,255,.25),0 2px 3px #6e5d3a25}.cell.ghost{background:color-mix(in srgb,var(--ghost) 62%,white);border:2px solid var(--ghost);outline:2px solid #fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--ghost) 40%,transparent);transform:scale(.94)}.cell.just-placed{animation:blockLand .34s cubic-bezier(.2,1.45,.4,1) both;animation-delay:var(--delay)}@keyframes blockLand{0%{transform:scale(.78) translateY(-8px)}65%{transform:scale(1.08)}100%{transform:scale(.98)}}
.block,.cell.filled{position:relative;background-image:linear-gradient(155deg,#ffffff52 0 24%,#ffffff0c 25% 58%,#00000012 100%);border-color:#ffffffb3;box-shadow:inset 0 2px 0 #ffffff85,inset 0 -4px 0 #322d4d2b,0 2px 3px #55406c30}.block:before,.cell.filled:before{content:"";position:absolute;top:17%;left:14%;width:34%;height:9%;border-radius:999px;background:#ffffffa6;transform:rotate(-18deg)}.piece-slot.selected:after{content:"✦";position:absolute;right:5px;top:3px;color:#e7a92c;font-size:15px;pointer-events:none}
.cell.clearing{animation:clear .36s ease forwards;animation-delay:var(--clear-delay,0ms)}.board.line-celebrate{animation:boardCelebrate .55s ease-out}@keyframes boardCelebrate{35%{box-shadow:0 0 0 5px #fff,0 0 26px 9px #ffd45c,0 8px 0 #9da3bf}100%{box-shadow:0 8px 0 #9da3bf,0 12px 0 #d8ba62,0 18px 25px rgba(75,71,109,.2)}}
.cell.line-ready{position:relative;z-index:1;outline:3px solid #ffdc57;outline-offset:-2px;box-shadow:inset 0 0 0 2px #fff7c0,0 0 13px 3px #ffd84a9c;filter:brightness(1.12);animation:lineReady .75s ease-in-out infinite alternate}.cell.ghost.line-ready{background:color-mix(in srgb,var(--ghost) 70%,#ffe26a);border-color:#fff3ae;outline:3px solid #ffcc3a;box-shadow:inset 0 0 0 2px #fff9d3,0 0 15px 4px #ffd84ab3}.board.preview-complete{box-shadow:0 8px 0 #9da3bf,0 12px 0 #d8ba62,0 0 20px 3px #ffe37299}@keyframes lineReady{to{filter:brightness(1.28);transform:scale(1.025)}}
.board-wrap.tier-2{--line-accent:#ffd44c;--line-halo:#ffdb64aa}.board-wrap.tier-3{--line-accent:#ff71b6;--line-halo:#ff83cbaa}.board-wrap.tier-4{--line-accent:#a376ff;--line-halo:#b59affbb}.board-wrap.multi-preview .board,.board-wrap.hint-multi .board,.board-wrap.multi-clear .board{box-shadow:0 8px 0 #9da3bf,0 12px 0 #d8ba62,0 0 24px 6px var(--line-halo)}.board-wrap.multi-clear .board{animation:multiBoardHit .55s ease-out 2}.board-wrap.multi-preview .cell.line-ready,.board-wrap.hint-multi .cell.hint-line{position:relative;z-index:1;outline:3px solid var(--line-accent);outline-offset:-2px;box-shadow:inset 0 0 0 2px #fff,0 0 14px 4px var(--line-halo);animation:lineReady .6s ease-in-out infinite alternate}@keyframes multiBoardHit{50%{transform:scale(1.018);filter:brightness(1.2)}}
@property --aura-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.board-aura{position:absolute;inset:-10px;z-index:3;pointer-events:none;opacity:0;transition:opacity .15s;filter:drop-shadow(0 0 8px var(--line-accent))}.board-aura:before{content:"";position:absolute;inset:0;padding:5px;border-radius:29px;background:conic-gradient(from var(--aura-angle),var(--line-accent),#fff 8%,#78efff 13%,transparent 19%,var(--line-accent) 29%,#fff 35%,transparent 42%,var(--line-accent) 53%,#fff 60%,transparent 68%,var(--line-accent) 78%,#fff 84%,transparent 90%,var(--line-accent));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}.board-aura i{position:absolute;width:20px;height:20px;color:#fff;font-style:normal;text-align:center;font-size:21px;line-height:20px;text-shadow:0 0 5px #fff,0 0 11px var(--line-accent);opacity:0}.board-aura i:before{content:"✦"}.board-aura i:nth-child(1){top:-6px;left:12%;--spark-delay:0s;--clear-delay:0s}.board-aura i:nth-child(2){top:16%;right:-9px;--spark-delay:.42s;--clear-delay:.14s}.board-aura i:nth-child(3){bottom:-9px;right:20%;--spark-delay:.82s;--clear-delay:.28s}.board-aura i:nth-child(4){bottom:23%;left:-9px;--spark-delay:1.2s;--clear-delay:.4s}.board-wrap.tier-2 .board-aura i:nth-child(n+3),.board-wrap.tier-3 .board-aura i:nth-child(4){display:none}.board-wrap.multi-preview .board-aura,.board-wrap.hint-multi .board-aura,.board-wrap.multi-clear .board-aura{opacity:1}.board-wrap.multi-preview .board-aura:before,.board-wrap.hint-multi .board-aura:before{animation:auraOrbit 1.7s linear infinite}.board-wrap.multi-preview.tier-3 .board-aura:before,.board-wrap.hint-multi.tier-3 .board-aura:before{animation-duration:1.3s}.board-wrap.multi-preview.tier-4 .board-aura:before,.board-wrap.hint-multi.tier-4 .board-aura:before{animation-duration:.95s}.board-wrap.multi-clear .board-aura:before{animation:auraOrbit .55s linear 2}.board-wrap.multi-preview .board-aura i,.board-wrap.hint-multi .board-aura i{animation:auraSpark 1.7s ease-in-out infinite;animation-delay:var(--spark-delay)}.board-wrap.multi-clear .board-aura i{animation:auraSpark .55s ease-in-out 2;animation-delay:var(--clear-delay)}@keyframes auraOrbit{to{--aura-angle:360deg}}@keyframes auraSpark{0%,100%{opacity:0;transform:scale(.4) rotate(-30deg)}35%,65%{opacity:1;transform:scale(1.25) rotate(18deg)}}
.board-wrap.auto-opportunity:not(.multi-clear):not(.hint-multi) .board{box-shadow:0 8px 0 #9da3bf,0 12px 0 #d8ba62,0 0 20px 5px var(--line-halo)}.board-wrap.auto-opportunity .board-aura{opacity:1}.board-wrap.auto-opportunity:not(.multi-clear):not(.hint-multi) .board-aura:before{animation:auraOrbit var(--auto-speed) linear infinite}.board-wrap.auto-opportunity:not(.multi-clear):not(.hint-multi) .board-aura i{animation:auraSpark var(--spark-speed) ease-in-out infinite;animation-delay:var(--spark-delay)}.board-wrap.auto-opportunity.tier-2{--auto-speed:2.6s;--spark-speed:2.3s}.board-wrap.auto-opportunity.tier-3{--auto-speed:1.45s;--spark-speed:1.35s}.board-wrap.auto-opportunity.tier-4{--auto-speed:.8s;--spark-speed:.85s}.board-wrap.auto-opportunity.tier-4 .board-aura{filter:drop-shadow(0 0 13px #ac75ff) drop-shadow(0 0 8px #7ef7ff)}
.perfect-flash{position:fixed;inset:0;z-index:90;display:grid;place-items:center;pointer-events:none;opacity:0;background:radial-gradient(circle,#fffdf0 0 12%,#fff0a7df 30%,#f99fdf99 55%,#8f78f366 75%,transparent 100%)}.perfect-flash.show{animation:perfectFlash 2.25s ease-out both}.perfect-flash span{position:relative;z-index:1;display:block;text-align:center;font-size:clamp(22px,6vw,34px);font-weight:1000;line-height:1.1;color:#fff;text-shadow:0 4px 0 #8d47b0,0 0 16px #b84be0;transform:scale(.25)}.perfect-flash b,.perfect-flash strong{display:block}.perfect-flash b{font-size:clamp(34px,10vw,62px);white-space:nowrap}.perfect-flash strong{margin-top:12px;padding:6px 20px;border:3px solid #fff;border-radius:999px;background:linear-gradient(90deg,#ffbc3f,#ff5e9c,#9a67f8);box-shadow:0 6px 0 #9a52ad;font-size:clamp(27px,8vw,48px)}.perfect-flash.show span{animation:perfectWords 2.2s cubic-bezier(.2,1.25,.3,1) both}.perfect-rays{position:absolute;width:120vmax;height:120vmax;background:repeating-conic-gradient(#fff8 0deg 8deg,transparent 8deg 20deg);opacity:0}.perfect-flash.show .perfect-rays{animation:perfectRays 2.2s linear both}@keyframes perfectFlash{0%,100%{opacity:0}12%,76%{opacity:1}}@keyframes perfectWords{0%{transform:scale(.25) rotate(-8deg)}22%{transform:scale(1.12) rotate(3deg)}38%,76%{transform:scale(1) rotate(0)}100%{transform:scale(1.35);opacity:0}}@keyframes perfectRays{15%{opacity:.75}80%{opacity:.65;transform:rotate(50deg)}100%{opacity:0;transform:rotate(70deg)}}
.action-btn{border:2px solid #fff;background:linear-gradient(#fff,#ebe8ff);box-shadow:0 5px 0 #aaa4d2,0 7px 12px #574e8533;font-size:11px}.action-btn span{font-size:22px}.action-btn:nth-child(3){background:linear-gradient(#e7faff,#cdefff);box-shadow:0 5px 0 #72b6d3,0 7px 12px #574e8533}#hintBtn{display:flex;align-items:center;justify-content:center;gap:10px;padding:5px 8px;background:linear-gradient(160deg,#fff9e1,#ffe8ad);border:2px solid #fff;box-shadow:0 5px 0 #d3b263,0 7px 12px #8b6d3940}#hintBtn .hint-emblem{display:grid;place-items:center;width:31px;height:31px;flex:none;border:1px solid #dec9fa;border-radius:10px;background:#f1e8ff;box-shadow:inset 0 1px #fff}#hintBtn .hint-emblem svg{display:block;width:25px;height:25px;filter:drop-shadow(0 2px 2px #6b58a755)}#hintBtn .hint-info{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;min-width:65px}#hintBtn .hint-label{display:block;color:#504277;font-size:12px;line-height:1;font-weight:900;letter-spacing:.08em}#hintBtn .hint-charges{display:flex;gap:4px}#hintBtn .hint-charges i{display:block;width:18px;height:6px;border-radius:2px;background:linear-gradient(#b69af5,#8469d5);box-shadow:inset 0 1px #e4d7ff,0 1px 2px #7158ad55;transition:background .2s,box-shadow .2s}#hintBtn .hint-charges i.spent{background:#d7ccdf;box-shadow:inset 0 1px 2px #8b7ca355}#hintBtn.hint-active{background:linear-gradient(160deg,#f7efff,#e4d0ff);border-color:#fff;box-shadow:0 5px 0 #b9a3d7,0 0 0 2px #cbaaf6,0 0 14px #b68df588}#hintBtn.hint-active:disabled{opacity:1}#hintBtn.hint-active .hint-emblem{background:#fff;box-shadow:inset 0 1px #fff,0 0 8px #cdaeff}#hintBtn:disabled:not(.hint-active){opacity:.5;filter:saturate(.5)}
.block.lucky,.cell.lucky{box-shadow:inset 0 2px 0 #ffffffa8,inset 0 -4px 0 #4d3b7b35,0 0 0 2px #ffe38b,0 0 10px #ffd96caa}.block.lucky:after,.cell.lucky:after{content:"✦";position:absolute;inset:0;display:grid;place-items:center;color:#fff;-webkit-text-stroke:.8px #6d57a8;text-shadow:0 1px 2px #5d4c8a,0 0 8px #fff;pointer-events:none}.block.lucky:after{font-size:clamp(10px,calc(var(--bs)*.62),18px)}.cell.lucky:after{font-size:clamp(14px,3vw,21px)}.cell.lucky-clearing{box-shadow:0 0 0 3px #fff6c4,0 0 18px 7px #ffd35eb0}.board.lucky-celebrate{animation:luckyBoard .72s ease-out}@keyframes luckyBoard{40%{box-shadow:0 0 0 5px #fff,0 0 27px 12px #ffd966,0 12px 0 #d8ba62}100%{box-shadow:0 8px 0 #9da3bf,0 12px 0 #d8ba62,0 18px 25px #4b476d33}}.lucky-tip{background:#fff2c9;border-radius:13px;padding:8px!important;font-weight:900;color:#795483}
.block.lucky,.cell.lucky{background:linear-gradient(135deg,#6ee8fb,#937afa 38%,#ef7acf 72%,#ffe16b);border:2px solid #fff4b9;box-shadow:inset 0 2px 0 #fff9,inset 0 -4px 0 #5b448655,0 0 0 2px #ffc84d,0 0 12px 3px #ffd56caa}.block.lucky,.cell.lucky:not(.clearing):not(.just-placed):not(.hint){animation:luckyIdle 1.4s ease-in-out infinite alternate}.block.lucky:after{font-size:clamp(12px,calc(var(--bs)*.8),21px)}.cell.lucky:after{font-size:clamp(17px,4vw,25px)}@keyframes luckyIdle{to{filter:brightness(1.16);box-shadow:inset 0 2px 0 #fff,inset 0 -4px 0 #5b448655,0 0 0 3px #fff0a5,0 0 17px 6px #ffd56caa}}.cell.lucky-flare{z-index:2;outline:3px solid #fff9bd;box-shadow:0 0 0 5px #ffc43f,0 0 24px 10px #ffce57}.cell.lucky-flare:after{animation:luckyStarCharge .24s ease-in-out infinite alternate}@keyframes luckyStarCharge{to{transform:scale(1.3) rotate(18deg);filter:brightness(1.5)}}.cell.lucky-target:not(.clearing){z-index:1;outline:3px solid #fff5ac;outline-offset:-2px;animation:luckyTargetPulse .3s ease-in-out infinite alternate}@keyframes luckyTargetPulse{to{filter:brightness(1.35);box-shadow:inset 0 0 0 3px #fff4a8,0 0 15px 4px #ffd364aa}}.lucky-effects{position:absolute;inset:0;z-index:5;pointer-events:none}.lucky-wave{position:absolute;width:var(--wave-size);height:var(--wave-size);border:4px solid #fff;border-radius:50%;box-shadow:0 0 0 5px #ffd956,0 0 18px 8px #ffb84a;animation:luckyWave .7s ease-out both}.lucky-word{position:absolute;white-space:nowrap;color:#fff;font-size:clamp(14px,3.5vw,20px);font-weight:1000;-webkit-text-stroke:1px #8d53b9;text-shadow:0 2px #8d53b9,0 0 9px #ffcb4f;animation:luckyWord .9s cubic-bezier(.2,1.3,.4,1) both}@keyframes luckyWave{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(3.6)}}@keyframes luckyWord{0%{opacity:0;transform:translate(-50%,-20%) scale(.5)}25%{opacity:1;transform:translate(-50%,-95%) scale(1.15)}70%{opacity:1;transform:translate(-50%,-130%) scale(1)}100%{opacity:0;transform:translate(-50%,-190%) scale(1.08)}}
.lucky-word{z-index:1;padding:3px 9px;border:2px solid #fff;border-radius:999px;background:linear-gradient(145deg,#ac78ea,#794bbd);box-shadow:0 3px 0 #643796,0 0 14px #ffe06d;color:#fff;-webkit-text-stroke:0;font-size:clamp(12px,3vw,17px)}
.block.lucky,.cell.lucky{position:relative;isolation:isolate}.block.lucky:before,.cell.lucky:before{content:"";position:absolute;inset:3px;border-radius:inherit;background:linear-gradient(115deg,transparent 25%,#fff9 43%,transparent 57%);pointer-events:none;animation:luckySheen 2.2s ease-in-out infinite}.block.lucky:after,.cell.lucky:after{z-index:1;filter:drop-shadow(0 0 3px #fff)}@keyframes luckySheen{0%,40%,100%{opacity:0;transform:translateX(-40%)}62%{opacity:1;transform:translateX(40%)}}
.tray.rare-reveal{position:relative;animation:rareTray 1.55s ease-out}.piece-slot.rare-arrival{z-index:2;background:radial-gradient(circle,#fff9db 12%,#ffe1f1 72%,#e1d9ff);border-color:#fff7bc;box-shadow:0 0 0 3px #ffd761,0 0 22px 7px #ffe178ab;animation:rareSlot 1.55s ease-out}.piece-slot.rare-arrival:after{content:"✦ ラッキー！";position:absolute;top:-14px;left:50%;white-space:nowrap;padding:3px 9px;border:2px solid #fff;border-radius:999px;background:linear-gradient(110deg,#ffce61,#ff79b7,#9c7aff);box-shadow:0 3px 0 #a77bc5;color:#fff;font-size:11px;font-weight:900;text-shadow:0 1px 2px #7d568a;pointer-events:none;animation:rareTag 1.55s ease-out both}@keyframes rareTray{35%{box-shadow:inset 0 1px 0 #fff,0 0 20px 5px #ffc967a8}}@keyframes rareSlot{0%{transform:scale(.55) rotate(-8deg);filter:brightness(1.6)}28%{transform:scale(1.15) rotate(5deg)}48%{transform:scale(.96) rotate(-2deg)}70%,100%{transform:scale(1) rotate(0)}}@keyframes rareTag{0%{opacity:0;transform:translate(-50%,10px) scale(.4)}24%,75%{opacity:1;transform:translate(-50%,-7px) scale(1)}100%{opacity:0;transform:translate(-50%,-20px) scale(1.08)}}
.board-wrap.lucky-spotlight:after{content:"";position:absolute;inset:-9px;z-index:4;border-radius:28px;padding:7px;pointer-events:none;background:conic-gradient(from 0deg,#ffdb57,#ff76c3,#a573ff,#72ddff,#fff7ac,#ffdb57);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;filter:drop-shadow(0 0 9px #ffcd5a);animation:luckyFrame .82s ease-out both}@keyframes luckyFrame{0%{opacity:0;transform:scale(.96) rotate(-2deg)}35%,75%{opacity:1;transform:scale(1.01) rotate(0)}100%{opacity:0;transform:scale(1.04)}}.lucky-wave-second{border-color:#ffbbed;box-shadow:0 0 0 4px #a476f4,0 0 20px 9px #ef8ffaaa;animation-delay:.13s}.lucky-spark{position:absolute;width:13px;height:13px;background:#fff6a8;clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);filter:drop-shadow(0 0 5px #fff);animation:luckySpark .72s ease-out var(--spark-delay) both}@keyframes luckySpark{0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(-30deg)}24%{opacity:1;transform:translate(-50%,-50%) scale(1.3) rotate(0)}100%{opacity:0;transform:translate(calc(-50% + var(--sx)),calc(-50% + var(--sy))) scale(.35) rotate(100deg)}}.lucky-word{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 11px;background:linear-gradient(120deg,#ffbf48,#f16eb6 47%,#8866dc);box-shadow:0 4px 0 #8a4c9c,0 0 17px 4px #ffe489;border-color:#fff9d7}.lucky-word small{font-size:10px;line-height:1.1;letter-spacing:.01em;white-space:nowrap}.cell.lucky-target:not(.clearing){background:color-mix(in srgb,var(--c) 65%,#fff4ab);outline:3px solid #fff8bb;box-shadow:0 0 0 2px #ffc84e,0 0 17px 5px #ffdc73c9}
body.calm{--blue:#68a9cf;--pink:#d7798e;--yellow:#dfbb5d;--purple:#8d80c8;--mint:#71b9a7;--cream:#fbf7eb}.calm .cell.filled,.calm .block{filter:saturate(.65)}
@media(max-height:880px){.app{padding-top:max(5px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}.topbar{height:53px;flex:none}.power-orb{width:50px;height:50px}.power-orb:before{inset:4px}.orb-core{font-size:19px;line-height:21px}.score-row{margin:3px 0;flex:none}.score-main strong{font-size:30px}.mission{padding:3px 12px;margin-bottom:6px;flex:none}.board-wrap{width:min(100%,390px,calc(100dvh - 388px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));margin-bottom:20px}.guide{margin:0 0 8px;padding:3px 12px;flex:none}.tray{height:80px;margin-bottom:10px;padding:3px 6px;flex:none}.piece-slot{height:72px}.actions{padding-top:2px;flex:none}.action-btn{min-height:49px;padding:4px 2px}}
@media(min-width:700px){.app{padding-left:25px;padding-right:25px}.board{gap:7px}.block{border-radius:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
