/** Shopify CDN: Minification failed

Line 6:1 Unexpected "/"

**/
*/

/* !!!! READ THIS BEFORE EDITING THIS FILE !!!!

   TWO TRAPS LIVE IN THIS FILE. BOTH COST A DEBUGGING ROUND ON
   2026-08-31. READ BOTH.

   ---- TRAP 1: THE `:root` BLOCK BELOW IS DEAD ----

   Line 1 is a stray `*/` with no opening `/*`. CSS error recovery
   discards tokens until it can resync on a new rule, and what it
   swallows is the comment plus the WHOLE `:root { ... }` block. Proven
   in the browser: the first rule in document.styleSheets for this file
   is `body { letter-spacing: 0 }`, and
   getComputedStyle(documentElement).getPropertyValue('--mono-amber')
   returns an empty string.

   Consequence: every bare `var(--mono-...)` here resolves to nothing
   and that declaration is dropped. Only uses carrying a literal
   fallback still work, which is why the free-shipping bar at the
   bottom (`var(--mono-oxblood, #6f2028)`) paints and, say,
   `.header-wrapper { border-bottom: 2px solid var(--mono-ink) }` does
   not. The site gets its look from Dawn's defaults plus the literal
   hex values written into the Monograph section files.

   DELETING LINE 1 FIXES IT, AND THAT IS A REAL VISUAL CHANGE, not a
   tidy-up. A dozen colour and border rules that have never rendered
   switch on at once. Do it deliberately, on its own draft, with Phil
   reviewing before and after. Do not fold it into an unrelated change.

   Until then: any NEW rule here uses literal values, never
   `var(--mono-...)`.

   ---- TRAP 2: THIS FILE LOADS BEFORE base.css ----

   layout/theme.liquid tags monograph.css AHEAD of base.css, on
   purpose. That means at EQUAL SPECIFICITY, DAWN WINS AND THIS FILE
   LOSES. Every rule here that appears to work is either more specific
   than Dawn's, or Dawn has no opinion on that property.

   This bit twice on the header lockup: `display: inline-flex` on
   `.header__heading-link` was silently beaten by base.css's
   `display: inline-block`, which left the ::before as an inline box
   with width and height ignored, so the mark vanished with no error.

   Rule of thumb: put the property on the element you actually own
   (a pseudo-element, or a .mono- class), not on a Dawn class, unless
   you are prepared to add specificity or !important.
*/

/* ---- global texture: ruled apothecary lines ---- */
:root {
  --mono-amber: #a5732f;
  --mono-ink: #332a1d;
  --mono-ink-soft: #665845;
  --mono-ink-faint: #7a6a4d;
  --mono-rule-soft: #d9cfb6;
  --mono-paper: #faf6ec;
  --mono-oxblood: #6f2028;
  --mono-forest: #2c5340;
}

body { letter-spacing: 0; }

/* ---- header: centered wordmark, ruled ---- */
.header-wrapper { border-bottom: 2px solid var(--mono-ink); }
.header__heading-link .h2, .header__heading-logo, .header__heading {
  letter-spacing: .14em;
  text-transform: uppercase;
}
.header__menu-item {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  font-size: 1.2rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mono-ink-faint);
}
.header__menu-item:hover { color: var(--mono-ink); text-decoration: underline; text-underline-offset: 4px; }

/* announcement bar as the info strip */
.announcement-bar, .utility-bar {
  background: var(--mono-paper) !important;
  border-bottom: 1px solid var(--mono-ink);
}
.announcement-bar__message {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  font-size: 1.1rem;
  letter-spacing: .06em;
  color: var(--mono-ink-faint);
  text-transform: uppercase;
}

/* ---- type ---- */
h1, h2, h3, .h0, .h1, .h2, .h3 { letter-spacing: .08em; text-transform: uppercase; font-weight: 400; }
.price, .price__regular, .price-item,
.product__sku, .cart-item__name + *, .totals__subtotal-value {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  letter-spacing: .04em;
}

/* ---- buttons: square, ink, mono ---- */
.button, .shopify-challenge__button, .customer button, button.shopify-payment-button__button--unbranded {
  border-radius: 0;
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: 1.2rem;
}
.button:hover { background: var(--mono-amber); }

