/* A little wonder lives at the edges; the board and its hit targets stay still. */
.daily-play-header { position:relative; isolation:isolate; }
.daily-play-header::before { content:''; position:absolute; width:110px; height:110px; right:18%; top:-45px; border:1px solid #fff5cf1c; border-radius:50%; box-shadow:0 0 0 12px #fff5cf08,0 0 0 26px #fff5cf05; pointer-events:none; z-index:-1; }
.daily-stop,.pack-card,.library-card,.badge-keep { transition:background-color .18s,border-color .18s; }
.button,.next-puzzle-card,#mobile-navigation a,.scramble-letters button { transition:background-color .15s,box-shadow .15s; }
.button:active,.next-puzzle-card:active,.scramble-letters button:active { box-shadow:inset 0 2px 5px #203b2c24; }
.daily-stop:active,.pack-card:active,.library-card:active { background:#eaf0df; }
.daily-stops .collected .stop-number { border-radius:50%; background:#dce8cf; width:24px; height:24px; display:grid; place-items:center; }
.daily-stops .collected .stop-game-icon { background:#eaf0df; }
.delight-keepsake { position:relative; isolation:isolate; }
.completion-emblem.delight-keepsake::before { content:''; position:absolute; inset:-6px; border:1px dashed #a7893f; border-radius:inherit; transform:rotate(7deg); pointer-events:none; }
.delight-sparks { position:absolute; inset:-18px; pointer-events:none; }
.delight-sparks i { position:absolute; font:26px/1 var(--serif); color:#8c6925; opacity:0; }
.delight-sparks i:nth-child(1) { top:0; left:0; }
.delight-sparks i:nth-child(2) { top:5px; right:0; }
.delight-sparks i:nth-child(3) { bottom:0; right:8px; }
.delight-sparks i:nth-child(4) { bottom:5px; left:0; }
/* Retire the old full-panel confetti in favor of a small keepsake flourish. */
.delight-completion .path-confetti { display:none; }
.delight-completion .next-label { text-wrap:pretty; }
@media(prefers-reduced-motion:no-preference) {
 .game-title-icon svg { animation:delight-draw .5s ease-out both; }
 .delight-new-win .completion-emblem { animation:delight-stamp .48s ease-out both; }
 .delight-new-win .garden-badge { animation:delight-badge .48s ease-out both; }
 .delight-new-win .delight-sparks i { animation:delight-spark .85s ease-out calc(var(--spark)*65ms) both; }
 .search-keepsake.just-found { animation:delight-ink .45s ease-out; }
 dialog[open]:not(.transition-preview) { animation:delight-dialog .18s ease-out; }
 .play-tools[open]>div { animation:delight-dialog .18s ease-out; }
 .maze-cell.visited { transition:background-color .12s; }
 .pack-card:hover .garden-badge,.badge-keep:hover .garden-badge { transform:rotate(-3deg); transition:transform .25s; }
}
@keyframes delight-draw { from { stroke-dasharray:70; stroke-dashoffset:70; opacity:.35; } to { stroke-dasharray:70; stroke-dashoffset:0; opacity:1; } }
@keyframes delight-stamp { from { transform:rotate(-12deg) scale(.88); opacity:.5; } to { transform:rotate(-6deg) scale(1); opacity:1; } }
@keyframes delight-badge { from { transform:rotate(-6deg) scale(.9); opacity:.5; } to { transform:rotate(0) scale(1); opacity:1; } }
@keyframes delight-spark { 0% { opacity:0; transform:scale(.65); } 35% { opacity:.9; } 100% { opacity:0; transform:translateY(-8px) scale(1.1); } }
@keyframes delight-ink { from { box-shadow:inset 0 0 0 2px #b89a49; } to { box-shadow:inset 0 0 0 0 transparent; } }
@keyframes delight-dialog { from { opacity:.65; } to { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
 .delight-sparks { display:none; }
 .daily-stop,.pack-card,.library-card,.badge-keep,.button,.next-puzzle-card,#mobile-navigation a,.scramble-letters button { transition:none; }
}
