:root{
  --white:#ffffff;
  --pale:#E4F1FF;
  --pale-2:#EFF7FF;
  --sky:#2FB4F0;
  --sky-deep:#0C8CE0;
  --blue:#0B4FE0;
  --blue-deep:#062E8C;
  --navy:#081B3D;
  --navy-2:#0D2C5C;
  --ink:#081638;
  --ink-soft:#4C6188;
  --lime:#B9FF3F;
  --pitch:#17D46A;
  --pitch-deep:#0BA455;
  --amber:#FFB020;
  --coral:#FF4C5E;
  --gold:#FFCE3D;
  --gold-deep:#E8A400;
  --silver:#D7E1EC;
  --bronze:#E3A66A;
  --radius:16px;
  --radius-lg:22px;
  --shadow:0 4px 18px rgba(6,46,140,0.12);
  --shadow-lg:0 14px 34px rgba(6,46,140,0.22);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:
    radial-gradient(circle at 100% 0%, rgba(11,79,224,0.22), transparent 46%),
    radial-gradient(circle at 0% 15%, rgba(23,212,106,0.16), transparent 42%),
    radial-gradient(circle at 50% 100%, rgba(255,206,61,0.10), transparent 40%),
    linear-gradient(180deg, #EAF3FF 0%, var(--pale) 100%);
  color:var(--ink);
  min-height:100vh;
  -webkit-tap-highlight-color:transparent;
}

.app-shell{
  max-width:720px;
  margin:0 auto;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  padding-bottom:40px;
}

/* TOP BAR */
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 16px;
  margin:10px 10px 4px;
  border-radius:20px;
  background:linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 55%, var(--blue-deep) 100%);
  box-shadow:0 10px 28px rgba(8,27,61,0.35);
}
.brand{display:flex;align-items:center;gap:9px;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:22px;letter-spacing:0.6px;color:var(--white);}
.brand-shuttle{font-size:22px;filter:drop-shadow(0 0 6px rgba(185,255,63,0.6));}
.brand-text b{color:var(--lime);}
.icon-btn{
  background:rgba(255,255,255,0.12);
  border:1px solid rgba(255,255,255,0.16);
  color:var(--lime);
  width:42px;height:42px;
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:transform .15s ease, background .15s ease;
}
.icon-btn:active{transform:scale(0.92);background:rgba(255,255,255,0.22);}

/* STEPPER */
.stepper{
  display:flex;
  justify-content:space-between;
  padding:6px 18px 14px;
  gap:6px;
}
.step{
  flex:1;
  text-align:center;
  font-family:'Rajdhani',sans-serif;
  font-weight:600;
  font-size:12.5px;
  color:var(--ink-soft);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  letter-spacing:.3px;
  text-transform:uppercase;
}
.step .dot{
  width:24px;height:24px;
  border-radius:50%;
  background:var(--white);
  color:var(--ink-soft);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;
  border:2px solid #DCEBF7;
}
.step.active .dot{background:var(--blue);border-color:var(--blue);color:var(--white);}
.step.active{color:var(--blue);}
.step.done .dot{background:var(--lime);border-color:var(--lime);color:var(--ink);}

/* MAIN / SCREENS */
main{padding:6px 18px 10px;flex:1;}
.screen{display:none;animation:fadeIn .25s ease;}
.screen.active{display:block;}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

.screen-head h1{
  font-family:'Rajdhani',sans-serif;
  font-size:28px;
  font-weight:700;
  margin:10px 0 2px;
  color:var(--ink);
}
.screen-head .hint{
  margin:0 0 16px;
  color:var(--ink-soft);
  font-size:14px;
  line-height:1.4;
}

