:root {
  color-scheme: light;
  --ink: #143e42;
  --text: #254448;
  --muted: #405654;
  --line: #d7d8c8;
  --paper: #fbf9ed;
  --white: #fff;
  --mint: #f1edd8;
  --accent: #755015;
  --focus: #755015;
  font-family: system-ui, sans-serif;
  color: var(--text);
  background: var(--paper);
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; font-size: 1rem; line-height: 1.55; overflow-wrap: anywhere; }
main { padding-block: 1.4rem 3.5rem; }
h1, h2, h3, p, ol, ul, figure, dl { margin-block-start: 0; }
h1, h2, h3 { color: var(--ink); line-height: 1.14; margin-block-end: .65em; }
h1 { font-size: clamp(2rem, 5vw, 4.25rem); letter-spacing: -.045em; }
h2 { font-size: clamp(1.25rem, 2.5vw, 1.8rem); }
h3 { font-size: 1.12rem; }
p { margin-block-end: .85rem; }
a { color: var(--accent); text-underline-offset: .19em; }
a:hover { text-decoration-thickness: .15em; }
img { display: block; max-width: 100%; height: auto; }
button, select, input { min-width: 0; max-width: 100%; font: inherit; color: inherit; }
button, .button, .add-cart {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 44px; border: 1px solid var(--ink); border-radius: .45rem;
  padding: .47rem .75rem; background: var(--white); color: var(--ink);
  font-weight: 700; text-decoration: none; cursor: pointer; text-align: center;
}
button:hover, .button:hover { background: var(--mint); }
.button.primary, .add-cart, .site-search button { background: var(--ink); color: var(--white); }
.button.primary:hover, .add-cart:hover, .site-search button:hover { background: var(--accent); }
input, select { width: 100%; min-height: 44px; border: 1px solid #667b82; border-radius: .35rem; padding: .35rem .5rem; background: var(--white); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.frame { width: min(76rem, calc(100% - 2.2rem)); margin-inline: auto; }
.eyebrow, .product-brand, .diagram-number { font: 700 .79rem/1.45 ui-monospace, SFMono-Regular, Consolas, monospace; color: var(--accent); letter-spacing: .055em; }
.visually-hidden, .skip:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip:focus { position: absolute; z-index: 5; padding: .6rem; background: var(--white); }
.masthead { border-top: 4px solid var(--accent); background: var(--white); border-bottom: 1px solid var(--line); }
.masthead-main { display: grid; grid-template-columns: auto minmax(14rem, 1fr) auto; align-items: center; gap: 1.35rem; padding-block: .85rem; }
.wordmark { display: flex; align-items: center; gap: .55rem; font-weight: 700; text-decoration: none; color: var(--ink); line-height: 1.15; }
.wordmark strong { display: block; }
.wordmark img { flex: 0 0 38px; }
.site-search { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .35rem; }
.utility, .nav-inner { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem 1.05rem; }
.utility a, .nav-inner > a, .department-menu summary { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; font-weight: 700; }
.utility span { color: var(--ink); font-size: .82em; }
.navigation { border-top: 1px solid var(--line); }
.nav-inner { position: relative; }
.department-menu summary { cursor: pointer; }
.department-menu[open] > div { position: absolute; z-index: 3; inset-inline: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; padding: 1rem; border: 1px solid var(--line); background: var(--white); box-shadow: 0 .5rem 1rem #143e4226; }
.department-menu a { display: block; padding-block: .25rem; }
.compare-tray { padding-block: .45rem; color: var(--ink); }
.preview-banner { margin: 0; background: var(--mint); color: var(--ink); padding: .35rem 1rem; text-align: center; }
.filter-toolbar label { display: grid; gap: .18rem; font-weight: 700; }
.section-block { margin-top: 2rem; }
.section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .7rem; margin-bottom: .55rem; }
.section-heading > h2 { margin: 0; }
.section-heading > a { flex: 0 1 auto; font-weight: 700; }
.product-grid, .guide-grid, .department-grid, .comparison-grid { display: grid; gap: .85rem; grid-template-columns: repeat(3, minmax(0,1fr)); align-items: stretch; }
.supply-card, .guide-card, .department-grid > section, .comparison-item { min-width: 0; border: 1px solid var(--line); background: var(--white); border-radius: .75rem; }
.supply-card { display: flex; flex-direction: column; }
.supply-photo { position: relative; display: grid; place-items: center; min-height: 8rem; padding: .6rem; border-bottom: 1px solid var(--line); background: #fffefa; border-radius: .75rem .75rem 0 0; }
.supply-photo img { width: 100%; height: clamp(8.5rem, 15vw, 13rem); object-fit: contain; mix-blend-mode: multiply; }
.supply-photo .favorite { position: absolute; inset-block-start: .5rem; inset-inline-end: .5rem; }
.favorite { min-width: 44px; font-size: 1.3rem; line-height: 1; }
.favorite[aria-pressed=true], .compare-choice[aria-pressed=true] { background: var(--mint); }
.supply-copy { padding: .75rem .8rem 0; }
.supply-copy h3 { margin-bottom: .45rem; }
.supply-copy h3 a { color: var(--ink); }
.pack-line, .supply-summary, .merchant-note, figcaption, .research-note { color: var(--muted); }
.pack-line { margin-bottom: .45rem; font-size: .86rem; }
.card-buy { display: grid; align-content: end; gap: .35rem; padding: 0 .8rem .8rem; margin-top: auto; }
.compare-choice { justify-self: start; }
.price-amount { font-weight: 800; font-size: 1.26rem; }
.price-observed, .price-info { color: var(--muted); font-size: .84rem; }
.price-observed { display: block; }
.price-info summary { color: var(--accent); cursor: pointer; padding-block: .18rem; }
.price-info p { margin: .3rem 0; }
.department-grid > section, .guide-card, .comparison-item { padding: .9rem; }
.department-grid ul { padding-inline-start: 1.1rem; margin-bottom: 0; }
.department-grid li { margin-block: .2rem; }
.guide-card { text-decoration: none; }
.guide-card p { color: var(--muted); }
.guide-card span { text-decoration: underline; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: .4rem; font-size: .88rem; margin-bottom: .75rem; }
.page-heading { border-bottom: 1px solid var(--line); padding-bottom: .8rem; margin-bottom: 1rem; }
.page-heading h1, .reading-page h1, .product-title h1 { font-size: clamp(1.85rem, 4vw, 3.2rem); }
.category-jumps, .product-section-nav { display: flex; flex-wrap: wrap; gap: .35rem .9rem; }
.catalogue-layout { display: grid; grid-template-columns: minmax(0,1fr); gap: 1rem; }
.catalogue-rail { display: flex; align-items: flex-start; gap: .85rem; }
.filter-toolbar { flex: 1; min-width: 0; padding: .6rem; border: 1px solid var(--line); border-radius: .65rem; background: var(--white); }
.filter-toolbar summary { cursor: pointer; font-weight: 700; }
.filter-toolbar form { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: end; gap: .5rem; padding-top: .6rem; }
.measurement-links { font-size: .88rem; max-width: 11rem; }
.results-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.results-toolbar label { display: flex; align-items: center; gap: .45rem; }
.results-toolbar p { margin-bottom: 0; }
.catalogue-results .product-grid { margin-top: .5rem; }
.detail-layout { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0, .9fr); grid-template-areas: "photo buy"; gap: 1rem; }
.purchase-panel, .detail-visual, .knowledge-section, .reading-page, .faq-block, .empty-state, .cart-summary { min-width: 0; background: var(--white); border: 1px solid var(--line); border-radius: .75rem; padding: 1rem; }
.purchase-panel { grid-area: buy; align-self: start; }
.detail-visual { grid-area: photo; margin: 0; }
.detail-visual img { width: 100%; max-height: 28rem; object-fit: contain; }
.detail-visual figcaption { margin-top: .5rem; }
.purchase-head, .purchase-row, .selection-actions { display: flex; align-items: flex-start; gap: .45rem; flex-wrap: wrap; }
.purchase-head { justify-content: space-between; }
.purchase-row { align-items: start; }
.purchase-row .add-cart { flex: 1 1 9rem; }
.purchase-panel > .merchant-note { margin-top: .45rem; }
.spec-list { margin-bottom: .5rem; }
.spec-list > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.5fr); gap: .6rem; padding: .25rem 0; border-bottom: 1px solid var(--line); }
dt { font-weight: 700; }
dd { margin-inline: 0; }
.detail-reading { display: grid; grid-template-columns: minmax(0,10rem) minmax(0,1fr); gap: 1rem; margin-top: 1.2rem; }
.product-section-nav { align-content: start; flex-direction: column; }
.detail-sections, .cart-layout { display: grid; gap: .8rem; }
.detail-sections > * { margin: 0; }
.faq-item, .knowledge-section details, .faq-block details { margin-block: .45rem; padding: .55rem; border-top: 1px solid var(--line); }
.faq-item summary, .knowledge-section details summary, .faq-block summary { cursor: pointer; font-weight: 700; }
.faq-item p, .knowledge-section details p, .faq-block details p { margin: .55rem 0 0; }
.reading-page { max-width: 54rem; margin-bottom: 1rem; }
.category-editorial, .guide-connections { margin-top: 1rem; }
.comparison-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.comparison-item img, .cart-picture img { aspect-ratio: 1; object-fit: contain; }
.cart-layout { grid-template-columns: minmax(0, 2fr) minmax(0,1fr); }
.cart-item { display: grid; grid-template-columns: minmax(0,6rem) minmax(0,1fr) auto; align-items: start; gap: .7rem; background: var(--white); border: 1px solid var(--line); border-radius: .6rem; padding: .65rem; margin-bottom: .6rem; }
.cart-item h2 { font-size: 1.07rem; }
.quantity-label { display: block; margin: .4rem 0; }
.quantity-label input { display: block; width: 5.3rem; }
.cart-purchase { display: grid; gap: .25rem; }
.cart-summary { align-self: start; }
footer { border-top: 1px solid var(--line); background: var(--white); padding-block: 1.5rem; }
.footer-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: .8rem; }
.footer-grid nav { display: flex; flex-wrap: wrap; align-content: start; gap: .5rem .8rem; }
.footer-brand { font-weight: 700; }
@media (max-width: 900px) {
  .masthead-main { grid-template-columns: auto minmax(0,1fr); gap: .5rem .75rem; }
  .utility { grid-column: 1 / -1; }
  .comparison-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .detail-layout, .detail-reading, .cart-layout { grid-template-columns: minmax(0,1fr); }
  .detail-layout { grid-template-areas: "photo" "buy"; gap: .6rem; }
  .detail-visual { padding: .55rem; }
  .detail-visual img { height: clamp(8.5rem, 44vw, 12.5rem); }
  .detail-visual figcaption { margin-top: .15rem; font-size: .87rem; }
  .purchase-row { display: grid; grid-template-columns: minmax(0,1fr) auto; }
  .purchase-row .add-cart:only-child { grid-column: 1 / -1; }
  .purchase-row .detail-price[hidden] + .add-cart { grid-column: 1 / -1; }
  .product-section-nav { flex-direction: row; }
  .catalogue-rail { display: grid; }
  .measurement-links { max-width: none; }
  .filter-toolbar form { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-grid, .department-grid, .guide-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 490px) {
  .frame { width: calc(100% - 1.25rem); }
  main { padding-top: .7rem; }
  .hero-brief .primary { margin-block: 0; }
  .guide-shortcut { margin: .2rem 0 0 .3rem; }
  .masthead-main { grid-template-columns: minmax(0,1fr); }
  .nav-inner { gap: .1rem .68rem; font-size: .89rem; }
  .department-menu[open] > div { position: static; display: block; }
  .department-menu[open] > div section + section { margin-top: .6rem; }
  .product-grid, .comparison-grid, .department-grid, .guide-grid, .footer-grid { grid-template-columns: minmax(0,1fr); }
  .supply-photo img { height: 11rem; }
  .cart-item { grid-template-columns: minmax(0,4.5rem) minmax(0,1fr); }
  .cart-purchase { grid-column: 1 / -1; }
}
.category-reading { display: grid; gap: .85rem; margin-top: 1.3rem; }
.example-grid { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fit,minmax(min(100%,13rem),1fr)); }
.example-grid article { min-width: 0; padding: .65rem; border: 1px solid var(--line); border-radius: .45rem; background: var(--paper); }
.example-grid h4 { margin: 0 0 .4rem; }
.guide-comparison-links { display: flex; flex-wrap: wrap; gap: .4rem .9rem; }
.guide-comparison li { margin-bottom: 1rem; }


