/* Asto Shop look for Amy's Harmonic Shop: the look of music.nerdsystems.com (Music Creative Solutions), drawn by hand for
   this store by Nerd Systems. Paper ground, walnut furniture, brass as the one interactive accent, the five-line stave as
   the divider. Fraunces and Manrope: SIL Open Font License 1.1, self-hosted (fonts/). The page bodies are the storefront's
   own markup; store.js runs on it unchanged. */
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-latin-full-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-latin-full-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"Manrope";src:url(fonts/manrope-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}

:root{
  --paper:#FBF6EC; --paper-2:#F4EBD9; --paper-3:#EADCC2; --paper-4:#DFCEAF; --white:#FFFEFB;
  --ink:#1E1811; --ink-2:#55483A; --ink-3:#6F604E;
  --walnut:#241A12; --walnut-2:#33241A; --walnut-line:#4A3625; --walnut-ink:#EFE3CE; --walnut-ink-2:#C2B196;
  --brass:#A9782A; --brass-deep:#8A6120; --brass-dark:#6E4E18; --brass-lit:#E6B44E;
  --felt:#8E3B36; --felt-lit:#D2756A; --ok:#3F5F2E; --ok-bg:#E9EFD9;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --text:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1180px; --gut:clamp(1.15rem,4.6vw,3rem); --r:10px; --r-lg:16px;
  --ease:cubic-bezier(.16,1,.3,1);
  --shadow-1:0 1px 2px rgba(36,26,18,.06),0 4px 14px -6px rgba(36,26,18,.14);
  --shadow-2:0 2px 4px rgba(36,26,18,.08),0 18px 44px -18px rgba(36,26,18,.30);
  --shadow-3:0 3px 6px rgba(10,6,3,.30),0 30px 70px -24px rgba(10,6,3,.60);
  --stave:repeating-linear-gradient(to bottom,var(--paper-4) 0 1px,transparent 1px 8px);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--paper);scrollbar-color:var(--paper-4) var(--paper-2)}
body{margin:0;min-width:320px;min-height:100vh;display:flex;flex-direction:column;background:var(--paper);color:var(--ink);
  font:450 17px/1.62 var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
svg{display:block}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
p{margin:0 0 1em;text-wrap:pretty}
strong,b{font-weight:800}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.08;letter-spacing:-.024em;margin:0 0 .6em;text-wrap:balance;
  font-variation-settings:"SOFT" 12,"WONK" 0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px;border-radius:4px}
::selection{background:var(--brass);color:var(--paper)}
.skip{position:absolute;left:-999px;top:10px;z-index:200;background:var(--ink);color:var(--paper);padding:.7rem 1.1rem;border-radius:8px;text-decoration:none}
.skip:focus{left:var(--gut)}
.price{font-variant-numeric:tabular-nums lining-nums}
.nw{white-space:nowrap}
[hidden]{display:none!important}
.mono{width:30px;height:30px;color:var(--brass)}

/* ---------------------------------------------------------------- header: the music site's paper bar */
.o-top{position:sticky;top:0;z-index:60;background:rgba(251,246,236,.9);backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2);
  border-bottom:1px solid var(--paper-3)}
.o-top-in{display:flex;flex-wrap:wrap;align-items:center;gap:0 1.4rem;width:min(100% - var(--gut)*2,var(--wrap));margin-inline:auto}
.o-brand,.o-acts{min-height:70px}
.o-brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:0 0 auto;min-width:0}
.o-brand img,.o-brand .logo{height:38px;width:auto;max-width:150px;object-fit:contain}
.o-brand .mono{width:34px;height:34px}
.o-name{font-family:var(--display);font-weight:600;font-size:1.2rem;letter-spacing:-.02em;line-height:1.1;font-variation-settings:"SOFT" 18,"opsz" 36;white-space:nowrap}
.o-nav{order:3;width:100%;min-width:0;border-top:1px solid var(--paper-3)}
.o-nav ul{display:flex;align-items:center;justify-content:center;gap:.2rem 1.1rem;margin:0;padding:.35rem 0;list-style:none}
.o-nav a{position:relative;display:block;padding:.5rem .62rem;border-radius:6px;text-decoration:none;font-size:.9rem;font-weight:650;color:var(--ink-2);white-space:nowrap;
  transition:color .18s var(--ease)}
.o-nav a::after{content:"";position:absolute;left:.62rem;right:.62rem;bottom:.3rem;height:1.5px;background:var(--brass);transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--ease)}
.o-nav a:hover{color:var(--ink)}
.o-nav a:hover::after,.o-nav a[aria-current]::after{transform:scaleX(1)}
.o-acts{display:flex;align-items:center;gap:.5rem;flex:0 0 auto;margin-left:auto}
.o-orders{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .7rem;border-radius:8px;text-decoration:none;font-size:.88rem;font-weight:700;color:var(--ink-2);
  transition:color .18s var(--ease),background .18s var(--ease)}
.o-orders:hover{color:var(--ink);background:var(--paper-2)}
.o-orders .ico svg,.o-bag .ico svg{width:19px;height:19px}
.o-bag{position:relative;display:inline-flex;align-items:center;gap:.5rem;height:44px;padding:0 1.05rem;border:0;border-radius:8px;background:var(--brass-deep);color:var(--paper);
  font-weight:800;font-size:.92rem;box-shadow:var(--shadow-1);transition:background .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease)}
.o-bag:hover{background:var(--brass-dark);transform:translateY(-1px);box-shadow:var(--shadow-2)}
.o-n{display:inline-grid;place-items:center;min-width:1.45rem;height:1.45rem;padding:0 .35rem;border-radius:99px;background:var(--brass-lit);color:#20170A;
  font-size:.75rem;font-weight:800;font-variant-numeric:tabular-nums}
