.progress-journey-hero{padding-top:34px}

.progress-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:16px;
}

.progress-summary-card{
  min-height:148px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:14px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-soft);
}

.progress-summary-card>span{
  color:var(--text-subtle);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.progress-summary-value{
  display:flex;
  align-items:baseline;
  gap:6px;
}

.progress-summary-value strong{
  font-size:clamp(2rem,4vw,3rem);
  line-height:.9;
  letter-spacing:-.06em;
}

.progress-summary-value small{
  color:var(--text-subtle);
  font-size:.72rem;
  font-weight:800;
}

.progress-summary-track,
.progress-category-track,
.progress-game-track,
.progress-goal-track{
  height:8px;
  overflow:hidden;
  border-radius:var(--radius-pill);
  background:var(--surface-soft);
}

.progress-summary-track i,
.progress-category-track i,
.progress-game-track i,
.progress-goal-track i{
  display:block;
  height:100%;
  min-width:0;
  border-radius:inherit;
  background:var(--brand-gradient);
}

.progress-summary-card>small{
  color:var(--muted);
  font-size:.66rem;
  line-height:1.4;
}

.progress-next-section{
  margin-top:14px;
  padding:clamp(22px,3vw,30px);
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  border-radius:calc(var(--radius-md) + 3px);
  background:
    radial-gradient(circle at 92% 4%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 32%),
    var(--surface);
  box-shadow:var(--shadow-soft);
}

.progress-next-hint{
  color:var(--text-subtle);
  font-size:.68rem;
  font-weight:800;
}

.progress-next-goals{
  display:grid;
  grid-template-columns:1.35fr repeat(2,minmax(0,.825fr));
  gap:10px;
}

.progress-goal{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:14px;
  min-height:180px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:15px;
  background:var(--surface-soft);
  color:inherit;
  transition:transform .16s ease,border-color .16s ease,background .16s ease;
}

.progress-goal:first-child{
  background:color-mix(in srgb,var(--accent) 7%,var(--surface));
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
}

.progress-goal:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--accent) 34%,var(--line));
}

.progress-goal-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.progress-goal-type{
  color:var(--text-subtle);
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.045em;
  text-transform:uppercase;
}

.progress-goal-arrow{
  color:var(--text-subtle);
  font-size:1rem;
  font-weight:900;
}

.progress-goal h3{
  margin:0;
  font-size:clamp(1.15rem,2vw,1.55rem);
  line-height:1.05;
  letter-spacing:-.04em;
}

.progress-goal p{
  margin:0;
  color:var(--muted);
  font-size:.72rem;
  line-height:1.5;
}

.progress-goal-progress{
  display:grid;
  gap:6px;
  margin-top:auto;
}

.progress-goal-progress>span{
  display:flex;
  justify-content:space-between;
  gap:10px;
  color:var(--text-subtle);
  font-size:.62rem;
  font-weight:800;
}

.progress-categories-section,
.progress-games-section{margin-top:14px}

.progress-section-intro{
  max-width:760px;
  margin:-8px 0 22px;
  color:var(--muted);
  font-size:.74rem;
  line-height:1.55;
}

.progress-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.progress-category-card{
  --progress-category-color:var(--accent);
  min-width:0;
  display:grid;
  gap:16px;
  padding:17px;
  border:1px solid var(--line);
  border-radius:14px;
  background:
    radial-gradient(circle at 100% 0,color-mix(in srgb,var(--progress-category-color) 9%,transparent),transparent 36%),
    var(--surface-soft);
  color:inherit;
  transition:transform .16s ease,border-color .16s ease;
}

.progress-category-card:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--progress-category-color) 35%,var(--line));
}

.progress-category-head{
  display:flex;
  align-items:center;
  gap:10px;
}

.progress-category-symbol{
  width:34px;
  height:34px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:color-mix(in srgb,var(--progress-category-color) 13%,var(--surface));
  color:var(--progress-category-color);
  font-size:.9rem;
  font-weight:900;
}

