/* Bogey Logger Tournaments — same brand as bogeylogger.com: dark forest + aged brass. */

@font-face { font-family:'Fraunces'; src:url('../fonts/Fraunces-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url('../fonts/Fraunces-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }
@font-face { font-family:'JetBrains Mono'; src:url('../fonts/JetBrainsMono-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'JetBrains Mono'; src:url('../fonts/JetBrainsMono-Medium.ttf') format('truetype'); font-weight:500; font-display:swap; }
@font-face { font-family:'JetBrains Mono'; src:url('../fonts/JetBrainsMono-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }

:root {
  --bg-top:#0d1f17; --bg-bottom:#0a1812;
  --brass:#c9a961; --brass-dark:#a88a48;
  --text:#e8e0d0; --muted:#8a9590;
  --card:rgba(26,40,31,0.72);
  --card-border:rgba(180,150,90,0.18);
  --line:rgba(180,150,90,0.12);
  --eagle:#f4d35e; --birdie:#c9a961; --bogey:#a88a48; --double:#8a6650;
  --under:#7fb069; --over:#d98a7f;
  --success:#7fb069; --warning:#d98a7f;
  --serif:'Fraunces',Georgia,serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}

* { box-sizing:border-box; margin:0; padding:0; }
body {
  background:linear-gradient(180deg,var(--bg-top),var(--bg-bottom)) fixed;
  color:var(--text); font-family:var(--mono); font-size:15px; line-height:1.5;
  min-height:100vh;
}
a { color:var(--brass); }
button, input, select, textarea { font:inherit; color:inherit; }

.wrap { max-width:960px; margin:0 auto; padding:24px 16px 64px; }
.topbar {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; border-bottom:1px solid var(--line);
}
.brand { font-family:var(--serif); font-weight:600; font-size:20px; color:var(--text); text-decoration:none; }
.brand span { color:var(--brass); }
.topbar .who { color:var(--muted); font-size:12px; display:flex; gap:12px; align-items:center; min-width:0; }
/* A long email next to the brand wraps below it rather than widening the page. */
.topbar { flex-wrap:wrap; }
#who-email { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:50vw; }

h1 { font-family:var(--serif); font-weight:600; font-size:30px; line-height:1.15; margin-bottom:6px; }
h2 { font-family:var(--serif); font-weight:600; font-size:21px; margin-bottom:10px; }
.label { font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--brass); }
.muted { color:var(--muted); }
.small { font-size:12px; }

.card {
  background:var(--card); border:1px solid var(--card-border); border-radius:14px;
  padding:18px; margin-top:16px;
}
.row { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.row > * { min-width:0; }
.grow { flex:1; }
.stack > * + * { margin-top:10px; }

input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], input[type=search], select, textarea {
  background:rgba(10,20,15,0.7); border:1px solid var(--card-border); border-radius:10px;
  padding:10px 12px; outline:none; width:100%;
}
input:focus, select:focus, textarea:focus { border-color:var(--brass); box-shadow:0 0 0 3px rgba(201,169,97,0.15); }
textarea { min-height:110px; resize:vertical; }
label.field { display:block; font-size:11px; color:var(--muted); letter-spacing:.04em; }
label.field > input, label.field > select { margin-top:4px; }
label.check { display:flex; gap:10px; align-items:flex-start; cursor:pointer; }
label.check input { margin-top:4px; accent-color:var(--brass); }

.btn {
  background:var(--brass); color:#1a2820; border:none; border-radius:10px;
  padding:10px 18px; font-weight:600; cursor:pointer; white-space:nowrap;
}
.btn:hover { background:#d8b86b; }
/* On a small phone a long label wraps rather than pushing the page sideways. */
@media (max-width: 480px) { .btn { white-space:normal; text-align:center; } }
.btn:disabled { opacity:.45; cursor:not-allowed; }
.btn.ghost { background:transparent; color:var(--brass); border:1px solid var(--card-border); }
.btn.ghost:hover { border-color:var(--brass); }
.btn.danger { background:transparent; color:var(--warning); border:1px solid rgba(217,138,127,0.4); }
.btn.small { padding:6px 12px; font-size:13px; }
.linkish { background:none; border:none; color:var(--brass); cursor:pointer; text-decoration:underline; text-underline-offset:2px; padding:0; }

.error { color:var(--warning); font-size:13px; }
.ok { color:var(--success); font-size:13px; }
.notice {
  border:1px solid rgba(217,138,127,0.4); background:rgba(217,138,127,0.08);
  border-radius:10px; padding:10px 12px; font-size:13px;
}

.pill {
  display:inline-block; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--card-border); border-radius:999px; padding:2px 10px; color:var(--muted);
}
.pill.live { color:var(--under); border-color:rgba(127,176,105,0.5); }
.pill.final { color:var(--brass); border-color:var(--brass); }
.dot-live::before {
  content:''; display:inline-block; width:8px; height:8px; border-radius:50%;
  background:var(--under); margin-right:6px; vertical-align:middle; animation:pulse 1.6s infinite;
}
@keyframes pulse { 50% { opacity:.3; } }
@media (prefers-reduced-motion: reduce) { .dot-live::before { animation:none; } }

table { width:100%; border-collapse:collapse; }
th { text-align:left; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); font-weight:500; padding:8px 6px; border-bottom:1px solid var(--line); }
td { padding:9px 6px; border-bottom:1px solid var(--line); vertical-align:middle; }
td.num, th.num { text-align:right; font-variant-numeric:tabular-nums; }
.scroll-x { overflow-x:auto; }

.list-item { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.list-item:last-child { border-bottom:none; }

.chip {
  display:inline-flex; align-items:center; gap:6px; border:1px solid var(--card-border);
  border-radius:9px; padding:4px 8px; font-size:13px; margin:3px 4px 3px 0;
}
.chip select { width:auto; padding:2px 4px; font-size:12px; }

.tabs { display:flex; gap:6px; margin-bottom:14px; }
.tabs button { flex:1; padding:9px; border-radius:10px; border:1px solid var(--card-border); background:transparent; color:var(--muted); cursor:pointer; }
.tabs button.active { border-color:var(--brass); color:var(--brass); background:rgba(201,169,97,0.1); }

/* Long links (share URLs) wrap instead of pushing the page sideways. */
.wrap-anywhere { overflow-wrap:anywhere; word-break:break-word; }

/*
 * Tables that turn into stacked cards on a phone. Wide data tables used to
 * scroll sideways inside their card; on a small screen every row now becomes
 * its own block, each cell labelled from its data-label.
 */
@media (max-width: 640px) {
  table.cards tr.head { display:none; }
  table.cards tr { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px 10px; padding:12px 0; border-bottom:1px solid var(--line); }
  /* !important beats the fixed column widths a desktop table sets inline. */
  table.cards td { display:block; border:none; padding:0; text-align:left; width:auto !important; min-width:0; }
  table.cards td input, table.cards td select { width:100%; min-width:0; }
  table.cards td.num { text-align:left; }
  table.cards td[data-label]::before {
    content:attr(data-label); display:block; font-size:10px; color:var(--muted);
    letter-spacing:.06em; text-transform:uppercase; margin-bottom:2px;
  }
  table.cards td.span-all { grid-column:1 / -1; }
  table.cards td.span-2 { grid-column:span 2; }
}

.to-under { color:var(--under); }
.to-over { color:var(--text); }
.to-even { color:var(--text); }

[hidden] { display:none !important; }

@media print {
  body { background:#fff; color:#000; }
  .no-print { display:none !important; }
  .card { border:1px solid #999; background:#fff; break-inside:avoid; }
  a { color:#000; }
}

/* Privacy Policy and Terms, on every page but the clubhouse TV and the printed sheet. */
.legal-foot { text-align:center; margin:28px 16px 24px; font-size:12px; color:var(--muted); }
.legal-foot a { color:var(--muted); }
.legal-foot .junior-note { max-width:34em; margin:0 auto 8px; }
body.tv .legal-foot { display:none; }
