/* Account settings page only (pages/account.html, 19 Sep 2026). Kept out of components.css like
   engagement.css and roster.css. Everything scopes to main.acct. Cards, list rows, notices, dialogs,
   pills, the check label and the profile head come from components.css.

   STATES BY QUERY (app.js block 34): <main> carries data-state in its markup, so the default state
   renders with no script; the script only overwrites it from the query string. Each view block lists
   the states it belongs to in data-state-view (space separated), and the rules below show the ones
   that match. Sean renders one state per route and deletes every data-state-view block but the live one. */

main.acct [data-state-view] { display: none; }
main.acct[data-state="idle"]         [data-state-view~="idle"],
main.acct[data-state="email-code"]   [data-state-view~="email-code"],
main.acct[data-state="email-done"]   [data-state-view~="email-done"],
main.acct[data-state="request-sent"] [data-state-view~="request-sent"],
main.acct[data-state="blocked"]      [data-state-view~="blocked"],
main.acct[data-state="closed"]       [data-state-view~="closed"] { display: block; }
/* Inline holders (a pill, a button) keep an inline display when shown. */
main.acct[data-state="idle"]         span[data-state-view~="idle"],         main.acct[data-state="idle"]         button[data-state-view~="idle"],
main.acct[data-state="email-code"]   span[data-state-view~="email-code"],   main.acct[data-state="email-code"]   button[data-state-view~="email-code"],
main.acct[data-state="email-done"]   span[data-state-view~="email-done"],   main.acct[data-state="email-done"]   button[data-state-view~="email-done"],
main.acct[data-state="request-sent"] span[data-state-view~="request-sent"], main.acct[data-state="request-sent"] button[data-state-view~="request-sent"],
main.acct[data-state="blocked"]      span[data-state-view~="blocked"],      main.acct[data-state="blocked"]      button[data-state-view~="blocked"] { display: inline-flex; }
/* A view block that is also folded (the Change form before Change is pressed) stays folded. */
main.acct[data-state] [data-state-view][hidden] { display: none; }
