/** Shopify CDN: Minification failed

Line 170:0 Unexpected "}"

**/
/* Quick start guide, printed pages in HTML (sections/simrell-quick-start-guide.liquid, snippets/simrell-qsg-*.liquid).
   Each page is the designer's art with the words taken out, plus the words as live text at their printed
   positions: points on the 612 x 792 page, converted with --pt. The store's fonts run wider than the printed
   guide's, so each text style is scaled by --fit to keep its printed line length
   (measured with quick-start-guides/tools/measure-fit.mjs in the ops repo). */

.simrell-qsg .qsg-pages {
  display: flex;
  gap: 16px;
  max-width: calc(var(--container-max-width) + 2 * var(--container-gutter));
  margin: 0 auto;
  padding: 0 var(--container-gutter);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: var(--container-gutter);
  scrollbar-width: none;
}

.simrell-qsg .qsg-pages::-webkit-scrollbar {
  display: none;
}

.simrell-qsg .qsg-page {
  position: relative;
  flex: 0 0 min(calc(100vw - 2 * var(--container-gutter)), 460px);
  aspect-ratio: 612 / 792;
  container-type: inline-size;
  --pt: calc(100cqw / 612);
  overflow: hidden;
  scroll-snap-align: start;
  color: #000;
}

@media screen and (min-width: 1200px) {
  .simrell-qsg .qsg-pages {
    overflow: visible;
  }

  .simrell-qsg .qsg-page {
    flex: 1 1 0;
  }
}

.simrell-qsg .qsg-page__art {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
}

/* One positioned block per printed line group, anchored on its LAST baseline (--y), left edge --x. */
.simrell-qsg .qsg-t {
  position: absolute;
  left: calc(var(--x) * var(--pt));
  bottom: calc((792 - var(--y)) * var(--pt));
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: calc(var(--fs, 15) * var(--fit, 1) * var(--pt));
  line-height: calc(var(--ld, 18) * var(--pt));
  letter-spacing: normal;
  text-transform: none;
  white-space: pre;
  text-box: trim-end cap alphabetic;
}

.simrell-qsg .qsg-ctr { translate: -50% 0; text-align: center; }
.simrell-qsg .qsg-list,
.simrell-qsg .qsg-steps { margin: 0; padding: 0; list-style: none; }
.simrell-qsg .qsg-nb { display: inline-block; width: calc(var(--w) * var(--pt)); }

.simrell-qsg .qsg-serif { font-family: var(--heading-font-family); font-weight: 400; font-style: normal; }
.simrell-qsg .qsg-b { font-weight: 700; }
.simrell-qsg .qsg-sans { font-family: var(--text-font-family); }
.simrell-qsg .qsg-lo { font-weight: 300; font-style: italic; }
.simrell-qsg .qsg-bo { font-weight: 400; font-style: italic; }
.simrell-qsg .qsg-me { font-weight: 500; font-style: normal; }
.simrell-qsg .qsg-mo { font-weight: 500; font-style: italic; }
.simrell-qsg .qsg-up { text-transform: uppercase; }
.simrell-qsg .qsg-ul { text-decoration: underline; text-decoration-thickness: calc(2 * var(--pt)); text-underline-offset: calc(3.8 * var(--pt)); text-decoration-skip-ink: none; }
.simrell-qsg .qsg-red { color: #de2a2a; }

.simrell-qsg .qsg-k68 { font-size: calc(68 * var(--fit, 1) * var(--pt)); }
.simrell-qsg .qsg-k59 { font-size: calc(59 * var(--fit, 1) * var(--pt)); }
.simrell-qsg .qsg-k38 { font-size: calc(38 * var(--fit, 1) * var(--pt)); }
.simrell-qsg .qsg-k28 { font-size: calc(28 * var(--fit, 1) * var(--pt)); }
.simrell-qsg .qsg-k17 { font-size: calc(17 * var(--fit, 1) * var(--pt)); }
.simrell-qsg .qsg-k15 { font-size: calc(15 * var(--fit, 1) * var(--pt)); }

/* --fit per text style: each value sits just under the tightest printed line of that style. */
.simrell-qsg .qsg-fh { --fit: .8; }    /* headings */
.simrell-qsg .qsg-fct { --fit: .735; } /* cover title */
.simrell-qsg .qsg-fc { --fit: .79; }   /* cover side words */
.simrell-qsg .qsg-flb { --fit: .78; }  /* bold labels: part numbers, Step N, Tip: */
.simrell-qsg .qsg-fb { --fit: .925; }  /* body italic */
.simrell-qsg .qsg-fmi { --fit: .97; }  /* torch heating intro */
.simrell-qsg .qsg-fn { --fit: .97; }   /* red note */
.simrell-qsg .qsg-flc { --fit: .945; } /* diagram captions */
.simrell-qsg .qsg-ft { --fit: .99; }   /* tip text */

/* The printable-file line under the pages. Inherits the section's colour, underlined so it reads as a link
   at any size; the pages above already carry the visual weight. */
.simrell-qsg .qsg-print {
  margin: 20px 0 0;
  text-align: center;
  font-size: 14px;
}

.simrell-qsg .qsg-print a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}


/* ---- Hydro guide (four pages) ----------------------------------------------------------------
   The Hydro's art came from flattened page images rather than vector files, so every line is placed
   from a measurement (quick-start-guides/tools/) and sized so its width matches the print. These
   styles name what each kind of line is; the sizes and positions ride on the lines themselves. */
.simrell-qsg .s-title,
.simrell-qsg .s-subtitle,
.simrell-qsg .s-heading {
  font-family: var(--heading-font-family);
  font-weight: 400;
  font-variant-caps: small-caps;   /* the guide's headings: full-size first letter, small caps after */
  letter-spacing: .01em;
}

.simrell-qsg .s-heading {
  text-decoration: underline;
  text-decoration-thickness: calc(1.6 * var(--pt));
  text-underline-offset: calc(3.2 * var(--pt));
  text-decoration-skip-ink: none;
}

.simrell-qsg .s-list,
.simrell-qsg .s-step,
.simrell-qsg .s-body,
.simrell-qsg .s-caption,
.simrell-qsg .s-note-red {
  font-family: var(--text-font-family);
  font-style: italic;
  font-weight: 400;
}

.simrell-qsg .s-tip,
.simrell-qsg .s-label {
  font-family: var(--text-font-family);
  font-weight: 400;
}

.simrell-qsg .s-note-red { color: #de2a2a; }

/* the part numbers, "Step n" and "Tip:" are set in the serif, roman and bold, against italic text */
.simrell-qsg .qsg-lab {
  font-family: var(--heading-font-family);
  font-style: normal;
  font-weight: 700;
}

/* Each Hydro line is placed on its own baseline, so it carries no leading of its own. */
.simrell-qsg .qsg-t[data-area] { line-height: 1; }
}