/* The redesign shell (html[data-shell="r2"]): a printed manifest. Paper, ink rules, block type; nothing rounded,
   nothing boxed, nothing shadowed. Loaded after app.css and look-v2.css; a page's own layer is
   css/r2/<page stylesheet>.css. Colours: r2-tokens.css. */

/* ------------------------------------------------------------ base */
html[data-shell="r2"] { scroll-padding-top: calc(var(--topbar-height) + 12px); }
html[data-shell="r2"] body { font-feature-settings: "tnum" 1; }
html[data-shell="r2"] a:hover { text-decoration-thickness: 2px; text-underline-offset: 3px; }
html[data-shell="r2"] ::selection { background: var(--color-primary); color: var(--rail-accent-ink); }
html[data-shell="r2"] :focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }

/* ------------------------------------------------------------ masthead: the band */
html[data-shell="r2"] .topbar {
  --topbar-height: var(--mast-band);
  gap: 0; padding: 0 var(--gutter) 0 0; align-items: stretch;
  background-image: none;
}
html[data-shell="r2"] .topbar :focus-visible { outline-color: var(--color-topbar-text); outline-offset: -4px; }
.mast-brand {
  display: flex; align-items: center; flex: none; padding: 0 20px 0 var(--gutter);
  color: var(--color-topbar-text); font-size: 21px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; line-height: 1;
}
.mast-brand:hover { color: var(--color-topbar-text); text-decoration: none; }
.mast-planner {
  display: flex; align-items: center; gap: 10px; flex: none; padding: 0 18px;
  background: var(--rail-bg); color: var(--rail-accent);
  font-size: var(--text-base); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; white-space: nowrap;
}
.mast-planner:hover, .mast-planner.is-active { background: var(--rail-accent); color: var(--rail-accent-ink); text-decoration: none; }
.mast-planner .icon { transition: transform var(--dur-2) var(--ease-out); }
.mast-planner:hover .icon { transform: translateX(4px); }
.mast-sections { display: flex; align-items: stretch; flex: 0 1 auto; min-width: 0; margin: 0 auto 0 8px; }
.mast-sections > a {
  display: flex; align-items: center; padding: 0 13px;
  color: var(--color-nav-text); font-size: var(--text-sm); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; white-space: nowrap;
}
.mast-sections > a:hover, .mast-sections > a.is-peek { background: var(--color-nav-hover-bg); color: var(--color-topbar-text); text-decoration: none; }
.mast-sections > a.is-active { background: var(--color-nav-active-bg); color: var(--color-nav-active-text); }

html[data-shell="r2"] .topbar > button.header-search { flex: 0 1 200px; min-width: 44px; margin: 0; padding: 0 0 0 12px; height: auto; align-self: center; }
html[data-shell="r2"] .header-search-box { width: 100%; height: 36px; border-radius: 0; border: 0; }
html[data-shell="r2"] .header-search-label { text-transform: uppercase; letter-spacing: var(--tracking-label); font-size: var(--text-xs); font-weight: 700; }
html[data-shell="r2"] .topbar > .scan-switch { margin: 0 0 0 8px; align-self: center; }
html[data-shell="r2"] .topbar .scan-btn {
  height: 36px; border-radius: 0; border: 2px solid var(--color-topbar-text); background: transparent; color: var(--color-topbar-text);
  text-transform: uppercase; letter-spacing: var(--tracking-label); font-size: var(--text-xs); font-weight: 700;
}
html[data-shell="r2"] .topbar .scan-btn:hover, html[data-shell="r2"] .topbar .scan-btn[aria-expanded="true"] { background: var(--color-topbar-text); color: var(--color-topbar-bg); }
html[data-shell="r2"] .theme-switch { margin: 0 0 0 4px; }
html[data-shell="r2"] .user-menu { margin-left: 4px; align-self: stretch; }
html[data-shell="r2"] .topbar .user-store, html[data-shell="r2"] .topbar .user-toggle > .user-name { display: none; }
html[data-shell="r2"] .avatar { border-radius: 0; font-weight: 700; }
html[data-shell="r2"] .user-menu > .dropdown-menu, html[data-shell="r2"] .scan-pop { top: var(--mast-band); }

