:root {
  --g:    #c9a84c;
  --g2:   #e8cb72;
  --gdim: rgba(201,168,76,0.11);
  --gg:   rgba(201,168,76,0.28);
  --bg:   #06080c;
  --bg2:  #0a0d16;
  --bg3:  #0e1220;
  --surf: rgba(255,255,255,0.025);
  --bdr:  rgba(255,255,255,0.07);
  --bdrg: rgba(201,168,76,0.2);
  --tx:   #f4f0e8;
  --tx2:  #9fa3b5;
  --mu:   #5a5e70;
  --red:  #e05c5c;
  --grn:  #2dcc8e;
  --fd:   'Cormorant Garamond', Georgia, serif;
  --fb:   'Outfit', sans-serif;
  --e1:   cubic-bezier(0.16,1,0.3,1);
  --e2:   cubic-bezier(0.34,1.56,0.64,1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: var(--bg);
  color: var(--tx);
  font-family: var(--fb);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}
body { overflow-x: hidden; }
body::before {
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 800px 600px at 80% -5%, rgba(201,168,76,0.07) 0%, transparent 55%),
    radial-gradient(ellipse 600px 500px at -5% 90%, rgba(201,168,76,0.05) 0%, transparent 55%);
}
body::after {
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:0.02;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px;
}

#humanGate {
  position:fixed; inset:0; z-index:10000;
  background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  transition:opacity 0.5s var(--e1);
}
#humanGate.hg-hidden { opacity:0; pointer-events:none; }
.hg-box { text-align:center; display:flex; flex-direction:column; align-items:center; gap:18px; padding:20px; }
.hg-logo { font-family:var(--fd); font-weight:300; letter-spacing:0.3em; font-size:clamp(1.8em,6vw,3em); color:var(--tx); }
.hg-msg { color:var(--tx2); font-size:0.85em; letter-spacing:0.05em; margin:0; }
.hg-fallback { display:none; flex-direction:column; align-items:center; gap:12px; }
.hg-fallback.show { display:flex; }
.hg-btn { background:transparent; color:var(--tx); border:1px solid var(--bdrg); border-radius:999px; padding:12px 34px; font:inherit; font-size:0.9em; letter-spacing:0.08em; cursor:pointer; }
.hg-btn:hover { border-color:rgba(201,168,76,0.6); }

html.gate-locked #intro,
html.gate-locked #intro *,
html.gate-locked .brand,
html.gate-locked .slogan,
html.gate-locked .sub,
html.gate-locked .hlinks,
html.gate-locked .lang-switch {
  animation-play-state: paused !important;
}

#intro {
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  background:var(--bg);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px;
  animation:introOut 0.7s 1.6s var(--e1) forwards;
}
.i-logo { font-family:var(--fd); font-weight:300; letter-spacing:0.35em; font-size:clamp(2.6em,9vw,5em); color:var(--tx); animation:ilogoIn 1.2s var(--e1) both; }
.i-line { height:1px; width:0; background:linear-gradient(90deg,transparent,var(--g),transparent); animation:ilineIn 0.9s 0.5s var(--e1) forwards; }
.i-sub  { font-size:0.65em; letter-spacing:5px; text-transform:uppercase; color:var(--mu); opacity:0; animation:fadeUp 0.7s 0.7s var(--e1) forwards; }
@keyframes ilogoIn  { from{opacity:0;letter-spacing:0.7em;filter:blur(10px)} to{opacity:1;letter-spacing:0.35em;filter:none} }
@keyframes ilineIn  { to{width:70px} }
@keyframes introOut { to{opacity:0} }

.ann {
  position:relative; z-index:10;
  background:linear-gradient(90deg,var(--bg) 0%,#140b00 40%,#140b00 60%,var(--bg) 100%);
  border-bottom:1px solid var(--bdrg);
  padding:10px 16px; text-align:center;
  font-size:0.7em; font-weight:500; letter-spacing:3px; text-transform:uppercase; color:var(--g2);
  opacity:0; animation:fadeDown 0.5s 1.9s var(--e1) forwards;
}
.ann-in { display:inline-flex; align-items:center; gap:12px; }
.adot   { width:5px; height:5px; border-radius:50%; background:var(--g); animation:adot 2.4s ease-in-out infinite; }
@keyframes fadeDown { from{transform:translateY(-20px);opacity:0} to{transform:none;opacity:1} }
@keyframes adot     { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.25;transform:scale(0.5)} }

.cart-btn {
  position:fixed; top:47px; right:13px; z-index:300;
  background:var(--g); color:#06080c;
  padding:9px 18px; border-radius:4px;
  font-size:0.72em; font-weight:700; letter-spacing:0.8px;
  cursor:pointer; display:flex; align-items:center; gap:9px;
  box-shadow:0 4px 32px var(--gg);
  transition:transform 0.3s var(--e1), box-shadow 0.3s;
  user-select:none; -webkit-user-select:none;
  opacity:0; animation:popIn 0.5s 2s var(--e2) forwards;
  border:none; font-family:var(--fb);
}
.cart-btn:hover  { transform:translateY(-2px) scale(1.05); box-shadow:0 10px 44px rgba(201,168,76,0.5); }
.cart-btn:active { transform:scale(0.94); }
.cart-btn:focus-visible { outline:2px solid var(--g2); outline-offset:3px; }
.cbadge {
  background:#06080c; color:var(--g);
  padding:2px 7px; border-radius:2px; font-size:0.88em; min-width:20px; text-align:center;
}
.cart-btn.bump .cbadge { animation:cbump 0.4s var(--e2); }

