/* Basketball — gym-dark arena, maple hardwood court, basketball leather backs. */

body[data-theme="basketball"] {
  --font-display: "Arial Black", "Trebuchet MS", sans-serif;
  --font-body: "Verdana", "Helvetica Neue", sans-serif;
  --font-tile-num: "Arial Black", sans-serif;

  --bg: #17171c;
  --panel: #24242c;
  --ink: #f0eee8;
  --ink-soft: #bab8b0;
  --ink-faint: #7c7a74;

  --accent: #e8641b;             /* basketball leather */
  --accent-deep: #ff8a45;
  --accent-ink: #2a1204;
  --mahj-bg: #2b5ca8;            /* home jersey blue */
  --mahj-ink: #eaf2ff;

  /* The court: maple planks, half-court line, center circle. */
  --felt: radial-gradient(circle at 50% 50%, transparent 0 56px, #b9541f 56px 60px, transparent 60px),
          linear-gradient(180deg, transparent 49.5%, #b9541f 49.5% 50.5%, transparent 50.5%),
          repeating-linear-gradient(90deg, #dda45f 0 34px, #d69b52 34px 35px, #d19549 35px 68px, #c88e42 68px 69px);
  --felt-ink: #6b3c17;
  --felt-shadow: inset 0 0 0 4px #b9541f, inset 0 0 0 6px #dda45f, inset 0 10px 36px rgba(0, 0, 0, .35);

  --chip-bg: #34343e;
  --chip-ink: #ff8a45;
  --east-bg: #e8641b;
  --east-ink: #fff;

  /* White leather tiles; backs are pebbled basketball with seams. */
  --tile-bg: linear-gradient(178deg, #fffefa, #f1ede2);
  --tile-border: 1.5px solid #c9b9a0;
  --tile-shadow: 0 3px 6px rgba(0, 0, 0, .5);
  --tile-back: linear-gradient(0deg, transparent 48.6%, #201008 48.6% 51.4%, transparent 51.4%),
               linear-gradient(90deg, transparent 48.6%, #201008 48.6% 51.4%, transparent 51.4%),
               radial-gradient(circle at 30% 30%, #f07a30, #d15a10 75%);
  --tile-back-border: 2px solid #201008;
  --tile-num: #17171c;
  --tile-sub: #8a7c64;
  --tile-joker-bg: linear-gradient(178deg, #eef2fa, #d9e4f5);
  --tile-flower-bg: linear-gradient(178deg, #fff2e4, #ffe2c4);
  --exposure-bg: rgba(232, 100, 27, .16);

  --radius-panel: 14px;
  --radius-btn: 8px;
  --radius-tile: 8px;
  --btn-bg: #34343e;
  --btn-ink: #f0eee8;
  --btn-border: 1.5px solid #464650;
  --input-border: 1.5px solid #464650;
  --shadow: 0 4px 14px rgba(0, 0, 0, .5);
  --shadow-hover: 0 6px 16px rgba(0, 0, 0, .6);

  --anim-tile-in: .2s;
  --anim-tile-in-dy: 12px;

  --cs-a: #86b7e8;
  --cs-b: #ff9a6b;
  --cs-c: #8ed0a2;
  --cs-f: #e6c65c;
}

body[data-theme="basketball"] .tile { color: #17171c; }

/* Basketball pips wrap in rows. */
body[data-theme="basketball"] .tile[data-suit="dot"] .t-glyph {
  white-space: pre-line;
  font-size: .68rem;
  line-height: 1.35;
  letter-spacing: 1px;
  text-align: center;
}
body[data-theme="basketball"] .tile.small[data-suit="dot"] .t-glyph {
  font-size: .4rem; line-height: 1.3; letter-spacing: .5px;
}
/* Jerseys, sneakers, dragons, and trophy-case winds fill the face. */
body[data-theme="basketball"] .tile[data-suit="crak"] .t-glyph.svg-glyph svg { width: 1.55em; height: 1.7em; }
body[data-theme="basketball"] .tile[data-suit="bam"] .t-glyph.svg-glyph svg { width: 1.9em; height: 1.3em; }
body[data-theme="basketball"] .tile[data-dragon] .t-glyph.svg-glyph svg { width: 1.7em; height: 1.7em; }
body[data-theme="basketball"] .tile[data-wind] .t-glyph.svg-glyph svg { width: 1.6em; height: 1.8em; }

body[data-theme="basketball"] #brand { color: var(--accent-deep); text-transform: uppercase; letter-spacing: .05em; }
body[data-theme="basketball"] .seat-label.active-turn { background: var(--accent); color: #fff; }