/* Fieldbook account page integration: only shared theme tokens, no fixed palette. */
#fn-admin-pages,#account-panel{
 --account-bg:var(--fb-bg,var(--v6-bg,#101820));
 --account-panel:var(--fb-panel,var(--v6-panel,#1d2530));
 --account-raised:var(--fb-raised,var(--account-panel));
 --account-edge:var(--fb-edge,var(--v6-border,#58616b));
 --account-ink:var(--fb-ink,var(--v6-text,#fff));
 --account-muted:var(--fb-dim,var(--v6-muted,#b8c3cd));
 --account-accent:var(--fb-accent,var(--accent,#66b3a5));
 --bg:var(--account-bg);--background:var(--account-bg);--panel:var(--account-panel);
 --input-bg:var(--account-raised);--border:var(--account-edge);--text:var(--account-ink);
 --muted:var(--account-muted);--accent:var(--account-accent);
 color:var(--account-ink);color-scheme:inherit;
}
#fn-admin-pages{background:var(--account-bg);padding:calc(env(safe-area-inset-top) + 12px) clamp(14px,3vw,28px) calc(env(safe-area-inset-bottom) + 18px)}
#fn-admin-pages .fn-admin-card{background:var(--account-panel);border-color:var(--account-edge)}
#fn-admin-pages button,#fn-admin-pages input,#fn-admin-pages select{background:var(--account-raised);border-color:var(--account-edge);color:var(--account-ink)}
#fn-admin-pages .fn-admin-tabs [aria-current="page"]{box-shadow:inset 0 -2px var(--account-accent);border-color:var(--account-accent)}
#fn-admin-pages .fn-admin-head{max-width:1180px;width:100%;margin:0 auto;border-color:var(--account-edge)}
#fn-admin-pages .fn-admin-head strong{font-size:clamp(1.1rem,2.1vw,1.55rem)}
#fn-admin-pages .fn-admin-content{padding-bottom:30px}
#fn-admin-pages .fn-admin-split{grid-template-columns:minmax(260px,340px) minmax(0,1fr)}
#fn-admin-pages .fn-admin-muted{color:var(--account-muted)}
#fn-admin-pages table{table-layout:auto}#fn-admin-pages th,#fn-admin-pages td{overflow-wrap:normal;word-break:normal;min-width:0}
#account-panel{background:var(--account-bg);position:fixed;inset:0;z-index:21000;display:block;overflow:auto;padding:calc(env(safe-area-inset-top) + 12px) clamp(14px,3vw,28px) calc(env(safe-area-inset-bottom) + 18px)}
#account-panel .account-shade{display:none}
#account-panel .account-dialog{background:transparent;border:0;box-shadow:none;overflow:visible;border-radius:0;max-height:none;width:min(100%,1180px);margin:0 auto;display:block;padding:0}
#account-panel .account-dialog>header{background:var(--account-bg);position:sticky;top:0;z-index:2;padding:8px 0 14px;border-color:var(--account-edge)}
#account-panel .account-dialog>header strong{font-size:clamp(1.15rem,2vw,1.6rem)}
#account-panel .account-body{background:transparent;overflow:visible;max-height:none;padding:18px 0;gap:15px;max-width:960px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#account-panel #account-error,#account-panel #account-profile{grid-column:1/-1}
#account-panel #account-profile,#account-panel .account-body details{background:var(--account-panel);border:1px solid var(--account-edge);border-radius:12px;padding:16px;min-width:0}
#account-panel .account-body details{margin:0}#account-panel .account-body details[open]{grid-column:auto}
#account-panel .account-body input,#account-panel .account-body select,#account-panel .account-body button,#account-panel .account-dialog>header button{background:var(--account-raised);border:1px solid var(--account-edge);color:var(--account-ink);border-radius:8px;min-height:40px;padding:8px 12px;font:inherit}
#account-panel .account-body summary{font-weight:600;cursor:pointer}
#account-panel #account-admin,#account-panel #account-audit{display:none!important}
#account-panel #account-projects:not([hidden]){grid-column:1/-1;background:var(--account-panel);border:1px solid var(--account-edge);border-radius:12px;padding:16px}
#account-panel :focus-visible,#fn-admin-pages :focus-visible{outline:2px solid var(--account-accent);outline-offset:2px}
@media(max-width:760px){#fn-admin-pages .fn-admin-split,#account-panel .account-body{grid-template-columns:minmax(0,1fr)}#account-panel #account-profile,#account-panel #account-error{grid-column:auto}#account-panel .account-dialog{max-height:none;padding:0;border-radius:0}#fn-admin-pages .fn-admin-card{padding:14px}#fn-admin-pages .fn-audit-wrap{overflow:visible}#fn-admin-pages .fn-audit-wrap table,#fn-admin-pages .fn-audit-wrap tbody{display:block;width:100%}#fn-admin-pages .fn-audit-wrap thead{display:none}#fn-admin-pages .fn-audit-wrap tr{display:block;margin:0 0 10px;padding:12px;background:var(--account-raised);border:1px solid var(--account-edge);border-radius:10px}#fn-admin-pages .fn-audit-wrap td{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding:7px 0;overflow-wrap:anywhere;border-bottom:1px solid var(--account-edge)}#fn-admin-pages .fn-audit-wrap td:last-child{border:0}#fn-admin-pages .fn-audit-wrap td::before{content:attr(data-label);color:var(--account-muted);font-weight:600}#fn-admin-pages .fn-admin-filters label{min-width:min(100%,200px)}}
@media(prefers-reduced-motion:reduce){#account-panel *,#fn-admin-pages *{transition:none!important;animation:none!important}}

/* Authenticator enrollment: QR first, manual key remains available as a fallback. */
#account-panel .mfa-enroll-grid{display:grid;grid-template-columns:minmax(180px,220px) minmax(0,1fr);gap:16px;align-items:center;margin:14px 0}
#account-panel .mfa-qr-card{display:grid;gap:8px;justify-items:center;text-align:center;color:var(--account-muted)}
#account-panel .mfa-qr-card img{display:block;width:min(100%,210px);aspect-ratio:1;object-fit:contain;background:#fff;border-radius:10px;padding:10px;box-sizing:border-box}
#account-panel .mfa-manual-key{min-width:0}
#account-panel .mfa-manual-key p{margin:0 0 8px;color:var(--account-muted)}
#account-panel .mfa-manual-key code{display:block;overflow-wrap:anywhere;word-break:break-word;background:var(--account-raised);border:1px solid var(--account-edge);border-radius:8px;padding:10px;font-size:.9rem}
@media(max-width:760px){#account-panel .mfa-enroll-grid{grid-template-columns:minmax(0,1fr)}#account-panel .mfa-qr-card img{width:min(210px,72vw)}}


/* Profile experience refinement: compact account header and intentional security cards. */
#account-panel .account-page-header{display:flex;align-items:center;justify-content:space-between;gap:16px}
#account-panel .account-page-header>div:first-child{display:grid;gap:2px}
#account-panel .account-page-header small{color:var(--account-muted);font-size:.8rem}
#account-panel .account-header-actions{display:flex;align-items:center;gap:8px}
#account-panel #account-header-logout{min-width:86px}
#account-panel .account-body{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:14px}
#account-panel .account-card,#account-panel #account-profile,#account-panel .account-body details{background:var(--account-panel);border:1px solid var(--account-edge);border-radius:12px;padding:14px;min-width:0}
#account-panel #account-profile{grid-column:1/-1}
#account-panel .account-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
#account-panel .account-card-head h3{margin:0 0 3px;font-size:1rem}
#account-panel .account-card-head p{margin:0;font-size:.84rem}
#account-panel .account-profile-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end;gap:10px}
#account-panel .account-profile-form button{min-width:130px}
#account-panel .account-role-pill,#account-panel .account-status-pill{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--account-edge);border-radius:999px;padding:3px 8px;font-size:.75rem;line-height:1.25;white-space:nowrap;background:var(--account-raised);color:var(--account-muted)}
#account-panel .account-status-pill.is-good{border-color:color-mix(in srgb,var(--account-accent) 65%,var(--account-edge));color:var(--account-ink)}
#account-panel .account-status-pill.is-warn{border-color:#c79853;color:var(--account-ink)}
#account-panel .account-password-guidance{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--account-muted);font-size:.78rem}
#account-panel .account-inline-status{margin:0 0 10px;color:var(--account-muted);font-size:.85rem}
#account-panel .account-expand-card{padding:0;overflow:hidden}
#account-panel .account-expand-card>summary{padding:14px;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px}
#account-panel .account-expand-card>summary::-webkit-details-marker{display:none}
#account-panel .account-expand-card>summary::after{content:'›';font-size:1.25rem;transform:rotate(90deg);transition:transform .16s ease;color:var(--account-muted)}
#account-panel .account-expand-card[open]>summary::after{transform:rotate(-90deg)}
#account-panel .account-expand-card>summary span{display:grid;gap:3px}
#account-panel .account-expand-card>summary small{font-weight:400;color:var(--account-muted);font-size:.78rem}
#account-panel .account-expand-content{border-top:1px solid var(--account-edge);padding:0 14px 14px}
#account-panel .account-security-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--account-edge)}
#account-panel .account-security-row:last-child{border-bottom:0}
#account-panel .account-security-row>div{min-width:0}
#account-panel .account-security-row small{display:block;margin-top:3px;color:var(--account-muted);overflow-wrap:anywhere;font-size:.78rem}
#account-panel .account-device-row{padding:12px 0}
#account-panel .account-device-row b{display:block;margin-bottom:3px}
#account-panel .account-session-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;padding-top:12px}
#account-panel .account-danger-action{opacity:.88}
#account-panel #account-security-activity{grid-column:1/-1}
@media(max-width:850px){#account-panel .account-profile-form{grid-template-columns:1fr 1fr}#account-panel .account-profile-form button{grid-column:1/-1}}
@media(max-width:760px){#account-panel .account-body{grid-template-columns:minmax(0,1fr)}#account-panel #account-profile,#account-panel #account-security-activity{grid-column:auto}#account-panel .account-profile-form{grid-template-columns:1fr}#account-panel .account-profile-form button{grid-column:auto}#account-panel .account-page-header{align-items:flex-start}#account-panel .account-page-header small{display:none}#account-panel .account-header-actions [data-close]{display:none}#account-panel .account-password-guidance{align-items:flex-start;flex-direction:column}#account-panel .account-session-actions button{width:100%}}