/* ==========================================================
   THE INVITATIONAL — GLOBAL MASTER STYLESHEET
   All design decisions live in the token block below.
   Change a token here and it cascades through the whole app.
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600;700&family=Roboto+Mono:wght@500;700&display=swap');

:root{
  /* --- Brand palette --- */
  --pine-950:#0F1A14;
  --pine-900:#16241C;
  --pine-800:#1E2E24;
  --pine-700:#2A4032;
  --brass:#C7A155;
  --brass-dim:#8C7440;
  --clay:#B0503B;
  --clay-dim:#7A392A;
  --steel:#4C7B8C;
  --steel-dim:#345460;
  --cream:#EDE7D6;
  --cream-dim:#A9A492;

  /* --- Semantic roles (point these at palette tokens) --- */
  --bg:var(--pine-950);
  --bg-raised:var(--pine-800);
  --bg-sunken:var(--pine-900);
  --border:var(--pine-700);
  --border-subtle:var(--pine-800);
  --accent:var(--brass);
  --accent-dim:var(--brass-dim);
  --text:var(--cream);
  --text-muted:var(--cream-dim);
  --team-a:var(--clay);
  --team-a-dim:var(--clay-dim);
  --team-b:var(--steel);
  --team-b-dim:var(--steel-dim);

  /* --- Team tints --- */
  --team-a-tint:rgba(176,80,59,0.12);
  --team-a-tint-strong:rgba(176,80,59,0.35);
  --team-b-tint:rgba(76,123,140,0.12);
  --team-b-tint-strong:rgba(76,123,140,0.35);
  --accent-tint:rgba(199,161,85,0.20);

  /* --- Typography --- */
  --font-display:'Bebas Neue',sans-serif;
  --font-body:'Inter',sans-serif;
  --font-mono:'Roboto Mono',monospace;
  --fs-display:42px;
  --fs-section:23px;
  --fs-card-title:16.5px;
  --fs-body:13px;
  --fs-small:11.5px;
  --fs-micro:9.5px;
  --track-wide:.18em;
  --track-mono:.06em;

  /* --- Spacing --- */
  --sp-1:4px;
  --sp-2:6px;
  --sp-3:10px;
  --sp-4:14px;
  --sp-5:18px;
  --sp-6:28px;

  /* --- Shape --- */
  --radius:6px;
  --radius-sm:4px;
  --radius-pill:20px;
  --page-max:760px;
}

*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--pine-950); color:var(--cream); font-family:var(--font-body);
  padding-bottom:calc(60px + env(safe-area-inset-bottom));
  -webkit-text-size-adjust:100%;
}
.lock-bar{padding-top:calc(8px + env(safe-area-inset-top));}
.wrap{max-width:var(--page-max); margin:0 auto; padding:0 18px;}

/* Install hint — auto-hides once launched from the home screen */
.install-hint{
  background:var(--bg-sunken); border-bottom:1px solid var(--border);
  padding:9px 18px; text-align:center;
  font-family:var(--font-mono); font-size:10.5px; color:var(--text-muted); line-height:1.5;
}
.install-hint b{color:var(--accent); font-weight:700;}
@media (display-mode:standalone){ .install-hint{display:none;} }

.hero{
  background:radial-gradient(ellipse at top, rgba(199,161,85,0.10), transparent 60%), var(--pine-900);
  border-bottom:1px solid var(--pine-700);
  padding:34px 18px 22px;
  text-align:center;
}
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.crest{
  width:118px; height:auto; display:block; margin:0 auto 12px;
}
.hero .eyebrow{font-family:var(--font-mono); letter-spacing:.18em; font-size:10.5px; color:var(--brass); text-transform:uppercase;}
.hero h1{font-family:var(--font-display); font-size:42px; letter-spacing:.02em; line-height:1.02; margin:8px 0 4px;}
.hero .tagline{font-size:11px; letter-spacing:.14em; color:var(--cream-dim); text-transform:uppercase; margin-bottom:8px;}
.hero .dates{font-family:var(--font-mono); font-size:12.5px; color:var(--cream-dim);}

.section{padding:28px 0 6px;}
.section-title{
  font-family:var(--font-display); font-size:23px; letter-spacing:.03em; color:var(--brass);
  border-bottom:1px solid var(--pine-700); padding-bottom:8px; margin-bottom:14px;
  display:flex; justify-content:space-between; align-items:baseline;
}
.section-title small{font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim); letter-spacing:0;}

