/* Icons, drawn as masks of the icon files so they take the text colour (currentColor) in light
   and dark without inlining their drawings. The files are ported unmodified from
   BruceDoh/turnstill-design commit 2e1fef3 (assets/icons/), each with its provenance sidecar.
   The game icons are keyed by the catalogue's game id (data-game); a game with no icon here shows
   an empty square of the same size. Not ported: casino.svg (the owner's 2026-10-15 ruling, no
   gambling), and hangman, snakes and sprouts (no package holds those games). */
.ic, .gico { -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat; }
.ic { background-color: currentColor; }
.ui-find { -webkit-mask-image: url("../icons/ui/find.svg"); mask-image: url("../icons/ui/find.svg"); }
.ui-wait { -webkit-mask-image: url("../icons/ui/wait.svg"); mask-image: url("../icons/ui/wait.svg"); }
.ui-alert { -webkit-mask-image: url("../icons/ui/alert.svg"); mask-image: url("../icons/ui/alert.svg"); }
.gico[data-game="backgammon"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/backg.svg"); mask-image: url("../icons/games/backg.svg"); }
.gico[data-game="crazy-eights"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/card8.svg"); mask-image: url("../icons/games/card8.svg"); }
.gico[data-game="checkers"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/checkers.svg"); mask-image: url("../icons/games/checkers.svg"); }
.gico[data-game="cribbage"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/crib.svg"); mask-image: url("../icons/games/crib.svg"); }
.gico[data-game="dots-and-boxes"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/dots.svg"); mask-image: url("../icons/games/dots.svg"); }
.gico[data-game="duel-tactics"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/duel.svg"); mask-image: url("../icons/games/duel.svg"); }
.gico[data-game="four-in-a-row"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/four.svg"); mask-image: url("../icons/games/four.svg"); }
.gico[data-game="fox-and-geese"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/fox.svg"); mask-image: url("../icons/games/fox.svg"); }
.gico[data-game="go"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/go.svg"); mask-image: url("../icons/games/go.svg"); }
.gico[data-game="gomoku"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/gomoku.svg"); mask-image: url("../icons/games/gomoku.svg"); }
.gico[data-game="halma"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/halma.svg"); mask-image: url("../icons/games/halma.svg"); }
.gico[data-game="hearts"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/hearts.svg"); mask-image: url("../icons/games/hearts.svg"); }
.gico[data-game="hex"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/hex.svg"); mask-image: url("../icons/games/hex.svg"); }
.gico[data-game="mancala"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/mancala.svg"); mask-image: url("../icons/games/mancala.svg"); }
.gico[data-game="nine-mens-morris"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/morris.svg"); mask-image: url("../icons/games/morris.svg"); }
.gico[data-game="ludo"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/pachisi.svg"); mask-image: url("../icons/games/pachisi.svg"); }
.gico[data-game="reversi"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/reversi.svg"); mask-image: url("../icons/games/reversi.svg"); }
.gico[data-game="rummy"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/rummy.svg"); mask-image: url("../icons/games/rummy.svg"); }
.gico[data-game="gin-rummy"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/rummy.svg"); mask-image: url("../icons/games/rummy.svg"); }
.gico[data-game="sea-battle"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/ships.svg"); mask-image: url("../icons/games/ships.svg"); }
.gico[data-game="tic-tac-toe"] { background-color: currentColor; -webkit-mask-image: url("../icons/games/ttt.svg"); mask-image: url("../icons/games/ttt.svg"); }
/* WEB-011: Your games and the account page. */
.ui-left { -webkit-mask-image: url("../icons/ui/left.svg"); mask-image: url("../icons/ui/left.svg"); }
.ui-person { -webkit-mask-image: url("../icons/ui/person.svg"); mask-image: url("../icons/ui/person.svg"); }
.ui-out { -webkit-mask-image: url("../icons/ui/out.svg"); mask-image: url("../icons/ui/out.svg"); }
.mk-finished { -webkit-mask-image: url("../icons/marks/finished.svg"); mask-image: url("../icons/marks/finished.svg"); }
/* WEB-011: the sign-in page and the friends page. */
.ui-lock { -webkit-mask-image: url("../icons/ui/lock.svg"); mask-image: url("../icons/ui/lock.svg"); }
.ui-clock { -webkit-mask-image: url("../icons/ui/clock.svg"); mask-image: url("../icons/ui/clock.svg"); }
.ui-door { -webkit-mask-image: url("../icons/ui/door.svg"); mask-image: url("../icons/ui/door.svg"); }
.ui-plus { -webkit-mask-image: url("../icons/ui/plus.svg"); mask-image: url("../icons/ui/plus.svg"); }
.ui-check { -webkit-mask-image: url("../icons/ui/check.svg"); mask-image: url("../icons/ui/check.svg"); }
.ui-close { -webkit-mask-image: url("../icons/ui/close.svg"); mask-image: url("../icons/ui/close.svg"); }