main { max-width: 720px; }
.level-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 10px 0; }
.level { display: flex; flex-direction: column; align-items: flex-start; padding: 8px 10px; text-align: left; line-height: 1.25; }
.level small { color: var(--soft); }
.level .earned { letter-spacing: .1em; color: #a97a12; min-height: 1.25em; }
.play-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.play-head h2 { margin: 0; }
.score { margin: 0; font-weight: 600; white-space: nowrap; }
#play .rules { margin: 2px 0 6px; }
.mountain { background: linear-gradient(#e8f0ee, #f7f2e7); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.mountain svg { display: block; width: 100%; height: auto; }
.ground { fill: #b7c4b3; stroke: #5d705f; stroke-width: 1.2; stroke-linejoin: round; }
.level-line { stroke: #5a665f; stroke-dasharray: 3 3; stroke-width: 1; }
.tag { font: 700 11px ui-sans-serif, system-ui, sans-serif; text-anchor: middle; }
.owner { font: 700 10px ui-sans-serif, system-ui, sans-serif; text-anchor: middle; dominant-baseline: central; fill: #fff; }
.tag.a { fill: #a8432e; }
.tag.b { fill: #235c8a; }
.pad { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 8px 0 0; }
.pad button { min-height: 52px; padding: 0 6px; }
.won { background: var(--card); border: 2px solid var(--good); border-radius: 8px; padding: 10px; margin: 6px 0; }
.won p { margin: 0 0 4px; font-weight: 600; }
.map-fig { margin: 14px 0 0; }
.map-fig figcaption { font-weight: 600; font-size: .9rem; }
.map { width: min(100%, 300px); background: var(--card); border: 1px solid var(--line); border-radius: 8px; margin-top: 4px; }
.map svg { display: block; width: 100%; height: auto; }
.score-line { margin: 8px 0; }
.sliders { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; height: 150px; }
.sliders label { display: flex; flex-direction: column; align-items: center; font-size: .8rem; color: var(--soft); min-width: 0; }
.sliders input { accent-color: var(--accent); writing-mode: vertical-lr; direction: rtl; flex: 1; width: 40px; min-height: 0; margin: 0; }
@media (max-width: 480px) {
  .pad { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pad button { min-height: 48px; }
  .status { min-height: 0; padding: 6px 8px; font-size: .875rem; }
}