/* Mobile-first finishing: emerald, brushed gold and quiet, responsive motion. */
body{margin:0}
.skip-link{position:fixed;top:12px;left:12px;z-index:300;background:var(--gold-hi);color:var(--em-950);padding:12px 18px;border-radius:8px;transform:translateY(-180%)}
.skip-link:focus{transform:none}
[id]{scroll-margin-top:100px}
.intro{pointer-events:none;animation:intro-safety 1.8s forwards;transition:opacity .35s ease,visibility .35s}
.intro.done{opacity:0;transform:none;visibility:hidden}
.intro .in{gap:16px}
.intro img{width:80px;height:92px;object-fit:contain;animation:logo-arrive .55s var(--ease) both}
.intro b{letter-spacing:.15em;font-size:clamp(16px,4.5vw,24px)}
.intro small{animation-delay:.15s}
@keyframes logo-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes intro-safety{0%,80%{visibility:visible}100%{visibility:hidden}}
.btn,button,a,input,select,textarea{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:active,.btn:active{scale:.97}
.btn{line-height:1.25;min-height:46px}
.lang,.menu-btn,.addq,.colpick button{min-height:44px}
.menu-btn{min-width:44px}
.search input{font-size:16px}
.cat-bar{z-index:30}
.drawer{max-height:100dvh;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.drawer form input,.drawer form select,.drawer form textarea{font-size:16px}
.drawer .scroll{min-height:0}
.drawer .dfoot{padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.privacy-note{font-size:13px;color:var(--ink-2);line-height:1.6}
.hero h1:focus{outline:none}
.hero .kicker{line-height:1.5}
@media (max-width:1240px){nav.main.open{animation:menu-arrive .28s var(--ease);max-height:calc(100dvh - 88px);overflow-y:auto}nav.main a[aria-current]{color:var(--gold-hi)}}
@keyframes menu-arrive{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@media (max-width:600px){
 .wrap{padding-inline:20px}
 .top .wrap{height:76px;gap:8px;padding-inline:16px}
 .brand{gap:9px}.brand .mk{width:34px;height:40px}.brand b{font-size:11px;letter-spacing:.04em}.brand small{font-size:8px}
 .tools{gap:4px}.lang{padding:9px 10px;min-width:44px}
 nav.main{top:calc(76px + env(safe-area-inset-top,0px));max-height:calc(100dvh - 76px)}
 .hero.home{min-height:92svh}
 .hero.short{min-height:70svh}
 .hero .wrap{padding-block:124px 54px;gap:22px}
 .hero h1{font-size:clamp(38px,10.5vw,58px);line-height:1.08;font-weight:300;max-width:15ch}
 .hero.short h1{font-size:clamp(37px,10vw,52px)}
 .hero p{font-size:16px;line-height:1.75}
 .hero .kicker{font-size:11px;letter-spacing:.015em}.kicker::before{width:20px;flex-shrink:0}
 .hero-cta{gap:10px}.hero-cta .btn{padding:14px 18px;font-size:13px}
 .hero .meta{gap:18px 25px;margin-top:8px;padding-top:20px;font-size:12px}.hero .meta b{font-size:30px}
 .hero.home .bg img{object-position:40% 30%}
 .hero.home::before{background:linear-gradient(180deg,rgba(6,27,20,.88),rgba(6,27,20,.43) 28%,rgba(6,27,20,.8) 65%,#061B14)}
 .pgrid{gap:10px}.pc .bd{padding:12px 10px}.pc b{font-size:16px;line-height:1.3}.pc .code{font-size:10px}
 .addq{padding:11px 6px;white-space:normal;font-size:11.5px}
 .pc .im{aspect-ratio:1}.pc .vol{top:8px;inset-inline-start:8px;font-size:9px;padding:6px 8px}
 .cat-row{min-width:0}.cat-row:last-child{scroll-snap-type:x proximity;padding-bottom:6px}.fchip{scroll-snap-align:start;min-height:44px}
 .qfab{bottom:calc(14px + env(safe-area-inset-bottom,0px));inset-inline-start:14px;padding:12px 16px;min-height:50px;box-shadow:0 8px 28px #061b1440;border:1px solid #c9a25766}
 .wa{width:50px;height:50px;inset-inline-end:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px))}
 .toast{bottom:calc(82px + env(safe-area-inset-bottom,0px));font-size:13px;width:max-content}
 .foot{padding-bottom:90px}.foot .grid{gap:28px}.foot .giant{font-size:13vw}
 .drawer header{padding:16px 20px}.drawer .list{padding-inline:18px}.drawer form{padding:20px 18px;gap:16px 12px}
 .qi .qty input{width:48px}.qty button{width:44px;height:44px}
 .sheet .im{min-height:0;aspect-ratio:1;max-height:38svh}.sheet .im img{max-height:38svh;object-fit:contain}
 .sheet .bd{padding:24px 20px}.sheet .row .btn{width:100%;justify-content:center}.sheet .row .qty{width:auto}
 dialog.sheet{max-width:calc(100% - 16px);max-height:calc(100dvh - 24px);border-radius:20px}
 input,select,textarea{font-size:16px!important}
 .band{padding-block:64px}
}
@media (max-width:360px){.brand b{font-size:9.5px}.wrap{padding-inline:16px}.hero-cta .btn{font-size:12px;padding-inline:14px}.drawer form{grid-template-columns:1fr}.drawer form .full{grid-column:auto}}
@media (hover:none){.pc:active{transform:scale(.985);border-color:var(--gold)}.rail{scroll-snap-type:x mandatory}.rail a{scroll-snap-align:start}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.intro{display:none}.hero .bg img{transform:none}.enter>*:not(h1),.js .rv{opacity:1;transform:none}}