:root {
  color-scheme: dark;
  --bg: #081018;
  --panel: #101923;
  --panel-2: #152231;
  --text: #f4f7fb;
  --muted: #95a5b5;
  --line: #253444;
  --accent: #7ee787;
  --accent-2: #58a6ff;
  --danger: #ff7b72;
  --warning: #f2cc60;
  --radius: 18px;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  background: radial-gradient(circle at top, #0e1e2d 0, var(--bg) 42%);
  color: var(--text);
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
}
button, select { font: inherit; }
button { cursor: pointer; }
.app-shell { max-width: 820px; margin: 0 auto; padding: max(20px, env(safe-area-inset-top)) 16px 40px; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
h1 { margin: 2px 0 0; font-size: clamp(30px, 7vw, 44px); letter-spacing: -0.04em; }
.eyebrow { color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.card { background: rgba(16,25,35,.92); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 18px 50px rgba(0,0,0,.22); }
.ghost-btn, .primary-btn { border:1px solid var(--line); border-radius:12px; padding:11px 14px; color:var(--text); background:var(--panel-2); font-weight:700; }
.primary-btn { width:100%; margin-top:14px; border-color:transparent; background:var(--accent); color:#071108; }
.ghost-btn:disabled { cursor:default; opacity:.45; }
.ghost-btn.active { border-color:var(--accent); color:var(--accent); }
.filters { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:12px; }
.field { display:flex; flex-direction:column; gap:6px; }
label, .label { color:var(--muted); font-size:12px; font-weight:700; }
select { width:100%; background:#0b141d; color:var(--text); border:1px solid var(--line); border-radius:10px; padding:10px; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:12px 0; }
.stat { padding:13px; display:flex; flex-direction:column; gap:4px; }
.stat span { color:var(--muted); font-size:11px; }
.stat strong { font-size:18px; }
.trainer-card { padding:18px; }
.spot-meta { display:flex; flex-wrap:wrap; gap:7px; }
.pill { display:inline-flex; align-items:center; min-height:28px; border-radius:999px; padding:5px 10px; background:rgba(126,231,135,.12); color:var(--accent); font-size:12px; font-weight:800; border:1px solid rgba(126,231,135,.24); }
.pill.secondary { color:#b8c7d9; background:#111c27; border-color:var(--line); }
.action-line { margin:16px 0 14px; color:#c9d5e2; font-size:14px; line-height:1.5; }
.board-row, .hole-cards { display:flex; gap:8px; }
.card-face { width:58px; height:78px; border-radius:10px; display:flex; flex-direction:column; justify-content:space-between; padding:8px; background:#f6f7f9; color:#111820; border:1px solid #d7dde3; box-shadow:0 5px 12px rgba(0,0,0,.2); font-weight:800; }
.card-face.red { color:#bd2c35; }
.card-face .suit { font-size:22px; align-self:flex-end; }
.hero-hand { margin:18px 0 14px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.hole-cards .card-face { width:52px; height:70px; }
.pot-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:14px 0; }
.pot-row > div { display:flex; flex-direction:column; gap:4px; }
.prompt { font-size:19px; font-weight:800; margin:18px 0 10px; }
.actions-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.action-btn { min-height:54px; border-radius:13px; border:1px solid var(--line); background:#122131; color:var(--text); font-weight:800; padding:10px; transition:transform .08s ease, border-color .2s ease; }
.action-btn:active { transform:scale(.985); }
.action-btn:hover { border-color:#48647e; }
.action-btn[disabled] { cursor:default; opacity:.72; }
.action-btn.chosen { outline:2px solid var(--accent-2); opacity:1; }
.feedback { margin-top:14px; border-radius:14px; border:1px solid var(--line); padding:14px; background:#0b141d; }
.feedback.good { border-color:rgba(126,231,135,.45); }
.feedback.bad { border-color:rgba(255,123,114,.45); }
.feedback h2 { margin:0 0 6px; font-size:18px; }
.feedback p { margin:6px 0; color:#c9d5e2; }
.freqs { margin-top:10px; display:grid; gap:7px; }
.freq-row { display:grid; grid-template-columns:110px 1fr 52px; gap:8px; align-items:center; font-size:12px; }
.bar { height:8px; border-radius:999px; background:#1a2a39; overflow:hidden; }
.bar > span { display:block; height:100%; background:linear-gradient(90deg,var(--accent-2),var(--accent)); }
.coach-card { margin-top:12px; padding:18px; }
.coach-header { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.coach-header h2 { margin:3px 0 0; font-size:22px; }
.coach-card > p { margin:14px 0; color:#c9d5e2; line-height:1.5; }
.coach-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.coach-metric { padding:11px; border:1px solid var(--line); border-radius:12px; background:#0b141d; }
.coach-metric span { display:block; color:var(--muted); font-size:11px; margin-bottom:4px; }
.coach-metric strong { font-size:15px; }
.coach-actions { display:flex; flex-wrap:wrap; gap:9px; }
.coach-note { color:var(--muted) !important; font-size:12px; margin-bottom:0 !important; }
.disclaimer { margin-top:12px; padding:15px; }
.disclaimer p { margin:6px 0 0; color:var(--muted); font-size:12px; line-height:1.5; }
.hidden { display:none !important; }

@media (max-width: 650px) {
  .filters { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .trainer-card { padding:15px; }
  .card-face { width:50px; height:68px; }
  .freq-row { grid-template-columns:92px 1fr 44px; }
  .coach-metrics { grid-template-columns:1fr; }
  .coach-actions .ghost-btn { flex:1 1 140px; }
}