/* ═══════════════════════════════════════════════════════════════
   ORLOV — LUXURY GOLD & DIAMOND COMMUNITY — KURDISTAN
   Design System: Ultra-luxury dark gold, obsidian black, ice-diamond
═══════════════════════════════════════════════════════════════ */
:root {
  --g1: #C9A84C;
  --g2: #E8C96A;
  --g3: #A07828;
  --g4: #F2DC8E;
  --g5: #FFE9A0;
  --d1: #DCF0FF;
  --d2: #A8D4EF;
  --d3: #6BAED6;
  --ink: #060504;
  --ink2: #0E0B07;
  --ink3: #18140C;
  --ink4: #221C10;
  --ink5: #2C2416;
  --text: #F0E6CC;
  --text2: #C8B88A;
  --muted: #6A5E48;
  --accent: #C0392B;
  --green: #27AE60;
  --red: #E74C3C;
  --r: 14px;
  --r2: 20px;
  --gold-grad: linear-gradient(135deg, #8B6200, #C9A84C, #F2DC8E, #E8C96A, #C9A84C, #8B6200);
  --gold-grad2: linear-gradient(90deg, #8B6200, #C9A84C, #F2DC8E, #C9A84C, #8B6200);
  --diamond-grad: linear-gradient(135deg, #6BAED6, #A8D4EF, #DCF0FF, #A8D4EF, #6BAED6);
  --shimmer: linear-gradient(90deg, transparent 0%, rgba(242,220,142,0.2) 50%, transparent 100%);
  --glow: 0 0 30px rgba(201,168,76,0.25), 0 0 60px rgba(201,168,76,0.1);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'DM Sans',sans-serif;
  background:var(--ink);
  color:var(--text);
  min-height:100vh;
  overflow-x:hidden;
}

/* ── CUSTOM CURSOR ── */
*{cursor:none!important;}
#cur{
  width:16px;height:16px;
  border:1.5px solid var(--g1);
  border-radius:50%;
  position:fixed;top:0;left:0;
  pointer-events:none;z-index:99999;
  transform:translate(-50%,-50%);
  transition:width .15s,height .15s,background .15s;
}
#cur.big{width:38px;height:38px;background:rgba(201,168,76,.08);border-color:var(--g2);}
#cur2{
  width:5px;height:5px;
  background:var(--g2);
  border-radius:50%;
  position:fixed;top:0;left:0;
  pointer-events:none;z-index:99998;
  transform:translate(-50%,-50%);
  transition:left .06s,top .06s;
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-track{background:var(--ink2);}
::-webkit-scrollbar-thumb{background:var(--g3);border-radius:2px;}

/* ── AMBIENT BG ── */
.ambient{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 70% 50% at 15% 20%,rgba(201,168,76,.05) 0%,transparent 60%),
    radial-gradient(ellipse 50% 70% at 85% 80%,rgba(107,174,214,.03) 0%,transparent 60%),
    radial-gradient(ellipse 40% 40% at 50% 50%,rgba(201,168,76,.025) 0%,transparent 70%);
}

/* ═══════════════════════════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════════════════════════ */
.topnav{
  position:fixed;top:0;inset-inline:0;z-index:500;
  height:68px;
  background:rgba(6,5,4,.97);
  backdrop-filter:blur(40px);
  border-bottom:1px solid rgba(201,168,76,.18);
  display:flex;align-items:center;
  padding:0 28px;gap:18px;
}
.topnav::after{
  content:'';
  position:absolute;bottom:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 4s linear infinite;
  opacity:.5;
}
@keyframes shimLine{0%{background-position:-300% 0}100%{background-position:300% 0}}

/* ── V LOGO ── */
.logo{
  display:flex;align-items:center;gap:12px;
  margin-right:auto;text-decoration:none;
  flex-shrink:0;
}
.v-mark{
  width:46px;height:46px;
  position:relative;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.v-mark svg{
  width:46px;height:46px;
  filter:drop-shadow(0 0 12px rgba(201,168,76,.6)) drop-shadow(0 0 24px rgba(201,168,76,.3));
}
.eagle-logo{
  width:46px;height:46px;
  border-radius:10px;
  object-fit:cover;
  filter:drop-shadow(0 0 10px rgba(201,168,76,.55)) drop-shadow(0 0 22px rgba(201,168,76,.25));
  transition:filter .3s;
  flex-shrink:0;
}
.eagle-logo:hover{filter:drop-shadow(0 0 14px rgba(242,220,142,.8)) drop-shadow(0 0 30px rgba(201,168,76,.4));}
.hero-eagle{
  width:80px;height:80px;
  border-radius:16px;
  object-fit:cover;
  filter:drop-shadow(0 0 18px rgba(201,168,76,.7)) drop-shadow(0 0 40px rgba(201,168,76,.3));
  animation:heroGlow 3s ease-in-out infinite;
}
.logo-text{
  display:flex;flex-direction:column;
  line-height:1;
}
.logo-name{
  font-family:'Cinzel Decorative',serif;
  font-size:1.35rem;font-weight:700;
  letter-spacing:.14em;
  background:var(--gold-grad);background-size:300% 100%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  animation:shimText 5s linear infinite;
}
.logo-sub{
  font-family:'Cinzel',serif;
  font-size:.48rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);margin-top:2px;
}
@keyframes shimText{0%{background-position:0% 50%}100%{background-position:300% 50%}}

.nav-links{display:flex;gap:2px;}
.nav-link{
  padding:8px 16px;border:none;background:none;
  color:var(--muted);font-family:'DM Sans';font-size:.83rem;font-weight:500;
  border-radius:10px;transition:all .25s;letter-spacing:.03em;
  display:flex;align-items:center;gap:7px;
}
.nav-link:hover{color:var(--g2);}
.nav-link.active{color:var(--g2);background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.2);}
.nav-link i{font-size:.78rem;}

.nav-right{display:flex;gap:9px;align-items:center;}
.live-gold{
  display:flex;align-items:center;gap:8px;
  padding:7px 14px;border-radius:10px;
  background:rgba(201,168,76,.08);border:1px solid rgba(201,168,76,.2);
  font-size:.78rem;color:var(--g2);font-family:'Cinzel',serif;letter-spacing:.04em;
  cursor:pointer;transition:all .2s;
}
.live-gold:hover{background:rgba(201,168,76,.14);}
.live-dot{
  width:6px;height:6px;border-radius:50%;background:#27AE60;
  animation:livePulse 1.5s ease-in-out infinite;
}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 0 rgba(39,174,96,.5)}50%{box-shadow:0 0 0 5px rgba(39,174,96,0)}}

.notif-btn{
  width:40px;height:40px;border-radius:10px;
  background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.15);
  color:var(--g1);font-size:.95rem;display:flex;align-items:center;justify-content:center;
  position:relative;transition:all .2s;
}
.notif-btn:hover{background:rgba(201,168,76,.14);}
.notif-dot{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--accent);border:2px solid var(--ink);}

