/* Friendship quiz maker (B01, 2026-10-31). Every rule under #visu-tools.vt-friendship-quiz; borders stay 1px hairline. */
#visu-tools.vt-friendship-quiz [hidden] { display: none !important; }
#visu-tools.vt-friendship-quiz .vt-fq-from { padding: 10px 14px; border: 1px solid var(--vt-line); border-radius: 12px; background: var(--vt-bg); font-size: 14.5px; font-weight: 600; color: var(--vt-ink); }
#visu-tools.vt-friendship-quiz .vt-fq-list { display: grid; gap: 12px; margin-top: 14px; min-width: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-card { margin: 0; padding: 12px 14px 10px; border: 1px solid var(--vt-line); border-radius: 14px; background: #fff; min-width: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-card[aria-invalid="true"] { border-color: var(--vt-err); }
#visu-tools.vt-friendship-quiz .vt-fq-card legend { padding: 0 6px; font-size: 13px; font-weight: 700; color: var(--vt-muted); text-transform: none; }
#visu-tools.vt-friendship-quiz .vt-fq-card .vt-field { margin: 0 0 10px; }
#visu-tools.vt-friendship-quiz .vt-fq-optgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
#visu-tools.vt-friendship-quiz .vt-fq-opt { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 4px 8px; border: 1px solid var(--vt-line); border-radius: 10px; background: var(--vt-bg); }
#visu-tools.vt-friendship-quiz .vt-fq-opt.vt-fq-is-mine { border-color: var(--vt-ok); background: #f1fbf5; }
#visu-tools.vt-friendship-quiz .vt-fq-opt input[type="radio"] { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--vt-ok); }
#visu-tools.vt-friendship-quiz .vt-fq-opt input[type="text"] { flex: 1 1 auto; min-width: 0; width: 100%; border: 0 !important; background: transparent !important; padding: 6px 2px !important; font: inherit; color: var(--vt-ink); box-shadow: none !important; }
#visu-tools.vt-friendship-quiz .vt-fq-card-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 12px; margin-top: 8px; }
#visu-tools.vt-friendship-quiz .vt-fq-card-foot .vt-hint { margin: 0 !important; font-size: 12.5px; }
#visu-tools.vt-friendship-quiz .vt-fq-count { margin-top: 8px !important; font-size: 14px; color: var(--vt-muted); }
#visu-tools.vt-friendship-quiz .vt-fq-more { margin-top: 6px; }
#visu-tools.vt-friendship-quiz .vt-in > .vt-actions { margin-top: 16px; }
#visu-tools.vt-friendship-quiz .vt-fq-empty { padding: 28px 16px; text-align: center; font-size: 15px; color: var(--vt-muted); border: 1px solid var(--vt-line); border-radius: 14px; background: var(--vt-bg); }
#visu-tools.vt-friendship-quiz .vt-fq-made:not([hidden]) { display: grid; gap: 12px; min-width: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-made.vt-fq-outdated .vt-fq-url { opacity: .5; }
#visu-tools.vt-friendship-quiz .vt-fq-done { font-size: 18px; font-weight: 700; color: var(--vt-ink); letter-spacing: -0.01em; }
#visu-tools.vt-friendship-quiz .vt-fq-url { width: 100%; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important; font-size: 12.5px !important; color: var(--vt-muted) !important; text-overflow: ellipsis; }
#visu-tools.vt-friendship-quiz .vt-fq-contains { padding: 10px 14px; border: 1px solid var(--vt-line); border-radius: 12px; background: var(--vt-bg); }
#visu-tools.vt-friendship-quiz .vt-fq-cta, #visu-tools.vt-friendship-quiz .vt-fq-own { display: grid; gap: 8px; padding: 16px; border: 1px solid var(--vt-line); border-radius: 14px; background: #fff; min-width: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-cta p, #visu-tools.vt-friendship-quiz .vt-fq-own p { margin: 0; overflow-wrap: anywhere; }
#visu-tools.vt-friendship-quiz .vt-fq-cta-h { font-size: 16px; font-weight: 700; color: var(--vt-ink); }
#visu-tools.vt-friendship-quiz .vt-fq-cta .vt-btn, #visu-tools.vt-friendship-quiz .vt-fq-own .vt-btn { justify-self: start; }

