/*! Ease My Finance - https://easemyfinances.com - (c) Vinay Jajal. All rights reserved. */
.ttt{max-width:480px;margin:0 auto;display:grid;gap:14px;justify-items:center;-webkit-tap-highlight-color:transparent}.ttt .seg{margin:0}.ttt-score{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}.ttt-score .sc{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px 10px;text-align:center}.ttt-score span{display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;color:var(--muted)}.ttt-score b{display:block;font:700 26px/1.15 var(--display);color:var(--ink);font-variant-numeric:tabular-nums}.ttt-score .cpu i,.ttt-score .you i{display:inline-block;width:14px;height:14px}.ttt-score .you i{background:linear-gradient(45deg,transparent 42%,var(--accent) 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--accent) 42% 58%,transparent 58%)}.ttt-score .cpu i{border:2.5px solid var(--mark);border-radius:50%;width:12px;height:12px}.ttt-score .sc.bump b{animation:.5s ttt-bump}@keyframes ttt-bump{0%,100%{transform:scale(1)}40%{transform:scale(1.28)}}.ttt-status{margin:2px 0 0;min-height:26px;font:600 17px/1.5 var(--display);color:var(--ink);display:flex;align-items:center;gap:8px}.ttt-status .dots i{display:inline-block;width:5px;height:5px;margin:0 1.5px;border-radius:50%;background:var(--muted);animation:1s ease-in-out infinite ttt-dot}.ttt-status .dots i:nth-child(2){animation-delay:.15s}.ttt-status .dots i:nth-child(3){animation-delay:.3s}@keyframes ttt-dot{0%,100%,80%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}.ttt-status.win{color:var(--pos)}.ttt-status.lose{color:var(--neg)}.ttt-board{position:relative;width:min(100%,420px);aspect-ratio:1;border-radius:24px;background:var(--surface);border:1px solid var(--line);box-shadow:0 1px 0 var(--line),0 18px 40px -22px rgba(20,30,70,.35);padding:4%;box-sizing:border-box}.ttt-grid{position:relative;width:100%;height:100%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}.ttt-fx,.ttt-lines,.ttt-win{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.ttt-lines rect{fill:var(--line);transform-box:fill-box;transform-origin:center;animation:.45s cubic-bezier(.2,.8,.2,1) both ttt-grow}.ttt-lines rect:nth-child(2){animation-delay:.05s}.ttt-lines rect:nth-child(3){animation-delay:.1s}.ttt-lines rect:nth-child(4){animation-delay:.15s}@keyframes ttt-grow{from{transform:scale(.05)}to{transform:scale(1)}}.ttt .cell{position:relative;border:0;background:0 0;padding:0;margin:0;cursor:pointer;border-radius:16px;display:grid;place-items:center;color:inherit;font:inherit}.ttt .cell:focus-visible{outline:3px solid var(--accent);outline-offset:-6px}.ttt .cell svg{width:68%;height:68%;overflow:visible}.ttt .cell .ghost{opacity:0;transition:opacity .15s}.ttt-board.mine .cell:not(.filled):hover .ghost{opacity:.16}.ttt .cell.filled,.ttt-board:not(.mine) .cell{cursor:default}.ttt-board.done .cell{cursor:pointer}.ttt .mk-x path{fill:none;stroke:var(--accent);stroke-width:11;stroke-linecap:round;stroke-dasharray:72;stroke-dashoffset:72;animation:.2s ease-out forwards ttt-draw}.ttt .mk-x path+path{animation-delay:.16s}.ttt .mk-o circle{fill:none;stroke:var(--mark);stroke-width:11;stroke-linecap:round;stroke-dasharray:166;stroke-dashoffset:166;animation:.38s ease-out forwards ttt-draw;transform:rotate(-90deg);transform-origin:50% 50%}.ttt .ghost path{fill:none;stroke:var(--accent);stroke-width:11;stroke-linecap:round}@keyframes ttt-draw{to{stroke-dashoffset:0}}.ttt-board.done .cell:not(.won) svg{opacity:.28;transition:opacity .4s}.ttt .cell.won svg{animation:.45s .25s both ttt-pop}@keyframes ttt-pop{0%,100%{transform:scale(1)}45%{transform:scale(1.14)}}.ttt-win line{stroke-width:9;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;animation:.45s ease-out .05s forwards ttt-draw;opacity:.92}.ttt-win line.x{stroke:var(--accent)}.ttt-win line.o{stroke:var(--mark)}.ttt-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.ttt-btn{font:600 15px var(--body);height:44px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}.ttt-btn:hover{border-color:var(--accent)}.ttt-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.ttt-btn.primary:hover{background:var(--ink);border-color:var(--ink);color:var(--bg)}.ttt-hint{font-size:13.5px;color:var(--muted);text-align:center;margin:0}@media (prefers-reduced-motion:reduce){.ttt *{animation:none!important;transition:none!important}.ttt .mk-o circle,.ttt .mk-x path,.ttt-win line{stroke-dashoffset:0}}