:root{
  --bg:#0b1222;
  --bg2:#111827;
  --card:rgba(17,24,39,.94);
  --card2:rgba(31,41,55,.82);
  --text:#f8fafc;
  --muted:#cbd5e1;
  --accent:#22c55e;
  --accent2:#16a34a;
  --border:rgba(255,255,255,.12);
  --shadow:0 12px 32px rgba(0,0,0,.35);
  --blue:rgba(56,189,248,.14);
  --blueBorder:rgba(56,189,248,.30);
  --blueText:#bae6fd;
  --gold:rgba(250,204,21,.18);
  --goldBorder:rgba(250,204,21,.32);
  --goldText:#fde68a;
  --red:rgba(248,113,113,.16);
  --redBorder:rgba(248,113,113,.28);
  --redText:#fecaca;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,var(--bg) 0%, var(--bg2) 100%);
}
.app{
  width:min(1120px,100%);
  margin:0 auto;
  padding:max(16px,env(safe-area-inset-top)) 14px max(28px,env(safe-area-inset-bottom));
}
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:16px;
  margin-bottom:14px;
}
.subcard{
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
h1,h2,h3,h4,p{margin-top:0}
.muted{color:var(--muted);line-height:1.45}
.small-gap{margin-bottom:8px}
.compact-list{padding-left:18px;margin:0}
.hero{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:14px;
  align-items:stretch;
}
.hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}
.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border-radius:999px;
  font-weight:800;
  font-size:14px;
  border:1px solid var(--blueBorder);
  background:var(--blue);
  color:var(--blueText);
}
.pill.gold{background:var(--gold); border-color:var(--goldBorder); color:var(--goldText);}
.pill.red{background:var(--red); border-color:var(--redBorder); color:var(--redText);}
.setup-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:14px;
}
.player-box{
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
.player-box h3{font-size:18px;margin-bottom:10px}
label{
  display:block;
  font-weight:700;
  margin-bottom:6px;
  font-size:14px;
}
input, select{
  width:100%;
  border-radius:12px;
  border:1px solid var(--border);
  background:#0f172a;
  color:var(--text);
  padding:12px 14px;
  font-size:16px;
  margin-bottom:12px;
}
input:focus, select:focus{
  outline:none;
  border-color:rgba(34,197,94,.45);
  box-shadow:0 0 0 3px rgba(34,197,94,.12);
}
.control-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  gap:12px;
  margin-top:14px;
}
.actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}
.no-top-margin{margin-top:0}
button{
  appearance:none;
  border:0;
  border-radius:14px;
  padding:14px 18px;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
}
.btn-primary{background:linear-gradient(180deg,var(--accent),var(--accent2)); color:#052e16;}
.btn-secondary{background:#334155;color:#f8fafc;}
.btn-ghost{background:rgba(255,255,255,.06); border:1px solid var(--border); color:#f8fafc;}
.hidden{display:none}
button.secondary { background:#334155; color:#f8fafc; }
.primary-action { width:100%; background:linear-gradient(180deg,var(--accent),var(--accent2)); color:#052e16; }
.restore-modal .primary-action, .restore-modal button.secondary { flex:1 1 220px; }

.live-head{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:14px;
  align-items:start;
}
.wolf-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(34,197,94,.18), rgba(22,163,74,.10));
  border:1px solid rgba(34,197,94,.28);
}
.wolf-banner strong{font-size:22px; display:block}
.wolf-rotation{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.rot{
  border:1px solid var(--border);
  border-radius:12px;
  background:#0f172a;
  padding:10px;
  text-align:center;
}
.rot.active{
  border-color:rgba(34,197,94,.35);
  box-shadow:inset 0 0 0 1px rgba(34,197,94,.16);
  background:rgba(34,197,94,.08);
}
.hole-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
  flex-wrap:wrap;
}
.hole-badge{
  padding:10px 12px;
  border-radius:12px;
  background:#0f172a;
  border:1px solid var(--border);
  font-weight:800;
}
.decision-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:12px;
}
.choice-card, .score-card, .result-box{
  background:#0f172a;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
.choice-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.choice-actions button.active{
  background:linear-gradient(180deg,var(--accent),var(--accent2));
  color:#052e16;
}
.solo-action{margin-top:10px}
.score-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:12px;
}
.result-strip{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:12px;
  margin-top:14px;
}
.leaderboard{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.leader{
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
.leader.top{
  border-color:rgba(34,197,94,.35);
  box-shadow:inset 0 0 0 1px rgba(34,197,94,.16);
}
.rank{
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  margin-bottom:8px;
}
.name{
  font-size:22px;
  font-weight:800;
  margin-bottom:6px;
}
.results-list{
  display:grid;
  gap:12px;
}
.result-row{
  display:grid;
  grid-template-columns:1fr 1fr 1.2fr 1fr 1.2fr 1.1fr;
  gap:10px;
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  align-items:center;
}
.tiny{font-size:13px;color:var(--muted)}
.strong{font-weight:800}
.heading-22{font-size:22px}
.no-margin{margin:0}
.print-only{display:none}

@media (max-width:980px){
  .hero, .live-head, .control-grid, .leaderboard, .score-grid, .setup-grid, .result-strip, .decision-grid, .result-row{
    grid-template-columns:1fr;
  }
  .choice-actions{grid-template-columns:1fr}
}
@media print{
  body{background:#fff;color:#111}
  .app{width:100%;padding:0}
  .card,.subcard,.leader,.result-row,.choice-card,.score-card,.result-box{
    background:#fff !important;
    color:#111 !important;
    box-shadow:none !important;
    border:1px solid #ddd !important;
  }
  .btn-primary,.btn-secondary,.btn-ghost,.actions,#rulesToggle,#startBtn,#saveHoleBtn,#clearScoresBtn,#resetBtn,#loneWolfBtn,#clearDecisionBtn,#pdfBtn{
    display:none !important;
  }
  .muted,.tiny{color:#444 !important}
}


.section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.setup-summary{
  margin:14px 0;
}
.setup-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.summary-box{
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
@media (max-width:980px){
  .setup-summary-grid{grid-template-columns:1fr;}
}

.setup-grid-5{grid-template-columns:1.4fr .8fr 1fr .8fr .8fr;}
.setup-grid-2{grid-template-columns:1fr 1fr;}
.readonly-pill{
  display:flex; align-items:center; min-height:50px; padding:12px 14px;
  border-radius:12px; border:1px solid var(--border); background:#0f172a; color:var(--text); font-weight:700;
}
@media (max-width:980px){
  .setup-grid-5,.setup-grid-2{grid-template-columns:1fr;}
}


.score-card{
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .12s ease;
}
.score-card.team-wolf{
  background: linear-gradient(180deg, rgba(34,197,94,.16), rgba(22,163,74,.08));
  border-color: rgba(34,197,94,.38);
  box-shadow: inset 0 0 0 1px rgba(34,197,94,.14);
}
.score-card.team-opp{
  background: linear-gradient(180deg, rgba(56,189,248,.12), rgba(56,189,248,.05));
  border-color: rgba(56,189,248,.28);
  box-shadow: inset 0 0 0 1px rgba(56,189,248,.10);
}
.score-card.team-lone{
  background: linear-gradient(180deg, rgba(250,204,21,.18), rgba(250,204,21,.08));
  border-color: rgba(250,204,21,.36);
  box-shadow: inset 0 0 0 1px rgba(250,204,21,.14);
}
.score-card.team-neutral{
  background:#0f172a;
  border-color: var(--border);
  box-shadow:none;
}
.score-card .team-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:800;
  padding:6px 10px;
  border-radius:999px;
  margin-bottom:10px;
  border:1px solid transparent;
}
.score-card.team-wolf .team-badge{
  background: rgba(34,197,94,.18);
  color: #dcfce7;
  border-color: rgba(34,197,94,.30);
}
.score-card.team-opp .team-badge{
  background: rgba(56,189,248,.16);
  color: #dbeafe;
  border-color: rgba(56,189,248,.28);
}
.score-card.team-lone .team-badge{
  background: rgba(250,204,21,.18);
  color: #fef3c7;
  border-color: rgba(250,204,21,.30);
}


/* v6 mobile compact */
.rotation-collapsible.hidden{display:none;}
@media (max-width: 820px){
  .setup-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .control-grid,
  .setup-grid-5,
  .setup-grid-2{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .live-head{
    grid-template-columns:1fr !important;
  }
  .decision-grid{
    grid-template-columns:1fr 1fr !important;
  }
  .score-grid-compact{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .score-card{
    padding:10px !important;
    min-width:0;
  }
  .score-card h4{
    font-size:13px !important;
    word-break:break-word;
    margin-bottom:8px !important;
  }
  .score-card input{
    padding:9px 8px !important;
    font-size:14px !important;
    text-align:center;
    margin-bottom:8px !important;
  }
  .score-card label{
    font-size:11px !important;
    margin-bottom:4px !important;
  }
  .score-card .team-badge{
    width:100%;
    justify-content:center;
    font-size:11px;
    padding:5px 8px;
    margin-bottom:8px;
  }
  .wolf-rotation{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width: 640px){
  .hero{
    grid-template-columns:1fr !important;
  }
  .setup-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .control-grid,
  .setup-grid-5,
  .setup-grid-2{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .decision-grid{
    grid-template-columns:1fr 1fr !important;
  }
  .score-grid-compact{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
  .actions{
    gap:8px;
  }
  button{
    padding:12px 14px !important;
    font-size:15px !important;
  }
}
@media (max-width: 460px){
  .score-grid-compact{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .decision-grid,
  .control-grid,
  .setup-grid-5,
  .setup-grid-2{
    grid-template-columns:1fr !important;
  }
}


/* v8 setup flow */
.section-head-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
#gameContent.hidden{
  display:none;
}
#setupSection.editing-from-game{
  outline: 1px solid rgba(34,197,94,.22);
}
@media (max-width:700px){
  .section-head-actions{
    width:100%;
  }
  .section-head-actions button{
    flex:1 1 auto;
  }
}


/* v10 setup hide safeguard */
#setupContent.hidden{
  display:none !important;
}
#gameContent.hidden{
  display:none !important;
}


/* v13 compact 4-tile leaderboard */
.leaderboard-compact{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.leader{
  position:relative;
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:16px;
  padding:12px;
  min-width:0;
  overflow:hidden;
}
.leader.top{
  box-shadow:none;
}
.leader.rank-1{
  background:linear-gradient(180deg, rgba(250,204,21,.18), rgba(31,41,55,.82));
  border-color:rgba(250,204,21,.32);
  box-shadow:inset 0 0 0 1px rgba(250,204,21,.10);
}
.leader.rank-2{
  background:linear-gradient(180deg, rgba(148,163,184,.18), rgba(31,41,55,.82));
  border-color:rgba(148,163,184,.30);
  box-shadow:inset 0 0 0 1px rgba(148,163,184,.08);
}
.leader.rank-3{
  background:linear-gradient(180deg, rgba(180,83,9,.18), rgba(31,41,55,.82));
  border-color:rgba(180,83,9,.30);
  box-shadow:inset 0 0 0 1px rgba(180,83,9,.08);
}
.leader.rank-4{
  background:linear-gradient(180deg, rgba(248,113,113,.14), rgba(31,41,55,.82));
  border-color:rgba(248,113,113,.26);
}
.rank{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:28px;
  padding:0 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  margin-bottom:10px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.08);
  color:var(--text);
  letter-spacing:normal;
  text-transform:none;
}
.name{
  font-size:18px;
  font-weight:800;
  line-height:1.1;
  margin-bottom:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.leader .muted{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
  font-size:13px;
  line-height:1.3;
  margin:0 0 8px 0;
}
.leader .muted:last-child{
  margin-bottom:0;
}
.money-plus{ color:#86efac; font-weight:800; }
.money-minus{ color:#fca5a5; font-weight:800; }

@media (max-width: 860px){
  .leaderboard-compact{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width: 520px){
  .leaderboard-compact{
    grid-template-columns:1fr 1fr !important;
  }
  .leader{
    padding:10px;
  }
  .name{
    font-size:16px;
  }
  .leader .muted{
    font-size:12px;
  }
}


/* v15: lone wolf button same size as partner buttons on mobile */
@media (max-width: 820px){
  .choice-actions{
    grid-template-columns:1fr !important;
  }
  .solo-action{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    margin-top:8px !important;
  }
  .solo-action .btn-primary,
  .solo-action .btn-secondary,
  .choice-actions .btn-secondary,
  .choice-actions .btn-primary{
    width:100% !important;
    min-height:46px;
    padding:12px 14px !important;
    font-size:15px !important;
    border-radius:12px !important;
  }
}


/* v16: lone wolf neutral until actually selected */
#loneWolfBtn.active{
  background: linear-gradient(180deg,var(--accent),var(--accent2)) !important;
  color:#052e16 !important;
  border:none !important;
}


/* v22 clean setup/game flow */
.section-head-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
#setupSection.setup-hidden{
  display:none !important;
}
#gameContent.hidden{
  display:none !important;
}
#gameCourseSummary{
  margin-top:4px;
  font-size:13px;
}
@media (max-width:700px){
  .section-head-actions{
    width:100%;
  }
  .section-head-actions button{
    flex:1 1 auto;
  }
}


/* v25: history wrapping + edit action */
.results-list .result-row,
.results-list .result-row *{
  min-width: 0;
}
.results-list .result-row .strong,
.results-list .result-row .tiny,
.results-list .result-row div{
  overflow-wrap:anywhere;
  word-break:break-word;
}
.history-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:6px;
}
.btn-small{
  appearance:none;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  color:#f8fafc;
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
@media (max-width: 700px){
  .result-row{
    overflow:hidden;
  }
}


/* v29 indexeddb restore modal */
.restore-meta{
  display:grid;
  gap:10px;
  margin:14px 0 6px;
}
.restore-meta-box{
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px;
}
.autosave-note{
  color:var(--muted);
  font-size:13px;
  margin-top:4px;
}


/* v37 chicago-exact restore modal */
.restore-meta strong{display:block;margin-bottom:4px;}

.modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  z-index:999;
}
.restore-modal.hidden{display:none !important;}
.restore-modal{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  z-index:1000;
}
.restore-modal-card{
  width:min(560px, 100%);
  background:var(--card-bg, #1b1b1b);
  border:1px solid var(--border);
  border-radius:18px;
  padding:22px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.action-row{display:flex;gap:12px;flex-wrap:wrap;}
.mt-12{margin-top:12px;}