/* TypeFlow v6.6.22 — Daily Challenge / Ranked Duel separation */

/* ========================= DAILY CHALLENGE ========================= */
.challenge-head--daily-only{
  align-items:flex-start !important;
}
.challenge-head--daily-only>div:first-child{
  max-width:760px;
}
.challenge-daily-board{
  margin-top:18px;
  width:100%;
  padding:0 !important;
  overflow:hidden;
}
.challenge-daily-board-head{
  padding:20px 22px 17px;
  border-bottom:1px solid var(--line);
}
.challenge-daily-board-head p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:11px;
}
.challenge-daily-board-meta{
  display:grid;
  justify-items:end;
  gap:4px;
  color:var(--muted);
  font-size:10px;
}
.challenge-daily-board-meta>span{
  color:var(--text);
  font-weight:800;
}
.challenge-daily-board-meta>b{
  color:var(--primary);
  font-size:9px;
}
.challenge-daily-ranking{
  padding:0 20px 12px;
}
.challenge-daily-ranking-head,
.challenge-daily-ranking-row{
  display:grid;
  grid-template-columns:58px minmax(240px,1.8fr) minmax(190px,1fr) 120px 110px;
  align-items:center;
  gap:12px;
}
.challenge-daily-ranking-head{
  min-height:42px;
  color:var(--muted);
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.challenge-daily-ranking-row{
  min-height:55px;
  border-top:1px solid var(--line);
}
.challenge-daily-ranking-row.is-top-three{
  background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 3%,transparent),transparent 58%);
}
.daily-rank{
  width:29px;height:29px;
  display:grid;place-items:center;
  margin-left:3px;
  border-radius:9px;
  color:var(--muted);
  font-size:10px;
  font-variant-numeric:tabular-nums;
}
.daily-rank-1{
  color:#9c6900;
  background:color-mix(in srgb,#ffd86b 21%,var(--surface));
  border:1px solid color-mix(in srgb,#e3ad26 48%,var(--line));
}
.daily-rank-2{
  color:#697386;
  background:color-mix(in srgb,#dce3ed 20%,var(--surface));
  border:1px solid color-mix(in srgb,#aeb8c8 42%,var(--line));
}
.daily-rank-3{
  color:#986047;
  background:color-mix(in srgb,#d99b78 16%,var(--surface));
  border:1px solid color-mix(in srgb,#c88762 40%,var(--line));
}
.daily-player{
  display:flex;align-items:center;gap:9px;min-width:0;
}
.daily-player>div{
  display:flex;align-items:center;gap:6px;min-width:0;
}
.daily-player strong{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:11.5px;
}
.daily-country{
  color:var(--muted);
  font-size:10px;
}
.daily-wpm{
  color:var(--primary);
  font-size:13px;
  font-variant-numeric:tabular-nums;
}
.daily-wpm small{font-size:7px;color:var(--muted)}
.daily-accuracy{
  width:max-content;
  padding:4px 7px;
  border-radius:7px;
  background:var(--surface-2);
  border:1px solid var(--line);
  font-size:9px;
  font-weight:800;
  font-variant-numeric:tabular-nums;
}
.challenge-daily-empty{
  min-height:150px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  text-align:center;
  color:var(--muted);
}
.challenge-daily-empty>span{
  width:38px;height:38px;border-radius:12px;
  display:grid;place-items:center;
  background:var(--primary-soft);
  color:var(--primary);
}
.challenge-daily-empty strong{color:var(--text);font-size:13px}
.challenge-daily-empty small{font-size:9px}

/* ========================= DUEL SEASON HEADER ========================= */
.duel-season-card{
  min-width:255px;
  padding:14px 15px;
  border:1px solid var(--line);
  border-radius:15px;
  background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--primary) 5%,var(--surface-2)));
  box-shadow:0 10px 28px rgba(20,24,54,.06);
}
.duel-season-card-top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.duel-season-card-top>span{
  color:var(--primary);
  font-size:9px;font-weight:900;letter-spacing:.055em;text-transform:uppercase;
}
.duel-season-card-top>b{
  color:var(--muted);
  font-size:8px;
}
.duel-season-card>strong{
  display:block;
  margin-top:7px;
  color:var(--text);
  font-size:18px;
  font-variant-numeric:tabular-nums;
}
.duel-season-card>small{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:8.5px;
}
.duel-season-mini-status{
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:8px;
  margin-top:11px;
  padding-top:10px;
  border-top:1px solid var(--line);
}
.duel-season-mini-status span{font-size:9px;color:var(--muted)}
.duel-season-mini-status b{font-size:11px;color:var(--text)}
.duel-season-mini-status em{
  font-style:normal;
  color:var(--primary);
  font-size:8px;
  font-weight:800;
}

/* ========================= RANKED SEASON HUB ========================= */
.ranked-season-hub{
  margin-top:18px;
  padding:0 !important;
  overflow:hidden;
}
.ranked-season-hub-head{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:20px 22px 18px;
  border-bottom:1px solid var(--line);
}
.ranked-season-hub-head h2{margin:0;font-size:19px}
.ranked-season-hub-head p{margin:5px 0 0;color:var(--muted);font-size:10.5px}
.ranked-season-deadline{
  min-width:145px;
  display:grid;
  justify-items:end;
  gap:2px;
}
.ranked-season-deadline small{font-size:8px;color:var(--muted)}
.ranked-season-deadline strong{font-size:13px;font-variant-numeric:tabular-nums}
.ranked-season-deadline span{font-size:8.5px;color:var(--primary);font-weight:800}
.ranked-season-layout{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(245px,.65fr);
  min-height:280px;
}
.ranked-season-table{
  padding:8px 20px 14px;
  border-right:1px solid var(--line);
}
.ranked-season-table-head,
.ranked-season-row{
  display:grid;
  grid-template-columns:48px minmax(220px,1.6fr) 72px 90px 105px;
  align-items:center;
  gap:10px;
}
.ranked-season-table-head{
  min-height:37px;
  color:var(--muted);
  font-size:8px;
  font-weight:850;
  text-transform:uppercase;
}
.ranked-season-row{
  min-height:49px;
  border-top:1px solid var(--line);
  font-size:10px;
}
.ranked-hub-rank{
  width:27px;height:27px;
  display:grid;place-items:center;
  border-radius:8px;
  color:var(--muted);
  font-size:9px;
}
.ranked-hub-rank.rank-1{
  color:#9c6900;
  background:color-mix(in srgb,#ffd86b 20%,var(--surface));
  border:1px solid color-mix(in srgb,#e3ad26 44%,var(--line));
}
.ranked-hub-rank.rank-2{
  color:#697386;
  background:color-mix(in srgb,#dce3ed 18%,var(--surface));
}
.ranked-hub-rank.rank-3{
  color:#986047;
  background:color-mix(in srgb,#d99b78 15%,var(--surface));
}
.ranked-hub-player{
  display:flex;align-items:center;gap:9px;min-width:0;
}
.ranked-hub-player>div{display:grid;gap:2px;min-width:0}
.ranked-hub-player strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px}
.ranked-hub-player small{font-size:8px;color:var(--muted)}
.ranked-hub-rating{font-size:11px;color:var(--primary);font-variant-numeric:tabular-nums}
.ranked-tier-chip{
  width:max-content;
  min-width:54px;
  padding:4px 7px;
  text-align:center;
  border-radius:7px;
  background:var(--primary-soft);
  color:var(--primary);
  font-size:8px;
  font-weight:800;
}
.ranked-season-empty{
  min-height:190px;
  display:grid;place-items:center;align-content:center;gap:6px;text-align:center;
  color:var(--muted);
}
.ranked-season-empty>span{font-size:28px;color:var(--primary)}
.ranked-season-empty strong{color:var(--text);font-size:12px}
.ranked-season-empty small{font-size:9px}
.ranked-your-season{
  padding:22px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 3%,var(--surface)),var(--surface));
}
.ranked-your-tier{
  display:flex;align-items:center;gap:11px;
  margin-top:13px;
}
.ranked-your-tier>i{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  background:var(--primary-soft);
  color:var(--primary);
  font-style:normal;
  font-size:19px;
}
.ranked-your-tier>div{display:grid;gap:2px}
.ranked-your-tier strong{font-size:15px}
.ranked-your-tier span{font-size:9px;color:var(--muted)}
.ranked-your-placement{
  margin-top:17px;padding:11px 12px;
  border:1px solid var(--line);border-radius:10px;background:var(--surface-2);
  display:flex;align-items:center;justify-content:space-between;
}
.ranked-your-placement small{font-size:8px;color:var(--muted)}
.ranked-your-placement strong{font-size:18px;color:var(--primary)}
.ranked-unplaced{
  margin-top:17px;padding:11px 12px;
  border:1px dashed color-mix(in srgb,var(--primary) 38%,var(--line));
  border-radius:10px;background:var(--primary-soft);
}
.ranked-unplaced strong{display:block;color:var(--primary);font-size:10px}
.ranked-unplaced small{display:block;margin-top:4px;color:var(--muted);font-size:8.5px;line-height:1.45}
.ranked-your-stats{
  display:grid;grid-template-columns:repeat(3,1fr);
  margin-top:13px;
  border:1px solid var(--line);border-radius:10px;overflow:hidden;
}
.ranked-your-stats>div{padding:9px;text-align:center;border-right:1px solid var(--line)}
.ranked-your-stats>div:last-child{border-right:0}
.ranked-your-stats strong{display:block;font-size:12px}
.ranked-your-stats small{font-size:7.5px;color:var(--muted)}
.ranked-scroll-play{width:100%;margin-top:13px}

@media (max-width:980px){
  .challenge-daily-ranking-head,
  .challenge-daily-ranking-row{
    grid-template-columns:44px minmax(180px,1fr) 100px 85px;
  }
  .challenge-daily-ranking-head span:nth-child(3),
  .challenge-daily-ranking-row .daily-country{display:none}
  .ranked-season-layout{grid-template-columns:1fr}
  .ranked-season-table{border-right:0;border-bottom:1px solid var(--line)}
  .duel-season-card{min-width:230px}
}
@media (max-width:680px){
  .challenge-daily-ranking-head,
  .challenge-daily-ranking-row{
    grid-template-columns:38px minmax(130px,1fr) 80px;
  }
  .challenge-daily-ranking-head span:nth-child(5),
  .challenge-daily-ranking-row .daily-accuracy{display:none}
  .ranked-season-table-head,
  .ranked-season-row{
    grid-template-columns:38px minmax(130px,1fr) 70px;
  }
  .ranked-season-table-head span:nth-child(3),
  .ranked-season-table-head span:nth-child(5),
  .ranked-season-row>span:nth-child(3),
  .ranked-season-row>.ranked-tier-chip{display:none}
  .duel-hero{align-items:stretch!important;flex-direction:column}
  .duel-season-card{width:100%;min-width:0}
}


/* v6.6.23 duel tier badge cleanup + private room dark theme fix */
.tier-inline-badge{display:inline-flex;align-items:center;justify-content:center;min-width:74px;padding:5px 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--primary) 34%,var(--line));background:var(--primary-soft);color:var(--primary)!important;font-size:8px!important;font-weight:900;letter-spacing:.03em;text-transform:uppercase}
.tier-badge-box{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 20%,var(--surface)),color-mix(in srgb,var(--primary) 8%,var(--surface-2)));border:1px solid color-mix(in srgb,var(--primary) 38%,var(--line));box-shadow:0 10px 24px rgba(54,44,122,.12);color:var(--primary);font-size:16px;font-weight:900;letter-spacing:.05em;flex:0 0 auto}
.tier-badge-box--lg{width:52px;height:52px;font-size:17px}
.tier-meta-label{display:block;margin-bottom:2px;color:var(--muted)!important;font-size:8px!important;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.duel-season-mini-status{grid-template-columns:auto auto auto!important}
.duel-season-mini-status .tier-inline-badge{min-width:64px}
.ranked-your-tier>div,.season-rank-hero>div{display:grid;gap:2px}
.ranked-your-tier strong,.season-rank-hero strong{line-height:1.05}
.season-rank-hero{align-items:center}
.season-rank-hero small{display:block;margin-top:4px;color:var(--muted)}

.duel-private-config,.duel-private-config *{color:var(--text)}
.duel-private-config{background:var(--surface-2)!important}
.private-room-action strong,.private-room-action small,.private-room-divider,.private-room-join label span,.private-room-options label span{color:var(--text)!important}
.private-room-action small,.private-room-divider,.private-room-join label span,.private-room-options label span{opacity:.82}
.private-room-join input,.private-room-options select{color:var(--text)!important;background:var(--surface)!important;border:1px solid var(--line)!important;-webkit-text-fill-color:var(--text)}
.private-room-join input::placeholder{color:var(--muted)!important;opacity:1}
.private-room-options select option,#duel-language option,#duel-duration option,#duel-private-language option,#duel-private-duration option{background:var(--surface)!important;color:var(--text)!important}
#duel-create-room,#duel-join-room{color:#fff}
#duel-join-room.outline-btn{color:var(--text)!important}