.pattern-fit { padding: 1rem; border: 1px solid var(--line); border-radius: .65rem; background: var(--white); }
.pattern-fit { grid-area: fit; align-self: start; }
.detail-layout { grid-template-areas: "photo buy" "fit fit"; grid-template-rows: auto auto; }
.pattern-fit dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; }
.pattern-fit dt { font-weight: 750; color: var(--ink); }
.pattern-fit dd { margin: .2rem 0 0; }
.detail-reading { grid-template-columns: minmax(0,1fr); }
.product-section-nav { flex-direction: row; border-bottom: 1px solid var(--line); }
.product-section-nav a { min-height: 44px; display: flex; align-items: center; }
.purchase-panel { align-self: start; border-top: .25rem solid var(--accent); }
.catalogue-rail { display: block; }

@media (min-width: 1000px) {
  .catalogue-layout { grid-template-columns: minmax(11rem,14rem) minmax(0,1fr); align-items: start; }
  .filter-toolbar form { grid-template-columns: minmax(0,1fr); }
  .catalogue-results > .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 660px) {
  .pattern-fit dl { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 700px) {
  .detail-layout { grid-template-areas: "photo" "buy" "fit"; grid-template-rows: auto; }
}
.coil-hero { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); gap: 1.25rem; align-items: center; background: var(--mint); padding: clamp(.85rem,2vw,1.65rem); border: 1px solid var(--line); border-radius: 1rem; }
.coil-hero h1 { margin: .1rem 0 .35rem; font-size: clamp(2rem,5vw,3.65rem); line-height: 1.04; letter-spacing: -.035em; }
.coil-hero p { margin-bottom: .7rem; }
.paper-ruler { padding: .7rem 1rem; background: var(--white); border-radius: .7rem; border: 1px solid var(--line); }
.paper-ruler div { display: grid; grid-template-columns: 3.5rem 1fr; align-items: center; padding: .25rem 0; gap: .45rem; color: var(--ink); font-variant-numeric: tabular-nums; }
.paper-ruler i { display: block; background: #c08b2a; border-radius: 1rem; height: 3px; }
.paper-ruler div:nth-child(2) i { height: 5px; background: #528077; }
.paper-ruler div:nth-child(3) i { height: 10px; background: #143e42; }
.paper-ruler a { display: inline-block; margin-top: .3rem; }
.coil-stages { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .6rem; margin-top: .75rem; }
.coil-stage { min-width: 0; border: 1px solid var(--line); background: var(--white); border-radius: .55rem; padding: .55rem .7rem; }
.coil-stage > div:first-child { display: flex; align-items: baseline; gap: .35rem; }
.stage-number { color: var(--accent); font-weight: 750; font-variant-numeric: tabular-nums; }
.coil-stage h2 { font-size: 1.05rem; margin: 0; }
.coil-stage p { margin: .25rem 0; }
.coil-stage-links { display: flex; flex-wrap: wrap; gap: .2rem .6rem; font-size: .9rem; }
.coil-picks .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.coil-sizing { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 1rem; border-block: 2px solid var(--line); padding: 1rem .2rem; }
.coil-sizing dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; margin: 0; }
.coil-sizing dt { color: var(--ink); font-weight: 750; }
.coil-sizing dd { margin: .15rem 0 0; }
@media(max-width:700px) { .coil-hero,.coil-sizing { grid-template-columns: 1fr; } .coil-stages { grid-template-columns: 1fr; } .coil-stage p { margin: .1rem 0; } }
@media(max-width:520px) { .coil-picks .product-grid,.coil-sizing dl { grid-template-columns: 1fr; } }