.btn-list{
  display:flex;align-items:center;gap:8px;
  padding:9px 20px;
  background:var(--gold-grad);background-size:300% 100%;
  color:var(--ink);font-weight:700;font-size:.8rem;
  border:none;border-radius:11px;
  letter-spacing:.07em;text-transform:uppercase;
  animation:shimText 4s linear infinite;
  transition:all .3s;font-family:'DM Sans';white-space:nowrap;
}
.btn-list:hover{transform:translateY(-2px);box-shadow:0 6px 28px rgba(201,168,76,.45);}

/* ═══════════════════════════════════════════════════════════════
   LANGUAGE SWITCHER
═══════════════════════════════════════════════════════════════ */
.lang-switcher{position:relative;display:inline-block;}
.lang-toggle{
  display:flex;align-items:center;gap:7px;
  width:40px;height:40px;padding:0;border-radius:10px;
  background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.15);
  color:var(--g1);cursor:pointer;transition:all .2s;
  font-family:'DM Sans';font-size:.8rem;
}
.lang-toggle:hover{background:rgba(201,168,76,.14);}
.lang-toggle .flag{width:20px;height:14px;border-radius:2px;overflow:hidden;display:inline-flex;flex-shrink:0;margin-left:10px;}
.lang-toggle .flag svg{width:100%;height:100%;display:block;}
.lang-toggle .chevron{
  width:8px;height:8px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);
  transform:rotate(45deg);transition:transform .2s ease;margin-right:8px;
}
.lang-switcher.open .lang-toggle .chevron{transform:rotate(-135deg);margin-top:3px;}

.lang-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:190px;
  background:var(--ink3);border:1px solid rgba(201,168,76,.18);border-radius:12px;
  padding:6px;box-shadow:0 12px 32px rgba(0,0,0,.55);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .15s ease,transform .15s ease,visibility .15s;z-index:600;
}
.lang-menu.flip-left{right:auto;left:0;}
.lang-switcher.open .lang-menu{opacity:1;visibility:visible;transform:translateY(0);}
.lang-option{
  display:flex;align-items:center;gap:10px;width:100%;
  background:none;border:none;text-align:left;cursor:pointer;
  padding:10px 12px;border-radius:8px;
  color:var(--text2);font-family:'DM Sans';font-size:.83rem;
}
.lang-option:hover,.lang-option:focus-visible{background:rgba(201,168,76,.1);outline:none;color:var(--text);}
.lang-option.active{color:var(--g2);font-weight:600;}
.lang-option .flag{width:20px;height:14px;border-radius:2px;overflow:hidden;display:inline-flex;flex-shrink:0;}
.lang-option .flag svg{width:100%;height:100%;display:block;}
@media(max-width:860px){
  .lang-toggle .flag{margin-left:0;}
  .lang-toggle .chevron{display:none;}
  .lang-menu{min-width:170px;}
}

/* ═══════════════════════════════════════════════════════════════
   RTL SUPPORT (Arabic / Kurdish)
   Scoped to body.lang-rtl (a class toggled in JS) rather than the
   html[dir] attribute — the native dir attribute is intentionally
   never set, since it makes the browser inherit rtl direction for
   the WHOLE page on its own, bypassing any CSS override. Using a
   plain class here means nothing inherits rtl direction unless it's
   specifically listed below. Any area not listed (owner dashboard,
   modals, popups, anything not explicitly touched by translation
   work) is structurally guaranteed to render exactly as it always
   did, in any language.
═══════════════════════════════════════════════════════════════ */
body.lang-rtl .tagline,
body.lang-rtl .nlabel,
body.lang-rtl .slabel,
body.lang-rtl .st,
body.lang-rtl .ninput,
body.lang-rtl .cinput,
body.lang-rtl .pinput,
body.lang-rtl #shop-search,
body.lang-rtl #city-filter,
body.lang-rtl .csel,
body.lang-rtl .chat-inp,
body.lang-rtl .ci2inp,
body.lang-rtl .lang-option,
body.lang-rtl .cname,
body.lang-rtl .chip,
body.lang-rtl .ptext,
body.lang-rtl .pmeta,
body.lang-rtl .pbadge,
body.lang-rtl .pimgph-label,
body.lang-rtl .ctext,
body.lang-rtl .cname2{
  direction:rtl;text-align:right;
}
/* Buttons that mix an icon + translated label stay LTR internally so the
   icon doesn't jump to the wrong side of the text. */
body.lang-rtl .gbtn,
body.lang-rtl .lang-toggle,
body.lang-rtl .nav-link,
body.lang-rtl .cbtn,
body.lang-rtl .pbtn,
body.lang-rtl .abtn,
body.lang-rtl .chat-tab2{direction:ltr;}

/* ═══════════════════════════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════════════════════════ */
.layout{
  display:grid;
  grid-template-columns:256px 1fr 296px;
  padding-top:68px;
  min-height:100vh;
  position:relative;z-index:1;
}

/* ═══════════════════════════════════════════════════════════════
   LEFT SIDEBAR
═══════════════════════════════════════════════════════════════ */
.sl{
  position:sticky;top:68px;height:calc(100vh - 68px);
  overflow-y:auto;padding:20px 12px;
  border-right:1px solid rgba(201,168,76,.1);
  background:rgba(9,7,4,.9);
}
.slabel{
  font-family:'Cinzel',serif;
  font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--g3);margin-bottom:9px;padding:0 5px;
}
.ssec{margin-bottom:24px;}

