.metrics-choice {
  background: var(--ui-panel, #fff);
  color: var(--ui-ink, #23343f);
  border-bottom: 1px solid var(--ui-line, #dbe7ea);
  font-family: 'TextSist Manrope', 'Segoe UI', sans-serif;
}
.metrics-choice[hidden] { display: none; }
.metrics-inner { display: flex; align-items: center; gap: 24px; padding-top: 16px; padding-bottom: 16px; }
.metrics-copy { flex: 1; min-width: 0; font-size: 13px; line-height: 1.6; }
.metrics-copy strong { font-size: 14px; font-weight: 650; }
.metrics-copy p { margin: 4px 0; color: var(--ui-muted, #5f737c); }
.metrics-copy details { margin-top: 4px; }
.metrics-copy summary { width: fit-content; cursor: pointer; color: var(--ui-accent, #147b83); }
.metrics-copy details p { max-width: 76ch; margin: 12px 0; }
.metrics-links { display: flex; gap: 8px 20px; flex-wrap: wrap; }
.metrics-links a { color: var(--ui-accent, #147b83); text-decoration: underline; text-underline-offset: 3px; }
.metrics-actions { display: flex; gap: 8px; flex-shrink: 0; }
.metrics-choice .metrics-actions button {
  min-height: 44px; padding: 10px 16px; border: 1px solid var(--ui-line, #dbe7ea);
  border-radius: 8px; background: var(--ui-soft, #f3f7f8); color: var(--ui-ink, #23343f);
  font: inherit; font-size: 14px; line-height: 1.4; cursor: pointer;
}
.metrics-choice .metrics-actions [data-metrics-accept] {
  background: var(--ui-accent, #147b83); border-color: var(--ui-accent, #147b83);
  color: var(--ui-button-ink, #fff);
}
.metrics-choice button:focus-visible, .metrics-choice a:focus-visible, .metrics-choice summary:focus-visible,
.metrics-settings:focus-visible { outline: 2px solid var(--ui-accent, #147b83); outline-offset: 3px; }
.metrics-settings { padding: 0; min-height: 44px; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.metrics-settings:hover { text-decoration: underline; text-underline-offset: 3px; }
.metrics-frame { position: absolute; width: 1px; height: 1px; border: 0; visibility: hidden; pointer-events: none; }
.metrics-choice .metrics-actions [data-metrics-close] { flex:0 0 44px; width:44px; padding:10px; }
[data-metrics-close] svg { width:20px; height:20px; display:block; }
@media (max-width: 720px) {
  .metrics-inner { flex-direction: column; align-items: stretch; gap: 12px; }
  .metrics-actions button { flex: 1; }
}