.card{background:var(--pine-800); border:1px solid var(--pine-700); border-radius:6px; padding:16px; margin-bottom:12px;}
.card h3{font-family:var(--font-display); font-size:16.5px; letter-spacing:.02em; margin-bottom:5px;}
.card p{font-size:13px; color:var(--cream-dim); line-height:1.55;}
.card p + p{margin-top:7px;}
.card p b{color:var(--cream);}

/* FORMAT TABLE */
.fmt-table{width:100%; border-collapse:collapse; font-size:12.5px;}
.fmt-table th{
  font-family:var(--font-mono); font-size:9.5px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--brass); text-align:left; padding:6px 4px; border-bottom:1px solid var(--pine-700);
}
.fmt-table td{padding:9px 4px; border-bottom:1px solid var(--pine-800); vertical-align:top;}
.fmt-table .tee-time{
  display:block; font-family:var(--font-mono); font-size:9.5px;
  color:var(--brass); white-space:nowrap; margin-top:3px; letter-spacing:0;
}
.fmt-table .date{font-family:var(--font-mono); color:var(--cream-dim); white-space:nowrap; font-size:11px;}
.fmt-table .pts{font-family:var(--font-mono); font-weight:700; color:var(--brass); text-align:center; white-space:nowrap;}
.fmt-table .course{color:var(--cream); font-weight:600;}

.tee-row{
  display:grid; grid-template-columns:1.4fr .8fr .8fr .6fr; gap:6px; align-items:center;
  padding:6px 0; border-bottom:1px solid var(--pine-800); font-size:12px;
}
.tee-row .tlbl{color:var(--cream); font-weight:600;}
.tee-row .tsub{font-family:var(--font-mono); font-size:10px; color:var(--cream-dim);}
.tee-row input{
  background:var(--pine-900); border:1px solid var(--pine-700); color:var(--cream);
  padding:6px; border-radius:4px; font-size:12px; font-family:var(--font-mono); width:100%; text-align:center;
}
.tee-head{
  display:grid; grid-template-columns:1.4fr .8fr .8fr .6fr; gap:6px;
  font-family:var(--font-mono); font-size:9.5px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--brass); padding-bottom:4px; border-bottom:1px solid var(--pine-700); margin-bottom:2px;
}
#phTable td, #phTable th{text-align:center;}
#phTable td:first-child, #phTable th:first-child{text-align:left;}
#phTable .scr{color:var(--cream-dim); font-family:var(--font-mono); font-size:11px;}
.fmt-table .fmt{color:var(--cream-dim);}

.win-banner{
  text-align:center; font-family:var(--font-display); font-size:15px; letter-spacing:.06em;
  color:var(--brass); padding:10px; margin-top:10px; border:1px dashed var(--brass-dim); border-radius:6px;
}

/* ROSTER */
.roster-row{
  display:flex; justify-content:space-between; align-items:center;
  padding:9px 0; border-bottom:1px solid var(--pine-800); font-size:13.5px;
}
.roster-row:last-child{border-bottom:none;}
.roster-row .name{font-weight:600;}
.roster-row .role{
  font-family:var(--font-mono); font-size:9.5px; color:var(--brass); text-transform:uppercase;
  letter-spacing:.06em; display:block; margin-top:2px; font-weight:400;
}
.roster-row .hcp{font-family:var(--font-mono); color:var(--cream-dim);}

.captain-toggle{display:flex; gap:8px; margin:10px 0;}
.capbtn{
  flex:1; background:var(--pine-900); border:1px solid var(--pine-700); color:var(--cream-dim);
  padding:10px; border-radius:5px; font-family:var(--font-mono); font-size:12px; cursor:pointer; text-align:center;
}
.capbtn.active.paley{background:rgba(176,80,59,0.25); border-color:var(--clay); color:var(--cream);}
.capbtn.active.strong{background:rgba(76,123,140,0.25); border-color:var(--steel); color:var(--cream);}
.draft-order-note{font-family:var(--font-mono); font-size:11px; color:var(--cream-dim); text-align:center; margin-bottom:12px;}

.pool-row{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:9px 0; border-bottom:1px solid var(--pine-800);
}
.pool-row .pname{font-size:13.5px; font-weight:600;}
.pool-row .phcp{font-family:var(--font-mono); font-size:11px; color:var(--cream-dim); display:block;}
.pool-btns{display:flex; gap:5px;}
.pool-btn{
  background:var(--pine-900); border:1px solid var(--pine-700); color:var(--cream-dim);
  padding:6px 10px; border-radius:4px; font-family:var(--font-mono); font-size:10.5px; cursor:pointer;
}
.pool-btn.sel-paley{background:rgba(176,80,59,0.3); border-color:var(--clay); color:var(--cream);}
.pool-btn.sel-strong{background:rgba(76,123,140,0.3); border-color:var(--steel); color:var(--cream);}

