/* ============================================================
   Felt Trainer — simulator presentation layer

   Loaded after each game's geometry. This keeps the games' accurate layouts
   intact while giving every table the same brand, coaching, and control
   vocabulary as the homepage's interactive table.
   ============================================================ */

.game-screen {
  color: var(--text);
  background: var(--bg);
}

.game-screen .table-area,
.game-screen .center-col {
  background:
    radial-gradient(ellipse 70% 54% at 50% 24%, rgba(31,141,116,.22), transparent 62%),
    radial-gradient(ellipse 140% 90% at 50% 38%, transparent 48%, rgba(0,0,0,.38) 100%),
    var(--bg);
}

.game-screen .felt-surface,
.game-screen .craps-table {
  box-shadow:
    inset 0 2px 36px rgba(255,255,255,.035),
    inset 0 -18px 32px rgba(0,0,0,.18),
    0 0 0 2px var(--rail-lo),
    0 0 0 5px rgba(16,39,47,.48),
    0 16px 54px rgba(0,0,0,.5);
}

.game-screen .craps-table {
  background:
    repeating-conic-gradient(rgba(0,0,0,.015) 0% 25%, transparent 0% 50%) 0 0 / 4px 4px,
    radial-gradient(ellipse at 50% 12%, rgba(255,255,255,.09) 0%, transparent 48%),
    linear-gradient(180deg, #167b60 0%, #116b55 34%, #0b5548 100%);
  border-color: var(--rail);
}

.game-screen .felt-edge-label,
.game-screen .felt-surface::after,
.game-screen .dealer-name {
  color: var(--felt-print);
}

/* Coaching is intentionally a light physical "table card" against the dark
   simulator, matching the coach strip in the homepage preview. */
.game-screen .coach-panel {
  color: var(--ink);
  background: var(--paper-2);
  border: 2px solid var(--ink);
  border-radius: var(--radius-lg);
  box-shadow: 6px 7px 0 rgba(0,0,0,.24);
}
.game-screen .coach-panel .coach-label {
  color: var(--brand-red);
  font-weight: 800;
  letter-spacing: .07em;
}
.game-screen .coach-panel .coach-text,
.game-screen .coach-panel .coach-text .grade-sub,
.game-screen .coach-explain p { color: var(--muted-ink); }
.game-screen .coach-panel .coach-text strong { color: var(--ink); }
.game-screen .coach-explain > summary { color: var(--brand-teal); }

.game-screen .controls-area {
  background: var(--ink);
  border-top-color: rgba(255,250,240,.16);
}

.game-screen .btn-action,
.game-screen .btn-clear-bet,
.game-screen .qbtn {
  min-height: 42px;
  border-color: #4b6767;
  background: #17363c;
  color: var(--paper-2);
  font-weight: 800;
  transition: color .16s, background .16s, border-color .16s, transform .16s;
}
.game-screen .btn-action:hover:not(:disabled),
.game-screen .qbtn:hover:not(.qbtn-disabled) {
  border-color: #7d9692;
  background: #21474b;
  color: white;
  transform: translateY(-1px);
}

.game-screen .btn-deal,
.game-screen .btn-spin,
.game-screen .btn-roll,
.game-screen .btn-draw,
.game-screen .btn-play,
.game-screen .btn-raise,
.game-screen .btn-submit,
.game-screen .btn-action.primary {
  color: white;
  background: var(--brand-red);
  border-color: var(--brand-red-dark);
  box-shadow: 4px 5px 0 rgba(0,0,0,.34);
}
.game-screen .btn-deal:hover:not(:disabled),
.game-screen .btn-spin:hover:not(:disabled),
.game-screen .btn-roll:hover:not(:disabled),
.game-screen .btn-draw:hover:not(:disabled),
.game-screen .btn-play:hover:not(:disabled),
.game-screen .btn-raise:hover:not(:disabled),
.game-screen .btn-submit:hover:not(:disabled),
.game-screen .btn-action.primary:hover:not(:disabled) {
  color: white;
  background: #d94b42;
  border-color: var(--brand-red-dark);
}

.game-screen .sb-panel,
.game-screen .feedback-panel,
.game-screen .heatmap-wrap {
  background: #17363c;
  border-color: #476360;
  box-shadow: 0 5px 16px rgba(0,0,0,.2);
}

.game-screen .coaching-list .coach-card,
.game-screen .event-line,
.game-screen .grade-line,
.game-screen .bet-row-pass,
.game-screen .bet-row-odds,
.game-screen .bet-row-come,
.game-screen .bet-row-place,
.game-screen .bet-row-dont,
.game-screen .bet-row-field,
.game-screen .bet-row-big {
  border: 1px solid #476360;
}
.game-screen .coach-card.r-best,
.game-screen .event-line.evt-win,
.game-screen .grade-great { background: rgba(75,194,182,.1); border-color: rgba(75,194,182,.45); }
.game-screen .coach-card.r-good,
.game-screen .grade-good { background: rgba(91,142,201,.1); border-color: rgba(91,142,201,.42); }
.game-screen .coach-card.r-acceptable,
.game-screen .grade-ok,
.game-screen .grade-caution { background: rgba(200,154,67,.1); border-color: rgba(200,154,67,.45); }
.game-screen .event-line.evt-loss,
.game-screen .event-line.evt-seven,
.game-screen .grade-miss,
.game-screen .grade-warn { background: rgba(197,59,51,.1); border-color: rgba(235,103,94,.45); }

.game-screen .sidebar {
  background: #102b31;
  border-color: #3a5b5b;
}

.game-screen .card:not(.card-back),
.game-screen .baccarat-card,
.game-screen .vp-card {
  background-color: #fffdf7;
}

@media (max-width: 600px) {
  .game-screen .coach-panel { box-shadow: 4px 5px 0 rgba(0,0,0,.22); }
  .game-screen .btn-action { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .game-screen *,
  .game-screen *::before,
  .game-screen *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}
