/* Online store samples: shared base. Each layout file (s1.css ... s10.css) gives the store its own look. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--bf);overflow-x:clip;-webkit-font-smoothing:antialiased;padding-bottom:60px}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--hf);margin:0;line-height:1.1;text-wrap:balance;overflow-wrap:break-word}
p{text-wrap:pretty}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:300;background:var(--ink);color:var(--bg);padding:10px 16px;text-decoration:none;border-radius:8px}
.skip:focus{top:12px}
.wrap{width:min(1240px,100% - 40px);margin-inline:auto}
.ic{flex:none}
.fine{font-size:13px;color:var(--mute)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;background:var(--acc);color:var(--on);text-decoration:none;font:600 15px/1.2 var(--bf);border:0;border-radius:var(--br,999px);cursor:pointer;transition:transform .2s cubic-bezier(.2,.8,.2,1),filter .2s}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:scale(.97)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.sm{min-height:42px;padding:9px 16px;font-size:14px}
.btn.wide{width:100%}
.tl{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:600;text-underline-offset:4px;color:var(--ink);background:none;border:0;padding:0;cursor:pointer}
body.lock{overflow:hidden}

/* announcement + header */
.ann{margin:0;background:var(--ink);color:var(--bg);text-align:center;font-size:13px;font-weight:600;padding:8px 16px;letter-spacing:.02em}
.hd{position:sticky;top:0;z-index:80;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
.hd.sc{box-shadow:0 8px 30px -20px rgba(0,0,0,.35)}
.hd-in{display:flex;align-items:center;gap:14px;min-height:64px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:700 19px/1 var(--hf);min-height:44px;min-width:0}
.logo i{width:34px;height:34px;border-radius:var(--lr,10px);background:var(--acc);color:var(--on);display:grid;place-items:center;font:700 13px/1 var(--bf);font-style:normal;flex:none}
.logo span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-nav{display:flex;gap:2px;margin:0 auto}
.hd-nav a{text-decoration:none;font-size:14px;font-weight:500;padding:10px 12px;border-radius:999px;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
.hd-nav a:hover,.hd-nav a[aria-current]{background:color-mix(in srgb,var(--ink) 7%,transparent)}
.hd-act{display:flex;gap:2px;margin-left:auto}
.hd-nav+.hd-act{margin-left:0}
.hd-b{position:relative;width:44px;height:44px;border-radius:999px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:inherit;text-decoration:none}
.hd-b:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)}
.cnt{position:absolute;top:3px;right:1px;min-width:18px;height:18px;border-radius:9px;background:var(--acc);color:var(--on);font:700 11px/18px var(--bf);text-align:center;padding:0 4px}
.cnt[hidden]{display:none}
.hd-menu{display:none}
@media (max-width:980px){.hd-nav{display:none}.hd-menu{display:grid;margin-left:-8px}.hd-act{margin-left:auto}}

/* drawers + overlay + search */
.ov{position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.42)}
.ov[hidden]{display:none}
.dr{position:fixed;top:0;bottom:0;right:0;z-index:130;width:min(420px,100%);background:var(--bg);color:var(--ink);display:flex;flex-direction:column;box-shadow:-20px 0 60px -20px rgba(0,0,0,.4);transform:translateX(100%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.dr.dr-l{right:auto;left:0;transform:translateX(-100%)}
.dr[hidden]{display:none}
.dr.on{transform:none}
.dr:focus{outline:none}
.dr-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.dr-h h2{font-size:20px}
.dr-b{flex:1;overflow:auto;padding:8px 18px}
.dr-f{padding:16px 18px 76px;border-top:1px solid var(--line);display:grid;gap:12px}
.dr-free{margin:0;font-size:14px;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--acc) 12%,var(--surf))}
.dr-empty{text-align:center;padding:48px 0;display:grid;gap:14px;justify-items:center}
.dr-empty[hidden]{display:none}
.mnav{display:flex;flex-direction:column;padding:10px 18px}
.mnav a{text-decoration:none;font:600 20px/1.2 var(--hf);padding:14px 0;border-bottom:1px solid var(--line)}
.srch{position:fixed;left:0;right:0;top:0;z-index:140;background:var(--bg);padding:16px 0 20px;box-shadow:0 20px 60px -20px rgba(0,0,0,.4)}
.srch[hidden]{display:none}
.srch-f{display:flex;align-items:center;gap:12px;border-bottom:2px solid var(--ink);padding-bottom:8px}
.srch-f input{flex:1;min-width:0;border:0;background:transparent;font-size:22px;padding:8px 0;outline:none}
.srch-s{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px;font-size:14px}
.srch-s p{margin:0;color:var(--mute)}
.srch-s a{padding:6px 12px;border-radius:999px;border:1px solid var(--line);text-decoration:none;min-height:36px;display:inline-flex;align-items:center}

