/* Ultimate Tic-Tac-Toe styles - dedicated to avoid shared style.css cache issues */
.utt-container{max-width:520px;margin:0 auto}
.utt-board{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(94vw,460px);margin:14px auto;background:var(--card);border-radius:var(--radius);padding:8px;box-shadow:0 10px 30px rgba(0,0,0,.35);user-select:none}
.utt-small{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:3px;background:#1a1d3a;border-radius:8px;padding:4px;aspect-ratio:1/1;position:relative;transition:outline .12s,box-shadow .12s}
.utt-small.utt-active{outline:3px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 2px rgba(108,92,231,.25)}
.utt-small.utt-won-X{background:rgba(0,206,201,.16)}
.utt-small.utt-won-O{background:rgba(255,107,107,.16)}
.utt-small.utt-won-D{background:rgba(255,255,255,.05)}
.utt-small.utt-win{outline:3px solid var(--ok);outline-offset:2px}
.utt-cell{background:#2d325a;border-radius:6px;display:grid;place-items:center;font-size:clamp(13px,3.6vw,22px);font-weight:800;cursor:pointer;transition:background .12s;color:var(--text);line-height:1;border:0;font-family:inherit;padding:0}
.utt-cell:hover:not(.utt-taken){background:#3d427a}
.utt-cell:active:not(.utt-taken){transform:scale(.94)}
.utt-cell.utt-x{color:var(--accent2);background:rgba(0,206,201,.14)}
.utt-cell.utt-o{color:#ff6b6b;background:rgba(255,107,107,.14)}
.utt-cell.utt-taken{cursor:default}
.utt-cell.utt-focus{outline:3px solid var(--gold);outline-offset:-2px}
.utt-cell.utt-win{background:rgba(52,211,153,.3);color:var(--ok);animation:utt-pop .5s ease}
@keyframes utt-pop{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}
.utt-big-mark{position:absolute;inset:0;display:none;place-items:center;font-size:clamp(46px,13vw,96px);font-weight:900;pointer-events:none;text-shadow:0 4px 12px rgba(0,0,0,.4)}
.utt-big-mark.x{color:var(--accent2)}
.utt-big-mark.o{color:#ff6b6b}