@layer amfr-layout {
body.amfr-account-view {
    color-scheme: dark;
    font-family: var(--amfr-font);
    margin: 0;
    background: var(--amfr-background);
    color: var(--amfr-text);
}
.amfr-account-view a { color: var(--amfr-accent-bright); }
.amfr-account-view button, .amfr-account-view input, .amfr-account-view select, .amfr-account-view textarea { font: inherit; }
.amfr-account-view button, .amfr-account-view input, .amfr-account-view select, .amfr-account-view textarea {
    box-sizing: border-box;
    
    border-radius: var(--amfr-radius-control);
    padding: var(--amfr-space-3);
}
.amfr-account-view button {   cursor: pointer; }
.amfr-account-view input, .amfr-account-view select, .amfr-account-view textarea { width: 100%; background: var(--amfr-surface); color: inherit; border: 1px solid var(--amfr-line); }
.amfr-account-view input[type="radio"], .amfr-account-view input[type="checkbox"] { width: auto; }
.amfr-account-view * { box-sizing: border-box; }
.amfr-account-view h1, .amfr-account-view h2, .amfr-account-view h3 { color: var(--amfr-accent-bright); overflow-wrap: anywhere; }
.amfr-account-view .account-actions a, .amfr-account-view .listener-dashboard__nav a { display: block; min-height: var(--amfr-control-size); padding: .65rem; border-radius: var(--amfr-radius-control); }
.amfr-account-view .creator-actions a { display: flex; align-items: center; min-height: var(--amfr-control-size); padding: .65rem; border: 1px solid var(--amfr-button-border); border-radius: var(--amfr-radius-control); line-height: 1.45; overflow-wrap: anywhere; text-decoration: none; }
.amfr-account-view .listener-dashboard__nav, .amfr-account-view .account-links { display: grid; gap: .75rem; }
.amfr-account-view .creator-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .75rem; min-width: 0; max-width: 100%; margin: 1rem 0; }
.amfr-account-view .creator-declaration-link { display: block; min-height: var(--amfr-control-size); padding: .65rem; border: 1px solid var(--amfr-button-border); border-radius: var(--amfr-radius-control); line-height: 1.45; overflow-wrap: anywhere; text-decoration: none; }
.amfr-account-view .creator-declaration-privacy { margin: 1rem 0; padding: .75rem; border-left: 3px solid var(--amfr-accent); background: var(--amfr-surface); }
.amfr-account-view .creator-declaration-templates { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; padding-left: 1.25rem; }
.amfr-account-view .creator-declaration-hint, .amfr-account-view .creator-declaration-reason { color: var(--amfr-muted); overflow-wrap: anywhere; }
.amfr-account-view #creator-declaration-panel { min-width: 0; margin: 1rem 0; padding: .75rem; border: 1px solid var(--amfr-line-soft); border-radius: var(--amfr-radius-control); }
.amfr-account-view #creator-declaration-panel li { margin: .5rem 0; overflow-wrap: anywhere; }
.amfr-account-view .creator-overview { display: grid; grid-template-columns: minmax(0, 10rem) minmax(0, 1fr); align-items: start; gap: 1rem; min-width: 0; max-width: 100%; }
.amfr-account-view .creator-overview > img { display: block; width: 100%; max-width: 10rem; height: auto; object-fit: contain; }
.amfr-account-view .creator-overview > div { min-width: 0; }
.amfr-account-view .creator-overview :is(dt, dd) { min-width: 0; overflow-wrap: anywhere; }
.amfr-account-view .application-card { padding: .75rem 0; border-bottom: 1px solid var(--amfr-line-soft); overflow-wrap: anywhere; }
.amfr-account-view section[id] { scroll-margin-top: 1rem; }
.amfr-account-view .profile-avatar { max-width: 100%; height: auto; }
.amfr-account-view label { display: grid; gap: .5rem; }
.amfr-account-view button:disabled { cursor: not-allowed; opacity: .65; }
.amfr-account-view [role="alert"] { color: var(--amfr-error); }
.amfr-account-view .accounts-shell, .amfr-account-view .account-shell { max-width: 48rem; margin: 0 auto; padding: 1rem; }
.amfr-account-view .accounts-header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.amfr-account-view .brand { font-size: 1.2rem; font-weight: 700; text-decoration: none; }
.amfr-account-view .accounts-card, .amfr-account-view .account-panel { background: var(--amfr-surface); border: 1px solid var(--amfr-line); border-radius: var(--amfr-radius-panel); padding: var(--amfr-space-4); }
.amfr-account-view .eyebrow { color: var(--amfr-accent); font-size: .75rem; letter-spacing: .12em; }
.amfr-account-view form, .amfr-account-view .account-actions { display: grid; gap: .75rem; }
.amfr-account-view form { margin-top: 1rem; }
.amfr-account-view dl { display: grid; grid-template-columns: 1fr 2fr; gap: .5rem 1rem; }
.amfr-account-view dt { color: var(--amfr-muted); }
.amfr-account-view dd { margin: 0; overflow-wrap: anywhere; }
.amfr-account-view .account-actions { margin: 1rem 0; }
.amfr-account-view #portal-message:empty { display: none; }
.amfr-account-view #portal-message[data-error="true"] { color: var(--amfr-error); }
.amfr-account-view [hidden] { display: none !important; }
.amfr-account-panel {
    position: fixed;
    inset: 7dvh auto auto 50%;
    transform: translateX(-50%);
    z-index: 1100;
    width: min(1100px, calc(100vw - 32px));
    height: min(820px, 78dvh);
    max-width: none;
    max-height: 82dvh;
    padding: 0;
    border: 1px solid var(--amfr-accent);
    border-radius: var(--amfr-radius-panel);
    background: var(--amfr-background);
    color: var(--amfr-text);
    box-shadow: var(--amfr-shadow);
    overflow: hidden;
    resize: both;
    min-width: min(340px, calc(100vw - 16px));
    min-height: 260px;
}
.amfr-account-panel.is-maximized { inset: 8px auto auto 50%; width: calc(100vw - 16px); height: calc(100dvh - 112px); max-height: none; resize: none; }
.amfr-account-panel.is-minimized { display: none !important; }
.amfr-account-identity { flex: 1; min-width: 0; }
.amfr-account-bio { margin: .3rem 0 0; font-size: .8rem; max-height: 2.6em; overflow: hidden; }
.amfr-account-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.amfr-account-dock { position: fixed; left: 12px; bottom: 94px; z-index: 1100; max-width: calc(100vw - 24px); padding: .7rem 1rem; background: var(--amfr-surface); color: var(--amfr-text); border: 1px solid var(--amfr-accent); border-radius: var(--amfr-radius-control); cursor: pointer; }
.amfr-account-dock[hidden] { display: none; }
@media (max-width: 599px) {
    .amfr-account-panel { inset: 8px auto auto 50%; width: calc(100vw - 16px); height: calc(100dvh - 116px); max-height: none; resize: none; }
    .amfr-account-panel-header { gap: 4px !important; padding: 6px !important; flex-wrap: wrap; }
    .amfr-account-avatar { width: 32px; height: 32px; }
    .amfr-account-identity { flex-basis: calc(100% - 42px); }
    .amfr-account-panel-header button { min-width: 40px; min-height: 40px; }
}
.amfr-account-panel::backdrop { background: #0006; }
.amfr-account-panel[open] { display: flex; flex-direction: column; }
.amfr-account-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--amfr-line); }
.amfr-account-panel-header h2 { margin: 0; font-size: 1rem; }
.amfr-account-panel-header button { flex-shrink: 0; min-width: var(--amfr-control-size); min-height: var(--amfr-control-size); padding: 0;    border-radius: var(--amfr-radius-control); font-size: 1.5rem; cursor: pointer; }
.amfr-account-panel iframe { flex: 1; width: 100%; min-height: 0; border: 0; background: var(--amfr-background); }

}

