/* =========================================================
   White Fudge Invitational — whitefudge.golf
   Direction: The Clubhouse throughout; dark board retained for /locker.php
   ========================================================= */

:root{
  /* clubhouse */
  --paper:#f6f3e9;
  --paper-2:#fffdf7;
  --ink:#17211a;
  --green:#1f4630;
  --green-2:#2d6244;
  --gold:#6b5015;
  --rule:#c2b99e;
  --rule-soft:#e3ddcc;
  --mute:#3e4842;
  /* broadcast board */
  --board:#0e1412;
  --board-2:#161e1b;
  --board-ink:#eef2ef;
  --board-mute:#a3b1a9;
  --lime:#c8f169;
  --stone:#2a3531;
  --rock:#b8a48a;
  /* teams */
  --teamA:#c8f169;
  --teamB:#e8925a;

  --f-display:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --f-text:'Source Serif 4','Source Serif Pro',Georgia,'Times New Roman',serif;
  --f-body:'Libre Franklin',system-ui,-apple-system,'Segoe UI',Helvetica,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --f-slab:'Anton',Impact,'Arial Narrow Bold',sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:17.5px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;text-wrap:balance}
a{color:var(--green);text-decoration-thickness:1px;text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.wrap{max-width:1060px;margin:0 auto;padding:0 22px}
.narrow{max-width:760px}

/* ---------- shared bits ---------- */
.label{
  font-family:var(--f-body);font-size:11.5px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gold);
}
.rule-head{
  border-bottom:1px solid var(--rule);
  padding-bottom:9px;margin-bottom:18px;
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.rule-head h2{font-family:var(--f-display);font-weight:600;font-size:35px;line-height:1.1;color:var(--green)}
.rule-head .note{font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
section{padding:56px 0}
section + section{padding-top:0}

/* ---------- masthead ---------- */
.masthead{
  text-align:center;padding:46px 0 34px;
  border-bottom:1px solid var(--rule);
}
.masthead .est{font-family:var(--f-body);font-size:11.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.masthead h1{
  font-family:var(--f-display);font-weight:600;
  font-size:clamp(42px,8.2vw,86px);line-height:.94;color:var(--green);
  margin:12px 0 8px;letter-spacing:.005em;
}
.masthead .sub{font-family:var(--f-text);font-style:italic;font-weight:400;font-size:clamp(17px,2.2vw,21px);color:var(--mute)}
.masthead .motto{margin-top:16px;font-size:12px;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:var(--mute)}

nav.club{
  display:flex;justify-content:center;gap:0;flex-wrap:wrap;
  border-bottom:1px solid var(--rule);
}
nav.club a{
  font-size:13px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;
  color:var(--mute);text-decoration:none;padding:13px 18px;border-bottom:2px solid transparent;
}
nav.club a:hover{color:var(--green)}
nav.club a[aria-current="page"]{color:var(--green);border-bottom-color:var(--gold)}

/* ---------- countdown strip ---------- */
.strip{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--rule);background:var(--paper-2)}
.strip div{flex:1 1 130px;padding:16px 14px;text-align:center;border-right:1px solid var(--rule-soft)}
.strip div:last-child{border-right:0}
.strip b{
  display:block;font-family:var(--f-display);font-weight:600;font-size:34px;line-height:1;
  color:var(--green);font-variant-numeric:tabular-nums;
}
.strip span{font-size:11.5px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--mute);display:block;margin-top:6px}

/* ---------- itinerary ---------- */
.day{margin-bottom:26px}
.day h3{
  font-family:var(--f-body);font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);border-bottom:1px solid var(--rule-soft);padding-bottom:7px;margin-bottom:6px;
}
.entry{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px dotted var(--rule)}
.entry:last-child{border-bottom:0}
.entry time{font-family:var(--f-mono);font-size:13.5px;font-weight:500;color:var(--green);font-variant-numeric:tabular-nums;padding-top:3px;letter-spacing:.02em}
.entry strong{display:block;font-weight:600;font-size:17.5px;letter-spacing:-.005em}
.entry p{margin:6px 0 0;font-family:var(--f-text);font-size:18px;line-height:1.58;color:var(--ink)}
.entry .meta{font-family:var(--f-mono);font-size:13px;color:var(--gold);letter-spacing:.03em;margin-top:7px}
@media(max-width:560px){
  .entry{grid-template-columns:1fr;gap:2px}
  .entry time{padding-top:0}
}

/* ---------- two column ---------- */
.two{display:grid;grid-template-columns:1.1fr .9fr;gap:44px}
@media(max-width:820px){.two{grid-template-columns:1fr;gap:34px}}