/* cart items */
.ci{list-style:none;margin:0;padding:0}
.ci li{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.ci-im{position:relative;display:block}
.ci-im img{width:72px;height:72px;object-fit:cover;border-radius:10px;background:var(--surf)}
.ci-b{display:grid;gap:4px;min-width:0}
.ci-n{font-weight:600;text-decoration:none;line-height:1.3}
.ci-o{font-size:13px;color:var(--mute)}
.ci-r{display:flex;justify-content:space-between;align-items:center;gap:10px}
.ci-x{justify-self:start;background:none;border:0;padding:4px 0;font-size:13px;color:var(--mute);text-decoration:underline;cursor:pointer;min-height:28px}
.ci-co li{grid-template-columns:64px 1fr}
.ci-co .ci-im img{width:64px;height:64px}
.ci-q{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;border-radius:10px;background:var(--ink);color:var(--bg);font:700 11px/20px var(--bf);text-align:center}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;overflow:hidden}
.qty button{width:44px;height:44px;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;font-size:18px}
.qty input{width:44px;border:0;text-align:center;background:transparent;font-weight:600;-moz-appearance:textfield;appearance:textfield}
.qty input::-webkit-inner-spin-button{appearance:none}
.qty.sm button{width:32px;height:32px}
.qty.sm span{min-width:22px;text-align:center;font-weight:600;font-size:14px}
.tot{margin:0;display:grid;gap:6px}
.tot div{display:flex;justify-content:space-between;gap:12px}
.tot dt{color:var(--mute)}
.tot dd{margin:0;font-weight:600}
.tot .grand{border-top:1px solid var(--line);padding-top:10px;margin-top:4px;font-size:18px}
.tot .grand dt{color:var(--ink);font-weight:700}
.tot [hidden]{display:none}