.o-n.bump{animation:bump .6s var(--ease)}
@keyframes bump{0%{transform:scale(.6)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
@media (max-width:980px){
  .o-brand,.o-acts{min-height:62px}
  .o-nav{margin:0 calc(var(--gut)*-1);width:calc(100% + var(--gut)*2);overflow-x:auto;scrollbar-width:none;border-top:0;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--gut),#000 calc(100% - var(--gut)),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 var(--gut),#000 calc(100% - var(--gut)),transparent)}
  .o-nav::-webkit-scrollbar{display:none}
  .o-nav ul{justify-content:flex-start;padding:.1rem var(--gut) .6rem;gap:.35rem}
  .o-nav a{padding:.4rem .8rem;border:1px solid var(--paper-4);border-radius:99px;font-size:.84rem;background:var(--paper)}
  .o-nav a::after{display:none}
  .o-nav a:hover{border-color:var(--brass)}
}
@media (max-width:640px){.o-orders span:not(.ico){display:none}}
@media (max-width:520px){
  .o-name{font-size:1.04rem;white-space:normal;max-width:9.5em}
  .o-brand img,.o-brand .logo{height:32px}
  .o-bag{height:40px;padding:0 .8rem}
  .o-bag-w{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .o-orders{padding:.5rem}
}

/* ---------------------------------------------------------------- main, pages */
.o-main{flex:1 0 auto;width:100%}
.o-page{width:min(100% - var(--gut)*2,var(--wrap));margin:0 auto;padding:clamp(1.8rem,4vw,3rem) 0 clamp(3.5rem,7vw,5.5rem)}
.cat .o-page,.product .o-page{padding-top:clamp(1.4rem,3vw,2.2rem)}

/* buttons: brass-deep on paper, as on the music site */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.75rem 1.4rem;border:1px solid transparent;border-radius:8px;
  background:var(--brass-deep);color:var(--paper)!important;font-family:var(--text);font-weight:800;font-size:.95rem;letter-spacing:.005em;line-height:1.2;
  text-decoration:none;white-space:nowrap;box-shadow:var(--shadow-1);cursor:pointer;
  transition:transform .18s var(--ease),background .18s var(--ease),box-shadow .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease)}
.btn:hover{background:var(--brass-dark);color:#FFFDF7!important;transform:translateY(-1px);box-shadow:var(--shadow-2)}
.btn:active{transform:none}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.btn.wide{display:flex;width:100%;min-height:56px;font-size:1.02rem}
.btn.sm{min-height:38px;padding:.45rem .95rem;font-size:.86rem}
.btn.ghost{background:transparent;border-color:var(--paper-4);color:var(--ink)!important;box-shadow:none}
.btn.ghost:hover{background:var(--paper-2);border-color:var(--brass);color:var(--ink)!important}
.btn[disabled],.btn:disabled{opacity:.45;pointer-events:none}
.btn.busy{pointer-events:none;color:transparent!important;position:relative}
.btn.busy::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid var(--paper);border-right-color:transparent;animation:spin .8s linear infinite}
.btn.ghost.busy::after{border-color:var(--ink);border-right-color:transparent}
@keyframes spin{to{transform:rotate(360deg)}}
.link{display:inline-flex;align-items:center;gap:.4rem;color:var(--brass-deep);font-weight:800;text-decoration:none}
.link svg{width:16px;height:16px;transition:transform .25s var(--ease)}
.link:hover svg{transform:translateX(4px)}
.link:hover{text-decoration:underline}
.icon-btn{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--paper-4);background:var(--white);color:var(--ink);
  transition:border-color .18s var(--ease),background .18s var(--ease),color .18s var(--ease)}
.icon-btn:hover{border-color:var(--brass);color:var(--brass-deep)}
.icon-btn svg{width:20px;height:20px}
.icon-btn:disabled{opacity:.35}
.link-btn{justify-self:start;border:0;background:none;padding:.35rem 0;color:var(--brass-deep);font-weight:800;font-size:.92rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.link-btn:hover{color:var(--brass-dark)}

/* reveals: visible by default; store.js opts in with html.motion */
.motion [data-reveal]:not(.in){opacity:0;transform:translateY(18px)}
.motion [data-reveal]{transition:opacity .9s var(--ease),transform 1s var(--ease)}

/* ---------------------------------------------------------------- home: hero */
.o-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(2rem,5vw,4.6rem);align-items:center;
  width:min(100% - var(--gut)*2,var(--wrap));margin:0 auto;padding:clamp(2.4rem,6vw,5rem) 0 clamp(3rem,6vw,5rem)}
.o-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:33px;background:var(--stave) 0 0/100% 33px no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.o-hero-media{order:2;position:relative}
.o-hero-media::before{content:"";position:absolute;inset:auto -14px -14px 14px;height:62%;border-radius:var(--r-lg);background:var(--paper-3);z-index:0}
.o-hero-media a{position:relative;z-index:1;display:block;border-radius:var(--r-lg);overflow:hidden;background:var(--white);box-shadow:var(--shadow-2);border:1px solid var(--paper-3)}
.o-hero-media img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform 1.2s var(--ease)}
.o-hero-media a:hover img{transform:scale(1.025)}
.o-hero-copy{order:1;min-width:0}
.o-title{font-size:clamp(2.7rem,6.2vw,5rem);line-height:.98;letter-spacing:-.036em;font-variation-settings:"SOFT" 18,"opsz" 144;margin:0 0 1.1rem;max-width:11ch}
.o-tag{font-family:var(--display);font-size:clamp(1.2rem,2.2vw,1.5rem);line-height:1.32;color:var(--brass-deep);font-weight:500;font-style:italic;
  font-variation-settings:"SOFT" 40,"opsz" 36;max-width:30ch;margin:0 0 1.1rem}
.o-intro{color:var(--ink-2);font-size:clamp(1rem,1.7vw,1.1rem);max-width:48ch;margin:0 0 1.7rem}
.o-hero-act{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 1.5rem}
.o-hero-act .btn{min-height:54px;padding-inline:1.7rem;font-size:1rem}
.o-hero-cap{margin:1.8rem 0 0;padding-top:1rem;border-top:1px solid var(--paper-4);display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .8rem;font-size:.88rem;color:var(--ink-3)}
.o-hero-cap::before{content:"On the cover";font-size:.7rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);width:100%}
.o-hero-cap a{color:var(--ink-2);font-weight:700;text-decoration:none}
.o-hero-cap a:hover{text-decoration:underline}
.o-hero-cap .price{font-weight:800;color:var(--ink)}
.o-hero-full .o-hero,.o-hero-banner .o-hero,.o-hero-plain .o-hero{grid-template-columns:minmax(0,1fr)}

/* ---------------------------------------------------------------- home: sections */
.o-sec{width:min(100% - var(--gut)*2,var(--wrap));margin:0 auto;padding:clamp(3rem,6.4vw,5rem) 0}
.o-h{font-size:clamp(2rem,4.8vw,3.3rem);font-variation-settings:"SOFT" 12,"opsz" 96;margin:0 0 clamp(1.4rem,3vw,2.2rem)}
.o-sec>p{color:var(--ink-2);max-width:60ch}
.o-new{border-top:1px solid var(--paper-3)}
.o-sec+.o-sec{position:relative}

