/* Every block has a cosmetic crack. Chains overlay the crack, rather than replacing it. */
.piece{--crack:url('assets/art/ice-cracks-light.svg')}
.piece.crack-2{--crack:url('assets/art/ice-cracks-medium.svg')}
.piece.crack-3{--crack:url('assets/art/ice-cracks.svg')}
.piece:after{background-image:var(--crack)}
.piece.locked:after{background-image:url('assets/art/pearl-chain.svg'),var(--crack);background-position:center;background-size:100% 100%;opacity:1;transform:none}
/* Stable score receipt; never inserted into layout during a clear. */
.score-receipt{display:grid;gap:5px;min-height:85px;margin:12px 0 0;text-align:left;font:14px SimSun,serif}
.score-receipt>div{display:flex;align-items:center;justify-content:space-between;gap:5px;min-width:0;height:25px;padding:0 10px;border:1px solid #e5c4a888;border-radius:20px;background:linear-gradient(90deg,#506179dc,#42415be6);box-shadow:inset 0 0 0 2px #a9a9bf25;color:#cac3cc}
.score-receipt b{font:20px Georgia,serif;color:#cfb98c}.score-receipt .earned{color:#fff5df}.score-receipt .earned b{color:#ffe592;text-shadow:0 0 6px #ffbd5866}
.score-receipt.show .earned{animation:receipt-glow 1.4s ease-out}
@keyframes receipt-glow{0%{box-shadow:0 0 10px #fff1bdaa;background-color:#b88a60}100%{box-shadow:inset 0 0 0 2px #a9a9bf25}}
.board{container-type:inline-size}
.score-float{inset:20% 0 auto;min-height:30%;display:grid;place-items:center;isolation:isolate;padding:10px 0;z-index:7;font-size:inherit;line-height:1.1}
.score-float.show{animation:combo-reveal 1.8s both}
.combo-words{position:relative;z-index:2;transform:rotate(-4deg);white-space:nowrap;text-align:center}
.combo-title,.multi-title,.clear-title{display:flex;align-items:center;justify-content:center;gap:1.2cqw;font-family:Georgia,'Times New Roman',SimSun,serif;font-style:italic;line-height:1.1}
.combo-title{font-size:clamp(25px,10cqw,83px);color:#873548;-webkit-text-stroke:1px #fff0d6;text-shadow:0 0 3px #fff6d3,0 0 15px #fa765a,0 0 32px #e85056}
.combo-title b{font-size:1.18em;font-weight:400;color:#ffdc82;-webkit-text-stroke:1px #fff0b9;text-shadow:2px 2px #a55232,0 0 15px #ffcc65}
.multi-title{font-size:clamp(22px,8cqw,66px);margin-top:1cqw;color:#75c2f2;-webkit-text-stroke:1px #e8f2ff;text-shadow:0 0 4px #f1e5ff,0 0 16px #9280ff}
.multi-title b{font-weight:400;font-size:1.2em;color:#d2b7ee}
.clear-title{font-size:clamp(22px,7cqw,58px);color:#ffedc5;text-shadow:0 0 9px #ffbd74,2px 3px #8b3946}
.combo-cube{width:.62em;height:.75em;fill:#98455755;stroke:#ffe9db;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 3px #fff1e7)}
.multi-title .combo-cube{fill:#816adb66;stroke:#e2d9ff}.gain-title{font:italic clamp(17px,5cqw,38px) Georgia,serif;color:#fff1c5;letter-spacing:2px;margin-top:8px;text-shadow:0 0 10px #d86758,0 2px 2px #512739}
.combo-aura{position:absolute;inset:-15% 4%;background:radial-gradient(ellipse,#c957704f,transparent 66%);z-index:-1;filter:blur(8px)}
.combo-spark{position:absolute;left:var(--sx);top:var(--sy);font-size:calc(var(--size)*2);color:#ffedb4;text-shadow:0 0 4px #fff,0 0 12px #ffa454;opacity:0;animation:combo-spark 1.5s var(--delay) ease-out both;font-style:normal;pointer-events:none}
.combo-spark:nth-child(3n){color:#ddd0ff;text-shadow:0 0 4px #fff,0 0 12px #9978ff}
@keyframes combo-reveal{0%{opacity:0;transform:scale(.72) translateY(8px)}14%{opacity:1;transform:scale(1.06)}25%,72%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-15px) scale(1.02)}}
@keyframes combo-spark{0%{opacity:0;transform:scale(.3)}25%,55%{opacity:1}100%{opacity:0;transform:translateY(var(--drift)) scale(.4) rotate(65deg)}}
.paused .score-float,.paused .combo-spark,.paused .score-receipt .earned{animation-play-state:paused}
@media(min-aspect-ratio:1/1) and (max-height:600px){.score-receipt{margin-top:7px;min-height:59px;gap:2px;font-size:11px}.score-receipt>div{height:18px;padding:0 6px}.score-receipt b{font-size:14px}}
@media(max-aspect-ratio:1/1),(max-width:680px){
 .chapter{flex-wrap:wrap;row-gap:6px}
 .score-receipt{order:4;flex:0 0 100%;display:flex;gap:5px;margin:0;min-height:21px;height:21px;font:10px system-ui}
 .score-receipt>div{flex:1;height:21px;padding:0 7px}.score-receipt b{font-size:13px}
 .board-column{width:min(100%,max(180px,calc(100dvh - 247px)))}
}
@media(max-width:380px){.score-receipt{font-size:9px;gap:3px}.score-receipt>div{padding:0 5px}.score-receipt b{font-size:12px}}
@media(prefers-reduced-motion:reduce){.score-float.show{animation:combo-still 2s both!important}.combo-spark{animation:none!important;opacity:.7}.score-receipt.show .earned{animation:none!important}@keyframes combo-still{0%,85%{opacity:1}100%{opacity:0}}}