html.modal-open .cart-btn,
html.modal-open .home-btn,
html.modal-open .my-orders-btn {
  opacity:0 !important; pointer-events:none !important;
  transition:opacity 0.15s;
}

.my-orders-btn {
  position:fixed; top:88px; right:13px; z-index:300;
  background:transparent; color:var(--tx2);
  padding:6px 14px; border-radius:4px; border:1px solid var(--bdr);
  font-size:0.62em; font-weight:600; letter-spacing:0.6px;
  cursor:pointer; transition:all 0.25s var(--e1);
  opacity:0; animation:popIn 0.5s 2.1s var(--e2) forwards;
  font-family:var(--fb);
}
.my-orders-btn:hover { border-color:var(--g); color:var(--g2); transform:translateY(-2px); }
.my-orders-btn:active { transform:scale(0.94); }
.my-orders-btn:focus-visible { outline:2px solid var(--g2); outline-offset:3px; }

.home-btn {
  position:fixed; top:47px; left:13px; z-index:300;
  background:transparent; color:var(--tx);
  padding:9px 16px; border-radius:4px; border:1px solid var(--bdrg);
  font-size:0.72em; font-weight:700; letter-spacing:0.8px;
  cursor:pointer; display:flex; align-items:center; gap:7px;
  transition:all 0.25s var(--e1);
  opacity:0; animation:popIn 0.5s 2s var(--e2) forwards;
  font-family:var(--fb);
}
.home-btn svg { width:15px; height:15px; fill:var(--tx); transition:fill 0.25s; }
.home-btn:hover { border-color:var(--g); color:var(--g2); transform:translateY(-2px); }
.home-btn:hover svg { fill:var(--g2); }
.home-btn:active { transform:scale(0.94); }
.home-btn:focus-visible { outline:2px solid var(--g2); outline-offset:3px; }
@media(max-width:480px) { .home-btn span { display:none; } .home-btn { padding:10px; } }
@keyframes cbump { 0%,100%{transform:scale(1)} 45%{transform:scale(1.6) rotate(-10deg)} }
@keyframes popIn { from{opacity:0;transform:scale(0.5) translateY(12px)} to{opacity:1;transform:none} }

