/* One quiet score and one disclosure; sharing opens below the score. */
html[data-theme] .score-panel, html[data-theme] .score-panel[data-collapsed="true"] {
  padding: 0; border: 0; border-radius: 0; background: transparent;
  box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
  transition: none;
}
@media (min-width: 701px) {
  html[data-theme] .score-panel, html[data-theme] .score-panel[data-collapsed="true"] { display: block; }
  html[data-theme] .score-panel[data-collapsed="true"] .score-panel-toggle { margin: 0 0 4px; min-height: 40px; }
  html[data-theme] .score-panel[data-collapsed="true"] .score-value,
  html[data-theme] .score-panel[data-collapsed="true"] .score-value.t-digit-group { font-size: 48px; line-height: 1.2; }
}
html[data-theme] .score-panel-toggle { margin: 0 0 4px; font-size: 11px; font-weight: 500; letter-spacing: .05em; min-height: 40px; }
html[data-theme] .score-value, html[data-theme] .score-value.t-digit-group { font-family: var(--nokia-font); font-size: 48px; line-height: 1.2; font-weight: 400; letter-spacing: 0; color: var(--ui-ink); font-variant-numeric: tabular-nums; -webkit-font-smoothing: auto; transition: color 180ms ease; }
/* The supplied font has a narrower "1"; give each animated digit one cell. */
.score-panel .t-digit { width: .75em; text-align: center; }
html[data-theme] .score-panel .share-options { display: block; margin: 0; opacity: 1; border: 0; }
html[data-theme] .score-panel .share-options-inner { overflow: visible; padding: 0; }
.score-panel-content { transform-origin: top; }
.score-panel .challenge-name { margin: 22px 0 8px; gap: 6px; }
.score-panel .challenge-name > span { color: var(--ui-muted); font-size: 11px; font-weight: 400; }
.score-panel .challenge-name small { color: inherit; font-size: inherit; }
html[data-theme] .score-panel .challenge-name input { min-height: 40px; padding: 8px 10px; border: 0; border-radius: 8px; background: var(--ui-raised); font-size: 14px; font-weight: 400; box-shadow: none; }
html[data-theme] .score-panel .share-button,
html[data-theme] .score-panel .share-grid button,
html[data-theme] .score-panel .share-grid a,
html[data-theme] .score-panel .challenge-rematch {
  display: inline-flex; align-items: center; justify-content: flex-start; gap: 8px;
  width: auto; min-width: 40px; min-height: 44px; margin: 0; padding: 0 2px;
  border: 0; border-radius: 4px; background: transparent; color: var(--ui-ink);
  font: 400 13px/1.4 var(--ui-font); letter-spacing: 0; text-decoration: none;
  box-shadow: none; transition: color 150ms ease, scale 150ms ease;
}
html[data-theme] .score-panel .share-button { font-weight: 500; }
html[data-theme] .score-panel .share-button > span { color: inherit; font-size: 15px; }
html[data-theme] .score-panel .share-grid { display: flex; gap: 20px; margin: 0; padding: 0; }
html[data-theme] .score-panel .share-grid button, html[data-theme] .score-panel .share-grid a { color: var(--ui-muted); font-size: 12px; }
html[data-theme] .score-panel :is(.share-button,.share-grid button,.share-grid a,.challenge-rematch):hover { background: transparent; color: var(--ui-ink); text-decoration: underline; text-underline-offset: 4px; }
html[data-theme] .score-panel :is(.share-button,.share-grid button,.share-grid a,.challenge-rematch):active { scale: .96; }
.score-panel .challenge-result { margin: 16px 0 0; }
.score-panel .challenge-result-label, .score-panel #challenge-result-description { display: none; }
html[data-theme] .score-panel .challenge-result h2 { font-size: 14px; font-weight: 400; line-height: 1.5; letter-spacing: 0; text-wrap: pretty; }
html[data-theme] .score-panel .challenge-result-actions { display: block; margin: 0; }
html[data-theme] .score-panel .challenge-rematch { color: var(--ui-muted); font-size: 12px; }
html[data-theme] .score-panel .challenge-result[data-outcome="win"] + .score-panel-content .challenge-rematch { background: transparent; color: var(--ui-muted); }
@media (min-width: 901px) {
  html[data-theme] .experience { --side-top: clamp(32px, 8dvh, 88px); grid-template-columns: minmax(180px,.95fr) minmax(240px,1.65fr) minmax(180px,.8fr); grid-template-rows: auto; align-items: start; }
  html[data-theme] .intro { grid-column: 1; grid-row: 1; align-self: start; margin-top: var(--side-top); padding-top: 0; }
  html[data-theme] .phone-area { grid-column: 2; grid-row: 1; align-self: start; }
  html[data-theme] .score-panel { grid-column: 3; grid-row: 1; align-self: start; margin: var(--side-top) 0 0; width: 100%; max-width: 240px; }
}
@media (min-width: 701px) and (max-width: 900px) {
  html[data-theme] .score-panel { align-self: start; justify-self: start; margin-top: 0; max-width: 280px; }
}
@media (max-width: 700px) {
  html[data-theme] body[data-phase] .experience > .score-panel { display: none; }
  html[data-theme] body[data-phase] .mobile-score-dialog .score-panel { display: block; width: 100%; max-width: none; margin: 0; }
  html[data-theme] .mobile-score-dialog .score-panel-content, html[data-theme] .mobile-score-dialog .score-panel-content-inner { display: block; }
  html[data-theme] .mobile-score-dialog .score-value, html[data-theme] .mobile-score-dialog .score-value.t-digit-group { font-size: 48px; color: var(--ui-ink); }
  html[data-theme] .mobile-score-dialog .score-panel .share-options { display: block; margin: 0; border: 0; }
  html[data-theme] .mobile-score-dialog .score-panel .share-options-inner { padding: 0; }
  html[data-theme] .mobile-score-dialog .share-button { display: inline-flex; }
  html[data-theme] .mobile-score-dialog .challenge-name input { font-size: 16px; }
  html[data-theme] .mobile-score-dialog .challenge-result-actions { margin-top: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .score-panel-content, .score-panel .share-button, .score-panel .share-grid button, .score-panel .share-grid a, .score-panel .challenge-rematch { transition: none; }
}
