*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #12100d;--panel: #26211b;--panel-2: #1d1914;--slot: #161310;--text: #f3ede2;--muted: #9b917f;--amber: #f6bc40;--amber-d: #a8780c;--gap: 4px;--bc: min( calc((min(500px, 100vw - 16px) - 52px)/8) , 50px);--tray-cell: clamp(13px, calc(var(--bc) * .42), 20px)}html,body{height:100%}html{background:#12100d radial-gradient(1100px 720px at 50% 16%,#221a11,#12100d 70%) no-repeat fixed}body{background:transparent;color:var(--text);font-family:Outfit,sans-serif;overflow-x:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none}body.dragging,body.dragging *{cursor:grabbing!important}body:before{content:"";position:fixed;left:0;right:0;bottom:0;height:min(42vh,420px);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1440' height='420' viewBox='0 0 1440 420' preserveAspectRatio='xMidYMax slice'%3E%3Cpath fill='%23262018' opacity='.5' d='M0 420V250l150-95 120 70 170-115 150 95 160-80 190 105 150-70 350 95V420z'/%3E%3Cpath fill='%231b1510' opacity='.85' d='M0 420V300l180-85 160 75 190-105 180 90 200-85 210 100 320-60V420z'/%3E%3Cpath fill='%23120e09' d='M0 420v-90l220-60 200 55 220-70 240 65 220-45 340 55V420z'/%3E%3C/svg%3E") bottom center / cover no-repeat;pointer-events:none;z-index:-1}button{font-family:inherit}:focus-visible{outline:2px solid #c9a85c;outline-offset:2px}#root{display:flex;justify-content:center}.game{width:calc(var(--bc) * 8 + var(--gap) * 7 + 24px);display:flex;flex-direction:column;padding:0 0 calc(16px + env(safe-area-inset-bottom));touch-action:none}.title{--cell: calc((var(--bc) * 8 + var(--gap) * 7 - 3px) / 9.45);display:flex;justify-content:center;align-items:center;gap:3px;margin-bottom:12px}.title-tile{display:inline-flex;align-items:center;justify-content:center;width:var(--cell);height:var(--cell);font-family:Titan One;font-size:calc(var(--cell) * .58);color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.28);animation:titleIn .55s cubic-bezier(.34,1.56,.64,1) both}.title-gap{width:calc(var(--cell) * .45)}.title-tile:nth-child(2n){scale:.92}.title-tile:nth-child(3n){scale:1.06}.title-tile:nth-child(5n){rotate:1.8deg}.title-tile:nth-child(7n){rotate:-1.8deg;scale:.96}.title-tile:nth-child(3n){background:var(--tex-granite),var(--c)}.title-tile:nth-child(4n){background:var(--tex-strata),var(--c)}.title-tile:nth-child(5n){background:var(--tex-pitted),var(--c)}@keyframes titleIn{0%{opacity:0;transform:translateY(-36px) rotate(var(--rot)) scale(.3)}to{opacity:1;transform:translateY(0) rotate(var(--rot)) scale(1)}}.hud{display:flex;align-items:center;justify-content:center;margin:10px 0 0}.hud-btns{display:flex;gap:8px}.icon-btn{width:38px;height:38px;border:none;border-radius:12px;background:var(--panel);color:#a89a86;display:grid;place-items:center;cursor:pointer;box-shadow:inset 0 0 0 1px #ffffff0d,0 3px 8px #0000004d;transition:transform .08s,color .15s}.icon-btn:hover{color:#e8dfd0}.icon-btn:active{transform:scale(.9)}.icon-btn svg{width:18px;height:18px;display:block}.score-pop{display:inline-block;animation:scorePop .16s ease-out}.score-num{display:block;text-align:center;font-family:Titan One;font-size:clamp(30px,3.5vw,40px);line-height:1;color:#fff;letter-spacing:1px;text-shadow:0 3px 0 rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.4)}@keyframes scorePop{0%{transform:scale(1.18)}}.board{position:relative;background:radial-gradient(circle at 80% 18%,rgba(255,255,255,.05) 0 3%,transparent 4%),radial-gradient(circle at 18% 74%,rgba(0,0,0,.2) 0 4%,transparent 5%),radial-gradient(circle at 64% 88%,rgba(255,255,255,.04) 0 2.5%,transparent 3.5%),linear-gradient(180deg,#ffffff09,#00000024),var(--panel);border-radius:34px 24px 38px 26px/26px 36px 24px 38px;padding:12px;box-shadow:0 16px 36px #00000073,inset 0 1px #ffffff0f,inset 0 0 0 1px #ffffff09}.board-grid{--cell: var(--bc);display:grid;grid-template-columns:repeat(8,var(--bc));grid-auto-rows:var(--bc);gap:var(--gap);transition:filter .5s}.board-over .board-grid{filter:saturate(.25) brightness(.5)}.cell{position:relative;background:radial-gradient(circle at 62% 34%,rgba(0,0,0,.32) 0 7%,transparent 8%),radial-gradient(circle at 28% 72%,rgba(0,0,0,.26) 0 5%,transparent 6%),var(--slot);border-radius:26%;box-shadow:inset 0 3px 6px #0000008c,inset 2px 0 4px #00000047,inset -2px -1px 3px #0000003d,inset 0 -1px #ffffff09}.cell>.block,.cell>.ghost{position:absolute;top:0;right:0;bottom:0;left:0;rotate:var(--tilt, 0deg)}.cell.v0{border-radius:30% 24% 28% 22%/24% 30% 22% 28%}.cell.v1{border-radius:24% 30% 22%/30% 22% 30% 24%}.cell.v2{border-radius:28% 22% 30% 26%/22% 28% 24% 30%}.cell.v3{border-radius:26% 30% 24% 28%/28% 24% 30% 22%}.cell.v4{border-radius:22% 28% 26% 30%/26% 26% 28% 24%}.block.rv0{border-radius:44% 32% 40% 30%/36% 42% 30% 40%;scale:.97}.block.rv1{border-radius:32% 44% 30% 42%/40% 30% 44% 32%;scale:1;background:var(--tex-granite),var(--c)}.block.rv2{border-radius:40% 30% 44% 32%/32% 40% 44% 30%;scale:.98;background:var(--tex-strata),var(--c)}.block.rv3{border-radius:30% 40% 32% 44%/44% 32% 30% 40%;scale:.96;background:var(--tex-pitted),var(--c)}.block.rv4{border-radius:36% 42% 30% 38%/38% 30% 42% 34%;scale:.99;background:var(--tex-veined),var(--c)}.ghost.rv0{border-radius:44% 32% 40% 30%/36% 42% 30% 40%;scale:.97}.ghost.rv1{border-radius:32% 44% 30% 42%/40% 30% 44% 32%;scale:1}.ghost.rv2{border-radius:40% 30% 44% 32%/32% 40% 44% 30%;scale:.98}.ghost.rv3{border-radius:30% 40% 32% 44%/44% 32% 30% 40%;scale:.96}.ghost.rv4{border-radius:36% 42% 30% 38%/38% 30% 42% 34%;scale:.99}:root{--tex-granite: radial-gradient(circle at 22% 30%, rgba(255,255,255,.14) 0 3.5%, transparent 4.5%), radial-gradient(circle at 68% 62%, rgba(0,0,0,.16) 0 5%, transparent 6%), radial-gradient(circle at 44% 78%, rgba(255,255,255,.08) 0 3%, transparent 4%), radial-gradient(circle at 78% 24%, rgba(0,0,0,.12) 0 3.5%, transparent 4.5%), radial-gradient(120% 90% at 30% 20%, rgba(255,255,255,.12), transparent 55%);--tex-strata: repeating-linear-gradient(105deg, rgba(0,0,0,.08) 0 12%, transparent 12% 26%, rgba(255,255,255,.06) 26% 34%, transparent 34% 48%), radial-gradient(90% 80% at 70% 85%, rgba(0,0,0,.18), transparent 60%), radial-gradient(120% 90% at 30% 20%, rgba(255,255,255,.12), transparent 55%);--tex-pitted: radial-gradient(circle at 30% 34%, rgba(0,0,0,.28) 0 4.5%, transparent 5.5%), radial-gradient(circle at 66% 26%, rgba(0,0,0,.22) 0 3%, transparent 4%), radial-gradient(circle at 54% 70%, rgba(0,0,0,.24) 0 3.5%, transparent 4.5%), radial-gradient(circle at 80% 58%, rgba(0,0,0,.18) 0 2.5%, transparent 3.5%), radial-gradient(120% 90% at 30% 20%, rgba(255,255,255,.1), transparent 55%);--tex-veined: linear-gradient(64deg, transparent 46%, rgba(255,255,255,.16) 49% 51.5%, rgba(0,0,0,.08) 52% 53%, transparent 56%), radial-gradient(circle at 70% 78%, rgba(0,0,0,.16) 0 5%, transparent 6%), radial-gradient(90% 80% at 70% 85%, rgba(0,0,0,.16), transparent 60%), radial-gradient(120% 90% at 30% 20%, rgba(255,255,255,.13), transparent 55%)}.block{position:relative;border-radius:38% 30% 42% 32%/34% 40% 30% 38%;background:linear-gradient(115deg,transparent 40%,rgba(0,0,0,.1) 45% 53%,transparent 58%),radial-gradient(120% 90% at 30% 20%,rgba(255,255,255,.15),transparent 55%),radial-gradient(90% 80% at 70% 85%,rgba(0,0,0,.2),transparent 60%),radial-gradient(circle at 64% 40%,rgba(0,0,0,.12) 0 5%,transparent 6%),radial-gradient(circle at 26% 66%,rgba(255,255,255,.09) 0 4%,transparent 5%),var(--c);box-shadow:inset 0 calc(var(--cell) * .11) 0 0 var(--cl),inset 0 calc(var(--cell) * -.13) 0 0 var(--cd),inset calc(var(--cell) * .06) 0 0 0 #ffffff21,inset calc(var(--cell) * -.06) 0 0 0 #00000026,0 calc(var(--cell) * .05) calc(var(--cell) * .1) #00000059}.block:before{content:"";position:absolute;left:16%;right:30%;top:10%;height:18%;border-radius:60% 40% 50% 50%;background:#ffffff24;transform:rotate(-6deg)}.block.pop{animation:blockPop .22s cubic-bezier(.34,1.56,.64,1)}@keyframes blockPop{0%{transform:scale(.55)}62%{transform:scale(1.14)}to{transform:scale(1)}}.block.clearing{animation:blockClear .3s cubic-bezier(.45,0,.7,.35) forwards;animation-delay:var(--d, 0ms)}@keyframes blockClear{0%{transform:scale(1);filter:brightness(1);opacity:1}35%{transform:scale(1.16);filter:brightness(2.4) saturate(.4);opacity:1}to{transform:scale(0);filter:brightness(3);opacity:0}}.ghost{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:38% 30% 42% 32%/34% 40% 30% 38%;background:var(--c);opacity:.5;box-shadow:inset 0 0 0 2px #fff6}.cell.will-clear:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:36% 30% 40% 32%/32% 38% 30% 36%;background:#ffffff52;box-shadow:inset 0 0 0 2px #ffffffa6;animation:willPulse .55s ease-in-out infinite alternate}@keyframes willPulse{0%{opacity:.35}to{opacity:.9}}.float-text{position:absolute;z-index:25;pointer-events:none;white-space:nowrap;font-family:Titan One;transform:translate(-50%,-50%);animation:floatUp .95s cubic-bezier(.2,.6,.3,1) forwards}.float-text.points{font-size:24px;color:var(--amber);text-shadow:0 3px 0 rgba(0,0,0,.45)}.float-text.small{font-size:15px;color:#ffffffd9;text-shadow:0 2px 0 rgba(0,0,0,.4)}@keyframes floatUp{0%{opacity:0;transform:translate(-50%,-30%) scale(.6)}14%{opacity:1;transform:translate(-50%,-55%) scale(1.05)}to{opacity:0;transform:translate(-50%,-180%) scale(1)}}.combo{position:absolute;left:50%;top:34%;z-index:26;text-align:center;pointer-events:none;transform:translate(-50%,-50%);animation:comboIn 1s cubic-bezier(.2,.6,.3,1) forwards}.combo .word{display:block;font-family:Titan One;font-size:clamp(30px,9vw,42px);letter-spacing:1px;text-shadow:0 4px 0 rgba(0,0,0,.45)}.combo .combo-sub{display:block;margin-top:2px;font-family:Titan One;font-size:clamp(15px,4.5vw,20px);color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.45)}@keyframes comboIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}30%{transform:translate(-50%,-50%) scale(1)}72%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-95%) scale(.92)}}.tray{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.tray-slot{height:calc(var(--tray-cell) * 5 + var(--gap) * 4 + 18px);background:var(--panel-2);border-radius:18px 24px 14px 26px/24px 14px 26px 18px;box-shadow:inset 0 2px 8px #0006,inset 0 0 0 1px #ffffff08;display:grid;place-items:center}.piece-wrap{--cell: var(--tray-cell);cursor:grab;padding:6px;animation:pieceIn .32s cubic-bezier(.34,1.56,.64,1) both}@media (hover: hover){.piece-wrap:hover{transform:scale(1.06)}}.piece-wrap.lifted{opacity:0;pointer-events:none}.piece-wrap.reject{animation:reject .3s ease-in-out}@keyframes pieceIn{0%{transform:scale(.2);opacity:0}}@keyframes reject{0%,to{transform:translate(0)}25%{transform:translate(-5px)}70%{transform:translate(5px)}}.piece-grid{display:grid;gap:var(--gap)}.piece-grid>.block:nth-child(2n){rotate:1.3deg}.piece-grid>.block:nth-child(3n){rotate:-1.7deg}.piece-grid>.block:nth-child(7n){rotate:.8deg}.drag-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;pointer-events:none}.drag-piece{position:absolute;left:0;top:0;will-change:transform}.drag-piece.returning{opacity:0}.drag-inner{animation:dragIn .12s ease-out}@keyframes dragIn{0%{transform:scale(.5)}}.hint{text-align:center;font-size:12.5px;color:var(--muted);margin-top:12px;letter-spacing:.2px;opacity:.9;transition:opacity .6s}.hint-off{opacity:0}.fx{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:95}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;padding:20px;background:#0a0805c7;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:grid;place-items:center;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}}.over-card{position:relative;width:min(330px,88vw);text-align:center;background:#241e17;border:1px solid #3a3226;border-radius:22px;padding:30px 26px 26px;box-shadow:0 30px 80px #0000008c,inset 0 1px #ffffff0f;animation:cardIn .4s cubic-bezier(.34,1.56,.64,1) both}@keyframes cardIn{0%{opacity:0;transform:translateY(34px) scale(.85)}}.over-card h2{font-family:Titan One;font-size:27px;letter-spacing:1px;text-shadow:0 3px 0 rgba(0,0,0,.4)}.over-label{margin-top:16px;font-size:11px;letter-spacing:3.5px;color:var(--muted);font-weight:700}.over-score{font-family:Titan One;font-size:52px;color:var(--amber);line-height:1.1;text-shadow:0 4px 0 rgba(0,0,0,.35)}.new-best{position:absolute;top:-13px;right:-9px;transform:rotate(7deg);font-family:Titan One;font-size:13px;letter-spacing:.5px;color:#4a3400;background:var(--amber);padding:6px 12px;border-radius:999px;box-shadow:0 4px 0 var(--amber-d);animation:badgeIn .45s cubic-bezier(.34,1.56,.64,1) .25s both}@keyframes badgeIn{0%{opacity:0;transform:rotate(7deg) scale(.3)}}.btn-again{margin-top:22px;width:100%;border:none;cursor:pointer;font-family:Titan One;font-size:17px;letter-spacing:1px;color:#4a3400;background:var(--amber);padding:14px 0 13px;border-radius:15px;box-shadow:0 5px 0 var(--amber-d),0 10px 22px #00000059;transition:transform .07s,box-shadow .07s}.btn-again:active{transform:translateY(4px);box-shadow:0 1px 0 var(--amber-d),0 4px 10px #0000004d}@media (max-height: 780px){.layout{justify-content:flex-start}.title{padding-top:10px;margin-bottom:8px}}.score-submit{display:flex;gap:8px;margin-top:14px}.score-submit input{flex:1;min-width:0;background:var(--slot);color:var(--text);border:1px solid #3a3226;border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14px}.score-submit input::placeholder{color:var(--muted)}.score-submit input:focus-visible{outline:2px solid #c9a85c;outline-offset:1px}.score-submit button{border:none;cursor:pointer;font-family:Titan One;font-size:13px;letter-spacing:.5px;color:#4a3400;background:var(--amber);border-radius:10px;padding:10px 14px;box-shadow:0 3px 0 var(--amber-d)}.score-submit button:disabled{opacity:.55;cursor:default}.score-submit button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 var(--amber-d)}.lb-note{margin-top:12px;font-family:Titan One;font-size:13px;letter-spacing:1px}.lb-rank{color:#ffd97a}.lb-note:not(.lb-rank){color:var(--muted);font-family:Outfit;font-weight:700;font-size:12px}.lb{margin-top:16px}.lb h3{font-family:Titan One;font-size:12px;letter-spacing:2.5px;color:var(--muted);text-align:center;margin-bottom:6px}.lb-row{display:flex;align-items:center;gap:8px;text-align:left;font-size:13px;padding:3px 8px;border-radius:6px;color:#cfc6b8}.lb-row .n{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-row .pts{flex:none}.lb-empty{text-align:center;font-size:12px;color:var(--muted);padding:4px 0 2px}.layout{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:100vh;min-height:100dvh}.game-mid{display:flex;align-items:flex-start;gap:16px}.side{width:190px;background:var(--panel-2);border-radius:18px 24px 14px 26px/24px 14px 26px 18px;box-shadow:inset 0 2px 8px #0006,inset 0 0 0 1px #ffffff08,0 10px 24px #00000059;padding:12px 10px 10px;text-align:center;animation:sideIn .4s cubic-bezier(.34,1.56,.64,1) both}.side-label{display:block;font-size:11px;letter-spacing:3.5px;color:var(--muted);font-weight:700}.side .score-pop{margin:10px 0 0}.side .hud{margin:14px 0 0}.side .lb{margin-top:0}.side .lb h3{margin-bottom:8px}@keyframes sideIn{0%{opacity:0;transform:translate(18px)}}@media (max-width: 899px){.game-mid{flex-direction:column;align-items:center;gap:12px}.side{width:calc(var(--bc) * 8 + var(--gap) * 7 + 24px)}.side-left{order:2}.side-right{order:3}@keyframes sideIn{0%{opacity:0;transform:translateY(18px)}}}.lb-row .pts{font-family:Titan One;font-size:12px}.lb-row .rank{flex:none;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;font-family:Titan One;font-size:10.5px;color:var(--muted);background:#171310;box-shadow:inset 0 0 0 1px #ffffff0f}.lb-row.medal-1 .rank{color:#4a3400;background:linear-gradient(180deg,#ffd97a,#b98700);animation:medalGlow 1.6s ease-in-out infinite alternate}.lb-row.medal-2 .rank{color:#2c3240;background:linear-gradient(180deg,#e8ecf2,#8b96ad);box-shadow:0 0 8px #c8d2e159}.lb-row.medal-3 .rank{color:#3a2410;background:linear-gradient(180deg,#e0a06a,#8a5a2c);box-shadow:0 0 8px #e0a06a59}.lb-row.medal-1 .pts{color:#ffd97a}.lb-row.medal-2 .pts{color:#c9d2e0}.lb-row.medal-3 .pts{color:#dda06b}.lb-row>svg{flex:none;width:14px;height:14px;color:#f6bc40;filter:drop-shadow(0 0 4px rgba(246,188,64,.6))}@keyframes medalGlow{0%{box-shadow:0 0 5px #f6bc4059}to{box-shadow:0 0 14px #f6bc40bf}}