/* ------------------------------------------------------------ masthead: the strip of the section's pages */
.mast-sub {
  position: sticky; top: var(--mast-band); z-index: 190;
  height: var(--mast-strip); padding: 0 var(--gutter);
  background: var(--color-page-bg); border-bottom: var(--rule) solid var(--color-text);
}
.mast-pages { display: none; align-items: stretch; gap: 0; height: 100%; overflow-x: auto; scrollbar-width: none; }
.mast-pages::-webkit-scrollbar { display: none; }
.mast-pages.is-shown { display: flex; }
.mast-pages-label {
  display: flex; align-items: center; flex: none; margin-right: 14px; padding: 0 10px; align-self: center; height: 22px;
  background: var(--color-text); color: var(--color-page-bg);
  font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase;
}
.mast-pages > a {
  display: flex; align-items: center; flex: none; padding: 0 12px;
  color: var(--color-text); font-size: var(--text-sm); font-weight: 600; white-space: nowrap;
  border-bottom: var(--rule) solid transparent; margin-bottom: calc(-1 * var(--rule));
}
.mast-pages > a:hover { background: var(--color-text); color: var(--color-page-bg); text-decoration: none; }
.mast-pages > a.is-active { background: var(--color-primary); color: var(--rail-accent-ink); font-weight: 700; }
.mast-sub.is-empty:not(.is-peeking) { height: 0; border-bottom-width: var(--rule); overflow: hidden; }

/* ------------------------------------------------------------ the index: the whole menu as one sheet on narrow screens */
.rail { display: none; }
.rail-toggle { display: none; }
.rail-scrim { display: none; }

/* ------------------------------------------------------------ page frame: content on the paper, no sheet */
html[data-shell="r2"] .page { background: transparent; padding: 28px var(--gutter) 56px; }
html[data-shell="r2"] .site-footer { background: transparent; padding: 12px var(--gutter) 18px; border-top: 1px solid var(--color-border); text-transform: uppercase; letter-spacing: var(--tracking-label); font-weight: 600; }
html[data-shell="r2"] .app-banner { background: var(--color-primary); color: var(--rail-accent-ink); border: 0; font-weight: 600; padding-left: var(--gutter); padding-right: var(--gutter); }
html[data-shell="r2"] .crumbs ol { margin-bottom: 10px; font-size: var(--text-xs); letter-spacing: var(--tracking-label); text-transform: uppercase; font-weight: 700; }
html[data-shell="r2"] .crumbs a { color: var(--color-text-muted); }
html[data-shell="r2"] .crumbs li + li::before { content: "/"; color: var(--color-text); margin: 0 8px; }
html[data-shell="r2"] .page-header { margin-bottom: 24px; padding-bottom: 14px; border-bottom: var(--rule) solid var(--color-text); align-items: flex-end; }
html[data-shell="r2"] .page-title {
  font-size: clamp(30px, 3.4vw, 48px); line-height: 0.98; font-weight: 700; letter-spacing: -0.015em; text-transform: uppercase; text-wrap: balance;
}
html[data-shell="r2"] .page-subtitle { margin-top: 6px; }
html[data-shell="r2"] .count-pill {
  border: 0; border-radius: 0; background: var(--color-text); color: var(--color-page-bg);
  font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; padding: 4px 9px;
}
html[data-shell="r2"] .page-content > * + * { margin-top: 28px; }

/* ------------------------------------------------------------ the case label: a section's heading on its rule */
.r2-label,
html[data-shell="r2"] .section-title,
html[data-shell="r2"] .panel-header > h2,
html[data-shell="r2"] .page-content > h2 {
  display: flex; align-items: stretch; flex-wrap: nowrap; gap: 0; margin: 0 0 12px; padding: 0 0 0 10px;
  background: var(--color-text); color: var(--color-page-bg);
  font-size: var(--text-sm); font-weight: 700; line-height: 26px; letter-spacing: var(--tracking-label); text-transform: uppercase;
}
.r2-label::after,
html[data-shell="r2"] .panel-header > h2::after,
html[data-shell="r2"] .section-title::after,
html[data-shell="r2"] .page-content > h2::after {
  content: ""; flex: 1 1 0; min-width: 12px; margin-left: 10px; background: var(--color-page-bg); border-top: var(--rule) solid var(--color-text);
}
.r2-label > *, html[data-shell="r2"] .section-title > *, html[data-shell="r2"] .page-content > h2 > * { color: inherit; }

html[data-shell="r2"] .panel-header { flex-wrap: nowrap; align-items: flex-start; gap: 0 10px; }
html[data-shell="r2"] .panel-header > h2 { flex: 1 1 auto; margin: 0; }