/* Gender */
.gwrap{
  background:var(--ink3);border-radius:13px;padding:5px;
  border:1px solid rgba(201,168,76,.1);margin-bottom:16px;
  display:flex;gap:3px;
}
.gbtn{
  flex:1;padding:9px 5px;border:none;background:none;
  color:var(--muted);font-family:'DM Sans';font-size:.78rem;font-weight:500;
  border-radius:9px;transition:all .25s;display:flex;flex-direction:column;
  align-items:center;gap:3px;
}
.gbtn.active{background:linear-gradient(135deg,rgba(201,168,76,.22),rgba(242,220,142,.1));border:1px solid rgba(201,168,76,.35);color:var(--g2);}
.gbtn[data-g="Women"].active{background:linear-gradient(135deg,rgba(220,140,180,.18),rgba(200,100,140,.08));border-color:rgba(210,120,160,.35);color:#E8B0CC;}
.gbtn[data-g="Kids"].active{background:linear-gradient(135deg,rgba(107,174,214,.18),rgba(80,140,200,.08));border-color:rgba(107,174,214,.35);color:var(--d2);}

/* Category items */
.citem{
  display:flex;align-items:center;gap:11px;
  padding:9px 10px;border-radius:11px;
  transition:all .22s;margin-bottom:2px;
  border:1px solid transparent;
  position:relative;overflow:hidden;
}
.citem::before{
  content:'';position:absolute;inset:0;
  background:var(--shimmer);background-size:200% 100%;
  opacity:0;transition:opacity .3s;
}
.citem:hover::before{opacity:1;animation:shimSlide 1.5s linear infinite;}
@keyframes shimSlide{0%{background-position:-200% 0}100%{background-position:200% 0}}
.citem:hover{background:rgba(201,168,76,.06);border-color:rgba(201,168,76,.12);}
.citem.active{background:linear-gradient(135deg,rgba(201,168,76,.14),rgba(242,220,142,.06));border-color:rgba(201,168,76,.3);}
.cico{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.cname{font-size:.84rem;font-weight:500;}
.citem.active .cname{color:var(--g2);}
.ci0{background:rgba(255,255,255,.05);}
.ci1{background:linear-gradient(135deg,rgba(201,168,76,.25),rgba(160,120,40,.15));}
.ci2{background:linear-gradient(135deg,rgba(107,174,214,.25),rgba(80,140,200,.15));}
.ci3{background:linear-gradient(135deg,rgba(201,168,76,.2),rgba(220,190,100,.1));}
.ci4{background:linear-gradient(135deg,rgba(200,80,80,.2),rgba(170,50,50,.1));}
.ci5{background:linear-gradient(135deg,rgba(140,90,200,.2),rgba(110,70,180,.1));}
.ci6{background:linear-gradient(135deg,rgba(70,170,110,.2),rgba(50,150,90,.1));}
.ci7{background:linear-gradient(135deg,rgba(201,168,76,.15),rgba(107,174,214,.15));}

/* ── GOLD PRICE MINI WIDGET ── */
.gold-widget{
  background:linear-gradient(135deg,var(--ink3),var(--ink4));
  border:1px solid rgba(201,168,76,.2);
  border-radius:13px;padding:14px;margin-bottom:22px;
  position:relative;overflow:hidden;
}
.gold-widget::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 4s linear infinite;
}
.gw-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.gw-label{font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--g3);}
.gw-live{display:flex;align-items:center;gap:5px;font-size:.62rem;color:#27AE60;}
.gw-price{font-family:'Cinzel',serif;font-size:1.4rem;font-weight:700;color:var(--g2);line-height:1;}
.gw-change{font-size:.72rem;display:flex;align-items:center;gap:4px;margin-top:3px;}
.gw-up{color:#27AE60;} .gw-down{color:#E74C3C;}
.gw-sub{font-size:.65rem;color:var(--muted);margin-top:4px;}
.gw-chart-wrap{margin-top:10px;height:64px;}

/* ═══════════════════════════════════════════════════════════════
   FEED
═══════════════════════════════════════════════════════════════ */
.feed{padding:22px 24px;max-width:660px;width:100%;margin:0 auto;}

/* Hero */
.hero{
  position:relative;border-radius:20px;overflow:hidden;
  margin-bottom:20px;padding:0;
  background:var(--ink2);
  border:1px solid rgba(201,168,76,.22);
}
.hero-inner{
  padding:28px 28px;
  background:
    radial-gradient(ellipse 100% 100% at -10% 50%,rgba(201,168,76,.09) 0%,transparent 70%),
    radial-gradient(ellipse 60% 80% at 110% 30%,rgba(107,174,214,.05) 0%,transparent 70%);
  display:flex;align-items:center;gap:22px;
}
.hero-v{
  flex-shrink:0;
  width:80px;height:80px;
  display:flex;align-items:center;justify-content:center;
}
.hero-v svg{
  width:80px;height:80px;
  filter:drop-shadow(0 0 16px rgba(201,168,76,.7)) drop-shadow(0 0 40px rgba(201,168,76,.3));
  animation:heroGlow 3s ease-in-out infinite;
}
@keyframes heroGlow{0%,100%{filter:drop-shadow(0 0 16px rgba(201,168,76,.7)) drop-shadow(0 0 40px rgba(201,168,76,.3))}50%{filter:drop-shadow(0 0 22px rgba(242,220,142,.9)) drop-shadow(0 0 50px rgba(201,168,76,.4))}}
.hero-words h1{
  font-family:'Cinzel Decorative',serif;
  font-size:1.55rem;font-weight:900;letter-spacing:.09em;
  background:var(--gold-grad);background-size:300% 100%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;animation:shimText 5s linear infinite;
  margin-bottom:5px;
}
.hero-words .tagline{
  font-family:'Cormorant Garamond',serif;font-size:.95rem;font-style:italic;
  color:var(--text2);line-height:1.65;
}
.hero-deco{
  position:absolute;top:0;right:0;width:180px;height:100%;
  overflow:hidden;opacity:.1;pointer-events:none;
}
.hdeco{position:absolute;font-size:1.8rem;animation:fdeco 7s ease-in-out infinite;}
.hdeco:nth-child(1){top:15%;right:22%;animation-delay:0s;}
.hdeco:nth-child(2){top:55%;right:42%;animation-delay:1.5s;}
.hdeco:nth-child(3){top:35%;right:8%;animation-delay:3s;}
@keyframes fdeco{0%,100%{transform:translateY(0) rotate(0deg);opacity:.1}50%{transform:translateY(-12px) rotate(18deg);opacity:.25}}

/* Gold ticker bar */
.ticker{
  background:linear-gradient(135deg,rgba(201,168,76,.07),rgba(201,168,76,.03));
  border-top:1px solid rgba(201,168,76,.12);
  padding:10px 18px;
  display:flex;align-items:center;gap:16px;overflow:hidden;
}
.ticker-label{
  font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--g3);white-space:nowrap;flex-shrink:0;
}
.ticker-items{
  display:flex;gap:20px;overflow:hidden;flex:1;
}
.titem{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:.75rem;}
.tcur{color:var(--text2);font-family:'Cinzel',serif;font-size:.65rem;}
.tprice{color:var(--g2);font-weight:600;}
.tchange{font-size:.68rem;}
.tup{color:#27AE60;} .tdown{color:#E74C3C;}

/* Composer */
.composer{
  background:linear-gradient(135deg,var(--ink2),var(--ink3));
  border:1px solid rgba(201,168,76,.14);
  border-radius:18px;padding:18px;margin-bottom:18px;
  position:relative;overflow:hidden;
}
.composer::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 4s linear infinite;
}
.nrow{display:flex;align-items:center;gap:10px;margin-bottom:13px;}
.nlabel{font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--g3);white-space:nowrap;}
.ninput{
  flex:1;background:var(--ink4);border:1px solid rgba(201,168,76,.14);
  border-radius:9px;padding:8px 12px;color:var(--text);
  font-size:.86rem;outline:none;transition:border-color .2s;font-family:'DM Sans';
}
.ninput:focus{border-color:rgba(201,168,76,.45);box-shadow:0 0 0 3px rgba(201,168,76,.05);}
.ctop{display:flex;gap:12px;margin-bottom:12px;}
.av{
  width:40px;height:40px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.85rem;color:var(--ink);
  font-family:'Cinzel',serif;border:2px solid rgba(201,168,76,.28);
}
.cinput{
  flex:1;background:var(--ink4);border:1px solid rgba(201,168,76,.12);
  border-radius:13px;padding:11px 15px;
  color:var(--text);font-size:.88rem;resize:none;
  min-height:66px;outline:none;transition:border-color .2s;
  font-family:'DM Sans';
}
.cinput:focus{border-color:rgba(201,168,76,.38);}
.cinput::placeholder{color:var(--muted);}
.cacts{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.cbtn{
  display:flex;align-items:center;gap:5px;
  padding:7px 12px;border-radius:9px;
  background:var(--ink4);border:1px solid rgba(201,168,76,.1);
  color:var(--muted);font-size:.78rem;transition:all .2s;font-family:'DM Sans';
}
.cbtn:hover{color:var(--g2);border-color:rgba(201,168,76,.28);}
.csel{
  padding:7px 10px;border-radius:9px;
  background:var(--ink4);border:1px solid rgba(201,168,76,.1);
  color:var(--muted);font-size:.78rem;outline:none;font-family:'DM Sans';
}
.csel option{background:var(--ink3);}
.pinput{
  flex:1;background:var(--ink4);border:1px solid rgba(201,168,76,.1);
  border-radius:9px;padding:7px 10px;color:var(--g2);
  font-size:.78rem;outline:none;width:100px;font-family:'DM Sans';
}
.pinput::placeholder{color:var(--muted);}
.pbtn{
  margin-left:auto;padding:8px 22px;
  background:var(--gold-grad);background-size:300% 100%;
  color:var(--ink);font-weight:700;font-size:.8rem;
  border:none;border-radius:10px;letter-spacing:.07em;
  text-transform:uppercase;animation:shimText 4s linear infinite;
  transition:all .2s;font-family:'DM Sans';
}
.pbtn:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(201,168,76,.4);}
.pbtn:disabled{opacity:.5;}
.irow{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px;}
.iprev{width:60px;height:60px;border-radius:8px;object-fit:cover;border:1px solid rgba(201,168,76,.22);}