/* ---------- bylaws ---------- */
.bylaws{font-family:var(--f-text);font-size:18px;line-height:1.6;color:var(--ink)}
.bylaws li{margin:0 0 14px;list-style:none}
.bylaws ol{padding:0;margin:0;counter-reset:by}
.bylaws li::before{
  counter-increment:by;content:counter(by,upper-roman) ".";
  font-family:var(--f-body);font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--gold);
  display:inline-block;min-width:36px;
}

/* ---------- roster ---------- */
.roster{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
@media(max-width:640px){.roster{grid-template-columns:repeat(2,1fr)}}
.roster div{text-align:center;padding:18px 8px;border-right:1px solid var(--rule-soft)}
.roster div:last-child{border-right:0}
.roster b{display:block;font-family:var(--f-display);font-weight:600;font-size:28px;color:var(--green)}
.roster span{display:block;font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-top:4px}
.roster em{display:block;font-family:var(--f-text);font-style:italic;font-size:16px;color:var(--ink);margin-top:9px;line-height:1.45}

/* ---------- courses ---------- */
.courses{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:0;border:1px solid var(--rule);background:var(--paper-2)}
.course{padding:22px 20px;border-right:1px solid var(--rule-soft)}
.course:last-child{border-right:0}
@media(max-width:800px){.course{border-right:0;border-bottom:1px solid var(--rule-soft)}.course:last-child{border-bottom:0}}
.course h3{font-family:var(--f-display);font-weight:600;font-size:28px;color:var(--green);line-height:1.05}
.course .tee{font-family:var(--f-mono);font-size:12.5px;color:var(--gold);letter-spacing:.08em;margin:8px 0 12px}
.course dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0 0 14px;font-size:14.5px}
.course dt{font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);padding-top:2px}
.course dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.course p{margin:0;font-family:var(--f-text);font-size:16.5px;line-height:1.55;color:var(--ink)}

/* =========================================================
   CLUBHOUSE PANELS (home page: standing + the draw)
   ========================================================= */
.panel{
  border:1px solid var(--rule);
  background:var(--paper-2);
  border-radius:3px;
  overflow:hidden;
}
.panel-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:18px 24px 14px;border-bottom:1px solid var(--rule);
}
.panel-head h2,.panel-head h3{
  font-family:var(--f-display);font-weight:600;font-size:32px;line-height:1.05;color:var(--green);
}
.panel-head .k{font-size:11.5px;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.panel-body{padding:20px 24px 24px}
.status{
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mute);border:1px solid var(--rule);padding:4px 9px;border-radius:2px;white-space:nowrap;
}
.status.on{color:var(--green);border-color:var(--green)}

/* standing table */
table.standing{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
table.standing th{
  font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);
  text-align:right;padding:0 0 10px;border-bottom:1px solid var(--rule);
}
table.standing th:first-child,table.standing td:first-child{text-align:left}
table.standing td{padding:14px 0;border-bottom:1px dotted var(--rule);text-align:right;font-size:17.5px;color:var(--ink)}
table.standing tr:last-child td{border-bottom:0}
table.standing .who{font-family:var(--f-display);font-weight:600;font-size:26px;color:var(--green);line-height:1.1}
table.standing .pos{
  font-family:var(--f-mono);font-size:12.5px;color:var(--gold);padding-right:12px;
  display:inline-block;min-width:16px;
}
table.standing .num{font-family:var(--f-display);font-weight:600;font-size:26px;color:var(--ink)}
table.standing tr.lead .num{color:var(--gold)}
table.standing .flag{
  display:inline-block;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);border:1px solid var(--gold);border-radius:2px;padding:2px 6px;margin-left:10px;
  vertical-align:middle;
}
.empty-note{
  font-family:var(--f-text);font-size:18px;line-height:1.6;color:var(--ink);margin:4px 0 0;
}
.panel .stamp-c{
  margin-top:16px;font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);
}
.panel .aside{
  margin:22px 0 0;font-family:var(--f-text);font-size:18px;line-height:1.6;color:var(--ink);
  border-left:2px solid var(--gold);padding-left:15px;
}

