:root{color:#f7fbf5;background:#101613;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;-webkit-user-select:none;user-select:none}button{font:inherit}.app-shell{--viewport-gap: .625rem;align-items:flex-start;background:radial-gradient(circle at top left,rgba(116,175,134,.28),transparent 34rem),linear-gradient(145deg,#101613,#142821 42%,#0d1110);display:flex;min-height:100svh;padding:var(--viewport-gap)}.game-panel{--minimum-fit-size: 14.75rem;--viewport-fit-size: calc(100svh - 15.25rem) ;--panel-size: min(31rem, 100%, max(var(--minimum-fit-size), var(--viewport-fit-size)));container-type:inline-size;margin:0 auto;max-width:var(--panel-size);width:var(--panel-size)}.topbar{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem;gap:1rem}.eyebrow{color:#9dd2ad;font-size:.8rem;font-weight:800;letter-spacing:0;margin:0 0 .18rem;text-transform:uppercase}h1{font-size:clamp(2.25rem,14cqw,min(4.4rem,10svh));line-height:.95;margin:0;text-wrap:nowrap}.icon-button,.primary-action,.mode-switch,.square{border:0;cursor:pointer}.icon-button{align-items:center;aspect-ratio:1;background:#ffffff1a;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:#f7fbf5;display:inline-flex;flex:0 0 3rem;justify-content:center;transition:background .16s ease,transform .16s ease}.icon-button:hover,.icon-button:focus-visible{background:#ffffff2e;transform:translateY(-1px)}.score-row{align-items:stretch;display:grid;gap:.55rem;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:.6rem}.score-card,.status-chip{align-items:center;background:#ffffff1a;border:1px solid rgba(255,255,255,.14);display:flex;min-height:3.25rem}.score-card{border-radius:.5rem;justify-content:space-between;padding:.65rem .8rem}.score-card span{color:#f7fbf5b8;font-weight:800}.score-card strong{font-size:1.35rem}.status-chip{border-radius:999px;color:#dbeee0;font-size:clamp(.78rem,4.8cqw,1rem);gap:.35rem;justify-content:center;padding:0 .5rem}.active-x{box-shadow:inset 0 -.2rem #f2c14e}.active-o{box-shadow:inset 0 -.2rem #76d6ff}.board{aspect-ratio:1;display:grid;gap:.55rem;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:.6rem;min-width:0;width:100%}.square{align-items:center;aspect-ratio:1;background:#fffffff0;border-radius:.5rem;box-shadow:0 1rem 2.4rem #0003;color:#15221e;display:flex;font-size:clamp(3.75rem,22cqw,7.6rem);font-weight:950;justify-content:center;line-height:1;min-width:0;overflow:hidden;transition:background .16s ease,color .16s ease,transform .16s ease}.square:hover,.square:focus-visible{background:#fff;transform:translateY(-2px)}.square-x{color:#92670e}.square-o{color:#00749d}.square-win,.square-win:hover,.square-win:focus-visible{background:#b7f8c8;color:#11351e}.primary-action{background:#f7fbf5;border-radius:.5rem;color:#15221e;font-weight:900;min-height:3rem;padding:0 1rem;transition:background .16s ease,transform .16s ease;width:100%}.primary-action:hover,.primary-action:focus-visible{background:#dff2e4;transform:translateY(-1px)}.mode-row{align-items:center;color:#f7fbf5b8;display:flex;font-size:.9rem;font-weight:800;justify-content:space-between;margin-top:.6rem;gap:.75rem}.mode-switch{background:#ffffff1a;border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#f7fbf5;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));min-height:2.35rem;padding:.18rem;position:relative;transition:background .16s ease,transform .16s ease;width:min(14.5rem,68%)}.mode-switch:before{background:#f7fbf5;border-radius:999px;content:"";inset:.18rem auto .18rem .18rem;position:absolute;transition:transform .18s ease;width:calc((100% - .36rem) / 3)}.mode-switch-ai:before{transform:translate(100%)}.mode-switch-asi:before{transform:translate(200%)}.mode-switch:hover,.mode-switch:focus-visible{background:#ffffff2e;transform:translateY(-1px)}.mode-option{align-items:center;color:#15221e;display:inline-flex;justify-content:center;position:relative;z-index:1}.mode-switch-human .mode-option:not(:first-child),.mode-switch-ai .mode-option:not(:nth-child(2)),.mode-switch-asi .mode-option:not(:last-child){color:#f7fbf5b8}