/* DailyGameClub v1.9 "Boxtop" skin for the shared game chrome (loaded after games.css, on game pages only).
   Only colours, borders, radius, the depth edge and type weight: no sizes, layout or display changes, so the boards,
   their sizing on computers (fitGame) and their animations are untouched. Owned by the page design; the games
   themselves live in games.css. At the end: each board's starting height (--rh), which style.css reserves. */

/* buttons in every game: the same piece-with-an-edge as the page buttons (the border stays, transparent, so sizes don't move) */
.g-btn { border-color: transparent; border-radius: var(--r-sm); box-shadow: inset 0 0 0 1.5px var(--line-strong), 0 var(--edge-1) 0 var(--edge); font-weight: 700; transition: transform var(--dur-fast) var(--ease-spring); }
.g-btn:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 0 0 1.5px var(--line-strong), 0 1px 0 var(--edge); transition-duration: var(--dur-press); }
.g-btn:disabled { box-shadow: inset 0 0 0 1.5px var(--line); }
.g-btn[aria-pressed="true"], .g-btn[aria-checked="true"], .g-btn[aria-selected="true"], .g-btn-primary { border-color: transparent; box-shadow: 0 var(--edge-1) 0 var(--club-deep); }
.g-btn[aria-pressed="true"]:active:not(:disabled), .g-btn-primary:active:not(:disabled) { box-shadow: 0 1px 0 var(--club-deep); }
.g-tool-state { font-weight: 750; }

/* segmented controls (pencil / fill / cross …) */
.g-seg { border: 1.5px solid var(--line-strong); border-radius: var(--r-sm); box-shadow: 0 var(--edge-1) 0 var(--edge); }
.g-seg-b { font-weight: 700; }
.g-seg-b + .g-seg-b { border-left-color: var(--line-strong); }

/* option pills in the card, board, arcade, cake and robot games */
.gb-opt, .cv-opt, .ar-mode, .ck-tab, .ck-opt, .rb-opt { font-weight: 700; }
.gb-opt-label { letter-spacing: 0; text-transform: none; }

/* the small message bubble a game shows over its board */
.g-msg { border-radius: var(--r-sm); font-weight: 700; }

/* The height each board has when its game first draws it, so the page can keep that space before the script runs and
   nothing below the board moves (layout shift 0). Measured in a browser per game at 26 phone, tablet and computer
   sizes (min() and max() of straight lines in the screen width and height, a couple of pixels under the real height so
   there is never a gap); games taller than the screen need no entry (the space then reaches the bottom of the screen).
   If a game's starting layout changes, re-measure it: #game-root's height right after the game draws, at min-height 0. */
