/* Privacy and anonymity page */
.pv { display: grid; gap: 16px; }
.pv h2 { margin: 6px 0 10px; }
.pv-title { margin: 0 0 14px; font-size: 20px; color: var(--navy); }
.pv-promises { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.pv-promise { padding: 16px; background: var(--accent-soft); border-radius: 8px; }
.pv-promise h3 { margin: 10px 0 6px; font-size: 16px; color: var(--navy); }
.pv-promise p { margin: 0; font-size: 13px; line-height: 1.55; color: var(--ink); }
.pv-icon { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--teal); color: #fff; font-size: 16px; font-weight: 700; }
.pv-split { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: stretch; }
.pv-box { padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.pv-box-label { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--teal); }
.pv-knows { margin: 0 0 8px; font-size: 14px; line-height: 1.5; }
.pv-then { margin: 0; font-size: 13px; color: var(--danger); font-weight: 600; }
.pv-bridge { display: grid; align-content: center; justify-items: center; gap: 4px; max-width: 160px; text-align: center; font-size: 12px; color: var(--muted); }
.pv-arrow { font-size: 28px; color: var(--teal); line-height: 1; }
.pv-steps { margin: 0; padding: 0; list-style: none; counter-reset: pv; display: grid; gap: 12px; }
.pv-steps li { counter-increment: pv; position: relative; padding-left: 44px; line-height: 1.55; font-size: 14px; }
.pv-steps li::before { content: counter(pv); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: #fff; font-weight: 700; font-size: 14px; }
.pv-owner { display: grid; grid-template-columns: 96px 1fr; gap: 20px; align-items: start; }
.pv-photo { position: relative; width: 96px; height: 96px; border-radius: 50%; overflow: hidden; background: var(--navy); display: grid; place-items: center; }
.pv-photo span { color: #fff; font-size: 28px; font-weight: 700; }
.pv-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pv-check { background: var(--accent-soft); }
.pv-prompt { white-space: pre-wrap; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 12px; font-size: 13px; }
.pv-fold { border-top: 1px solid var(--line); }
.pv-fold:last-of-type { border-bottom: 1px solid var(--line); }
.pv-fold summary { cursor: pointer; padding: 14px 0; font-weight: 600; color: var(--navy); list-style: none; display: flex; justify-content: space-between; }
.pv-fold summary::-webkit-details-marker { display: none; }
.pv-fold summary::after { content: "+"; color: var(--teal); font-size: 20px; line-height: 1; }
.pv-fold[open] summary::after { content: "–"; }
.pv-fold-body p { margin: 0 0 12px; font-size: 14px; line-height: 1.6; color: var(--ink); }
.wa-label, .pv-fold-body p.wa-label { margin: 12px 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--teal); }
.wa-fold .wa-label:first-child { margin-top: 0; }
.wa-fold summary { gap: 16px; align-items: center; }
.wa-title { display: block; }
.wa-sub { display: block; margin-top: 3px; font-size: 13px; font-weight: 400; color: var(--muted); line-height: 1.45; }
/* Share page progress */
.rf-count { margin: 0 0 18px; font-size: 15px; color: var(--ink); }
.rf-count strong { font-size: 28px; color: var(--teal); margin-right: 4px; }
.rf-bar { position: relative; height: 12px; margin: 12px 14px 26px 0; border-radius: 999px; background: var(--accent-soft); }
.rf-fill { position: absolute; inset: 0 auto 0 0; border-radius: 999px; background: linear-gradient(90deg, var(--teal), #3bb0a8); transition: width .8s ease; }
.rf-mark { position: absolute; top: 50%; width: 28px; height: 28px; margin-left: -14px; transform: translateY(-50%); border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; background: #fff; border: 2px solid var(--line); color: var(--muted); }
.rf-mark.on { background: var(--teal); border-color: var(--teal); color: #fff; }
.rf-levels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.rf-level { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--line); border-radius: 8px; opacity: .75; }
.rf-level strong { display: block; color: var(--navy); }
.rf-level span { font-size: 13px; color: var(--muted); line-height: 1.45; }
.rf-level.on { opacity: 1; border-color: var(--teal); background: var(--accent-soft); box-shadow: 0 0 0 3px rgba(14, 140, 140, .12); }
.rf-badge { flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; color: var(--muted) !important; background: #fff; border: 2px solid var(--line); font-size: 14px !important; }
.rf-level.on .rf-badge { background: var(--teal); border-color: var(--teal); color: #fff !important; }
.rf-next { margin-top: 16px; font-weight: 600; color: var(--navy); }
.confetti { position: fixed; inset: 0; pointer-events: none; overflow: hidden; z-index: 50; }
.confetti i { position: absolute; top: -12px; width: 8px; height: 12px; border-radius: 2px; animation-name: confetti-fall; animation-timing-function: ease-in; animation-fill-mode: forwards; }
@keyframes confetti-fall { to { top: 105%; transform: translateX(40px) rotate(720deg); } }
@media (max-width: 650px) {
  .pv-promises { grid-template-columns: 1fr; }
  .pv-split { grid-template-columns: 1fr; }
  .pv-bridge { max-width: none; }
  .pv-arrow { transform: rotate(90deg); }
  .pv-owner { grid-template-columns: 1fr; }
  .rf-levels { grid-template-columns: 1fr; }
}