.taller-shell { padding-bottom: var(--space-8); }
.taller-shell :where(h1, h2, h3, p) { margin: 0; }

.taller-top a { min-height: 24px; }
.taller-heading { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); }

.taller-shell button { appearance: none; background: var(--surface); color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--game-radius); font: inherit; min-height:var(--game-control-height); padding: var(--game-control-padding); cursor: pointer; touch-action: manipulation; }
.taller-shell button:hover { border-color: var(--accent); }
.taller-shell button:disabled { cursor: default; opacity: 1; }
.taller-editions { display: flex; flex: none; }
.taller-editions button { font-size: var(--font-size-sm); }
.taller-editions button + button { border-left: 0; }
.taller-editions button[aria-pressed="true"] { background: var(--accent); color: var(--text-inverse); border-color: var(--accent); font-weight: 600; }

.taller-score { justify-content: space-between; }
.taller-score strong { font-size: var(--font-size-2xl); font-variant-numeric: tabular-nums; color: var(--accent); }
.taller-score > span { color: var(--ink-2); font-size: var(--font-size-xs); }
.taller-score b { font-variant-numeric: tabular-nums; }
.taller-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.taller-shell .taller-choice { position: relative; display: flex; flex-direction: column; align-items: stretch; min-width: 0; border: 0; border-radius: 0; padding: var(--space-6) var(--space-3) var(--space-3); text-align: center; background: transparent; transition: background var(--game-motion); }
.taller-shell .taller-choice + .taller-choice { border-left: 1px solid var(--line); }
.taller-choice:not(:disabled):hover { background: var(--accent-soft); }
.taller-choice:focus-visible { outline-offset: -3px; }
.taller-mark { position: absolute; top: var(--space-2); left: var(--space-3); font-size: var(--font-size-xs); color: var(--ink-3); }
.taller-drawing { display: block; flex: none; height: clamp(150px, 25vh, 230px); margin-bottom: var(--space-2); border-bottom: 1px solid var(--line-strong); }
.taller-drawing svg { display: block; height: 100%; width: 100%; overflow: visible; }
.taller-silhouette { transform-box: view-box; transform-origin: 90px 310px; transform: scale(var(--drawing-scale, 1)); transition: transform 600ms ease; }
.taller-outline { fill: var(--accent-soft); fill-rule: evenodd; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.taller-lines { fill: none; stroke: currentColor; stroke-width: .7; opacity: .5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.taller-name { display: flex; align-items: center; justify-content: center; min-height: 2.8em; font-size: var(--font-size-lg); line-height: var(--line-height-snug); font-weight: 600; overflow-wrap: anywhere; }
.taller-place { display: block; color: var(--ink-2); font-size: var(--font-size-xs); margin-top: var(--space-1); }
.taller-height { display: block; min-height: 1.5em; font-family: var(--font-mono); font-size: var(--font-size-2xl); line-height: var(--line-height-snug); font-weight: 500; margin-block: var(--space-2); }
.taller-height small { font-size: var(--font-size-sm); margin-left: var(--space-1); }
.taller-choose { display: block; font-size: var(--font-size-sm); border-top: 1px solid var(--line); padding-top: var(--space-2); }
.taller-choose kbd { font: inherit; font-size: var(--font-size-xs); color: var(--ink-3); margin-left: var(--space-1); }
.taller-choice.is-winner { color: var(--ok); background: var(--accent-soft); }
.taller-choice.is-wrong { color: var(--miss); }
.taller-choice.is-winner .taller-mark { color: var(--ok); font-weight: 600; }
.taller-choice.is-wrong .taller-mark { color: var(--miss); font-weight: 600; }
.taller-feedback { display: flex; align-items: center; justify-content: center; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-top: 1px solid var(--line); min-height: 62px; }
.taller-feedback p { font-size: var(--font-size-sm); text-align: center; }
.taller-feedback.is-correct p { color: var(--ok); }
.taller-feedback.is-over p { color: var(--miss); }
.taller-feedback button { flex: none; font-size: var(--font-size-sm); }
.taller-caption { color: var(--ink-2); font-size: var(--font-size-xs); text-align: center; padding: 0 var(--space-3) var(--space-3); }
.taller-result { border-bottom: 1px solid var(--line-strong); padding-block: var(--space-4); }
.taller-result h2 { font-size: var(--font-size-2xl); line-height: var(--line-height-snug); }
.taller-result p { font-size: var(--font-size-sm); color: var(--ink-2); }
#result-grid { letter-spacing: 2px; margin-top: var(--space-2); overflow-wrap: anywhere; }
.taller-result-actions { margin-top: var(--space-3); }
.taller-result-actions button { flex: 1; font-size: var(--font-size-sm); }
.taller-shell button.taller-primary { background: var(--accent); color: var(--text-inverse); border-color: var(--accent); }
.taller-post-game { display: flow-root; }
.taller-shell .t-ad--game-banner { margin-block: var(--space-4); }
.taller-bottom { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding-block: var(--space-1); font-size: var(--font-size-xs); color: var(--ink-2); }
.taller-shell .taller-bottom button { background: transparent; border: 0; font-size: var(--font-size-xs); }
.taller-details { border-top: 1px solid var(--line); padding-block: var(--space-2); }
.taller-details summary { font-weight: 500; }
.taller-details summary span { float: right; font-size: var(--font-size-xs); font-weight: 400; color: var(--ink-2); }
.taller-small { font-size: var(--font-size-xs); color: var(--ink-2); margin-bottom: var(--space-3); }
#record-list { list-style: none; }
#record-list li { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); min-height:var(--game-control-height); border-bottom: 1px solid var(--line); font-size: var(--font-size-sm); }
#record-list time { font-size: var(--font-size-xs); color: var(--ink-2); }
.taller-leaderboard { margin-top: var(--game-section-gap); padding-block: var(--space-4); border-top: var(--game-rule); }
.taller-board-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--game-gap); }
.taller-board-heading h2 { font-size: var(--font-size-xl); }
.taller-board-heading a { font-size: var(--font-size-xs); color: var(--ink-2); text-underline-offset: 3px; }
.taller-leaderboard .taller-small { margin-block: var(--space-1); }
.taller-leaderboard .lb { margin-top: var(--space-3); }
.taller-board-save { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-2); }
.taller-board-save p, .taller-board-save button { font-size: var(--font-size-xs); color: var(--ink-2); }

