.g-reversi{--grv-black:#1b1b1b;--grv-white:#f4f4ef;--grv-felt:#1f7a4d;--grv-felt-2:#1a6a42;--grv-grid:#0f4a2c;margin:0 auto;max-width:100%;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);gap:2px;padding:3px;border-radius:10px;background:var(--grv-grid);touch-action:manipulation}.g-reversi .grv-cell{position:relative;display:grid;place-items:center;padding:0;margin:0;min-width:0;min-height:0;border:0;border-radius:2px;background:var(--grv-felt);cursor:default;font:inherit;-webkit-tap-highlight-color:transparent}.g-reversi .grv-cell.is-open{cursor:pointer}.g-reversi .grv-cell.is-open:hover{background:var(--grv-felt-2)}.g-reversi .grv-disc{width:82%;height:82%;border-radius:50%;display:block;box-shadow:0 2px 3px rgba(0,0,0,.35),inset 0 -3px 5px rgba(0,0,0,.18)}.g-reversi .grv-disc.is-black{background:var(--grv-black)}.g-reversi .grv-disc.is-white{background:var(--grv-white)}.g-reversi .grv-disc.is-flip{animation:grv-flip 360ms ease-in-out}.g-reversi .grv-disc.is-new{animation:grv-drop 200ms ease-out}.g-reversi .grv-dot{width:24%;height:24%;border-radius:50%;background:rgba(255,255,255,.5);box-shadow:0 0 0 2px rgba(0,0,0,.12)}.g-reversi .grv-cell.is-last::after{content:"";position:absolute;inset:3px;border-radius:4px;box-shadow:inset 0 0 0 3px var(--gold);pointer-events:none}.g-reversi .grv-cell.is-hint{background:#2f9a66;box-shadow:inset 0 0 0 3px #7cc7ff}.g-reversi .grv-cell.is-cursor,.g-reversi .grv-cell:focus-visible{outline:3px solid #7cc7ff;outline-offset:-3px}.g-reversi .grv-cell:focus:not(:focus-visible):not(.is-cursor){outline:none}@keyframes grv-flip{0%{transform:scaleX(1);background:var(--from)}49%{transform:scaleX(.05);background:var(--from)}51%{transform:scaleX(.05);background:var(--to)}100%{transform:scaleX(1);background:var(--to)}}@keyframes grv-drop{from{transform:scale(.4);opacity:.3}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){.g-reversi .grv-disc.is-flip,.g-reversi .grv-disc.is-new{animation:none}}