/* ------------------------------------------------------------ inspector: a ruled column, not cards */
@media screen and (min-width: 981px) {
  html[data-shell="r2"] .page.has-inspector { display: block; }
  html[data-shell="r2"] .page-body.with-sidebar { grid-template-columns: minmax(0, 1fr) 330px; gap: 0; margin: 0; align-items: start; }
  html[data-shell="r2"] .page-body.with-sidebar > .page-content { padding: 0 32px 0 0; display: block; }
  html[data-shell="r2"] .page-sidebar {
    padding: 0 0 0 24px; background: transparent; border: 0; border-left: var(--rule) solid var(--color-text);
    position: sticky; top: calc(var(--topbar-height) + 16px); max-height: calc(100vh - var(--topbar-height) - 32px); overflow-y: auto; scrollbar-width: thin;
  }
  html[data-shell="r2"] .page-sidebar > .sidebar-panel + .sidebar-panel { margin-top: 20px; }
  html[data-shell="r2"] .sidebar-panel > :not(h3):not(.action-list):not(.stat-tiles) { padding-left: 0; }

  /* Actions: out of the column, a menu under the header's Actions button (r2.js places it). */
  html[data-shell="r2"] .page-sidebar > #sidebar-actions { display: none; }
  html[data-shell="r2"] .page-sidebar > #sidebar-actions.is-menu-open {
    display: block; position: fixed; z-index: 220; width: 300px; max-height: min(70vh, 640px); overflow-y: auto;
    margin: 0; padding: 0; background: var(--color-menu-bg); border: 2px solid var(--color-text);
  }
  html[data-shell="r2"] #sidebar-actions.is-menu-open > h3 { display: none; }
  html[data-shell="r2"] #sidebar-actions + .sidebar-panel { margin-top: 0; }
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list a,
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list button { padding: 9px 14px 9px 42px; font-weight: 600; }
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list :is(a, button) > :is(.fa, .icon),
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list :is(a, button)::before { left: 14px; top: 11px; }
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list :is(a, button):hover > :is(.fa, .icon) { color: inherit; }
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list .divider { margin: 0; border-top-color: var(--color-text); }
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list a:hover,
  html[data-shell="r2"] #sidebar-actions.is-menu-open .action-list button:hover { background: var(--color-text); color: var(--color-page-bg); text-decoration: none; }
}
@media screen and (max-width: 980px) {
  html[data-shell="r2"] .actions-toggle { display: none; }
}
html[data-shell="r2"] .sidebar-panel > h3 {
  border: 0; border-top: var(--rule) solid var(--color-text); padding: 8px 0 6px; margin: 0 0 6px;
  font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--color-text);
}

/* ------------------------------------------------------------ tables: the part that stays simple */
html[data-shell="r2"] table th {
  font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-th); text-transform: uppercase; color: var(--color-th-text);
}
html[data-shell="r2"] table thead th { border-bottom: var(--rule) solid var(--color-th-border); }

/* ------------------------------------------------------------ controls: square blocks */
html[data-shell="r2"] .btn {
  border-radius: 0; border-width: 2px; font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase;
  transition: none;
}
html[data-shell="r2"] .btn:not(.btn-primary):not(.btn-create):not(.btn-danger):not(.btn-warning):not(.btn-link):not(:disabled):hover {
  background: var(--color-text); color: var(--color-page-bg); border-color: var(--color-text); text-decoration: none;
}
html[data-shell="r2"] .btn-create:not(:disabled):hover, html[data-shell="r2"] .btn-primary:not(:disabled):hover { text-decoration: none; }
html[data-shell="r2"] .btn-link { text-transform: none; letter-spacing: 0; font-size: inherit; font-weight: 600; }
html[data-shell="r2"] input[type="text"], html[data-shell="r2"] input[type="search"], html[data-shell="r2"] input[type="email"],
html[data-shell="r2"] input[type="password"], html[data-shell="r2"] input[type="number"], html[data-shell="r2"] input[type="date"],
html[data-shell="r2"] input[type="time"], html[data-shell="r2"] input[type="datetime-local"], html[data-shell="r2"] input[type="tel"],
html[data-shell="r2"] input[type="url"], html[data-shell="r2"] select, html[data-shell="r2"] textarea { border-radius: 0; box-shadow: none; }
html[data-shell="r2"] .dropdown-menu { border-radius: 0; border: 2px solid var(--color-text); box-shadow: none; }
html[data-shell="r2"] .actions-toggle { gap: 6px; }