/* the collection: six compartments of a music-shop wall */
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.9rem,1.8vw,1.3rem);margin:0 0 clamp(1.4rem,3vw,2rem)}
.tiles.n1,.tiles.n2,.tiles.n4{grid-template-columns:repeat(2,minmax(0,1fr))}
.tile{display:flex;flex-direction:column;text-decoration:none;background:var(--white);border:1px solid var(--paper-3);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-1);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-2);border-color:var(--brass)}
.tile .image{display:block;position:relative;aspect-ratio:1/1;background:var(--white);overflow:hidden}
.tile .image img,.tile .no-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .7s var(--ease)}
.tile:hover .image img{transform:scale(1.04)}
.tile-l{display:flex;align-items:baseline;justify-content:space-between;gap:.8rem;padding:.95rem 1.15rem 1.05rem;border-top:1px solid var(--paper-3);background:var(--paper)}
.tile-n{font-family:var(--display);font-weight:600;font-size:1.22rem;letter-spacing:-.018em;line-height:1.2;font-variation-settings:"SOFT" 10,"opsz" 36}
.tile-c{font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.tile:hover .tile-n{color:var(--brass-deep)}

/* cards: every piece on white, whole, never cropped */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:clamp(1.4rem,2.6vw,2rem) clamp(.9rem,1.8vw,1.3rem);margin:0}
.grid.loose{margin-top:clamp(1.4rem,3vw,2rem)}
.card{display:flex;flex-direction:column;gap:.55rem;min-width:0;text-decoration:none;color:var(--ink)}
.pad{position:relative;display:block;overflow:hidden;border-radius:12px;background:var(--white);border:1px solid var(--paper-3);box-shadow:var(--shadow-1);
  transition:box-shadow .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease)}
.card .pad{aspect-ratio:1/1}
.card .pad img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .7s var(--ease),opacity .5s var(--ease)}
.card .pad img.alt{opacity:0}
@media (hover:hover){.card:hover .pad{border-color:var(--brass);box-shadow:var(--shadow-2);transform:translateY(-2px)}
  .card:hover .pad img.alt{opacity:1}.card:hover .pad img:not(.alt){opacity:0}.card:hover .pad img.alt{transform:scale(1.03)}
  .card .pad img:only-child{opacity:1!important}.card:hover .pad img:only-child{transform:scale(1.04)}}
.card-t{font-family:var(--display);font-weight:600;font-size:1.03rem;line-height:1.24;letter-spacing:-.012em;font-variation-settings:"SOFT" 8,"opsz" 24;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card:hover .card-t{color:var(--brass-deep)}
.card-m{display:flex;align-items:baseline;justify-content:space-between;gap:.2rem .7rem;flex-wrap:wrap;margin-top:auto}
.card-m .price{font-weight:800;font-size:.98rem;color:var(--ink)}
.state{font-size:.72rem;font-weight:700;letter-spacing:.06em;color:var(--ink-3);white-space:nowrap}
.state.sold{color:var(--felt)}
.state.held{color:var(--brass-deep)}
.card.is-sold .pad img{filter:grayscale(.7);opacity:.6}
.card.is-sold .pad::before{content:"Sold out";position:absolute;z-index:3;left:.6rem;top:.6rem;padding:.22rem .6rem;border-radius:99px;background:var(--walnut);color:var(--walnut-ink);
  font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.no-photo{display:grid;place-items:center;width:100%;height:100%;color:var(--paper-4);background:var(--paper-2)}
.no-photo .mono{width:32%;height:auto;color:var(--paper-4)}
@media (max-width:980px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem .8rem}
  .card-t{font-size:.95rem}
  .card-m{flex-direction:column;gap:0}
  .tile-l{flex-direction:column;align-items:flex-start;gap:.1rem;padding:.75rem .85rem .85rem}
  .tile-n{font-size:1.05rem}
}

/* one of a kind */
.o-spot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.6rem,4vw,3.4rem);align-items:center;border-top:1px solid var(--paper-3)}
.o-spot-media a{display:block;border-radius:var(--r-lg);overflow:hidden;background:var(--white);border:1px solid var(--paper-3);box-shadow:var(--shadow-2)}
.o-spot-media img{width:100%;aspect-ratio:1/1;object-fit:contain;padding:6%}
.o-spot-copy h3{font-size:clamp(1.5rem,3vw,2rem)}
.o-spot-copy p{color:var(--ink-2)}
.o-spot-copy .price{font-weight:800;font-size:1.3rem;color:var(--ink)}

