Крестики-нолики на CSS

Довольно странный вариант игры. Мне хотелось понять как ещё можно сымитировать игровую логику.

Правда, без капельки JS всё-же не обошлось: я не обнаружила способ сбрасывать игру и возложила это на JS. Если попытаться обойтись совсем без него, можно было бы просто перегружать страницу.

Результат игры обрабатывается с помощью CSS. Игра заканчивается при однозначном выигрыше либо при ничьей и полностью заполненном поле.

See the Pen lnAuh by yoksel (@yoksel) on CodePen.

Теоретически можно было бы учитывать ничью до заполнения поля, это возможно, но код будет совсем длинным, так что я отказалась от этой затеи.

Ещё следовало бы сделать плавным появление панели с результатом, но у меня не получилось совладать с поведением псевдоэлементов. Анимировались некоторые свойства, которые точно об этом никто не просил, например text-indent. Для более аккуратной анимации проишлось бы увеличить код на две трети, или я просто не сообразила как это можно решить изящнее.

Я думаю, этот способ можно использовать и для полей побольше, хотя в этом случае селекторы будут километровыми, и без препроцессоров уже точно не обойтись не получится.