/* ============================================================ shared blocks (every page uses these, never its own copy)

   .r2-label     a section heading: the case label on its 3px rule (h2.section-title gets it without the class)
   .r2-toolbar   one row of controls above a table: search, filters, then actions pushed right
                 <div class="r2-toolbar"> ... <div class="r2-toolbar-end"> ... </div></div>
   .r2-strip     a row of figures: <dl class="r2-strip"><div class="r2-stat [is-accent|is-good|is-bad]"><dt>Label</dt><dd>$1,200.00</dd></div>…</dl>
   .r2-tabs      section tabs: <nav class="r2-tabs" aria-label="…"><a href="#x" aria-current="true">Items <span class="r2-tab-count">18</span></a>…</nav>
   .r2-card      a ruled section (not a box): <section class="r2-card"><header class="r2-card-head"><h2>Title</h2> actions…</header> body </section>
   .r2-quick     poster blocks: <nav class="r2-quick"><a class="r2-quick-item [is-accent]" href><svg icon><strong>Label</strong><span>Hint</span></a>…</nav>
   .r2-steps     where a record is in its life: <ol class="r2-steps"><li class="is-done">Draft</li><li class="is-current" aria-current="step">Quotation</li><li>Order</li></ol>
   .r2-kv        label and value pairs in columns: <dl class="r2-kv"><div><dt>Owner</dt><dd>Zoe</dd></div>…</dl>
   ============================================================ */
.r2-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
.r2-toolbar-end { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: auto; }
.r2-toolbar input[type="search"], .r2-toolbar input[type="text"] { min-width: 0; }

.r2-strip { display: flex; flex-wrap: wrap; margin: 0; border-top: var(--rule) solid var(--color-text); border-bottom: 1px solid var(--color-text); overflow: hidden; }
.r2-stat { flex: 1 0 auto; min-width: 110px; padding: 10px 18px 12px 0; margin: 0 18px -1px 0; border-right: 1px solid var(--color-text); border-bottom: 1px solid var(--color-text); }
.r2-stat:last-child { border-right: 0; margin-right: 0; }
.r2-stat > dt { font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.r2-stat > dd { margin: 6px 0 0; font-size: clamp(20px, 1.9vw, 30px); font-weight: 700; line-height: 1; letter-spacing: -0.01em; color: var(--color-text); white-space: nowrap; }
.r2-stat > dd a { color: inherit; }
.r2-stat > dd small { display: block; margin-top: 6px; font-size: var(--text-xs); font-weight: 600; letter-spacing: 0; color: var(--color-text-muted); }
.r2-stat.is-accent > dd { display: inline-block; max-width: 100%; padding: 2px 8px 3px; margin-left: -8px; background: var(--color-primary); color: var(--rail-accent-ink); }
.r2-stat.is-good > dd { color: var(--color-success-ink); }
.r2-stat.is-bad > dd { color: var(--color-error-ink); }

.r2-tabs { display: flex; gap: 0; overflow-x: auto; border-bottom: var(--rule) solid var(--color-text); scrollbar-width: none; background: var(--color-page-bg); }
.r2-tabs::-webkit-scrollbar { display: none; }
.r2-tabs > a, .r2-tabs > button {
  display: inline-flex; align-items: center; gap: 8px; flex: none;
  padding: 9px 14px; border: 0; background: none; cursor: pointer;
  font: inherit; font-size: var(--text-sm); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase;
  color: var(--color-text); text-decoration: none; white-space: nowrap;
}
.r2-tabs > a:hover, .r2-tabs > button:hover { background: var(--color-surface-sunken); text-decoration: none; }
.r2-tabs > [aria-current], .r2-tabs > [aria-selected="true"], .r2-tabs > .is-active { background: var(--color-text); color: var(--color-page-bg); }
.r2-tab-count { font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 700; opacity: .75; }

.r2-card { border: 0; border-top: var(--rule) solid var(--color-text); background: none; padding: 12px 0 0; }
.r2-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 12px; }
.r2-card-head > h2, .r2-card-head > h3 { margin-right: auto; font-size: var(--text-sm); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; }

.r2-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 2px; border: 2px solid var(--color-text); background: var(--color-text); }
.r2-quick-item {
  display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; min-height: 104px;
  padding: 14px 16px; background: var(--color-page-bg);
  color: var(--color-text); text-decoration: none;
}
.r2-quick-item > .icon { width: 22px; height: 22px; margin-bottom: auto; }
.r2-quick-item > strong { font-size: var(--text-lg); font-weight: 700; line-height: 1.05; text-transform: uppercase; letter-spacing: 0.01em; }
.r2-quick-item > span { font-size: var(--text-sm); color: var(--color-text-muted); }
.r2-quick-item:hover { background: var(--color-text); color: var(--color-page-bg); text-decoration: none; }
.r2-quick-item:hover > span { color: inherit; }
.r2-quick-item.is-accent { background: var(--color-create-strong); color: var(--color-on-button); }
.r2-quick-item.is-accent > span { color: inherit; }
.r2-quick-item.is-accent:hover { background: var(--color-text); color: var(--color-page-bg); }