/* how buying works: a walnut band, like the music site's practice bench */
.o-how{width:100%;max-width:none;padding-inline:max(var(--gut),calc((100% - var(--wrap))/2));background:linear-gradient(178deg,var(--walnut-2),#1B130C);color:var(--walnut-ink)}
.o-how .o-h{color:var(--paper)}
.promise{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.4vw,1.6rem);counter-reset:pr}
.promise li{counter-increment:pr;position:relative;padding:1.5rem 1.4rem 1.4rem;border:1px solid var(--walnut-line);border-radius:12px;background:rgba(0,0,0,.22)}
.promise li::before{content:counter(pr,decimal-leading-zero);display:block;font-family:ui-monospace,"SFMono-Regular",Menlo,monospace;font-size:.78rem;color:var(--brass-lit);margin-bottom:.8rem}
.promise h3{font-size:1.28rem;color:var(--paper);margin:0 0 .45rem;font-variation-settings:"SOFT" 10,"opsz" 36}
.promise p{margin:0;color:var(--walnut-ink-2);font-size:.95rem}
@media (max-width:860px){
  .promise{grid-template-columns:1fr}.o-spot{grid-template-columns:1fr}
  .o-hero{grid-template-columns:1fr;gap:1.8rem;padding-top:1.4rem}
  .o-hero-media{order:0;margin-right:14px}
  .o-hero-media img{aspect-ratio:5/4}
  .o-title{max-width:none}
}

/* ---------------------------------------------------------------- footer: walnut, with the stave above it */
.o-foot{margin-top:auto;background:linear-gradient(178deg,#1B130C,var(--walnut-2));color:var(--walnut-ink);position:relative}
.home .o-foot::before{display:none}
.o-foot::before{content:"";position:absolute;left:0;right:0;top:-33px;height:33px;background:var(--stave) 0 0/100% 33px no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);pointer-events:none}
.o-foot-in{width:min(100% - var(--gut)*2,var(--wrap));margin:0 auto;padding:clamp(2.6rem,5vw,3.6rem) 0 2rem;display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1.3fr);gap:1.6rem clamp(1.6rem,4vw,3rem);align-items:start}
.o-foot-name{font-family:var(--display);font-weight:600;font-size:1.5rem;letter-spacing:-.02em;color:var(--paper);margin:0 0 .4rem;font-variation-settings:"SOFT" 18,"opsz" 48}
.o-foot .wink{margin:0;font-family:var(--display);font-style:italic;color:var(--walnut-ink-2)}
.o-foot-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.o-foot-nav a{color:var(--walnut-ink);text-decoration:none;font-weight:600;font-size:.95rem}
.o-foot-nav a:hover{color:var(--brass-lit);text-decoration:underline}
.o-foot .fine{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;font-size:.86rem;color:var(--walnut-ink-2);line-height:1.5}
.o-foot .fine a{color:var(--brass-lit);font-weight:800;margin-right:.3rem}
.o-credit{grid-column:1/-1;margin:.6rem 0 0;padding-top:1.2rem;border-top:1px solid var(--walnut-line);font-size:.8rem;color:var(--walnut-ink-2)}
.o-credit a{color:var(--walnut-ink)}
@media (max-width:860px){.o-foot-in{grid-template-columns:1fr 1fr}.o-foot-brand{grid-column:1/-1}}
@media (max-width:520px){.o-foot-in{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- category */
.cat-head{margin:0 0 1.4rem}
.cat-head .display{font-size:clamp(2.3rem,5.6vw,3.8rem);font-variation-settings:"SOFT" 14,"opsz" 120;letter-spacing:-.032em;margin:0 0 .5rem}
.cat-head .lede{color:var(--ink-2);font-size:clamp(1.02rem,1.8vw,1.14rem);max-width:58ch;margin:0 0 .6rem}
.count{margin:0;font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep)}
.cat-tools{display:flex;justify-content:space-between;align-items:center;gap:.8rem 1rem;flex-wrap:wrap;padding:.9rem 0;margin:0 0 clamp(1.6rem,3vw,2.2rem);
  border-top:1px solid var(--paper-3);border-bottom:1px solid var(--paper-3)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{display:inline-flex;align-items:center;height:36px;padding:0 1rem;border:1px solid var(--paper-4);border-radius:99px;background:var(--paper);text-decoration:none;
  font-size:.86rem;font-weight:700;color:var(--ink-2);transition:all .18s var(--ease)}
.chip:hover{border-color:var(--brass);color:var(--ink)}
.chip.on{background:var(--walnut);border-color:var(--walnut);color:var(--walnut-ink)}
.sort{display:flex;align-items:center;gap:.6rem;margin:0;font-size:.82rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.sort select{appearance:none;-webkit-appearance:none;height:38px;padding:0 2.4rem 0 .95rem;border:1px solid var(--paper-4);border-radius:8px;
  background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1.5 5 5 5-5' fill='none' stroke='%238A6120' stroke-width='1.6'/%3E%3C/svg%3E") right .85rem center no-repeat;
  font-size:.92rem;font-weight:650;letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer}
.sort select:hover{border-color:var(--brass)}
.empty{color:var(--ink-2)}
@media (max-width:480px){.sort label{position:absolute;left:-999px}}

/* ---------------------------------------------------------------- product */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 clamp(1.2rem,2.4vw,1.8rem);font-size:.84rem;font-weight:700;color:var(--ink-3)}
.crumbs a{color:var(--ink-3);text-decoration:none}
.crumbs a:hover{color:var(--brass-deep);text-decoration:underline}
.crumbs a+a::before{content:"/";margin-right:.5rem;color:var(--paper-4)}
.piece{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:clamp(1.8rem,4.4vw,4rem);align-items:start}
.gallery{position:relative;min-width:0}
.slides{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;
  border-radius:var(--r-lg);scrollbar-width:none;overscroll-behavior-x:contain;background:var(--white);border:1px solid var(--paper-3);box-shadow:var(--shadow-1)}
.slides::-webkit-scrollbar{display:none}
.slide{scroll-snap-align:center;aspect-ratio:1/1;position:relative;background:var(--white)}
.slide-btn{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in}
.slide img{width:100%;height:100%;object-fit:contain}
.g-ui{position:absolute;right:.8rem;top:.8rem;display:flex;align-items:center;gap:.5rem;pointer-events:none}
.g-ui>*{pointer-events:auto}
.g-count{font-size:.76rem;font-weight:800;padding:.32rem .65rem;border-radius:99px;background:rgba(251,246,236,.92);border:1px solid var(--paper-3);color:var(--ink-2);font-variant-numeric:tabular-nums}
.g-count:empty{display:none}
.g-zoom{background:rgba(251,246,236,.92)}
.thumbs{display:flex;gap:.55rem;margin-top:.8rem;overflow-x:auto;scrollbar-width:none;padding:2px}
.thumbs::-webkit-scrollbar{display:none}
.thumb{flex:none;width:68px;height:68px;padding:0;border:1px solid var(--paper-3);border-radius:10px;overflow:hidden;background:var(--white);opacity:.7;
  transition:opacity .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease)}
.thumb img{width:100%;height:100%;object-fit:contain}
.thumb:hover{opacity:1}
.thumb.on{opacity:1;border-color:var(--brass);box-shadow:0 0 0 1px var(--brass)}
.info{min-width:0}
.info-in{position:sticky;top:96px}
.piece-t{font-size:clamp(1.75rem,3.2vw,2.5rem);line-height:1.08;letter-spacing:-.028em;font-variation-settings:"SOFT" 14,"opsz" 96;margin:0 0 .8rem}
.piece-p{display:flex;align-items:baseline;gap:.4rem 1rem;flex-wrap:wrap;margin:0 0 1.4rem}
.piece-p .price{font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,2.6vw,2rem);letter-spacing:-.02em;color:var(--ink);font-variation-settings:"SOFT" 0,"opsz" 72}
.piece-p .state{font-size:.78rem}
.buy{display:grid;gap:1.1rem;padding:1.4rem 0;border-top:1px solid var(--paper-3);border-bottom:1px solid var(--paper-3)}
.opts{display:grid;gap:1.1rem}
fieldset.opt{border:0;margin:0;padding:0;min-width:0}
fieldset.opt legend{font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding:0;margin:0 0 .55rem}
.opt-chosen{color:var(--ink);letter-spacing:.02em;text-transform:none;font-size:.9rem;margin-left:.45rem}
.opt-chosen:not(:empty)::before{content:"· ";color:var(--paper-4)}
.opt-vals{display:flex;flex-wrap:wrap;gap:.45rem}
.opt-v{min-width:46px;min-height:42px;padding:.4rem .95rem;border:1px solid var(--paper-4);border-radius:99px;background:var(--white);color:var(--ink);font-size:.9rem;font-weight:700;
  transition:border-color .18s var(--ease),background .18s var(--ease),color .18s var(--ease)}
.opt-v:hover{border-color:var(--brass)}
.opt-v.on,.opt-v[aria-pressed="true"]{background:var(--walnut);border-color:var(--walnut);color:var(--walnut-ink)}
.opt-v.none{color:#9C8E7B;text-decoration:line-through;background:var(--paper-2)}
.opt-note{margin:0;font-size:.92rem;color:var(--ink-2)}
.opt-note:focus{outline:0}
.qty{display:flex;align-items:center;gap:.8rem;font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--paper-4);border-radius:99px;background:var(--white);overflow:hidden}
.stepper button{width:44px;height:42px;border:0;background:none;font-size:1.15rem;line-height:1;color:var(--ink)}
.stepper button:hover{background:var(--paper-2);color:var(--brass-deep)}
.stepper input{width:2.6rem;border:0;background:none;text-align:center;font-weight:800;font-size:1rem;letter-spacing:0;color:var(--ink);font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.qty-of{color:var(--ink-3);letter-spacing:.02em;text-transform:none;font-size:.88rem;font-weight:600}
.sold-note{margin:0;color:var(--ink-2);font-weight:700}
.desc{margin-top:1.5rem;color:var(--ink-2);font-size:1rem}
.desc p{margin:0 0 1em}
.desc p:first-child{color:var(--ink)}
.specs{margin:1.5rem 0 0;display:grid;border:1px solid var(--paper-3);border-radius:12px;overflow:hidden;background:var(--white)}
.specs div{display:grid;grid-template-columns:minmax(6rem,40%) 1fr;gap:1rem;padding:.65rem .9rem;border-top:1px solid var(--paper-3)}
.specs div:first-child{border-top:0}
.specs dt{font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding-top:.15rem}
.specs dd{margin:0;font-variant-numeric:tabular-nums lining-nums}
.ship-note{font-size:.9rem;color:var(--ink-3);margin:1.4rem 0 0;padding-top:1.1rem;border-top:1px solid var(--paper-3)}
.ship-note a{color:var(--brass-deep);font-weight:800;margin-left:.3rem}
.credit{font-size:.8rem;color:var(--ink-3);margin:.75rem 0 0}
.more,.rail-sec{margin-top:clamp(2.6rem,5vw,4rem);padding-top:clamp(1.8rem,3.4vw,2.4rem);border-top:1px solid var(--paper-3)}
.rail-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 0 1.3rem}
.sec-h{font-size:clamp(1.5rem,3vw,2rem);font-variation-settings:"SOFT" 12,"opsz" 72;margin:0}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(190px,22%);gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 1rem;scrollbar-width:thin}
.rail .card{scroll-snap-align:start}
@media (max-width:736px){.rail{grid-auto-columns:58%}}
.buybar{position:fixed;left:.7rem;right:.7rem;bottom:calc(.7rem + env(safe-area-inset-bottom));z-index:40;display:none;align-items:center;gap:.75rem;
  padding:.5rem .5rem .5rem 1rem;border-radius:12px;background:rgba(251,246,236,.97);border:1px solid var(--paper-4);box-shadow:var(--shadow-2);
  transform:translateY(160%);transition:transform .35s var(--ease)}
