@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&display=swap";:root{color:#f6f0e4;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--text:#f6f0e4;--text-soft:#f6f0e4e0;--muted:#f6f0e494;--panel-bg:#0c0e16b8;--panel-border:#ffffff14;--panel-shadow:inset 0 1px 0 #ffffff08, 0 14px 32px #0003;--board-light:#ead3a1;--board-dark:#af6d33;--app-bg:radial-gradient(circle at 18% 18%, #7f65a833, transparent 26%), radial-gradient(circle at 82% 82%, #76284b2e, transparent 28%), linear-gradient(180deg, #04050a 0%, #090b11 56%, #11081a 100%);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 18% 18%,#7f65a833,#0000 26%),radial-gradient(circle at 82% 82%,#76284b2e,#0000 28%),linear-gradient(#04050a 0%,#090b11 56%,#11081a 100%);font-family:Space Grotesk,Segoe UI,sans-serif;font-weight:500;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--app-bg);min-width:320px;font-family:inherit}button,select{font:inherit}button{color:inherit}.app-shell{place-items:center;min-height:100vh;padding:1.25rem;display:grid}.game-stage{justify-items:center;gap:1rem;width:min(100%,34rem);display:grid}.game-stage__chrome{gap:.7rem;width:100%;display:grid}.game-stage__board{justify-items:center;width:100%;display:grid}.status-banner{justify-content:center;display:flex}.status-banner__pill{border:1px solid var(--panel-border);background:var(--panel-bg);min-height:2.4rem;box-shadow:var(--panel-shadow);color:var(--text);letter-spacing:.16em;text-transform:uppercase;border-radius:999px;justify-content:center;align-items:center;padding:.55rem 1rem;font-size:.76rem;font-weight:700;display:inline-flex}.controls-strip,.online-strip{flex-wrap:wrap;justify-content:center;gap:.55rem;width:100%;display:flex}.control-chip{border:1px solid var(--panel-border);background:var(--panel-bg);min-height:2.55rem;box-shadow:var(--panel-shadow);color:var(--text-soft);border-radius:999px;align-items:center;gap:.6rem;padding:.48rem .85rem;display:inline-flex}.control-chip span{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-size:.68rem;font-weight:700}.control-chip--button:focus-visible,.control-dropdown__trigger:focus-visible,.control-dropdown__option:focus-visible{outline-offset:2px;outline:2px solid #e8ca95a6}.control-dropdown{min-width:11rem;position:relative}.control-dropdown__trigger{min-width:0;color:var(--text);cursor:pointer;text-align:left;background:0 0;border:0;flex:1;justify-content:space-between;align-items:center;gap:.75rem;padding:0;display:inline-flex}.control-dropdown__value{color:var(--text);text-transform:none;letter-spacing:0;font-size:.98rem}.control-dropdown__caret{opacity:.8;border-bottom:2px solid;border-right:2px solid;flex:none;width:.5rem;height:.5rem;transform:rotate(45deg)translateY(-1px)}.control-dropdown__menu{z-index:20;background:linear-gradient(#0d1018fa,#090b11fa);border:1px solid #ffffff1a;border-radius:18px;min-width:100%;padding:.35rem;display:grid;position:absolute;top:calc(100% + .4rem);left:0;box-shadow:0 18px 32px #0000005c,inset 0 1px #ffffff0a}.control-dropdown__option{color:var(--text-soft);cursor:pointer;text-align:left;background:0 0;border:0;border-radius:14px;padding:.7rem .85rem}.control-dropdown__option:hover{color:var(--text);background:#ffffff0f}.control-dropdown__option.is-active{color:#fff4d4;background:#e8ca9524}.control-chip--button{cursor:pointer;color:var(--text);background:linear-gradient(180deg, #ffffff0f, transparent), var(--panel-bg);font-weight:700}.control-chip--button.is-active{color:#fff2ce;background:linear-gradient(180deg, #e8ca952e, #e8ca950a), var(--panel-bg);border-color:#e8ca958c}.control-chip--button:disabled{cursor:not-allowed;opacity:.52}.online-strip{flex-direction:column;align-items:center}.online-strip__chips{flex-wrap:wrap;justify-content:center;gap:.45rem;display:flex}.online-chip{border:1px solid var(--panel-border);min-height:2rem;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;background:#090b108c;border-radius:999px;align-items:center;padding:.4rem .7rem;font-size:.68rem;font-weight:700;display:inline-flex}.online-chip.is-live{color:#c7f2d7;border-color:#8ae0b05c}.online-strip__actions{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.online-strip__message{max-width:30rem;color:var(--muted);text-align:center;margin:0;font-size:.88rem}.board-shell{background:radial-gradient(circle at 0 0,#e8ca9514,#0000 32%),linear-gradient(#12151efa,#0b0e15fa);border:1px solid #ffffff14;border-radius:28px;width:min(100%,33rem);padding:.82rem;position:relative;box-shadow:0 24px 80px #0000005c,inset 0 1px #ffffff08}.board{aspect-ratio:1;isolation:isolate;background:#c18a4b;border-radius:22px;grid-template-columns:repeat(3,minmax(0,1fr));display:grid;position:relative;overflow:hidden}.board__win-line{pointer-events:none;z-index:2;filter:drop-shadow(0 0 10px #ffecbe73);width:100%;height:100%;position:absolute;inset:0}.board__win-line line{stroke:#ffecbeeb;stroke-width:.12px;stroke-linecap:round}.board-cell{aspect-ratio:1;color:var(--text);cursor:pointer;border:0;place-items:center;padding:0;transition:box-shadow .14s,background-color .14s;display:grid;position:relative;box-shadow:inset 0 0 0 1px #fff8e729}.board-cell--light{background:#efd79b}.board-cell--dark{background:#b57435}.board-cell:disabled{cursor:not-allowed}.board-cell.is-selectable:not(.is-selected){box-shadow:inset 0 0 0 1px #ffffff1f,inset 0 0 0 999px #ffffff05}.board-cell.is-selected{box-shadow:inset 0 0 0 2px #fff3d4eb,inset 0 0 0 10px #fff3d414}.board-cell.is-drop-target,.board-cell.is-move-target{box-shadow:inset 0 0 0 2px #d5dfe659,inset 0 0 0 10px #ffffff0d}.board-cell.is-capture-target{box-shadow:inset 0 0 0 2px #ffcca266,inset 0 0 0 10px #ffd6be14}.board-cell.is-winning{box-shadow:inset 0 0 0 2px #fff4d0d1,inset 0 0 0 10px #fff4d014}.piece{z-index:1;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 1px #ffffff14)drop-shadow(0 6px 10px #0000001f);width:72%;height:72%;display:block;position:relative}@media (width<=760px){.app-shell{padding:.9rem}.game-stage{gap:.85rem}.board-shell{border-radius:24px;width:100%;padding:.62rem}.board{border-radius:18px}.control-chip{justify-content:space-between;width:100%}.control-dropdown{min-width:0}.control-chip--button{justify-content:center}.control-dropdown__menu,.online-strip__actions{width:100%}}