/* Filter chips */
.chips{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap;}
.chip{
  padding:6px 13px;border-radius:20px;
  background:var(--ink3);border:1px solid rgba(201,168,76,.1);
  color:var(--muted);font-size:.75rem;transition:all .2s;font-family:'DM Sans';
}
.chip:hover{color:var(--g2);border-color:rgba(201,168,76,.28);}
.chip.active{background:rgba(201,168,76,.12);border-color:var(--g1);color:var(--g2);}

/* ═══════════════════════════════════════════════════════════════
   POST CARD
═══════════════════════════════════════════════════════════════ */
.pcard{
  background:linear-gradient(160deg,var(--ink2),var(--ink3));
  border:1px solid rgba(201,168,76,.1);
  border-radius:18px;margin-bottom:16px;overflow:hidden;
  transition:all .3s;
  animation:fadeUp .4s ease both;
  position:relative;
}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.pcard::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  opacity:0;transition:opacity .3s;animation:shimLine 4s linear infinite;
}
.pcard:hover{border-color:rgba(201,168,76,.28);box-shadow:0 10px 40px rgba(201,168,76,.07);}
.pcard:hover::before{opacity:1;}

.phead{display:flex;align-items:center;gap:11px;padding:15px 17px 11px;}
.puname{font-weight:600;font-size:.9rem;color:var(--text);}
.pmeta{font-size:.71rem;color:var(--muted);display:flex;gap:6px;align-items:center;margin-top:2px;}
.pbadge{padding:2px 8px;border-radius:10px;font-size:.64rem;font-weight:700;letter-spacing:.04em;}
.bg{background:rgba(201,168,76,.18);color:var(--g2);}
.bd{background:rgba(107,174,214,.18);color:var(--d2);}
.br{background:rgba(201,168,76,.14);color:var(--g1);}
.bw{background:rgba(200,80,110,.18);color:#EAA0C0;}
.bn{background:rgba(140,90,200,.18);color:#C0A0E8;}
.bch{background:rgba(70,170,110,.18);color:#90D0AA;}

.pimgph{
  width:100%;height:240px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:9px;position:relative;overflow:hidden;
}
.pimgph::after{
  content:'';position:absolute;inset:0;
  background:var(--shimmer);background-size:200% 100%;
  animation:shimSlide 4s linear infinite;
}
.pimgph-icon{font-size:3.5rem;filter:drop-shadow(0 0 18px rgba(201,168,76,.5));}
.pimgph-label{font-family:'Cinzel',serif;font-size:.75rem;letter-spacing:.1em;color:var(--g3);}
.pimg{width:100%;height:260px;object-fit:cover;display:block;}

.pbody{padding:13px 17px;}
.ptext{font-size:.88rem;line-height:1.7;color:var(--text);margin-bottom:7px;}
.ptags{display:flex;gap:5px;flex-wrap:wrap;}
.ptag{font-size:.72rem;color:var(--g3);cursor:pointer;}
.ptag:hover{color:var(--g2);text-decoration:underline;}
.pprice{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;border-radius:18px;
  background:rgba(201,168,76,.12);border:1px solid rgba(201,168,76,.24);
  color:var(--g2);font-weight:700;font-size:.8rem;margin-bottom:9px;
  font-family:'Cinzel',serif;
}

.pacts{
  display:flex;align-items:center;gap:3px;
  padding:8px 17px 13px;
  border-top:1px solid rgba(201,168,76,.07);
}
.abtn{
  display:flex;align-items:center;gap:5px;
  padding:7px 12px;border-radius:9px;
  background:none;border:none;color:var(--muted);
  font-size:.8rem;transition:all .2s;font-family:'DM Sans';
}
.abtn:hover{color:var(--text);background:rgba(201,168,76,.06);}
.abtn.liked{color:var(--accent);}
.achat{
  display:flex;align-items:center;gap:5px;
  padding:7px 13px;border-radius:9px;
  background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.18);
  color:var(--g2);font-size:.78rem;font-weight:500;transition:all .2s;font-family:'DM Sans';
}
.achat:hover{background:rgba(201,168,76,.14);}
.ashare{margin-left:auto;}

/* Comments */
.csec{display:none;padding:0 17px 13px;}
.csec.open{display:block;border-top:1px solid rgba(201,168,76,.07);padding-top:13px;}
.com{display:flex;gap:9px;margin-bottom:9px;}
.cav2{
  width:28px;height:28px;border-radius:50%;flex-shrink:0;
  background:var(--gold-grad);background-size:300% 100%;
  display:flex;align-items:center;justify-content:center;
  font-size:.62rem;font-weight:700;color:var(--ink);
  animation:shimText 5s linear infinite;
}
.cbub{background:var(--ink4);border-radius:10px 10px 10px 2px;padding:8px 12px;flex:1;border:1px solid rgba(201,168,76,.07);}
.cname2{font-size:.7rem;font-weight:600;color:var(--g3);margin-bottom:2px;font-family:'Cinzel',serif;letter-spacing:.04em;}
.ctext{font-size:.82rem;color:var(--text);}
.cirow{display:flex;gap:7px;align-items:center;margin-top:9px;}
.ci2inp{
  flex:1;background:var(--ink4);border:1px solid rgba(201,168,76,.1);
  border-radius:18px;padding:8px 13px;
  color:var(--text);font-size:.8rem;outline:none;transition:border-color .2s;font-family:'DM Sans';
}
.ci2inp:focus{border-color:rgba(201,168,76,.38);}
.csend{
  width:32px;height:32px;border-radius:50%;
  background:var(--gold-grad);background-size:300% 100%;
  border:none;display:flex;align-items:center;justify-content:center;
  color:var(--ink);font-size:.8rem;transition:all .2s;
  animation:shimText 4s linear infinite;
}
.csend:hover{transform:scale(1.1);box-shadow:0 4px 14px rgba(201,168,76,.3);}

/* ═══════════════════════════════════════════════════════════════
   LIVE GOLD CHART (full panel section)
═══════════════════════════════════════════════════════════════ */
.chart-section{
  background:linear-gradient(160deg,var(--ink2),var(--ink3));
  border:1px solid rgba(201,168,76,.18);
  border-radius:18px;margin-bottom:16px;overflow:hidden;
  position:relative;
}
.chart-section::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 4s linear infinite;
}
.chart-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px 12px;
}
.chart-title-row{display:flex;align-items:center;gap:10px;}
.chart-title{font-family:'Cinzel',serif;font-size:.9rem;letter-spacing:.08em;color:var(--g2);}
.chart-live-badge{
  display:flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:10px;
  background:rgba(39,174,96,.1);border:1px solid rgba(39,174,96,.25);
  color:#27AE60;font-size:.65rem;font-family:'Cinzel',serif;letter-spacing:.08em;
}
.chart-price-big{font-family:'Cinzel',serif;font-size:1.6rem;font-weight:700;color:var(--g2);}
.chart-change-row{display:flex;align-items:center;gap:8px;margin-top:2px;}
.chart-change{font-size:.78rem;}
.chart-tabs{display:flex;gap:4px;padding:0 18px 14px;}
.ctab{
  padding:5px 13px;border-radius:9px;
  background:var(--ink4);border:1px solid rgba(201,168,76,.08);
  color:var(--muted);font-size:.74rem;transition:all .2s;font-family:'DM Sans';
}
.ctab.active{background:rgba(201,168,76,.14);border-color:rgba(201,168,76,.3);color:var(--g2);}
.chart-wrap{padding:0 18px 18px;height:420px;}
.chart-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  padding:0 18px 18px;
}
.cstat{
  background:var(--ink4);border:1px solid rgba(201,168,76,.08);
  border-radius:10px;padding:10px;text-align:center;
}
.cstat-label{font-size:.6rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px;}
.cstat-val{font-family:'Cinzel',serif;font-size:.82rem;color:var(--g2);}
.karat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 18px 18px;}
.karat-card{
  background:var(--ink4);border:1px solid rgba(201,168,76,.1);
  border-radius:11px;padding:12px;
  display:flex;align-items:center;justify-content:space-between;
}
.karat-name{font-family:'Cinzel',serif;font-size:.78rem;color:var(--g3);}
.karat-price{font-family:'Cinzel',serif;font-size:.88rem;color:var(--g2);font-weight:600;}
.karat-usd{font-size:.65rem;color:var(--muted);}