.r2-steps { display: flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 0; padding: 0; counter-reset: r2step; }
.r2-steps > li {
  counter-increment: r2step; display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 14px 5px 10px; margin-right: -2px; border: 2px solid var(--color-text);
  color: var(--color-text-muted); font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; white-space: nowrap;
}
.r2-steps > li::before { content: counter(r2step, decimal-leading-zero); font-family: var(--font-mono); font-weight: 700; }
.r2-steps > li.is-done { background: var(--color-text); color: var(--color-page-bg); }
.r2-steps > li.is-current { background: var(--color-primary); color: var(--rail-accent-ink); }

.r2-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px 24px; margin: 0; }
.r2-kv > div { min-width: 0; }
.r2-kv dt { font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--color-text-muted); }
.r2-kv dd { margin: 2px 0 0; overflow-wrap: anywhere; }

/* ------------------------------------------------------------ narrow: one band, the menu is a full sheet */
@media screen and (max-width: 1399px) {
  html[data-shell="r2"] .user-name { display: none; }
  .mast-sections > a { padding: 0 10px; }
  .mast-brand { padding-right: 14px; font-size: 18px; }
}
@media screen and (max-width: 1239px) {
  html[data-shell="r2"] .header-search-label, html[data-shell="r2"] .header-search kbd { display: none; }
  html[data-shell="r2"] .topbar > button.header-search { flex: none; width: 44px; }
}
@media screen and (max-width: 1099px) {
  .mast-sections, .mast-sub { display: none; }
  html[data-shell="r2"] .topbar { padding-right: 8px; }
  .mast-brand { padding: 0 12px 0 4px; margin-right: auto; }
  .mast-planner { padding: 0 12px; }
  .rail-toggle {
    display: grid; place-items: center; flex: none; width: 52px; border: 0; background: none; color: var(--color-topbar-text); cursor: pointer;
  }
  .rail-toggle:hover { background: var(--color-nav-hover-bg); }
  .rail {
    position: fixed; inset: var(--mast-band) 0 0 0; z-index: 210; display: none; flex-direction: column; overflow-y: auto;
    background: var(--color-page-bg); color: var(--color-text); padding: 8px 16px 32px;
  }
  body.rail-open .rail { display: flex; }
  body.rail-open { overflow: hidden; }
  .rail a { color: inherit; text-decoration: none; }
  .rail-brand, .rail-planner { display: none; }
  .rail-nav { display: block; }
  .rail-link.is-top, .rail-group > summary {
    display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 0; border-bottom: var(--rule) solid var(--color-text); cursor: pointer; list-style: none;
    font-size: 24px; font-weight: 700; text-transform: uppercase; letter-spacing: -0.01em;
  }
  .rail-group > summary::-webkit-details-marker { display: none; }
  .rail-group > summary > span { flex: 1; }
  .rail-group > summary > .icon:first-child, .rail-link.is-top > .icon { display: none; }
  .rail-group:not([open]) .rail-caret { transform: rotate(-90deg); }
  .rail-group > ul { list-style: none; margin: 0; padding: 0 0 8px; }
  .rail-group > ul .rail-link { display: flex; align-items: center; min-height: 44px; padding: 0 10px; border-bottom: 1px solid var(--color-border); font-size: var(--text-md); font-weight: 600; }
  .rail-link.is-active { background: var(--color-primary); color: var(--rail-accent-ink); }
  .rail-new {
    display: flex; align-items: center; justify-content: center; gap: 8px; flex: none; min-height: 48px; margin-top: 20px;
    background: var(--color-create-strong); color: var(--color-on-button) !important; font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-label);
  }
  html[data-shell="r2"] .page { padding: 20px var(--gutter) 40px; }
}
@media screen and (max-width: 600px) {
  html[data-shell="r2"] .theme-switch, html[data-shell="r2"] .scan-btn-label, html[data-shell="r2"] .scan-listen { display: none; }
  html[data-shell="r2"] .topbar .scan-btn { width: 40px; padding: 0; justify-content: center; }
  html[data-shell="r2"] .topbar > .scan-switch { margin-left: 6px; }
  .rail-toggle { width: 44px; }
  .mast-brand { font-size: 16px; letter-spacing: 0.02em; }
  .mast-planner > span { display: none; }
  .mast-planner { padding: 0 14px; }
  html[data-shell="r2"] .page-title { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .mast-planner .icon { transition: none; }
}
@media print {
  .rail, .rail-scrim, .rail-toggle, .actions-toggle, .mast-sub { display: none !important; }
}