@font-face{font-family:Pretendard Variable;font-style:normal;font-weight:45 920;font-display:swap;src:url(/fonts/PretendardVariable.woff2) format("woff2")}:root{font-family:Pretendard Variable,Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,sans-serif;color:#edf7ff;background:#08182b;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #f2f8ff;--cyan: #24cde8;--emerald: #20c563;--amber: #ffbd18;--coral: #fa4f58;--violet: #a64bea;--champagne: #ffdd68;--zaritalk-primary: #2c7fff;--game-background: #08182b}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden}body{margin:0;min-width:320px;font-weight:500;overscroll-behavior:none;background:var(--game-background)}button{font:inherit}button:focus-visible{outline:2px solid rgba(72,207,238,.92);outline-offset:3px}.app-shell{width:100%;height:100vh;height:100svh;display:grid;place-items:center;padding:20px;overflow:hidden}.game-card{width:min(100%,480px);height:min(920px,calc(100vh - 40px));height:min(920px,calc(100svh - 40px));min-height:0;padding:26px 28px calc(22px + env(safe-area-inset-bottom));overflow:hidden;position:relative;border:1px solid rgba(113,188,239,.25);border-radius:34px;background:var(--game-background);box-shadow:0 34px 100px #00040e8f,inset 0 1px #b2e0ff21,0 0 0 1px #040c1957}.topbar,.brand,.score-row,.result-stats{display:flex;align-items:center}.topbar{justify-content:space-between}.brand{gap:10px}.topbar-actions{display:flex;align-items:center;gap:8px}.sound-button,.restart-button{width:40px;height:40px;display:grid;place-items:center;padding:0;border:0;border-radius:14px;background:#0b2237;box-shadow:0 7px 18px #00050f33;color:#7aa2be;cursor:pointer;transition:background-color .14s ease,color .14s ease,transform .14s ease}.sound-button svg,.restart-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sound-button{color:#70c8e8}.sound-button.is-muted{color:#58768d}.sound-button:hover,.restart-button:hover{background:#102e47;color:#a9d6ed}.sound-button:active,.restart-button:active{transform:scale(.94)}.brand-mark{width:44px;height:44px;display:block;flex:0 0 auto;border-radius:15px;box-shadow:0 10px 24px #00081875,0 0 0 1px #6cc5f533,0 0 18px #47a0dc1f;filter:saturate(1.12) brightness(1.05);transform:rotate(-2deg)}.brand-title{margin:0;line-height:0}.brand-wordmark{width:114px;height:auto;display:block;filter:drop-shadow(0 5px 10px rgba(0,32,91,.28))}.score-row{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px;min-height:82px;padding:0;overflow:visible}.score-panel{min-width:0;display:grid;grid-template-rows:48px auto;gap:4px;padding:9px 10px 7px;border-radius:16px;background:#0b2237;box-shadow:0 8px 20px #00050f38;text-align:center}.score-counter{min-width:0;height:48px;display:flex;align-items:center;justify-content:center;gap:7px;padding:0 8px;position:relative;overflow:hidden;border:0;border-radius:10px;background:transparent}.score-counter strong{min-width:0;max-width:100%;overflow:hidden;white-space:nowrap;color:#eef8ff;font-size:clamp(19px,5.8vw,27px);line-height:1;font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.035em;text-overflow:ellipsis;text-shadow:0 2px 12px rgba(63,178,229,.2)}.score-label{color:#6f8ba4;font-size:8px;line-height:1;font-weight:850;letter-spacing:.15em}.score-trophy{width:21px;height:21px;flex:0 0 auto;fill:none;stroke:#ffda70;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 5px rgba(255,190,56,.28))}.score-panel--best .score-label{color:#a88d58}.score-panel--total .score-counter strong{color:#f8fdff;text-shadow:0 2px 14px rgba(73,207,243,.3)}.score-panel--total .score-label{color:#63a9c7}.score-panel--total .score-counter strong.is-punching{animation:score-punch .36s cubic-bezier(.16,.88,.32,1.28)}.score-gain{position:absolute;z-index:4;right:18%;top:10px;padding:4px 7px;border:1px solid rgba(176,232,255,.35);border-radius:999px;background:#0a2339db;box-shadow:0 5px 14px #0007143d,inset 0 1px #ffffff1f;color:#8ce9ff;font-size:11px;line-height:1;font-weight:900;font-variant-numeric:tabular-nums;pointer-events:none;animation:score-gain .68s cubic-bezier(.18,.72,.2,1) both}.score-gain--clear,.score-gain--combo{border-color:#ffdc8f80;background:#4e2f1fe6;color:#ffe29a}.score-row.is-combo .score-panel--total{box-shadow:inset 0 1px #ffefcf2e,0 12px 30px #dc525c2e,0 0 22px #ffa0481a}.board-wrap{width:min(100%,calc(100vh - 410px));width:min(100%,calc(100svh - 410px));position:relative;margin:17px auto 0}.board-wrap.is-clear .board{animation:board-clear-hit .28s cubic-bezier(.18,.82,.28,1);will-change:transform}.board-wrap.is-combo .board{animation:board-combo-hit .33s cubic-bezier(.16,.84,.24,1);will-change:transform}.impact-wave{position:absolute;z-index:4;top:13%;right:13%;bottom:13%;left:13%;border:3px solid rgba(255,226,154,.86);border-radius:28%;box-shadow:0 0 14px #ffc05a3d;pointer-events:none;animation:impact-wave .38s cubic-bezier(.16,.76,.28,1) both;will-change:transform,opacity}.impact-wave--combo{border-width:4px;border-color:#ffb56cf2;box-shadow:0 0 20px #ff64694d}.board{width:100%;aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:9px;border:2px solid rgba(88,187,244,.66);border-radius:22px;background:linear-gradient(145deg,#0c2b4bfa,#05152afc);box-shadow:inset 0 1px #b4e2ff4f,inset 0 -8px 22px #010c1f8a,0 16px 34px #0005126b,0 0 0 4px #43abe81a,0 0 28px #3892cd14;transition:border-color .16s ease,box-shadow .16s ease}.board.is-preview-valid{border-color:#5ee2deeb;box-shadow:inset 0 1px #b4fffa47,inset 0 -8px 22px #01122b61,0 0 0 4px #49dacd1f,0 15px 34px #1f71913d}.board-cell{min-width:0;padding:0;position:relative;border:1px solid rgba(95,142,185,.055);border-radius:3px;background-image:none;box-shadow:inset 0 1px #acd7f506;cursor:pointer;transition:transform .12s ease,background-color .12s ease,box-shadow .12s ease}.board-cell--shade-a{background-color:#10233e}.board-cell--shade-b{background-color:#0c1d35}.board-cell>span{position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;overflow:hidden;border-radius:inherit;background-color:var(--tile-fallback);background-image:linear-gradient(to bottom,rgba(255,255,255,.48) 0,rgba(255,255,255,.28) 8%,transparent 10%),linear-gradient(to right,rgba(255,255,255,.24) 0,rgba(255,255,255,.13) 8%,transparent 10%),linear-gradient(to top,rgba(0,0,0,.3) 0,rgba(0,0,0,.2) 9%,transparent 11%),linear-gradient(to left,rgba(0,0,0,.2) 0,rgba(0,0,0,.11) 8%,transparent 10%),linear-gradient(180deg,rgba(255,255,255,.08),transparent 45%,rgba(0,0,0,.08));background-position:center;background-repeat:no-repeat;background-size:100% 100%;background-blend-mode:normal;box-shadow:0 2px 2px #000e274d}.board-cell--coral,.piece-cell--coral{--tile-fallback: #fa4f58;--tile-image: url(/assets/tiles-v4/tile-coral.webp)}.board-cell--gold,.piece-cell--gold{--tile-fallback: #ffbd18;--tile-image: url(/assets/tiles-v4/tile-amber.webp)}.board-cell--mint,.piece-cell--mint{--tile-fallback: #20c563;--tile-image: url(/assets/tiles-v4/tile-emerald.webp)}.board-cell--sky,.piece-cell--sky{--tile-fallback: #24cde8;--tile-image: url(/assets/tiles-v4/tile-cyan.webp)}.board-cell--violet,.piece-cell--violet{--tile-fallback: #a64bea;--tile-image: url(/assets/tiles-v4/tile-violet.webp)}:root.tile-asset-coral-ready .board-cell--coral>span,:root.tile-asset-coral-ready .piece-cell--coral,:root.tile-asset-gold-ready .board-cell--gold>span,:root.tile-asset-gold-ready .piece-cell--gold,:root.tile-asset-mint-ready .board-cell--mint>span,:root.tile-asset-mint-ready .piece-cell--mint,:root.tile-asset-sky-ready .board-cell--sky>span,:root.tile-asset-sky-ready .piece-cell--sky,:root.tile-asset-violet-ready .board-cell--violet>span,:root.tile-asset-violet-ready .piece-cell--violet{background-image:radial-gradient(ellipse 18% 20% at 12% 12%,rgba(0,0,0,.13),transparent 72%),radial-gradient(ellipse 18% 20% at 88% 12%,rgba(0,0,0,.12),transparent 72%),var(--tile-image);background-position:center,center,center;background-repeat:no-repeat;background-size:100% 100%,100% 100%,111%;background-blend-mode:multiply,multiply,normal}.board-cell--preview-valid{background-color:#1b5f65;box-shadow:inset 0 0 0 2px #84f5e1ad,0 0 9px #36cac53d;animation:preview-breathe .62s ease-in-out infinite alternate}.board-cell--preview-invalid{background-color:#653043;box-shadow:inset 0 0 0 2px #ff9fac75;transform:scale(.9)}.board-cell--drop{z-index:2}.board-cell--drop>span{animation:block-drop .15s cubic-bezier(.2,.78,.28,1);will-change:transform}.board-cell--drop:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;z-index:3;border-radius:8px;background:radial-gradient(circle,rgba(255,255,255,.28) 0 24%,transparent 68%);box-shadow:0 0 13px var(--tile-fallback);pointer-events:none;animation:drop-pulse .21s ease-out both}.board-cell--burst{z-index:3;animation:clear-cell-pop .3s cubic-bezier(.18,.78,.24,1) both;animation-delay:calc(var(--burst-step) * 6ms);will-change:transform,opacity}.board-cell--burst:after{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;z-index:2;border:2px solid var(--champagne);border-radius:9px;box-shadow:0 0 9px #ffd05e6b;animation:burst .33s ease-out both;animation-delay:calc(var(--burst-step) * 6ms);will-change:transform,opacity}.celebration{position:absolute;left:50%;top:38%;z-index:5;white-space:nowrap;pointer-events:none;transform-origin:center;animation:celebration-flight 1.05s cubic-bezier(.16,.8,.22,1) both}.celebration:before{position:absolute;z-index:-1;width:164px;height:2px;left:50%;top:56%;background:linear-gradient(90deg,transparent,rgba(130,229,255,.8),transparent);box-shadow:0 0 15px #52cdf16b;content:"";transform:translate(-50%,-50%);animation:celebration-streak .6s ease-out both}.celebration span{display:block;background:linear-gradient(180deg,#fff 4%,#e5faff 40%,#71dcf5);background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 rgba(19,71,111,.72)) drop-shadow(0 0 12px rgba(90,218,248,.72));font-size:clamp(30px,8.5vw,39px);line-height:1;font-weight:920;letter-spacing:-.035em;-webkit-background-clip:text;-webkit-text-stroke:1px rgba(221,250,255,.42);animation:celebration-type .54s cubic-bezier(.12,.88,.24,1.24) both}.celebration--combo:before{background:linear-gradient(90deg,transparent,rgba(255,210,104,.92),transparent);box-shadow:0 0 18px #ff854d80}.celebration--combo span{background:linear-gradient(180deg,#fffcec 2%,#ffe48d 42%,#ff7b68);background-clip:text;filter:drop-shadow(0 3px 0 rgba(118,41,58,.7)) drop-shadow(0 0 15px rgba(255,136,79,.8));-webkit-background-clip:text;-webkit-text-stroke-color:rgba(255,241,194,.55)}.instruction{margin:18px 0 14px;text-align:center;color:#70879e;font-size:10px;font-weight:600}.instruction.is-blocked{color:#e6bc6a;animation:blocked-hint .36s ease-out both}.tray{height:116px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0;position:relative}.tray-slot{min-width:0;display:grid;place-items:center;position:relative;overflow:hidden;border:0;border-radius:16px;background:#0b2237;box-shadow:0 8px 20px #00050f38;transition:background .16s ease,box-shadow .16s ease,transform .16s ease}.tray-slot:before{content:"";width:58%;height:11px;position:absolute;left:21%;bottom:14px;border-radius:50%;background:#00051057;filter:blur(4px);transition:opacity .16s ease,transform .16s ease}.tray-slot:has(.piece-button:not(:disabled):hover),.tray-slot:has(.piece-button.is-selected){background:#102e47;box-shadow:0 11px 24px #00050f47;transform:translateY(-2px)}.tray-slot.is-picking{background:#081c2f;box-shadow:0 4px 12px #00050f2e;transform:translateY(2px) scale(.97)}.tray-slot.is-picking:before{opacity:.32;transform:scale(1.2)}.tray-slot.is-empty{opacity:.62}.tray-slot.is-empty:before{opacity:.35}.tray-slot.is-unavailable{background:#081c2f;box-shadow:0 4px 12px #00050f29}.tray-slot.is-unavailable:before{opacity:.16}.tray-slot.is-unavailable .piece-shape{opacity:.28;transform:scale(.92)}.piece-button{width:100%;height:100%;display:grid;place-items:center;padding:6px;position:relative;z-index:1;border:0;border-radius:18px;background:transparent;cursor:grab;touch-action:none;transition:.15s ease}.piece-button:not(:disabled):hover{background:#45a0d71c}.piece-button.is-selected{background:#378bbe29;box-shadow:0 8px 18px #00081738;transform:translateY(-4px)}.piece-button.is-dragging{opacity:.08;transform:translateY(7px) scale(.84)}.piece-button:not(:disabled):active{cursor:grabbing;transform:scale(.95)}.piece-button:disabled{cursor:not-allowed}.piece-shape{--block-size: 24px;display:grid;grid-template-columns:repeat(var(--piece-width),var(--block-size));grid-template-rows:repeat(var(--piece-height),var(--block-size));gap:3px}.piece-button .piece-shape{--block-size: var(--tray-block-size, 24px)}.piece-cell{width:var(--block-size);height:var(--block-size);overflow:hidden;position:relative;border:0;border-radius:clamp(2px,calc(var(--block-size) * .14),5px);background-color:var(--tile-fallback);background-image:linear-gradient(to bottom,rgba(255,255,255,.48) 0,rgba(255,255,255,.28) 8%,transparent 10%),linear-gradient(to right,rgba(255,255,255,.24) 0,rgba(255,255,255,.13) 8%,transparent 10%),linear-gradient(to top,rgba(0,0,0,.3) 0,rgba(0,0,0,.2) 9%,transparent 11%),linear-gradient(to left,rgba(0,0,0,.2) 0,rgba(0,0,0,.11) 8%,transparent 10%),linear-gradient(180deg,rgba(255,255,255,.08),transparent 45%,rgba(0,0,0,.08));background-position:center;background-repeat:no-repeat;background-size:100% 100%;background-blend-mode:normal;box-shadow:0 3px 3px #0f2f4c47}.piece-cell--empty{visibility:hidden}.drag-ghost{position:fixed;left:0;top:0;z-index:20;pointer-events:none;opacity:.96;filter:drop-shadow(0 12px 10px rgba(34,82,128,.2));backface-visibility:hidden;transform-origin:center;will-change:transform;animation:ghost-pickup .12s ease-out;transition:opacity 70ms linear,filter 70ms linear}.drag-ghost .piece-shape{--block-size: var(--ghost-cell-size, 34px);gap:var(--ghost-cell-gap, 4px);transform:translate(-50%,-50%) scale(1.08) rotate(var(--ghost-tilt, 0deg));transform-origin:center;transition:transform 45ms linear}.drag-ghost.is-over-board .piece-shape{transform:translate(-50%,-50%) scale(1.02) rotate(var(--ghost-tilt, 0deg))}.drag-ghost.is-over-board:not(.is-valid){opacity:.44;filter:grayscale(.32)}.drag-ghost.is-valid{opacity:1;filter:drop-shadow(0 7px 8px rgba(44,131,174,.18))}.drag-ghost.is-valid .piece-shape{transform:translate(-50%,-50%) scale(.99) rotate(var(--ghost-tilt, 0deg))}.restart-confirm-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;padding:24px;background:#000713c7;animation:fade-in .14s ease-out}.restart-confirm{width:100%;max-width:324px;padding:25px 22px 20px;border:1px solid rgba(129,179,215,.18);border-radius:22px;background:#0d263e;box-shadow:0 24px 60px #00040f8a,inset 0 1px #bee3f914;text-align:center;animation:modal-in .23s cubic-bezier(.2,.8,.2,1.08)}.restart-confirm h2{margin:0;color:#eef7ff;font-size:21px;line-height:1.25;font-weight:850}.restart-confirm p{margin:9px 0 22px;color:#83a0b7;font-size:13px;line-height:1.45}.restart-confirm-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.restart-confirm-actions button{height:48px;border:0;border-radius:14px;background:#17334b;color:#aec6d8;font-size:14px;font-weight:800;cursor:pointer;transition:filter .12s ease,transform .12s ease}.restart-confirm-actions button:last-child{background:var(--zaritalk-primary);color:#fff}.restart-confirm-actions button:hover{filter:brightness(1.06)}.restart-confirm-actions button:active{transform:scale(.975)}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;padding:24px;background:#000713cc;backdrop-filter:blur(12px) saturate(.82);-webkit-backdrop-filter:blur(12px) saturate(.82);animation:fade-in .18s ease-out}.result-modal{width:100%;max-width:356px;padding:28px 22px 22px;border:1px solid rgba(129,179,215,.2);border-radius:27px;background:radial-gradient(circle at 50% -18%,rgba(55,136,201,.18),transparent 42%),linear-gradient(165deg,#11263ffa,#061324fc);text-align:center;box-shadow:0 28px 72px #00040f9e,inset 0 1px #bee3f91a;animation:modal-in .35s cubic-bezier(.2,.8,.2,1.12)}.result-header h2{margin:0;color:#eef7ff;font-size:30px;line-height:1;font-weight:900;letter-spacing:.025em;text-shadow:0 4px 20px rgba(75,178,237,.18)}.result-score{margin:23px 0 19px;padding:17px 16px 15px;border:1px solid rgba(105,164,205,.14);border-radius:19px;background:#030e1c61;box-shadow:inset 0 1px #b2dcf50f,inset 0 -8px 20px #0007122e}.result-score>span{display:block;margin-bottom:5px;color:#6f8ba4;font-size:8px;line-height:1;font-weight:850;letter-spacing:.18em}.result-score>div{display:flex;align-items:baseline;justify-content:center;gap:7px}.result-score strong{color:#f4f9ff;font-size:50px;line-height:1;font-weight:880;font-variant-numeric:tabular-nums;letter-spacing:-.06em}.result-score small{color:#5f7b94;font-size:9px;font-weight:850;letter-spacing:.08em}.result-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:20px}.result-stats>div{padding:11px 8px 10px;border:1px solid rgba(110,169,207,.12);border-radius:14px;background:#132b438f}.result-stats span{display:block;margin-bottom:4px;color:#69839c;font-size:8px;line-height:1;font-weight:800;letter-spacing:.1em}.result-stats b{display:block;color:#dcecff;font-size:18px;line-height:1;font-variant-numeric:tabular-nums}.result-modal>button{width:100%;height:54px;border:0;border-radius:16px;background-color:var(--zaritalk-primary);box-shadow:0 10px 24px #2c7fff47,inset 0 1px #fff3;color:#fff;font-size:15px;font-weight:800;cursor:pointer;transition:filter .14s ease,transform .14s ease,box-shadow .14s ease}.result-modal>button:hover{filter:brightness(1.06);box-shadow:0 12px 27px #2c7fff57,inset 0 1px #ffffff38}.result-modal>button:active{filter:brightness(.96);transform:scale(.985)}@keyframes block-drop{0%{transform:translateY(-3px) scale(.93)}48%{transform:translateY(1px) scale(1.045)}76%{transform:translateY(0) scale(.99)}to{transform:translateY(0) scale(1)}}@keyframes drop-pulse{0%{transform:scale(.72);opacity:0}32%{opacity:.38}to{transform:scale(1.2);opacity:0}}@keyframes preview-breathe{0%{transform:scale(.86);box-shadow:inset 0 0 0 1px #ffffff6b,0 0 #4fcad700}to{transform:scale(.94);box-shadow:inset 0 0 0 1px #ffffffb3,0 0 10px #4fcad73d}}@keyframes ghost-pickup{0%{opacity:0;filter:blur(3px) drop-shadow(0 4px 4px rgba(34,82,128,.1))}}@keyframes burst{0%{transform:scale(.68);opacity:1}to{transform:scale(1.62);opacity:0}}@keyframes clear-cell-pop{0%{transform:scale(1.06);opacity:1}46%{transform:scale(.78);opacity:.38}to{transform:scale(1);opacity:1}}@keyframes score-punch{0%{transform:translateY(2px) scale(.9);filter:brightness(1)}42%{transform:translateY(-2px) scale(1.14);filter:brightness(1.38);text-shadow:0 0 18px rgba(109,224,255,.58)}72%{transform:scale(.97)}to{transform:scale(1)}}@keyframes score-gain{0%{transform:translate(-6px,8px) scale(.72);opacity:0}22%{transform:translate(0) scale(1.08);opacity:1}68%{opacity:1}to{transform:translate(7px,-24px) scale(.92);opacity:0}}@keyframes board-clear-hit{0%{transform:scale(1)}34%{transform:scale(.988)}68%{transform:scale(1.004)}to{transform:scale(1)}}@keyframes board-combo-hit{0%{transform:scale(1)}30%{transform:scale(.982)}62%{transform:scale(1.006)}to{transform:scale(1)}}@keyframes impact-wave{0%{transform:scale(.65);opacity:0}20%{opacity:.95}to{transform:scale(1.42);opacity:0}}@keyframes fade-in{0%{opacity:0}}@keyframes modal-in{0%{transform:translateY(22px) scale(.94);opacity:0}}@keyframes celebration-flight{0%{transform:translate(-50%,13px);opacity:0}15%,68%{transform:translate(-50%);opacity:1}to{transform:translate(-50%,-20px);opacity:0}}@keyframes celebration-type{0%{transform:scale(.58) skew(-10deg);filter:blur(5px) brightness(1.7)}46%{transform:scale(1.16) skew(-4deg);filter:blur(0) brightness(1.32) drop-shadow(0 0 18px rgba(101,224,250,.9))}72%{transform:scale(.96) skew(-4deg)}to{transform:scale(1) skew(-4deg)}}@keyframes celebration-streak{0%{transform:translate(-50%,-50%) scaleX(.08);opacity:0}34%{transform:translate(-50%,-50%) scaleX(1);opacity:1}to{transform:translate(-50%,-50%) scaleX(1.42);opacity:0}}@keyframes blocked-hint{0%{opacity:.4;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@media(min-width:900px)and (min-height:840px){.game-card{--desktop-playfield-size: min(100%, calc(100vh - 410px) );--desktop-playfield-size: min(100%, calc(100svh - 410px) );width:min(100%,clamp(510px,calc(100vh - 330px),570px));width:min(100%,clamp(510px,calc(100svh - 330px),570px));border-radius:30px;box-shadow:0 28px 80px #00040e7a,inset 0 1px #b2e0ff21,0 0 0 1px #040c1957}.topbar,.score-row,.board-wrap,.instruction,.tray{width:var(--desktop-playfield-size);margin-right:auto;margin-left:auto}.score-counter strong{font-size:29px}.score-label{font-size:9px}.instruction{margin-top:16px;margin-bottom:12px;font-size:12px;line-height:1.4}}@media(max-width:520px){.app-shell{display:block;padding:0}.game-card{height:100vh;height:100svh;padding:calc(18px + env(safe-area-inset-top)) 18px calc(16px + env(safe-area-inset-bottom));border:0;border-radius:0;box-shadow:none}.score-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.score-panel{padding-right:8px;padding-left:8px}.score-counter{gap:5px;padding-right:5px;padding-left:5px}.score-trophy{width:18px;height:18px}.board{gap:2px;padding:8px;border-radius:19px}.board-cell{border-radius:3px}.tray{height:101px;gap:10px}}@media(max-height:760px){.game-card{padding-top:14px}.score-row{min-height:70px;margin-top:13px}.score-panel{grid-template-rows:42px auto;gap:3px;padding:6px 7px 5px}.score-counter{height:42px}.board-wrap{width:min(100%,calc(100vh - 332px));width:min(100%,calc(100svh - 332px));margin-top:12px}.tray{height:86px}.piece-shape{--block-size: 20px}.piece-button .piece-shape{--block-size: calc(var(--tray-block-size, 20px) * .82)}.instruction{margin:13px 0 10px}}@media(pointer:coarse){.piece-button,.tray-slot{transition-duration:70ms}.drag-ghost{filter:none;animation-duration:90ms;transition:none}.drag-ghost .piece-shape{transition:none}.drag-ghost .piece-cell{filter:none;box-shadow:none}.drag-ghost.is-over-board:not(.is-valid),.drag-ghost.is-valid{filter:none}.board-cell--preview-valid{animation:none;box-shadow:inset 0 0 0 2px #84f5e19e,0 0 6px #36cac529}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;transition-duration:1ms!important}}