/* ═══════════════════════════════════════════════════════════════
   FLOATING CHAT
═══════════════════════════════════════════════════════════════ */
.chat-fab{
  position:fixed;bottom:26px;right:26px;z-index:400;
  width:56px;height:56px;border-radius:50%;
  background:var(--gold-grad);background-size:300% 100%;
  animation:shimText 4s linear infinite;
  border:none;display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;color:var(--ink);
  box-shadow:0 8px 30px rgba(201,168,76,.45);
  transition:all .3s;
}
.chat-fab:hover{transform:scale(1.1);box-shadow:0 12px 40px rgba(201,168,76,.55);}
.chat-badge{
  position:absolute;top:5px;right:5px;
  width:18px;height:18px;border-radius:50%;
  background:var(--accent);color:#fff;font-size:.62rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  border:2px solid var(--ink);
}
.chat-panel{
  position:fixed;bottom:96px;right:26px;z-index:400;
  width:340px;
  background:linear-gradient(160deg,var(--ink2),var(--ink3));
  border:1px solid rgba(201,168,76,.24);
  border-radius:18px;overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.75);
  transform:translateY(18px) scale(.96);
  opacity:0;pointer-events:none;transition:all .3s;
}
.chat-panel.open{transform:translateY(0) scale(1);opacity:1;pointer-events:all;}
.chat-panel::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 4s linear infinite;
}
.chat-header{
  padding:13px 17px;
  border-bottom:1px solid rgba(201,168,76,.1);
  display:flex;align-items:center;gap:10px;
}
.chat-title{font-family:'Cinzel',serif;font-size:.88rem;letter-spacing:.08em;color:var(--g2);flex:1;}
.chat-online{display:flex;align-items:center;gap:5px;font-size:.7rem;color:var(--muted);}
.online-dot{width:7px;height:7px;border-radius:50%;background:#27AE60;animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.chat-close{background:none;border:none;color:var(--muted);font-size:.88rem;padding:4px;transition:color .2s;}
.chat-close:hover{color:var(--g2);}
.chat-tabs2{display:flex;border-bottom:1px solid rgba(201,168,76,.1);}
.chat-tab2{
  flex:1;padding:9px;border:none;background:none;
  color:var(--muted);font-size:.75rem;font-family:'DM Sans';transition:all .2s;
}
.chat-tab2.active{color:var(--g2);border-bottom:2px solid var(--g1);background:rgba(201,168,76,.04);}
.chat-msgs{
  height:240px;overflow-y:auto;padding:13px;
  display:flex;flex-direction:column;gap:9px;
}
.msg{display:flex;gap:7px;align-items:flex-end;}
.msg.mine{flex-direction:row-reverse;}
.msg-av{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  background:var(--gold-grad);background-size:300% 100%;
  display:flex;align-items:center;justify-content:center;
  font-size:.6rem;font-weight:700;color:var(--ink);
  animation:shimText 5s linear infinite;
}
.msg-av.d{background:var(--diamond-grad);}
.msg-bubble{
  max-width:75%;padding:9px 13px;border-radius:15px 15px 15px 3px;
  background:var(--ink4);border:1px solid rgba(201,168,76,.09);
  font-size:.8rem;color:var(--text);line-height:1.5;
  box-shadow:0 2px 10px rgba(0,0,0,.22);
}
.msg.mine .msg-bubble{border-radius:15px 15px 3px 15px;background:rgba(201,168,76,.13);border-color:rgba(201,168,76,.25);}
.msg-name{font-size:.64rem;color:var(--g3);margin-bottom:2px;font-family:'Cinzel',serif;}
.msg-time{font-size:.6rem;color:var(--muted);margin-top:2px;}
.msg-status{font-size:.58rem;color:rgba(201,168,76,.6);margin-top:2px;text-align:right;letter-spacing:.02em;}
.chat-input-row{
  padding:11px 13px;
  border-top:1px solid rgba(201,168,76,.1);
  display:flex;gap:7px;align-items:center;
}
.chat-inp{
  flex:1;background:var(--ink4);border:1px solid rgba(201,168,76,.1);
  border-radius:18px;padding:9px 13px;
  color:var(--text);font-size:.8rem;outline:none;font-family:'DM Sans';
  transition:border-color .2s;
}
.chat-inp:focus{border-color:rgba(201,168,76,.38);}
.chat-send{
  width:34px;height:34px;border-radius:50%;
  background:var(--gold-grad);background-size:300% 100%;
  border:none;display:flex;align-items:center;justify-content:center;
  color:var(--ink);font-size:.82rem;animation:shimText 4s linear infinite;
}
.dm-list{height:280px;overflow-y:auto;}
.dm-item{
  display:flex;align-items:center;gap:10px;
  padding:11px 16px;border-bottom:1px solid rgba(201,168,76,.06);
  transition:background .2s;cursor:pointer;
}
.dm-item:hover{background:rgba(201,168,76,.04);}
.dm-av{
  width:36px;height:36px;border-radius:50%;background:var(--gold-grad);background-size:300% 100%;
  display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;
  color:var(--ink);flex-shrink:0;animation:shimText 5s linear infinite;
}
.dm-name{font-size:.82rem;font-weight:600;color:var(--text);}
.dm-preview{font-size:.72rem;color:var(--muted);margin-top:1px;}
.dm-time{font-size:.66rem;color:var(--muted);}
.dm-unread{width:17px;height:17px;border-radius:50%;background:var(--g1);color:var(--ink);font-size:.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;}

/* ═══════════════════════════════════════════════════════════════
   RIGHT SIDEBAR — SHOPS
═══════════════════════════════════════════════════════════════ */
.sr{
  position:sticky;top:68px;height:calc(100vh - 68px);
  overflow-y:auto;padding:20px 12px;
  border-left:1px solid rgba(201,168,76,.1);
  background:rgba(9,7,4,.9);
}
.sh{display:flex;align-items:center;gap:9px;margin-bottom:14px;}
.st{
  font-family:'Cinzel',serif;font-size:.9rem;
  background:var(--gold-grad);background-size:300% 100%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;animation:shimText 5s linear infinite;flex:1;
}
.add-btn{
  width:30px;height:30px;border-radius:8px;
  background:var(--gold-grad);background-size:300% 100%;
  border:none;color:var(--ink);font-size:.85rem;
  display:flex;align-items:center;justify-content:center;
  animation:shimText 4s linear infinite;
}
.scard{
  background:linear-gradient(160deg,var(--ink3),var(--ink4));
  border:1px solid rgba(201,168,76,.1);
  border-radius:13px;padding:13px;margin-bottom:10px;
  transition:all .25s;position:relative;overflow:hidden;
}
.scard::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--gold-grad2);background-size:300% 100%;
  opacity:0;animation:shimLine 4s linear infinite;
}
.scard:hover{border-color:rgba(201,168,76,.28);transform:translateY(-2px);box-shadow:0 8px 28px rgba(201,168,76,.08);}
.scard:hover::before{opacity:1;}
.stop2{display:flex;gap:10px;align-items:flex-start;margin-bottom:7px;}
.slogo{
  width:40px;height:40px;border-radius:10px;flex-shrink:0;
  background:var(--gold-grad);background-size:300% 100%;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;color:var(--ink);font-size:.85rem;
  font-family:'Cinzel',serif;animation:shimText 5s linear infinite;
}
.sname{font-weight:600;font-size:.86rem;color:var(--text);}
.sowner{font-size:.7rem;color:var(--muted);margin-top:1px;}
.sloc2{font-size:.7rem;color:var(--muted);display:flex;gap:4px;align-items:center;margin-bottom:4px;}
.sloc2 i{color:var(--accent);font-size:.64rem;}
.sphone{font-size:.74rem;color:var(--g3);display:flex;gap:5px;align-items:center;margin-bottom:7px;}
.stype-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:10px;font-size:.66rem;font-weight:600;margin-bottom:7px;
}
.st-gold{background:rgba(201,168,76,.14);color:var(--g2);border:1px solid rgba(201,168,76,.24);}
.st-diamond{background:rgba(107,174,214,.14);color:var(--d2);border:1px solid rgba(107,174,214,.24);}
.st-both{background:linear-gradient(135deg,rgba(201,168,76,.1),rgba(107,174,214,.1));color:var(--g2);border:1px solid rgba(201,168,76,.2);}
.scats2{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:9px;}
.scat2{padding:2px 7px;border-radius:6px;font-size:.64rem;background:rgba(201,168,76,.08);color:var(--g3);}
.sbtns{display:flex;gap:6px;}
.smapbtn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:5px;
  padding:7px;border-radius:9px;
  background:rgba(65,130,100,.1);border:1px solid rgba(65,130,100,.22);
  color:#6EBA9A;font-size:.72rem;transition:all .2s;
}
.smapbtn:hover{background:rgba(65,130,100,.18);}
.schatbtn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:5px;
  padding:7px;border-radius:9px;
  background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.18);
  color:var(--g2);font-size:.72rem;transition:all .2s;
}
.schatbtn:hover{background:rgba(201,168,76,.14);}
.verified{color:var(--g2);font-size:.68rem;margin-left:2px;}

