/* Sync sheet */
.sync-code { margin: 4px 0 8px; padding: 16px; border-radius: 16px; text-align: center; font-size: clamp(18px, 5.6vw, 26px); letter-spacing: .03em; white-space: nowrap;
  background: var(--surface-2); border: 1px dashed rgba(212, 255, 58, .45); color: var(--volt); }
.sync-status { font-size: 13px; color: var(--muted); text-align: center; }
.sync-status.err { color: var(--fire); margin-top: 12px; }
.sync-or { display: flex; align-items: center; gap: 10px; margin: 18px 0 12px; color: var(--faint); font-size: 12px; }
.sync-or::before, .sync-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.sync-join { display: flex; gap: 8px; }
.sync-join input { flex: 1; min-width: 0; height: 48px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); padding: 0 12px;
  font-family: var(--display); font-size: 17px; letter-spacing: .04em; text-transform: uppercase; color: var(--text); }
.sync-join input::placeholder { color: var(--faint); }
.sync-join input:focus { outline: none; border-color: var(--volt); }