/* kill Dawn's soft shadows and rounded corners everywhere */
.card, .card__inner, .card--card, .media, .global-media-settings,
.cart-item__image, .product__media, input, select, textarea, .field__input, .select__select {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ---- product cards: ruled specimen cards ---- */
.card--card, .card--standard .card__inner {
  background: transparent;
  border: 1px solid var(--mono-rule-soft);
}
.card__heading { font-size: 1.6rem; text-transform: none; letter-spacing: 0; }
.card__heading a:hover { color: var(--mono-amber); text-decoration: none; }
.card .price { color: var(--mono-ink-faint); font-size: 1.15rem; }
.card__information .caption-with-letter-spacing,
.card__information .caption {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  color: var(--mono-amber);
  letter-spacing: .1em;
}

/* collection grid: tighter, ruled container */
#product-grid { border-top: 2px solid var(--mono-ink); padding-top: 2.4rem; }

/* ---- product page ---- */
.product__title h1 { text-transform: none; letter-spacing: 0; }
.product__text.caption-with-letter-spacing {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  color: var(--mono-amber);
}
.product__description { color: var(--mono-ink-soft); font-style: italic; line-height: 1.75; }
variant-selects .form__label, .product-form__input .form__label {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  font-size: 1.1rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mono-ink-faint);
}
/* variant pills: square chips that invert on selection */
.product-form__input input[type="radio"] + label {
  border-radius: 0;
  border: 1px solid #cbbc9c;
  background: transparent;
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  font-size: 1.1rem;
}
.product-form__input input[type="radio"]:checked + label {
  background: var(--mono-ink);
  color: var(--mono-paper);
  border-color: var(--mono-ink);
}

/* ---- cart ---- */
.cart-items td, .cart-items th { border-color: var(--mono-rule-soft); }
.cart-item__name { font-size: 1.6rem; }

/* ---- footer ---- */
.footer { border-top: 1px solid var(--mono-ink); background: var(--mono-paper) !important; }
.footer__content-top, .footer__content-bottom { background: var(--mono-paper); }
.footer-block__heading, .footer__copyright, .footer .list-menu__item {
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 1.1rem;
  color: var(--mono-ink-faint);
}

/* ---- misc chrome ---- */
.quick-add__submit { border-radius: 0; }
.badge { border-radius: 0; font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace; letter-spacing: .08em; }
.loading-overlay__spinner .path { stroke: var(--mono-amber); }

/* ---- authenticity specimen block ---- */
.product__description .mono-authenticity {
margin-top: 2.4rem;
padding: 1.4rem 0 1.2rem;
border-top: 1px solid var(--mono-rule-soft);
border-bottom: 1px solid var(--mono-rule-soft);
font-style: normal;
}
.mono-authenticity__label {
display: block;
font-family: 'IBM Plex Mono', monospace;
font-size: 1rem;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--mono-amber);
margin-bottom: .6rem;
}
.product__description .mono-authenticity p {
font-family: 'IBM Plex Mono', monospace;
font-size: 1.15rem;
letter-spacing: .03em;
line-height: 1.7;
color: var(--mono-ink-faint);
margin: 0;
}

/* ================================================================
   THE MARK - header lockup and footer. Added 2026-08-31.

   Painted as a decorative ::before background, NOT via Dawn's logo
   setting, and that is deliberate. Dawn renders EITHER settings.logo
   OR the shop-name text, never both, so filling in the theme's logo
   field would delete the typeset MONOGRAPH wordmark that the Index
   and Numbered sections were built to match. This way the wordmark
   stays real text, which is also the right call for screen readers
   and SEO since the mark carries no information the wordmark does not.

   IF YOU EVER SET THE THEME LOGO FIELD, delete the header rule below
   or the mark will appear twice.

   HEADER IS INLINE, NOT STACKED. Stacking the mark above the wordmark
   pushed MONOGRAPH below the nav row and Phil read it as cluttered.
   Inline keeps the lockup on the same baseline as the menu items and
   restores the header's original height. The FOOTER stays stacked; it
   has the room and reads better centred above the newsletter.

   `display: inline-block` on the ::before is LOAD-BEARING, see TRAP 2
   at the top. Do not move the layout onto the anchor with flex: this
   file loses ties to base.css, so `display` set on
   `.header__heading-link` is overridden and the pseudo-element falls
   back to `display: inline`, where width and height are ignored and
   the mark disappears with no error anywhere.

   URLs written out in full rather than held in a custom property,
   because the :root block is dead. See TRAP 1.

   File is monograph-logo-transparent.png in Shopify Files, cut from
   Phil's black-ground PNG on 2026-08-31. Its sibling
   monograph-logo-favicon.png is the flat silhouette, which holds at
   32px where this textured one greys out. Not interchangeable.
   ================================================================ */