/* the draw */
.draw{margin:0;padding:0;list-style:none}
.draw li{padding:14px 0;border-bottom:1px dotted var(--rule)}
.draw li:last-child{border-bottom:0}
.draw .rd{font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:7px}
.draw .tie{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.draw .side{font-family:var(--f-display);font-weight:600;font-size:22px;color:var(--green);flex:1 1 40%;line-height:1.2}
.draw .side.b{text-align:right}
.draw .side.win{color:var(--gold)}
.draw .side.win::after{content:' \25B8';font-size:12px;vertical-align:2px}
.draw .v{font-family:var(--f-display);font-style:italic;font-size:18px;color:var(--mute);flex:0 0 auto}
.draw .sc{
  font-family:var(--f-display);font-weight:600;font-size:22px;color:var(--ink);
  font-variant-numeric:tabular-nums;flex:0 0 auto;
}

/* =========================================================
   CLUBHOUSE SCORECARD
   ========================================================= */
.cardwrap{overflow-x:auto;border:1px solid var(--rule);background:var(--paper-2);border-radius:2px}
table.card{
  width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;
  font-family:var(--f-mono);font-size:13.5px;white-space:nowrap;
}
table.card th,table.card td{
  padding:9px 6px;text-align:center;border-right:1px solid var(--rule-soft);
  border-bottom:1px solid var(--rule-soft);min-width:33px;
}
table.card tr > *:last-child{border-right:0}
table.card tbody tr:last-child > *{border-bottom:0}

table.card thead th{
  background:var(--green);color:var(--paper);font-weight:600;
  font-size:12px;letter-spacing:.04em;border-right-color:rgba(255,255,255,.22);
  border-bottom:0;
}
table.card thead th.agg{background:#173626}

table.card th.rowlab,table.card td.rowlab{
  position:sticky;left:0;z-index:2;text-align:left;padding-left:12px;padding-right:14px;
  font-family:var(--f-body);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  min-width:142px;background:var(--paper-2);border-right:1px solid var(--rule);
}
table.card thead th.rowlab{background:var(--green);color:var(--paper);border-right-color:rgba(255,255,255,.16)}

table.card tr.parline td{background:#eae3cd;font-weight:600;color:var(--ink)}
table.card tr.parline td.rowlab{background:#eae3cd;color:var(--ink)}
table.card tr.info td{color:var(--ink)}
table.card td.agg{background:#eae3cd;font-weight:600}
table.card td.blank{color:#8d8873}

/* team rows */
table.card tr.team td.rowlab{
  font-family:var(--f-display);font-size:18px;font-weight:600;letter-spacing:0;text-transform:none;
  color:var(--green);
}
table.card tr.team.b td.rowlab{color:var(--gold)}
table.card td.w{background:var(--green);color:var(--paper);font-weight:600}
table.card tr.team.b td.w{background:var(--gold)}
table.card td.h{background:#d9cfae;color:var(--ink);font-weight:600}
table.card td.n{color:#8d8873}

/* tee picker */
.tees{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:0 0 12px}
.tees .lab{font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-right:4px}
.tees button{
  font-family:var(--f-mono);font-size:12px;letter-spacing:.04em;padding:7px 12px;cursor:pointer;
  background:transparent;color:var(--mute);border:1px solid var(--rule);border-radius:2px;
}
.tees button[aria-pressed="true"]{background:var(--green);color:var(--paper);border-color:var(--green)}

.cardmeta{
  display:flex;gap:18px;flex-wrap:wrap;margin:12px 0 0;
  font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);
}
.cardmeta b{color:var(--ink);font-weight:600}
.legend{
  display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-top:16px;
  font-size:11.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);
}
.legend i{display:inline-block;width:13px;height:13px;border-radius:2px;vertical-align:-2px;margin-right:6px}
.legend .sa{background:var(--green)} .legend .sb{background:var(--gold)} .legend .sh{background:#d9cfae}

/* =========================================================
   BROADCAST BOARD (locker page only)
   ========================================================= */
.board{
  background:var(--board);
  color:var(--board-ink);
  border-radius:4px;
  overflow:hidden;
  font-family:var(--f-body);
}
.board-head{
  padding:20px 22px 16px;
  background:
    radial-gradient(120% 100% at 82% 0%, rgba(200,241,105,.14) 0%, rgba(200,241,105,0) 58%),
    linear-gradient(180deg,#121a17 0%,#0e1412 100%);
  border-bottom:1px solid var(--stone);
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.board-head h2{font-family:var(--f-slab);font-weight:400;text-transform:uppercase;font-size:26px;letter-spacing:.01em;line-height:1}
.board-head .kicker{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--lime);margin-bottom:8px}
.chip{
  display:inline-block;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:4px 8px;border-radius:3px;background:var(--stone);color:var(--board-mute);
}
.chip.on{background:rgba(200,241,105,.15);color:var(--lime)}
.board-body{padding:20px 22px 24px}

table.lb{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:14px}
table.lb th{
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--board-mute);font-weight:400;text-align:right;padding:0 0 9px;
}
table.lb th:first-child,table.lb td:first-child{text-align:left}
table.lb td{padding:11px 0;border-top:1px solid var(--stone);text-align:right}
table.lb td:first-child{font-weight:600}
table.lb .pos{font-family:var(--f-mono);font-size:11px;color:var(--rock);padding-right:11px}
table.lb tr.lead td{color:var(--lime)}
table.lb .pts{font-family:var(--f-slab);font-size:19px;font-weight:400;letter-spacing:.02em}

.matchline{
  display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--stone);flex-wrap:wrap;
}
.matchline:first-of-type{border-top:0}
.matchline .rd{font-family:var(--f-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--board-mute);flex:0 0 100%}
.matchline .side{flex:1 1 130px;font-size:13.5px;font-weight:600}
.matchline .side.b{text-align:right}
.matchline .sc{
  font-family:var(--f-slab);font-size:24px;letter-spacing:.03em;color:var(--lime);
  font-variant-numeric:tabular-nums;flex:0 0 auto;padding:0 6px;
}
.matchline .dim{color:var(--board-mute)}

.board .note{
  margin:18px 0 0;font-size:13px;color:var(--board-mute);line-height:1.5;
  border-left:2px solid var(--lime);padding-left:13px;
}
.board .stamp{margin-top:16px;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--board-mute)}

/* hole grid inside the board */
.holes{overflow-x:auto;margin-top:6px}
table.hg{width:100%;min-width:520px;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:12px}
table.hg th,table.hg td{padding:7px 3px;text-align:center;border-bottom:1px solid var(--stone)}
table.hg th{font-family:var(--f-mono);font-size:9px;letter-spacing:.06em;color:var(--board-mute);font-weight:400}
table.hg td:first-child,table.hg th:first-child{
  text-align:left;padding-left:0;padding-right:12px;white-space:nowrap;font-weight:600;font-size:12px;
}
table.hg .par td{color:var(--board-mute);font-size:11px}
table.hg .won{color:var(--board);background:var(--lime);font-weight:700;border-radius:2px}
table.hg .wonB{color:var(--board);background:var(--teamB);font-weight:700;border-radius:2px}
table.hg .half{color:var(--rock)}
table.hg .empty{color:var(--stone)}
table.hg .tot{color:var(--board-ink);font-weight:700;border-left:1px solid var(--stone)}

.round-card{margin-top:26px;padding-top:22px;border-top:1px solid var(--stone)}
.round-card:first-of-type{margin-top:0;padding-top:0;border-top:0}
.round-card h3{font-family:var(--f-slab);font-weight:400;text-transform:uppercase;font-size:17px;letter-spacing:.03em}
.round-card .when{font-family:var(--f-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--board-mute);margin:5px 0 14px}
.pairs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.pair{font-size:12.5px;font-weight:600;padding:6px 11px;border-radius:3px;border:1px solid var(--stone)}
.pair.a{color:var(--teamA);border-color:rgba(200,241,105,.35)}
.pair.b{color:var(--teamB);border-color:rgba(232,146,90,.35)}

/* ---------- callout / footer ---------- */
.callout{
  border:1px solid var(--rule);background:var(--paper-2);padding:22px 24px;border-radius:3px;
  font-family:var(--f-text);font-size:17.5px;line-height:1.6;color:var(--ink);
}
.callout small{
  display:block;font-family:var(--f-body);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold);margin-bottom:10px;
}
footer.club{
  margin-top:64px;border-top:1px solid var(--rule);padding:26px 0 60px;text-align:center;
  font-size:13px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--mute);
}
footer.club a{color:var(--mute)}

.btn{
  display:inline-block;font-family:var(--f-body);font-size:12.5px;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;padding:12px 20px;border-radius:2px;text-decoration:none;
  background:var(--green);color:var(--paper);border:1px solid var(--green);cursor:pointer;
}
.btn:hover{background:var(--green-2)}
.btn.ghost{background:transparent;color:var(--green)}

/* =========================================================
   PHONES — the standing is the point, so get to it fast.
   The masthead shrinks, the stats strip drops out entirely
   (its countdown reappears inside the panel), and the nav
   becomes one scrollable row instead of wrapping to three.
   ========================================================= */
.cd-mini{display:none}

@media(max-width:700px){
  .masthead{padding:24px 0 16px}
  .masthead h1{font-size:clamp(32px,9vw,44px);margin:8px 0 6px}
  .masthead .est{font-size:10.5px;letter-spacing:.2em}
  .masthead .sub{font-size:16px}
  .masthead .motto{display:none}

  nav.club{
    justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  nav.club::-webkit-scrollbar{display:none}
  nav.club a{padding:12px 14px;font-size:12.5px;white-space:nowrap}

  /* the five stat tiles cost 220px above the fold on a phone */
  .strip{display:none}

  section{padding:22px 0}
  /* the kicker wraps to two lines and pushes the status chip onto a third;
     the heading and the aside already say what it says */
  .panel-head .k{display:none}
  .panel-head{padding:15px 18px 13px;align-items:center}
  .panel-head h2,.panel-head h3{font-size:27px}
  .panel-body{padding:16px 18px 20px}

  .cd-mini{
    display:block;margin-top:7px;
    font-family:var(--f-mono);font-size:12px;font-weight:500;
    letter-spacing:.08em;text-transform:uppercase;color:var(--mute);
  }

  table.standing td{padding:11px 0}
  table.standing .who{font-size:24px}
  table.standing .num{font-size:24px}
  .panel .aside{font-size:17px}
}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