/* ═══════════════════════════════════════════════════════════════
   SHOP CAROUSEL
═══════════════════════════════════════════════════════════════ */
.carousel-wrap{
  position:relative;overflow:hidden;margin-bottom:14px;
  padding:4px 0 10px;
}
.carousel-track{
  display:flex;gap:12px;align-items:center;
  transition:transform .5s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.circle-item{
  flex-shrink:0;
  position:relative;
  width:62px;
  display:flex;flex-direction:column;align-items:center;gap:5px;
}
.circle-logo{
  width:56px;height:56px;border-radius:50%;flex-shrink:0;
  background:var(--gold-grad);background-size:300% 100%;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;color:var(--ink);font-size:.9rem;
  font-family:'Cinzel',serif;animation:shimText 5s linear infinite;
  border:2px solid rgba(201,168,76,.35);
  transition:all .28s;
  box-shadow:0 2px 14px rgba(201,168,76,.18);
}
.circle-logo.diamond-c{background:var(--diamond-grad);color:#0a1820;}
.circle-logo.both-c{background:linear-gradient(135deg,#8B6200,#C9A84C,#A8D4EF,#6BAED6);background-size:300% 100%;}
.circle-item:hover .circle-logo,
.circle-item.active .circle-logo{
  transform:scale(1.12);
  border-color:var(--g2);
  box-shadow:0 0 18px rgba(201,168,76,.55), 0 4px 20px rgba(201,168,76,.3);
}
.circle-name{
  font-size:.56rem;color:var(--muted);text-align:center;
  font-family:'Cinzel',serif;letter-spacing:.04em;
  max-width:62px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  transition:color .2s;
}
.circle-item:hover .circle-name,
.circle-item.active .circle-name{color:var(--g2);}

/* Shop detail popup */
.shop-popup{
  position:absolute;left:0;right:0;z-index:50;
  background:linear-gradient(160deg,var(--ink2),var(--ink3));
  border:1px solid rgba(201,168,76,.28);
  border-radius:14px;padding:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.7);
  animation:popIn .22s ease;
  margin-top:4px;
}
@keyframes popIn{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.shop-popup::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 3s linear infinite;border-radius:14px 14px 0 0;
}
.sp-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.sp-logo{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  background:var(--gold-grad);background-size:300% 100%;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;color:var(--ink);font-size:.8rem;
  font-family:'Cinzel',serif;animation:shimText 5s linear infinite;
}
.sp-logo.diamond-c{background:var(--diamond-grad);color:#0a1820;}
.sp-logo.both-c{background:linear-gradient(135deg,#8B6200,#C9A84C,#A8D4EF,#6BAED6);background-size:300% 100%;}
.sp-name{font-weight:700;font-size:.88rem;color:var(--text);}
.sp-owner{font-size:.7rem;color:var(--muted);margin-top:1px;}
.sp-row{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--text2);margin-bottom:5px;}
.sp-row i{color:var(--g3);width:12px;text-align:center;font-size:.68rem;}
.sp-badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;border-radius:8px;font-size:.65rem;font-weight:600;margin-bottom:8px;
}
.sp-cats{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:8px;}
.sp-cat{padding:2px 6px;border-radius:6px;font-size:.62rem;background:rgba(201,168,76,.08);color:var(--g3);}
.sp-desc{font-size:.72rem;color:var(--muted);line-height:1.55;margin-bottom:10px;}
.sp-btns{display:flex;gap:6px;}
.sp-map{
  flex:1;display:flex;align-items:center;justify-content:center;gap:5px;
  padding:7px;border-radius:9px;
  background:rgba(65,130,100,.1);border:1px solid rgba(65,130,100,.22);
  color:#6EBA9A;font-size:.72rem;transition:all .2s;
}
.sp-map:hover{background:rgba(65,130,100,.2);}
.sp-chat{
  flex:1;display:flex;align-items:center;justify-content:center;gap:5px;
  padding:7px;border-radius:9px;
  background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.18);
  color:var(--g2);font-size:.72rem;transition:all .2s;
}
.sp-chat:hover{background:rgba(201,168,76,.14);}
.sp-social{margin-top:7px;font-size:.68rem;display:flex;gap:10px;}
.sp-close{
  position:absolute;top:8px;right:10px;background:none;border:none;
  color:var(--muted);font-size:.8rem;padding:3px 6px;border-radius:6px;
  transition:color .2s;
}
.sp-close:hover{color:var(--g2);}

/* carousel nav arrows */
.car-nav{
  display:flex;justify-content:center;gap:8px;margin-top:6px;
}
.car-dot{
  width:6px;height:6px;border-radius:50%;background:rgba(201,168,76,.22);
  border:none;transition:all .25s;
}
.car-dot.active{width:18px;border-radius:3px;background:var(--g1);}

/* ═══════════════════════════════════════════════════════════════
   MODALS
═══════════════════════════════════════════════════════════════ */
.moverlay{
  position:fixed;inset:0;z-index:600;
  background:rgba(0,0,0,.88);backdrop-filter:blur(14px);
  display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .28s;
}
.moverlay.open{opacity:1;pointer-events:all;}
.modal{
  background:linear-gradient(160deg,var(--ink2),var(--ink3));
  border:1px solid rgba(201,168,76,.24);
  border-radius:20px;width:100%;max-width:520px;
  max-height:90vh;overflow-y:auto;
  transform:translateY(18px);transition:transform .28s;
  box-shadow:0 30px 80px rgba(0,0,0,.8);
  position:relative;
}
.modal::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--gold-grad2);background-size:300% 100%;
  animation:shimLine 3s linear infinite;border-radius:20px 20px 0 0;
}
.moverlay.open .modal{transform:translateY(0);}
.mhead{display:flex;align-items:center;padding:20px 22px 15px;border-bottom:1px solid rgba(201,168,76,.1);}
.mtitle{
  font-family:'Cinzel',serif;font-size:1.15rem;letter-spacing:.08em;
  background:var(--gold-grad);background-size:300% 100%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:shimText 4s linear infinite;flex:1;
}
.mclose{width:30px;height:30px;border-radius:50%;background:var(--ink4);border:1px solid rgba(201,168,76,.14);color:var(--muted);font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.mclose:hover{color:var(--g2);}
.mbody{padding:20px 22px;}
.mfooter{padding:0 22px 22px;display:flex;gap:9px;justify-content:flex-end;}
.fg{margin-bottom:14px;}
.fl{display:block;font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--g3);margin-bottom:6px;}
.fi,.fsel,.fta{width:100%;background:var(--ink4);border:1px solid rgba(201,168,76,.1);border-radius:10px;padding:10px 13px;color:var(--text);font-size:.86rem;outline:none;transition:border-color .2s;font-family:'DM Sans';}
.fi:focus,.fsel:focus,.fta:focus{border-color:rgba(201,168,76,.42);box-shadow:0 0 0 3px rgba(201,168,76,.05);}
.fsel{cursor:pointer;} .fsel option{background:var(--ink3);}
.fta{resize:none;min-height:72px;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.fhint{font-size:.68rem;color:var(--muted);margin-top:4px;}
.ckg{display:flex;gap:6px;flex-wrap:wrap;}
.cki{padding:6px 11px;border-radius:8px;background:var(--ink4);border:1px solid rgba(201,168,76,.1);font-size:.76rem;transition:all .2s;user-select:none;cursor:pointer;}
.cki.checked{background:rgba(201,168,76,.12);border-color:var(--g1);color:var(--g2);}
.bcancel{padding:9px 17px;border-radius:10px;background:var(--ink4);border:1px solid rgba(201,168,76,.1);color:var(--muted);font-family:'DM Sans';transition:all .2s;}
.bcancel:hover{color:var(--text);}
.bsubmit{padding:9px 22px;border-radius:10px;background:var(--gold-grad);background-size:300% 100%;color:var(--ink);font-weight:700;font-family:'DM Sans';font-size:.82rem;border:none;transition:all .2s;letter-spacing:.07em;text-transform:uppercase;animation:shimText 4s linear infinite;}
.bsubmit:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(201,168,76,.4);}
.bsubmit:disabled{opacity:.5;}
.store-types{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;}
.store-type-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:11px 7px;border-radius:11px;background:var(--ink4);border:1px solid rgba(201,168,76,.1);color:var(--muted);font-size:.73rem;transition:all .25s;font-family:'DM Sans';}
.store-type-btn .sti{font-size:1.4rem;}
.store-type-btn.selected.gold-type{background:rgba(201,168,76,.12);border-color:var(--g1);color:var(--g2);}
.store-type-btn.selected.diamond-type{background:rgba(107,174,214,.12);border-color:var(--d2);color:var(--d2);}
.store-type-btn.selected.both-type{background:linear-gradient(135deg,rgba(201,168,76,.1),rgba(107,174,214,.1));border-color:var(--g1);color:var(--g2);}
.mapbox{width:100%;height:180px;border-radius:11px;background:var(--ink4);border:1px solid rgba(201,168,76,.1);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:var(--muted);font-size:.82rem;margin-bottom:12px;}
.mapbox i{font-size:2.6rem;color:var(--g3);opacity:.55;}
.minfo2{display:flex;align-items:center;gap:9px;padding:9px 13px;background:var(--ink4);border-radius:10px;border:1px solid rgba(201,168,76,.07);margin-bottom:7px;font-size:.83rem;}
.mopenbtn{display:flex;align-items:center;gap:7px;width:100%;padding:10px 15px;border-radius:10px;margin-top:5px;background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.22);color:var(--g2);font-size:.84rem;text-decoration:none;transition:all .2s;font-family:'DM Sans';}
.mopenbtn:hover{background:rgba(201,168,76,.18);}