.taller-catalog { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.taller-catalog article { min-width: 0; border-bottom: 1px solid var(--line); padding-bottom: var(--space-3); }
.taller-catalog svg { display: block; height: 100px; width: 100%; margin-bottom: var(--space-2); color: var(--ink-2); }
.taller-catalog h3 { font-size: var(--font-size-sm); font-weight: 500; line-height: var(--line-height-snug); overflow-wrap: anywhere; }
.taller-catalog p { font-size: var(--font-size-xs); color: var(--ink-2); }
.taller-catalog a { display: inline-flex; align-items: center; min-height:var(--game-control-height); font-size: var(--font-size-sm); font-family: var(--font-mono); text-underline-offset: 3px; }
.taller-share-dialog { width: min(90vw, 440px); padding: var(--space-5); background: var(--surface); color: var(--ink); border: 1px solid var(--line-strong); }
.taller-share-dialog::backdrop { background: var(--ink); opacity: .45; }
.taller-share-dialog h2 { font-size: var(--font-size-xl); }
.taller-share-dialog p { font-size: var(--font-size-sm); margin-block: var(--space-2); }
.taller-share-dialog textarea { width: 100%; min-height: 160px; padding: var(--space-2); border: 1px solid var(--line-strong); font: inherit; font-size: var(--font-size-sm); }
.taller-share-dialog button { display: block; margin-top: var(--space-3); min-height:var(--game-control-height); padding-inline: var(--space-4); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); font: inherit; cursor: pointer; }
@media (max-width: 600px) {
  .taller-heading { gap: var(--space-2); }
  .taller-heading h1 { font-size: var(--font-size-2xl); }
  .taller-editions button { padding-inline: var(--space-3); }
  .taller-shell .taller-choice { padding-inline: var(--space-2); }
  .taller-name { font-size: var(--font-size-base); min-height: 3em; }
  .taller-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 360px) {
  .taller-heading { align-items: flex-start; }
  .taller-heading h1 { font-size: var(--font-size-xl); }
  .taller-heading p { font-size: var(--font-size-xs); }
  .taller-editions button { padding-inline: var(--space-2); }
  .taller-choose { font-size: var(--font-size-xs); }
  .taller-choice kbd { display: none; }
}
@media (max-height: 500px) and (min-width: 600px) {
  .taller-top { padding-block: var(--space-1); }
  .taller-heading { padding-block: var(--space-1); }
  .taller-drawing { height: 120px; }
}
@media (prefers-reduced-motion: reduce) {
  .taller-silhouette, .taller-choice { transition: none; }
}