.ttt-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:#14bdac;font-family:Arial,sans-serif;color:#545454}.ttt-title{font-size:3rem;color:#f2ebd3;margin-bottom:var(--space-5);text-transform:uppercase}.ttt-status{font-size:1.5rem;color:#f2ebd3;margin-bottom:var(--space-5);height:30px}.ttt-board{display:grid;grid-template-columns:repeat(3,100px);grid-template-rows:repeat(3,100px);gap:10px;background:#0da192;padding:10px;border-radius:10px}.ttt-square{width:100px;height:100px;background:#f2ebd3;border-radius:5px;border:none;font-size:4rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.ttt-square:hover:not(:disabled){background:var(--color-white)}.ttt-square.x{color:#545454}.ttt-square.o{color:#f2ebd3;background:#545454}.ttt-controls{margin-top:30px;display:flex;gap:var(--space-5)}.ttt-btn{padding:10px var(--space-5);font-size:1rem;border:2px solid #f2ebd3;background:transparent;color:#f2ebd3;border-radius:var(--space-5);cursor:pointer;transition:all .2s}.ttt-btn.active{background:#f2ebd3;color:#14bdac}.ttt-btn:hover{transform:scale(1.05)}.winning-line{background:#ffec42!important}