:root { --ink:#172033; --muted:#657085; --line:#e3e7ee; --surface:#fff; --soft:#f5f7fa; --brand:#567DAC; --brand-dark:#075b9b; --success:#147a4b; --danger:#b42318; --radius:16px; --green:#3FA583; --blue:#567DAC; --blue-light:#7baae0; --name-field-bg:#eef8f4; --name-field-border:#b7dfcc;}
* { box-sizing:border-box; }
html { font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:var(--soft); }
body { margin:0; min-height:100vh; display:flex; flex-direction:column; }
a { color:var(--brand-dark); }
.container { width:min(1160px,calc(100% - 32px)); margin-inline:auto; }
.site-header { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; }
.header-inner { min-height:76px; display:flex; align-items:center; gap:28px; }
.brand img { display:block; width:150px; height:auto; }
.main-nav { flex:1; }
.main-nav ul { display:flex; gap:22px; list-style:none; padding:0; margin:0; }
.main-nav a,.user-menu a,.link-button { text-decoration:none; font-weight:650; color:var(--ink); }
.user-menu { display:flex; align-items:center; gap:14px; }
.user-menu form { margin:0; }
.link-button { border:0; background:none; cursor:pointer; font:inherit; padding:0; }
.menu-toggle { display:none; }
.site-main { flex:1; padding:54px 0 72px; }
.site-footer { background:#172033; color:#fff; padding:34px 0; }
.footer-inner { display:flex; justify-content:space-between; gap:24px; }
.footer-inner p { color:#c8d0dd; margin:.35rem 0 0; }
.footer-inner a { color:#fff; margin-left:20px; }
.user-menu .button {background: var(--green);color:#fff;border:1px solid var(--green);}
.hero { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr); gap:32px; align-items:center; padding:42px 0 58px; }
.hero h1,.page-heading h1 { font-size:clamp(2.2rem,5vw,4.5rem); line-height:1.02; letter-spacing:-.045em; margin:.45rem 0 1rem; }
.hero p,.page-heading p { font-size:1.15rem; color:var(--muted); max-width:720px; }
.hero-card,.panel,.stat-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 12px 32px rgba(23,32,51,.05); }
.hero-card { padding:28px; }
.hero-card ul { margin:14px 0 0; padding-left:20px; line-height:1.9; }
.eyebrow { color:var(--brand-dark); font-weight:800; text-transform:uppercase; letter-spacing:.1em; font-size:.77rem; }
.hero-actions,.toolbar { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.button { display:inline-flex; justify-content:center; align-items:center; border:1px solid var(--brand); background:var(--brand); color:#fff; border-radius:10px; padding:12px 18px; font-weight:750; text-decoration:none; cursor:pointer; }
.button:hover { background:var(--brand-dark); border-color:var(--brand-dark); }
.button-secondary { color:var(--brand-dark); background:#fff; }
.button-small { padding:8px 12px; }
.button.disabled { opacity:.48; cursor:not-allowed; }
.feature-grid,.stat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.panel { padding:28px; margin-bottom:22px; }
.panel h1,.panel h2 { margin-top:0; }
.stat-card { padding:24px; display:flex; flex-direction:column; gap:6px; }
.stat-card span,.stat-card small { color:var(--muted); }
.stat-card strong { font-size:2.35rem; }
.page-heading { margin-bottom:28px; }
.page-heading h1 { font-size:clamp(2rem,4vw,3.6rem); }
.auth-card { width:min(520px,100%); margin:0 auto; }
.auth-card form { display:grid; gap:16px; margin-top:24px; }
label { display:grid; gap:7px; font-weight:700; }
input,select,textarea { width:100%; border:1px solid #cbd2dc; border-radius:10px; padding:12px 13px; font:inherit; background:#fff; }
input:focus { outline:3px solid rgba(2,125,213,.14); border-color:var(--brand); }
label small,.auth-note { color:var(--muted); font-weight:400; }
.checkbox-label { display:flex; grid-template-columns:auto 1fr; align-items:flex-start; }
.checkbox-label input { width:auto; margin-top:4px; }
.notice { padding:14px 16px; border-radius:10px; margin-bottom:18px; border:1px solid; }
.notice.success { color:var(--success); background:#ecfdf3; border-color:#abefc6; }
.notice.error { color:var(--danger); background:#fef3f2; border-color:#fecdca; }
.notice.development { color:#6941c6; background:#f4f3ff; border-color:#d9d6fe; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; }
th,td { padding:14px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; }
th { color:var(--muted); font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; }
.empty-state { text-align:center; color:var(--muted); padding:36px; }
.status { display:inline-block; border-radius:999px; padding:5px 9px; font-size:.78rem; font-weight:750; background:#eef2f6; }
.status-active,.status-approved,.status-verified,.status-completed { background:#dcfae6; color:#067647; }
.status-pending,.status-pending_verification,.status-pending_approval { background:#fff4cc; color:#7a5b00; }
.definition-list > div,.membership-list > div { display:grid; grid-template-columns:160px 1fr auto; gap:16px; padding:14px 0; border-bottom:1px solid var(--line); }
.definition-list span,.membership-list span { color:var(--muted); }
.toolbar { justify-content:space-between; margin-bottom:24px; }
.toolbar h1 { margin:0; }
.debug-error { white-space:pre-wrap; overflow:auto; background:#111827; color:#fff; padding:18px; border-radius:10px; }
@media (max-width:800px) {
  .hero,.feature-grid,.stat-grid { grid-template-columns:1fr; }
  .menu-toggle { display:block; margin-left:auto; }
  .main-nav { display:none; position:absolute; left:16px; right:16px; top:70px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px; }
  .main-nav.is-open { display:block; }
  .main-nav ul { flex-direction:column; }
  .user-menu { margin-left:auto; }
  .user-menu .notification-link { display:none; }
  .footer-inner { flex-direction:column; }
  .footer-inner a { margin:0 18px 0 0; }
  .definition-list > div,.membership-list > div { grid-template-columns:1fr; gap:4px; }
}

/* Phase 2: clubs, players and memberships */
.toolbar-actions,.row-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.split-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.8fr); gap:22px; align-items:start; }
.player-directory-grid { grid-template-columns:minmax(0,1.5fr) minmax(300px,.65fr); }
.form-grid { display:grid; gap:16px; }
.form-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.filter-grid { display:grid; grid-template-columns:minmax(220px,2fr) repeat(2,minmax(160px,1fr)) auto; gap:14px; align-items:end; }
.filter-grid .button { min-height:47px; }
.inline-form { display:inline-flex; gap:8px; align-items:center; margin:0; }
.reject-form { align-items:stretch; }
.compact-input { min-width:150px; padding:8px 10px; }
.button-danger { background:var(--danger); border-color:var(--danger); }
.button-danger:hover { background:#912018; border-color:#912018; }
.danger-link { color:var(--danger); }
.notice.warning { color:#7a4d00; background:#fffaeb; border-color:#fedf89; }
.status-suspended,.status-disabled,.status-rejected,.status-inactive,.status-cancelled,.status-merged { color:#b42318; background:#fee4e2; }
.status-provisional,.status-open,.status-scheduled { color:#175cd3; background:#eff8ff; }
.status-claimed { color:#067647; background:#dcfae6; }
.profile-heading,.player-cell { display:flex; align-items:center; gap:14px; }
.profile-heading { margin-bottom:22px; }
.profile-heading h2,.player-cell strong { margin:0; }
.profile-heading p,.player-cell small { display:block; margin:.25rem 0 0; color:var(--muted); }
.avatar { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; object-fit:cover; background:#e8eef5; color:var(--brand-dark); font-weight:800; }
.avatar-small { width:38px; height:38px; font-size:.78rem; }
.avatar-medium { width:54px; height:54px; }
.avatar-large { width:84px; height:84px; font-size:1.3rem; }
.avatar-placeholder { border:1px solid #d9e1eb; }
.table-subtext { display:block; color:var(--muted); margin-top:4px; }
.code-block { overflow:auto; white-space:pre; background:#111827; color:#e5e7eb; padding:18px; border-radius:10px; font-size:.88rem; line-height:1.6; }
code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
textarea { resize:vertical; min-height:92px; }
.menu-alert { display:inline-flex; width:18px; height:18px; align-items:center; justify-content:center; border-radius:50%; margin-right:5px; background:#f79009; color:#fff; font-size:.72rem; }
.membership-list > div > :last-child { display:flex; gap:10px; align-items:center; justify-content:flex-end; }

@media (max-width:980px) {
  .filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .filter-grid .button { width:100%; }
  .split-grid,.player-directory-grid { grid-template-columns:1fr; }
}

@media (max-width:620px) {
  .form-columns,.filter-grid { grid-template-columns:1fr; }
  .toolbar { align-items:flex-start; }
  .toolbar-actions { width:100%; }
  .toolbar-actions .button { flex:1; }
  .row-actions,.reject-form { align-items:stretch; flex-direction:column; }
  .compact-input { min-width:0; }
  .membership-list > div > :last-child { justify-content:flex-start; }
}

/* Phase 2.1: live registration validation */
.form-field { display:grid; gap:7px; }
.form-field > label { margin:0; }
.field-feedback { min-height:1.25em; color:var(--muted); font-weight:400; }
.form-field.is-invalid input:not([type="checkbox"]) { border-color:var(--danger); background:#fffafa; }
.form-field.is-invalid input:not([type="checkbox"]):focus { outline-color:rgba(180,35,24,.13); }
.form-field.is-invalid .field-feedback { color:var(--danger); }
.form-field.is-valid input:not([type="checkbox"]) { border-color:var(--success); background:#fbfffd; }
.form-field.is-valid .field-feedback { color:var(--success); }
.form-field.is-checking input:not([type="checkbox"]) { border-color:var(--brand); }
.form-field.is-checking .field-feedback { color:var(--brand-dark); }
.checkbox-field { gap:4px; }
.checkbox-field.is-invalid .checkbox-label { color:var(--danger); }
.checkbox-field.is-valid .field-feedback { color:var(--success); }
.button:disabled,.button[aria-disabled="true"] { opacity:.55; cursor:not-allowed; }
.button:disabled:hover { background:var(--brand); border-color:var(--brand); }
.form-status { min-height:1.25em; margin:0; color:var(--success); font-size:.9rem; text-align:center; }


/* Phase 2.2: memberships, following, private rankings and notifications */
.public-action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin:24px 0; }
.action-panel { display:flex; flex-direction:column; align-items:flex-start; }
.action-panel .button { margin-top:auto; }
.auth-form-links { display:flex; justify-content:flex-end; margin:-4px 0 14px; font-size:.9rem; }
.notification-link { position:relative; }
.notification-badge { display:inline-flex; min-width:19px; height:19px; align-items:center; justify-content:center; margin-left:5px; padding:0 5px; border-radius:999px; background:var(--danger); color:#fff; font-size:.7rem; font-weight:800; }
.notification-list { display:grid; gap:0; }
.notification-item { display:flex; justify-content:space-between; gap:20px; padding:18px 4px; border-bottom:1px solid var(--line); }
.notification-item:last-child { border-bottom:0; }
.notification-item.is-unread { padding-left:14px; border-left:4px solid var(--brand); background:#f7fbff; }
.notification-item h2 { margin:.25rem 0; font-size:1.05rem; }
.notification-item p { margin:.25rem 0; }
.notification-time { color:var(--muted); font-size:.82rem; }
.friend-search { display:grid; grid-template-columns:minmax(240px,1fr) auto; align-items:end; gap:14px; }
.friend-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.friend-card { display:flex; align-items:center; gap:14px; padding:16px; border:1px solid var(--line); border-radius:12px; }
.friend-card-body { min-width:0; flex:1; }
.friend-card h3 { margin:0; }
.friend-card p,.friend-card small { display:block; margin:.2rem 0; color:var(--muted); }
.ranking-self { background:#eff8ff; }
.you-label { display:inline-flex; margin-left:6px; padding:2px 7px; border-radius:999px; background:var(--brand); color:#fff; font-size:.7rem; vertical-align:middle; }
.membership-status-form { display:grid; grid-template-columns:minmax(110px,1fr) minmax(120px,1fr) minmax(160px,1.5fr) auto; gap:8px; align-items:end; min-width:620px; }
.membership-status-form label { margin:0; }
.membership-status-form label span { display:block; margin-bottom:4px; color:var(--muted); font-size:.75rem; }
.membership-status-form input,.membership-status-form select { width:100%; }
@media (max-width:800px) {
  .public-action-grid,.friend-grid { grid-template-columns:1fr; }
  .friend-search { grid-template-columns:1fr; }
  .notification-item { flex-direction:column; }
}

/* Phase 3: competition setup and player selection */
.competition-filter-grid { display:grid; grid-template-columns:repeat(3,minmax(160px,1fr)) auto; gap:14px; align-items:end; }
.competition-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:34px; }
.competition-card { display:flex; flex-direction:column; gap:10px; margin:0; }
.competition-card h2 { margin:0; font-size:1.25rem; }
.competition-card h2 a { color:var(--ink); }
.competition-card p { margin:0; color:var(--muted); }
.competition-card > .button { align-self:flex-start; margin-top:auto; }
.competition-card-top { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.competition-meta { display:grid; gap:8px; margin:8px 0 18px; }
.competition-meta > div { display:grid; grid-template-columns:72px 1fr; gap:10px; }
.competition-meta dt { color:var(--muted); }
.competition-meta dd { margin:0; font-weight:700; }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin:34px 0 18px; }
.section-heading h2 { margin:.2rem 0 0; }
.competition-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:22px; }
.summary-card { padding:20px; border:1px solid var(--line); background:#fff; border-radius:14px; box-shadow:0 12px 32px rgba(23,32,51,.05); display:grid; gap:7px; }
.summary-card > span,.summary-card small { color:var(--muted); }
.summary-card strong { font-size:1.15rem; }
.compact-panel { padding:20px 24px; }
.compact-panel .toolbar { margin:0; }
.competition-form { display:grid; gap:18px; }
.setup-section { margin:0; }
.setup-section-heading { margin-bottom:22px; }
.setup-section-heading h2 { display:flex; align-items:center; gap:12px; margin:0; }
.setup-section-heading h2 > span { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--brand); color:#fff; font-weight:800; flex:0 0 auto; }
.setup-section-heading p { margin:.45rem 0 0 46px; color:var(--muted); }
.rated-toggle { border:1px solid var(--line); border-radius:12px; padding:14px; align-self:end; }
.rated-toggle span { display:grid; gap:3px; }
.rated-toggle small { display:block; }
.form-actions { display:flex; justify-content:flex-end; gap:12px; padding:4px 0 24px; }
.competition-participant-manager { margin-bottom:22px; }
.player-search-controls { display:grid; grid-template-columns:minmax(220px,1fr) minmax(150px,.45fr); gap:12px; }
.player-search-results { margin-top:14px; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.player-search-result { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 14px; border-bottom:1px solid var(--line); }
.player-search-result:last-child { border-bottom:0; }
.player-search-result form { margin:0; }
.phase-preview { border-style:dashed; text-align:center; }
.phase-preview .button { margin-top:8px; }
.empty-action { max-width:680px; margin:30px auto; text-align:center; }
.invitation-summary { display:grid; gap:6px; margin:20px 0; padding:16px; border-radius:12px; background:#f7f9fc; }
.invitation-summary strong { font-size:1.15rem; }
.invitation-summary span { color:var(--muted); }
.status-draft { color:#344054; background:#f2f4f7; }
.status-in_progress { color:#175cd3; background:#eff8ff; }
.status-pending_results { color:#7a5b00; background:#fff4cc; }

@media (max-width:1080px) {
  .competition-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .competition-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:800px) {
  .competition-filter-grid { grid-template-columns:1fr 1fr; }
  .competition-card-grid { grid-template-columns:1fr; }
  .player-search-controls { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .competition-filter-grid,.competition-summary-grid { grid-template-columns:1fr; }
  .form-actions { flex-direction:column-reverse; }
  .form-actions .button { width:100%; }
  .player-search-result { align-items:flex-start; flex-direction:column; }
  .player-search-result form,.player-search-result .button { width:100%; }
}

[hidden] { display:none !important; }

/* Phase 4: team setup, ball picker and match schedules */
.assignment-method-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:20px; }
.assignment-method-card { display:flex; flex-direction:column; align-items:flex-start; gap:10px; padding:20px; border:1px solid var(--line); border-radius:14px; background:var(--soft); }
.assignment-method-card h3,.assignment-method-card p { margin:0; }
.assignment-method-card p { color:var(--muted); flex:1; }
.assignment-method-card form { margin:0; }
.team-assignment-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.team-assignment-card { position:relative; display:grid; gap:12px; padding:22px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.team-assignment-card h3,.team-assignment-card p { margin:0; }
.team-assignment-card p { color:var(--muted); }
.team-number { position:absolute; right:16px; top:16px; display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; border-radius:50%; background:var(--brand); color:#fff; font-weight:850; }
.draw-assignment-list { display:grid; gap:10px; }
.draw-assignment-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(120px,180px); gap:18px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); }
.draw-assignment-row:last-child { border-bottom:0; }
.draw-number-badge { justify-self:end; display:inline-flex; min-width:54px; justify-content:center; padding:8px 12px; border-radius:999px; background:#eff8ff; color:var(--brand-dark); }
.ball-picker-panel { max-width:980px; margin-inline:auto; }
.ball-picker-progress { text-align:center; margin-bottom:24px; }
.ball-picker-progress h2 { margin:.35rem 0; font-size:2rem; }
.ball-picker-progress p { margin:0; color:var(--muted); }
.ball-picker-pools { display:grid; gap:24px; }
.ball-pool { padding:20px; border:1px solid var(--line); border-radius:16px; background:var(--soft); }
.ball-pool h3 { margin:0 0 16px; text-align:center; }
.ball-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }
.picker-ball { width:74px; height:74px; border-radius:50%; border:2px solid #d5dbe4; background:#fff; color:var(--ink); box-shadow:0 8px 18px rgba(23,32,51,.08); font:800 1.4rem/1 Inter,ui-sans-serif,system-ui,sans-serif; cursor:pointer; transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease; }
.picker-ball:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 12px 24px rgba(23,32,51,.13); }
.picker-ball:disabled:not(.is-revealed) { opacity:.35; cursor:not-allowed; }
.picker-ball.is-pink { background:#f9d7e6; border-color:#e9a9c5; }
.picker-ball.is-revealed { background:var(--green); border-color:var(--green); color:#fff; opacity:1; }
.picker-ball.is-pink.is-revealed { background:#cf5f91; border-color:#cf5f91; }
.ball-picker-history { margin-top:28px; }
.ball-picker-history h2 { font-size:1.15rem; }
.ball-history-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 18px; }
.ball-history-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.picked-ball { display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; border-radius:50%; background:var(--green); color:#fff; font-weight:850; }
.picked-ball.is-pink { background:#cf5f91; }
.schedule-round { margin-bottom:20px; }
.schedule-round .section-heading { margin:0 0 16px; }
.schedule-match-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.schedule-match-card { display:grid; grid-template-columns:1fr auto 1fr; grid-template-areas:"court court court" "side1 versus side2"; gap:12px 18px; align-items:center; padding:18px; border:1px solid var(--line); border-radius:14px; background:var(--soft); }
.schedule-court { grid-area:court; color:var(--muted); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.schedule-side { display:grid; gap:4px; }
.schedule-side:first-of-type { grid-area:side1; }
.schedule-side:last-of-type { grid-area:side2; text-align:right; }
.schedule-side span { color:var(--muted); font-size:.9rem; }
.schedule-versus { grid-area:versus; color:var(--muted); font-weight:800; text-transform:uppercase; font-size:.76rem; }

@media (max-width:900px) {
  .assignment-method-grid { grid-template-columns:1fr; }
  .team-assignment-grid,.schedule-match-grid { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .draw-assignment-row { grid-template-columns:1fr; }
  .draw-number-badge { justify-self:start; }
  .ball-history-list { grid-template-columns:1fr; }
  .picker-ball { width:64px; height:64px; }
  .schedule-match-card { grid-template-columns:1fr; grid-template-areas:"court" "side1" "versus" "side2"; }
  .schedule-side:last-of-type { text-align:left; }
}

/* Phase 4.1: compact manual fixed-team setup */
.compact-team-setup { padding:24px; }
.compact-team-setup-heading { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:18px; }
.compact-team-setup-heading h2 { margin:.2rem 0 .35rem; }
.compact-team-setup-heading p { margin:0; color:var(--muted); max-width:720px; }
.team-assignment-progress { flex:0 0 auto; min-width:150px; display:grid; justify-items:end; gap:2px; }
.team-assignment-progress strong { font-size:1.5rem; }
.team-assignment-progress > span,.team-assignment-progress small { color:var(--muted); }
.available-player-panel { margin-bottom:18px; padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.available-player-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:12px; }
.available-player-heading h3 { margin:0; font-size:1rem; }
.available-player-heading p { margin:.2rem 0 0; color:var(--muted); font-size:.88rem; }
.available-player-list { display:flex; flex-wrap:wrap; gap:8px; min-height:36px; }
.available-player-chip { background: var(--name-field-bg);border-color: var(--name-field-border); border-radius:10px; padding:7px 11px; color:var(--ink); font:inherit; font-size:.88rem; font-weight:500; cursor:grab; }
.available-player-chip:hover { border-color:var(--blue); background-color: var(--blue-light); }
.available-player-chip:active,.available-player-chip.is-dragging { cursor:grabbing; opacity:.55; }
.compact-empty-state { width:100%; padding:8px 0; margin:0; text-align:left; }
.compact-team-form { display:grid; gap:14px; }
.compact-team-list { display:grid; gap:8px; }
.compact-team-row { display:grid; grid-template-columns:145px minmax(0,1fr) minmax(0,1fr); gap:10px; align-items:center; padding:9px 10px; border:1px solid var(--line); border-radius:10px; background:#fff; transition:border-color .15s ease,background .15s ease; }
.compact-team-row.is-complete { border-color:#b7dfcc; background:#fbfffd; }
.compact-team-label { display:flex; align-items:center; gap:10px; min-width:0; }
.compact-team-label > span { display:inline-flex; width:28px; height:28px; flex:0 0 auto; align-items:center; justify-content:center; border-radius:50%; background:var(--brand); color:#fff; font-weight:850; font-size:.84rem; }
.compact-team-label strong { white-space:nowrap; }
.team-player-slot { position:relative; display:flex; align-items:center; min-width:0; border-radius:10px; }
.team-player-slot select { padding-right:38px; min-width:0; transition:background .15s ease,border-color .15s ease; }
.team-player-slot.has-player select { background:var(--name-field-bg); border-color:var(--name-field-border); }
.team-player-slot.is-drag-over { outline:3px solid rgba(86,125,172,.18); }
.team-player-slot.is-drag-over select { border-color:var(--brand); background:#f7fbff; }
.team-slot-clear { position:absolute; right:7px; top:50%; transform:translateY(-50%); display:none; width:25px; height:25px; align-items:center; justify-content:center; border:0; border-radius:50%; background:#eef2f6; color:var(--muted); cursor:pointer; font:700 1rem/1 system-ui,sans-serif; }
.team-player-slot.has-player .team-slot-clear { display:inline-flex; }
.team-slot-clear:hover { background:#fee4e2; color:var(--danger); }
.team-player-slot.is-readonly { min-height:44px; padding:10px 12px; border:1px solid var(--name-field-border); background:var(--name-field-bg); }
.compact-team-actions { align-items:center; justify-content:space-between; padding:8px 0 0; }
.team-assignment-hint { color:var(--muted); font-size:.9rem; }
.team-assignment-hint.is-ready { color:var(--success); font-weight:700; }

@media (max-width:820px) {
  .compact-team-setup-heading { flex-direction:column; }
  .team-assignment-progress { justify-items:start; }
  .compact-team-row { grid-template-columns:110px minmax(0,1fr) minmax(0,1fr); }
}
@media (max-width:620px) {
  .compact-team-setup { padding:18px; }
  .available-player-heading { flex-direction:column; }
  .available-player-heading .button { width:100%; }
  .compact-team-row { grid-template-columns:1fr; gap:8px; }
  .compact-team-label { margin-bottom:2px; }
  .compact-team-actions { align-items:stretch; }
  .team-assignment-hint { order:2; }
}

/* Phase 5: results and score entry */
.schedule-result-summary { margin-bottom:22px; }
.schedule-match-card.is-approved { border-color:var(--name-field-border); background:var(--name-field-bg); }
.schedule-match-card.is-pending { border-color:#fedf89; background:#fffcf2; }
.schedule-court { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.schedule-score { display:inline-flex; padding:7px 10px; border-radius:9px; background:#fff; color:var(--ink); border:1px solid var(--line); font-size:.95rem; white-space:nowrap; }
.schedule-result-action { grid-column:1 / -1; display:flex; justify-content:flex-end; padding-top:4px; border-top:1px solid rgba(101,112,133,.16); }
.match-result-header { padding:24px; }
.match-result-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-bottom:22px; color:var(--muted); font-size:.88rem; }
.match-result-versus { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:22px; }
.result-team-name { display:grid; gap:6px; padding:14px 16px; border:1px solid var(--name-field-border); border-radius:12px; background:var(--name-field-bg); }
.result-team-name strong { font-size:1.08rem; }
.result-team-name span { color:var(--muted); font-size:.9rem; }
.result-team-name-right { text-align:right; }
.match-result-score { min-width:90px; text-align:center; font-size:1.45rem; font-weight:850; }
.match-result-score > span { color:var(--muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; }
.result-entry-panel { max-width:900px; margin-inline:auto; }
.result-entry-note { color:var(--muted); margin-top:-6px; }
.result-entry-form { display:grid; gap:22px; margin-top:24px; }
.result-score-grid { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:end; gap:14px; }
.result-score-card { display:grid; gap:10px; }
.result-side-label { display:grid; gap:3px; padding:11px 13px; border:1px solid var(--name-field-border); border-radius:10px; background:var(--name-field-bg); }
.result-side-label small { color:var(--muted); font-weight:400; }
.result-score-card input { min-height:72px; padding:10px; text-align:center; font-size:2rem; font-weight:850; }
.result-score-divider { padding-bottom:21px; color:var(--muted); font-size:1.7rem; font-weight:800; }
.score-helper { margin:0; color:var(--muted); text-align:center; }
.result-sets { display:grid; gap:8px; }
.result-set-header,.result-set-row { display:grid; grid-template-columns:90px minmax(0,1fr) minmax(0,1fr); gap:10px; align-items:center; }
.result-set-header { padding:0 10px 4px; color:var(--muted); font-size:.8rem; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.result-set-header span:not(:first-child) { text-align:center; }
.result-set-row { padding:9px 10px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.result-set-row strong { color:var(--muted); font-size:.88rem; }
.result-set-row input { text-align:center; font-weight:800; background:var(--name-field-bg); border-color:var(--name-field-border); }
.result-sets-readonly .result-set-row span { padding:9px 12px; border:1px solid var(--name-field-border); border-radius:9px; background:var(--name-field-bg); text-align:center; font-weight:800; }
.readonly-score { display:flex; justify-content:center; align-items:center; gap:22px; padding:20px; }
.readonly-score strong { font-size:2.1rem; }
.readonly-score span { color:var(--muted); font-size:1.5rem; }
.result-form-actions { padding-bottom:0; border-top:1px solid var(--line); padding-top:18px; }
.result-approval-note { margin:0; text-align:center; }

@media (max-width:700px) {
  .match-result-versus { grid-template-columns:1fr; gap:10px; }
  .result-team-name-right { text-align:left; }
  .match-result-score { min-width:0; }
  .result-score-grid { grid-template-columns:1fr; }
  .result-score-divider { padding:0; text-align:center; }
  .result-set-header,.result-set-row { grid-template-columns:64px minmax(0,1fr) minmax(0,1fr); }
  .schedule-result-action .button { width:100%; }
}

/* Phase 5.1: competition/game navigation, inline results and standings */
.competition-period-filter { grid-template-columns:minmax(190px,.7fr) minmax(190px,.7fr) auto; }
.competition-card-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; }
.round-entry-hint { color:var(--muted); font-size:.88rem; }
.inline-round-result-form { display:grid; gap:16px; }
.inline-result-card { align-content:start; }
.inline-result-inputs { grid-column:1 / -1; margin-top:4px; padding-top:14px; border-top:1px solid rgba(101,112,133,.16); }
.inline-result-two-score { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:9px; align-items:end; }
.inline-result-two-score label { min-width:0; }
.inline-result-two-score label > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:.75rem; font-weight:700; }
.inline-result-two-score input { min-height:52px; padding:8px; text-align:center; font-size:1.35rem; font-weight:850; background:var(--name-field-bg); border-color:var(--name-field-border); }
.inline-result-two-score > small { grid-column:1 / -1; color:var(--muted); text-align:center; }
.inline-score-dash { padding-bottom:14px; color:var(--muted); font-size:1.3rem; font-weight:850; }
.inline-result-sets { display:grid; gap:6px; }
.inline-set-header,.inline-set-row { display:grid; grid-template-columns:44px minmax(0,1fr) minmax(0,1fr); gap:7px; align-items:center; }
.inline-set-header { color:var(--muted); font-size:.72rem; font-weight:750; text-transform:uppercase; }
.inline-set-header span:not(:first-child) { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
.inline-set-row strong { color:var(--muted); text-align:center; }
.inline-set-row input { min-width:0; padding:8px; text-align:center; font-weight:800; background:var(--name-field-bg); border-color:var(--name-field-border); }
.inline-result-actions { grid-column:1 / -1; display:flex; justify-content:flex-end; align-items:center; gap:14px; padding-top:4px; }
.inline-result-readonly { grid-column:1 / -1; display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:12px; border-top:1px solid rgba(101,112,133,.16); color:var(--muted); }
.inline-result-readonly strong { color:var(--ink); }
.round-save-actions { display:flex; justify-content:flex-end; align-items:center; gap:18px; padding-top:14px; border-top:1px solid var(--line); }
.round-save-actions span { color:var(--muted); font-size:.88rem; }
.standings-panel { padding:0; overflow:hidden; }
.standings-table th,.standings-table td { text-align:center; }
.standings-table th:nth-child(2),.standings-table td:nth-child(2) { text-align:left; }
.standings-table tbody tr:first-child { background:var(--name-field-bg); }
.standings-name { display:grid; gap:3px; }
.standings-name small { color:var(--muted); font-weight:400; }

@media (max-width:800px) {
  .competition-period-filter { grid-template-columns:1fr; }
  .round-entry-hint { display:none; }
}
@media (max-width:620px) {
  .inline-result-two-score { grid-template-columns:1fr auto 1fr; }
  .inline-result-two-score label > span { font-size:.68rem; }
  .inline-result-actions,.round-save-actions { align-items:stretch; flex-direction:column; }
  .inline-result-actions .button,.round-save-actions .button { width:100%; }
  .inline-result-readonly { align-items:flex-start; flex-direction:column; }
}


/* Phase 5.1.1: navigation cleanup */
.icon-link { position:relative; display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; padding:0; border-radius:9px; color:var(--ink); }
.icon-link:hover { background:var(--soft); color:var(--brand-dark); }
.menu-icon { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.notification-link .notification-badge { position:absolute; top:-4px; right:-6px; margin:0; }
.user-menu form .icon-link { font:inherit; }
.back-to-top { white-space:nowrap; }
@media (max-width:620px) {
  .icon-link { width:38px; height:38px; }
}

/* Phase 6: result approval and rating updates */
.result-approval-box { display:grid; gap:12px; }
.result-approval-box > p { margin:0; }
.result-approval-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:4px; }
.result-approval-actions form { margin:0; }
.result-dispute-form { display:flex; gap:8px; flex:1 1 420px; align-items:center; }
.result-dispute-form input { min-width:220px; }
.rating-change-panel h2 { margin-bottom:14px; }
.rating-change-list { display:grid; gap:0; border-top:1px solid var(--line); }
.rating-change-row { display:grid; grid-template-columns:minmax(0,1fr) auto 72px; gap:14px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); }
.rating-change-row > span { color:var(--muted); }
.rating-delta { justify-self:end; }
.rating-delta.is-positive { color:var(--success); }
.rating-delta.is-negative { color:var(--danger); }
.status-disputed { color:var(--danger); background:#fee4e2; }
.status-approved { color:#067647; background:#dcfae6; }
@media (max-width:620px) {
  .result-approval-actions,.result-dispute-form { align-items:stretch; flex-direction:column; }
  .result-dispute-form input,.result-dispute-form .button { width:100%; }
  .rating-change-row { grid-template-columns:1fr auto; }
  .rating-change-row .rating-delta { grid-column:2; }
}


/* Phase 6.2: beta-readiness schedule/result cleanup */
.inline-result-view-actions { grid-column:1 / -1; display:flex; justify-content:flex-end; align-items:center; gap:12px; padding-top:12px; border-top:1px solid rgba(101,112,133,.16); }
.inline-edit-panel { grid-column:1 / -1; display:grid; gap:12px; }
.inline-edit-panel[hidden] { display:none !important; }
.inline-result-readonly { justify-content:flex-end; }
.audit-filters { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) auto; gap:10px; align-items:end; margin-bottom:18px; }
.audit-table { width:100%; }
.audit-table td { vertical-align:top; }
.audit-meta { display:grid; gap:3px; color:var(--muted); font-size:.78rem; }
.audit-details { max-width:460px; overflow-wrap:anywhere; white-space:pre-wrap; font-size:.78rem; color:var(--muted); }
@media (max-width:900px) {
  .audit-filters { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px) {
  .inline-result-view-actions { align-items:stretch; flex-direction:column; }
  .inline-result-view-actions .button { width:100%; }
  .audit-filters { grid-template-columns:1fr; }
}

/* Phase 6.3 · Mexicana */
.inline-form { display:inline-flex; margin:0; }
.mexicana-pairing-grid { display:grid; gap:1rem; margin-top:1rem; }
.mexicana-court { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:1rem; align-items:center; padding:1rem; border:1px solid var(--line); border-radius:var(--radius); background:var(--soft); }
.mexicana-court .schedule-court { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.mexicana-court [data-mexicana-warning] { font-size:.82rem; color:var(--success); }
.mexicana-court [data-mexicana-warning].is-warning { color:var(--danger); font-weight:700; }
.mexicana-team { min-width:0; }
.mexicana-team h3 { margin:0 0 .55rem; font-size:.95rem; }
.mexicana-team-slots { display:grid; gap:.55rem; }
.mexicana-vs { font-weight:800; color:var(--muted); }
.mexicana-player-card { width:100%; border:1px solid var(--line); border-radius:12px; padding:.75rem .85rem; background:var(--surface); text-align:left; cursor:grab; display:flex; flex-direction:column; gap:.15rem; }
.mexicana-player-card strong { color:var(--ink); }
.mexicana-player-card small { color:var(--muted); }
.mexicana-player-card:hover, .mexicana-player-card.is-selected { border-color:var(--brand); box-shadow:0 0 0 2px rgba(86,125,172,.14); }
.mexicana-player-card.is-dragging { opacity:.55; }
@media (max-width: 720px) {
  .mexicana-court { grid-template-columns:1fr; }
  .mexicana-court .schedule-court { grid-column:auto; }
  .mexicana-vs { text-align:center; }
}
