.wao-games-main { padding-bottom:5rem; }
.wao-visually-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; white-space:nowrap!important; border:0!important; }
.games-content { display:grid; gap:var(--space-6); }

.loading-row,.empty-state,.auth-wall { display:flex; min-height:15rem; align-items:center; justify-content:center; gap:var(--space-3); padding:var(--space-8); border:1px solid var(--wao-border); border-radius:var(--wao-radius); color:var(--wao-muted); background:linear-gradient(145deg,rgba(25,23,34,.96),rgba(15,14,21,.96)); text-align:center; }
.empty-state,.auth-wall { flex-direction:column; }
.spinner { width:20px; height:20px; flex:0 0 auto; border:3px solid rgba(124,111,255,.2); border-top-color:var(--wao-purple); border-radius:50%; animation:games-spin .8s linear infinite; }
.empty-icon,.auth-wall-icon { font-size:2.5rem; }
.empty-title,.auth-wall-title { color:var(--wao-text); font-size:1.1rem; font-weight:750; }
.empty-sub,.auth-wall-sub { color:var(--wao-muted); font-size:.88rem; }
.auth-wall-action { margin-top:0; }

.group-section { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-4); }
.group-section-spaced { margin-top:var(--space-6); }
.group-label { grid-column:1/-1; padding-bottom:var(--space-1); border-bottom:1px solid var(--wao-border); color:var(--wao-muted); font-size:.72rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.group-label.action { color:var(--wao-gold); border-color:rgba(124,111,255,.18); }

.game-card { display:grid; grid-template-rows:auto 1fr auto; gap:var(--space-3); min-height:15rem; padding:1.1rem 1.25rem; border:1px solid var(--wao-border); border-radius:var(--wao-radius); background:linear-gradient(145deg,rgba(25,23,34,.96),rgba(15,14,21,.96)); box-shadow:var(--wao-shadow); transition:border-color var(--motion-standard) var(--ease-standard); }
.game-card.needs-action { border-color:rgba(124,111,255,.48); background:linear-gradient(145deg,rgba(37,31,60,.92),rgba(18,16,27,.96)); }
.game-card.needs-action:hover { border-color:rgba(124,111,255,.7); }
.game-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-3); }
.game-prompt { flex:1; color:var(--wao-text); font-size:.95rem; font-weight:650; line-height:1.4; }
.state-badge { flex:0 0 auto; padding:.25rem .6rem; border:1px solid var(--wao-border); border-radius:6px; font-size:.68rem; font-weight:750; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }
.state-badge.need-player { color:#ffbf5a; border-color:rgba(255,191,90,.25); background:rgba(255,191,90,.1); }
.state-badge.contest-ready { color:var(--wao-purple-bright); border-color:rgba(124,111,255,.3); background:rgba(124,111,255,.15); }
.state-badge.voting-open { color:var(--color-state-success); border-color:rgba(97,214,167,.25); background:rgba(97,214,167,.1); }
.state-badge.results-ready { color:var(--wao-gold); border-color:rgba(244,201,93,.24); background:rgba(244,201,93,.1); }
.game-card-meta { display:flex; align-items:center; gap:var(--space-4); color:var(--color-text-subtle); font-size:.8rem; }
.meta-dot { width:3px; height:3px; border-radius:50%; background:var(--color-text-subtle); }
.game-card-actions { display:flex; gap:.6rem; }

.btn-cta,.btn-new-challenge { display:inline-flex; min-height:44px; align-items:center; justify-content:center; border:0; border-radius:var(--radius-control); color:#fff; background:linear-gradient(135deg,#8a7cff,#5b4de8); box-shadow:0 10px 30px rgba(91,77,232,.22); font:inherit; font-weight:750; text-align:center; text-decoration:none; cursor:pointer; transition:transform var(--motion-fast) var(--ease-standard),filter var(--motion-fast) var(--ease-standard); }
.btn-cta { flex:1; padding:.75rem 1rem; font-size:.9rem; }
.btn-new-challenge { padding:.65rem 1.1rem; font-size:.88rem; white-space:nowrap; }
.btn-cta:hover,.btn-new-challenge:hover { filter:brightness(1.08); transform:translateY(-1px); }
.btn-cta.secondary { flex:0 0 auto; padding:.75rem .9rem; border:1px solid var(--color-border-strong); color:var(--wao-text); background:rgba(255,255,255,.045); box-shadow:none; }
.btn-cta.gold { color:#19120a; background:linear-gradient(135deg,var(--wao-gold),#e8a800); }

.new-challenge-strip { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); margin-top:var(--space-6); padding:1.25rem; border:1px dashed rgba(124,111,255,.25); border-radius:var(--wao-radius); background:rgba(124,111,255,.06); }
.new-challenge-text { color:var(--wao-muted); font-size:.9rem; }
.error-msg { padding:var(--space-4); border:1px solid rgba(255,170,166,.3); border-radius:var(--wao-radius); color:var(--color-state-error); background:rgba(255,170,166,.07); text-align:center; }

@keyframes games-spin { to { transform:rotate(360deg); } }
@media (max-width:760px) {
  .group-section { grid-template-columns:1fr; }
  .game-card { min-height:0; }
  .new-challenge-strip { align-items:flex-start; flex-direction:column; }
}
@media (min-width:761px) and (max-height:699px) {
  .wao-games-main { padding-top:1.5rem; }
  .wao-games-main .wao-page-masthead { margin-bottom:1.5rem; }
}
