/* ---------- Settings module (#627, #780): the styles moved out of the Inbox page ----------
     These rules moved verbatim from `src/inbox/app.html` into this file (#780). They are the
     Settings module's own mount rules: the context column and stage show/hide under
     `.shell2.mod-settings`, the kept context-column track, the two canvas rules the shell holds
     off its live Mail panes, and the stacked-field reset. The Settings page frame and every
     `.st-*` row stay in the linked canvas sheets (`helm.css`, `src/inbox/canvas/settings.css`),
     which are untouched. No rule here has a selector that starts with the document-root
     pseudo-class, so none had to stay behind for the inline token block (#778 lesson). The module
     stylesheet loads before the inline <style>, so for an equal-specificity rule the inline shell
     rule wins the source-order tie; the one rule here that must still win over the shell (the kept
     context-column track) raises its specificity with the stage id rather than rely on source order
     (see the #stage override below, #780 review round 1). */
  /* ===== Settings module (#572). Settings is a module in the shell stage (adr/0063 decision 6),
     ported to the design canvas one to one. Its context column rides the shared stage
     context-column track (#settingsCtx, the way Mentions rides it), and its pages render in their own
     stage (#settingsStage) beside it, so the dock and the Teammate dock stay visible. It has no dock
     tile; the account menu and ⌘, open it. The page frame (.page, .mh, .page-b, .page-in, .sec,
     .box, .cs) and every .st-* row come straight from the linked canvas sheets (helm.css,
     settings.css); only the mount, the two canvas rules the shell holds off its live Mail panes, and
     the stacked-field reset live here. ===== */
  #settingsCtx{display:none}
  #settingsStage{display:none;position:relative;overflow:hidden;background:var(--canvas)}
  /* The Mail rail (shown by its place in the context-column track) and the Mail list pane are hidden
     here by class while Settings is mounted, and reappear the moment it unmounts. Every other module's
     context column and stage pane is shown by its own `hidden` flag, which setModulePanes clears on
     entering Settings and restores on leaving (#572 review round 4); so this mount names none of them,
     and a context column or stage a later module port adds is covered there, not here. */
  .shell2.mod-settings #rail{display:none}
  .shell2.mod-settings #settingsCtx{display:flex}
  .shell2.mod-settings #listPane{display:none}
  .shell2.mod-settings #settingsStage{display:flex;flex-direction:column;min-width:0;min-height:0}
  /* Settings always shows its context column, so the stage keeps the context-column track open even
     when the module left on the stage behind it had none (for example Processes), and even when the
     shell still carries .no-ctx (after a no-column module such as Teammate) or .rail-collapsed (a
     persisted Mail rail). Those two fold rules in the inline shell stylesheet set --t-rail:0px with
     three classes each. This stylesheet loads before the inline <style>, so an equal-specificity
     rule here would lose the source-order tie to them and the pages column would fold to zero width.
     So the stage is targeted by its id (#stage) — this override then beats both fold rules on
     specificity, whatever the load order. */
  .shell2.mod-settings #stage{--t-rail:var(--rail-w)}
  /* Settings restores two canvas rules the shell holds off its other panes (#568): a page-level
     banner carries the canvas card shadow, and the Mailboxes "none" empty state is centred in the
     stage rather than left in flow. Both are scoped to Settings, so the live Mail panes keep today's
     held look. */
  #settingsStage .ban{box-shadow:var(--shadow-card)}
  #settingsStage .empty{position:absolute;inset:0;margin:auto;height:max-content;max-width:400px;padding:24px}
  /* Two-up field rows (profile, signature, invite, save the current filter) align at the top on the
     canvas; the app's global stacked-field offset would push the second cell down, so it is reset
     inside Settings, where the flex and grid gaps already space the fields. */
  #settingsStage .f + .f{margin-top:0}
  @media (max-width:820px){
    /* At narrow width the pages column folds off-canvas and overlays the stage, exactly like the
       Mail rail and the To-dos column (#572): the base `.ctx` rule above makes #settingsCtx a fixed
       overlay that starts translated off-screen, and "Toggle sidebar" in the Settings header slides
       it in through the one overlay `.show` state. The track collapses to zero so the stage takes the
       full width; the column is not removed (display:none would make it unreachable, the parked bug),
       so the toggle can still open it. */
    .shell2.mod-settings .stage{--t-rail:0px}
  }
  /* The in-page confirm for a mailbox disconnect (#1487). It is the shared banner card, set under the
     mailbox row with no page inset. The id raises the specificity over the shell `.ban` rule, which
     wins a source-order tie. At phone width the two buttons take their own row, so neither is cut. */
  #settingsStage .ban.st-mbx-confirm{margin:0}
  #settingsStage .ban.st-mbx-confirm[hidden]{display:none}
  #settingsStage .ban.st-mbx-confirm .st-errbox{margin-top:var(--sp-2)}
  #settingsStage .ban.st-mbx-confirm .st-errbox[hidden]{display:none}
  @media (max-width:720px){
    #settingsStage .ban.st-mbx-confirm{grid-template-columns:32px minmax(0,1fr)}
    #settingsStage .ban.st-mbx-confirm .ban-acts{grid-column:1 / -1;justify-content:flex-end;flex-wrap:wrap}
  }