.ttt-stage{width:100%;max-width:600px;margin:0 auto}.ttt-status{display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px;margin-bottom:16px;font:700 clamp(18px,2vw,22px) / 1.2 var(--ax-display, "Geist", sans-serif);letter-spacing:-.01em}.ttt-status.is-over{color:var(--gm-lime);text-shadow:0 0 18px rgba(216,247,68,.35)}.ttt-chip{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--gm-edge);border-radius:12px;background:#ffffff0a}.ttt-chip .gm-hex{width:24px;height:24px}.ttt-chip img{width:34px;height:34px;object-fit:contain}.ttt-chip b{color:var(--gm-text2);font:700 18px var(--ax-mono, monospace)}.ttt-board{--c-rgb: 216, 247, 68;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:clamp(8px,1.6vw,14px);aspect-ratio:1;padding:clamp(10px,1.8vw,16px);border:1.5px solid rgba(var(--c-rgb),.85);border-radius:26px;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px) 0 0 / 24px 24px,linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) 0 0 / 24px 24px,radial-gradient(circle at 50% 40%,rgba(61,99,255,.08),transparent 65%),#0a0e12f0;box-shadow:0 0 16px rgba(var(--c-rgb),.45),0 0 48px rgba(var(--c-rgb),.22),0 0 110px rgba(var(--c-rgb),.1),0 30px 80px -30px #000000e6;animation:ttt-breathe 4.5s ease-in-out infinite;transition:border-color .4s;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}@keyframes ttt-breathe{50%{box-shadow:0 0 22px rgba(var(--c-rgb),.6),0 0 64px rgba(var(--c-rgb),.3),0 0 140px rgba(var(--c-rgb),.14),0 30px 80px -30px #000000e6}}.ttt-board.is-thinking{--c-rgb: 92, 124, 255}.ttt-frame{position:relative;padding:14px}.ttt-frame__corner{position:absolute;width:34px;height:34px;border:0 solid #d8f744;filter:drop-shadow(0 0 6px rgba(216,247,68,.8));pointer-events:none}.ttt-frame__corner:nth-child(1){top:0;left:0;border-top-width:3px;border-left-width:3px;border-top-left-radius:14px}.ttt-frame__corner:nth-child(2){top:0;right:0;border-top-width:3px;border-right-width:3px;border-top-right-radius:14px}.ttt-frame__corner:nth-child(3){bottom:0;left:0;border-bottom-width:3px;border-left-width:3px;border-bottom-left-radius:14px}.ttt-frame__corner:nth-child(4){right:0;bottom:0;border-right-width:3px;border-bottom-width:3px;border-bottom-right-radius:14px}.ttt-cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border:1px solid rgba(255,255,255,.07);border-radius:clamp(12px,2vw,18px);background:linear-gradient(160deg,#ffffff0d,#ffffff04);cursor:default;overflow:hidden;transition:border-color .25s var(--gm-ease),background .25s var(--gm-ease),transform .25s var(--gm-ease),opacity .4s var(--gm-ease)}.ttt-cell:disabled{color:inherit}.ttt-cell[class*=can-]{cursor:pointer}.ttt-cell[class*=can-]:hover{border-color:#d8f74459;background:linear-gradient(160deg,#d8f74412,#ffffff05)}.ttt-cell[class*=can-]:active{transform:scale(.97)}.ttt-cell:focus-visible{outline:2px solid var(--gm-lime);outline-offset:3px}.ttt-cell>.gm-hex{width:58%;height:58%}.ttt-robot{width:86%;height:86%;min-height:0;object-fit:contain;filter:drop-shadow(0 8px 16px rgba(0,0,0,.6)) drop-shadow(0 0 14px rgba(61,99,255,.35));animation:ttt-drop .5s var(--gm-ease) both;pointer-events:none}@keyframes ttt-drop{0%{opacity:0;transform:translateY(-14%) scale(.7);filter:blur(6px)}}.ttt-ghost{position:absolute;width:58%;height:58%;opacity:0;transition:opacity .2s;pointer-events:none}img.ttt-ghost{width:80%;height:80%;object-fit:contain}.ttt-cell[class*=can-]:hover .ttt-ghost{opacity:.22}@media(hover:none){.ttt-ghost{display:none}}.ttt-cell.is-last:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff24}.ttt-board.is-thinking .ttt-cell:not([class*=has-]){animation:ttt-scan 1.2s ease-in-out infinite}@keyframes ttt-scan{50%{background:linear-gradient(160deg,#3d63ff17,#ffffff04)}}.ttt-board.is-over .ttt-cell:not(.is-win){opacity:.38}.ttt-cell.is-win.has-H{border-color:#d8f74499;background:radial-gradient(circle,#d8f74429,#d8f74408 70%);box-shadow:0 0 30px #d8f74440}.ttt-cell.is-win.has-R{border-color:#d8f74499;background:radial-gradient(circle,#d8f74424,#3d63ff0a 70%);box-shadow:0 0 30px #d8f74438}.ttt-cell.is-win{animation:ttt-win .9s var(--gm-ease) both}@keyframes ttt-win{30%{transform:scale(1.06)}}.ttt-line{position:absolute;inset:clamp(10px,1.8vw,16px);width:calc(100% - (2*clamp(10px,1.8vw,16px)));height:calc(100% - (2*clamp(10px,1.8vw,16px)));pointer-events:none;overflow:visible}.ttt-line line{stroke:var(--gm-lime);stroke-width:7;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 8px rgba(216,247,68,.9));animation:gm-draw .55s .15s var(--gm-ease) forwards}.ttt-confetti{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}.ttt-confetti span{position:absolute;top:-20px;width:calc(16px * var(--s));height:calc(18px * var(--s));background:var(--gm-lime);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);filter:drop-shadow(0 0 6px rgba(216,247,68,.9));animation:ttt-fall var(--d) var(--delay) cubic-bezier(.3,.6,.5,1) forwards;opacity:0}.ttt-confetti span.is-blue{background:#7d97ff}@keyframes ttt-fall{0%{opacity:1;transform:translate(0) rotate(0)}to{opacity:0;transform:translate(var(--drift),560px) rotate(var(--r))}}.ttt-bot{--mood: var(--gm-blue);display:grid;grid-template-columns:96px 1fr;align-items:center;gap:16px}.ttt-bot--happy{--mood: var(--gm-lime)}.ttt-bot--sad{--mood: var(--gm-red)}.ttt-bot__face{position:relative;width:96px;height:96px;border:2px solid color-mix(in srgb,var(--mood) 70%,transparent);border-radius:50%;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--mood) 22%,#0a0d12),#05070a 70%);box-shadow:0 0 0 6px color-mix(in srgb,var(--mood) 10%,transparent),0 0 34px color-mix(in srgb,var(--mood) 40%,transparent);transition:border-color .4s,box-shadow .4s}.ttt-bot__face img{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain}.ttt-bot--thinking .ttt-bot__face{animation:ttt-think 1s ease-in-out infinite}@keyframes ttt-think{50%{box-shadow:0 0 0 10px color-mix(in srgb,var(--mood) 6%,transparent),0 0 50px color-mix(in srgb,var(--mood) 60%,transparent)}}.ttt-bot--happy .ttt-bot__face img{animation:ttt-bob .6s var(--gm-ease) 2}.ttt-bot--sad .ttt-bot__face img{animation:ttt-shake .5s ease-in-out}@keyframes ttt-bob{50%{transform:translateY(-8%) rotate(-4deg)}}@keyframes ttt-shake{25%{transform:translate(-5%)}75%{transform:translate(5%)}}.ttt-bot__say{position:relative;padding:12px 14px;border:1px solid var(--gm-edge);border-radius:14px;background:#ffffff0a}.ttt-bot__say:before{content:"";position:absolute;top:50%;left:-6px;width:10px;height:10px;border-bottom:1px solid var(--gm-edge);border-left:1px solid var(--gm-edge);background:#12171d;transform:translateY(-50%) rotate(45deg)}.ttt-bot__name{display:block;margin-bottom:3px;color:var(--mood);font:600 10px / 1.3 var(--ax-mono, monospace);letter-spacing:.16em;transition:color .4s}.ttt-bot__say p{margin:0;font-size:15px;line-height:1.45}.ttt-score-r strong{color:#9fb3ff}@media(max-width:600px){.ttt-frame{padding:10px}.ttt-frame__corner{width:24px;height:24px}.ttt-status{min-height:44px;margin-bottom:12px}.ttt-bot{grid-template-columns:72px 1fr;gap:12px}.ttt-bot__face{width:72px;height:72px}.gm-actions{flex-wrap:wrap}}
