.ttt{display:grid;place-items:center;min-height:100dvh;padding:1.25rem;box-sizing:border-box;background:#1a2332;color:#e8dcc4;font:500 1rem/1.45 Palatino,"Palatino Linotype","Iowan Old Style",Georgia,serif}
.ttt-card{display:grid;grid-template-columns:7.2rem 1fr;border:1px solid #8b7355;background:#1f2a38;max-width:28rem;width:100%}
.ttt-side{padding:.9rem .7rem;border-right:1px dashed #8b7355;display:grid;align-content:space-between;gap:.8rem}
.ttt-kicker{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;opacity:.7}
.ttt-title{font-size:1.15rem;letter-spacing:.04em;margin:.2rem 0 0;font-weight:500}
.ttt-chairs{display:grid;gap:.35rem}
.ttt-chair{display:flex;justify-content:space-between;gap:1rem;font-size:.82rem;letter-spacing:.04em}
.ttt-open{opacity:.4}
.ttt-you{color:#c45c26}
.ttt-watch{font:600 .7rem ui-monospace,monospace;opacity:.55}
.ttt-main{padding:1.1rem 1rem 1.2rem;display:grid;place-items:center;gap:.85rem}
.ttt-board{display:grid;grid-template-columns:repeat(3,4.4rem);grid-template-rows:repeat(3,4.4rem);gap:.35rem}
.ttt-cell{width:4.4rem;height:4.4rem;font:700 1.85rem ui-monospace,SFMono-Regular,Menlo,monospace;border:1px solid #8b7355;border-radius:0;background:#14202c;color:#8b7355;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.ttt-cell:disabled{cursor:default}
.ttt-x{color:#c45c26}
.ttt-o{color:#2a6f6f}
.ttt-status{font-size:1.05rem;min-height:1.4rem;text-align:center}
.ttt-dim{opacity:.55}
.ttt-controls{display:flex;gap:.5rem;flex-wrap:wrap}
.ttt-btn{background:transparent;border:1px solid #8b7355;border-radius:0;padding:.35rem .8rem;cursor:pointer;color:#e8dcc4;font:600 .8rem ui-monospace,monospace;letter-spacing:.06em}