.header__heading-link::before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  width: 2.6rem;
  height: 2.6rem;
  margin-right: .9rem;
  position: relative;
  top: -.2rem;
  background-image: url('/cdn/shop/files/monograph-logo-transparent.png?v=1788190573');
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}
.header__heading-link .h2 { vertical-align: middle; }

.footer::before {
  content: '';
  display: block;
  width: 100%;
  height: 5.6rem;
  margin: 0 auto 2.6rem;
  background-image: url('/cdn/shop/files/monograph-logo-transparent.png?v=1788190573');
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}

@media screen and (max-width: 749px) {
  .header__heading-link::before { width: 2.1rem; height: 2.1rem; margin-right: .6rem; }
  .footer::before { height: 4.2rem; margin-bottom: 1.8rem; }
}

/* ================================================================
   FREE-SHIPPING PROGRESS BAR  (cart drawer + cart page)
   Markup: snippets/cart-drawer.liquid, sections/main-cart-footer.liquid.

   EVERY declaration here carries !important, and the block is kept
   LAST in the file. Both are deliberate. snippets/cart-drawer.liquid
   still holds an inline <style> copy of an older version of these
   rules, and because that <style> sits later in the document than
   this stylesheet, any rule here at equal specificity LOSES to it.
   That is not theory: it silently kept the met-state label bronze
   on 2026-08-28 after the colours changed, and it is the most likely
   explanation for the 2px track that would not paint earlier the
   same day.

   THE REAL FIX IS TO DELETE THE INLINE COPY from cart-drawer.liquid.
   Do that next time that snippet is opened, then these flags can go.

   NOTE 2026-08-31: the literal fallbacks in the var() calls below are
   the ONLY reason this block paints at all. See TRAP 1 at the top.

   COLOUR: bronze read as decoration against the cream paper, so the
   unmet state is oxblood and the met state is forest. Colour carries
   the state change; nothing moves except the fill width. The track
   is a 16% wash of whichever colour is active, so the empty part
   reads as the same bar rather than a separate rule.
   ================================================================ */
.mono-ship {
  display: block;
  padding: 0 0 1.8rem;
}
.cart__footer .mono-ship { padding: .6rem 0 2rem; }

.mono-ship .mono-ship__label {
  display: block !important;
  margin: 0 0 1rem !important;
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace !important;
  font-size: 1.1rem !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  line-height: 1.4 !important;
  color: var(--mono-oxblood, #6f2028) !important;
}
.mono-ship--met .mono-ship__label { color: var(--mono-forest, #2c5340) !important; }

.mono-ship .mono-ship__track {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: 4px !important;
  min-height: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  background: rgba(111, 32, 40, .16) !important;
}
.mono-ship .mono-ship__fill {
  display: block !important;
  height: 4px !important;
  min-height: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: var(--mono-oxblood, #6f2028) !important;
  transition: width .4s ease;
}
.mono-ship--met .mono-ship__track { background: rgba(44, 83, 64, .16) !important; }
.mono-ship--met .mono-ship__fill { background: var(--mono-forest, #2c5340) !important; }

@media (prefers-reduced-motion: reduce) {
  .mono-ship .mono-ship__fill { transition: none !important; }
}

/* Handling-time note (.mono-handling)
   Rendered by snippets/mono-handling-note.liquid on the product page, in the
   cart drawer footer and on the cart page. Literal hex only: the stray
   comment-close on line 1 of this file kills the :root block, so a bare
   var(--mono-...) resolves to nothing here. */
.mono-handling {
  display: block !important;
  margin: 1.4rem 0 0 !important;
  font-family: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, 'Courier New', monospace !important;
  font-size: 1.1rem !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  line-height: 1.5 !important;
  color: #7a6a4d !important;
}

.cart-drawer .mono-handling,
.cart__footer .mono-handling {
  margin: 0 0 1.4rem !important;
}

/* Product-page variant of the handling note. It sits ABOVE the ADD TO CART button,
   so the only change from the base rule is flipping the margin to the bottom.
   Phil tried an oxblood, larger treatment on 2026-09-09 and preferred the muted
   one, so colour and size are deliberately NOT overridden here. */
.mono-handling--above {
  margin: 0 0 1.3rem !important;
}