/* product cards + grids */
.pg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 18px}
@media (max-width:1000px){.pg{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.pg{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}}
.pc{position:relative;display:flex;flex-direction:column;min-width:0}
.pc[hidden]{display:none}
.pc-im{position:relative;display:block;aspect-ratio:var(--par,4/5);overflow:hidden;border-radius:var(--cr,14px);background:var(--surf)}
.pc-im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s,transform .8s cubic-bezier(.2,.8,.2,1)}
.pc-im .alt{opacity:0}
.pc:hover .pc-im .alt{opacity:1}
.pc:hover .pc-im img{transform:scale(1.04)}
.bdg{position:absolute;top:10px;left:10px;z-index:2;background:var(--bg);color:var(--ink);font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;letter-spacing:.02em}
.bdg.sale{background:#c62828;color:#fff}
.wl{position:absolute;top:8px;right:8px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .2s}
.wl:hover{transform:scale(1.08)}
.wl[aria-pressed=true] .ic{fill:#e0245e;stroke:#e0245e}
.pc-b{padding:12px 2px 0;display:flex;flex-direction:column;gap:4px;flex:1}
.pc-c{margin:0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.pc-n{font:600 16px/1.3 var(--bf)}
.pc-n a{text-decoration:none}
.pc-n a:hover{text-decoration:underline}
.price{margin:0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.price .now{font-weight:700}
.price s{color:var(--mute);font-size:14px}
.price em{font-style:normal;font-size:12px;font-weight:700;color:#c62828}
.qa{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;margin-top:8px;border-radius:var(--br,999px);border:1.5px solid var(--line);background:transparent;font-size:14px;font-weight:600;text-decoration:none;cursor:pointer}
.qa:hover{border-color:var(--ink)}
.stars{display:inline-flex;gap:2px;color:#e3a008}
.stars .ic{fill:currentColor}

/* home sections */
.sec{padding:clamp(56px,8vw,100px) 0}
.sh{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:8px 20px;margin-bottom:clamp(22px,3vw,36px)}
.sh-k{margin:0;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--acct);width:100%}
.sh h2{font-size:clamp(28px,4vw,48px);letter-spacing:-.02em}
.sh-l{display:inline-flex;align-items:center;gap:6px;font-weight:600;text-decoration:none;min-height:44px}
.sh.c{justify-content:center;text-align:center;flex-direction:column;align-items:center}
.ct{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
.ct a{display:block;text-decoration:none}
.ct-i{display:block;aspect-ratio:1;overflow:hidden;border-radius:var(--cr,14px);background:var(--surf)}
.ct-i img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.ct a:hover img{transform:scale(1.06)}
.ct h3{font-size:18px;margin:12px 0 2px}
.ct-n{font-size:13px;color:var(--mute)}
.prom{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.prom li{display:flex;gap:12px;align-items:flex-start;padding:18px;border-radius:var(--cr,14px);background:var(--surf)}
.prom .ic{color:var(--acct);margin-top:2px}
.prom span{display:grid;font-size:14px;color:var(--mute)}
.prom b{color:var(--ink);font-size:15px}
@media (max-width:900px){.prom{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:460px){.prom{grid-template-columns:minmax(0,1fr)}}
.rv-n{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--mute);margin:0 0 18px}
.rv-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.rv-g figure{margin:0;padding:24px;border-radius:var(--cr,16px);background:var(--surf);display:flex;flex-direction:column;gap:12px}
.rv-g blockquote{margin:0;flex:1}
.rv-g figcaption{font-size:14px;color:var(--mute)}
.rv-g figcaption b{color:var(--ink)}
@media (max-width:900px){.rv-g{grid-template-columns:minmax(0,1fr)}}
.nl{display:grid;gap:8px;max-width:520px}
.nl label{font-size:14px;font-weight:600}
.nl-row{display:flex;gap:8px}
.nl input{flex:1;min-width:0;min-height:48px;padding:12px 14px;border-radius:var(--fr,12px);border:1.5px solid var(--line);background:var(--surf);color:var(--ink);font-size:16px}
.f-ok{margin:0;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--acc) 14%,var(--surf));font-size:14px}
.f-ok[hidden]{display:none}

/* shop */
.bc{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:14px;color:var(--mute);padding:18px 0 4px}
.bc a{text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.bc a:hover{text-decoration:underline}
.shop-h{padding:12px 0 24px}
.shop-h h1{font-size:clamp(34px,5vw,58px);letter-spacing:-.02em}
.shop-h p{color:var(--mute);margin:8px 0 0;max-width:46em}
.shop{display:grid;grid-template-columns:250px minmax(0,1fr);gap:36px;padding-bottom:80px}
.flt{display:grid;gap:22px;align-content:start;position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto;padding-right:6px}
.flt-h{display:flex;justify-content:space-between;align-items:center}
.flt-h h2{font-size:20px}
.flt-x{display:none}
.fg{border:0;margin:0;padding:0;display:grid;gap:4px}
.fg-t{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-bottom:6px;padding:0}
.fq{min-height:44px;padding:10px 12px;border-radius:var(--fr,10px);border:1.5px solid var(--line);background:var(--surf)}
.ck{display:flex;align-items:center;gap:10px;min-height:36px;cursor:pointer;font-size:15px}
.ck input{width:18px;height:18px;accent-color:var(--acc);margin:0;flex:none}
.ck i{margin-left:auto;font-style:normal;font-size:12px;color:var(--mute)}
.ck-sw{display:flex;flex-wrap:wrap;gap:6px 14px}
.ck.sw{font-size:14px}
.dot{width:18px;height:18px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);display:inline-block;flex:none}
.flt input[type=range]{width:100%;accent-color:var(--acc);min-height:32px}
.tb{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.cnt-t{margin:0;color:var(--mute);font-size:14px;margin-right:auto}
.srt{display:inline-flex;align-items:center;gap:8px;font-size:14px}
.srt select{min-height:42px;padding:8px 12px;border-radius:var(--fr,10px);border:1.5px solid var(--line);background:var(--surf)}
.flt-o{display:none}
.none{padding:60px 0;text-align:center;display:grid;gap:12px;justify-items:center}
.none[hidden]{display:none}
@media (max-width:900px){
 .shop{grid-template-columns:minmax(0,1fr)}
 .flt{position:fixed;top:0;bottom:0;left:0;z-index:130;width:min(340px,90%);max-height:none;background:var(--bg);padding:16px 18px 80px;transform:translateX(-102%);transition:transform .35s cubic-bezier(.2,.8,.2,1);box-shadow:20px 0 60px -20px rgba(0,0,0,.4);visibility:hidden}
 .flt.on{transform:none;visibility:visible}
 .flt-x,.flt-o{display:inline-flex}
}

/* product page */
.pd{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,5vw,64px);padding:12px 0 60px}
.gal{position:sticky;top:84px;align-self:start;display:grid;gap:12px}
.gal-m{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--cr,16px);background:var(--surf)}
.gal-f{margin:0;position:absolute;inset:0}
.gal-f[hidden]{display:none}
.gal-f img{width:100%;height:100%;object-fit:cover}
.gal-t{display:flex;gap:10px}
.gal-t button{width:76px;height:76px;padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;background:var(--surf);cursor:pointer}
.gal-t button[aria-pressed=true]{border-color:var(--ink)}
.gal-t img{width:100%;height:100%;object-fit:cover}
.pd-i{display:grid;gap:16px;align-content:start}
.pd-c{margin:0;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.pd-c a{color:var(--acct);text-decoration:none}
.pd-i h1{font-size:clamp(30px,3.6vw,44px);letter-spacing:-.02em}
.pd-p{font-size:22px}
.pd-d{margin:0;color:var(--mute);font-size:17px}
.buy{display:grid;gap:16px}
.opt{border:0;margin:0;padding:0}
.opt legend{font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:0}
.opt legend b{font-weight:500;color:var(--mute)}
.opt-v{display:flex;flex-wrap:wrap;gap:8px}
.opv{position:relative;display:inline-flex}
.opv input{position:absolute;opacity:0;width:1px;height:1px}
.opv span{display:inline-flex;align-items:center;min-height:44px;min-width:48px;justify-content:center;padding:8px 14px;border-radius:var(--fr,10px);border:1.5px solid var(--line);cursor:pointer;font-size:15px}
.opv.sw{align-items:center}
.opv.sw .dot{position:absolute;left:12px;top:50%;transform:translateY(-50%);pointer-events:none}
.opv.sw span{padding-left:38px}
.opv input:checked+span,.opv input:checked+.dot+span{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);font-weight:600}
.opv input:focus-visible+span,.opv input:focus-visible+.dot+span{outline:3px solid var(--acc);outline-offset:2px}
.opt.bad .opv span{border-color:#d0342c}
.f-err{color:#d0342c;font-size:13px}
.f-err:empty{display:none}
.buy-r{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.buy-r .add{flex:1;min-width:160px}
.wl-b{position:static;width:48px;height:48px;border:1.5px solid var(--line)}
.pd-pr{list-style:none;margin:0;padding:16px 0;border-block:1px solid var(--line);display:grid;gap:10px;font-size:15px}
.pd-pr li{display:flex;gap:10px;align-items:center}
.pd-pr .ic{color:var(--acct)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{cursor:pointer;list-style:none;padding:16px 30px 16px 0;font-weight:600;position:relative;min-height:44px}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:22px}
.acc details[open] summary::after{content:"−"}
.acc p{margin:0 0 16px;color:var(--mute)}
.spec{margin:0 0 16px;display:grid}
.spec div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:15px}
.spec dt{color:var(--mute)}.spec dd{margin:0;text-align:right;font-weight:500}
.rel{padding:40px 0 80px}
.rel h2{font-size:clamp(24px,3vw,34px);margin-bottom:24px}
@media (max-width:900px){.pd{grid-template-columns:minmax(0,1fr)}.gal{position:static}.gal-m{aspect-ratio:1}}
.sg{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:150;width:min(560px,calc(100% - 24px));max-height:85vh;overflow:auto;background:var(--bg);border-radius:18px;padding:20px;box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
.sg[hidden],.ov-sg[hidden]{display:none}
.ov-sg{z-index:145}
.sg-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.sg-h h2{font-size:22px}
.tblw{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:15px}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line)}
th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}

/* checkout */
.pg-co h1,.pg-wl h1,.pg-pol h1{font-size:clamp(32px,4.5vw,52px);letter-spacing:-.02em;margin:8px 0 24px}
.co{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(24px,5vw,56px);align-items:start;padding-bottom:80px}
.co[hidden]{display:none}
.co-f{display:grid;gap:22px}
.co-f fieldset{border:0;margin:0;padding:0;display:grid;gap:12px}
.co-f legend{font:700 20px/1.2 var(--hf);margin-bottom:12px;padding:0}
.f-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.f-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.f-field.wide{grid-column:1/-1}
.f-field label{font-size:14px;font-weight:600}
.f-field input,.f-field select,.f-field textarea{min-height:50px;padding:12px 14px;border-radius:var(--fr,12px);border:1.5px solid var(--line);background:var(--surf);font-size:16px;width:100%;min-width:0}
.f-field textarea{resize:vertical;min-height:70px}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 22%,transparent)}
[aria-invalid=true]{border-color:#d0342c!important}
@media (max-width:600px){.f-grid{grid-template-columns:minmax(0,1fr)}}
.pay{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:var(--cr,14px);border:1.5px solid var(--line);cursor:pointer}
.pay:has(input:checked){border-color:var(--ink)}
.pay input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--acc);flex:none}
.pay span{display:grid;font-size:14px;color:var(--mute)}
.pay b{color:var(--ink);font-size:16px}
.bank{padding:14px 16px;border-radius:12px;background:var(--surf);font-size:14px}
.bank p{margin:0 0 4px}
.bank[hidden]{display:none}
.gift span{display:inline-flex;align-items:center;gap:8px}
.co-s{position:sticky;top:84px;background:var(--surf);border-radius:var(--cr,18px);padding:22px;display:grid;gap:14px}
.co-s h2{font-size:22px}
.co-empty{margin:0}
.co-empty[hidden]{display:none}
@media (max-width:900px){.co{grid-template-columns:minmax(0,1fr)}.co-s{position:static;order:-1}}
.done{padding:40px 0 100px;text-align:center;max-width:620px;margin:0 auto}
.done[hidden]{display:none}
.done-k{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--acc);color:var(--on);margin:0 0 16px}
.done h2{font-size:clamp(26px,3.4vw,38px);margin-bottom:12px}
.done p{color:var(--mute)}
.done .tl{margin-left:12px}
.pg-wl{padding-bottom:80px}
.wl-l{color:var(--mute);margin:-12px 0 24px}
.pg-pol{max-width:860px;padding-bottom:80px}
.pg-pol section{padding:28px 0;border-top:1px solid var(--line)}
.pg-pol h2{font-size:26px;margin-bottom:12px}
.pol-n{color:var(--mute)}
.pol-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.pol-toc a{padding:8px 14px;border-radius:999px;border:1px solid var(--line);text-decoration:none;min-height:40px;display:inline-flex;align-items:center}

