@layer components{.cr-stage{background:radial-gradient(80% 50% at 50% 40%,#1d0f2b 0%,#08050c 70%);padding:0}.cr-top{justify-content:space-between;align-items:center;display:flex;position:absolute;top:12px;left:20px;right:20px}.cr-clock{letter-spacing:-.04em;font-size:34px;font-weight:600;line-height:1;position:relative}.cr-clock.is-done{color:var(--rn);animation:pop .42s var(--ease-pop) both}.cr-cost{letter-spacing:0;color:#ffb020;animation:cr-rise 1.1s var(--ease-out) both;font-size:14px;font-weight:700;position:absolute;top:100%;right:0}@keyframes cr-rise{0%{opacity:0;transform:translateY(-4px)}15%{opacity:1}70%{opacity:1}to{opacity:0;transform:translateY(10px)}}.cr-area{place-items:center;display:grid;position:absolute;inset:58px 16px 150px;container-type:size}.cr-board{aspect-ratio:1;touch-action:none;-webkit-user-select:none;user-select:none;background:#0d0d0f;border:3px solid #0d0d0f;border-radius:12px;width:min(100cqw,100cqh,620px);display:grid;overflow:hidden;box-shadow:0 0 0 1.5px #ffffff24,0 24px 60px -18px #000c}.cr-cell{color:#0d0d0f;place-items:center;min-width:0;min-height:0;transition:filter .12s;display:grid;position:relative}@media (hover:hover){.cr-cell:hover{filter:brightness(1.08)}}.cr-cell:focus-visible{z-index:2;outline-offset:-3px;outline:3px solid #fff}.cr-crown{filter:drop-shadow(0 1.5px #ffffff73);width:64%;height:64%;animation:pop .24s var(--ease-pop) both}.cr-x{opacity:.62;width:46%;height:46%;animation:cr-mark .16s var(--ease-out) both}.cr-x.is-auto{opacity:.26;animation:none}@keyframes cr-mark{0%{opacity:0;transform:scale(.4)}}.cr-cell.is-bad{background-image:repeating-linear-gradient(135deg,#ff4d4f6b 0 4px,#0000 4px 9px)!important}.cr-cell.is-bad .cr-crown{color:#c0101a;animation:cr-shake .32s var(--ease-out) both}@keyframes cr-shake{25%{transform:translate(-12%)rotate(-8deg)}60%{transform:translate(10%)rotate(6deg)}}.cr-cell.is-hint:after{content:"";animation:cr-glow 1.6s var(--ease-out) both;pointer-events:none;border-radius:4px;position:absolute;inset:2px;box-shadow:inset 0 0 0 3px #fff}@keyframes cr-glow{0%,40%{opacity:1}to{opacity:0}}.cr-board.is-solved .cr-cell{animation:cr-flash .7s var(--ease-out) both;animation-delay:var(--d)}.cr-board.is-solved .cr-crown{animation:cr-win .7s var(--ease-pop) both;animation-delay:var(--d)}@keyframes cr-flash{35%{filter:brightness(1.25)saturate(1.2)}}@keyframes cr-win{40%{transform:scale(1.3)rotate(-8deg)}}.cr-foot{left:16px;right:16px;bottom:max(18px, calc(env(safe-area-inset-bottom) + 10px));justify-items:center;gap:12px;display:grid;position:absolute}.cr-say{text-align:center;text-wrap:balance;max-width:520px;min-height:2.7em;color:var(--on-dark-dim);place-items:center;font-size:14.5px;font-weight:550;line-height:1.35;display:grid}.cr-say.is-hint{color:var(--on-dark);animation:pop .26s var(--ease-pop) both}.cr-keys{gap:8px;width:min(100%,520px);display:flex}.cr-keys .key{flex:1 1 0;min-width:0;padding:0 8px}.cr-hint{--key:#ffb020;--key-ink:#0d0d0f;--edge:#78460073}.cr-mini{border:2px solid #0d0d0f;border-radius:10px;width:168px;margin-inline:auto;display:grid;overflow:hidden}.cr-mini>div{aspect-ratio:1;color:#0d0d0f;place-items:center;display:grid}.cr-mini svg{width:70%;height:70%}.cr-sum p{text-align:center;color:var(--on-dark-dim);margin-top:10px;font-size:13px}@media (prefers-reduced-motion:reduce){.cr-crown,.cr-x,.cr-cell.is-bad .cr-crown,.cr-board.is-solved .cr-cell,.cr-board.is-solved .cr-crown,.cr-say.is-hint,.cr-cost{animation:none}}}