.team-summary{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px;}
.team-col{border-radius:6px; padding:12px;}
.team-col.red{background:var(--team-a-tint); border:1px solid var(--clay-dim);}
.team-col.blue{background:var(--team-b-tint); border:1px solid var(--steel-dim);}
.team-col .tname{font-family:var(--font-display); font-size:15px; margin-bottom:6px;}
.team-col.red .tname{color:var(--clay);}
.team-col.blue .tname{color:var(--steel);}
.team-col .plist{font-size:12px; color:var(--cream-dim); line-height:1.9;}

/* ROUND RESULT CARDS */
.round-card{margin-bottom:12px;}
.round-head{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:4px;}
.round-head .rtitle{font-family:var(--font-display); font-size:16px;}
.round-head .rpts{font-family:var(--font-mono); font-size:11px; color:var(--brass);}
.round-sub{font-size:11.5px; color:var(--cream-dim); margin-bottom:10px; line-height:1.6;}
.round-sub .rtime{font-family:var(--font-mono); font-size:11px; color:var(--brass); letter-spacing:.04em;}
.match-row{display:flex; align-items:center; justify-content:space-between; padding:6px 0;}
.match-label{font-family:var(--font-mono); font-size:11px; color:var(--cream-dim); flex:0 0 70px;}
.three-toggle{display:flex; flex:1; gap:5px;}
.tbtn{
  flex:1; text-align:center; padding:9px 4px; border-radius:5px; font-family:var(--font-mono);
  font-size:11px; cursor:pointer; background:var(--pine-900); border:1px solid var(--pine-700); color:var(--cream-dim);
}
.tbtn.on-paley{background:var(--team-a-tint-strong); border-color:var(--clay); color:var(--cream); font-weight:700;}
.tbtn.on-strong{background:var(--team-b-tint-strong); border-color:var(--steel); color:var(--cream); font-weight:700;}
.tbtn.on-halve{background:rgba(199,161,85,0.25); border-color:var(--brass-dim); color:var(--cream); font-weight:700;}

/* STANDINGS */
.standings-bar-wrap{margin-bottom:16px;}
.standings-nums{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px;}
.standings-nums .tot{font-family:var(--font-display); font-size:30px;}
.standings-nums .tot.red{color:var(--clay);}
.standings-nums .tot.blue{color:var(--steel);}
.standings-nums .mid{font-family:var(--font-mono); font-size:11px; color:var(--cream-dim); align-self:center;}
.bar-track{height:10px; background:var(--pine-900); border-radius:5px; overflow:hidden; display:flex; border:1px solid var(--pine-700);}
.bar-red{background:var(--clay); height:100%;}
.bar-blue{background:var(--steel); height:100%;}
.win-mark{
  font-family:var(--font-mono); font-size:10px; color:var(--cream-dim); text-align:center; margin-top:4px;
}
.round-tally{
  display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px solid var(--pine-800); font-size:12.5px;
}
.round-tally .rlbl{color:var(--cream-dim); font-family:var(--font-mono); font-size:11px;}
.round-tally .rscore{font-family:var(--font-mono); font-weight:700;}

.policies{font-size:12px; color:var(--cream-dim); line-height:1.9;}
.policies b{color:var(--cream);}

footer{text-align:center; padding:30px 18px 10px; font-family:var(--font-mono); font-size:10px; color:var(--pine-700); letter-spacing:.1em;}

.lock-bar{
  display:flex; justify-content:center; align-items:center; gap:8px;
  padding:8px 18px; font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim);
  border-bottom:1px solid var(--pine-700); background:var(--pine-900);
}
.lock-bar .dot{width:6px; height:6px; border-radius:50%; background:var(--cream-dim);}
.lock-bar.unlocked .dot{background:var(--brass);}
.lock-bar span.state{color:var(--cream-dim);}
.lock-bar.unlocked span.state{color:var(--brass);}
.lock-btn{
  background:none; border:1px solid var(--pine-700); color:var(--cream-dim);
  padding:4px 10px; border-radius:12px; font-family:var(--font-mono); font-size:10px; cursor:pointer;
}
.lock-bar.unlocked .lock-btn{border-color:var(--brass-dim); color:var(--brass);}

.tee-pick{padding:10px 0; border-bottom:1px solid var(--pine-800);}
.tee-pick:last-child{border-bottom:none;}
.tp-course{font-size:13.5px; font-weight:600; color:var(--cream); display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px;}
.tp-alloc{font-family:var(--font-mono); font-size:10px; color:var(--brass); letter-spacing:.06em;}
.tp-select{
  width:100%; background:var(--pine-900); border:1px solid var(--pine-700); color:var(--cream);
  padding:9px 10px; border-radius:4px; font-size:13px; font-family:var(--font-body);
  -webkit-appearance:none; appearance:none;
}
.tp-select:focus{outline:1px solid var(--brass);}
.tp-meta{font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim); margin-top:5px;}
.tp-scratch{font-family:var(--font-mono); font-size:11px; color:var(--cream-dim);}