/* Friend view: one column, centred, big tap targets. */
#visu-tools.vt-friendship-quiz .vt-fq-recv { grid-template-columns: minmax(0, 1fr); }
#visu-tools.vt-friendship-quiz .vt-fq-recv > .vt-in, #visu-tools.vt-friendship-quiz .vt-fq-recv > .vt-out { display: none; }
#visu-tools.vt-friendship-quiz .vt-fq-play:not([hidden]) { display: grid; gap: 14px; width: 100%; max-width: 560px; margin: 0 auto; min-width: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-note { font-size: 13.5px; color: var(--vt-muted); }
#visu-tools.vt-friendship-quiz .vt-fq-p-title { margin: 0; font-size: 26px; line-height: 1.2; color: var(--vt-ink); overflow-wrap: anywhere; }
#visu-tools.vt-friendship-quiz .vt-fq-center { justify-content: center; }
#visu-tools.vt-friendship-quiz .vt-fq-play .vt-fq-center .vt-btn { flex: 1 1 100%; min-height: 50px; }
#visu-tools.vt-friendship-quiz .vt-fq-final .vt-fq-center .vt-btn { flex: 1 1 auto; min-height: 44px; }
#visu-tools.vt-friendship-quiz .vt-fq-stage:not([hidden]) { display: grid; gap: 12px; }
#visu-tools.vt-friendship-quiz .vt-fq-q { margin: 0; font-size: 21px; line-height: 1.3; color: var(--vt-ink); overflow-wrap: anywhere; }
#visu-tools.vt-friendship-quiz .vt-fq-opts { list-style: none; margin: 0 !important; padding: 0 !important; display: grid; gap: 8px; }
#visu-tools.vt-friendship-quiz .vt-fq-pick { width: 100% !important; min-height: 50px !important; margin: 0 !important; padding: 10px 14px !important; text-align: left !important; border-radius: 12px !important; border: 1px solid var(--vt-line-2) !important;
  background: #fff !important; box-shadow: none !important; color: var(--vt-ink) !important; font-family: inherit !important; font-weight: 600 !important; font-size: 16px !important; line-height: 1.3 !important; letter-spacing: 0 !important; text-transform: none !important; white-space: normal !important; overflow-wrap: anywhere; cursor: pointer; }
#visu-tools.vt-friendship-quiz .vt-fq-pick:hover:not([disabled]) { border-color: var(--vt-ink) !important; }
#visu-tools.vt-friendship-quiz .vt-fq-pick[disabled] { cursor: default; opacity: 1; }
#visu-tools.vt-friendship-quiz .vt-fq-pick.vt-fq-right { border-color: var(--vt-ok) !important; background: #f1fbf5 !important; }
#visu-tools.vt-friendship-quiz .vt-fq-pick.vt-fq-wrong { border-color: var(--vt-err) !important; background: #fdf3f3 !important; }
#visu-tools.vt-friendship-quiz .vt-fq-feedback { font-weight: 700; font-size: 15.5px; }
#visu-tools.vt-friendship-quiz .vt-fq-feedback.vt-fq-ok { color: var(--vt-ok); }
#visu-tools.vt-friendship-quiz .vt-fq-feedback.vt-fq-no { color: var(--vt-ink); }
#visu-tools.vt-friendship-quiz .vt-fq-final:not([hidden]) { display: grid; gap: 12px; text-align: center; min-width: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-big { font-size: 40px; font-weight: 800; line-height: 1.1; color: var(--vt-ink); letter-spacing: -0.02em; }
#visu-tools.vt-friendship-quiz .vt-fq-verdict { font-size: 17px; font-weight: 600; color: var(--vt-ink); }
#visu-tools.vt-friendship-quiz .vt-fq-cmp-h { font-size: 14px; font-weight: 700; color: var(--vt-muted); text-align: left; }
#visu-tools.vt-friendship-quiz .vt-fq-cmp { list-style: none; margin: 0 !important; padding: 0 !important; border: 1px solid var(--vt-line); border-radius: 14px; text-align: left; }
#visu-tools.vt-friendship-quiz .vt-fq-cmp li { display: grid; gap: 2px; padding: 10px 14px; border-top: 1px solid var(--vt-line); overflow-wrap: anywhere; }
#visu-tools.vt-friendship-quiz .vt-fq-cmp li:first-child { border-top: 0; }
#visu-tools.vt-friendship-quiz .vt-fq-cmp-q { font-weight: 700; color: var(--vt-ink); }
#visu-tools.vt-friendship-quiz .vt-fq-cmp li.vt-fq-ok .vt-fq-cmp-q::before { content: "\2713\00a0"; color: var(--vt-ok); }
#visu-tools.vt-friendship-quiz .vt-fq-cmp li.vt-fq-no .vt-fq-cmp-q::before { content: "\2717\00a0"; color: var(--vt-err); }
#visu-tools.vt-friendship-quiz .vt-fq-cmp-a { font-size: 14px; color: var(--vt-text); }
#visu-tools.vt-friendship-quiz .vt-fq-own { text-align: left; }
#visu-tools.vt-friendship-quiz .vt-fq-editcopy { justify-self: center; }
#visu-tools.vt-friendship-quiz .vt-fq-guides ul { list-style: none; padding: 0; display: grid; gap: 12px; }
@media (max-width: 600px) {
  #visu-tools.vt-friendship-quiz .vt-fq-optgrid { grid-template-columns: minmax(0, 1fr); }
  #visu-tools.vt-friendship-quiz .vt-fq-p-title { font-size: 22px; }
}