.hdr {
  position:relative; z-index:1;
  padding:86px 20px 60px; text-align:center;
}
.hdr::after {
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:1px; height:60px; background:linear-gradient(180deg,transparent,var(--bdrg));
}
.brand {
  font-family:var(--fd); font-size:clamp(3.6em,12vw,7.5em);
  font-weight:300; letter-spacing:0.22em; color:var(--tx); line-height:1;
  display:inline-block; position:relative;
  opacity:0; animation:brandIn 1.4s 1.8s var(--e1) forwards;
}
.brand::after {
  content:''; position:absolute; bottom:-10px; left:5%; right:5%; height:1px;
  background:linear-gradient(90deg,transparent,var(--g) 25%,var(--g2) 50%,var(--g) 75%,transparent);
  opacity:0; transform:scaleX(0); transform-origin:center;
  animation:lineIn 1.1s 2.3s var(--e1) forwards;
}
.slogan { font-family:var(--fd); font-size:clamp(1.2em,4.5vw,2em); font-weight:300; font-style:italic; color:var(--g2); letter-spacing:0.1em; margin:22px 0 8px; opacity:0; animation:fadeUp 0.9s 2s var(--e1) forwards; }
.sub    { font-size:0.67em; color:var(--mu); letter-spacing:4.5px; text-transform:uppercase; margin-bottom:32px; opacity:0; animation:fadeUp 0.9s 2.1s var(--e1) forwards; }
.hlinks { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; opacity:0; animation:fadeUp 0.9s 2.2s var(--e1) forwards; }
.hlink {
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  padding:11px 24px; font-size:0.71em; font-weight:500; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--g2); border:1px solid var(--bdrg); border-radius:3px;
  position:relative; overflow:hidden; transition:color 0.3s, border-color 0.3s;
}
.hlink::before { content:''; position:absolute; inset:0; background:var(--gdim); transform:translateX(-101%); transition:transform 0.38s var(--e1); }
.hlink:hover::before { transform:translateX(0); }
.hlink:hover { border-color:var(--g); color:var(--g); }
.hlink span { position:relative; z-index:1; }
.hlink.wa { border-color:rgba(37,211,102,0.27); color:rgba(90,220,130,0.9); }
.hlink.wa::before { background:rgba(37,211,102,0.07); }
.hlink.wa:hover { border-color:#25d366; color:#25d366; }

.lang-switch {
  opacity:0;
  transform:translateY(-10px);
  animation:fadeUp 0.85s 1.45s var(--e1) both;
}

.lang-btn {
  will-change: transform, color, border-color;
}

.panel {
  will-change: transform, opacity;
}

.panel.open { transition:transform 0.42s var(--e2), opacity 0.32s ease; opacity:1; }

.panel-body {
  transition:opacity 0.35s ease, transform 0.35s ease;
}

.clist, .receipt, .fg, .sub-btn, .add-btn, .cart-btn {
  transition:transform 0.3s var(--e1), opacity 0.3s var(--e1), box-shadow 0.3s var(--e1), border-color 0.3s var(--e1);
}

.cart-btn:hover, .sub-btn:hover:not(:disabled), .add-btn:hover:not(:disabled), .lang-btn:hover {
  transform:translateY(-2px) scale(1.01);
}

.lang-btn.active {
  background:rgba(201,168,76,0.12);
  border-color:var(--g);
  color:var(--g);
}

.fg label, .rr span, .pb-title, .pb-brand {
  transition:color 0.25s ease;
}

.card {
  will-change:transform,opacity,box-shadow;
}

.card:hover { transform:translateY(-7px) scale(1.018); }

@keyframes brandIn { from{opacity:0;transform:translateY(22px) scale(0.93);filter:blur(8px)} to{opacity:1;transform:none;filter:none} }
@keyframes lineIn  { from{opacity:0;transform:scaleX(0)} to{opacity:1;transform:scaleX(1)} }
@keyframes fadeUp  { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }

.store { max-width:1140px; margin:0 auto; padding:28px 12px 140px; position:relative; z-index:1; }

.sec { margin-bottom:68px; opacity:0; transform:translateY(26px); transition:opacity 0.8s var(--e1), transform 0.8s var(--e1); }
.sec.sec-hidden { display:none; }

.search-wrap { position:relative; max-width:480px; margin:20px auto 8px; }
.search-input {
  width:100%; padding:12px 42px 12px 16px; border-radius:10px;
  background:var(--surf); border:1px solid var(--bdr); color:var(--tx);
  font-size:0.88em; font-family:var(--fb); transition:border-color 0.2s;
}
.search-input:focus { outline:none; border-color:var(--g); }
.search-input::placeholder { color:var(--mu); }
.search-clear {
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  background:transparent; border:none; color:var(--tx2); font-size:1.3em;
  line-height:1; cursor:pointer; padding:4px 8px;
}
.search-clear:hover { color:var(--tx); }
.search-clear { display:none; }
.search-no-results { text-align:center; color:var(--mu); font-size:0.88em; padding:20px 0 10px; display:none; }
.card.search-hide { display:none; }

.cat-picker { padding:24px 0 48px; text-align:center; }
.cat-picker-title { font-family:var(--fd); font-weight:300; font-size:clamp(1.4em,4.5vw,2.1em); color:var(--tx); margin:0 0 28px; letter-spacing:0.03em; }
.cat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; max-width:820px; margin:0 auto; }
@media(min-width:640px) { .cat-grid { grid-template-columns:repeat(4,1fr); } }
.cat-tile {
  display:flex; flex-direction:column; align-items:stretch; text-align:left;
  border:1px solid var(--bdr); border-radius:14px;
  background:var(--surf); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  padding:10px; cursor:pointer; overflow:hidden;
  transition:transform 0.3s var(--e1), border-color 0.3s, box-shadow 0.3s;
}
.cat-tile:hover { transform:translateY(-5px) scale(1.015); border-color:rgba(201,168,76,0.5); box-shadow:0 16px 44px rgba(0,0,0,0.5), 0 0 0 1px var(--bdrg); }
.cat-tile .img-w { width:100%; aspect-ratio:1/1; overflow:hidden; border-radius:9px; background:var(--bg3); margin-bottom:12px; }
.cat-tile .img-w.img-w-grid { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:2px; }
.cat-tile img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.65s var(--e1), filter 0.65s; }
.cat-tile:hover img { transform:scale(1.1); filter:brightness(1.06); }
.cat-tile:hover .img-w-grid img { transform:none; filter:none; }
.cat-tile span {
  padding:0; font-size:0.8em; font-weight:400; color:var(--tx);
  line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.cat-tile-all { margin-top:16px; max-width:820px; width:100%; background:transparent; border-style:dashed; color:var(--tx2); padding:16px; text-align:center; }
.cat-tile-all:hover { border-color:var(--g); color:var(--g2); transform:none; box-shadow:none; }

.cat-nav {
  display:none; gap:8px; overflow-x:auto; padding:4px 0 18px; margin-bottom:8px;
  border-bottom:1px solid var(--bdr); scrollbar-width:none;
}
.cat-nav::-webkit-scrollbar { display:none; }
.cat-nav.on { display:flex; }
.cat-nav-btn {
  flex-shrink:0; padding:8px 16px; border-radius:999px; background:transparent;
  border:1px solid var(--bdr); color:var(--tx2); font-size:0.78em; font-weight:600;
  cursor:pointer; white-space:nowrap; transition:all 0.2s;
}
.cat-nav-btn:hover { border-color:var(--tx2); color:var(--tx); }
.cat-nav-btn.active { border-color:var(--g); color:var(--g2); background:rgba(201,168,76,0.1); }
.sec.vis { opacity:1; transform:none; }
.sec-hd { display:flex; align-items:center; gap:14px; margin-bottom:26px; }
.sec-t   { font-family:var(--fd); font-size:1.8em; font-weight:400; color:var(--tx); letter-spacing:0.06em; white-space:nowrap; }
.sec-n   { font-size:0.6em; font-family:var(--fb); color:var(--g); border:1px solid var(--bdrg); border-radius:3px; padding:3px 9px; letter-spacing:1.5px; font-weight:600; text-transform:uppercase; flex-shrink:0; }
.sec-rule{ flex:1; height:1px; background:linear-gradient(90deg,var(--bdrg),transparent); min-width:10px; }

.g2 { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.g1 { display:grid; grid-template-columns:1fr; }
@media(min-width:560px) { .g2 { gap:14px; } }
@media(min-width:900px) { .g2 { grid-template-columns:repeat(4,1fr); gap:16px; } }

.card {
  border:1px solid var(--bdr); border-radius:14px;
  background:var(--surf); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  padding:10px 10px 54px;
  position:relative; display:flex; flex-direction:column;
  opacity:0; transform:translateY(20px) scale(0.97);
  transition:opacity 0.55s var(--e1), transform 0.55s var(--e1), border-color 0.4s, box-shadow 0.4s;
  isolation:isolate; overflow:hidden;
}
.card.vis { opacity:1; transform:none; }
.card::before {
  content:''; position:absolute; inset:0; border-radius:14px; pointer-events:none; z-index:0;
  background:radial-gradient(ellipse 90% 55% at 50% 0%, rgba(201,168,76,0.1) 0%, transparent 70%);
  opacity:0; transition:opacity 0.5s;
}
.card:hover { transform:translateY(-6px) scale(1.018); border-color:rgba(201,168,76,0.5); box-shadow:0 20px 55px rgba(0,0,0,0.55), 0 0 0 1px var(--bdrg); }
.card:hover::before { opacity:1; }
.card-bundle { border-color:var(--bdrg) !important; background:linear-gradient(145deg,rgba(201,168,76,0.06),rgba(255,255,255,0.02)) !important; }
.card-bundle:hover { box-shadow:0 22px 65px rgba(201,168,76,0.22), 0 0 0 1px var(--g) !important; }

.img-w { width:100%; aspect-ratio:1/1; overflow:hidden; border-radius:9px; background:var(--bg3); margin-bottom:12px; position:relative; flex-shrink:0; }
.img-w.wide { aspect-ratio:2.2/1; }
.img-w img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.65s var(--e1), filter 0.65s; will-change:transform; }
.card:hover .img-w img { transform:scale(1.1); filter:brightness(1.06); }
.img-w img.img-broken { object-fit:contain; padding:18%; opacity:0.35; }

.sold { position:absolute; inset:0; border-radius:9px; background:rgba(6,8,12,0.8); backdrop-filter:blur(3px); display:flex; align-items:center; justify-content:center; color:var(--red); font-size:0.67em; font-weight:700; letter-spacing:3px; text-transform:uppercase; z-index:2; }

.badge { position:absolute; top:8px; left:8px; z-index:5; font-size:0.58em; font-weight:700; padding:4px 10px; border-radius:3px; text-transform:uppercase; letter-spacing:1.5px; pointer-events:none; }
.bh { background:var(--red); color:#fff; }
.bb { background:var(--g); color:#06080c; }
.badge-row { position:absolute; top:8px; left:8px; right:8px; z-index:5; display:flex; flex-wrap:wrap; gap:6px; pointer-events:none; }
.badge-row .badge { position:static; }
.badge-discount { background:var(--red); color:#fff; font-size:clamp(0.52em,2.4vw,0.62em); }
.badge-preorder { background:var(--g); color:#06080c; font-size:clamp(0.52em,2.4vw,0.62em); margin-left:auto; }
.c-price-old { text-decoration:line-through; color:var(--mu); font-size:0.82em; margin-right:7px; }
.c-price-new { color:var(--g2); font-weight:700; }
.c-price-hint { color:var(--tx2); font-size:0.92em; }
.img-placeholder { display:flex; align-items:center; justify-content:center; background:var(--bg3); border:1px dashed var(--bdr); }
.ph-text { color:var(--mu); font-size:clamp(0.7em,2.6vw,0.85em); letter-spacing:0.04em; text-align:center; padding:0 12px; }

.c-title { font-size:0.8em; font-weight:400; color:var(--tx); line-height:1.4; min-height:2.4em; margin:0 0 6px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; position:relative; z-index:1; }
.c-desc  { font-size:0.75em; color:var(--tx2); line-height:1.58; margin:0 0 10px; z-index:1; position:relative; }
.c-price { font-size:0.9em; font-weight:600; color:var(--tx); position:relative; z-index:1; }
.oldp    { font-size:0.82em; color:var(--mu); text-decoration:line-through; margin-right:5px; font-weight:400; }

.add-btn {
  position:absolute; bottom:11px; right:11px; z-index:1;
  background:transparent; color:var(--tx);
  border:1px solid var(--bdr);
  padding:7px 13px; border-radius:5px;
  font-size:0.59em; font-weight:600; letter-spacing:1.5px; text-transform:none;
  cursor:pointer; font-family:var(--fb); transition:all 0.3s var(--e1); overflow:hidden; -webkit-appearance:none;
}
.add-btn::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,0.2) 50%,transparent 70%); transform:translateX(-140%) skewX(-20deg); transition:transform 0s; z-index:-1; }
.add-btn:hover:not(:disabled) { background:var(--gdim); border-color:var(--g); color:var(--g2); transform:translateY(-2px); }
.add-btn:hover:not(:disabled)::after { transform:translateX(140%) skewX(-20deg); transition:transform 0.5s; }
.add-btn.added { background:var(--g) !important; color:#06080c !important; border-color:var(--g) !important; transform:scale(1.07) !important; }
.add-btn:disabled { color:rgba(255,255,255,0.1); border-color:rgba(255,255,255,0.04); cursor:not-allowed; }
.add-btn:focus-visible, .qb:focus-visible, .rm-btn:focus-visible, .lang-btn:focus-visible, .hlink:focus-visible, .pb-x:focus-visible, .sub-btn:focus-visible, .inp:focus-visible {
  outline:2px solid var(--g2); outline-offset:2px;
}

.overlay { position:fixed; inset:0; z-index:500;
  background:rgba(0,0,0,0.78);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  opacity:0; pointer-events:none;
  transition:opacity 0.4s;
}
.overlay.on { opacity:1; pointer-events:all; }

.confirm-modal {
  position:fixed; z-index:700;
  top:50%; left:50%; transform:translate(-50%,-50%) scale(0.94);
  width:min(400px,90vw);
  background:var(--bg2);
  border:1px solid var(--bdrg);
  border-radius:16px;
  padding:32px 28px 26px;
  box-shadow:0 24px 70px rgba(0,0,0,0.6);
  text-align:center;
  opacity:0; pointer-events:none;
  transition:opacity 0.32s var(--e1), transform 0.32s var(--e1);
}
.confirm-modal.open { opacity:1; pointer-events:all; transform:translate(-50%,-50%) scale(1); }
.cm-logo { font-family:var(--fd); font-weight:300; letter-spacing:0.2em; font-size:1.5em; color:var(--tx); margin-bottom:14px; }
.cm-msg { color:var(--tx2); font-size:0.9em; margin:0 0 6px; }
.cm-total { color:var(--g2); font-family:var(--fd); font-size:1.5em; font-weight:500; margin-bottom:24px; }
.cm-actions { display:flex; gap:10px; }
.cm-btn {
  flex:1; padding:12px 10px; border-radius:8px; font-size:0.85em; font-weight:600;
  letter-spacing:0.03em; cursor:pointer; border:1px solid transparent;
  transition:transform 0.15s, opacity 0.15s;
}
.cm-btn:active { transform:scale(0.97); }
.cm-cancel { background:transparent; border-color:var(--bdr); color:var(--tx2); }
.cm-cancel:hover { border-color:var(--tx2); color:var(--tx); }
.cm-confirm { background:var(--g); color:#06080c; }
.cm-confirm:hover { background:var(--g2); }
@media (prefers-reduced-motion: reduce) {
  .confirm-modal { transition:opacity 0.001ms; transform:translate(-50%,-50%) !important; }
}

.privacy-modal {
  position:fixed; z-index:700;
  top:50%; left:50%; transform:translate(-50%,-50%) scale(0.96);
  width:min(560px,90vw);
  max-height:82vh;
  overflow-y:auto;
  background:var(--bg2);
  border:1px solid var(--bdrg);
  border-radius:16px;
  padding:36px 32px 30px;
  box-shadow:0 24px 70px rgba(0,0,0,0.6);
  opacity:0; pointer-events:none;
  transition:opacity 0.32s var(--e1), transform 0.32s var(--e1);
}
.privacy-modal.open { opacity:1; pointer-events:all; transform:translate(-50%,-50%) scale(1); }
.pm-close {
  position:absolute; top:14px; right:16px;
  background:transparent; border:none; color:var(--tx2);
  font-size:1.6em; line-height:1; cursor:pointer; padding:4px 8px;
}
.pm-close:hover { color:var(--tx); }
.pm-logo { font-family:var(--fd); font-weight:300; letter-spacing:0.2em; font-size:1.3em; color:var(--g2); text-align:center; margin-bottom:4px; }
.pm-title { font-family:var(--fd); font-weight:400; font-size:1.4em; color:var(--tx); text-align:center; margin:0 0 20px; }
.pm-body p { color:var(--tx2); font-size:0.85em; line-height:1.7; margin:0 0 14px; }
.my-orders-hint { color:var(--mu); font-size:0.76em; line-height:1.5; margin:0 0 18px; text-align:center; }
.my-order-row {
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:12px 14px; border:1px solid var(--bdr); border-radius:8px; margin-bottom:8px;
}
.my-order-code { font-family:var(--fd); font-weight:600; color:var(--g2); font-size:0.95em; }
.my-order-meta { color:var(--tx2); font-size:0.75em; text-align:right; }
.my-orders-empty { color:var(--mu); font-size:0.85em; text-align:center; padding:10px 0; }
.pm-body strong { color:var(--tx); }
.footer-link {
  background:none; border:none; color:var(--g2); cursor:pointer;
  font-size:inherit; font-family:inherit; text-decoration:underline;
  padding:0;
}
.footer-link:hover { color:var(--g); }

.preorder-modal {
  position:fixed; z-index:700;
  top:50%; left:50%; transform:translate(-50%,-50%) scale(0.94);
  width:min(420px,90vw);
  max-height:86vh;
  overflow-y:auto;
  background:var(--bg2);
  border:1px solid var(--bdrg);
  border-radius:16px;
  padding:32px 28px 26px;
  box-shadow:0 24px 70px rgba(0,0,0,0.6);
  text-align:center;
  opacity:0; pointer-events:none;
  transition:opacity 0.32s var(--e1), transform 0.32s var(--e1);
}
.preorder-modal.open { opacity:1; pointer-events:all; transform:translate(-50%,-50%) scale(1); }
.pom-logo { font-family:var(--fd); font-weight:300; letter-spacing:0.2em; font-size:1.3em; color:var(--tx); margin-bottom:12px; }
.pom-title { font-family:var(--fd); font-weight:400; font-size:1.25em; color:var(--tx); margin:0 0 14px; }
.pom-warning { color:var(--tx2); font-size:0.85em; line-height:1.6; margin:0 0 18px; }
.pom-warning strong { color:var(--g2); }
.pom-sizes { display:flex; flex-direction:column; gap:8px; margin-bottom:18px; text-align:left; }
.pom-size-opt {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; border:1px solid var(--bdr); border-radius:8px;
  cursor:pointer; font-size:0.85em; color:var(--tx2);
  transition:border-color 0.2s, color 0.2s;
}
.pom-size-opt:has(input:checked) { border-color:var(--g); color:var(--tx); }
.pom-size-opt input { accent-color:var(--g); }
.pom-actions { display:flex; gap:10px; }
.pom-btn {
  flex:1; padding:12px 10px; border-radius:8px; font-size:0.85em; font-weight:600;
  letter-spacing:0.03em; cursor:pointer; border:1px solid transparent;
  transition:transform 0.15s, opacity 0.15s;
}
.pom-btn:active { transform:scale(0.97); }
.pom-cancel { background:transparent; border-color:var(--bdr); color:var(--tx2); }
.pom-cancel:hover { border-color:var(--tx2); color:var(--tx); }
.pom-confirm { background:var(--g); color:#06080c; }
.pom-confirm:hover { background:var(--g2); }
.pom-confirm:disabled { opacity:0.4; cursor:not-allowed; }
.ci-preorder-tag { display:inline-block; font-size:0.62em; font-weight:700; letter-spacing:0.06em; color:var(--g2); background:rgba(201,168,76,0.12); border:1px solid var(--bdrg); padding:1px 7px; border-radius:4px; margin-left:6px; vertical-align:middle; }

@media (prefers-reduced-motion: reduce) {
  .preorder-modal { transition:opacity 0.001ms; transform:translate(-50%,-50%) !important; }
}
@media (prefers-reduced-motion: reduce) {
  .privacy-modal { transition:opacity 0.001ms; transform:translate(-50%,-50%) !important; }
}

.panel {
    position:fixed; z-index:600;
    background:var(--bg2);
    display:flex; flex-direction:column;
    opacity:0;
    will-change:transform,opacity;
    transition:transform 0.48s var(--e1), opacity 0.32s ease;
    top:0; right:0;
    width:min(440px,94vw);
    height:100dvh;
    border-left:1px solid var(--bdrg);
    box-shadow:-14px 0 70px rgba(0,0,0,0.8);
    transform:translateX(110%);
  }
  .panel.open { transform:translateX(0); opacity:1; }
@media(max-width:600px) {
  .panel {
    bottom:0; left:0; width:100%;
    height:88dvh;
    border-top:1px solid var(--bdrg);
    border-radius:20px 20px 0 0;
    box-shadow:0 -14px 70px rgba(0,0,0,0.85);
    transform:translateY(110%);
  }
  .panel.open { transform:translateY(0); opacity:1; }
  .panel-bar::before { content:''; position:absolute; top:10px; left:50%; transform:translateX(-50%); width:38px; height:4px; border-radius:2px; background:rgba(255,255,255,0.13); }
}

.panel-bar {
  flex-shrink:0;
  padding:17px 18px;
  background:var(--bg3); border-bottom:1px solid var(--bdrg);
  display:flex; align-items:center; justify-content:space-between;
  position:relative;
}
.pb-x { background:none; border:none; font-size:1.75em; cursor:pointer; color:var(--mu); transition:color 0.2s,transform 0.25s; line-height:1; padding:0; }
.pb-x:hover { color:var(--tx); transform:rotate(90deg); }
.pb-brand { font-size:0.63em; color:var(--g); letter-spacing:3.5px; text-transform:uppercase; font-weight:700; }
.pb-title { font-family:var(--fd); font-size:1.4em; font-weight:400; color:var(--tx); }

.ptost { display:none; flex-shrink:0; background:linear-gradient(135deg,#0b1a0f,#0c0f18); border-bottom:2px solid rgba(46,204,142,0.7); color:#fff; font-size:0.85em; font-weight:600; padding:13px 20px; text-align:center; letter-spacing:0.4px; animation:tIn 0.35s var(--e1); }
.ptost.on { display:block; }

.panel-body {
  flex:1;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:18px;
  opacity:0;
  transform:translateY(8px);
  transition:opacity 0.35s ease, transform 0.35s ease;
}
.panel.open .panel-body {
  opacity:1;
  transform:none;
}
.ci-info { flex:1; min-width:0; font-size:0.84em; }
.ci-info strong { display:block; margin-bottom:5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ci-pr { color:var(--g); font-size:0.82em; font-weight:700; display:block; margin-top:3px; }
.qrow  { display:flex; align-items:center; gap:7px; margin:5px 0; }
.qb    { background:rgba(255,255,255,0.05); border:1px solid var(--bdr); color:var(--tx); width:28px; height:28px; border-radius:5px; cursor:pointer; font-size:1em; display:flex; align-items:center; justify-content:center; transition:all 0.22s; padding:0; flex-shrink:0; }
.qb:hover { background:var(--gdim); border-color:var(--g); }
.qb:disabled { opacity:0.3; cursor:not-allowed; }
.qn    { font-weight:700; min-width:20px; text-align:center; font-size:0.9em; }
.rm-btn{ background:transparent; color:var(--mu); border:none; padding:4px 6px; cursor:pointer; font-size:0.85em; border-radius:4px; transition:color 0.2s,transform 0.2s; flex-shrink:0; }
.rm-btn:hover { color:var(--red); transform:scale(1.2); }
.empty-c { color:var(--mu); text-align:center; padding:30px 0; font-size:0.85em; letter-spacing:0.5px; }

.fg { margin-bottom:13px; }
.fg label { display:block; margin-bottom:5px; font-size:0.69em; color:var(--tx2); font-weight:600; text-transform:uppercase; letter-spacing:2px; }
.inp { width:100%; padding:11px 13px; border:1px solid var(--bdr); background:var(--bg3); color:var(--tx); font-family:var(--fb); font-size:15px; border-radius:7px; outline:none; transition:border-color 0.3s,box-shadow 0.3s; -webkit-appearance:none; }
.inp:focus { border-color:var(--g); box-shadow:0 0 0 3px rgba(201,168,76,0.1); }
.inp.err { border-color:var(--red) !important; }
select.inp option { background:var(--bg3); }

.receipt { background:var(--surf); border:1px solid var(--bdrg); border-radius:11px; padding:15px 17px; margin-bottom:20px; }
.rr { display:flex; justify-content:space-between; font-size:0.84em; margin-bottom:8px; color:var(--tx2); }
.rr.rt { margin-top:13px; padding-top:13px; border-top:1px solid var(--bdrg); color:var(--tx); font-weight:700; font-size:1.05em; margin-bottom:0; }
.fship { color:var(--grn) !important; font-weight:700; }
.fship-pending { color:var(--mu) !important; font-weight:600; font-style:italic; }

.cod-notice {
  display:flex; align-items:center; gap:8px; padding:10px 14px; margin-bottom:12px;
  background:rgba(201,168,76,0.08); border:1px solid var(--bdrg); border-radius:8px;
  color:var(--tx2); font-size:0.78em; line-height:1.4;
}

.sub-btn {
  background:var(--g); color:#06080c; border:none; padding:15px;
  cursor:pointer; font-weight:700; width:100%; font-size:0.82em; letter-spacing:2.5px;
  border-radius:6px; text-transform:uppercase;
  box-shadow:0 4px 28px rgba(201,168,76,0.3);
  transition:all 0.3s var(--e1);
  display:flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--fb); position:relative; overflow:hidden; -webkit-appearance:none;
}
.sub-btn::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,0.28) 50%,transparent 70%); transform:translateX(-130%) skewX(-15deg); transition:transform 0s; }
.sub-btn:hover:not(:disabled)::after { transform:translateX(140%) skewX(-15deg); transition:transform 0.55s; }
.sub-btn:hover:not(:disabled) { background:var(--g2); box-shadow:0 10px 48px rgba(201,168,76,0.55); transform:translateY(-2px); }
.sub-btn:active { transform:scale(0.97); }
.sub-btn:disabled { background:#1a1a1a; color:#333; cursor:not-allowed; box-shadow:none; }

.succ-ov { position:fixed; inset:0; z-index:900; background:rgba(6,8,12,0.96); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); display:none; align-items:center; justify-content:center; padding:24px; }
.succ-ov.on { display:flex; animation:fadeIn 0.5s var(--e1); }
.succ-card { background:var(--bg2); border:1px solid rgba(46,204,142,0.22); border-radius:22px; padding:48px 34px; max-width:420px; width:100%; text-align:center; box-shadow:0 30px 100px rgba(0,0,0,0.9); animation:cardIn 0.6s 0.1s var(--e1) both; }
.s-ico   { font-size:4.5em; margin-bottom:22px; animation:icoIn 0.7s 0.3s var(--e2) both; opacity:0; }
.order-code-box {
  display:flex; flex-direction:column; align-items:center; gap:4px;
  background:rgba(201,168,76,0.08); border:1px solid var(--bdrg); border-radius:10px;
  padding:12px 18px; margin:16px 0;
}
.order-code-label { font-size:0.68em; letter-spacing:0.08em; text-transform:uppercase; color:var(--tx2); }
.order-code-value { font-family:var(--fd); font-size:1.4em; font-weight:600; color:var(--g2); letter-spacing:0.05em; }

.s-badge { background:rgba(46,204,142,0.05); border:1px solid rgba(46,204,142,0.18); border-radius:10px; padding:14px 18px; margin:16px 0 26px; }
.s-close { background:var(--g); color:#06080c; border:none; padding:14px; border-radius:6px; font-weight:700; cursor:pointer; font-size:0.82em; letter-spacing:2px; text-transform:uppercase; width:100%; transition:background 0.2s,transform 0.2s; font-family:var(--fb); -webkit-appearance:none; }
.s-close:hover { background:var(--g2); transform:translateY(-1px); }

@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes cardIn { from{opacity:0;transform:translateY(28px) scale(0.93)} to{opacity:1;transform:none} }
@keyframes icoIn  { from{opacity:0;transform:scale(0.4) rotate(-18deg)} to{opacity:1;transform:none} }

#toasts { position:fixed; top:46px; left:50%; transform:translateX(-50%); z-index:9999; display:flex; flex-direction:column; gap:8px; pointer-events:none; align-items:center; width:92vw; max-width:440px; }
.toast { background:var(--bg3); color:var(--tx); padding:12px 22px; border-radius:9px; font-size:0.83em; font-weight:600; letter-spacing:0.3px; box-shadow:0 12px 55px rgba(0,0,0,0.9); border:1px solid var(--bdr); text-align:center; animation:tIn 0.4s var(--e1); white-space:nowrap; }
.toast.s { border-color:rgba(46,204,142,0.45); }
.toast.e { border-color:rgba(224,92,92,0.45); }
.toast.out { animation:tOut 0.3s var(--e1) forwards; }
.page-footer {
  margin: 32px auto 0;
  text-align: center;
  color: var(--tx2);
  font-size: 0.78em;
  letter-spacing: 0.08em;
  max-width: 100%;
  padding: 14px 0 20px;
}
.lang-switch {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
  margin-bottom:24px;
}
.lang-label {
  color:var(--tx2);
  font-size:0.7em;
  letter-spacing:1.6px;
  text-transform:uppercase;
  align-self:center;
}
.lang-btn {
  background:transparent;
  border:1px solid var(--bdr);
  color:var(--tx);
  padding:8px 12px;
  border-radius:999px;
  cursor:pointer;
  font-size:0.76em;
  transition:all 0.25s var(--e1);
}
.lang-btn.active,
.lang-btn:hover {
  border-color:var(--g);
  color:var(--g);
}
.region-toggle { display:flex; gap:10px; }
.region-btn {
  flex:1; padding:12px 10px; border-radius:8px; font-size:0.85em; font-weight:600;
  background:transparent; border:1px solid var(--bdr); color:var(--tx2);
  cursor:pointer; transition:all 0.2s var(--e1);
}
.region-btn:hover { border-color:var(--tx2); color:var(--tx); }
.region-btn.active { border-color:var(--g); color:var(--g2); background:rgba(201,168,76,0.08); }
@keyframes tIn  { from{opacity:0;transform:translateY(-14px) scale(0.88)} to{opacity:1;transform:none} }
@keyframes tOut { from{opacity:1;transform:none} to{opacity:0;transform:translateY(-10px) scale(0.9)} }

.spin { width:14px; height:14px; border:2px solid rgba(0,0,0,0.2); border-top-color:#06080c; border-radius:50%; animation:rot 0.7s linear infinite; flex-shrink:0; }
@keyframes rot { to{transform:rotate(360deg)} }

.skip-link {
  position:fixed; top:-60px; left:10px; z-index:99999;
  background:var(--g); color:#06080c; padding:10px 16px; border-radius:6px;
  font-size:0.8em; font-weight:700; text-decoration:none; transition:top 0.2s;
}
.skip-link:focus { top:10px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }
  #intro { display:none !important; }
  .brand, .slogan, .sub, .hlinks, .cart-btn, .lang-switch { opacity:1 !important; transform:none !important; filter:none !important; }
}

.succ-heading { color:var(--grn); margin:0 0 8px; font-size:1.5em; font-family:var(--fd); font-weight:400; }
.succ-desc { color:var(--tx2); font-size:0.87em; line-height:1.7; }
.succ-badge-main { color:var(--grn); font-size:0.84em; font-weight:700; }
.succ-badge-sub { color:var(--mu); font-size:0.76em; margin-top:5px; }
.cform-shell { display:flex; flex-direction:column; flex:1; min-height:0; overflow:hidden; }
.honeypot-field { position:absolute; left:-9999px; top:-9999px; }
.pb-spacer { width:28px; }
.fg-tight { margin-bottom:22px; }
.hint-inline { color:var(--mu); font-weight:400; letter-spacing:0; text-transform:none; font-size:1.1em; }
.optional-inline { font-weight:400; text-transform:none; color:var(--mu); font-size:0.9em; }
.panel-bottom-spacer { height:20px; }

/* admin entry */
.adm-head { position:absolute; top:10px; right:12px; width:32px; height:32px; padding:4px; background:transparent; border:none; cursor:pointer; z-index:5; opacity:0.7; transition:opacity 0.2s; }
.adm-head:hover { opacity:1; }
.adm-head svg { width:100%; height:100%; fill:#fff; }
.adm-head.on { opacity:1; }
.adm-head.on svg { fill:#e5484d; }
.adm-err { color:#ff6b6b; font-size:0.85em; min-height:1.2em; margin:0 0 10px; text-align:center; }