/* KZSE STUDIO shop — kuzesae.com と同じトークン */
:root{--cream:#F7F1E7;--cream-2:#EFE6D8;--paper:#FFFDF8;--ink:#1B1B1B;--ink-2:#4A4540;--mute:#8B837A;--yellow:#F6C400;--yellow-2:#FFD84D;--red:#E9432E;--blue:#2F5FBF;--blue-2:#5C8AE6;--green:#2EA36A;--orange:#EE7A2A;--pink:#F2A6C0;--sky:#BFE3F5;
--font-jp:"Zen Maru Gothic","Hiragino Maru Gothic ProN",system-ui,sans-serif;--font-en:"Rubik","Zen Maru Gothic",system-ui,sans-serif;--line:3px;--r:22px;--sh:6px 6px 0 var(--ink);--sh-s:4px 4px 0 var(--ink);--wrap:1200px;--gut:clamp(18px,4vw,48px);--ease:cubic-bezier(.2,.9,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip;width:100%}
html.nomotion *{animation:none!important;transition:none!important}
body{font-family:var(--font-jp);color:var(--ink);background:var(--cream) url(../img/bg-beige.webp) center/1400px repeat;line-height:1.8;font-size:16px;overflow-x:clip;width:100%;position:relative;font-feature-settings:"palt"}
img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}ul{list-style:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{width:min(var(--wrap),100% - var(--gut)*2);margin-inline:auto}.wrap.narrow{max-width:820px}.center{text-align:center}
.rv{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease)}.rv.in,html.nomotion .rv{opacity:1;transform:none}.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}
/* header */
.announce{background:var(--ink);color:var(--yellow);text-align:center;font-weight:800;font-size:13px;padding:8px 14px}
.hd{position:sticky;top:0;z-index:50;padding:12px var(--gut);display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.hd>*{pointer-events:auto}
.hd-logo{display:inline-flex;background:var(--paper);border:var(--line) solid var(--ink);border-radius:30px 26px 34px 24px/24px 34px 22px 30px;padding:8px 16px;box-shadow:var(--sh-s)}
.hd-logo img{height:34px;width:auto}
.hd-nav{display:flex;gap:2px;background:var(--paper);border:var(--line) solid var(--ink);border-radius:40px 34px 46px 30px/30px 46px 28px 40px;padding:6px 10px;box-shadow:var(--sh-s)}
.hd-nav a{font-family:var(--font-en);font-weight:800;font-size:13px;letter-spacing:.06em;padding:8px 12px;border-radius:30px;transition:.2s}
.hd-nav a:hover{background:var(--yellow)}
.hd-nav a.cart{background:var(--orange);color:#fff}.hd-nav a.cart b{background:#fff;color:var(--orange);border-radius:20px;padding:0 7px;margin-left:4px}
.hd-cart-sp{display:none;position:relative;width:48px;height:48px;background:var(--paper);border:var(--line) solid var(--ink);border-radius:50%;box-shadow:var(--sh-s);place-items:center;font-size:20px}
.hd-cart-sp b{position:absolute;top:-6px;right:-6px;background:var(--red);color:#fff;font-size:11px;font-family:var(--font-en);border-radius:20px;padding:0 6px;border:2px solid var(--ink)}
/* hero */
.hero{position:relative;overflow:hidden;padding:40px 0 30px;text-align:center}
.blob{position:absolute;pointer-events:none;z-index:0}
.blob.y{width:52vw;max-width:700px;aspect-ratio:1;background:var(--yellow);right:-16vw;top:-18vw;border-radius:58% 42% 55% 45%/45% 60% 40% 55%}
.blob.b{width:16vw;max-width:220px;aspect-ratio:1;background:var(--blue-2);left:-6vw;bottom:8%;border-radius:45% 55% 40% 60%/55% 45% 60% 40%}
.hero-in{position:relative;z-index:1;display:grid;justify-items:center;gap:8px}
.hero-logo{width:min(420px,72vw);filter:drop-shadow(5px 5px 0 var(--ink))}
.hero-lead{font-weight:700;font-size:clamp(14px,1.4vw,17px);line-height:2;margin-top:8px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.hero-cast{position:relative;width:min(560px,90vw);height:clamp(120px,14vw,170px);margin-top:8px}
.hero-cast .cast{position:absolute;bottom:0;height:80%;width:auto;filter:drop-shadow(0 8px 0 rgba(27,27,27,.14));animation:idle 3.4s ease-in-out infinite;transform-origin:50% 100%}
.hero-cast .cat{left:50%;transform:translateX(-50%);height:100%;animation:none}
.hero-cast .c1{left:12%;animation-delay:-1s}.hero-cast .c3{right:14%;height:74%;animation-delay:-.5s}
@keyframes idle{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px) rotate(1.5deg)}}
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-en);font-weight:800;letter-spacing:.06em;font-size:14px;
  background:none;border:12px solid transparent;border-radius:0;
  border-image:url(../img/frame-capsule-paper.svg) 33.5% 26.6% fill / 12px 22px stretch;
  padding:4px 10px;box-shadow:none;filter:drop-shadow(3px 3px 0 var(--ink));transition:transform .2s var(--ease),filter .2s var(--ease)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:none;filter:drop-shadow(6px 6px 0 var(--ink))}