.buybar.show{transform:none}
.bb-t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.9rem;font-weight:700;color:var(--ink-2)}
.buybar .price{font-weight:800;white-space:nowrap}
@media (max-width:980px){
  .piece{grid-template-columns:1fr;gap:1.6rem}
  .info-in{position:static}
  .buybar{display:flex}
}
@media (min-width:981px){.buybar{display:none!important}}
@media (max-width:600px){
  .thumbs{display:none}
  .slides{margin-inline:calc(var(--gut)*-1);border-radius:0;border-inline:0}
  .g-ui{right:.2rem}
}

/* the photo viewer */
.viewer{position:fixed;inset:0;z-index:90;background:rgba(20,13,7,.96);display:grid;place-items:center;animation:vin .3s var(--ease)}
@keyframes vin{from{opacity:0}}
.v-stage{position:absolute;inset:0;overflow:hidden;touch-action:none;display:grid;place-items:center;cursor:zoom-in}
.v-stage.zoomed{cursor:grab}
.v-stage img{max-width:100vw;max-height:100vh;max-height:100dvh;width:auto;height:auto;object-fit:contain;user-select:none;-webkit-user-select:none;transform-origin:0 0;will-change:transform;background:var(--white)}
.viewer .icon-btn{background:rgba(36,26,18,.7);border-color:rgba(239,227,206,.3);color:var(--walnut-ink)}
.viewer .icon-btn:hover{background:var(--brass-lit);border-color:var(--brass-lit);color:#20170A}
.v-close{position:absolute;top:calc(.9rem + env(safe-area-inset-top));right:.9rem;z-index:2}
.v-prev,.v-next{position:absolute;top:50%;margin-top:-22px;z-index:2}
.v-prev{left:.9rem}.v-next{right:.9rem}
.v-hint{position:absolute;bottom:calc(1rem + env(safe-area-inset-bottom));left:0;right:0;text-align:center;margin:0;font-size:.84rem;color:var(--walnut-ink-2);pointer-events:none}
@media (hover:none){.v-prev,.v-next{display:none}}

/* ---------------------------------------------------------------- slips: bag, checkout, payment, order, returns, your orders */
.slip-page{display:block;max-width:var(--wrap);margin:0 auto}
.slip{width:100%;max-width:760px;margin-inline:auto;background:var(--white);border:1px solid var(--paper-3);border-radius:var(--r-lg);box-shadow:var(--shadow-1);padding:clamp(1.4rem,4vw,2.6rem)}
.slip.wide{max-width:1080px}
.ords{max-width:900px;margin-inline:auto}
.slip-h{font-size:clamp(2rem,4.4vw,2.9rem);letter-spacing:-.03em;font-variation-settings:"SOFT" 14,"opsz" 96;margin:0 0 1.2rem}
.hint{font-size:.9rem;color:var(--ink-3);margin:.8rem 0 0;line-height:1.55}
.hint.center{text-align:center}
.hint a{color:var(--brass-deep);font-weight:700}
.test-flag{margin:0 0 1.5rem;padding:.7rem 1rem;border-radius:10px;border:1px dashed var(--brass);background:#FBF1DC;color:var(--brass-dark);font-size:.9rem;font-weight:700}
.lede-dark{color:var(--ink-2);font-size:1.06rem;margin:0 0 1.4rem}
.order-no{font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);margin:0 0 1rem}
.co{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(1.6rem,4vw,3rem);align-items:start}
.co-form{margin:0}
.co-form fieldset{border:0;margin:0 0 1.8rem;padding:0;display:grid;gap:.9rem;min-width:0}
.co-form legend{font-family:var(--display);font-size:1.35rem;font-weight:600;letter-spacing:-.015em;margin:0 0 .9rem;padding:0;font-variation-settings:"SOFT" 10,"opsz" 36}
.co-form label,.ask-form label{display:grid;gap:.35rem;font-size:.84rem;font-weight:800;color:var(--ink-2)}
label .opt,span.opt{font-weight:600;color:var(--ink-3);font-size:.82rem;margin-left:.2rem}
.co-form input,.co-form select,.ask-form input{width:100%;height:50px;padding:0 .95rem;border-radius:9px;border:1px solid var(--paper-4);background:var(--paper);color:var(--ink);
  font-size:1rem;font-weight:500;transition:border-color .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease)}
