.screen-result { background: var(--c-base); }

.result-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: calc(44px + env(safe-area-inset-top, 0px)) 24px 24px 24px;
  flex: 1 1 auto;
  overflow-y: auto;
}
.result-heading { margin: 0; font-size: 15px; font-weight: 900; color: var(--c-sub); text-align: center; }

.result-best-card {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 24px 16px;
  border-radius: 24px;
  background: var(--c-surface);
  border: 3px solid var(--c-accent);
}
.result-best-card__title { font-size: 18px; font-weight: 900; color: var(--c-text); }
.result-best-card__row { display: flex; align-items: baseline; gap: 6px; }
.result-best-card__prefix { font-size: 30px; font-weight: 900; color: var(--c-text); }
.result-best-card__number {
  font-size: 120px; font-weight: 900; line-height: 1; color: var(--c-life);
  font-variant-numeric: tabular-nums;
}
.result-best-card__number.is-best { color: var(--c-perfect); }
.result-best-card__sub { font-size: 14px; font-weight: 700; color: var(--c-sub); }

.result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.result-tile {
  display: flex; flex-direction: column; gap: 2px;
  padding: 14px; border-radius: var(--r-card);
  background: var(--c-surface);
}
.result-tile .label { font-size: 12px; font-weight: 700; color: var(--c-sub); }
.result-tile .value { font-size: 26px; font-weight: 900; color: var(--c-text); font-variant-numeric: tabular-nums; }


.result-panel { gap: 16px; padding: 28px 24px 40px 24px; margin-top: 0; }
.result-retry-btn { width: 100%; height: 72px; font-size: 26px; }