[hidden]{display:none!important}
body{margin:0}
:root{
  --club:#c0090d; --club-ink:#ffffff;
  --bg:#f0f0f0; --surface:#ffffff; --ink:#222222; --muted:#666666; --line:#dcdcdc;
  --accent:#c0090d; --accent-ink:#ffffff;
  --green:#2e8b4f; --blue:#1f63c4; --red:#c0090d; --senior:#444444;
  --chip-bg:#f3f3f3;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --club:#a3080b; --club-ink:#ffffff;
    --bg:#121212; --surface:#1d1d1d; --ink:#ececec; --muted:#a0a0a0; --line:#333333;
    --accent:#e2383c; --accent-ink:#ffffff;
    --green:#4cbf77; --blue:#5b95ec; --red:#ef5a5d; --senior:#b8b8b8;
    --chip-bg:#2a2a2a;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --club:#a3080b; --club-ink:#ffffff;
  --bg:#121212; --surface:#1d1d1d; --ink:#ececec; --muted:#a0a0a0; --line:#333333;
  --accent:#e2383c; --accent-ink:#ffffff;
  --green:#4cbf77; --blue:#5b95ec; --red:#ef5a5d; --senior:#b8b8b8;
  --chip-bg:#2a2a2a;
}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:15px/1.5 "Open Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;padding-inline:16px;padding-block:20px 48px}
.wrap{max-width:640px;margin:0 auto;display:grid;gap:16px}
.club-header{background:var(--club);color:var(--club-ink);border-radius:4px;padding:18px 18px 20px;border-bottom:4px solid rgba(0,0,0,.18)}
.brand{display:flex;align-items:center;gap:14px}
.logo{width:56px;height:56px;object-fit:contain;flex:none;background:#fff;border-radius:50%;padding:4px}
.club-header .eyebrow{color:rgba(255,255,255,.85)}
.club-header .lead{color:rgba(255,255,255,.9)}
h1{font:800 1.7rem/1.15 "Open Sans",Arial,sans-serif;margin:4px 0 0;text-wrap:balance}
.lead{color:var(--muted);margin:8px 0 0;font-size:.95rem}
.eyebrow{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:4px;padding:16px}
.panel-title{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:0 0 12px;padding-bottom:8px;border-bottom:2px solid var(--club);color:var(--ink)}
.kids{display:grid;gap:10px}
.kid{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:4px;border-left:5px solid var(--lvl)}
.num{font:800 1.3rem/1 "Open Sans",Arial,sans-serif;color:var(--muted);width:1.4em;text-align:center}
.fields{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.field{display:grid;gap:3px}
label{font-size:.8rem;color:var(--muted)}
select{font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:3px;padding:6px 8px;min-width:0}
select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.chip{display:inline-block;font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:3px;background:var(--chip-bg);color:var(--lvl);text-transform:uppercase;letter-spacing:.03em}
.price{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.price b{display:block;font-size:1.05rem}
.price s{color:var(--muted);font-size:.8rem}
.price small{display:block;color:var(--muted);font-size:.75rem}
.remove{background:none;border:0;color:var(--muted);cursor:pointer;font-size:.8rem;padding:2px 0;text-decoration:underline;text-align:left}
.remove:hover{color:var(--accent)}
.add{font:700 .9rem "Open Sans",Arial,sans-serif;background:var(--accent);color:var(--accent-ink);border:0;border-radius:3px;padding:10px 16px;cursor:pointer;text-transform:uppercase;letter-spacing:.04em}
.add:hover{filter:brightness(1.1)}
.row-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px}
.hint{color:var(--muted);font-size:.8rem}
.summary{display:grid;gap:6px;font-variant-numeric:tabular-nums}
.line{display:flex;justify-content:space-between;gap:12px}
.line span:first-child{color:var(--muted)}
.total{border-top:2px solid var(--club);margin-top:6px;padding-top:10px;display:flex;justify-content:space-between;align-items:baseline}
.total strong{font:800 1.9rem/1 "Open Sans",Arial,sans-serif;color:var(--accent)}
details{font-size:.85rem;color:var(--muted)}
summary{cursor:pointer;font-weight:700;color:var(--ink)}
table{border-collapse:collapse;width:100%;margin-top:8px;font-variant-numeric:tabular-nums}
td,th{text-align:left;padding:4px 6px;border-bottom:1px solid var(--line)}
th{font-weight:700;color:var(--ink)}
td:last-child,th:last-child{text-align:right}
.pay{display:grid;gap:10px}
.pay-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--line);border-radius:4px}
.pay-row .k{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);display:block}
.pay-row .v{font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums;user-select:all}
.copy{font:600 .8rem "Open Sans",Arial,sans-serif;background:var(--surface);color:var(--accent);border:1px solid var(--accent);border-radius:3px;padding:6px 10px;cursor:pointer}
.copy:hover{background:var(--chip-bg)}
.pay-note{font-size:.85rem;color:var(--muted);margin:0}
@media (max-width:460px){
  .kid{grid-template-columns:1fr auto}
  .num{display:none}
}