/* footer */
.ft{padding:64px 0 32px;border-top:1px solid var(--line);font-size:15px;background:var(--bg)}
.ft-g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.ft-a p{color:var(--mute);margin:10px 0 0;max-width:30em}
.ft h2{font:700 13px/1.2 var(--bf);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin:0 0 12px}
.ft ul{list-style:none;margin:0;padding:0}
.ft li a{text-decoration:none;display:inline-flex;min-height:32px;align-items:center}
.ft li a:hover{text-decoration:underline}
.ft-b{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;color:var(--mute)}
.ft-b a{display:inline-flex;min-height:24px;align-items:center}
@media (max-width:860px){.ft-g{grid-template-columns:1fr 1fr}.ft-a{grid-column:1/-1}}

/* toast + sample bar */
.toast{position:fixed;left:50%;bottom:70px;transform:translateX(-50%);z-index:200;background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:12px;font-size:14px;font-weight:600;box-shadow:0 14px 40px -12px rgba(0,0,0,.5);max-width:calc(100% - 32px)}
.toast[hidden]{display:none}
.sbar{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);z-index:150;display:flex;align-items:center;gap:4px;background:rgba(12,12,14,.9);color:#fff;border-radius:999px;padding:4px 6px 4px 14px;font:500 13px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;box-shadow:0 10px 30px -10px rgba(0,0,0,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:nowrap;max-width:calc(100% - 20px)}
.sbar>span{opacity:.75;margin-right:6px}
.sbar a{color:#fff;text-decoration:none;font-weight:700;padding:8px 12px;border-radius:999px;min-height:34px;display:inline-flex;align-items:center}
.sbar a:first-of-type{background:#16a34a}
.sbar a:hover{background:rgba(255,255,255,.14)}
.sbar a:first-of-type:hover{background:#15803d}
@media (max-width:520px){.sbar .sb-more{display:none}.sbar>span{font-size:12px}}
body.lock .sbar{z-index:110}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.sw-o{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.sw-i{display:inline-block;will-change:transform}
.flt>*{min-width:0}
.fq{width:100%}
.ck span{min-width:0}
@media (min-width:901px){.flt{padding-right:14px;scrollbar-width:thin}}
@media (max-width:600px){.s6-ct{grid-template-columns:repeat(2,minmax(0,1fr))}.s8-ct{grid-template-columns:repeat(2,minmax(0,1fr))}.s1-ct{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pc-n a{display:inline-flex;align-items:center;min-height:24px}
.ck input{width:24px;height:24px}
.pay input{width:24px;height:24px;margin:0}
.opv input{inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.co-f label a,.ck a{display:inline-flex;min-height:24px;align-items:center}
.ft li a{min-width:24px}