:root{--v-disp:var(--sans);--v-r:var(--r,10px);--v-rl:22px;--v-gap:var(--s-5);--v-head:72px;--v-bg:color-mix(in oklab,var(--accent) 4%,var(--bg));--v-sh:0 14px 36px -18px rgb(0 0 0/.32)}
html[data-fp="4"]{--v-disp:var(--serif)}
html{scroll-padding-top:calc(var(--v-head) + var(--s-4))}
html:root body{display:block;background:var(--v-bg)}
.lede{color:var(--ink-2)}
#top{position:sticky;top:0;z-index:30;height:auto;min-height:0;padding:var(--s-3) var(--gutter) 0;margin:0;max-width:none;border:0;background:none}
#top > .bar{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:var(--s-5);max-width:calc(var(--page) - 2 * var(--gutter));min-height:60px;margin:0 auto;padding:var(--s-2) var(--s-2) var(--s-2) var(--s-5);height:auto;position:static;text-align:left;border:1px solid var(--line);border-radius:var(--r-pill);background:color-mix(in oklab,var(--surface) 86%,transparent);box-shadow:var(--v-sh);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px)}
#top .brand-name{margin:0 auto 0 0;font:700 1.25rem/1.1 var(--v-disp);letter-spacing:-.03em;color:var(--ink);white-space:nowrap;justify-self:auto;position:static}
#top .sh-links{display:flex;gap:var(--s-1) var(--s-5);margin:0}
#top .sh-links a{font:500 var(--t-sm)/1.4 var(--sans);color:var(--ink-2);padding:10px 0}
#top .sh-links a:hover{color:var(--ink)}
#cart-link{text-transform:none;letter-spacing:0;position:static;min-height:44px;padding:0 var(--s-2) 0 var(--s-4);gap:var(--s-2);border-radius:var(--r-pill);border-color:var(--line);background:var(--surface);font:600 var(--t-sm)/1 var(--sans);color:var(--ink);writing-mode:horizontal-tb}
#badge{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border-radius:var(--r-pill);background:var(--accent);color:var(--on-accent);font:700 var(--t-xs)/1 var(--sans)}
#shop{display:block;padding:0 var(--gutter);max-width:var(--page);margin-inline:auto;gap:0}
#shop > section{padding:0;margin:0;border:0;background:none;min-height:0;max-height:none;overflow:visible;order:0}
#shop > #hero{padding-block:var(--s-6) var(--s-6)}
#hero > .hero-in{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,7fr);gap:var(--s-8);align-items:center;max-width:none;min-height:0;padding:0;background:none}
#hero .hero-text{color:var(--ink);border-radius:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4);justify-items:start;align-content:center;max-width:none;padding:0;margin:0;background:none;box-shadow:none;text-align:left;grid-column:auto;grid-row:auto}
#hero .hero-text > *{grid-column:1;grid-row:auto;margin:0;justify-self:start;position:static;text-align:left}
#hero .kicker{display:flex;align-items:center;gap:var(--s-3);padding:0;background:none;border-radius:0;box-shadow:none;color:var(--accent);font:600 var(--t-sm)/1.3 var(--sans);letter-spacing:.02em;text-transform:none}
#hero .kicker::before{content:"";width:28px;height:2px;flex:none;background:currentColor}
#hero h1{font:600 clamp(2.5rem,1.2rem + 3.6vw,4.25rem)/1.02 var(--v-disp);letter-spacing:-.045em;color:var(--ink);max-width:14ch;text-wrap:balance;text-transform:none;text-decoration:none;border:0;padding:0}
#hero .lede{color:var(--ink-2);font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);line-height:1.55;max-width:40ch;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
#hero .hero-cta{margin-top:var(--s-2)}
#hero .hero-cta .btn{background:var(--accent);color:var(--on-accent);border-color:transparent;text-transform:none;letter-spacing:0;min-height:52px;padding:0 var(--s-6);border-radius:var(--r-pill);font:600 var(--t-md)/1 var(--sans);box-shadow:var(--v-sh)}
#hero::before,#hero::after,#hero .hero-in::before,#hero .hero-in::after{content:none}
#hero .hero-cta .btn:hover{background:var(--hover)}
#hero .kv-art{position:relative;inset:auto;z-index:auto;opacity:1;display:block;width:100%;height:clamp(320px,48vh,430px);min-height:0;max-height:none;margin:0;border-radius:28px;overflow:hidden;order:0;box-shadow:none;grid-column:auto;grid-row:auto;background:var(--sunk)}
#hero .hero-photo img{transition:transform 1.2s var(--ease)}
#hero .hero-credit{border-radius:var(--v-r) 0 0 0}
#shop > .cat{scroll-margin-top:var(--v-head);padding-bottom:var(--s-9)}
#tools{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--s-2) var(--s-6);padding:0 0 var(--s-4);margin:0;border-bottom:1px solid var(--line)}
#tools > .chips{grid-column:1;grid-row:1}#tools > .count{grid-column:1;grid-row:2;margin:0}#tools > #fdet{grid-column:2;grid-row:1 / span 2}
.chips{display:flex;flex-wrap:wrap;gap:var(--s-2);min-width:0}
.chip{text-transform:none;letter-spacing:0;min-height:44px;padding:0 var(--s-5);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);color:var(--ink);font:500 var(--t-sm)/1 var(--sans);cursor:pointer;transition:background-color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease),color var(--dur-2) var(--ease)}
.chip:hover{border-color:var(--edge)}
.chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
#fdet{position:static;display:block;margin:0;padding:0;border:0;background:none;box-shadow:none;grid-row:auto;min-width:0}
#fdet > summary{display:none}
#fdet > .filters{display:flex;flex-wrap:nowrap;align-items:flex-end;gap:var(--s-3);padding:0;border:0}
#fdet .f{display:grid;gap:6px;flex:0 1 200px;min-width:0}
#fdet .f:has(#cat){display:none}
:is(#fdet,#grid .field) label{font:600 var(--t-xs)/1.2 var(--sans);letter-spacing:.04em;color:var(--ink-2)}
#fdet :is(input,select){min-height:44px;border-color:var(--line);border-radius:var(--r-pill);padding-inline:var(--s-4);background:var(--surface)}
.products,.lines{list-style:none;margin:0;padding:0}
#shop #grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:var(--s-8) var(--v-gap);padding:0;margin:var(--s-5) 0 0;grid-auto-flow:row;border:0;background:none}
#grid > .prod > *{grid-column:auto;grid-row:auto;align-self:stretch;justify-self:stretch;text-align:left;margin-inline:0;width:auto}
#grid > .prod{position:relative;container-type:inline-size;display:flex;flex-direction:column;gap:var(--s-1);min-width:0;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;grid-column:auto;grid-row:auto}
#grid .thumb{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:4/5;max-height:none;height:auto;margin:0 0 var(--s-3);border-radius:var(--v-rl);background:var(--sunk);color:var(--ink-2);overflow:hidden;order:0}
#grid .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
#grid .thumb svg{width:56%;height:auto}
#grid .thumb .emo{display:grid;place-items:center;width:100%;height:100%;background:color-mix(in oklab,var(--accent) 14%,var(--surface));color:color-mix(in oklab,var(--accent) 80%,var(--ink));font:600 clamp(2.6rem,9vw,3.6rem)/1 var(--serif)}
#grid > .prod:hover .thumb img{transform:scale(1.03)}
#grid h3{margin:0;font:500 var(--t-md)/1.3 var(--v-disp);letter-spacing:-.015em;color:var(--ink);text-transform:none;border:0;padding:0}
#grid .row{display:flex;align-items:baseline;gap:var(--s-2);margin:0;order:0}
#grid .price{font:700 var(--t-md)/1.3 var(--sans);color:var(--ink)}
#grid .st{margin:0;font:600 var(--t-xs)/1.2 var(--sans)}
#grid .st.good{display:none}
#grid .st:is(.warn,.bad){position:absolute;top:var(--s-3);left:var(--s-3);z-index:1;padding:6px 12px;border-radius:var(--r-pill);background:var(--surface);color:var(--ink);letter-spacing:.02em}
#grid .blurb{margin:0;font-size:var(--t-sm);line-height:1.5;color:var(--ink-2)}
#grid .field{display:flex;align-items:center;gap:var(--s-2);margin-top:var(--s-1)}
#grid .field select{field-sizing:fixed;flex:1;min-width:0;min-height:40px;padding:6px 4px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;font-size:var(--t-sm)}
#grid > .prod > .btn{text-transform:none;letter-spacing:0;position:absolute;left:var(--s-3);right:var(--s-3);top:calc(125cqw - 56px);z-index:1;min-height:44px;margin:0;border:0;border-radius:var(--r-pill);background:var(--ink);color:var(--bg);font:600 var(--t-sm)/1 var(--sans);box-shadow:var(--v-sh);transition:background-color var(--dur-2) var(--ease),color var(--dur-2) var(--ease),transform var(--dur-2) var(--ease)}
#grid > .prod > .btn:hover:not(:disabled){background:var(--accent);color:var(--on-accent);transform:translateY(-2px)}
#grid > .prod > .btn:disabled{opacity:1;color:var(--ink-2);background:var(--surface)}
.credits{margin:var(--s-7) 0 0;font-size:var(--t-xs);color:var(--ink-2)}.credits a{color:inherit}
.empty{display:grid;gap:var(--s-2);justify-items:start;padding-block:var(--s-6)}
.count,.note,.empty p,.opt{margin:0;font-size:var(--t-sm);color:var(--ink-2)}
.empty .empty-h{font:600 var(--t-lg)/1.3 var(--v-disp);color:var(--ink)}
#shop > #cart{position:fixed;inset:var(--s-3) var(--s-3) var(--s-3) auto;z-index:40;display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:start;gap:var(--s-4);width:min(440px,calc(100% - 2 * var(--s-3)));height:auto;max-height:none;margin:0;padding:var(--s-6);overflow:auto;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:0 0 0 100vmax var(--scrim),var(--shadow-dialog);transition:transform var(--dur-3) var(--ease)}
@starting-style{#shop > #cart[data-kv-drawer=open]{transform:translateX(24px)}}
#shop > #cart[data-kv-drawer=closed],#cart > .kv-tab{display:none}
#cart > :not(h2,.kv-x){grid-column:1 / -1}
#cart:focus{outline:none}
:is(#cart,#co) h2{margin:0;align-self:center;font:600 var(--t-xl)/1.2 var(--v-disp);letter-spacing:-.03em}
#cart .kv-x{min-height:44px;padding:0 var(--s-4);border-radius:var(--r-pill)}
.lines li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-2) var(--s-3);align-items:center;padding-block:var(--s-4);border-bottom:1px solid var(--line)}
.ln{margin:0;font-weight:600;overflow-wrap:anywhere}
.lines .price{margin:0;font:700 var(--t-md)/1.2 var(--sans)}
.step{display:inline-flex;justify-self:start;align-items:center;border:1px solid var(--line);border-radius:var(--r-pill)}
.step button{width:44px;min-height:44px;border:0;background:none;color:var(--ink);font:600 var(--t-lg)/1 var(--sans);cursor:pointer;border-radius:var(--r-pill)}
.step button:disabled{opacity:.45}
.step output{min-width:2ch;text-align:center}
.lines .btn-ghost{justify-self:end}
.sum{display:grid;grid-template-columns:1fr auto;gap:var(--s-2) 0;margin:0}
.sum dt{color:var(--ink-2)}.sum dd{margin:0;padding-left:var(--s-3);text-align:right}
.sum .tot{padding-top:var(--s-3);margin-top:var(--s-1);border-top:1px solid var(--line);color:var(--ink);font:700 var(--t-lg)/1.3 var(--sans)}
#checkout{min-height:52px;border-radius:var(--r-pill);font-size:var(--t-md)}
.co,.fields{display:grid;gap:var(--s-4)}
.field{display:grid;gap:6px}
dialog[open]{width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;padding:var(--s-6);border-radius:24px}
.acts{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--s-3);padding-top:var(--s-4);border-top:1px solid var(--line)}
.acts .btn{border-radius:var(--r-pill)}
.local-note{margin:var(--s-2) 0 0;font-size:var(--t-sm);color:var(--ink-2)}
.toast{border-radius:var(--r-pill);padding:12px 20px;font-weight:500}
.band{background:color-mix(in oklab,var(--accent) 9%,var(--bg));border-block:1px solid var(--line)}
.band-in{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:var(--s-6) var(--s-7);margin:0 auto;padding-block:var(--s-9);list-style:none}
.band-in li{display:grid;align-content:start;gap:var(--s-2);padding-top:var(--s-4);border-top:1px solid var(--line)}
.band-n{font:600 var(--t-sm)/1 var(--sans);color:var(--accent);letter-spacing:.06em}
.band-in b{font:600 var(--t-lg)/1.25 var(--v-disp);letter-spacing:-.02em;color:var(--ink)}
.band-t{color:var(--ink-2);font-size:var(--t-sm);line-height:1.55;max-width:34ch}
.has-band .sh-about .sh-points{display:none}
body > .sh-sec{padding-block:var(--s-9);border-top:0}
body > .sh-sec + .sh-sec{border-top:1px solid var(--line)}
.sh-sec h2{font:600 clamp(2rem,1.4rem + 1.8vw,3rem)/1.05 var(--v-disp);letter-spacing:-.04em;margin:0 0 var(--s-4)}
.sh-about{gap:var(--s-8)}
.sh-about p.sh-text{font-size:var(--t-lg);line-height:1.6}
.sh-about figure{border-radius:28px}
.sh-about figure img{height:clamp(260px,44vh,440px)}
.sh-points li{box-shadow:none;border:0;border-top:1px solid var(--line);border-radius:0;background:none;padding-inline:0}
.sh-contact a{font-weight:600}
.sh-foot{margin-top:0;padding-block:var(--s-7) var(--s-8);border-top:1px solid var(--line);color:var(--ink-2)}
.sh-foot b{font:700 var(--t-lg)/1.2 var(--v-disp);letter-spacing:-.02em;color:var(--ink)}
.sh-foot p{margin:0}
:where(main section:not([id],[class]),body > section:not([class])){padding-block:var(--s-8)}
:where(main section:not([id],[class]) h2,body > section:not([class]) h2){font:600 clamp(1.75rem,1.3rem + 1.4vw,2.5rem)/1.1 var(--v-disp);letter-spacing:-.04em}
:where(main article,main section:not([id],[class]) li){border-radius:var(--v-rl)}
:where(main button:not([class])){min-height:44px;padding:0 var(--s-5);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);color:var(--ink)}
@media (min-width:901px){
#hero .kicker,#hero .lede{max-width:46ch}
#hero h1{font-size:clamp(3rem,1rem + 3.4vw,4rem);max-width:18ch}
#grid h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:900px){#hero > .hero-in{grid-template-columns:minmax(0,1fr);gap:var(--s-5)}#hero .kv-art{order:-1;height:clamp(260px,40vh,420px)}#hero .kv-art:not(:has(img)){height:180px}#shop > #hero{padding-block:var(--s-4) var(--s-7)}}
@media (max-width:700px){
#top .sh-links{display:none}
#tools{grid-template-columns:minmax(0,1fr);gap:var(--s-2);border-bottom:0;padding:0}
#tools > #fdet{grid-column:1;grid-row:2;border:1px solid var(--line);border-radius:var(--r-pill);padding:0 var(--s-4);background:var(--surface)}
#tools > .count{grid-row:3;margin-top:var(--s-1)}
.chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter)}
.chip{flex:0 0 auto}
#fdet[open]{border-radius:22px}
#fdet > summary{display:flex;align-items:center;min-height:44px;font:600 var(--t-sm)/1 var(--sans);color:var(--ink-2);cursor:pointer}
#fdet[open] > summary{border-bottom:1px solid var(--line);margin-bottom:var(--s-3)}
#fdet > .filters{flex-wrap:wrap;padding-bottom:var(--s-4)}
#fdet .f{flex:1 1 100%}
}
@media (max-width:560px){
:root{--v-head:64px;--v-gap:var(--s-3);--v-rl:16px}
#top{padding-top:var(--s-2)}
#top > .bar{gap:var(--s-3);min-height:52px;padding-left:var(--s-4)}
#shop > #hero{padding-block:var(--s-3) var(--s-6)}
#hero > .hero-in{gap:var(--s-4)}
#hero .kv-art{height:30vh;min-height:220px;border-radius:22px}
#hero .hero-text{gap:var(--s-3)}
#hero h1{font-size:2.5rem}
#hero .lede{-webkit-line-clamp:2;font-size:var(--t-md)}
#hero .hero-cta,#hero .hero-cta .btn{width:100%}
#shop #grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--s-6)}
#grid .thumb{margin-bottom:var(--s-2)}
#grid h3{font-size:var(--t-sm)}
#grid .blurb{display:none}
#grid > .prod > .btn{left:var(--s-2);right:var(--s-2);top:calc(125cqw - 52px);font-size:var(--t-xs);padding:0 var(--s-2)}
#grid .st:is(.warn,.bad){top:var(--s-2);left:var(--s-2);padding:5px 8px}
body > .sh-sec{padding-block:var(--s-8)}
.band-in{padding-block:var(--s-7)}
#shop > #cart{inset:0 0 0 auto;width:100%;border-radius:0;border-width:0 0 0 1px;padding:var(--s-4)}
}
@media (prefers-reduced-motion:reduce){#grid .thumb img,#hero .hero-photo img,#grid > .prod > .btn{transition:none}#grid > .prod:hover .thumb img{transform:none}}
.hero-photo{position:absolute;inset:0;z-index:1;margin:0;overflow:hidden;background:transparent}
.hero-photo img{display:block;width:100%;height:100%;object-fit:cover}
.hero-credit{position:absolute;inset:auto 0 0 auto;z-index:2;margin:0;padding:2px 10px;font-size:.7rem;line-height:1.5;color:#fff;background:rgba(0,0,0,.62)}
.hero-credit:empty{display:none}#hero .hero-credit,#hero .hero-credit a{color:#fff}.hero-credit a{color:inherit;display:inline-flex;align-items:center;min-height:44px}
html[data-l-fs] [data-sec=hero] [data-hero-media] > .hero-photo:not([hidden]){display:block}
html{scrollbar-gutter:stable}@media (max-width:600px){a[href]:not(p a,li p a,blockquote a,figcaption a,td a,dd a,label a),button,[role=button],[onclick],summary,select,input:not([type=hidden],[type=checkbox],[type=radio],[type=range]){min-height:44px!important;min-width:44px!important}input[type=range]{min-height:44px}:where(a[href]:not(p a,li p a,blockquote a,figcaption a,td a,dd a,label a)){display:inline-flex;align-items:center;justify-content:center}input,select,textarea{font-size:max(16px,1em)!important}}

@media (max-width:600px){#grid h3{white-space:normal;overflow:visible;text-overflow:clip}}
