/* StudioMode fluid desktop layout — owner request 2026-11-03 (web-wide-responsive).
 *
 * A page opts in on its <html> element:
 *   data-sm-fluid           the page's outer containers span the window
 *   data-sm-fluid="chrome"  only the nav / header / footer span it; the page's
 *                           column keeps its width (prose, forms, single-task
 *                           flows — see scripts/apply-fluid.py for each reason)
 *
 * The site's injected bottom tab bar (#sm-web-nav, web-nav.js) is never touched.
 * Only a page's OWN outer containers (direct children of <body>, and a nav's
 * direct inner wrapper) are lifted, and only on desktop widths. Prose, forms,
 * images and media controls inside keep their own max-widths. Not a wildcard
 * reset: nothing below the outer containers is touched.
 */
:root { --sm-gutter: clamp(16px, 2.2vw, 32px); }
@media (min-width: 1000px) {
  html[data-sm-fluid] body > nav:not(#sm-web-nav),
  html[data-sm-fluid] body > header,
  html[data-sm-fluid] body > footer,
  html[data-sm-fluid] body > .topnav,
  html[data-sm-fluid] body > nav:not(#sm-web-nav) > .nav-inner,
  html[data-sm-fluid] body > nav:not(#sm-web-nav) > .container,
  html[data-sm-fluid] body > header > nav,
  html[data-sm-fluid] body > header > .container,
  html[data-sm-fluid] body > footer > .container {
    max-width: none !important;
  }
  html[data-sm-fluid] body > nav:not(#sm-web-nav),
  html[data-sm-fluid] body > header,
  html[data-sm-fluid] body > footer,
  html[data-sm-fluid] body > .topnav {
    padding-left: var(--sm-gutter) !important;
    padding-right: var(--sm-gutter) !important;
  }
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > main,
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > .wrap,
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > .layout,
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > .container,
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > .page,
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > .shell,
  html[data-sm-fluid]:not([data-sm-fluid="chrome"]) body > .app {
    max-width: none !important;
    padding-left: var(--sm-gutter) !important;
    padding-right: var(--sm-gutter) !important;
  }
}