/* PLAYER GRID */
.player-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-bottom:12px;
}
.player-chip{
  position:relative;
  background:var(--white);
  border:2px solid transparent;
  border-radius:var(--radius);
  padding:14px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  box-shadow:var(--shadow);
  cursor:pointer;
  transition:all .15s ease;
}
.player-chip:active{transform:scale(0.97);}
.player-chip.selected{
  background:linear-gradient(135deg,var(--blue),var(--sky-deep));
  border-color:var(--blue);
  color:var(--white);
  box-shadow:var(--shadow-lg);
}
.player-chip .pname{
  font-weight:600;
  font-size:15px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.player-chip .avatar{
  width:30px;height:30px;
  border-radius:50%;
  background:var(--pale);
  color:var(--blue);
  display:flex;align-items:center;justify-content:center;
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:13px;
  flex-shrink:0;
}
.player-chip.selected .avatar{background:rgba(255,255,255,0.25);color:var(--white);}
.chip-actions{display:flex;gap:4px;flex-shrink:0;}
.chip-icon-btn{
  width:22px;height:22px;
  border:none;background:transparent;
  color:inherit;opacity:.55;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
}
.chip-icon-btn:active{opacity:1;}

.add-player-btn{margin-bottom:18px;}

.selection-bar{
  text-align:center;
  font-family:'Rajdhani',sans-serif;
  font-weight:600;
  color:var(--blue-deep);
  font-size:15px;
  margin-bottom:12px;
}

/* BUTTONS */
.primary-btn{
  background:linear-gradient(120deg,var(--blue) 0%, var(--sky-deep) 55%, var(--pitch) 130%);
  color:var(--white);
  border:none;
  padding:15px 20px;
  border-radius:var(--radius);
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:17.5px;
  letter-spacing:.4px;
  cursor:pointer;
  box-shadow:var(--shadow-lg);
  transition:transform .15s ease, opacity .15s ease;
}
.primary-btn:active{transform:scale(0.98);}
.primary-btn:disabled{opacity:.4;box-shadow:none;cursor:not-allowed;}
.primary-btn.full{width:100%;}

.ghost-btn{
  background:var(--white);
  color:var(--blue);
  border:2px solid #DCEBF7;
  padding:13px 18px;
  border-radius:var(--radius);
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:15px;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:transform .15s ease;
}
.ghost-btn:active{transform:scale(0.97);}
.ghost-btn.full{width:100%;}

.text-btn{
  background:none;border:none;color:var(--ink-soft);
  font-family:'Inter',sans-serif;font-size:14px;
  cursor:pointer;padding:10px 0;
}
.back-btn{display:block;margin:14px auto 0;}

.btn-row{display:flex;gap:10px;}
.btn-row .ghost-btn{flex:0 0 auto;padding-left:16px;padding-right:16px;}
.btn-row .primary-btn{flex:1;}

/* PAIRS LIST */
.pairs-list{display:flex;flex-direction:column;gap:10px;margin-bottom:18px;}
.pair-card{
  background:var(--white);
  border-radius:var(--radius);
  padding:14px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  box-shadow:var(--shadow);
  border-left:5px solid var(--sky);
}
.pair-card .pair-num{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:13px;
  color:var(--white);
  background:var(--blue);
  width:26px;height:26px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.pair-card .pair-names{font-weight:600;font-size:15.5px;}
.pair-card .pair-names .amp{color:var(--sky-deep);font-weight:700;margin:0 4px;}
.pair-card.bye{border-left-color:var(--lime);}
.pair-card.bye .pair-names{color:var(--ink-soft);}

/* FORMAT CARDS */
.format-cards{display:flex;flex-direction:column;gap:14px;margin-bottom:18px;}
.format-card{
  background:var(--white);
  border:2px solid #DCEBF7;
  border-radius:var(--radius-lg);
  padding:20px;
  text-align:left;
  cursor:pointer;
  box-shadow:var(--shadow);
  transition:transform .15s ease, border-color .15s ease;
}
.format-card:active{transform:scale(0.98);}
.format-card:hover{border-color:var(--sky);}
.format-icon{font-size:30px;margin-bottom:6px;}
.format-card h2{font-family:'Rajdhani',sans-serif;margin:0 0 6px;font-size:21px;color:var(--blue-deep);}
.format-card p{margin:0 0 10px;color:var(--ink-soft);font-size:14px;line-height:1.45;}
.format-note{
  font-size:12.5px;
  font-weight:600;
  color:var(--blue);
  background:var(--pale);
  display:inline-block;
  padding:5px 10px;
  border-radius:8px;
}

/* TOURNAMENT - KNOCKOUT BRACKET */
.bracket-scroll{overflow-x:auto;padding-bottom:12px;-webkit-overflow-scrolling:touch;}
.bracket{display:flex;gap:26px;min-width:max-content;padding:6px 2px 16px;}
.round{display:flex;flex-direction:column;justify-content:space-around;gap:16px;min-width:190px;}
.round-label{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.6px;
  color:var(--blue);
  text-align:center;
  margin-bottom:4px;
}
.match{
  background:var(--white);
  border-radius:14px;
  box-shadow:var(--shadow);
  overflow:hidden;
  border:2px solid #EAF3FB;
}
.match.final{border-color:var(--gold);box-shadow:0 8px 24px rgba(255,180,32,.28);}
.match.third{border-color:var(--bronze);}
.slot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:11px 12px;
  font-size:13.5px;
  font-weight:600;
  color:var(--ink);
  cursor:pointer;
  border-bottom:1px solid #F0F5FA;
  gap:6px;
  transition:background .15s ease;
}
.slot:last-child{border-bottom:none;}
.slot:active{background:var(--pale);}
.slot.winner{background:linear-gradient(90deg,var(--pitch),#5CF0A0);color:var(--white);font-weight:700;}
.slot.winner .trophy{filter:drop-shadow(0 0 3px rgba(0,0,0,.25));}
.slot.winner .trophy{opacity:1;}
.slot.placeholder{color:#B7C6D6;font-style:italic;font-weight:500;cursor:default;}
.slot.decided-empty{cursor:default;opacity:.55;}
.slot .trophy{opacity:0;font-size:13px;}
.match-label{
  text-align:center;font-family:'Rajdhani',sans-serif;font-weight:700;
  font-size:11.5px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.4px;
  margin-top:4px;
}

.champion-banner{
  margin-top:22px;
  background:linear-gradient(135deg,#FFE18C,var(--gold));
  border-radius:var(--radius-lg);
  padding:24px 18px;
  text-align:center;
  box-shadow:0 14px 34px rgba(255,180,32,.35);
}
.champion-banner .medal{font-size:40px;}
.champion-banner h2{font-family:'Rajdhani',sans-serif;margin:6px 0 2px;font-size:24px;color:#5A3B00;}
.champion-banner p{margin:0;font-weight:700;font-size:18px;color:#3E2900;}

.podium-row{display:flex;gap:10px;margin-top:14px;}
.podium-card{
  flex:1;background:var(--white);border-radius:14px;padding:12px;text-align:center;box-shadow:var(--shadow);
}
.podium-card .pos{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:12px;text-transform:uppercase;color:var(--ink-soft);}
.podium-card .names{font-weight:700;font-size:13.5px;margin-top:4px;}
.podium-card.gold{border:2px solid var(--gold);}
.podium-card.bronze{border:2px solid var(--bronze);}

/* GROUP STAGE TABLE */
.group-table{width:100%;border-collapse:collapse;background:var(--white);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:18px;}
.group-table th,.group-table td{padding:10px 8px;text-align:center;font-size:13px;}
.group-table th{
  background:var(--blue);color:var(--white);font-family:'Rajdhani',sans-serif;
  font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.3px;
}
.group-table td.team-name{text-align:left;font-weight:600;}
.group-table tr:nth-child(even) td{background:var(--pale-2);}
.group-table tr.qualified td{background:#EBFFCE;}
.group-table td.rank{font-family:'Rajdhani',sans-serif;font-weight:700;color:var(--blue-deep);}

.section-title{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:17px;color:var(--blue-deep);
  margin:22px 0 10px;display:flex;align-items:center;gap:8px;
}

.match-list{display:flex;flex-direction:column;gap:8px;margin-bottom:6px;}
.gmatch{
  background:var(--white);border-radius:12px;box-shadow:var(--shadow);
  display:flex;align-items:center;padding:4px;
}
.gmatch .gslot{
  flex:1;text-align:center;padding:10px 6px;font-weight:600;font-size:13.5px;border-radius:9px;cursor:pointer;
}
.gmatch .gslot.winner{background:linear-gradient(90deg,var(--pitch),#5CF0A0);color:var(--white);}
.gmatch .gslot.done-loser{opacity:.6;}
.gmatch .vs{
  font-family:'Rajdhani',sans-serif;font-weight:700;color:var(--ink-soft);font-size:12px;padding:0 8px;flex-shrink:0;
}
.gmatch.settled{opacity:.9;}

.badge-pill{
  display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;
  background:var(--pale);color:var(--blue);margin-left:6px;font-family:'Rajdhani',sans-serif;
}

/* LEADERBOARD */
.lb-row{
  display:flex;align-items:center;gap:12px;background:var(--white);border-radius:14px;padding:12px 14px;margin-bottom:8px;box-shadow:var(--shadow);
}
.lb-rank{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:16px;color:var(--blue-deep);
  width:28px;height:28px;border-radius:50%;background:var(--pale);display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.lb-row.top1 .lb-rank{background:var(--gold);color:#5A3B00;}
.lb-row.top2 .lb-rank{background:var(--silver);color:var(--ink);}
.lb-row.top3 .lb-rank{background:var(--bronze);color:#4A2E00;}
.lb-names{flex:1;font-weight:600;font-size:14.5px;}
.lb-stats{display:flex;gap:12px;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:13px;}
.lb-stats span{display:flex;flex-direction:column;align-items:center;color:var(--ink-soft);}
.lb-stats span b{color:var(--ink);font-size:15px;}
.lb-empty{text-align:center;color:var(--ink-soft);padding:40px 10px;font-size:14px;}

/* MODAL */
.modal-overlay{
  position:fixed;inset:0;background:rgba(11,37,69,0.45);
  display:none;align-items:flex-end;justify-content:center;z-index:50;
  backdrop-filter:blur(2px);
}
.modal-overlay.active{display:flex;}
.modal-card{
  background:var(--white);width:100%;max-width:480px;border-radius:22px 22px 0 0;
  padding:22px 20px 26px;box-shadow:0 -10px 40px rgba(0,0,0,.2);
  animation:slideUp .25s ease;
}
@media (min-width:560px){
  .modal-overlay{align-items:center;}
  .modal-card{border-radius:22px;}
}
@keyframes slideUp{from{transform:translateY(30px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.modal-card h3{font-family:'Rajdhani',sans-serif;font-size:20px;margin:0 0 12px;color:var(--ink);}
.modal-card p{font-size:14px;color:var(--ink-soft);margin:0 0 16px;line-height:1.4;}
.modal-input{
  width:100%;padding:13px 14px;border-radius:12px;border:2px solid #DCEBF7;font-size:15px;
  font-family:'Inter',sans-serif;margin-bottom:14px;
}
.modal-input:focus{outline:none;border-color:var(--sky);}
.modal-actions{display:flex;gap:10px;}
.modal-actions button{flex:1;}
.modal-actions .danger-btn{
  background:var(--coral);color:var(--white);border:none;padding:13px;border-radius:12px;
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:15px;cursor:pointer;
}
.modal-actions .cancel-btn{
  background:var(--pale);color:var(--ink-soft);border:none;padding:13px;border-radius:12px;
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:15px;cursor:pointer;
}

/* TOAST */
.toast{
  position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(80px);
  background:var(--ink);color:var(--white);padding:12px 20px;border-radius:30px;
  font-size:13.5px;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.25);
  opacity:0;transition:all .3s ease;z-index:60;max-width:90%;text-align:center;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* CONTROLS BAR (courts / scoring) */
.controls-bar{
  display:flex;
  gap:10px;
  background:var(--white);
  border-radius:var(--radius);
  padding:12px 14px;
  box-shadow:var(--shadow);
  margin-bottom:16px;
  flex-wrap:wrap;
}
.control-group{display:flex;align-items:center;gap:10px;flex:1;min-width:140px;}
.control-label{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:12.5px;text-transform:uppercase;
  letter-spacing:.4px;color:var(--ink-soft);
}
.pill-toggle{
  display:flex;background:var(--pale);border-radius:12px;padding:3px;gap:2px;
}
.pill-toggle button{
  border:none;background:transparent;padding:7px 12px;border-radius:9px;
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:13.5px;color:var(--ink-soft);
  cursor:pointer;transition:all .15s ease;
}
.pill-toggle button.active{
  background:linear-gradient(120deg,var(--blue),var(--sky-deep));
  color:var(--white);box-shadow:0 4px 10px rgba(11,79,224,0.3);
}
.tabs-toggle{width:100%;margin-bottom:16px;}
.tabs-toggle button{flex:1;}

.switch{
  width:46px;height:26px;border-radius:14px;background:#DCE6F2;border:none;
  position:relative;cursor:pointer;padding:0;flex-shrink:0;transition:background .2s ease;
}
.switch[aria-checked="true"]{background:linear-gradient(120deg,var(--pitch),var(--pitch-deep));}
.switch-knob{
  position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:var(--white);box-shadow:0 2px 6px rgba(0,0,0,.2);transition:transform .2s ease;
}
.switch[aria-checked="true"] .switch-knob{transform:translateX(20px);}

.court-badge{
  display:inline-flex;align-items:center;gap:4px;font-family:'Rajdhani',sans-serif;font-weight:700;
  font-size:11px;text-transform:uppercase;letter-spacing:.3px;color:var(--blue-deep);
  background:var(--pale);padding:3px 9px;border-radius:20px;margin-bottom:6px;
}
.round-heading{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:14px;color:var(--blue-deep);
  text-transform:uppercase;letter-spacing:.4px;margin:16px 0 8px;display:flex;align-items:center;gap:8px;
}
.round-heading::after{content:'';flex:1;height:2px;background:linear-gradient(90deg,var(--sky),transparent);}

/* SCORE MODAL */
.score-modal-teams{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.score-modal-team{flex:1;text-align:center;}
.score-modal-team label{
  display:block;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:13px;color:var(--ink-soft);
  margin-bottom:6px;
}
.score-modal-team input{
  width:100%;text-align:center;font-size:22px;font-weight:700;font-family:'Rajdhani',sans-serif;
  padding:12px 6px;border-radius:12px;border:2px solid #DCEBF7;color:var(--blue-deep);
}
.score-modal-team input:focus{outline:none;border-color:var(--sky);}
.score-vs-divider{font-family:'Rajdhani',sans-serif;font-weight:700;color:var(--ink-soft);font-size:14px;padding-top:18px;}
.score-error{color:var(--coral);font-size:13px;margin:-6px 0 12px;display:none;}
.score-error.show{display:block;}

/* INDIVIDUAL LEADERBOARD */
.lb-indiv-row{
  display:flex;align-items:center;gap:12px;background:var(--white);border-radius:14px;padding:12px 14px;margin-bottom:8px;box-shadow:var(--shadow);
}
.lb-indiv-row .avatar{
  width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--sky-deep));
  color:var(--white);display:flex;align-items:center;justify-content:center;font-family:'Rajdhani',sans-serif;
  font-weight:700;font-size:14px;flex-shrink:0;
}

/* AUTH */
.auth-card{
  background:var(--white);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow);
}
.auth-card .modal-input{margin-bottom:12px;}
.auth-error{color:var(--coral);font-size:13.5px;text-align:center;margin:10px 0 0;min-height:16px;}

/* PROFILE */
.profile-card{
  background:var(--white);border-radius:var(--radius-lg);padding:26px 20px;text-align:center;box-shadow:var(--shadow);margin-bottom:8px;
}
.avatar-lg{
  width:72px;height:72px;border-radius:50%;margin:0 auto 12px;
  background:linear-gradient(135deg,var(--blue),var(--sky-deep));color:var(--white);
  display:flex;align-items:center;justify-content:center;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:26px;
}
.profile-name{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:22px;color:var(--ink);margin-bottom:6px;}
.org-badge{
  display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;font-family:'Rajdhani',sans-serif;
  background:var(--pale);color:var(--blue-deep);padding:4px 10px;border-radius:20px;margin:6px 3px 0;
}

/* TOURNAMENT LIST (home) */
.tournament-row{
  background:var(--white);border-radius:14px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow);
  display:flex;align-items:center;gap:12px;cursor:pointer;transition:transform .15s ease;
}
.tournament-row:active{transform:scale(0.98);}
.tournament-row .t-icon{font-size:22px;}
.tournament-row .t-info{flex:1;}
.tournament-row .t-name{font-weight:700;font-size:15px;color:var(--ink);}
.tournament-row .t-meta{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
.status-pill{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:11px;text-transform:uppercase;
  padding:3px 9px;border-radius:20px;letter-spacing:.3px;
}
.status-pill.setup{background:var(--pale);color:var(--blue-deep);}
.status-pill.active{background:#EBFFCE;color:var(--pitch-deep);}
.status-pill.completed{background:#FFF3D6;color:var(--gold-deep);}

/* ORGS */
.org-row{
  background:var(--white);border-radius:14px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow);
  display:flex;align-items:center;gap:12px;cursor:pointer;transition:transform .15s ease;
}
.org-row:active{transform:scale(0.98);}
.org-row .t-icon{font-size:22px;}
.member-row{
  display:flex;align-items:center;gap:12px;background:var(--white);border-radius:12px;padding:10px 14px;margin-bottom:8px;box-shadow:var(--shadow);
}
.member-row .avatar{
  width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--sky-deep));
  color:var(--white);display:flex;align-items:center;justify-content:center;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:12px;flex-shrink:0;
}
.member-row .m-name{flex:1;font-weight:600;font-size:14px;}
.admin-tag{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:10.5px;text-transform:uppercase;
  background:var(--gold);color:#5A3B00;padding:2px 7px;border-radius:10px;
}

@media (min-width:640px){
  .player-grid{grid-template-columns:repeat(3,1fr);}
  .format-cards{flex-direction:row;}
  .screen-head h1{font-size:32px;}
}

.stats-summary{ display:flex; gap:10px; margin:16px 0; }
.stat-box{ flex:1; background:#fff; border-radius:14px; padding:14px 10px; text-align:center; }
.stat-num{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:22px; color:var(--navy,#0b1b3a); }
.stat-label{ font-size:12px; color:#7c8aa0; margin-top:2px; }

.player-link{ cursor:pointer; text-decoration:underline dotted; text-underline-offset:2px; }
.player-link:active{ opacity:0.7; }

.code-row{
  display:flex; align-items:center; gap:8px; background:var(--white);
  border-radius:14px; padding:10px 12px; margin-top:8px; box-shadow:var(--shadow);
}
.code-chip{
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:17px; letter-spacing:1.5px;
  color:var(--blue-deep); background:var(--pale); padding:6px 12px; border-radius:10px;
}

.share-btn{ display:flex; align-items:center; gap:4px; width:auto; padding:0 10px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; }
/* ============ SCORE DISPLAY (append to style.css) ============
   New classes referenced by the updated tournament.js — shows the
   recorded score next to each team once a match is decided.
*/

.slot-score{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:13px;
  opacity:.8;
  margin-left:auto;
  padding-left:6px;
}
.slot.winner .slot-score{ opacity:1; }

.score-badge{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:11px;
  margin-left:6px;
  opacity:.85;
}

.gslot{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}

/* ============ SPORT PICKER MODAL (append to style.css) ============ */

.sport-picker-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-bottom:16px;
}
.sport-pick-card{
  background:var(--white);
  border:2px solid #DCEBF7;
  border-radius:14px;
  padding:16px 10px;
  text-align:center;
  cursor:pointer;
  transition:transform .15s ease, border-color .15s ease;
}
.sport-pick-card:active{ transform:scale(0.96); }
.sport-pick-card:hover{ border-color:var(--sky); }
.sport-pick-icon{ font-size:28px; margin-bottom:6px; }
.sport-pick-label{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:14px;
  color:var(--blue-deep);
}

/* small sport-icon badge used next to org/group names throughout the app */
.sport-tag{
  font-size:15px;
  margin-right:4px;
}

/* ============ SETS SCORE MODAL (paddle) — append to style.css ============ */

.sets-summary{
  text-align:center;
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:17px;
  color:var(--blue-deep);
  margin-bottom:14px;
}
.set-row{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--pale-2);
  border-radius:12px;
  padding:8px 10px;
  margin-bottom:8px;
}
.set-row-label{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:13px;
  color:var(--ink-soft);
  width:48px;
  flex-shrink:0;
}
.set-row-wheels{
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  justify-content:center;
}
.mini-wheel{
  display:flex;
  align-items:center;
  gap:4px;
}
.mini-wheel-btn{
  width:26px;height:26px;
  border:none;
  background:var(--white);
  border-radius:8px;
  color:var(--blue);
  font-size:13px;
  cursor:pointer;
}
.mini-wheel-btn:active{ background:var(--pale); }
.mini-wheel-val{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:19px;
  color:var(--blue-deep);
  width:24px;
  text-align:center;
}
.set-row-dash{ color:var(--ink-soft); font-weight:700; }
.set-row-remove{
  margin-left:auto;
  color:var(--coral);
  opacity:.6;
}
.set-row-remove:active{ opacity:1; }

/* ============ PROFILE REDESIGN (append to style.css) ============ */

/* Tighten the big avatar/name block — was a lot of dead vertical space */
.profile-card{
  padding:18px 20px;
  display:flex;
  align-items:center;
  gap:14px;
  text-align:left;
}
.avatar-lg{
  width:52px; height:52px;
  margin:0;
  font-size:19px;
  flex-shrink:0;
}
.profile-card-info{ flex:1; min-width:0; }
.profile-name{
  font-size:18px;
  margin-bottom:4px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* stats grid now holds 5 boxes — wrap on narrow screens instead of
   squeezing them unreadably thin */
.stats-summary{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:8px;
}
@media (min-width:480px){
  .stats-summary{ grid-template-columns:repeat(5, 1fr); }
}
.stat-box{ padding:12px 6px; }
.stat-num{ font-size:18px; }
.stat-label{ font-size:10.5px; }

.sport-filter-toggle{ width:100%; flex-wrap:wrap; }
.sport-filter-toggle button{ flex:1; white-space:nowrap; }

.org-badge-clickable{ cursor:pointer; transition:transform .12s ease; }
.org-badge-clickable:active{ transform:scale(0.95); }

.row-static{ cursor:default !important; }
.row-static:active{ transform:none !important; }

/* ============ AUTH LANDING ============ */
.auth-page{
  display:flex; min-height:100vh; margin:-10px -18px 0;
}
.auth-hero{
  flex:1.15; background:linear-gradient(160deg, var(--navy) 0%, var(--navy-2) 60%, var(--blue-deep) 130%);
  padding:44px 40px 36px; display:flex; flex-direction:column; color:#fff; position:relative; overflow:hidden;
}
.live-ticker{
  display:inline-flex; align-items:center; gap:8px; align-self:flex-start;
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14);
  padding:6px 14px 6px 10px; border-radius:20px; font-family:'Rajdhani',sans-serif;
  font-weight:600; font-size:13px; letter-spacing:.3px; color:#D9E4F5; margin-bottom:28px;
}
.live-dot{ width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 0 rgba(185,255,63,.6); animation:livepulse 1.8s infinite; flex-shrink:0; }
@keyframes livepulse{ 0%{box-shadow:0 0 0 0 rgba(185,255,63,.55);} 70%{box-shadow:0 0 0 7px rgba(185,255,63,0);} 100%{box-shadow:0 0 0 0 rgba(185,255,63,0);} }
.live-ticker-text{ transition:opacity .25s ease; }

.auth-hero-title{
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:44px; line-height:1.08; margin:0 0 14px;
  letter-spacing:.2px;
}
.auth-hero-title span{ color:var(--lime); }
.auth-hero-sub{ font-size:15.5px; color:#B9C7E6; max-width:400px; line-height:1.55; margin:0 0 26px; }

.court-illustration{ max-width:380px; margin-bottom:26px; }
.shuttle-serve{ transform-origin:0 0; animation:serve 2.4s cubic-bezier(.4,0,.2,1) 0.3s 1 both; }
@keyframes serve{
  0%{ transform:translate(70px,150px) rotate(0deg); opacity:0; }
  15%{ opacity:1; }
  100%{ transform:translate(330px,60px) rotate(35deg); opacity:1; }
}
@media (prefers-reduced-motion: reduce){ .shuttle-serve{ animation:none; transform:translate(330px,60px); } }

.hero-features{ display:flex; flex-direction:column; gap:11px; margin-bottom:28px; }
.hf-item{ display:flex; align-items:center; gap:10px; font-size:14px; color:#D9E4F5; }
.hf-dot{ width:6px; height:6px; border-radius:50%; background:var(--sky); flex-shrink:0; }

.sport-strip{
  margin-top:auto; display:flex; gap:10px; flex-wrap:wrap; font-family:'Rajdhani',sans-serif;
  font-weight:600; font-size:13px; color:#8FA3CC;
}
.sport-strip span{ background:rgba(255,255,255,0.06); padding:5px 11px; border-radius:8px; }

.auth-panel{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:40px 32px; background:var(--pale);
}
.auth-panel .auth-card{
  width:100%; max-width:380px; background:var(--white); border-radius:var(--radius-lg);
  padding:30px 26px; box-shadow:var(--shadow-lg);
}
.auth-brand{ display:flex; align-items:center; gap:8px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:22px; margin-bottom:22px; color:var(--ink); }
.auth-brand .brand-text b{ color:var(--blue); }
.auth-footnote{ margin-top:18px; font-size:12.5px; color:var(--ink-soft); text-align:center; }
.auth-footer{
  margin-top:22px; display:flex; flex-direction:column; align-items:center; gap:3px;
  font-size:11.5px; color:#9CAAC4; text-align:center;
}
.auth-footer a{ color:#9CAAC4; text-decoration:none; }
.auth-footer a:hover{ text-decoration:underline; }

@media (max-width:900px){
  .auth-page{ flex-direction:column; }
  .auth-hero{ padding:32px 24px 28px; }
  .auth-hero-title{ font-size:32px; }
  .court-illustration{ max-width:280px; margin-bottom:18px; }
  .hero-features{ display:none; }
  .auth-panel{ padding:28px 20px 40px; }
}

.slot{
  background:#EEF3FB;
  min-height:46px;
  padding:13px 12px;
  transition:background .12s ease;
}
.slot:not(.placeholder):not(.winner):not(.decided-empty):active{
  background:#D9E6FA;
}

.gslot{
  background:#EEF3FB;
  min-height:42px;
  padding:12px 8px;
  transition:background .12s ease;
}
.gslot:not(.winner):not(.done-loser):active{
  background:#D9E6FA;
}

/* ============ CO-ADMIN BADGE (append to style.css) ============ */
.admin-tag-co{
  background:var(--pale);
  color:var(--blue-deep);
}
.member-row{ flex-wrap:wrap; }

/* ============ CO-ADMIN BADGE (append to style.css) ============ */
.admin-tag-co{
  background:var(--pale);
  color:var(--blue-deep);
}
.member-row{ flex-wrap:wrap; }

.admin-tag-clickable{
  cursor:pointer;
  transition:transform .12s ease, opacity .12s ease;
}
.admin-tag-clickable:active{ transform:scale(0.94); opacity:.8; }

.promote-pill{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:11px;
  letter-spacing:.2px;
  color:var(--blue);
  background:var(--pale);
  border:none;
  border-radius:20px;
  padding:4px 10px;
  cursor:pointer;
  flex-shrink:0;
  transition:transform .12s ease, background .12s ease;
}
.promote-pill:active{
  transform:scale(0.94);
  background:var(--sky);
  color:var(--white);
}

/* ============ ORG CHANNEL REDESIGN (append to style.css) ============ */

.org-banner{
  background:linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 60%, var(--blue-deep) 130%);
  border-radius:var(--radius-lg);
  padding:20px;
  color:var(--white);
  box-shadow:0 10px 28px rgba(8,27,61,0.28);
}
.org-banner-top{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}
.org-banner-logo{
  width:56px; height:56px;
  border-radius:16px;
  object-fit:cover;
  flex-shrink:0;
  box-shadow:0 4px 14px rgba(0,0,0,0.25);
}
.org-banner-logo-placeholder{
  display:flex; align-items:center; justify-content:center;
  font-size:26px;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.16);
}
.org-banner-titles h1{
  font-family:'Rajdhani',sans-serif;
  font-size:24px;
  margin:0;
  color:var(--white);
}
.org-banner-titles p{ color:#B9C7E6; }
.org-banner .code-row{
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:none;
}
.org-banner .code-chip{ background:rgba(255,255,255,0.14); color:var(--white); }
.org-banner .hint{ color:#B9C7E6; }
.org-banner .ghost-btn{
  background:rgba(255,255,255,0.1);
  border-color:rgba(255,255,255,0.18);
  color:var(--white);
}

/* Announcements */
.ann-composer{
  background:var(--white);
  border-radius:var(--radius);
  padding:14px;
  box-shadow:var(--shadow);
  margin-bottom:6px;
}
.ann-card{
  background:var(--white);
  border-radius:14px;
  padding:14px 16px;
  box-shadow:var(--shadow);
  margin-bottom:10px;
}
.ann-card.ann-pinned{
  border:2px solid var(--gold);
  background:linear-gradient(135deg, #FFFBEF, var(--white));
}
.ann-pin-badge{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:11px;
  color:var(--gold-deep);
  margin-bottom:4px;
}
.ann-body{
  font-size:14.5px;
  color:var(--ink);
  line-height:1.45;
  white-space:pre-wrap;
}
.ann-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:8px;
  font-size:12px;
  color:var(--ink-soft);
}
.ann-admin-actions{ display:flex; gap:10px; }

/* Live pulse used on org overview tournament rows */
.status-pill.active{ position:relative; }

/* ============ ORG CHANNEL REDESIGN (append to style.css) ============ */

.org-banner{
  background:linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 60%, var(--blue-deep) 130%);
  border-radius:var(--radius-lg);
  padding:20px;
  color:var(--white);
  box-shadow:0 10px 28px rgba(8,27,61,0.28);
}
.org-banner-top{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}
.org-banner-logo{
  width:56px; height:56px;
  border-radius:16px;
  object-fit:cover;
  flex-shrink:0;
  box-shadow:0 4px 14px rgba(0,0,0,0.25);
}
.org-banner-logo-placeholder{
  display:flex; align-items:center; justify-content:center;
  font-size:26px;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.16);
}
.org-banner-titles h1{
  font-family:'Rajdhani',sans-serif;
  font-size:24px;
  margin:0;
  color:var(--white);
}
.org-banner-titles p{ color:#B9C7E6; }
.org-banner .code-row{
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:none;
}
.org-banner .code-chip{ background:rgba(255,255,255,0.14); color:var(--white); }
.org-banner .hint{ color:#B9C7E6; }
.org-banner .ghost-btn{
  background:rgba(255,255,255,0.1);
  border-color:rgba(255,255,255,0.18);
  color:var(--white);
}

/* Announcements */
.ann-composer{
  background:var(--white);
  border-radius:var(--radius);
  padding:14px;
  box-shadow:var(--shadow);
  margin-bottom:6px;
}
.ann-card{
  background:var(--white);
  border-radius:14px;
  padding:14px 16px;
  box-shadow:var(--shadow);
  margin-bottom:10px;
}
.ann-card.ann-pinned{
  border:2px solid var(--gold);
  background:linear-gradient(135deg, #FFFBEF, var(--white));
}
.ann-pin-badge{
  font-family:'Rajdhani',sans-serif;
  font-weight:700;
  font-size:11px;
  color:var(--gold-deep);
  margin-bottom:4px;
}
.ann-body{
  font-size:14.5px;
  color:var(--ink);
  line-height:1.45;
  white-space:pre-wrap;
}
.ann-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:8px;
  font-size:12px;
  color:var(--ink-soft);
}
.ann-admin-actions{ display:flex; gap:10px; }

/* Live pulse used on org overview tournament rows */
.status-pill.active{ position:relative; }

.modal-card.modal-lg{ max-width:560px; }
.modal-scroll{ max-height:55vh; overflow-y:auto; padding-right:2px; margin-bottom:6px; }
.pill-toggle.wrap{ flex-wrap:wrap; }
.status-pill.unsettled{ background:#FFE9EA; color:var(--coral); }

/* Booking flow */
.booking-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:15px 16px;
  margin-bottom:14px;
  border-radius:15px;
  background:linear-gradient(135deg,#EFF6FF,#F9FBFF);
  border:1px solid #D8E7FB;
}
.booking-hero .hint{ margin:3px 0 0; }
.booking-hero .primary-btn{ flex-shrink:0; white-space:nowrap; }
.booking-card{ border-left:3px solid #D8E7FB; }
.booking-card:has(.status-pill.unsettled){ border-left-color:var(--coral); }
.booking-card:has(.status-pill.completed){ border-left-color:#1B8A4C; }
#bookingsSubTabs button{ flex:1; padding-left:7px; padding-right:7px; }
.calendar-panel{
  background:var(--white);
  border-radius:16px;
  padding:14px;
  box-shadow:var(--shadow);
}
.calendar-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; text-align:center; }
.calendar-head .chip-icon-btn{ width:34px; height:34px; font-size:25px; line-height:1; color:var(--blue); }
.calendar-title{ font-family:'Rajdhani',sans-serif; font-size:21px; font-weight:700; color:var(--ink); line-height:1; }
.calendar-head .text-btn{ font-size:11px; padding:4px 0 0; }
.calendar-legend{ display:flex; flex-wrap:wrap; gap:10px; padding:9px 0 13px; color:var(--ink-soft); font-size:11px; font-weight:700; }
.calendar-legend span{ display:inline-flex; align-items:center; gap:5px; }
.calendar-dot{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.calendar-dot.upcoming{ background:var(--blue); }.calendar-dot.unsettled{ background:var(--coral); }.calendar-dot.settled{ background:#1B8A4C; }
.calendar-grid{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border-top:1px solid #E5EBF4; border-left:1px solid #E5EBF4; overflow:hidden; border-radius:10px; }
.calendar-weekday{ padding:8px 2px; text-align:center; background:#F6F8FC; color:var(--ink-soft); font-size:10px; font-weight:800; border-right:1px solid #E5EBF4; border-bottom:1px solid #E5EBF4; }
.calendar-day{ min-height:102px; padding:5px 4px; background:#fff; border-right:1px solid #E5EBF4; border-bottom:1px solid #E5EBF4; overflow:hidden; }
.calendar-day.outside{ background:#FAFBFD; }.calendar-day.outside .calendar-date{ color:#B6C0D0; }
.calendar-date{ width:22px; height:22px; display:flex; align-items:center; justify-content:center; margin:0 0 4px; border-radius:50%; color:var(--ink-soft); font-size:11px; font-weight:800; }
.calendar-day.today .calendar-date{ background:var(--blue); color:#fff; }
.calendar-event{ display:block; width:100%; overflow:hidden; margin:3px 0; padding:4px 5px; border:0; border-radius:5px; text-align:left; white-space:nowrap; text-overflow:ellipsis; cursor:pointer; font-size:9px; font-weight:800; line-height:1.25; }
.calendar-event span{ margin-right:3px; opacity:.78; font-size:8px; }.calendar-event.upcoming{ background:#E8F1FF; color:#1E5AB6; }.calendar-event.past{ background:#EEF1F5; color:#687589; }.calendar-event.unsettled{ background:#FFE6E8; color:#B62D3A; }.calendar-event.settled{ background:#E6F7EC; color:#187341; }
.calendar-event:active{ transform:scale(.98); }
@media (max-width:430px){
  .calendar-panel{ padding:10px; margin:0 -2px; }
  .calendar-day{ min-height:78px; padding:4px 2px; }
  .calendar-event{ padding:3px; font-size:8px; }.calendar-event span{ display:none; }
}
.booking-label{
  display:block;
  margin:14px 0 6px;
  color:var(--ink);
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}
.booking-help{
  display:flex;
  flex-direction:column;
  gap:3px;
  margin:6px 0 12px;
  padding:11px 12px;
  background:linear-gradient(135deg,#EEF5FF,#F8FBFF);
  border:1px solid #D6E5FC;
  border-radius:12px;
  color:var(--ink-soft);
  font-size:12px;
  line-height:1.35;
}
.booking-help strong{ color:var(--blue); font-size:13px; }
.field-with-suffix{ display:flex; align-items:center; gap:10px; }
.field-with-suffix .modal-input{ margin:0; flex:1; }
.field-with-suffix span{ color:var(--ink-soft); font-size:13px; min-width:58px; }
.hour-choices{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; max-width:210px; }
.hour-choice{
  border:1px solid #D8E1EF;
  background:#fff;
  border-radius:8px;
  color:var(--ink-soft);
  padding:4px 7px;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.hour-choice.selected{ background:var(--blue); border-color:var(--blue); color:#fff; box-shadow:0 3px 8px rgba(37,99,235,.2); }
.manual-amount{ width:92px; margin:0 !important; }
.split-total{
  margin:10px 0 2px;
  padding:10px 12px;
  border-radius:10px;
  background:#F2F6FB;
  color:var(--ink-soft);
  font-size:12px;
  font-weight:700;
}
.split-total.is-pending{ background:#FFF8E6; color:#9A6700; }
.split-total.is-over{ background:#FFE9EA; color:var(--coral); }
@media (max-width:430px){
  .booking-hero{ align-items:flex-start; flex-direction:column; }
  .booking-hero-actions{ width:100%; }
  .booking-hero-actions .ghost-btn,
  .booking-hero-actions .primary-btn{ flex:1; padding-left:10px; padding-right:10px; font-size:14px; }
  .hour-choices{ max-width:150px; }
  .hour-choice{ padding:4px 6px; }
}

/* ============ VISIBLE BOOKING ACTION BUTTONS + OVERFLOW FIXES ============ */

/* the buttons were relying on default browser button styling — never had
   real classes defined. Give them proper size/contrast. */
.booking-card-actions{ display:flex; gap:8px; }
.booking-action-btn{
  display:flex; align-items:center; gap:6px;
  border:1.5px solid #D8E1EF; background:#fff; color:var(--ink-soft);
  border-radius:10px; padding:7px 12px; font-family:'Rajdhani',sans-serif;
  font-weight:800; font-size:13px; cursor:pointer; white-space:nowrap;
  transition:transform .12s ease, background .12s ease;
}
.booking-action-btn:active{ transform:scale(0.94); }
.booking-action-btn.delete{
  border-color:#FFC9CD; color:var(--coral); background:#FFF3F4;
}
.booking-action-btn.delete:active{ background:#FFE3E5; }
.booking-action-btn svg{ flex-shrink:0; }

/* Prevent horizontal overflow app-wide (fixes org stats button and
   booking modal fields going off-screen on narrow devices) */
html, body{ overflow-x:hidden; }
.app-shell{ overflow-x:hidden; max-width:100vw; }

/* org detail tab row (Overview/Announcements/Tournaments/Members/Stats)
   was one un-wrapping flex row — the 5th button (Stats) pushed off-screen.
   Let it wrap into two rows on narrow screens instead. */
#orgTabsToggle{ flex-wrap:wrap; }
#orgTabsToggle button{ flex:1 1 30%; min-width:72px; }

/* modal cards (used for booking log/edit steps) could exceed viewport
   width on small phones; clamp to viewport minus margin */
.modal-card, .modal-card.modal-lg{
  max-width:min(560px, calc(100vw - 24px));
  box-sizing:border-box;
  width:calc(100% - 0px);
}

.booker-tag{
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:10.5px; text-transform:uppercase;
  background:var(--pale); color:var(--blue-deep); padding:2px 7px; border-radius:10px; margin-left:4px;
}

.booking-hero-actions{
  display:flex;
  gap:8px;
  flex-shrink:0;
  flex-wrap:nowrap;
}
.booking-hero-actions .ghost-btn,
.booking-hero-actions .primary-btn{
  white-space:nowrap;
}

.org-badge-inline {
  font-size: 12px;
  margin-left: 6px;
  padding: 2px 8px;
  cursor: pointer;
}
.org-badge-inline:hover {
  opacity: 0.8;
}

/* ============================================================
   Install banner — paste this into style.css (per your note in
   index.html about consolidating additions into one stylesheet
   rather than linking separate files).
   ============================================================ */

.install-banner {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 500;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(8, 27, 61, 0.18);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  max-width: 420px;
  margin: 0 auto;
}

.install-banner.show {
  opacity: 1;
  transform: translateY(0);
}

.install-banner-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--blue);
}

.install-banner-actions {
  justify-content: flex-end;
}

/* ============================================================
   Discover screen — "full" listing state (append to style.css)
   Used by discover.js on org-row/tournament-row when member_limit/
   player_limit has been reached, so a full listing reads as
   unavailable rather than looking identical to a joinable one.
   ============================================================ */

.row-disabled{
  opacity:.55;
  cursor:not-allowed !important;
}
.row-disabled:active{
  transform:none !important;
}

/* ============================================================
   Install banner — paste this into style.css (per your note in
   index.html about consolidating additions into one stylesheet
   rather than linking separate files).
   ============================================================ */

.install-banner {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 500;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(8, 27, 61, 0.18);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  max-width: 420px;
  margin: 0 auto;
}

.install-banner.show {
  opacity: 1;
  transform: translateY(0);
}

.install-banner-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--blue);
}

.install-banner-actions {
  justify-content: flex-end;
}

.home-quick-actions{ display:flex; gap:10px; }
.quick-action-btn{
  flex:1; display:flex; flex-direction:column; align-items:center; gap:6px;
  background:var(--white); border:2px solid #DCEBF7; border-radius:var(--radius);
  padding:16px 10px; cursor:pointer; transition:transform .15s ease;
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14px; color:var(--blue-deep);
}
.quick-action-btn:active{ transform:scale(0.96); }
.quick-action-icon{ font-size:22px; }
.home-type-tag{
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:10.5px; text-transform:uppercase;
  padding:2px 7px; border-radius:8px; background:var(--pale); color:var(--blue-deep); margin-right:6px;
}

.home-quick-actions{ display:flex; gap:10px; margin-bottom:6px; }
.quick-action-card{
  flex:1; display:flex; flex-direction:column; align-items:flex-start; gap:4px;
  background:var(--white); border:2px solid #DCEBF7; border-radius:var(--radius);
  padding:14px 16px; cursor:pointer; text-align:left; transition:transform .15s ease;
}
.quick-action-card:active{ transform:scale(0.97); }
.quick-action-icon{ font-size:20px; }
.quick-action-title{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:15px; color:var(--blue-deep); }
.quick-action-sub{ font-size:11.5px; color:var(--ink-soft); line-height:1.3; }

.sport-filter-row{
  display:flex; gap:6px; overflow-x:auto; margin:16px 0 4px; padding-bottom:2px;
}
.sport-filter-row button{
  flex-shrink:0; border:none; background:var(--pale); color:var(--ink-soft);
  padding:7px 14px; border-radius:20px; font-family:'Rajdhani',sans-serif; font-weight:700;
  font-size:13.5px; cursor:pointer;
}
.sport-filter-row button.active{
  background:linear-gradient(120deg,var(--blue),var(--sky-deep)); color:var(--white);
}

.home-section-head{
  display:flex; align-items:center; justify-content:space-between; margin:20px 0 8px;
}
.home-section-title{
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:16px; color:var(--blue-deep);
}
.home-section-head .text-btn{ padding:0; font-weight:700; color:var(--blue); }

.home-empty-mini{
  color:var(--ink-soft); font-size:13px; padding:14px 4px; text-align:center;
}

/* distinguish groups visually via a colored left border + icon tint */
.tournament-row.is-group{ border-left:4px solid var(--sky); }
.tournament-row.is-instant{ border-left:4px solid var(--lime); }