@media (max-width: 519px) {
  [data-game="word"] { --rh: 614px; }
  [data-game="quickword"] { --rh: 546px; }
  [data-game="bigword"] { --rh: calc(178px + 100vw); }
  [data-game="ladder"] { --rh: min(465px, 91px + 50vh); }
  [data-game="wheel"] { --rh: calc(617px - 1.04vh); }
  [data-game="hangman"] { --rh: min(248px + 26.67vw, 48px + 40vh); }
  [data-game="wordsearch"] { --rh: calc(148px + 100vw); }
  [data-game="groups"] { --rh: 378px; }
  [data-game="sudoku"] { --rh: calc(110px + 100vw); }
  [data-game="target"] { --rh: calc(434px + 11.43vw); }
  [data-game="equation"] { --rh: calc(158px + 75vw); }
  [data-game="slide"] { --rh: min(468px, 78px + 100vw); }
  [data-game="nonogram"] { --rh: calc(10px + 100vw); }
  [data-game="crowns"] { --rh: min(492px, 100px + 100vw); }
  [data-game="binary"] { --rh: min(448px, 152px + 40vh); }
  [data-game="lights"] { --rh: min(480px, 78px + 100vw); }
  [data-game="codebreaker"] { --rh: 365px; }
  [data-game="pairs"] { --rh: calc(27px + 79.41vw); }
  [data-game="klondike"] { --rh: calc(95px + 54.05vw); }
  [data-game="freecell"] { --rh: calc(237px + 35vw); }
  [data-game="pyramid"] { --rh: max(439px, min(-123px + 150vw, 868px - 37.88vh)); }
  [data-game="golf"] { --rh: max(357px, calc(112px + 64.71vw)); }
  [data-game="spider"] { --rh: calc(135px + 28vw); }
  [data-game="tripeaks"] { --rh: calc(125px + 48.33vw); }
  [data-game="crazy8"] { --rh: calc(233px + 94.44vw); }
  [data-game="fourinarow"] { --rh: calc(391px + 25.52vh); }
  [data-game="reversi"] { --rh: calc(448px + 23.08vh); }
  [data-game="hillrider"] { --rh: calc(702px - 0.52vh); }
}
@media (min-width: 520px) and (max-width: 599px) {
  [data-game="word"] { --rh: 614px; }
  [data-game="quickword"] { --rh: 546px; }
  [data-game="bigword"] { --rh: 614px; }
  [data-game="ladder"] { --rh: 465px; }
  [data-game="wheel"] { --rh: 608px; }
  [data-game="hangman"] { --rh: 368px; }
  [data-game="wordsearch"] { --rh: calc(-341px + 110vh); }
  [data-game="groups"] { --rh: 410px; }
  [data-game="sudoku"] { --rh: 600px; }
  [data-game="target"] { --rh: max(415px, calc(1423px - 180vw)); }
  [data-game="equation"] { --rh: 539px; }
  [data-game="slide"] { --rh: 468px; }
  [data-game="nonogram"] { --rh: min(570px, 10px + 100vw); }
  [data-game="crowns"] { --rh: 492px; }
  [data-game="binary"] { --rh: 448px; }
  [data-game="lights"] { --rh: 480px; }
  [data-game="codebreaker"] { --rh: 293px; }
  [data-game="pairs"] { --rh: 411px; }
  [data-game="klondike"] { --rh: calc(54px + 60vw); }
  [data-game="freecell"] { --rh: calc(57px + 68.57vw); }
  [data-game="pyramid"] { --rh: calc(67px + 100vw); }
  [data-game="golf"] { --rh: calc(155px + 55vw); }
  [data-game="spider"] { --rh: calc(153px + 25vw); }
  [data-game="tripeaks"] { --rh: calc(280px + 17.5vw); }
  [data-game="crazy8"] { --rh: 644px; }
}
@media (min-width: 600px) and (max-width: 1023px) {
  [data-game="word"] { --rh: 622px; }
  [data-game="quickword"] { --rh: 554px; }
  [data-game="bigword"] { --rh: 622px; }
  [data-game="ladder"] { --rh: min(473px, 414px + 6.5vh); }
  [data-game="wheel"] { --rh: 616px; }
  [data-game="hangman"] { --rh: min(376px, 322px + 6vh); }
  [data-game="wordsearch"] { --rh: 658px; }
  [data-game="groups"] { --rh: 418px; }
  [data-game="mini"] { --rh: max(884px, calc(2704px - 202.27vw)); }
  [data-game="crossword"] { --rh: calc(718px + 23.5vh); }
  [data-game="sudoku"] { --rh: 608px; }
  [data-game="target"] { --rh: 423px; }
  [data-game="equation"] { --rh: min(547px, 335px + 23.5vh); }
  [data-game="slide"] { --rh: 476px; }
  [data-game="nonogram"] { --rh: 578px; }
  [data-game="crowns"] { --rh: 500px; }
  [data-game="binary"] { --rh: 456px; }
  [data-game="lights"] { --rh: 488px; }
  [data-game="codebreaker"] { --rh: 301px; }
  [data-game="pairs"] { --rh: 419px; }
  [data-game="klondike"] { --rh: min(472px, 67px + 56vw); }
  [data-game="freecell"] { --rh: min(540px, 110px + 58vw); }
  [data-game="pyramid"] { --rh: min(725px, 359px + 47.62vw); }
  [data-game="golf"] { --rh: min(537px, 144px + 56vw); }
  [data-game="spider"] { --rh: min(351px, 77px + 38vw); }
  [data-game="tripeaks"] { --rh: min(456px, 97px + 49vw); }
  [data-game="callbreak"] { --rh: 756px; }
  [data-game="hearts"] { --rh: 756px; }
  [data-game="spades"] { --rh: 806px; }
  [data-game="crazy8"] { --rh: 652px; }
  [data-game="ginrummy"] { --rh: 689px; }
  [data-game="chess"] { --rh: 947px; }
  [data-game="checkers"] { --rh: 947px; }
  [data-game="fourinarow"] { --rh: 868px; }
  [data-game="reversi"] { --rh: 907px; }
  [data-game="ludo"] { --rh: 999px; }
  [data-game="hillrider"] { --rh: 851px; }
  [data-game="minigolf"] { --rh: calc(751px + 25vh); }
}
@media (min-width: 1024px) {
  [data-game="word"] { --rh: 838px; }
  [data-game="quickword"] { --rh: 739px; }
  [data-game="bigword"] { --rh: 838px; }
  [data-game="ladder"] { --rh: 1057px; }
  [data-game="wheel"] { --rh: 970px; }
  [data-game="hangman"] { --rh: 569px; }
  [data-game="wordsearch"] { --rh: 944px; }
  [data-game="groups"] { --rh: 676px; }
  [data-game="mini"] { --rh: 741px; }
  [data-game="crossword"] { --rh: min(1127px - 7.08vh, 96px + 75vw); }
  [data-game="sudoku"] { --rh: 971px; }
  [data-game="target"] { --rh: 662px; }
  [data-game="equation"] { --rh: 745px; }
  [data-game="slide"] { --rh: 794px; }
  [data-game="nonogram"] { --rh: 857px; }
  [data-game="crowns"] { --rh: 835px; }
  [data-game="binary"] { --rh: 782px; }
  [data-game="lights"] { --rh: 815px; }
  [data-game="codebreaker"] { --rh: 927px; }
  [data-game="pairs"] { --rh: 717px; }
  [data-game="klondike"] { --rh: min(662px, 10px + 62.5vh, 510px + 12.82vw); }
  [data-game="freecell"] { --rh: min(836px, -50px + 84vh, 47px + 66.67vw); }
  [data-game="pyramid"] { --rh: min(1117px, 814px + 25.64vw); }
  [data-game="golf"] { --rh: min(783px, 377px + 36.84vw); }
  [data-game="spider"] { --rh: min(528px, 12px + 49.19vh, 113px + 33.52vw); }
  [data-game="tripeaks"] { --rh: min(703px, 157px + 43.75vw); }
  [data-game="callbreak"] { --rh: min(1223px, 769px + 38.46vw); }
  [data-game="hearts"] { --rh: min(1223px, 769px + 38.46vw); }
  [data-game="spades"] { --rh: calc(866px + 36.36vw); }
  [data-game="crazy8"] { --rh: 1057px; }
  [data-game="ginrummy"] { --rh: min(1099px, 698px + 33.97vw); }
  [data-game="chess"] { --rh: min(1312px - 21.67vh, -315px + 102.56vw); }
  [data-game="checkers"] { --rh: min(1312px - 21.67vh, -315px + 102.56vw); }
  [data-game="fourinarow"] { --rh: min(868px, -202px + 92.11vw); }
  [data-game="reversi"] { --rh: min(1312px - 21.67vh, -315px + 102.56vw); }
  [data-game="ludo"] { --rh: min(1252px - 18.75vh, -258px + 96.15vw); }
  [data-game="highway"] { --rh: calc(1061px + 35.23vw); }
  [data-game="hillrider"] { --rh: min(1373px - 13.33vh, 373px + 62.82vw); }
  [data-game="bowling"] { --rh: calc(1100px + 35.8vw); }
  [data-game="darts"] { --rh: calc(763px + 68.75vw); }
  [data-game="minigolf"] { --rh: calc(1000px + 45.45vw); }
  [data-game="pinball"] { --rh: calc(449px + 97.16vw); }
  [data-game="cakes"] { --rh: min(864px, 406px + 34.66vw); }
}