/* Verdict screen, redesign C (2026-10-26). Tokens from c-design.css. */
.c-verdict { --tone: #8e8e93; --tone-bg: color-mix(in srgb, var(--tone) 10%, var(--surface, #fff));
  margin: 0 0 20px; padding: 22px; border-radius: 22px; background: var(--tone-bg); font-family: var(--c-font); color: var(--c-ink); }
.c-verdict--danger  { --tone: #ff3b30; }
.c-verdict--risk    { --tone: #ff9500; }
.c-verdict--neutral { --tone: #8e8e93; }
.c-verdict--good    { --tone: #34c759; }

.c-verdict-top { display: flex; align-items: center; gap: 16px; }
.c-verdict-badge { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--tone); color: #fff; }
.c-verdict-head { flex: 1; min-width: 0; }
.c-verdict-level { margin: 0; font-size: clamp(26px, 4vw, 34px); line-height: 1.1; font-weight: 700; letter-spacing: -0.025em; color: var(--tone); }
.c-verdict--neutral .c-verdict-level { color: var(--c-ink); }
.c-verdict-comment { margin: 4px 0 0; font-size: 16px; line-height: 1.4; color: var(--c-ink-2); }
.c-verdict-score { flex: none; text-align: right; }
.c-verdict-score strong { font-size: 30px; font-weight: 700; letter-spacing: -0.02em; }
.c-verdict-score span { font-size: 14px; color: var(--c-muted); }

.c-verdict-meter { height: 6px; margin-top: 18px; border-radius: 999px; background: color-mix(in srgb, var(--tone) 18%, transparent); overflow: hidden; }
.c-verdict-meter i { display: block; height: 100%; border-radius: inherit; background: var(--tone); }
.c-verdict-meta { margin: 8px 0 0; font-size: 13px; color: var(--c-muted); }
.c-verdict-meta:empty { display: none; }

.c-verdict-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.c-verdict-btn { height: 44px; padding: 0 18px; border: 1px solid var(--c-line); border-radius: 999px; background: var(--surface, #fff);
  color: var(--c-ink); font: 600 15px/1 var(--c-font); cursor: pointer; }
.c-verdict-btn.is-primary { border-color: transparent; background: var(--c-ink); color: var(--bg, #fff); }

.c-verdict-help { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 14px 16px;
  border-radius: 16px; background: var(--surface, #fff); color: var(--c-ink); text-decoration: none; font-size: 15px; line-height: 1.4; }
.c-verdict-help b { color: var(--tone); }
.c-verdict-help svg { flex: none; color: var(--c-muted); }

@media (hover: hover) and (pointer: fine) {
  .c-verdict-btn { transition: transform 160ms var(--c-ease), background-color 160ms ease; }
  .c-verdict-btn:hover { background: var(--c-fill); }
  .c-verdict-btn.is-primary:hover { background: var(--c-ink-2); }
  .c-verdict-help:hover svg { color: var(--tone); }
}
@media (max-width: 560px) {
  .c-verdict { padding: 18px; border-radius: 18px; }
  .c-verdict-top { flex-wrap: wrap; gap: 12px; }
  .c-verdict-badge { width: 48px; height: 48px; }
  .c-verdict-score { order: 3; width: 100%; text-align: left; }
  .c-verdict-actions .c-verdict-btn { flex: 1 1 auto; }
}