.shop-intro { display:grid; grid-template-columns:minmax(0,2fr) minmax(16rem,1fr); gap:2rem; padding-block:1.5rem 2rem; align-items:center; }
.shop-intro h1 { font-size:clamp(2.5rem,5vw,4.75rem); line-height:1.08; letter-spacing:-.04em; margin-block:1rem 1.5rem; }
.shop-intro h1 em { color:var(--pine); }
.shop-intro p { font-size:1.125rem; line-height:1.7; max-width:60ch; }
.shop-feature { display:block; text-decoration:none; background:#fff; border:.0625rem solid var(--rule); }
.shop-feature > img { width:100%; height:auto; aspect-ratio:1; object-fit:contain; }
.shop-feature > span { display:block; padding:1rem; font-size:1.125rem; line-height:1.6; }
.shop-feature b,.shop-feature > span > span { display:block; }
.shop-feature small { display:block; font-size:.875rem; line-height:1.6; }
.shop-feature > span > span { margin-top:.5rem; font-size:1rem; text-decoration:underline; }
.shop-membership { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; border-block:.0625rem solid var(--rule); padding-block:1.5rem; }
.shop-membership p { font-size:1.125rem; line-height:1.7; margin:0; max-width:65ch; }
.shop-membership a,.shop-filters a { display:inline-flex; align-items:center; min-width:2.75rem; min-height:2.75rem; font-size:1rem; }
.shop-filters { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; margin-block:2rem; }
.shop-filters a { border-bottom:.125rem solid transparent; text-decoration:none; }
.shop-filters [aria-current="true"] { border-color:var(--pine); font-weight:700; }
.shop-layout { display:grid; grid-template-columns:minmax(0,3fr) minmax(16rem,1fr); gap:2rem; align-items:start; }
.shop-products { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem 1.5rem; }
.shop-layout > *, .shop-products > * { min-width:0; }
.merch-card { border:.0625rem solid var(--rule); background:#faf8f1; }
.merch-card[hidden] { display:none !important; }
.merch-image { position:relative; background:#fff; aspect-ratio:1; }
.merch-image img { width:100%; height:100%; object-fit:contain; }
.merch-image > span { position:absolute; left:.875rem; top:.875rem; background:var(--paper); color:var(--pine); font-size:.875rem; padding:.375rem .625rem; }
.merch-image > .merch-render-label { top:auto; bottom:.875rem; }
.merch-card-copy { padding:1.25rem; }
.merch-card h2 { font-size:1.75rem; line-height:1.2; margin-block:.75rem; }
.merch-card p,.shop-bag p,.shop-bag li,.shop-story p { font-size:1.125rem; line-height:1.7; }
.merch-card .eyebrow { font-size:.875rem; }
.merch-card .merch-price { font-size:1.5rem; font-weight:600; }
.merch-price span { display:block; color:#526048; font-size:1rem; font-weight:400; }
.merch-card details { border-top:.0625rem solid var(--rule); margin-block:1rem; }
.merch-card summary { display:flex; align-items:center; min-height:2.75rem; cursor:pointer; font-size:1rem; }
.merch-card details p { font-size:1.125rem; }
.merch-card form { display:grid; gap:.75rem; }
.merch-card label { font-size:1rem; line-height:1.6; }
.shop-layout select,.shop-layout button { box-sizing:border-box; width:100%; min-width:2.75rem; min-height:2.75rem; padding:.75rem; font:inherit; font-size:1rem; line-height:1.5; border:.0625rem solid var(--pine); border-radius:0; color:var(--pine); background:transparent; white-space:normal; }
.shop-layout select { min-width:0; background:var(--paper); }
.shop-layout button { cursor:pointer; }
.shop-layout button:disabled { cursor:default; color:#526048; border-color:#77816d; background:#e5e9dc; }
.shop-bag { padding:1.5rem; background:var(--soft); position:sticky; top:1rem; }
.shop-bag h2 { font-size:2rem; margin-block:.75rem 1rem; }
.shop-bag ul { list-style:none; padding:0; }
.shop-bag li { border-bottom:.0625rem solid #a6b29a; padding-block:1rem; }
.shop-bag li button { margin-top:.5rem; }
.shop-bag #shop-checkout:not(:disabled) { background:var(--pine); color:var(--paper); }
.shop-bag #shop-bag-total { font-size:1.5rem; font-weight:600; }
.shop-bag #shop-error { color:#8a3028; }
.shop-bag #shop-receipt { display:inline-flex; align-items:center; min-height:2.75rem; font-size:1.125rem; }
.shop-bag #shop-receipt[hidden],.shop-bag #shop-new-bag[hidden] { display:none; }
html { scroll-padding-bottom:7rem; }
.merch-card .merch-production { font-size:.875rem; margin-bottom:0; }
.shop-story { border-top:.0625rem solid var(--rule); margin-block:3rem; padding-top:2rem; max-width:65ch; }
.shop-bag-summary { display:none; }
.shop-bag-summary[hidden] { display:none !important; }
@media(max-width:1050px) { .shop-layout { grid-template-columns:minmax(0,1fr); } .shop-bag { position:static; } }
@media(max-width:1050px) { .shop-bag-summary { display:block; position:fixed; z-index:20; inset:auto 1rem max(.75rem,env(safe-area-inset-bottom)); padding:.5rem 1rem; background:var(--pine); color:var(--paper); box-shadow:0 .125rem 1rem #0003; } .shop-bag-summary a { display:flex; align-items:center; justify-content:center; min-height:2.75rem; font-size:1rem; color:inherit; } body.merch-has-bag { padding-bottom:calc(6rem + env(safe-area-inset-bottom)); } }
@media(max-width:700px) { .shop-intro { grid-template-columns:minmax(0,1fr); gap:1rem; } .shop-feature { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); align-items:center; } .shop-products { grid-template-columns:minmax(0,1fr); } .shop-filters { display:grid; grid-template-columns:minmax(0,1fr); gap:.375rem; } .shop-filters a { padding-block:.375rem; } }
/* Three voluntary worlds share one stable shopping layout. */
body:has(.shop-world) { --shop-ink:#24362f; --shop-accent:#f8c83f; --shop-wash:#f9eed0; --shop-sky:#bce5e5; }
body[data-shop-theme="storm"] { --shop-ink:#25274b; --shop-accent:#f2c65a; --shop-wash:#e7e7f5; --shop-sky:#949ecc; }
body[data-shop-theme="curious"] { --shop-ink:#3b2540; --shop-accent:#f0ab89; --shop-wash:#f2e9e1; --shop-sky:#c4d8b3; }
.shop-world { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding:1.25rem 0; color:var(--shop-ink); }
.shop-world-buttons,.shop-discovery { display:flex; flex-wrap:wrap; gap:.625rem; margin-top:.75rem; }
.shop-world button,.shop-discovery button,.shop-discovery a { display:inline-flex; align-items:center; justify-content:center; min-height:2.75rem; min-width:2.75rem; border:2px solid var(--shop-ink); padding:.625rem 1rem; border-radius:2rem; color:var(--shop-ink); background:transparent; font:inherit; font-size:1rem; text-decoration:none; cursor:pointer; }
.shop-world [aria-pressed="true"],.shop-discovery a { background:var(--shop-ink); color:#fff; }
.shop-world p { font-size:1rem; align-self:end; }
.shop-intro { background:var(--shop-wash); color:var(--shop-ink); border:2px solid var(--shop-ink); border-radius:1.5rem; padding:clamp(1rem,3vw,2.5rem); grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:1.5rem; margin-bottom:2rem; }
.shop-intro h1 { font-size:clamp(2.75rem,5vw,5rem); }
.shop-intro h1 em { color:var(--shop-ink); text-decoration:underline; text-decoration-color:var(--shop-accent); text-decoration-thickness:.14em; text-underline-offset:.12em; }
.shop-intro .shop-hero-note { font-size:.875rem; margin-top:1.25rem; }
.shop-weather { position:relative; background:var(--shop-sky); border:2px solid var(--shop-ink); border-radius:48% 48% 1rem 1rem; overflow:hidden; }
.shop-weather svg { display:block; width:100%; height:auto; }
.weather-orbit { fill:none; stroke:var(--shop-ink); stroke-dasharray:4 9; }
.weather-sun { stroke:var(--shop-ink); stroke-width:5; fill:var(--shop-accent); stroke-linecap:round; }
.weather-face { fill:none; }
.weather-cloud { fill:#fffdf6; stroke:var(--shop-ink); stroke-width:5; }
.weather-bolt { fill:var(--shop-accent); stroke:var(--shop-ink); stroke-width:4; }
.weather-rain { stroke:var(--shop-ink); stroke-width:5; stroke-linecap:round; }
.weather-hill-back { fill:#607e68; }.weather-hill { fill:#304c40; }
.weather-notebook { fill:#fff5d9; stroke:var(--shop-ink); stroke-width:4; }
.weather-trail { fill:none; stroke:#fff5d9; stroke-width:8; stroke-dasharray:10 8; }
.weather-stamp { display:block; position:absolute; bottom:3.75rem; left:1rem; background:#fff5d9; color:#24362f; border:2px solid #24362f; border-radius:50%; padding:.75rem; font-size:.875rem; font-weight:800; max-width:10rem; text-align:center; transform:rotate(-8deg); }
.weather-caption { display:block; background:var(--shop-ink); color:#fff; font-size:.875rem; padding:.75rem 1rem; line-height:1.5; }
body[data-shop-theme="curious"] .shop-intro { border-radius:0; background-image:linear-gradient(#3b25400a 1px,transparent 1px); background-size:100% 1.5rem; }
body[data-shop-theme="curious"] .shop-weather { border-radius:1rem; }
body[data-shop-theme="storm"] .weather-hill-back { fill:#64648c; }
body[data-shop-theme="storm"] .weather-hill { fill:#353654; }
body:has(.shop-world) .merch-card { border-radius:1rem; border-color:var(--shop-ink); overflow:hidden; background:var(--shop-wash); }
body:has(.shop-world) .shop-bag { border:2px solid var(--shop-ink); border-radius:1rem; }
.shop-world button:focus-visible,.shop-discovery :focus-visible,.merch-card:focus-visible { outline:3px solid var(--shop-ink); outline-offset:4px; }
.shop-category { display:grid; gap:.5rem; max-width:26rem; font-size:1rem; }.shop-category select { min-width:0; width:100%; min-height:2.75rem; font:inherit; padding:.625rem; }
@media(max-width:700px) { .shop-intro { grid-template-columns:minmax(0,1fr); }.shop-weather { max-width:30rem; width:100%; justify-self:center; }.shop-world-buttons button { flex:1 1 8rem; }.shop-intro h1 { margin-top:.75rem; }.shop-world p { margin:0; } }
@media(prefers-reduced-motion:reduce) { body:has(.shop-world) * { scroll-behavior:auto; animation:none; transition:none; } }
/* Phone comparison revision: show the illustration before the headline. */
@media(max-width:700px) { .shop-weather { order:-1; max-width:18rem; }.shop-weather svg { max-height:13rem; }.weather-stamp { bottom:3.5rem; max-width:7rem; padding:.5rem; }.shop-intro { gap:1rem; } }

.shop-feature-pick { display:inline-flex; align-items:center; min-height:2.75rem; font-size:1rem; color:var(--shop-ink); }

.merch-image > .merch-render-label { right:.875rem; max-width:calc(100% - 1.75rem); width:fit-content; box-sizing:border-box; line-height:1.5; background:#fffdf6; color:#24362f; }
.merch-source-toggle,.merch-sharing button { min-width:2.75rem; min-height:2.75rem; font:inherit; font-size:1rem; line-height:1.5; cursor:pointer; }
.merch-source-toggle { display:block; width:100%; padding:.75rem; background:var(--shop-wash,#faf8f1); color:var(--shop-ink,#24362f); border:1px solid currentColor; }
.merch-source-toggle[hidden] { display:none; }
.merch-sharing { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1rem; }
.merch-sharing > a { display:inline-flex; align-items:center; min-height:2.75rem; min-width:2.75rem; font-size:1rem; }
.shop-layout .merch-sharing button { width:auto; max-width:100%; flex:1 1 8rem; }
.merch-sharing .merch-share-status { width:100%; margin:0; overflow-wrap:anywhere; font-size:.875rem; }
.merch-source-toggle:focus-visible,.merch-sharing :focus-visible { outline:3px solid var(--shop-ink,#24362f); outline-offset:3px; }
/* Product-first browsing: one shared collection, with optional brand refinement. */
.shop-atmosphere { margin-block:1rem; }
.shop-atmosphere > summary { min-height:2.75rem; display:flex; align-items:center; cursor:pointer; font-size:1rem; }
.shop-intro { grid-template-columns:minmax(0,2fr) minmax(0,1fr); padding:1.5rem; gap:1.5rem; }
.shop-intro h1 { font-size:clamp(2.5rem,4vw,4rem); margin-block:.5rem 1rem; }
.shop-intro .shop-hero-note { margin-block:.5rem; }
.shop-weather { max-width:20rem; justify-self:end; }
.shop-membership { margin-bottom:2rem; }
.shop-browse h2 { font-size:clamp(1.75rem,3vw,2.5rem); margin-block:.5rem 1rem; }
.shop-filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-block:1rem 1.5rem; }
.shop-filters a { border:1px solid var(--pine); border-radius:2rem; padding:.5rem 1rem; gap:.5rem; box-sizing:border-box; }
.shop-filters [aria-current="true"] { background:var(--pine); color:var(--paper); }
.shop-filters a span { font-size:.875rem; }
.shop-category { max-width:26rem; }
#shop-results { font-size:1rem; margin-block:1rem 1.5rem; }
.shop-layout { grid-template-columns:minmax(0,1fr); }
.shop-products { display:block; }
.shop-type-group { margin-bottom:3rem; scroll-margin-top:1rem; }
.shop-type-group[hidden] { display:none; }
.shop-type-heading { display:flex; flex-wrap:wrap; align-items:baseline; gap:1rem; margin-bottom:1rem; border-bottom:1px solid var(--rule); }
.shop-type-heading h2 { font-size:2rem; margin-block:.5rem; }
.shop-type-heading span { font-size:1rem; }
.shop-type-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
.shop-type-grid > * { min-width:0; }
.shop-bag { position:static; max-width:42rem; }
.merch-card-copy { padding:1rem; }
.merch-image { aspect-ratio:auto; display:flex; flex-direction:column; }
.merch-image img { aspect-ratio:1200 / 1280; height:auto; display:block; }
.merch-image > span { position:static; align-self:start; margin:.5rem 1rem 0; }
.merch-image > .merch-render-label { position:static; max-width:none; width:auto; margin:.5rem 1rem .75rem; padding:0; background:transparent; }
.shop-type-grid .merch-render-label { font-size:.875rem; margin:.5rem 1rem 0; }
.shop-type-grid .merch-source-toggle { border:0; border-bottom:1px solid var(--rule); background:transparent; text-align:left; padding:.25rem 1rem; font-size:.875rem; text-decoration:underline; text-underline-offset:.2em; }
.merch-card-copy h2 { overflow-wrap:anywhere; }
@media(max-width:1000px) { .shop-type-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) {
 .shop-intro { grid-template-columns:minmax(0,1fr); padding:1rem; }
 .shop-weather { display:none; }
 .shop-intro h1 { font-size:2.75rem; }
 .shop-filters a { flex:0 1 auto; }
 .shop-type-grid { grid-template-columns:minmax(0,1fr); gap:1.25rem; }
 .shop-membership { padding-block:1rem; }
 .shop-type-heading h2 { font-size:1.75rem; }
 .shop-category { max-width:100%; }
 .shop-intro .shop-feature-pick { display:none; }
}