/* Daylight: the palette outside the game.
 *
 * Two rooms, on purpose. The GAME is dark -- #11161d, its own accent -- because it
 * is the table you play at, and nothing on it should compete with the tiles.
 * Everything ELSE is this: the home page, the shelf and the dictionary, a light
 * page you read rather than a room you sit in. Walking into a game is meant to be
 * a change of room; walking between the pages out here is not.
 *
 * No yellow out here. The banana accent belongs to the game and is loud on a light
 * page; links and buttons are rust instead.
 *
 * THE BOARD FRAME IS LIGHT TOO, and that is the one decision here with teeth. The
 * frame was dark for as long as the grid dots were hardcoded white-at-8% in
 * board.css -- on a pale ground they simply vanished. board.css now takes the dot
 * colour from --grid-dot, so the frame can be light and the dots darken to survive
 * it. The game does not set --grid-dot and keeps board.css's white default.
 *
 * Colour only -- no layout, no type. Each page keeps its own. Served from the repo
 * root, linked by /, the shelf and the dictionary.
 */
:root {
  /* the page */
  --page-bg: #f5f4f2;
  --page-flat: #f5f4f2;
  --ink: #3a3733;
  --dim: #837e77;
  --title: #1f1d1a;
  --rule: #e3e0db;

  /* what you can press */
  --link: #a8503a;
  --accent: #a8503a;
  --accent-ink: #fff;

  /* a raised surface: a card on the shelf, a game link on the home page, a
     comment slip. White on the page's off-white, lifted by a shadow rather than
     by a heavy border. */
  --card: #fff;
  --card-edge: #e6e3de;
  --card-ink: #3a3733;
  --card-dim: #837e77;
  --card-shadow: 0 1px 2px rgba(30, 25, 20, .08), 0 10px 22px rgba(30, 25, 20, .10);
  --card-shadow-flat: 0 1px 2px rgba(30, 25, 20, .07);

  /* fields */
  --field: #fff;
  --field-edge: #e3e0db;

  /* the board's frame, and the grid dots inside it. These two move together: a
     light frame needs dark dots. Changing one without the other loses the grid. */
  --inset: #e8e5e0;
  --inset-edge: #d5d1cb;
  --inset-shadow: inset 0 2px 6px rgba(0, 0, 0, .10);
  --grid-dot: rgba(0, 0, 0, .14);

  /* verdicts */
  --good: #3f8f45;
  --bad: #c0453f;
  --bad-text: #b13e3e;
}