/* Toast */
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(70px);z-index:9999;background:linear-gradient(160deg,var(--ink2),var(--ink3));border:1px solid rgba(201,168,76,.32);border-radius:13px;padding:12px 20px;display:flex;align-items:center;gap:9px;opacity:0;transition:all .3s;font-size:.84rem;pointer-events:none;box-shadow:0 8px 30px rgba(0,0,0,.65);white-space:nowrap;}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1;}
.toast i{color:var(--g2);}

/* Empty */
.empty{text-align:center;padding:55px 20px;color:var(--muted);}
.empty i{font-size:2.8rem;display:block;margin-bottom:13px;opacity:.28;color:var(--g3);}
.empty p{font-size:.86rem;line-height:1.6;font-family:'Cormorant Garamond',serif;}

/* Mobile-only controls — hidden on desktop by default, shown in the
   @media(max-width:860px) block below */
.mobile-menu-btn{
  display:none;background:rgba(201,168,76,.08);border:1px solid rgba(201,168,76,.2);
  color:#C9A84C;width:36px;height:36px;border-radius:9px;cursor:pointer;
  align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;
}
#mobile-backdrop{
  /* Now a child of .layout (see index.html) rather than a top-level
     sibling — this is what actually makes z-index numbers here mean
     what they say. 900 sits below .sl.mobile-open/.sr.mobile-open's
     970 (so the Filters/Shops panels render and receive taps above
     the dimming, fixing the "panel opens but nothing inside is
     clickable" bug) and above everything else normally inside .layout
     (so the page behind an open panel still dims as intended). The
     header (.topnav) and the nav-links drawer nested inside it are
     unaffected either way — .topnav's own stacking level (500) already
     always renders above anything inside .layout, regardless of this
     number, since they're separate top-level siblings. */
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:900;
}
#mobile-backdrop.active{display:block;}
.mobile-panel-toggles{display:none;gap:10px;margin-bottom:14px;}
.mobile-panel-toggles button{
  flex:1;background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.18);
  color:#C8B88A;padding:9px;border-radius:10px;font-size:.78rem;cursor:pointer;
  font-family:'DM Sans';display:flex;align-items:center;justify-content:center;gap:6px;
}