.co-form input:hover,.ask-form input:hover{border-color:#CDB98F}
.co-form input:focus,.ask-form input:focus{outline:0;background:var(--white);border-color:var(--brass);box-shadow:0 0 0 3px rgba(169,120,42,.22)}
.co-form input[aria-invalid="true"]{border-color:var(--felt);box-shadow:0 0 0 3px rgba(142,59,54,.16)}
.row3{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:.75rem}
.co-err{margin:0 0 1rem;padding:.75rem 1rem;border-radius:10px;border:1px solid var(--felt-lit);background:#FBEDEA;color:var(--felt);font-size:.94rem;font-weight:700}
.co-sum{border:1px solid var(--paper-3);border-radius:14px;padding:1.5rem;position:sticky;top:96px;background:var(--paper)}
.co-sum h2{font-size:1.35rem;margin:0 0 1rem;font-variation-settings:"SOFT" 10,"opsz" 36}
.co-closed{text-align:center;padding:1rem 0}
.co-closed h2{font-size:1.5rem}
.co-closed p{color:var(--ink-2)}
.cc-ico,.ask-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--walnut);color:var(--brass-lit);margin:0 0 1.3rem}
.co-closed .cc-ico{margin-inline:auto}
.cc-ico svg,.ask-ico svg{width:26px;height:26px}
.co-returns{margin:1.1rem 0 0;padding-top:1rem;border-top:1px solid var(--paper-3);display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem .6rem;font-size:.88rem;color:var(--ink-3)}
.co-returns a{color:var(--brass-deep);font-weight:800}
@media (max-width:980px){.co{grid-template-columns:1fr}.co-sum{order:-1;position:static}}
@media (max-width:480px){.row3{grid-template-columns:1fr 1fr}.row3 label:first-child{grid-column:span 2}}
.co-form .addr{display:grid;gap:.9rem}
.ship-opts{gap:.6rem}
.ship-list{display:grid;gap:.6rem;min-height:3.5rem;transition:opacity .2s}
.ship-list.loading{opacity:.6}
.ship-wait{margin:0;padding:.95rem 1rem;border-radius:10px;border:1px dashed var(--paper-4);color:var(--ink-3);font-size:.94rem;background:var(--paper)}
.ship-wait.busy{border-style:solid;animation:pulse 1.4s ease-in-out infinite}
.ship-wait.bad{border-style:solid;border-color:var(--felt-lit);color:var(--felt);background:#FBEDEA}
@keyframes pulse{50%{background:var(--paper-2)}}
.co-form .ship-opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.9rem;padding:.9rem 1rem;border-radius:10px;border:1px solid var(--paper-4);
  background:var(--white);cursor:pointer;font-size:.98rem;font-weight:500;color:var(--ink);transition:border-color .18s var(--ease),background .18s var(--ease),box-shadow .18s var(--ease)}
.co-form .ship-opt:hover{border-color:var(--brass)}
.co-form .ship-opt.on{border-color:var(--brass);background:#FDF8EE;box-shadow:0 0 0 1px var(--brass)}
.co-form .ship-opt input{-webkit-appearance:none;appearance:none;width:20px;height:20px;padding:0;margin:0;border-radius:50%;border:1.5px solid var(--paper-4);background:var(--white);display:grid;place-items:center}
.co-form .ship-opt input::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--brass-deep);transform:scale(0);transition:transform .2s var(--ease)}
.co-form .ship-opt input:checked{border-color:var(--brass-deep)}
.co-form .ship-opt input:checked::after{transform:scale(1)}
.so-main{display:grid;gap:.1rem;min-width:0}
.so-name{font-weight:800;display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .6rem}
.so-tag{font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:.12rem .5rem;border-radius:99px;background:var(--ok-bg);color:var(--ok)}
.so-when{font-size:.85rem;color:var(--ink-3)}
.so-price{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.ship-opts .ship-note{margin:.3rem 0 0;padding:0;border:0;font-size:.86rem}
.code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.6rem;align-items:center}
.co-code .hint{margin:0}
.co-code .hint.bad{color:var(--felt)}
.sum-how{display:block;font-size:.8rem;color:var(--ink-3);margin-top:.1rem;font-weight:500}
.sum-tot .muted{color:var(--ink-3);font-size:.88rem}
.b-ship{margin:0 0 1rem;font-size:.86rem;color:var(--ink-3)}
.sum-lines{list-style:none;margin:0;padding:0;display:grid;gap:.85rem}
.sum-lines li{display:grid;grid-template-columns:56px 1fr auto;gap:.85rem;align-items:center;font-size:.96rem}
.sum-img{width:56px;height:56px;border-radius:9px;overflow:hidden;background:var(--white);border:1px solid var(--paper-3)}
.sum-img img{width:100%;height:100%;object-fit:contain;padding:6%}
.sum-t{font-weight:700;line-height:1.3}
.x{color:var(--ink-3)}
.disc{color:var(--ok);font-weight:700}
.sum-tot{margin:1.2rem 0 0;padding-top:1rem;border-top:1px solid var(--paper-3);display:grid;gap:.5rem}
.sum-tot div{display:flex;justify-content:space-between;gap:1rem;font-size:.97rem;color:var(--ink-2)}
.sum-tot dt{min-width:0}
.sum-tot dd{margin:0;font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink)}
.sum-tot .grand{font-size:1.15rem;color:var(--ink);font-weight:800;padding-top:.6rem;margin-top:.2rem;border-top:1px solid var(--paper-3)}
.sum-tot .grand dd{font-family:var(--display);font-weight:600;font-size:1.35rem}
.testcard{margin:1.5rem 0;aspect-ratio:1.586;max-width:21rem;border-radius:14px;padding:1.25rem 1.4rem;display:flex;flex-direction:column;justify-content:space-between;
  background:linear-gradient(150deg,var(--walnut-2),var(--walnut));color:var(--walnut-ink);font-size:.72rem;font-weight:800;letter-spacing:.18em;box-shadow:var(--shadow-3)}
