:root{--app-black:#111511;--app-cream:#f7f8f3;--app-white:#fff;--app-lime:#d7fa55;--app-line:#dce1d8;--app-muted:#69736a;--app-grey:#eff1eb}
body.logged-in{background:var(--app-cream);color:var(--app-black);font-family:"DM Sans",Arial,sans-serif}
body.logged-in main{max-width:1280px;padding-bottom:130px}
body.logged-in .site-header{background:var(--app-black);min-height:68px;padding-top:12px;padding-bottom:12px}
body.logged-in .brand{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:2rem;letter-spacing:-.055em}
body.logged-in .site-header nav{font-size:.79rem;gap:20px;font-weight:700}
body.logged-in .site-header nav>a:not(.button){color:#d7ddd3}
body.logged-in .site-header nav>a:hover{color:var(--app-lime)}
body.logged-in .site-header nav .nav-signout{background:rgba(255,255,255,.08)!important;color:#9aa79c!important;padding:7px 14px!important;font-size:.73rem;margin-left:10px;border:1px solid rgba(255,255,255,.12);border-radius:999px;transition:all .18s ease;letter-spacing:.01em}
body.logged-in .site-header nav .nav-signout:hover{background:rgba(255,255,255,.15)!important;color:#fff!important;border-color:rgba(255,255,255,.25)}
body.logged-in .site-header nav .nav-add-game-btn{background:var(--app-lime)!important;color:var(--app-black)!important;border-radius:999px!important;padding:8px 16px!important;font-size:.78rem!important;font-weight:850!important;display:inline-flex;align-items:center;gap:4px;transition:transform .15s,box-shadow .15s}
body.logged-in .site-header nav .nav-add-game-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(215,250,85,.3)}
body.logged-in .site-footer{display:none}
body.logged-in .eyebrow,body.logged-in .app-kicker{font-size:.67rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#5c6a5e}
body.logged-in .button.lime{background:var(--app-lime);color:var(--app-black)}
body.logged-in .score-card,body.logged-in .player-card,body.logged-in .game-form-panel{box-shadow:none}
@media(min-width:801px){
  .mobile-header-actions,.mobile-nav-backdrop,.mobile-nav-drawer,.mobile-nav{display:none!important}
}
.app-bottom-nav{display:none}
.global-log-game{display:none}

/* Home: activity first, centered Recent Games feed */
.app-home{padding:36px 0 60px}
.app-home-focused{max-width:840px;margin:0 auto}
.app-home-header{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:20px}
.app-kicker{margin:0 0 6px}
.app-home-header h1,.feed-heading h1,.feed-heading h2,.activity-heading h2{font-family:"Barlow Condensed","Arial Narrow",sans-serif;line-height:.95;letter-spacing:-.015em;text-transform:uppercase}
.app-home-header h1,.home-main-title{font-size:clamp(2.6rem,4.5vw,3.6rem);margin:0;font-weight:800}
.app-season{font-size:.67rem;font-weight:850;letter-spacing:.12em;color:#586259;white-space:nowrap;padding-bottom:8px}
.app-season span{color:#91aa15;font-size:.54rem;margin:0 3px}
.home-record{display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--app-black);color:#fff;border-radius:15px;padding:20px 30px;margin-bottom:37px}
.home-record>div:first-child{display:flex;align-items:baseline;gap:20px}
.home-record-label{font-size:.66rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#a9b3a8;white-space:nowrap}
.home-record>div:first-child>strong{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:3.9rem;line-height:.85;letter-spacing:.01em;font-weight:800;font-variant-numeric:tabular-nums}
.home-record>div:first-child>strong span{color:var(--app-lime);margin:0 .1em}
.home-record>div:first-child>small{font-size:.66rem;color:#b3beb0;letter-spacing:.08em;white-space:nowrap}
.home-record-side{display:flex;gap:27px}.home-record-side>div{display:flex;align-items:baseline;gap:7px;border-left:1px solid #425046;padding-left:23px;white-space:nowrap}
.home-record-side strong{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
.home-record-side span{font-size:.68rem;color:#b9c4b7;font-weight:700}
.home-activity-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,.8fr);gap:42px;align-items:start}
.feed-heading,.activity-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:20px}
.feed-heading h2,.activity-heading h2{font-size:clamp(2rem,3vw,2.8rem);font-weight:800;margin:0}
.feed-heading>a{font-size:.75rem;font-weight:850;color:#32452f;white-space:nowrap;padding-bottom:3px}
.home-game-feed .score-card{margin-bottom:14px}
.home-leaders{padding:0;background:none;border:0}
.home-leader-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;padding:17px 3px;border-top:1px solid var(--app-line);font-size:.82rem}
.home-leader-row b{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:1.4rem;color:#768272}
.home-leader-row span{font-weight:750;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-leader-row strong{font-size:.7rem;white-space:nowrap}

/* Empty State Placeholder */
.empty-games-placeholder{display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--app-white);border:1.5px dashed var(--app-line);border-radius:18px;padding:48px 24px;margin:16px 0}
.empty-court-icon{width:64px;height:64px;display:grid;place-items:center;background:var(--app-grey);color:#6b796d;border-radius:50%;margin-bottom:18px}
.empty-court-icon svg{width:34px;height:34px}
.empty-placeholder-title{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:1.8rem;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;margin:0 0 8px;color:var(--app-black)}
.empty-placeholder-text{font-size:.9rem;color:#637165;max-width:380px;line-height:1.45;margin:0 0 24px}
.empty-action-btn{display:inline-flex;align-items:center;gap:6px;padding:12px 24px;border-radius:999px;font-size:.88rem;font-weight:850;box-shadow:0 6px 20px rgba(17,21,17,.12);transition:transform .2s,box-shadow .2s}
.empty-action-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,21,17,.18)}

/* Format Tabs: Singles vs Doubles Separation */
.match-format-tabs{display:inline-flex;align-items:center;background:#e9ece5;padding:4px;border-radius:999px;gap:4px;margin-bottom:18px}
.format-tab-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:999px;font-size:.78rem;font-weight:800;color:#5a685c;text-decoration:none;transition:all .18s ease;list-style:none}
.format-tab-btn::before,.format-tab-btn::marker{content:none!important;display:none!important}
.format-tab-btn:hover{color:var(--app-black);background:rgba(255,255,255,.5)}
.format-tab-btn.is-active{background:var(--app-black);color:#fff;box-shadow:0 3px 10px rgba(0,0,0,.15)}

/* Tournament / Match Score Wireframe Cards */
.bracket-match-card{
  background:var(--app-white);
  border:1px solid #dce2d9;
  border-radius:12px;
  overflow:hidden;
  margin-bottom:16px;
  box-shadow:0 2px 6px rgba(17,21,17,.03);
  transition:border-color .2s,box-shadow .2s,transform .15s;
}
.bracket-match-card:hover{
  border-color:#b5c2b2;
  box-shadow:0 6px 20px rgba(17,21,17,.07);
  transform:translateY(-1px);
}
.bracket-match-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 18px;
  background:#f9faf7;
  border-bottom:1px solid #e7ebe4;
  font-size:.75rem;
}
.bracket-match-context{
  display:flex;
  align-items:center;
  gap:8px;
  color:#617062;
  flex-wrap:wrap;
}
.match-format-tag{
  display:inline-block;
  font-size:.66rem;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  padding:2px 8px;
  background:#e7ece3;
  color:#314032;
  border-radius:4px;
}
.match-event-title{
  font-weight:650;
  color:#344235;
}
.match-header-dot{
  color:#9daaa0;
}
.match-date-tag{
  color:#758577;
  font-size:.72rem;
}
.bracket-match-actions{
  margin-left:auto;
}
.bracket-action-link{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 11px;
  border-radius:999px;
  background:#edf2eb;
  border:1px solid #d4ddd2;
  color:#253727;
  font-size:.73rem;
  font-weight:750;
  text-decoration:none;
  transition:all .15s ease;
  white-space:nowrap;
}
.bracket-action-link:hover{
  background:#1a2b1d;
  color:var(--app-lime);
  border-color:#1a2b1d;
  text-decoration:none;
  transform:translateY(-1px);
  box-shadow:0 2px 6px rgba(0,0,0,.08);
}

.recap-match-card{
  margin-bottom:28px;
  box-shadow:0 4px 16px rgba(17,21,17,.06);
}
.recap-match-card .bracket-match-header{
  padding:12px 20px;
  background:#f4f7f2;
}
.recap-match-card .bracket-team-row{
  padding:16px 20px;
  min-height:64px;
}
.recap-match-card .player-name{
  font-size:1.2rem;
}
.recap-match-card .game-score-box{
  width:48px;
  height:50px;
  font-size:1.15rem;
}
.recap-final-tag{
  display:inline-block;
  padding:3px 8px;
  border-radius:4px;
  background:#1a2b1d;
  color:var(--app-lime);
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.08em;
}

.bracket-match-body{
  display:flex;
  flex-direction:column;
}
.bracket-team-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 18px;
  min-height:56px;
  border-bottom:1px solid #edf1eb;
  transition:background-color .15s;
}
.bracket-team-row:last-child{
  border-bottom:none;
}
.bracket-team-players{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
  padding-right:16px;
}
.bracket-team-players .player-name{
  font-size:.92rem;
  line-height:1.28;
  color:#556356;
  font-weight:450;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.bracket-team-row.is-winner .bracket-team-players .player-name{
  color:#111812;
  font-weight:750;
}
.bracket-scores-group{
  display:flex;
  align-items:center;
  gap:1px;
  margin-left:auto;
  flex-shrink:0;
}
.game-score-box{
  width:42px;
  height:44px;
  display:grid;
  place-items:center;
  font-family:"DM Sans",-apple-system,sans-serif;
  font-size:1.02rem;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  border-left:1px solid #edf1eb;
  color:#829084;
  background:#fafbf9;
  transition:background-color .15s;
}
.bracket-team-row.is-winner .game-score-box.won{
  background:#d1fae5; /* mint green highlight matching wireframe */
  color:#065f46;      /* dark green text */
  font-weight:800;
}
.bracket-team-row .game-score-box.won{
  background:#d1fae5;
  color:#065f46;
  font-weight:800;
}
.bracket-team-row.is-loser .game-score-box.lost{
  background:#fff;
  color:#94a396;
}
.game-score-box.empty{
  color:#cbd5ce;
  background:#fafbf9;
}

@media(max-width:600px){
  .bracket-match-header{padding:8px 12px;font-size:.7rem}
  .bracket-team-row{padding:10px 12px}
  .bracket-team-players .player-name,.recap-match-card .player-name{font-size:1.08rem}
  .game-score-box{width:34px;height:38px;font-size:.92rem}
}

/* Recap: final score, then a compact activity timeline. */
.app-game-recap{max-width:920px;padding:30px 0 70px}
.recap-page-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;letter-spacing:normal}
.recap-back-link{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:#eef3eb;border-radius:999px;color:#27402c!important;font-size:.88rem;font-weight:800;letter-spacing:normal;text-decoration:none;transition:all .15s ease;line-height:1}
.recap-back-link:hover{background:#dfe9db;color:#142718!important;transform:translateX(-2px)}
.recap-back-link svg{flex-shrink:0}
.recap-admin-actions{display:flex;align-items:center;gap:8px;letter-spacing:normal}
.recap-admin-actions .match-delete-form{margin:0}
.recap-page-head .match-edit-link{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid #b8c8b7;background:#fff;border-radius:999px;color:#315536;font-size:.84rem;font-weight:800;letter-spacing:normal;text-decoration:none;line-height:1;transition:all .15s ease}
.recap-page-head .match-edit-link:hover{background:#edf4ec;border-color:#8da48a;color:#1f4224}
.recap-page-head .match-edit-link svg{flex-shrink:0}
.match-delete-btn{display:inline-flex;align-items:center;gap:5px;padding:8px 14px;border:1px solid #f1cfc6;background:#fff7f5;border-radius:999px;color:#a82e14;font-family:inherit;font-size:.84rem;font-weight:800;letter-spacing:normal;cursor:pointer;line-height:1;transition:all .15s ease}
.match-delete-btn:hover{background:#ffede8;border-color:#e5a799;color:#851a03}
.match-delete-btn svg{flex-shrink:0}

/* Toast notification for game saved/updated/deleted */
.match-saved-toast{display:flex;align-items:center;gap:13px;padding:14px 18px;margin:0 0 20px;background:#f0f9eb;border:1px solid #cce8be;border-left:4px solid #589647;border-radius:14px;box-shadow:0 4px 18px rgba(34,75,40,.08);animation:toastSlideDown .25s cubic-bezier(0.16,1,0.3,1)}
@keyframes toastSlideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.match-saved-toast-icon{flex-shrink:0;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#3c7d2e;color:#fff}
.match-saved-toast-icon svg{width:16px!important;height:16px!important;display:block}
.match-saved-toast-text{display:flex;flex-direction:column;gap:2px}
.match-saved-toast-text strong{font-size:.92rem;font-weight:850;color:#1f451b;letter-spacing:-.01em}
.match-saved-toast-text span{font-size:.8rem;color:#4a6d45;font-weight:600}
.match-saved-message{margin:0 0 20px}
body.single-match:has(.match-saved-message) .global-log-game{display:none}
body.single-match:has(.match-saved-message) .app-note-activity:has(.game-notes-empty){display:none}
body.single-match:has(.match-saved-message) .app-game-recap{padding-top:14px}
.recap-scoreboard{background:var(--app-black);color:#fff;border-radius:17px;overflow:hidden;padding:clamp(20px,4vw,40px)}
.recap-board-top{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid #3c473d;padding-bottom:18px;color:#c4cec2;font-size:.74rem;font-weight:650}
.recap-final{display:inline-block;padding:5px 9px;border:1px solid var(--app-lime);border-radius:4px;color:var(--app-lime);font-size:.6rem;font-weight:900;letter-spacing:.15em}
.recap-dot{color:var(--app-lime);padding:0 6px}
.recap-board-team{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:130px;padding:21px 0;border-bottom:1px solid #3c473d;color:#c9d1c7}
.recap-board-team.is-winner{color:#fff}
.recap-board-team small{display:block;margin-bottom:6px;font-size:.64rem;font-weight:900;letter-spacing:.13em;color:#879589}
.recap-board-team.is-winner small{color:var(--app-lime)}
.recap-board-team h1,.recap-board-team h2{font-family:"DM Sans",Arial,sans-serif;font-size:clamp(1.1rem,2.5vw,1.75rem);line-height:1.22;letter-spacing:-.05em;font-weight:750;margin:0;max-width:600px}
.recap-board-team>strong{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:clamp(4rem,8vw,7rem);line-height:.85;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:0;color:#c9d1c7}
.recap-board-team.is-winner>strong{color:var(--app-lime)}
.recap-board-foot{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:19px;color:#b9c2b6;font-size:.72rem}
.share-game{border:0;background:transparent;color:var(--app-lime);cursor:pointer;font:inherit;font-weight:850;white-space:nowrap}
.share-game:hover{text-decoration:underline;text-underline-offset:4px}
.app-note-activity{margin-top:34px}
.activity-heading{margin-bottom:24px}.activity-heading>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #c9d1c7;font-size:.72rem;font-weight:850}
.note-timeline{position:relative;list-style:none;margin:0;padding:0 0 0 26px;border-left:1px solid #bec8bc}
.note-timeline li{position:relative;padding:0 0 28px 11px;line-height:1.5}
.note-timeline li:last-child{padding-bottom:7px}
.note-timeline-dot{position:absolute;top:4px;left:-32px;width:11px;height:11px;border-radius:50%;background:var(--app-lime);border:2px solid var(--app-black)}
.note-timeline small{font-size:.64rem;font-weight:850;letter-spacing:.09em;text-transform:uppercase;color:#6a756a}
.note-timeline p{margin:8px 0 0;font-size:.91rem;white-space:pre-wrap}
.note-body{font-size:.91rem;color:#222822;line-height:1.55}
.note-body p{margin:6px 0 0}
.note-body p:first-child{margin-top:4px}
.note-body strong{font-weight:800;color:var(--app-black)}
.note-body em{font-style:italic;color:#394839}
.note-body s{color:#889688}
.note-body blockquote{margin:8px 0;padding:6px 12px;background:rgba(215,250,85,.12);border-left:3px solid #91b514;border-radius:0 6px 6px 0;font-style:italic;color:#354435}
.note-body ul.note-list{margin:6px 0 6px 20px;padding:0;list-style:disc}
.note-body ul.note-list li{padding:0 0 4px 0;list-style:disc}
.rcrd-note-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;background:var(--app-black);color:var(--app-lime);font-size:.7rem;font-weight:850;letter-spacing:.02em;vertical-align:middle;margin:0 4px 2px 0}
.app-note-activity .game-notes-empty{font-size:.83rem;color:#69756b}

/* Rich Note Editor & Composer */
.rcrd-rich-editor{display:flex;flex-direction:column;background:var(--app-white);border:1px solid #bfc8bc;border-radius:12px;overflow:hidden;transition:border-color .2s,box-shadow .2s;margin-top:10px}
.rcrd-rich-editor:focus-within{border-color:#2a3a2a;box-shadow:0 0 0 3px rgba(42,58,42,.12)}
.rcrd-editor-chips{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#f3f6ee;border-bottom:1px solid #e1e7dc;overflow-x:auto;scrollbar-width:none}
.rcrd-editor-chips::-webkit-scrollbar{display:none}
.rcrd-chips-label{font-size:.65rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#6a796b;white-space:nowrap;margin-right:2px}
.rcrd-chip{border:1px solid #d2dccf;background:var(--app-white);color:#374737;border-radius:999px;padding:4px 10px;font-size:.72rem;font-weight:750;cursor:pointer;white-space:nowrap;transition:all .15s}
.rcrd-chip:hover{background:var(--app-lime);color:var(--app-black);border-color:#adc926;transform:translateY(-1px)}
.rcrd-editor-toolbar{display:flex;align-items:center;gap:4px;padding:7px 12px;background:#f9faf6;border-bottom:1px solid #e6ece0}
.rcrd-tool-btn{border:1px solid transparent;background:transparent;color:#445544;border-radius:6px;width:32px;height:32px;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s}
.rcrd-tool-btn svg{display:block}
.rcrd-tool-btn:hover{background:#e7eee1;color:var(--app-black);border-color:#d4decb}
.rcrd-tool-btn:active{background:#dbe5d3;transform:scale(.95)}
.rcrd-tool-divider{width:1px;height:18px;background:#dce3d8;margin:0 4px}
.rcrd-rich-editor textarea{width:100%!important;box-sizing:border-box;border:0!important;outline:none!important;box-shadow:none!important;background:transparent!important;padding:12px 14px!important;font-size:.88rem!important;line-height:1.5!important;color:var(--app-black)!important;resize:vertical!important;min-height:85px}
.rcrd-editor-footer{display:flex;align-items:center;justify-content:space-between;padding:7px 14px;background:#fafbf8;border-top:1px solid #edf1eb;font-size:.66rem;color:#788779}
.rcrd-editor-hint{font-style:italic}
.rcrd-editor-counter{font-weight:750;font-variant-numeric:tabular-nums}
.rcrd-editor-counter.is-warning{color:#c2410c;font-weight:900}

.note-composer{margin-top:26px;border-top:1px solid var(--app-line);padding-top:17px}
.note-composer summary{width:max-content;cursor:pointer;font-size:.82rem;font-weight:850;list-style:none}
.note-composer summary::-webkit-details-marker{display:none}
.note-composer[open] summary{margin-bottom:16px}
.note-composer .game-note-form{max-width:680px;margin-top:0}
.note-composer .game-note-form button{background:var(--app-black);color:#fff;border-radius:8px;margin-top:12px}

/* Shared screens follow the same restrained palette. */
body.logged-in .sport-page-heading{padding:48px 0 28px}
body.logged-in .sport-page-heading h1{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:clamp(3.7rem,7vw,6.5rem);text-transform:uppercase;letter-spacing:-.015em;margin-bottom:9px}
body.logged-in .sport-page-heading h1 span{color:#a1be1d}
body.logged-in .sport-page-heading>p:last-child{font-size:.88rem}
body.logged-in .archive-add-game{display:none}
body.logged-in .profile-hero{background:var(--app-black);min-height:200px}
body.logged-in .profile-hero:before{display:none}
body.logged-in .profile-hero-mark{color:#303a30}
body.logged-in .profile-hero-mark span{color:var(--app-lime)}
body.logged-in .profile-hero h1{font-family:"Barlow Condensed","Arial Narrow",sans-serif;text-transform:uppercase;letter-spacing:-.015em}
/* Profile enhancements & Profile Edit */
.profile-avatar,
body.logged-in .profile-avatar{
  flex: 0 0 88px !important;
  width: 88px !important;
  height: 88px !important;
  min-width: 88px !important;
  min-height: 88px !important;
  max-width: 88px !important;
  max-height: 88px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: var(--app-lime) !important;
  display: grid !important;
  place-items: center !important;
  flex-shrink: 0 !important;
  border: 3px solid var(--app-lime) !important;
}
.profile-avatar img,
.profile-avatar .profile-avatar-image,
.profile-avatar .avatar{
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
}
.avatar-initial{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:2.8rem;font-weight:800;color:var(--app-black);line-height:1}
.profile-location-badge{display:inline-flex;align-items:center;gap:5px;background:rgba(215,250,85,.12);color:var(--app-lime);border:1px solid rgba(215,250,85,.3);padding:2px 10px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.02em;vertical-align:middle}
.profile-location-badge svg{opacity:.9}
.subline-dot{color:#6c7b6d;margin:0 4px}

/* Profile Hero Actions & Edit Trigger */
.profile-hero .profile-hero-mark{
  position:absolute !important;
  right:40px !important;
  bottom:15px !important;
  pointer-events:none !important;
  z-index:1 !important;
}
.profile-hero-actions{
  position:relative;
  display:flex;
  align-items:center;
  gap:16px;
  z-index:2;
}
.profile-edit-btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  background:var(--app-lime) !important;
  color:var(--app-black) !important;
  border:0 !important;
  border-radius:999px !important;
  padding:10px 20px !important;
  font-size:.84rem !important;
  font-weight:800 !important;
  cursor:pointer !important;
  box-shadow:0 4px 14px rgba(0,0,0,.15) !important;
  transition:all .2s ease !important;
  white-space:nowrap !important;
}
.profile-edit-btn:hover{
  background:#efff9f !important;
  transform:translateY(-2px) !important;
  box-shadow:0 8px 20px rgba(0,0,0,.2) !important;
}

/* Account Utility Bar below Hero */
.profile-account-bar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:20px;
  margin:16px 4px 0;
  padding:0;
}
.account-bar-link{
  font-size:.82rem;
  font-weight:750;
  color:#596d5e;
  text-decoration:none;
  transition:color .15s;
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.account-bar-link:hover{
  color:var(--moss);
  text-decoration:underline;
  text-underline-offset:3px;
}
.account-bar-link.sign-out-link{
  color:#824b3e;
}
.account-bar-link.sign-out-link:hover{
  color:#b43d28;
}

/* Profile Edit Modal Dialog */
.profile-modal-dialog{
  border:0 !important;
  padding:0 !important;
  background:transparent !important;
  max-width:580px !important;
  width:calc(100% - 32px) !important;
  margin:auto !important;
  border-radius:24px !important;
  overflow:visible !important;
  box-shadow:0 30px 80px rgba(10,25,18,.35) !important;
}
.profile-modal-dialog::backdrop{
  background:rgba(12,24,18,.68) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
.profile-modal-box{
  background:#fff;
  border:1px solid #d5dec9;
  border-radius:24px;
  padding:32px 36px;
  box-sizing:border-box;
}
.profile-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:22px;
  padding-bottom:18px;
  border-bottom:1px solid #edf2e8;
}
.profile-modal-title{
  font-family:inherit;
  font-size:1.6rem;
  font-weight:800;
  letter-spacing:-.04em;
  color:var(--app-black);
  margin:0 0 6px;
}
.profile-modal-desc{
  margin:0;
  font-size:.88rem;
  color:#596d5e;
  line-height:1.4;
}
.profile-modal-close{
  background:#f0f4ee;
  border:0;
  border-radius:50%;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  font-size:1rem;
  color:#475b4c;
  cursor:pointer;
  transition:all .15s ease;
  flex-shrink:0;
}
.profile-modal-close:hover{
  background:#e2e9df;
  color:#111;
  transform:scale(1.08);
}
.profile-modal-fields{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.modal-name-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.modal-field label{
  display:block;
  font-size:.76rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#3a4f40;
  margin-bottom:7px;
}
.modal-field input[type="text"],
.modal-field textarea{
  width:100% !important;
  box-sizing:border-box !important;
  background:#f7f9f5 !important;
  border:1px solid #c8d3c5 !important;
  border-radius:12px !important;
  padding:12px 14px !important;
  font-size:.92rem !important;
  color:var(--app-black) !important;
  font-family:inherit !important;
  transition:border-color .15s,box-shadow .15s,background .15s !important;
}
.modal-field input[type="text"]:focus,
.modal-field textarea:focus{
  border-color:var(--moss) !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(30,83,61,.14) !important;
  outline:none !important;
}
/* Avatar row in modal */
.avatar-upload-row{
  display:flex;
  align-items:center;
  gap:16px;
  background:#f7f9f5;
  border:1px solid #dbe2d6;
  border-radius:14px;
  padding:14px 18px;
}
.avatar-current-preview{
  width:58px;
  height:58px;
  flex:0 0 58px;
  border-radius:50%;
  overflow:hidden;
  border:2.5px solid var(--moss);
  background:#26543b;
  display:grid;
  place-items:center;
}
.avatar-current-preview img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  border-radius:50% !important;
}
.avatar-current-preview .avatar-initial{
  color:#fff;
  font-weight:900;
  font-size:1.6rem;
}
.avatar-upload-control{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
.upload-custom-btn{
  display:inline-block !important;
  background:#e6ede1 !important;
  color:#234431 !important;
  padding:8px 16px !important;
  border-radius:999px !important;
  font-size:.78rem !important;
  font-weight:800 !important;
  cursor:pointer !important;
  margin:0 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  border:1px solid #c5d3be !important;
  transition:background .15s,transform .15s !important;
}
.upload-custom-btn:hover{
  background:var(--app-lime) !important;
  color:var(--app-black) !important;
  transform:translateY(-1px) !important;
}
.file-name-chosen{
  font-size:.75rem;
  color:#6b7e6f;
  font-style:italic;
}
.file-input-hidden{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  border:0 !important;
}
.profile-modal-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  margin-top:24px;
  padding-top:18px;
  border-top:1px solid #edf2e8;
}
.modal-save-btn{
  background:var(--app-lime) !important;
  color:var(--app-black) !important;
  padding:12px 24px !important;
  border-radius:999px !important;
  font-weight:850 !important;
  font-size:.9rem !important;
  border:0 !important;
  cursor:pointer !important;
  transition:all .15s ease !important;
}
.modal-save-btn:hover{
  background:#efff9f !important;
  transform:translateY(-1px) !important;
}
.modal-cancel-btn{
  background:transparent !important;
  border:0 !important;
  color:#617464 !important;
  padding:10px 18px !important;
  font-size:.88rem !important;
  font-weight:750 !important;
  cursor:pointer !important;
  transition:color .15s !important;
}
.modal-cancel-btn:hover{
  color:var(--app-black) !important;
}

@media(max-width:900px){.home-activity-layout{grid-template-columns:1fr;gap:36px}.home-leaders{max-width:none}}

/* Mobile Navigation & Responsive Adjustments */
@media(max-width:800px){
  body.logged-in .site-header{min-height:60px;position:relative;z-index:90}
  body.logged-in .site-header .desktop-nav{display:none}
  .mobile-header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
  .mobile-header-add-btn{display:inline-flex;align-items:center;gap:5px;background:var(--app-lime);color:var(--app-black)!important;padding:7px 13px;border-radius:999px;font-size:.78rem;font-weight:850;text-decoration:none;box-shadow:0 2px 8px rgba(215,250,85,.25);line-height:1;transition:transform .15s ease}
  .mobile-header-add-btn:active{transform:scale(.96)}
  .mobile-nav-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;border:1px solid #445448;background:#18221a;color:#fff;cursor:pointer;padding:0;transition:background .15s,border-color .15s;-webkit-tap-highlight-color:transparent}
  .mobile-nav-toggle:active,.mobile-nav-toggle[aria-expanded="true"]{background:#233527;border-color:var(--app-lime)}
  .mobile-nav-toggle *{pointer-events:none}
  .mobile-nav-toggle .menu-icon{display:flex;flex-direction:column;gap:3.5px;width:16px;align-items:center}
  .mobile-nav-toggle .menu-icon i{display:block;width:100%;height:2px;background:currentColor;border-radius:2px}

  .mobile-nav-backdrop{display:none;position:fixed!important;inset:0!important;background:rgba(0,0,0,.7)!important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:99998!important;opacity:0;transition:opacity .25s ease}
  .mobile-nav-backdrop.is-open{display:block!important;opacity:1!important;pointer-events:auto!important}

  .mobile-nav-drawer{position:fixed!important;top:0!important;right:0!important;bottom:0!important;width:min(320px,86vw)!important;height:100dvh!important;background:#131d16!important;border-left:1px solid #233427!important;box-shadow:-12px 0 40px rgba(0,0,0,.6)!important;z-index:99999!important;transform:translateX(100%)!important;transition:transform .26s cubic-bezier(.16,1,.3,1)!important;display:flex!important;flex-direction:column!important;padding:20px max(18px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) 20px!important;box-sizing:border-box!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;pointer-events:none}
  .mobile-nav-drawer.is-open{transform:translateX(0)!important;pointer-events:auto!important}
  body.nav-drawer-open{overflow:hidden}

  .mobile-drawer-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:18px;border-bottom:1px solid #223326;margin-bottom:16px}
  .mobile-drawer-user{display:flex;align-items:center;gap:12px;min-width:0}
  .mobile-drawer-avatar{width:40px;height:40px;border-radius:50%;background:var(--app-lime);color:var(--app-black);font-weight:900;font-size:1.15rem;display:grid;place-items:center;flex-shrink:0}
  .mobile-drawer-user-info{display:flex;flex-direction:column;min-width:0}
  .mobile-drawer-name{color:#fff;font-weight:800;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-drawer-sublink{color:var(--app-lime);font-size:.75rem;font-weight:700;margin-top:2px;text-decoration:none}
  .mobile-drawer-close{width:36px;height:36px;border-radius:50%;border:1px solid #334438;background:#18251c;color:#a9baa9;display:grid;place-items:center;cursor:pointer;padding:0;transition:all .15s;-webkit-tap-highlight-color:transparent}
  .mobile-drawer-close *{pointer-events:none}
  .mobile-drawer-close:active{background:#233527;color:#fff;border-color:var(--app-lime)}

  .mobile-drawer-nav{display:flex;flex-direction:column;gap:5px;flex:1}
  .mobile-drawer-link{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:10px;color:#d7e0d7!important;font-size:.92rem;font-weight:750;text-decoration:none;transition:background .15s,color .15s}
  .mobile-drawer-link svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:#7a9483;flex-shrink:0}
  .mobile-drawer-link:hover,.mobile-drawer-link:active{background:#1e2d22;color:#fff!important}
  .mobile-drawer-link:hover svg,.mobile-drawer-link:active svg{color:var(--app-lime)}

  .mobile-drawer-add-btn{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--app-lime)!important;color:var(--app-black)!important;font-weight:850;font-size:.92rem;padding:13px 18px;border-radius:12px;margin:14px 0 8px;text-decoration:none;box-shadow:0 4px 14px rgba(215,250,85,.22);text-align:center}
  .mobile-drawer-add-btn:active{transform:scale(.98)}

  .mobile-drawer-signout{display:flex;align-items:center;gap:12px;padding:14px 14px 4px;color:#b27b72!important;font-size:.88rem;font-weight:750;margin-top:auto;border-top:1px solid #233327;text-decoration:none}
  .mobile-drawer-signout svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .mobile-drawer-signout:hover,.mobile-drawer-signout:active{color:#ec735b!important}

  /* Mobile floating Add a Game button removed per request */
  .global-log-game{display:none!important}

  body.logged-in main{padding-bottom:110px}
  .app-bottom-nav{position:fixed;z-index:50;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,1fr);padding:10px max(12px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--app-line);box-shadow:0 -6px 25px rgba(10,20,10,.06)}
  .app-bottom-nav a{display:grid;justify-items:center;gap:3px;padding:2px 0;color:#667167;font-size:.62rem;font-weight:750}
  .app-bottom-nav a[aria-current="page"]{color:var(--app-black)}
  .app-bottom-nav a[aria-current="page"] span{font-weight:900}
  .app-bottom-nav svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .app-bottom-nav a[aria-current="page"] svg{stroke:#7b9f0d}
  body.logged-in .site-footer{display:none}
  .app-home{padding-top:23px}
  .home-record{margin-bottom:30px}
  .profile-utilities{margin-bottom:0}
  .profile-edit-grid{grid-template-columns:1fr}
}

@media(max-width:600px){
  .app-home-header h1,.home-main-title{font-size:2.8rem}
  .home-record{padding:17px 19px;gap:14px}
  .home-record>div:first-child{gap:9px;align-items:center;flex-wrap:wrap}
  .home-record-label{width:100%}
  .home-record>div:first-child>strong{font-size:3.3rem}
  .home-record-side{gap:12px}
  .home-record-side>div{display:grid;gap:1px;border-left:1px solid #425046;padding-left:12px}
  .home-record-side strong{font-size:1.7rem}
  .home-record-side span{font-size:.58rem}
  .home-record>div:first-child>small{display:none}
  .feed-heading h2{font-size:2.2rem}
  .app-game-recap{padding-top:20px}
  .recap-scoreboard{padding:21px}
  .recap-board-top{align-items:flex-start;font-size:.66rem}
  .recap-board-team{min-height:105px;gap:12px;padding:18px 0}
  .recap-board-team h1,.recap-board-team h2{font-size:1.02rem}
  .recap-board-team>strong{font-size:4.7rem}
  .recap-board-foot{font-size:.67rem}
}

/* Auth Mode Switch: Sign In vs Sign Up */
.auth-mode-switch{display:inline-flex;background:#e5ebd0;padding:4px;border-radius:999px;gap:4px;margin-bottom:24px}
.auth-tab{padding:8px 18px;border-radius:999px;font-size:.82rem;font-weight:800;color:#354437;text-decoration:none;transition:all .15s}
.auth-tab:hover{color:var(--app-black);background:rgba(255,255,255,.4)}
.auth-tab.is-active{background:var(--app-black);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.auth-terms-note{font-size:.76rem;color:#617263;margin:4px 0 10px;line-height:1.4}

/* Registration Form Inputs & Name Fields */
.auth-name-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  width:100%;
}
.auth-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.auth-field label,
.login-form>label,
.login-form label:not(.login-options label){
  font-weight:750;
  font-size:.86rem;
  color:var(--app-black);
  display:block;
}
.auth-field input,
.login-form input:not([type="checkbox"]):not([type="radio"]){
  width:100% !important;
  border:1px solid #bfcbbd !important;
  border-radius:12px !important;
  background:#fff !important;
  padding:15px 17px !important;
  font:inherit !important;
  color:var(--ink) !important;
  outline:none !important;
  box-sizing:border-box !important;
  height:auto !important;
  line-height:normal !important;
}
.auth-field input:focus,
.login-form input:not([type="checkbox"]):not([type="radio"]):focus{
  border-color:var(--moss) !important;
  box-shadow:0 0 0 3px rgba(30,83,61,.15) !important;
}

/* Remember me & Forgot password row */
.login-options{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin:10px 0 16px !important;
}
.login-options label,
.login-options .remember-me{
  display:inline-flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:8px !important;
  font-weight:600 !important;
  font-size:.86rem !important;
  color:#53665a !important;
  cursor:pointer !important;
  margin:0 !important;
  line-height:1 !important;
  user-select:none !important;
}
.login-options label span,
.login-options .remember-me span{
  display:inline !important;
  line-height:1.2 !important;
}
.login-options input[type="checkbox"]{
  display:inline-block !important;
  width:16px !important;
  height:16px !important;
  min-width:16px !important;
  min-height:16px !important;
  max-width:16px !important;
  max-height:16px !important;
  margin:0 !important;
  padding:0 !important;
  cursor:pointer !important;
  accent-color:var(--app-black) !important;
  border:1px solid #bfcbbd !important;
  border-radius:4px !important;
  box-shadow:none !important;
  outline:none !important;
  flex:0 0 16px !important;
  vertical-align:middle !important;
}
.login-options a{
  font-size:.86rem !important;
  font-weight:700 !important;
  color:var(--app-black) !important;
  text-decoration:underline !important;
  text-underline-offset:3px !important;
  white-space:nowrap !important;
}
@media(max-width:480px){
  .auth-name-row{
    grid-template-columns:1fr;
    gap:10px;
  }
}

/* First-Time Onboarding Experience Card */
.onboarding-welcome-card{
  background:var(--app-white);
  border:2px solid var(--app-lime);
  border-radius:20px;
  padding:32px 36px;
  margin-bottom:36px;
  box-shadow:0 12px 36px rgba(17,21,17,.08);
  position:relative;
}
.onboarding-header{margin-bottom:24px}
.onboarding-badge{
  display:inline-block;
  background:var(--app-black);
  color:var(--app-lime);
  font-size:.7rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:3px 10px;
  border-radius:999px;
  margin-bottom:12px;
}
.onboarding-header h2{
  font-family:"Barlow Condensed","Arial Narrow",sans-serif;
  font-size:clamp(2rem,3.5vw,2.8rem);
  text-transform:uppercase;
  letter-spacing:-.015em;
  margin:0 0 6px;
  color:var(--app-black);
}
.onboarding-header p{margin:0;color:#5a685b;font-size:.95rem}

.onboarding-explainer-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  background:#f6f8f4;
  border:1px solid #dce2d9;
  border-radius:14px;
  padding:18px 20px;
  margin-bottom:28px;
}
.onboarding-explainer-item{display:flex;align-items:flex-start;gap:12px}
.explainer-icon{font-size:1.4rem;line-height:1;margin-top:2px}
.onboarding-explainer-item strong{display:block;font-size:.85rem;color:var(--app-black);margin-bottom:3px}
.onboarding-explainer-item p{margin:0;font-size:.78rem;line-height:1.4;color:#617063}

.onboarding-form{display:flex;flex-direction:column;gap:20px}
.onboarding-fields-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.onboarding-field{display:grid;gap:6px}
.onboarding-field.full-width{grid-column:1 / -1}
.onboarding-field label{font-size:.75rem;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:#455447}
.onboarding-field input[type="text"],.onboarding-field textarea{
  width:100%;
  box-sizing:border-box;
  background:#f9faf7;
  border:1px solid #cbd5c8;
  border-radius:10px;
  padding:12px 14px;
  font-size:.9rem;
  color:var(--app-black);
  font-family:inherit;
  transition:border-color .15s;
}
.onboarding-field input[type="text"]:focus,.onboarding-field textarea:focus{
  outline:none;
  border-color:var(--app-black);
  background:#fff;
}
.onboard-file-input{font-size:.84rem;color:#59675a;padding:4px 0}

.onboarding-prefs{background:#fafbf9;border:1px solid #e1e7de;border-radius:12px;padding:16px 20px}
.onboarding-prefs h3{font-size:.84rem;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:#354437;margin:0 0 12px}
.pref-checkbox{display:flex;align-items:center;gap:10px;font-size:.84rem;color:#475649;margin-bottom:8px;cursor:pointer}
.pref-checkbox:last-child{margin-bottom:0}
.pref-checkbox input{width:16px;height:16px;accent-color:var(--app-black);cursor:pointer}

.onboarding-actions{display:flex;align-items:center;gap:16px;margin-top:8px}
.onboarding-submit-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:14px 30px;
  font-size:.92rem;
  font-weight:850;
  border:none;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(17,21,17,.12);
  transition:transform .15s,box-shadow .15s;
}
.onboarding-submit-btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(17,21,17,.18)}
.onboarding-skip-link{font-size:.82rem;font-weight:800;color:#677769;text-decoration:underline;text-underline-offset:3px}
.onboarding-skip-link:hover{color:var(--app-black)}

@media(max-width:800px){
  .onboarding-welcome-card{padding:22px 18px}
  .onboarding-explainer-grid{grid-template-columns:1fr;gap:14px}
  .onboarding-fields-grid{grid-template-columns:1fr}
  .onboarding-actions{flex-direction:column;align-items:stretch;text-align:center}
  .onboarding-submit-btn{justify-content:center}
}

/* Premium Auth Error Cards */
.login-error-card {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 15px 18px;
  margin: 0 0 24px;
  background: #fff8f5;
  border: 1px solid #f6d4c8;
  border-left: 4px solid #e05d38;
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(224, 93, 56, 0.08);
  animation: loginErrorSlide .22s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes loginErrorSlide {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}
.login-error-icon {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(224, 93, 56, 0.12);
  color: #c94420;
  margin-top: 1px;
}
.login-error-content {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 0.88rem;
  line-height: 1.45;
  color: #44221a;
}
.login-error-content strong {
  font-weight: 800;
  color: #9c2d13;
  letter-spacing: -0.01em;
}
.login-error-content span {
  color: #5c352c;
}
.login-error-content a {
  color: #9c2d13;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .15s;
}
.login-error-content a:hover {
  color: #441407;
}

/* Fallback override for any plain .login-error */
.login-error {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 14px 18px !important;
  margin: 0 0 24px !important;
  background: #fff8f5 !important;
  border: 1px solid #f6d4c8 !important;
  border-left: 4px solid #e05d38 !important;
  border-radius: 14px !important;
  color: #8c2a12 !important;
  font-size: 0.88rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  box-shadow: 0 4px 18px rgba(224, 93, 56, 0.08) !important;
}

/* Scoring Rules Bar in Add Game */
.game-scoring-rules-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin: 18px 0 10px;
  padding: 14px 18px;
  background: #f3f6f1;
  border: 1px solid #dbe2d6;
  border-radius: 12px;
}
.rule-setting {
  display: flex;
  align-items: center;
  gap: 10px;
}
.rule-label {
  font-size: .74rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #384c3c;
}
.rule-chips {
  display: inline-flex;
  background: #e3e8de;
  padding: 3px;
  border-radius: 999px;
  gap: 3px;
}
.rule-chip-btn {
  position: relative;
  display: inline-flex;
  cursor: pointer;
  margin: 0 !important;
}
.rule-chip-btn input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.rule-chip-btn span {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
  color: #556758;
  transition: all .15s ease;
  user-select: none;
}
.rule-chip-btn input:checked + span {
  background: var(--app-black);
  color: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}

/* Neutralize WordPress Twemoji from expanding */
img.emoji {
  display: inline-block !important;
  border: none !important;
  height: 1.1em !important;
  width: 1.1em !important;
  margin: 0 0.2em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Score Live Feedback */
.score-live-feedback {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  margin: 14px 0 6px;
  border-radius: 12px;
  font-size: .86rem;
  font-weight: 700;
  line-height: 1.4;
  animation: feedbackFadeIn .2s ease-out;
}
@keyframes feedbackFadeIn {
  from { opacity: 0; transform: translateY(-3px); }
  to { opacity: 1; transform: translateY(0); }
}
.score-live-feedback.is-error {
  display: flex;
  background: #fff4f0;
  border: 1px solid #f6cfc3;
  color: #9c2d13;
}
.score-live-feedback.is-valid {
  display: flex;
  background: #eef8d8;
  border: 1px solid #cfe39e;
  color: #27521e;
}
.score-feedback-icon {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(224, 60, 30, 0.12);
  color: #c93514;
}
.score-feedback-icon svg {
  width: 15px !important;
  height: 15px !important;
  max-width: 15px !important;
  max-height: 15px !important;
  display: block;
}
.score-feedback-text {
  flex: 1;
  font-size: .86rem;
  line-height: 1.35;
  color: #9c2d13;
}

/* Add-game mobile completion flow */
@media(max-width:700px){
  .game-scoring-rules-bar{display:grid;gap:14px;margin-top:14px;padding:14px}
  .rule-setting{display:grid;gap:7px;min-width:0}
  .rule-chips{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  .rule-chips::-webkit-scrollbar{display:none}
  .rule-chip-btn span{white-space:nowrap}
}
@media(max-width:800px){
  body.logged-in:has(.add-game-form) main{padding-bottom:156px}
  .game-form-submit{position:fixed;z-index:55;right:0;bottom:calc(64px + env(safe-area-inset-bottom));left:0;justify-content:space-between!important;margin:0;padding:12px max(20px,env(safe-area-inset-left))!important;background:rgba(248,246,239,.96);border-top:1px solid var(--app-line);box-shadow:0 -8px 24px rgba(10,20,10,.08);backdrop-filter:blur(10px)}
  .game-form-submit .button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:12px 22px}
}

/* Three-step add-game wizard */
body.logged-in:has(.add-game-wizard) .site-header,body.logged-in:has(.add-game-wizard) .app-bottom-nav,body.logged-in:has(.add-game-wizard) .site-footer{display:none}
.add-game-wizard-header{display:grid;grid-template-columns:100px 1fr 120px;align-items:center;max-width:680px;margin:28px auto 38px;text-align:center}
.add-game-wizard-header .eyebrow{margin:0 0 2px;font-size:.62rem;color:#738271}
.add-game-wizard-header strong{display:block;font-size:1.25rem;letter-spacing:-.04em}
.add-game-wizard-close,.add-game-wizard-next{justify-self:start;min-height:44px;border:0;border-radius:999px;font:inherit;font-weight:850;font-size:.86rem;cursor:pointer;white-space:nowrap}
.add-game-wizard-close{display:inline-flex;align-items:center;color:#55705c;text-decoration:none}.add-game-wizard-close:hover{color:var(--app-black);text-decoration:underline;text-underline-offset:3px}
.add-game-wizard-next{justify-self:end;padding:0 18px;background:var(--app-lime);color:var(--app-black);box-shadow:0 5px 14px rgba(116,145,19,.2)}.add-game-wizard-next:hover{background:#e8ff8a;transform:translateY(-1px)}.add-game-wizard-next span{margin-left:5px}
.add-game-progress{display:flex;justify-content:center;gap:6px;margin-top:8px}.add-game-progress span{width:7px;height:7px;border-radius:50%;background:#d5ddd1}.add-game-progress .is-active{background:var(--app-lime);box-shadow:0 0 0 1px #789419}
.add-game-wizard{max-width:680px!important;margin-bottom:54px!important}.add-game-wizard .game-form-submit{display:none!important}
.add-game-wizard.is-ready .game-wizard-step{display:none}.add-game-wizard.is-ready .game-wizard-step.is-active{display:grid;animation:wizardStepIn .2s ease-out}
.add-game-wizard .game-form-panel{box-shadow:0 16px 38px rgba(24,42,27,.06)}
.add-game-wizard .game-form-panel h2{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:clamp(2.8rem,7vw,4.2rem);line-height:.92;text-transform:uppercase;letter-spacing:-.015em;margin:0 0 12px}.add-game-wizard .game-form-panel h2 span{font-family:"DM Sans",sans-serif;font-size:.42em;font-weight:800;letter-spacing:0;text-transform:none;color:#718170;white-space:nowrap}
.add-game-wizard .game-form-panel h2+p{font-size:.95rem;max-width:520px;margin-bottom:28px}
.add-game-wizard .game-team-grid{gap:14px}.add-game-wizard .game-team-fields{padding:22px}.add-game-wizard .game-player-slot:last-child{margin-bottom:4px}
.add-game-wizard .game-scoreboard{margin-top:0;padding:0;border:0;background:transparent}.add-game-wizard .game-scoreboard-title{margin:0 0 8px;text-align:center;color:#6b7c6d}.add-game-wizard .game-scoreboard input{min-height:78px!important;font-size:2.8rem!important}.add-game-wizard .game-score-divider{padding-bottom:23px;font-size:1.8rem}
@keyframes wizardStepIn{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:700px){
  body.logged-in:has(.add-game-wizard){overflow-x:hidden}body.logged-in:has(.add-game-wizard) main{padding:0 18px 38px;overflow:hidden}.add-game-wizard-header{grid-template-columns:74px minmax(0,1fr) 94px;margin:19px 0 26px}.add-game-wizard-header strong{font-size:1.08rem}.add-game-wizard-close,.add-game-wizard-next{min-height:42px;font-size:.78rem}.add-game-wizard-next{padding:0 14px}
  body.logged-in:has(.add-game-wizard) .app-bottom-nav{display:none}.add-game-wizard .game-form-panel{padding:22px 18px;border:0;background:transparent;box-shadow:none}.add-game-wizard .game-form-panel>.game-form-step{display:none}
  .add-game-wizard,.add-game-wizard .game-wizard-step,.add-game-wizard .game-form-panel>div{min-width:0;max-width:100%}.add-game-wizard .game-form-panel h2{font-family:"DM Sans",sans-serif;font-size:2rem;line-height:1.1;letter-spacing:-.05em;text-transform:none}.add-game-wizard .game-form-panel h2 span{font-size:.62em}.add-game-wizard .game-form-panel h2+p{font-size:.9rem;line-height:1.45;margin-bottom:23px}.add-game-wizard .game-team-fields{padding:16px;background:#fff;border-radius:15px;box-shadow:0 8px 25px rgba(24,42,27,.06)}
  .add-game-wizard .game-scoreboard{grid-template-columns:1fr auto 1fr;gap:10px;padding:0;background:transparent}.add-game-wizard .game-scoreboard input{min-height:96px!important;padding:8px!important;border:2px solid #c7d3c4!important;border-radius:18px!important;background:#fff!important;font-size:3.1rem!important}.add-game-wizard .game-score-divider{padding-bottom:31px;font-size:1.15rem}
  .add-game-wizard .game-form-grid{gap:14px}.add-game-wizard .rcrd-rich-editor{margin-top:10px;border:0;background:transparent;overflow:visible}.add-game-wizard .rcrd-editor-chips,.add-game-wizard .rcrd-editor-toolbar,.add-game-wizard .rcrd-editor-footer{display:none}.add-game-wizard .rcrd-rich-editor textarea{min-height:130px!important;padding:14px!important;border:1px solid #c7d3c4!important;border-radius:14px!important;background:#fff!important;font-size:16px!important}

  /* Prevent iOS Safari from auto-zooming and bouncing when focusing fields */
  .add-game-wizard input:not([type="number"]),
  .add-game-wizard select,
  .add-game-wizard textarea,
  .add-game-form input:not([type="number"]),
  .add-game-form select,
  .add-game-form textarea,
  .game-player-slot input,
  .game-form-grid input {
    font-size: 16px !important;
  }
}

/* Traditional Edit Game View */
.edit-game-wrapper {
  max-width: 780px;
  margin: 32px auto 80px;
  padding: 0 20px;
}
.edit-game-top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}
.edit-game-back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .84rem;
  font-weight: 850;
  color: #435b49;
  text-decoration: none;
}
.edit-game-back-link:hover {
  color: var(--app-black);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.edit-game-heading {
  margin-bottom: 28px;
}
.edit-game-heading .eyebrow {
  font-size: .75rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #6b7e6e;
  margin: 0 0 6px;
}
.edit-game-heading h1 {
  font-family: "Barlow Condensed","Arial Narrow",sans-serif;
  font-size: clamp(2.4rem, 5vw, 3.4rem);
  line-height: 1;
  letter-spacing: -.02em;
  text-transform: uppercase;
  margin: 0 0 8px;
}
.edit-game-heading h1 span {
  color: var(--app-lime);
}
.edit-game-heading p {
  color: #5a6e5e;
  font-size: .92rem;
  line-height: 1.45;
  margin: 0;
  max-width: 580px;
}
.edit-game-card {
  background: #fff;
  border: 1px solid var(--app-line);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 20px;
  box-shadow: 0 8px 24px rgba(24,42,27,.04);
}
.edit-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid #edf1eb;
}
.edit-card-tag {
  font-size: .68rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #637765;
  display: block;
  margin-bottom: 3px;
}
.edit-card-title-group h2 {
  font-size: 1.25rem;
  font-weight: 850;
  letter-spacing: -.03em;
  margin: 0;
}
.edit-card-title-group h2 .edit-opt {
  font-size: .8rem;
  font-weight: 600;
  color: #7b8e7e;
  letter-spacing: 0;
}
.edit-scoreboard-body {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  gap: 16px;
  align-items: start;
}
.edit-team-pane {
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: #fbfdf9;
  border: 1px solid #dbe4d8;
  border-radius: 14px;
  padding: 18px;
}
.edit-team-pane-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.edit-team-pill {
  display: inline-block;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--app-black);
  color: var(--app-lime);
}
.edit-players-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.edit-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.edit-field label {
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .03em;
  color: #354a39;
  text-transform: uppercase;
}
.edit-field label .edit-req {
  color: #c93b1d;
  font-weight: 900;
}
.edit-field label .edit-opt {
  text-transform: none;
  font-size: .72rem;
  color: #7a8e7e;
  font-weight: 600;
}
.edit-field input, .edit-field select, .edit-field textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #c7d3c4;
  border-radius: 10px;
  background: #fff;
  color: var(--app-black);
  font: inherit;
  font-size: .92rem;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.edit-field input:focus, .edit-field select:focus, .edit-field textarea:focus {
  border-color: #638d4f;
  box-shadow: 0 0 0 3px rgba(179,225,107,.28);
}
/* Multi-game Scoreboard Rows */
.edit-games-container {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px dashed #dbe4d8;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.edit-games-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2px;
}
.edit-games-title {
  font-size: .75rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #354a39;
}
.edit-games-subtitle {
  font-size: .72rem;
  color: #6d8070;
  font-weight: 600;
}
.edit-game-score-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #fbfcf9;
  border: 1px solid #dce4d9;
  border-radius: 14px;
  padding: 14px 16px;
  transition: all .15s ease;
}
.edit-game-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.edit-game-row-badge {
  font-size: .75rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #314a38;
  background: #eaf0e6;
  padding: 3px 8px;
  border-radius: 6px;
}
.edit-remove-game-btn {
  background: transparent;
  border: none;
  color: #9c3526;
  font-size: .78rem;
  font-weight: 800;
  cursor: pointer;
  padding: 3px 8px;
  border-radius: 6px;
  line-height: 1;
  transition: all .15s ease;
}
.edit-remove-game-btn:hover {
  background: #fff0ec;
  color: #7a1f12;
}
.edit-game-inputs-wrap {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
}
.edit-game-input-col {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.edit-game-input-col label {
  font-size: .75rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #445947;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.edit-game-input-col input {
  width: 100%;
  min-height: 68px !important;
  font-size: 2.6rem !important;
  font-weight: 900 !important;
  text-align: center;
  font-variant-numeric: tabular-nums;
  border: 2px solid #8da488 !important;
  background: #fff !important;
  border-radius: 14px !important;
  padding: 4px !important;
}
.edit-game-input-col input:focus {
  border-color: #27402f !important;
  box-shadow: 0 0 0 3px rgba(179,225,107,.35) !important;
}
.edit-game-score-dash {
  font-size: 1.6rem;
  font-weight: 700;
  color: #8da488;
  align-self: center;
  padding-top: 16px;
}

/* Wizard step bottom action buttons */
.wizard-step-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid #e1e7de;
}
.wizard-step-bottom-next,
.wizard-step-bottom-submit {
  min-height: 48px;
  padding: 0 24px;
  border-radius: 999px;
  font-size: .92rem;
  font-weight: 850;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 4px 14px rgba(116,145,19,.25);
  cursor: pointer;
  border: 0;
  background: var(--app-lime);
  color: var(--app-black);
  text-decoration: none;
}
.wizard-step-bottom-next:hover,
.wizard-step-bottom-submit:hover {
  background: #e8ff8a;
  transform: translateY(-1px);
}
.wizard-step-bottom-back {
  min-height: 44px;
  padding: 0 16px;
  background: transparent;
  border: 0;
  color: #55705c;
  font: inherit;
  font-weight: 750;
  font-size: .88rem;
  cursor: pointer;
}
.wizard-step-bottom-back:hover {
  color: var(--app-black);
  text-decoration: underline;
}

/* Feed View All link pill */
.feed-view-all {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .78rem;
  font-weight: 800;
  color: #34523b;
  text-decoration: none;
  white-space: nowrap;
  padding: 6px 12px;
  background: #eaf0e6;
  border-radius: 999px;
  transition: all .15s ease;
  line-height: 1;
}
.feed-view-all:hover {
  background: #dce7d6;
  color: #1a3621;
  transform: translateY(-1px);
}
.feed-view-all svg {
  flex-shrink: 0;
}
.edit-add-game-bar {
  text-align: center;
  margin-top: 4px;
}
.edit-add-game-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1px dashed #7a9c72;
  background: #f4f8ef;
  border-radius: 999px;
  color: #274c2d;
  font-family: inherit;
  font-size: .8rem;
  font-weight: 850;
  cursor: pointer;
  transition: all .15s ease;
}
.edit-add-game-btn:hover {
  background: #eaf3e2;
  border-color: #55794d;
  color: #1a381f;
}
.edit-versus-badge {
  align-self: center;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #e6ede3;
  color: #586e5b;
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .06em;
  margin-top: 24px;
}
.edit-details-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.edit-notes-card textarea {
  min-height: 90px;
  resize: vertical;
}
.edit-game-actions-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0 20px;
  gap: 14px;
  flex-wrap: wrap;
}
.edit-delete-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 18px;
  border: 1px solid #f3cfc6;
  background: #fff7f5;
  border-radius: 10px;
  color: #af3217;
  font-family: inherit;
  font-size: .86rem;
  font-weight: 800;
  cursor: pointer;
  transition: all .15s ease;
}
.edit-delete-link-btn:hover {
  background: #ffece7;
  border-color: #e5a799;
  color: #881b05;
}
.edit-primary-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.edit-cancel-btn {
  font-size: .88rem;
  font-weight: 800;
  color: #556e59;
  text-decoration: none;
  padding: 8px 12px;
}
.edit-cancel-btn:hover {
  color: var(--app-black);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.edit-save-submit {
  border: 0;
  cursor: pointer;
  padding: 12px 24px;
  font-weight: 900;
  font-size: .95rem;
  min-height: 46px;
  border-radius: 9px;
}
@media(max-width: 680px) {
  .edit-scoreboard-body {
    grid-template-columns: 1fr;
  }
  .edit-versus-badge {
    margin: 4px auto;
  }
  .edit-details-grid {
    grid-template-columns: 1fr;
  }
  .edit-game-actions-bar {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .edit-primary-actions {
    justify-content: space-between;
  }
  .edit-delete-link-btn {
    justify-content: center;
  }
}
.edit-row-spacer {
  width: 32px;
  height: 32px;
  display: inline-block;
}
.wizard-games-container {
  margin-top: 14px;
  padding-top: 0;
  border-top: none;
}
@media(max-width: 480px) {
  .edit-game-score-row {
    grid-template-columns: 56px minmax(0, 1fr) auto minmax(0, 1fr) 28px;
    gap: 8px;
    padding: 10px 12px;
  }
  .edit-game-row-badge {
    font-size: .7rem;
  }
  .edit-game-input-col input {
    min-height: 52px !important;
    font-size: 1.8rem !important;
  }
}