/* Clean UI polish pass */
:root{
  --ui-shadow-soft:0 18px 50px rgba(31,24,18,.11);
  --ui-shadow-hover:0 24px 70px rgba(31,24,18,.16);
  --ui-panel-border:rgba(255,255,255,.42);
}
body.dark{
  --ui-shadow-soft:0 18px 54px rgba(0,0,0,.32);
  --ui-shadow-hover:0 26px 78px rgba(0,0,0,.42);
  --ui-panel-border:rgba(255,255,255,.1);
}
.top-bar,
.chat-top-bar{
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  border-bottom:1px solid rgba(255,255,255,.16)!important;
}
.logo,
.logo-sm{
  letter-spacing:-.06em!important;
}
.hero-title{
  line-height:.92!important;
  letter-spacing:-.075em!important;
}
.hero-sub{
  line-height:1.55!important;
}
.primary-btn,
.secondary-btn,
.icon-btn,
.action-btn{
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, opacity .18s ease!important;
}
.primary-btn:hover,
.secondary-btn:hover,
.icon-btn:hover,
.action-btn:hover{
  transform:translateY(-2px)!important;
}
.step-card,
.safety-section,
.phase4-panel,
.main-menu-scoreboard,
.centered-modal,
.video-panel,
.opponent-card{
  box-shadow:var(--ui-shadow-soft)!important;
  border-color:var(--ui-panel-border)!important;
}
.step-card:hover,
.phase4-panel:hover,
.main-menu-scoreboard:hover{
  box-shadow:var(--ui-shadow-hover)!important;
}
.phase4-panel,
.main-menu-scoreboard,
.step-card,
.safety-section{
  border-radius:24px!important;
}
#screen-landing .how-it-works{
  padding-top:2rem!important;
}
.how-it-works h2{
  font-size:clamp(1.6rem,3vw,2.2rem)!important;
  letter-spacing:-.045em!important;
}
.steps-grid{
  gap:1rem!important;
}
.step-card{
  padding:1.25rem!important;
}
.step-card h3{
  letter-spacing:-.03em!important;
}
.main-menu-scoreboard{
  min-height:430px!important;
  display:flex!important;
  flex-direction:column!important;
}
.mm-score-list{
  flex:1!important;
}
.mm-score-row{
  min-height:62px!important;
}
.mm-score-head h3,
.phase4-panel-title h3{
  letter-spacing:.08em!important;
}
#phase4-shell{
  margin-top:1rem!important;
}
#phase4-shell .phase4-panel:nth-child(3){
  grid-column:1 / span 2!important;
}
#phase4-shell .phase4-panel:nth-child(4){
  grid-column:1 / span 2!important;
}
.phase4-cta-grid{
  grid-template-columns:1.4fr .8fr!important;
}
.phase4-cta{
  min-height:132px!important;
}
.phase4-cta h3{
  letter-spacing:-.055em!important;
}
.profile-compact{
  box-shadow:0 14px 36px rgba(31,24,18,.1)!important;
}
body.dark .profile-compact{
  box-shadow:0 14px 38px rgba(0,0,0,.3)!important;
}
.lb-list,
.leaderboard-container{
  max-width:860px!important;
}
.msg{
  border-radius:16px!important;
}
.chat-input-bar{
  border-top:1px solid rgba(255,255,255,.12)!important;
}
.video-panel{
  overflow:hidden!important;
}
.video-label{
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
  font-weight:850!important;
}
@media(max-width:900px){
  #phase4-shell .phase4-panel:nth-child(3),
  #phase4-shell .phase4-panel:nth-child(4){
    grid-column:auto!important;
  }
  .phase4-cta-grid{
    grid-template-columns:1fr!important;
  }
  .main-menu-scoreboard{
    min-height:auto!important;
  }
}
@media(max-width:520px){
  .top-bar{
    border-radius:0 0 18px 18px!important;
  }
  .hero-title{
    letter-spacing:-.065em!important;
  }
  .phase4-panel,
  .main-menu-scoreboard,
  .step-card,
  .safety-section{
    border-radius:20px!important;
  }
  .step-card{
    padding:1rem!important;
  }
  .mm-score-row{
    min-height:58px!important;
  }
}