.hcp-row{
  display:grid; grid-template-columns:1fr 84px; gap:10px; align-items:center;
  padding:8px 0; border-bottom:1px solid var(--pine-800);
}
.hcp-row:last-of-type{border-bottom:none;}
.hcp-row .hname{font-size:13.5px; font-weight:600;}
.hcp-row .hrole{font-family:var(--font-mono); font-size:9px; color:var(--brass); text-transform:uppercase; letter-spacing:.06em; display:block;}
.hcp-row input{
  background:var(--pine-900); border:1px solid var(--pine-700); color:var(--cream);
  padding:8px; border-radius:4px; font-size:13px; font-family:var(--font-mono);
  width:100%; text-align:center;
}
.hcp-row input:focus{outline:1px solid var(--brass);}
.hcp-row input:disabled{opacity:.75; border-style:dashed;}
.btn-lock{
  width:100%; margin-top:12px; padding:11px; border-radius:5px; cursor:pointer;
  background:var(--brass); color:var(--pine-950); border:none;
  font-family:var(--font-mono); font-size:12px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase;
}
.btn-lock.locked{background:transparent; border:1px solid var(--brass-dim); color:var(--brass);}
.lock-note{font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim); text-align:center; margin-top:8px;}

.pin-row{
  display:none; gap:6px; justify-content:center; align-items:center;
  padding:10px 18px; background:var(--pine-900); border-bottom:1px solid var(--pine-700);
}
.pin-row.show{display:flex;}
.pin-row input{
  background:var(--pine-950); border:1px solid var(--brass-dim); color:var(--cream);
  padding:9px 12px; border-radius:4px; font-family:var(--font-mono);
  font-size:13px; width:130px; text-align:center; letter-spacing:.15em;
}
.pin-row input:focus{outline:1px solid var(--brass);}
.pin-go, .pin-cancel{
  padding:9px 14px; border-radius:4px; cursor:pointer;
  font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.05em;
}
.pin-go{background:var(--brass); color:var(--pine-950); border:none;}
.pin-cancel{background:transparent; border:1px solid var(--pine-700); color:var(--cream-dim);}
.pin-err{
  display:none; text-align:center; padding:8px 18px; background:rgba(176,80,59,0.2);
  color:var(--clay); font-family:var(--font-mono); font-size:11px;
  border-bottom:1px solid var(--clay-dim);
}
.pin-err.show{display:block;}
.confirm-row{
  display:none; gap:6px; margin-top:10px; align-items:center; flex-wrap:wrap;
  background:var(--pine-900); border:1px solid var(--brass-dim); border-radius:5px; padding:10px;
}
.confirm-row.show{display:flex;}
.confirm-row .ctext{
  flex:1 1 100%; font-size:12px; color:var(--cream-dim); line-height:1.45; margin-bottom:4px;
}
.confirm-row button{
  flex:1; padding:9px; border-radius:4px; cursor:pointer;
  font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.05em;
}
.confirm-yes{background:var(--brass); color:var(--pine-950); border:none;}
.confirm-no{background:transparent; border:1px solid var(--pine-700); color:var(--cream-dim);}

.match-block{border-bottom:1px solid var(--border-subtle); padding-bottom:8px; margin-bottom:8px;}
.match-block:last-child{border-bottom:none; margin-bottom:0; padding-bottom:0;}
.matchup{
  display:grid; grid-template-columns:1fr 24px 1fr; gap:5px; align-items:center; margin-top:7px;
}
.mu-side{display:flex; flex-direction:column; gap:4px;}
.mu-v{
  text-align:center; font-family:var(--font-mono); font-size:9px;
  color:var(--text-muted); text-transform:uppercase;
}
.mu-select{
  width:100%; background:var(--bg-sunken); border:1px solid var(--border);
  color:var(--text); padding:6px 7px; border-radius:var(--radius-sm);
  font-family:var(--font-body); font-size:11.5px;
  -webkit-appearance:none; appearance:none;
}
.mu-select.red{border-left:3px solid var(--team-a);}
.mu-select.blue{border-left:3px solid var(--team-b);}
.mu-select:focus{outline:1px solid var(--accent);}
.mu-select option:disabled{color:var(--text-muted);}

body.locked .editable{pointer-events:none; opacity:0.5;}