/* ===== kwm-shopify v1: the /shopify hub modules (Store Reader, plates, rails, spoke ring) ===== New file on purpose (BS-B7): masthead-interior.css is edge-cached and linked from about 114 pages, so it is never appended to. Linked from the hub head only, with a fresh ?v= per release. Tokens come from masthead-interior.css with literal fallbacks. Measured contrast (DF2, 2026-09-13): ink #121110 on paper #fdfdfc 18.53:1; muted #5d5851 on paper 6.92:1; #9a280a on paper 7.69:1; #e83c10 on paper 4.06:1 (fails AA for small text, so the accent text color here is #9a280a); white on ink 18.86:1; white on #bb3410 (the shell's .hero-cta) 5.81:1; white on #9a280a 7.83:1; error #8a1c0c on paper 9.16:1. Nothing in this file animates. Mobile first. */ /* ---- hub-wide editorial type, opt in: the injector sets data-kwm-hub="shopify" on ---- */ body[data-kwm-hub="shopify"] .section h2{font-family:var(--mh-serif,'Instrument Serif',Georgia,serif);font-weight:400;letter-spacing:-.01em;line-height:1.05;font-size:clamp(30px,4.2vw,44px)} body[data-kwm-hub="shopify"] .section h2 em{font-style:italic;color:var(--mh-verm,#e83c10)} body[data-kwm-hub="shopify"] [id]{scroll-margin-top:96px} /* ---- shared module pieces ---- */ .kwm-sh-kicker,.kwm-sh-card-k,.kwm-sh-plate-k{font-family:var(--mh-mono,'JetBrains Mono','Courier New',monospace);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--mh-verm-dark,#9a280a);margin:0 0 14px} .kwm-sh-kicker{text-align:center} .kwm-sh-sep{margin:0 8px;color:var(--mh-ink2,#5d5851)} .kwm-sh-lede{max-width:640px;margin:0 auto 32px;text-align:center;color:var(--mh-ink2,#5d5851);font-size:16.5px;line-height:1.6} .kwm-sh-link,.kwm-sh-l{color:var(--mh-verm-dark,#9a280a);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;font-weight:600} .kwm-sh-link:hover,.kwm-sh-l:hover{color:var(--mh-ink,#121110)} .kwm-sh-link:focus-visible,.kwm-sh-l:focus-visible,.kwm-sh-input:focus-visible,.kwm-sh-btn:focus-visible,.kwm-sh .hero-cta:focus-visible{outline:2px solid var(--mh-verm-dark,#9a280a);outline-offset:2px} .kwm-sh-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin:22px 0 0} .kwm-sh .hero-cta{box-shadow:none;border-radius:0;transform:none;min-height:44px;font-size:15px;padding:12px 22px} .kwm-sh .hero-cta:hover{transform:none} .kwm-sh-p{color:var(--mh-ink,#121110);font-size:16px;line-height:1.6;margin:0 0 6px} /* ---- the Store Reader (No 02) ---- */ .kwm-sh{padding-top:56px;padding-bottom:56px;border-top:1px solid var(--mh-rule,rgba(18,17,16,.16))} .kwm-sh-nojs .kwm-sh-plate{max-width:760px;margin:0 auto} .kwm-sh-form{max-width:640px;margin:0 auto 28px} .kwm-sh-label{display:block;font-size:13px;font-weight:700;color:var(--mh-ink,#121110);margin:0 0 8px} .kwm-sh-row{display:grid;grid-template-columns:minmax(0,1fr);gap:10px} .kwm-sh-row>*{min-width:0} @media(min-width:560px){.kwm-sh-row{grid-template-columns:minmax(0,1fr) auto}} .kwm-sh-input{width:100%;min-height:44px;font-family:inherit;font-size:16px;color:var(--mh-ink,#121110);background:var(--mh-paper,#fdfdfc);border:1px solid var(--mh-rule,rgba(18,17,16,.16));border-radius:0;padding:10px 14px;box-shadow:none} .kwm-sh-input:focus{border-color:var(--mh-ink,#121110);outline:2px solid var(--mh-verm-dark,#9a280a);outline-offset:2px} .kwm-sh-input[aria-invalid="true"]{border-color:#8a1c0c} .kwm-sh-btn{min-height:44px;padding:0 22px;background:var(--mh-ink,#121110);color:#fff;border:1px solid var(--mh-ink,#121110);border-radius:0;font-family:var(--mh-sans,'Archivo','Helvetica Neue',sans-serif);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;white-space:nowrap} .kwm-sh-btn:hover{background:var(--mh-verm-dark,#9a280a);border-color:var(--mh-verm-dark,#9a280a)} .kwm-sh-btn:disabled{opacity:.6;cursor:default} .kwm-sh-hint{font-size:13px;color:var(--mh-ink2,#5d5851);margin:10px 0 0;line-height:1.5} .kwm-sh-hint.is-error{color:#8a1c0c;font-weight:600} .kwm-sh-results{max-width:760px;margin:0 auto} .kwm-sh.is-live .kwm-sh-results{min-height:27rem} .kwm-sh-card{border:1px solid var(--mh-rule,rgba(18,17,16,.16));background:var(--mh-paper,#fdfdfc);padding:26px 22px} @media(min-width:640px){.kwm-sh-card{padding:32px 34px}} .kwm-sh-card-h{font-family:var(--mh-serif,'Instrument Serif',Georgia,serif);font-weight:400;font-size:26px;line-height:1.15;letter-spacing:-.01em;color:var(--mh-ink,#121110);margin:0 0 12px} .kwm-sh-host{font-size:14px;color:var(--mh-ink2,#5d5851);margin:0 0 8px;overflow-wrap:anywhere} .kwm-sh-rows{margin:0;padding:0} .kwm-sh-r{display:grid;grid-template-columns:minmax(0,1fr);gap:4px 18px;padding:14px 0;border-top:1px solid var(--mh-rule-soft,rgba(18,17,16,.08))} .kwm-sh-r>*{min-width:0} @media(min-width:640px){.kwm-sh-r{grid-template-columns:150px minmax(0,1fr)}} .kwm-sh-r dt{font-family:var(--mh-mono,'JetBrains Mono','Courier New',monospace);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mh-ink2,#5d5851);padding-top:3px} .kwm-sh-r dd{margin:0} .kwm-sh-v{display:block;font-size:17px;font-weight:600;line-height:1.4;color:var(--mh-ink,#121110);font-variant-numeric:tabular-nums;overflow-wrap:anywhere} .kwm-sh-d{display:block;font-size:14px;line-height:1.5;color:var(--mh-ink2,#5d5851);margin-top:2px;overflow-wrap:anywhere} .kwm-sh-l{display:inline-block;font-size:13.5px;margin-top:6px} .kwm-sh-r.is-unread .kwm-sh-v{font-weight:500;color:var(--mh-ink2,#5d5851)} .kwm-sh-note{font-size:13px;line-height:1.5;color:var(--mh-ink2,#5d5851);border-top:1px solid var(--mh-rule,rgba(18,17,16,.16));padding-top:14px;margin:6px 0 0} .kwm-sh-selftest{font-family:var(--mh-mono,'JetBrains Mono','Courier New',monospace);font-size:13px;color:var(--mh-ink,#121110);text-align:center;padding:24px 0} /* ---- plates (No 03, two typographic plates from proof.json) ---- */ .kwm-sh-plates{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;max-width:1000px;margin:0 auto} .kwm-sh-plates>*{min-width:0} @media(min-width:760px){.kwm-sh-plates{grid-template-columns:repeat(2,minmax(0,1fr))}} .kwm-sh-plate{border:1px solid var(--mh-rule,rgba(18,17,16,.16));background:var(--mh-paper,#fdfdfc);padding:26px 22px} @media(min-width:640px){.kwm-sh-plate{padding:30px 30px}} .kwm-sh-plate p{font-size:16px;line-height:1.6;color:var(--mh-ink,#121110);margin:0 0 12px} .kwm-sh-plate p:last-child{margin-bottom:0} .kwm-sh-plate img{max-width:100%;height:auto;display:block;margin:0 0 18px} .kwm-sh-plate-n{font-family:var(--mh-serif,'Instrument Serif',Georgia,serif);font-size:44px;line-height:1;letter-spacing:-.02em;color:var(--mh-ink,#121110);font-variant-numeric:tabular-nums;margin:0 0 6px} /* ---- two rails table (No 01, hairline) ---- */ .kwm-sh-scroll{overflow-x:auto;max-width:100%} .kwm-sh-rails{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5;margin:8px 0 0} .kwm-sh-rails th,.kwm-sh-rails td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;border-top:1px solid var(--mh-rule-soft,rgba(18,17,16,.08));color:var(--mh-ink,#121110)} .kwm-sh-rails thead th{font-family:var(--mh-mono,'JetBrains Mono','Courier New',monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mh-ink2,#5d5851);border-top:0;border-bottom:1px solid var(--mh-rule,rgba(18,17,16,.16))} .kwm-sh-rails tbody th{font-weight:600;white-space:nowrap} /* ---- spoke ring (No 05, links derived from the manifest) ---- */ .kwm-sh-spokes{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0 28px} .kwm-sh-spokes>*{min-width:0} @media(min-width:720px){.kwm-sh-spokes{grid-template-columns:repeat(2,minmax(0,1fr))}} .kwm-sh-spokes li{border-top:1px solid var(--mh-rule-soft,rgba(18,17,16,.08));padding:16px 0} .kwm-sh-spokes a{font-family:var(--mh-serif,'Instrument Serif',Georgia,serif);font-size:22px;line-height:1.2;color:var(--mh-ink,#121110);text-decoration:none} .kwm-sh-spokes a:hover{color:var(--mh-verm-dark,#9a280a);text-decoration:underline;text-underline-offset:4px} .kwm-sh-spokes p{font-size:14.5px;line-height:1.5;color:var(--mh-ink2,#5d5851);margin:4px 0 0} /* ===== /kwm-shopify v1 ===== */ /* the reader toggles .kwm-sh-form, .kwm-sh-nojs and .kwm-sh-results with the hidden attribute; no site sheet sets display for [hidden] */ .kwm-sh [hidden], [hidden].kwm-sh-form, [hidden].kwm-sh-nojs, [hidden].kwm-sh-results { display: none !important; }