.world-starters {
  display:grid;
  grid-template-columns:minmax(180px,.5fr) minmax(0,1.5fr);
  align-items:end;
  gap:32px;
  margin-bottom:28px;
}
.world-starters h2 {
  margin:7px 0 0;
  font:500 25px/1.05 var(--font-serif);
}
.starter-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.starter-grid button {
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:84px;
  padding:10px;
  border:1px solid var(--brand-line);
  border-radius:9px;
  background:var(--color-surface);
  color:var(--brand-ink);
  text-align:left;
}
.starter-grid button:hover,
.starter-grid button[aria-pressed="true"] {
  border-color:var(--brand-green);
  box-shadow:inset 0 0 0 1px var(--brand-green);
}
.starter-grid button > span:nth-child(2) { min-width:0; }
.starter-grid small,
.starter-grid strong,
.starter-grid em { display:block; }
.starter-grid small {
  color:var(--brand-green);
  font-size:8px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.starter-grid strong {
  margin-top:2px;
  overflow:hidden;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.starter-grid em {
  display:-webkit-box;
  margin-top:2px;
  overflow:hidden;
  color:var(--brand-muted);
  font-size:8px;
  font-style:normal;
  line-height:1.35;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.starter-grid b { color:var(--brand-green); }
.starter-art {
  display:block;
  width:54px;
  height:54px;
  border-radius:7px;
  background-color:#c8e1da;
  box-shadow:inset 0 0 0 1px #26332d22;
}
.starter-art-1 {
  background:
    linear-gradient(#cf7b67 0 0) 10px 10px/14px 14px no-repeat,
    linear-gradient(#efb84f 0 0) 31px 9px/13px 16px no-repeat,
    radial-gradient(circle,#a8cf84 0 9px,transparent 10px) 9px 29px/20px 20px no-repeat,
    linear-gradient(#73a874 0 0) 32px 31px/13px 13px no-repeat,
    #efe3bd;
}
.starter-art-2 {
  background:
    radial-gradient(circle at 25% 35%,#73a874 0 7px,transparent 8px),
    radial-gradient(circle at 63% 28%,#dc9560 0 10px,transparent 11px),
    radial-gradient(circle at 42% 72%,#efb84f 0 8px,transparent 9px),
    #c8e1da;
}
.starter-art-3 {
  background:
    linear-gradient(135deg,transparent 44%,#bd4029 45% 51%,transparent 52%),
    radial-gradient(circle at 18% 78%,#dc9560 0 6px,transparent 7px),
    radial-gradient(circle at 83% 18%,#26332d 0 8px,transparent 9px),
    #dbe7cf;
}
@media(max-width:1050px) {
  .world-starters { grid-template-columns:1fr; align-items:start; }
}
@media(max-width:760px) {
  .world-starters { padding-inline:2px; }
  .starter-grid { grid-template-columns:1fr; }
  .starter-grid button { min-height:74px; }
}