/* Profile tab (#profileRoot) - clean two-card layout, autosaving fields (no buttons). */
#profileRoot { max-width: 760px; text-align: left; font-style: normal; }
#profileRoot .pf-loading { color: var(--muted); font-size: 14px; padding: 20px 0; }
#profileRoot .pf-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 22px 24px; margin-bottom: 16px; }
#profileRoot .pf-h { font-family: var(--font-sub); font-size: 17px; font-weight: 700; color: var(--ink); margin: 0 0 4px; }
#profileRoot .pf-sub { font-size: 13px; color: var(--muted); margin-bottom: 16px; line-height: 1.5; }

#profileRoot .pf-field { display: block; margin-bottom: 14px; position: relative; }
#profileRoot .pf-fl { display: block; font-size: 12px; font-weight: 700; font-family: var(--font-sub); color: var(--ink-soft); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 5px; }
#profileRoot .pf-field input { width: 100%; padding: 11px 13px; border: 1.5px solid var(--field-border); border-radius: 10px; background: var(--field-bg); color: var(--ink); font-family: var(--font-body); font-size: 14px; }
#profileRoot .pf-field input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(125,140,202,.14); }
#profileRoot .pf-saved { position: absolute; right: 4px; bottom: -17px; font-size: 11.5px; font-weight: 700; }
#profileRoot .pf-saved.ok { color: var(--ok); }
#profileRoot .pf-saved.err { color: var(--bad); }
#profileRoot .pf-badge { display: inline-block; background: rgba(47,174,95,.14); color: #1c8f4c; border: 1px solid rgba(47,174,95,.3); border-radius: 999px; padding: 1px 9px; font-size: 10px; font-weight: 700; letter-spacing: .3px; margin-left: 6px; vertical-align: middle; }
#profileRoot .pf-disconnect { background: none; border: none; color: var(--bad); font-size: 12.5px; font-weight: 600; font-family: var(--font-sub); cursor: pointer; padding: 2px 0; }
#profileRoot .pf-disconnect:hover { text-decoration: underline; }

#profileRoot .pf-info { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; margin-top: 10px; border-top: 1px solid var(--line); padding-top: 6px; }
@media (max-width: 560px) { #profileRoot .pf-info { grid-template-columns: 1fr; } }
#profileRoot .pf-row { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
#profileRoot .pf-l { font-size: 12.5px; color: var(--muted); font-weight: 600; font-family: var(--font-sub); }
#profileRoot .pf-v { font-size: 13.5px; color: var(--ink); font-weight: 500; text-align: right; }