.ui-section { border-top: var(--ui-border-width) solid var(--ui-line); padding-top: var(--ui-space-7); margin-top: var(--ui-space-7); }
.ui-section-heading { margin-bottom: var(--ui-space-5); }
.ui-section h2 { font-size: var(--ui-text-section); line-height: var(--ui-leading-heading); margin: 0; font-weight: var(--ui-weight-strong); }
.ui-section-heading > p, .ui-permissions > p { color: var(--ui-muted); font-size: var(--ui-text-sm); margin: var(--ui-space-2) 0 0; }
.ui-permissions > p { margin-bottom: var(--ui-space-5); }
.ui-columns { display: grid; align-items: start; gap: var(--ui-space-5); min-width: 0; }
.ui-columns[data-count="two"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ui-profile { display: flex; align-items: center; gap: var(--ui-space-3); margin-bottom: var(--ui-space-6); overflow-wrap: anywhere; }
.ui-profile > div { min-width: 0; }
.ui-profile strong { font-size: var(--ui-text-md); font-weight: var(--ui-weight-strong); }
.ui-profile p { color: var(--ui-muted); font-size: var(--ui-text-sm); margin: var(--ui-space-1) 0 0; }
.ui-avatar { display: flex; align-items: center; justify-content: center; flex: none; width: var(--ui-avatar-size); height: var(--ui-avatar-size); border-radius: var(--ui-radius-control); background: var(--ui-secondary); color: var(--ui-link); }
.ui-recovery-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--ui-space-3); margin-bottom: var(--ui-space-3); color: var(--ui-muted); font-size: var(--ui-text-sm); }
.ui-recovery-list { margin: 0; padding: 0; list-style-position: inside; display: grid; gap: var(--ui-space-2); }
.ui-recovery-list li { padding: var(--ui-space-3); background: var(--ui-input-bg); border: var(--ui-border-width) solid var(--ui-line); border-radius: var(--ui-radius-control); color: var(--ui-dim); font-size: var(--ui-text-xs); }
.ui-recovery-list code { font-family: var(--ui-mono); color: var(--ui-text); user-select: all; overflow-wrap: anywhere; }
.ui-copy-status { font-size: var(--ui-text-xs); color: var(--ui-success); min-height: var(--ui-space-5); margin: var(--ui-space-2) 0 var(--ui-space-4); }
.ui-copy-status[data-tone="error"] { color: var(--ui-error); }
.ui-scanner { display: grid; grid-template-columns: var(--ui-qr-size) minmax(0, 1fr); align-items: center; gap: var(--ui-space-5); margin-bottom: var(--ui-space-5); }
.ui-scanner strong { font-size: var(--ui-text-sm); font-weight: var(--ui-weight-medium); }
.ui-scanner p, .ui-enrollment-help { color: var(--ui-dim); font-size: var(--ui-text-xs); line-height: var(--ui-leading-copy); }
.ui-qr { width: var(--ui-qr-size); max-width: 100%; height: auto; aspect-ratio: 1 / 1; background: var(--ui-qr-paper); border-radius: var(--ui-radius-control); }
.ui-enrollment { margin-bottom: var(--ui-space-6); }
.ui-disclosure { font-size: var(--ui-text-sm); color: var(--ui-muted); margin: var(--ui-space-5) 0; }
.ui-disclosure > summary { cursor: pointer; color: var(--ui-link); width: fit-content; max-width: 100%; }
.ui-disclosure-content { margin-top: var(--ui-space-5); }
.ui-secret { margin-top: var(--ui-space-3); padding: var(--ui-space-3); background: var(--ui-input-bg); border-radius: var(--ui-radius-control); overflow-wrap: anywhere; color: var(--ui-text); font-family: var(--ui-mono); user-select: all; }
.ui-refresh-status { color: var(--ui-warning); font-size: var(--ui-text-sm); }
.ui-confirm { min-width: 0; color: var(--ui-error); }
.ui-confirm > summary { width: fit-content; max-width: 100%; min-height: var(--ui-control-height); padding: var(--ui-space-2) var(--ui-space-3); border: var(--ui-border-width) solid transparent; border-radius: var(--ui-radius-control); align-content: center; list-style-position: inside; cursor: pointer; font-size: var(--ui-text-sm); font-weight: var(--ui-weight-medium); overflow-wrap: anywhere; }
.ui-confirm > summary:hover { background: var(--ui-secondary-hover); }
.ui-confirm > summary:active { background: var(--ui-secondary); }
.ui-confirm[open] > summary { margin-bottom: var(--ui-space-3); }
.ui-confirm-content { border-top: var(--ui-border-width) solid var(--ui-line); padding-top: var(--ui-space-4); }
.ui-confirm-content > p { margin: 0 0 var(--ui-space-4); color: var(--ui-muted); font-size: var(--ui-text-sm); line-height: var(--ui-leading-copy); overflow-wrap: anywhere; }
.ui-confirm-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--ui-space-3); }
.ui-confirmation { min-width: 0; }
.ui-dialog { width: var(--ui-width-wide); max-width: calc(100% - var(--ui-space-5) * 2); max-height: calc(var(--ui-viewport-height) - var(--ui-space-5) * 2); margin: auto; padding: var(--ui-space-6); overflow: auto; color: var(--ui-text); background: var(--ui-panel); border: var(--ui-border-width) solid var(--ui-line); border-radius: var(--ui-radius-card); }
.ui-dialog::backdrop { background: var(--ui-backdrop); }
.ui-dialog > h2 { margin: 0 0 var(--ui-space-4); font-size: var(--ui-text-section); font-weight: var(--ui-weight-strong); line-height: var(--ui-leading-heading); }
.ui-dialog > .ui-confirm-content { border: 0; padding: 0; }
html:has(.ui-dialog[open]) { overflow: hidden; }
@media (max-width: 520px) { .ui-columns[data-count="two"] { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 355px) { .ui-scanner { grid-template-columns: minmax(0, 1fr); } }
