
@property --tee{syntax:'<color>';inherits:true;initial-value:#0c0c0c}
:root{--bg:#e8e6e0;--fg:#000;--mut:#6a655b;--ln:rgba(0,0,0,.22);--pn:#f4f3ef;--red:#e5121b;--d:'Chakra Petch',system-ui,sans-serif;--m:'Space Mono',ui-monospace,monospace;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#000;--fg:#f4f3ef;--mut:#948f84;--ln:rgba(244,243,239,.2);--pn:#0a0a09}}
:root[data-theme="dark"]{--bg:#000;--fg:#f4f3ef;--mut:#948f84;--ln:rgba(244,243,239,.2);--pn:#0a0a09}
html{scroll-behavior:smooth;scroll-padding-top:calc(60px + env(safe-area-inset-top,0px))}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--fg);font:500 15px/1.6 var(--d);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:60}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:70;background:repeating-linear-gradient(0deg,rgba(128,128,128,.06) 0 1px,transparent 1px 4px)}
button,input{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
button:focus-visible,input:focus-visible,label:focus-within{outline:2px solid var(--red);outline-offset:3px}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
#fx{position:fixed;inset:0;width:100%;height:100%;z-index:110;pointer-events:none}
main,footer{position:relative;z-index:1}
@media(pointer:fine){html.cur *{cursor:none!important}html.cur #cu,html.cur #rg{display:block!important}}
#cu,#rg{display:none;position:fixed;left:0;top:0;pointer-events:none;z-index:300}
#cu{width:6px;height:6px;margin:-3px;background:var(--red)}
#rg{width:34px;height:34px;margin:-17px;border:1px solid var(--red);border-radius:50%;transition:width .2s,height .2s,margin .2s,background .2s}
#rg.h{width:62px;height:62px;margin:-31px;background:rgba(229,18,27,.16)}
#boot{display:none;position:fixed;inset:0;z-index:200;background:#000;color:var(--red);place-items:center;font:13px/1.8 var(--m)}
.js #boot{display:grid}#boot.off{opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s}
.bar{height:2px;background:#333;margin-top:12px;width:260px}.bar i{display:block;height:100%;width:0;background:var(--red);transition:width .25s}
#hud{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 12px;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--ln)}
.logo{display:flex;align-items:center;gap:8px;font:700 20px var(--d);letter-spacing:.1em}.logo svg{width:14px;height:22px;color:var(--red)}
#hud nav{display:flex;gap:4px;margin-left:10px;overflow-x:auto;scrollbar-width:none}
#hud button,#hud .nb,#hud #ct{padding:4px 10px;border:1px solid var(--ln);font:12px var(--m);display:inline-block}#hud button:hover,#hud .nb:hover,#hud #ct:hover,#hud .nb[aria-current]{border-color:var(--red);color:var(--red)}
.sp{flex:1}.hm{font:11px var(--m);color:var(--mut)}
#cn{font-style:normal;background:var(--red);color:#fff;padding:0 6px;margin-left:4px}#cn.bump{display:inline-block;animation:bp .4s}
@keyframes bp{50%{transform:scale(1.6)}}
#pg{position:absolute;left:0;right:0;bottom:-1px;height:2px}#pg i{display:block;height:2px;background:var(--red);width:calc(var(--p,0)*100%)}
.mini{position:absolute;bottom:2px;width:12px;height:19px;color:var(--red);left:calc(var(--p,0)*(100% - 12px))}
#dots{position:fixed;right:14px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:14px}
#dots button{width:11px;height:11px;border:1px solid var(--fg);transform:rotate(45deg);transition:.2s}#dots .on{background:var(--red);border-color:var(--red);transform:rotate(45deg) scale(1.4)}
#fp{position:fixed;left:14px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:40;font:10px var(--m);color:var(--mut)}
#hero{min-height:100svh;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;padding:110px clamp(16px,5vw,70px) 60px}
.gl{position:relative;font:700 clamp(56px,14vw,170px)/.9 var(--d);letter-spacing:-.02em}
.gl::before,.gl::after{content:attr(data-t);position:absolute;inset:0;clip-path:inset(0 0 100% 0)}
.gl::before{color:var(--red);animation:g1 3.2s infinite steps(1)}.gl::after{color:#b9b2a4;animation:g2 3.2s infinite steps(1)}
@keyframes g1{0%,88%{clip-path:inset(0 0 100% 0)}90%{clip-path:inset(18% 0 58% 0);transform:translate(-6px)}94%{clip-path:inset(62% 0 8% 0);transform:translate(5px)}97%{clip-path:inset(0 0 100% 0)}}
@keyframes g2{0%,91%{clip-path:inset(0 0 100% 0)}93%{clip-path:inset(40% 0 35% 0);transform:translate(6px)}96%{clip-path:inset(0 0 100% 0)}}
.lead{max-width:460px;margin:22px 0 28px;font-size:18px;color:var(--mut)}
.cta{display:flex;flex-wrap:wrap;gap:12px}
.bt{padding:14px 24px;background:var(--red);color:#fff;font-weight:700;letter-spacing:.08em;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));transition:filter .2s,transform .2s}
.bt:hover{filter:brightness(1.18);transform:translateY(-2px)}.gh{background:var(--ln);color:var(--fg)}
.st3{display:flex;gap:30px;margin-top:44px;font-size:13px;color:var(--mut)}.st3 b{display:block;font:700 30px var(--d);color:var(--fg)}
.hr{display:grid;gap:10px;justify-items:center;align-content:center}
.mzw{position:relative;width:min(540px,100%)}
.mzw::before,.mzw::after{content:"";position:absolute;width:20px;height:20px;border:2px solid var(--red);pointer-events:none;z-index:2}
.mzw::before{top:-7px;left:-7px;border-right:0;border-bottom:0}.mzw::after{bottom:-7px;right:-7px;border-left:0;border-top:0}
#mz{display:block;width:100%;aspect-ratio:1;border:1px solid var(--ln);background:var(--pn)}
.mzb{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 14px;width:min(540px,100%);font:10px var(--m);color:var(--mut)}
.logo img{display:block;height:var(--logo-h,18px);width:auto}
.lg img{display:block;width:min(100%,600px);height:auto;animation:lgl 5s infinite steps(1)}
@keyframes lgl{0%,90%,100%{transform:none;filter:none}92%{transform:translateX(-8px);filter:drop-shadow(6px 0 #b9b2a4)}95%{transform:translateX(6px) skewX(-4deg)}}
.fl{display:block;height:22px;width:auto;margin:0 auto 14px}
@media(max-width:820px){.logo img{height:calc(var(--logo-h,18px)*.85)}}
.mq{overflow:hidden;white-space:nowrap;border-block:1px solid var(--ln);font:12px var(--m);letter-spacing:.12em;color:var(--mut);padding:10px 0;background:var(--pn)}
#mq{display:inline-block;animation:mq 45s linear infinite}@keyframes mq{to{transform:translateX(-50%)}}
.sh{padding:90px clamp(16px,5vw,70px) 10px}.sh h2{font:700 clamp(46px,9vw,120px)/1 var(--d)}.sh p{max-width:480px;margin-top:12px;color:var(--mut)}
.drop{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,5vw,70px);align-items:center;padding:clamp(50px,8vw,110px) clamp(16px,5vw,70px);border-top:1px solid var(--ln);transition:--tee .5s}
.drop.alt .stage{order:2}
.stage{width:100%;max-width:470px;margin-inline:auto;aspect-ratio:400/460;position:relative}
.stage::before{content:"";position:absolute;inset:10% 2% 0;border-radius:50%;background:radial-gradient(closest-side,rgba(229,18,27,.3),transparent);filter:blur(24px)}
.tilt{position:absolute;inset:0;transition:transform .15s;transform-style:preserve-3d}
.tilt::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.28),transparent 45%);mix-blend-mode:overlay;opacity:0;transition:opacity .3s;pointer-events:none}.tilt:hover::after{opacity:1}
.tee{position:relative;width:100%;height:100%;display:block;filter:drop-shadow(0 28px 26px rgba(0,0,0,.45))}.tb{fill:var(--tee);stroke:rgba(128,128,128,.55);stroke-width:2}
.slot{position:absolute;left:31%;top:24%;width:38%;height:37%;display:grid;place-items:center;border:1px dashed rgba(229,18,27,.75);overflow:hidden;text-align:center;font:10px/1.5 var(--m);color:var(--red)}
.slot::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--red);box-shadow:0 0 12px var(--red);animation:sc 2.6s linear infinite}@keyframes sc{from{top:0}to{top:100%}}
.slot i{position:absolute;width:10px;height:10px;border:2px solid var(--red)}
.slot i:nth-of-type(1){top:-1px;left:-1px;border-right:0;border-bottom:0}.slot i:nth-of-type(2){top:-1px;right:-1px;border-left:0;border-bottom:0}
.slot i:nth-of-type(3){bottom:-1px;left:-1px;border-right:0;border-top:0}.slot i:nth-of-type(4){bottom:-1px;right:-1px;border-left:0;border-top:0}
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.slot img:not([src]){display:none}.slot.has{border-color:transparent}.slot.has .ph,.slot.has::after,.slot.has i{display:none}
.pic .stage{aspect-ratio:1}.pic .stage::before{inset:4% 0}
.photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#fff;clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px))}
.photo.sw{animation:ps .45s steps(3)}@keyframes ps{0%{opacity:.2;transform:translateX(-12px);filter:contrast(2.2)}50%{opacity:.75;transform:translateX(9px)}100%{opacity:1;transform:none}}
.pic .tilt::before{content:"";position:absolute;left:0;right:0;height:2px;z-index:2;background:var(--red);box-shadow:0 0 14px var(--red);opacity:.7;pointer-events:none;animation:sc 3.6s linear infinite}
.fsb{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:6px 12px;border:1px solid var(--red);font:12px var(--m);color:var(--red)}
.pr small{display:block;font:11px var(--m);color:var(--red);margin-top:2px}
.info{max-width:480px}.info h2{font:700 clamp(40px,6vw,78px)/1 var(--d);margin:6px 0 8px}.tg{color:var(--mut);margin-bottom:22px}
.eye{font:12px var(--m);color:var(--red)}.row{font:12px var(--m);color:var(--mut);margin:14px 0 8px}.row b{color:var(--fg)}
.swt,.szs,.vws{display:flex;gap:10px;flex-wrap:wrap}
.swt button{width:36px;height:36px;border-radius:50%;background:var(--c);border:1px solid var(--ln);transition:box-shadow .2s}
.swt .on{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--red)}
.szs button,.vws button{min-width:48px;padding:8px 10px;border:1px solid var(--ln);font:12px var(--m)}.szs .on,.vws .on{background:var(--fg);color:var(--bg)}
.buy{display:flex;align-items:center;gap:22px;margin-top:30px}.pr{font:700 34px var(--d)}
footer{padding:60px 16px 70px;text-align:center;border-top:1px solid var(--ln);color:var(--mut);font-size:13px}footer svg{width:26px;height:42px;color:var(--red);display:block;margin:0 auto 12px}
#shd{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:85;opacity:0;visibility:hidden;transition:.3s}#shd.on{opacity:1;visibility:visible}
#cart{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);z-index:90;background:var(--pn);border-left:1px solid var(--red);transform:translateX(100%);transition:transform .4s cubic-bezier(.7,0,.2,1);display:flex;flex-direction:column;padding:calc(18px + env(safe-area-inset-top,0px)) 20px calc(18px + env(safe-area-inset-bottom,0px))}
#cart.open{transform:none}.ch{display:flex;justify-content:space-between;font:700 22px var(--d);padding-bottom:14px;border-bottom:1px solid var(--ln)}
#items{flex:1;overflow:auto;padding:10px 0}.it{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ln)}
.it i{width:18px;height:18px;border-radius:50%;border:1px solid var(--ln)}.it small{display:block;font:11px var(--m);color:var(--mut)}
.qt{display:flex;align-items:center;gap:8px;font:12px var(--m)}.qt button{width:24px;height:24px;border:1px solid var(--ln)}
.cf .row{display:flex;justify-content:space-between;font-size:16px;color:var(--fg)}.cf p{font-size:12px;color:var(--mut);margin:6px 0 14px}.cf .bt{width:100%}.msg{color:var(--red)!important;font-family:var(--m)}
@media(max-width:820px){#hero,.drop{grid-template-columns:1fr}.drop.alt .stage{order:0}.hm,#dots{display:none}#hud nav{margin-left:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;z-index:999;background:var(--red);color:#fff;padding:8px 14px}.skip:focus{left:8px;top:8px}
a{color:inherit;text-decoration:none}
.logo{display:flex;align-items:center}
.pic .tee{display:none}.photo[hidden]{display:none}
.swt button.off,.szs button.off{opacity:.38}.szs button.off{text-decoration:line-through}
.pr s{font:12px var(--m);color:var(--mut);margin-right:6px}
.msg{min-height:1em;margin-top:8px;font:12px var(--m)}
.buy .bt:disabled,#co:disabled{opacity:.5;cursor:not-allowed;transform:none}
#hero:not(:has(.hr)){grid-template-columns:1fr}
.no-boot #boot{display:none!important}
.pagew{max-width:1100px;margin:0 auto;padding:130px clamp(16px,5vw,40px) 80px}
.ph1{font:700 clamp(40px,8vw,96px)/1 var(--d);margin-bottom:24px}
.rte{max-width:720px;color:var(--mut)}.rte a{color:var(--red)}.rte h2,.rte h3{margin:24px 0 8px;color:var(--fg)}.rte p{margin-bottom:12px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;margin:24px 0}
.card{display:block;border:1px solid var(--ln);padding:12px;background:var(--pn);transition:border-color .2s,transform .2s}.card:hover{border-color:var(--red);transform:translateY(-3px)}
.card img{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#fff;margin-bottom:10px}
.card h3{font:700 18px var(--d)}.cpr{font:12px var(--m);color:var(--mut)}
.sf{display:flex;gap:10px;margin:16px 0;flex-wrap:wrap}.fld{flex:1;min-width:200px;padding:12px;border:1px solid var(--ln);background:var(--pn);color:var(--fg);font:inherit;cursor:text}
.pagn{display:flex;gap:18px;align-items:center;justify-content:center;font:12px var(--m);margin-top:20px}.pagn a{color:var(--red)}
.it img{width:48px;height:48px;object-fit:cover;background:#fff}
.it.big{grid-template-columns:72px 1fr auto auto auto}.it.big img{width:72px;height:72px}
.it input{width:64px;padding:6px;border:1px solid var(--ln);background:var(--pn);color:var(--fg);font:12px var(--m);cursor:text}
.fnav{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}.fnav a:hover{color:var(--red)}
footer img{display:block;height:22px;width:auto;margin:0 auto 14px}
.pw{min-height:100vh;display:grid;place-content:center;gap:18px;text-align:center;padding:24px}
.pw .logo{justify-content:center}