.btn.y{border-image-source:url(../img/frame-capsule-y.svg)}
.btn.o{border-image-source:url(../img/frame-capsule-o.svg);color:#fff}
.btn.big{font-size:16px;padding:8px 18px;width:100%;justify-content:center}
.btn[disabled]{opacity:.5;pointer-events:none}
/* marquee */
.mq{background:var(--ink);color:var(--cream);overflow-x:clip;overflow-y:visible;position:relative;z-index:2}
.mq::before,.mq::after{content:"";position:absolute;left:0;right:0;height:18px;pointer-events:none;background:url(../img/edge-wave-ink-t.png) repeat-x;background-size:306px 18px;animation:mqwave 13s linear infinite}
.mq::before{top:-17px}
.mq::after{bottom:-17px;background-image:url(../img/edge-wave-ink-b.png)}
@keyframes mqwave{to{background-position:-306px 0}}
.mq-track{display:flex;width:max-content;animation:mq 26s linear infinite}
.mq span{font-family:var(--font-en);font-weight:900;font-size:clamp(16px,2.2vw,24px);letter-spacing:.06em;padding:10px 24px;white-space:nowrap;display:inline-flex;align-items:center;gap:22px}
.mq span i{width:.55em;height:.55em;background:var(--yellow);border-radius:50%}
@keyframes mq{to{transform:translateX(-50%)}}
/* sections */
.sec{position:relative;padding:clamp(40px,5vw,64px) 0}.sec.pt{padding-top:20px}
.sec.cream{background:var(--cream-2)}
.zz-t::before{content:"";position:absolute;left:0;right:0;top:-19px;height:20px;background:url(../img/edge-zig-cream2-t.png) repeat-x;background-size:214px 20px}
.sec-h{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.h-txt{font-family:var(--font-en);font-weight:900;font-size:clamp(30px,4.5vw,52px);line-height:1;letter-spacing:.02em}
.h-txt.sm{font-size:clamp(22px,3vw,32px)}
.h-sub{font-family:var(--font-en);font-weight:800;letter-spacing:.12em;font-size:12px;color:var(--ink-2)}
.lead{font-weight:700;font-size:clamp(14px,1.3vw,16px);line-height:2}
.cats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.chip{font-family:var(--font-en);font-weight:800;font-size:12px;letter-spacing:.06em;padding:7px 14px;border-radius:30px;border:2px solid var(--ink);background:var(--paper);transition:.2s;display:inline-flex;gap:6px;align-items:center}
.chip small{color:var(--mute);font-weight:700}.chip:hover,.chip.on{background:var(--ink);color:var(--yellow)}.chip.on small{color:var(--cream)}
.empty{font-weight:700;color:var(--ink-2);margin:20px 0}
/* grid / card */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,26px)}
.grid.four{grid-template-columns:repeat(4,1fr)}
.pd{position:relative;display:block;background:var(--paper);border:var(--line) solid var(--ink);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh-s);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.pd:hover{transform:translate(-3px,-5px) rotate(.6deg);box-shadow:8px 10px 0 var(--ink)}
.pd .ph{aspect-ratio:1;background:#fff;border-bottom:var(--line) solid var(--ink);position:relative;overflow:hidden}
.pd .ph img{width:100%;height:100%;object-fit:cover;transition:opacity .35s}
.pd .ph img.alt{position:absolute;inset:0;opacity:0}.pd:hover .ph img.alt{opacity:1}
.pd.is-soldout .ph img{filter:saturate(.6) opacity(.75)}
.pd .bd{padding:12px 14px 14px}.pd .cat{font-family:var(--font-en);font-size:10.5px;font-weight:800;letter-spacing:.12em;color:var(--mute)}
.pd h3{font-family:var(--font-en);font-weight:800;font-size:13.5px;line-height:1.4;margin-top:2px}
.pd .pr{font-family:var(--font-en);font-weight:900;margin-top:4px}.pd .pr small{font-family:var(--font-jp);font-weight:700;font-size:10px;color:var(--mute);margin-left:2px}
.badge{position:absolute;top:12px;left:12px;z-index:2;color:#fff;font-family:var(--font-en);font-weight:900;font-size:11px;letter-spacing:.1em;padding:3px 10px;border-radius:20px;border:2px solid var(--ink);transform:rotate(-6deg)}
.badge.so{background:var(--red)}.badge.nw{background:var(--blue)}.badge.lm{background:var(--orange)}.badge.cs{background:var(--green)}
.badge.inline{position:static;display:inline-block;transform:none;margin-left:6px}
/* about */
.about-in{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px,4vw,60px);align-items:center}
.about-art{border:var(--line) solid var(--ink);border-radius:26px;box-shadow:var(--sh);transform:rotate(-2deg);max-width:340px;justify-self:center}
/* pdp */
.bc{font-family:var(--font-en);font-size:12px;font-weight:700;color:var(--mute);margin-bottom:16px}.bc a:hover{color:var(--red)}
.pdp{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(22px,4vw,56px);align-items:start}
.gal-wrap{position:sticky;top:90px}
.gal{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;aspect-ratio:1;background:#fff;border:var(--line) solid var(--ink);border-radius:26px;box-shadow:var(--sh)}
.gal::-webkit-scrollbar{display:none}.gal img{flex:0 0 100%;width:100%;height:100%;object-fit:contain;scroll-snap-align:center}
.thumbs{display:flex;gap:8px;margin-top:16px;overflow-x:auto;padding-bottom:6px}
.thumbs button{flex:0 0 66px;height:66px;border:2px solid var(--ink);border-radius:12px;overflow:hidden;background:#fff;opacity:.6;transition:.2s}
.thumbs button.on,.thumbs button:hover{opacity:1;box-shadow:3px 3px 0 var(--ink)}.thumbs img{width:100%;height:100%;object-fit:cover}
.info .cat{font-family:var(--font-en);font-size:12px;font-weight:800;letter-spacing:.14em;color:var(--mute)}
.info h1{font-family:var(--font-en);font-weight:900;font-size:clamp(22px,2.6vw,32px);line-height:1.2;margin:6px 0 8px}
.info .price{font-family:var(--font-en);font-weight:900;font-size:26px}.info .price small{font-family:var(--font-jp);font-size:12px;color:var(--mute);font-weight:700;margin-left:4px}
.buy{display:grid;gap:12px;margin:18px 0;padding:18px;background:var(--paper);border:var(--line) solid var(--ink);border-radius:var(--r);box-shadow:var(--sh-s)}
.buy label{display:grid;gap:6px;font-size:13px;font-weight:800}
.buy select{font:inherit;padding:11px 14px;border:2px solid var(--ink);border-radius:12px;background:#fff}
.buy .qty select{width:100px}
.soldout-box{margin:18px 0;padding:16px 18px;background:var(--paper);border:var(--line) solid var(--ink);border-radius:var(--r);box-shadow:var(--sh-s);display:grid;gap:4px}
.soldout-box b{font-family:var(--font-en);font-size:22px;color:var(--red)}.soldout-box.cs b{color:var(--green)}.soldout-box span{font-size:13px;color:var(--ink-2)}
.desc{margin-top:16px;font-size:14.5px;line-height:1.9}.desc p{margin-bottom:6px}
.notes{margin-top:18px;font-size:12.5px;color:var(--ink-2);padding-top:14px;border-top:2px dashed var(--ink)}.notes li{padding:2px 0}.notes a{text-decoration:underline}
.rel{margin-top:clamp(40px,5vw,70px)}
/* cart */
.cart-list{display:grid;gap:14px}
.ci{display:grid;grid-template-columns:96px 1fr auto;gap:16px;align-items:center;background:var(--paper);border:var(--line) solid var(--ink);border-radius:var(--r);padding:12px 14px;box-shadow:var(--sh-s)}
.ci .ph{width:96px;height:96px;border:2px solid var(--ink);border-radius:14px;overflow:hidden;background:#fff}.ci .ph img{width:100%;height:100%;object-fit:cover}
.ci .nm{font-family:var(--font-en);font-weight:800;font-size:15px}.ci .lb{font-size:13px;color:var(--ink-2)}.ci .pr{font-family:var(--font-en);font-weight:900;margin-top:2px}
.ci .ctl{display:flex;gap:8px;align-items:center}.ci select{font:inherit;padding:8px 10px;border:2px solid var(--ink);border-radius:10px;background:#fff}
.ci .rm{width:36px;height:36px;border-radius:50%;border:2px solid var(--ink);background:var(--paper);font-weight:900}.ci .rm:hover{background:var(--red);color:#fff}
.warn{font-size:12.5px;color:var(--red);font-weight:700}
.totals{margin-top:22px;background:var(--paper);border:var(--line) solid var(--ink);border-radius:var(--r);padding:20px 22px;box-shadow:var(--sh)}
.region{display:grid;gap:4px;font-size:13.5px;font-weight:700;margin-bottom:12px}.region span{font-family:var(--font-en);font-size:11px;letter-spacing:.12em;color:var(--mute)}
.totals dl{display:grid;grid-template-columns:1fr auto;gap:6px 20px;font-weight:700;padding-top:12px;border-top:2px dashed var(--ink)}
.totals dd{font-family:var(--font-en);text-align:right}.totals .tt{font-size:20px;font-weight:900;padding-top:6px}
.totals form{margin-top:16px}.tiny{font-size:11.5px;color:var(--mute);margin-top:8px}
/* misc */
.thanks-chara{width:150px;margin:0 auto 10px}
.prose h3{font-size:17px;font-weight:900;margin:22px 0 6px;padding-left:12px;border-left:5px solid var(--yellow)}
.prose p{font-size:14.5px}.legal{width:100%;border-collapse:collapse;font-size:14px;background:var(--paper);border:var(--line) solid var(--ink);border-radius:var(--r);overflow:hidden}
.legal th,.legal td{padding:10px 14px;border-bottom:1px solid rgba(27,27,27,.15);text-align:left;vertical-align:top}.legal th{width:32%;background:var(--cream-2);font-weight:800}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:var(--yellow);font-weight:800;padding:12px 22px;border-radius:30px;opacity:0;pointer-events:none;transition:.3s;z-index:60}
.toast.on{opacity:1;transform:translate(-50%,0)}
/* footer */
.ft{background:var(--cream);border-top:0;padding:46px 0 26px;position:relative}
.ft::before{content:"";position:absolute;left:0;right:0;top:0;height:16px;background:url(../img/line-dots.png) left center/auto 100% repeat-x}
.ft-in{display:flex;flex-wrap:wrap;gap:20px 30px;align-items:center;justify-content:space-between}
.ft-logo{height:42px;width:auto}.ft-nav{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;font-weight:700}.ft-nav a:hover{color:var(--red)}
.ft-copy{margin-top:22px;font-family:var(--font-en);font-size:12px;letter-spacing:.06em;color:var(--mute)}
@media (max-width:1024px){.grid,.grid.four{grid-template-columns:repeat(3,1fr)}}
@media (max-width:840px){.hd-nav{display:none}.hd-cart-sp{display:grid}.hd-logo img{height:26px}.hd-logo{padding:6px 12px}
.pdp{grid-template-columns:1fr}.gal-wrap{position:static}.about-in{grid-template-columns:1fr}.grid,.grid.four{grid-template-columns:repeat(2,1fr)}
.ci{grid-template-columns:72px 1fr;grid-template-rows:auto auto}.ci .ph{width:72px;height:72px}.ci .ctl{grid-column:1/-1;justify-content:flex-end}
.hero-cast{height:120px}}
@media (max-width:560px){.pd h3{font-size:12.5px}.pd .bd{padding:10px 11px 12px}}
/* variant axis buttons */
.axis{display:grid;gap:6px}.axis>span{font-size:12px;font-weight:800;letter-spacing:.08em}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts button{font-family:var(--font-en);font-weight:800;font-size:13px;letter-spacing:.04em;padding:8px 14px;min-width:48px;border:2px solid var(--ink);border-radius:12px;background:#fff;transition:.15s}
.opts button.on{background:var(--ink);color:var(--yellow)}
.opts button:disabled{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.sel-hint{font-size:12.5px;font-weight:700;color:var(--ink-2)}