.progress-category-head>span:last-child{
  min-width:0;
  display:grid;
  gap:2px;
}

.progress-category-head strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.82rem;
}

.progress-category-head small{
  color:var(--text-subtle);
  font-size:.62rem;
}

.progress-category-measures{display:grid;gap:11px}

.progress-category-measure{display:grid;gap:6px}

.progress-category-measure>span{
  display:flex;
  justify-content:space-between;
  gap:10px;
  color:var(--text-subtle);
  font-size:.62rem;
}

.progress-category-measure strong{color:var(--text);font-weight:850}

.progress-category-track i{
  background:var(--progress-category-color);
}

.progress-game-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.progress-game-card{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:15px;
  padding:17px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-soft);
  color:inherit;
  transition:transform .16s ease,border-color .16s ease;
}

.progress-game-card:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--accent) 30%,var(--line));
}

.progress-game-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

.progress-game-head>span:first-child{
  min-width:0;
  display:grid;
  gap:3px;
}

.progress-game-head strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.86rem;
}

.progress-game-head small{
  color:var(--text-subtle);
  font-size:.62rem;
}

.progress-game-percent{
  flex:0 0 auto;
  color:var(--text);
  font-size:1rem;
  font-weight:900;
  letter-spacing:-.035em;
}

.progress-game-track{height:7px}

.progress-milestones{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
}

.progress-milestone{
  position:relative;
  display:grid;
  gap:6px;
  justify-items:center;
  text-align:center;
}

.progress-milestone-dot{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:50%;
  background:var(--surface);
  color:var(--text-subtle);
  font-size:.64rem;
  font-weight:900;
}

.progress-milestone.is-done .progress-milestone-dot{
  border-color:color-mix(in srgb,var(--mint) 48%,var(--line));
  background:color-mix(in srgb,var(--mint) 13%,var(--surface));
  color:var(--mint);
}

.progress-milestone small{
  max-width:68px;
  color:var(--text-subtle);
  font-size:.56rem;
  line-height:1.25;
}

.progress-game-footer{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:auto;
  color:var(--text-subtle);
  font-size:.62rem;
  font-weight:750;
}

.progress-games-empty{
  margin-top:0;
  box-shadow:none;
}

.progress-rules-note{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:end;
  margin-top:14px;
  padding:clamp(22px,3vw,30px);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--surface-soft);
}

.progress-rules-note h2{
  margin:.12em 0 .28em;
  font-size:clamp(1.35rem,2.7vw,2rem);
  letter-spacing:-.045em;
}

.progress-rules-note p{
  max-width:760px;
  margin:0;
  color:var(--muted);
  font-size:.74rem;
  line-height:1.6;
}

.progress-rules-links{
  display:grid;
  justify-items:end;
  gap:7px;
  white-space:nowrap;
}

.progress-rules-links a{
  color:var(--text-subtle);
  font-size:.69rem;
  font-weight:850;
}

.progress-rules-links a:hover{color:var(--text)}

@media (max-width:980px){
  .progress-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .progress-next-goals{grid-template-columns:1fr 1fr}
  .progress-goal:first-child{grid-column:1 / -1;min-height:160px}
  .progress-category-grid,
  .progress-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:650px){
  .activity-hub-nav{grid-template-columns:repeat(3,1fr)}
  .progress-next-section .statistics-card-head{align-items:flex-start;flex-direction:column}
  .progress-next-goals{grid-template-columns:1fr}
  .progress-goal:first-child{grid-column:auto}
  .progress-category-grid,
  .progress-game-grid{grid-template-columns:1fr}
  .progress-rules-note{grid-template-columns:1fr;align-items:start}
  .progress-rules-links{justify-items:start}
}

@media (max-width:460px){
  .progress-summary-card{min-height:130px;padding:16px}
  .progress-summary-value strong{font-size:1.9rem}
}

@media (prefers-reduced-motion:reduce){
  .progress-goal,
  .progress-category-card,
  .progress-game-card{transition:none}
}