.tc-n{font-size:1.15rem;letter-spacing:.14em;font-variant-numeric:tabular-nums;color:var(--brass-lit)}
.timeline{list-style:none;margin:.4rem 0 1.6rem;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.timeline li{position:relative;padding-top:1.5rem;font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.timeline li::before{content:"";position:absolute;top:.2rem;left:0;width:14px;height:14px;border-radius:50%;border:2px solid var(--paper-4);background:var(--white)}
.timeline li::after{content:"";position:absolute;top:.62rem;left:20px;right:6px;height:2px;background:var(--paper-3)}
.timeline li:last-child::after{display:none}
.timeline li.done{color:var(--ink)}
.timeline li.done::before{background:var(--brass-deep);border-color:var(--brass-deep)}
.timeline li.done::after{background:var(--brass)}
.track{margin:0 0 1.4rem}
.ship-to{margin-top:1.6rem;padding-top:1.2rem;border-top:1px solid var(--paper-3)}
.ship-to h2{font-size:1.15rem;margin:0 0 .5rem}
.ship-to p{margin:0;color:var(--ink-2)}
.policy-head{margin:0 0 1.6rem}
.policy-mark{display:block;margin:0 0 1.1rem}
.policy-mark:has(.mono){display:none}
.policy-mark .mono{width:40px;height:40px}
.policy-mark .logo-paper{height:44px;width:auto}
.policy-head .slip-h{margin:0}
.policy-of{margin:.4rem 0 0;font-size:.8rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep)}
.policy{color:var(--ink-2)}
.policy p{margin:0 0 1em}
.policy ul{margin:0 0 1em;padding-left:1.15em}
.policy li{margin:0 0 .45em}
.policy-foot{margin-top:1.6rem;padding-top:1.4rem;border-top:1px solid var(--paper-3);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.policy-foot p{margin:0;font-size:.94rem;color:var(--ink-2)}
.policy-foot p a{color:var(--brass-deep);font-weight:800}
.lost{text-align:center;max-width:36rem;margin:0 auto;padding:clamp(2rem,6vw,4rem) 0}
.lost h1{font-size:clamp(2rem,4.6vw,3rem)}
.lost p{color:var(--ink-2)}
.lost .lost-mark,.lost>svg{display:block;width:48px;height:48px;margin:0 auto 1.3rem;color:var(--brass)}
.lost .logo,.lost img{height:56px;width:auto;max-width:none;object-fit:contain;margin:0 auto 1.3rem}

/* ---------------------------------------------------------------- the bag: a paper slip drawn from the right */
.bag{position:fixed;inset:0;z-index:80}
.bag-scrim{position:absolute;inset:0;background:rgba(20,13,7,.5);backdrop-filter:blur(2px);opacity:0;transition:opacity .35s var(--ease)}
.bag-slip{position:absolute;top:0;right:0;bottom:0;width:min(30rem,100vw);background:var(--paper);color:var(--ink);border-left:1px solid var(--paper-3);box-shadow:var(--shadow-3);
  display:flex;flex-direction:column;transform:translateX(100%);transition:transform .4s var(--ease)}
.bag.open .bag-scrim{opacity:1}
.bag.open .bag-slip{transform:none}
.bag-slip header{display:flex;align-items:center;justify-content:space-between;padding:1.3rem 1.2rem .9rem 1.6rem;border-bottom:1px solid var(--paper-3)}
.bag-slip h2{font-size:1.7rem;margin:0;font-variation-settings:"SOFT" 12,"opsz" 72}
.bag-body{flex:1;overflow:auto;padding:1rem 1.6rem 1.8rem;display:flex;flex-direction:column}
.slip .bag-body{padding:0;min-height:8rem}
@media (max-width:599px){
  .bag-slip{top:auto;left:0;width:auto;max-height:90vh;max-height:90dvh;border-left:0;border-top:1px solid var(--paper-4);border-radius:18px 18px 0 0;transform:translateY(100%)}
  .bag-slip header{padding:1.1rem 1rem .8rem 1.25rem}
  .bag-body{padding:.6rem 1.25rem calc(1.4rem + env(safe-area-inset-bottom))}
}
.b-lines{list-style:none;margin:0;padding:0;display:grid}
.b-line{display:grid;grid-template-columns:76px 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--paper-3)}
.b-img{display:block;width:76px;height:76px;border-radius:10px;overflow:hidden;background:var(--white);border:1px solid var(--paper-3)}
.b-img img{width:100%;height:100%;object-fit:contain;padding:6%}
.b-t{font-family:var(--display);font-weight:600;font-size:1.02rem;line-height:1.25;color:var(--ink);text-decoration:none;font-variation-settings:"SOFT" 8,"opsz" 24}
.b-t:hover{color:var(--brass-deep)}
.b-var{display:block;margin-top:2px;font-size:.84rem;color:var(--ink-3);font-weight:600}
.b-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.6rem}
.b-row .price{font-weight:800}
.b-qty{display:inline-flex;align-items:center;border:1px solid var(--paper-4);border-radius:99px;background:var(--white);overflow:hidden}
.b-qty button{width:36px;height:34px;border:0;background:none;color:var(--ink);font-size:1.05rem}
.b-qty button:hover{background:var(--paper-2);color:var(--brass-deep)}
.b-qty button:disabled{opacity:.3}
.b-qty span{min-width:1.6rem;text-align:center;font-weight:800;font-variant-numeric:tabular-nums}
.b-rm{border:0;background:none;padding:.3rem 0;font-size:.8rem;font-weight:700;color:var(--ink-3);text-decoration:underline;text-underline-offset:3px}
.b-rm:hover{color:var(--felt)}
.b-note{font-size:.88rem;color:var(--felt);margin:.4rem 0 0;font-weight:600}
.b-one{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.b-clock{font-size:.9rem;line-height:1.5;color:var(--ink-2);margin:.2rem 0 .8rem;padding:.6rem .8rem;border-radius:9px;background:var(--paper-2)}
.b-clock b,.b-ask b{font-variant-numeric:tabular-nums;color:var(--ink);font-weight:800}
.b-lapsed{margin:0 0 .75rem}
.b-line.out .b-img img{filter:grayscale(.7);opacity:.55}
.b-ask{margin:.3rem 0 1rem;padding:1rem 1.15rem;border:1px solid var(--brass);border-radius:12px;background:#FDF8EE}
.b-ask-t{margin:0 0 .35rem;font-family:var(--display);font-size:1.15rem;font-weight:600}
.b-ask p{margin:0;color:var(--ink-2);font-size:.92rem;line-height:1.5}
.b-ask-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.2rem;margin-top:.9rem}
.sold-note.in-bag{margin-top:.75rem}
.b-foot{margin-top:auto;padding-top:1.2rem}
.b-foot .sum-tot{margin:0 0 1rem;border-top:0;padding-top:0}
.b-foot .sum-tot .grand{border-top:0;padding-top:0;margin-top:0}
.b-empty{margin:auto 0;text-align:center;padding:2.6rem .5rem}
.b-empty p{font-family:var(--display);font-size:1.25rem;color:var(--ink-2);margin:0 0 1.2rem}
.toast{position:fixed;left:50%;bottom:calc(1.5rem + env(safe-area-inset-bottom));z-index:95;transform:translate(-50%,160%);padding:.8rem 1.3rem;border-radius:10px;
  background:var(--walnut);color:var(--walnut-ink);font-size:.92rem;font-weight:800;box-shadow:var(--shadow-3);
  transition:transform .35s var(--ease),opacity .3s,visibility 0s .35s;pointer-events:none;white-space:nowrap;opacity:0;visibility:hidden}
.toast.show{transform:translate(-50%,0);opacity:1;visibility:visible;transition:transform .35s var(--ease),opacity .3s}
.product .toast{bottom:calc(5.4rem + env(safe-area-inset-bottom))}
@media (min-width:981px){.product .toast{bottom:1.8rem}}

/* ---------------------------------------------------------------- your orders */
.slip.ask{max-width:560px;margin:0 auto}
.ask-form{display:grid;gap:1rem;margin:.3rem 0 0}
.ords{display:grid;gap:1.4rem}
.ords-h{display:flex;align-items:flex-end;justify-content:space-between;gap:.75rem 1.75rem;flex-wrap:wrap;margin:0}
.ords-h .slip-h{margin:0}
.who{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;font-size:.94rem;color:var(--ink-2)}
.who p,.who form{margin:0}
.who strong{color:var(--ink);overflow-wrap:anywhere}
.ords .crumbs{margin:0}
.ords .crumbs a{display:inline-flex;align-items:center;gap:.4rem}
.ords .crumbs svg{width:16px;height:16px}
.ord,.ord-empty{border:1px solid var(--paper-3);border-radius:var(--r-lg);padding:clamp(1.2rem,3vw,1.8rem);background:var(--white);box-shadow:var(--shadow-1)}
.ord-h{display:flex;justify-content:space-between;align-items:flex-start;gap:.9rem 1.5rem;flex-wrap:wrap;margin:0 0 1.4rem}
.ord-date{font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:0 0 .35rem}
.ord-no{font-size:1.4rem;margin:0}
.ord-no a{text-decoration:none}
.ord-no a:hover{color:var(--brass-deep)}
.ord-test{display:inline-block;margin:.55rem 0 0;padding:.15rem .6rem;border:1px dashed var(--brass);border-radius:99px;font-size:.76rem;font-weight:700;color:var(--brass-dark)}
.ord-st{display:grid;justify-items:end;gap:.35rem;text-align:right}
.ord-note{font-size:.86rem;color:var(--ink-3);max-width:30ch}
.chip-s{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .8rem;border-radius:99px;background:var(--paper-2);border:1px solid var(--paper-4);font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.s-delivered .chip-s,.s-picked_up .chip-s{background:var(--ok-bg);border-color:#CFDDB5;color:var(--ok)}
.s-refunded .chip-s,.s-canceled .chip-s{background:#FBEDEA;border-color:var(--felt-lit);color:var(--felt)}
@media (max-width:599px){.ord-st{justify-items:start;text-align:left;grid-auto-flow:column;align-items:center}}
.ord-lines{list-style:none;margin:0;padding:0;display:grid}
.ord-lines li{display:grid;grid-template-columns:64px 1fr auto;gap:1rem;align-items:center;padding:.85rem 0;border-top:1px solid var(--paper-3)}
.ord-lines li:first-child{border-top:0;padding-top:0}
.ord-lines .price{font-weight:800}
.ol-img{display:block;width:64px;height:64px;border-radius:9px;overflow:hidden;background:var(--white);border:1px solid var(--paper-3)}
.ol-img img{width:100%;height:100%;object-fit:contain;padding:6%}
.ol-t{display:grid;gap:.15rem;min-width:0}
.ol-n{font-weight:800}
.ol-n a{text-decoration:none}
.ol-n a:hover{color:var(--brass-deep)}
.ol-q{font-size:.88rem;color:var(--ink-3)}
.ord-ship{display:flex;align-items:center;gap:.9rem;margin:1.2rem 0 0;padding:1rem;border-radius:12px;background:var(--paper)}
.ord-ship .ico{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--walnut);color:var(--brass-lit)}
.ord-ship .ico svg{width:22px;height:22px}
.ord-ship p{margin:0;display:grid;gap:.15rem;flex:1;min-width:0;font-size:.92rem;color:var(--ink-2)}
.ord-ship .how{font-weight:800;color:var(--ink)}
.ord-ship .dates{font-size:.84rem;color:var(--ink-3)}
@media (max-width:519px){.ord-ship{flex-wrap:wrap}.ord-ship .btn{width:100%}}
.ord-more{display:inline-flex;align-items:center;gap:.45rem;margin:1.2rem 0 0;font-size:.9rem;font-weight:800;color:var(--brass-deep);text-decoration:none}
.ord-more:hover{text-decoration:underline}
.ord-more svg{width:16px;height:16px}
.ord-empty{text-align:center}
.ord-empty p{color:var(--ink-2)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* Amy's stock counts are placeholders (her Shopify catalog publishes none): the plain "N available" line is not shown;
   Sold, Sold out and On hold still are. */
.card-m .state:not(.sold):not(.held),.piece-p .state:not(.sold):not(.held),.qty-of{display:none}