.mobile-panel-close{display:none;}

/* List My Shop / Login / User's mobile-drawer twins — hidden here
   unconditionally (same pattern as .mobile-menu-btn above), and only
   ever allowed to become visible inside the @media(max-width:860px)
   block below, when BOTH the screen is narrow AND updateNavUI() has
   added .nav-mobile-visible. This is deliberately class-based rather
   than inline-style-based (unlike their desktop counterparts) so the
   media query stays in control — updateNavUI() runs at every screen
   width, and an inline style would've overridden this default at any
   width, which is exactly what caused them to also show on desktop. */
.mobile-only-navitem{display:none;}

/* Responsive */
@media(max-width:1100px){.layout{grid-template-columns:220px 1fr 256px;}}
@media(max-width:860px){
  .layout{grid-template-columns:1fr;}
  .nav-right{flex-wrap:nowrap;}
  .mobile-menu-btn{display:flex;}
  .mobile-panel-toggles{display:flex;}

  /* List My Shop / Login / User move into the mobile nav drawer
     (see #mobile-list-shop-btn etc. in index.html) instead of staying
     in the header — the header row doesn't fit flag+hamburger+bell+
     these on a phone screen, which was overflowing and causing taps
     on the header's icon buttons to land on the wrong neighboring
     button. !important is required since updateNavUI() actively sets
     these elements' display via inline style based on login state,
     and this override must win regardless of that value. */
  #list-shop-btn, #nav-login-btn, #nav-user-btn{display:none !important;}
  .mobile-only-navitem.nav-mobile-visible{display:flex;}

  /* nav-links becomes a slide-down drawer instead of just vanishing */
  .nav-links{
    display:none;
  }
  .nav-links.mobile-open{
    display:flex;flex-direction:column;gap:4px;
    position:fixed;top:56px;left:0;right:0;z-index:950;
    background:#0E0B07;border-bottom:1px solid rgba(201,168,76,.15);
    padding:12px;box-shadow:0 14px 28px rgba(0,0,0,.5);
    max-height:calc(100vh - 56px);overflow-y:auto;
  }
  .nav-links.mobile-open .nav-link{width:100%;justify-content:flex-start;padding:11px 14px;}

  /* .sl / .sr become slide-in side panels instead of just vanishing */
  .sl,.sr{display:none;}
  .sl.mobile-open,.sr.mobile-open{
    display:flex;flex-direction:column;
    position:fixed;top:0;bottom:0;width:82%;max-width:320px;z-index:970;
    background:#0E0B07;overflow-y:auto;padding:16px 16px 16px 16px;
    box-shadow:0 0 40px rgba(0,0,0,.6);
  }
  .sl.mobile-open{left:0;border-right:1px solid rgba(201,168,76,.12);}
  .sr.mobile-open{right:0;border-left:1px solid rgba(201,168,76,.12);}

  /* Real, visible close button — clicking the toggle button again isn't
     possible once a panel is open on top of it, so this (and the backdrop)
     are the only ways out. Without this, users had no discoverable way to
     close a panel other than tapping a thin, barely-visible sliver. */
  .mobile-panel-close{
    display:flex;align-items:center;justify-content:center;
    position:sticky;top:0;margin-left:auto;margin-bottom:12px;
    width:34px;height:34px;border-radius:9px;
    background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.25);
    color:#E8C96A;font-size:1rem;cursor:pointer;z-index:1;flex-shrink:0;
  }

  .topnav{padding:0 10px;gap:8px;}
  .live-gold span{display:none;}
  .live-gold{padding:6px 8px;}
  .btn-list{padding:7px 10px;font-size:.72rem;letter-spacing:.03em;}
  .btn-list i{display:none;}
  .feed{padding:14px;}
  .logo-sub{display:none;}
  .logo-name{font-size:1.1rem;}
}

/* Shared post deep-link highlight (?post=KEY in URL) */
@keyframes postHighlightPulse {
  0%, 100% { outline-color: rgba(201,168,76,.85); }
  50%      { outline-color: rgba(201,168,76,.15); }
}
.post-highlight {
  outline: 3px solid rgba(201,168,76,.75);
  outline-offset: 4px;
  border-radius: 18px;
  animation: postHighlightPulse 1s ease-in-out 3;
}