/* Unlayered rules also cover legacy account pages embedded by AccountView. */
body.amfr-account-view,
.amfr-account-panel,
.amfr-account-panel iframe {
    background: var(--amfr-background);
    color: var(--amfr-text);
}
.amfr-account-view :is(.accounts-card, .account-panel, .registration-choice),
.amfr-account-panel-header,
.amfr-account-dock {
    background: var(--amfr-background);
    border-color: var(--amfr-line-soft);
}
.amfr-account-panel { border-color: var(--amfr-line-soft); }
.amfr-account-panel-header h2,
.amfr-account-view :is(.brand, h1, h2, h3) { color: var(--amfr-accent-bright); }
.amfr-account-view :is(label, legend, .eyebrow, .registration-choice__eyebrow),
.amfr-account-bio { color: var(--amfr-accent); }
.amfr-account-view :is(input, select, textarea) {
    background: var(--amfr-background); color: var(--amfr-text); border-color: var(--amfr-line-soft);
}
.amfr-account-view [aria-invalid="true"] { border-color: var(--amfr-error); }
.amfr-account-view :is(button, .button-primary, .account-actions a, .listener-dashboard__nav a, .creator-actions a, .creator-declaration-link),
.amfr-account-panel-header button,
.amfr-account-dock {
    background: var(--amfr-button-background); color: var(--amfr-button-text);
    border-color: var(--amfr-button-border); box-shadow: none;
}
.amfr-account-view :is(button, .button-primary, .account-actions a, .listener-dashboard__nav a, .creator-actions a, .creator-declaration-link):is(
    [aria-pressed="true"], [aria-selected="true"], [aria-expanded="true"], .is-active),
.amfr-account-panel-header button[aria-pressed="true"] {
    background: var(--amfr-button-background-active); color: var(--amfr-button-text-active);
    border-color: var(--amfr-button-border-hover); box-shadow: inset 0 -2px 0 var(--amfr-accent);
}
.amfr-account-view :is(button, input, select, textarea, a):focus-visible,
.amfr-account-panel-header button:focus-visible {
    outline: 3px solid var(--amfr-focus); outline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) {
    .amfr-account-view :is(button, .button-primary, .account-actions a, .listener-dashboard__nav a, .creator-actions a, .creator-declaration-link):not(:disabled):hover,
    .amfr-account-panel-header button:not(:disabled):hover,
    .amfr-account-dock:hover {
        background: var(--amfr-button-background-hover); color: var(--amfr-button-text-active);
        border-color: var(--amfr-button-border-hover);
    }
}
@media (max-width: 40rem) {
    .amfr-account-view .creator-overview { grid-template-columns: minmax(0, 1fr); }
}
