/* CSItems — تم شب
   رنگ‌ها مستقیم از خود لوگو برداشته شدن: سرمه‌ای #202F4E پس‌زمینه،
   نارنجی #F2A046 برای هرچیزی که باید دیده بشه، سفید برای متن. */

:root{
  --navy:#202F4E; --navy-2:#28395C; --navy-3:#18243D; --navy-4:#33456B;
  --orange:#F2A046; --orange-2:#FFB870; --orange-soft:rgba(242,160,70,.14);
  --paper:#28395C; --paper-2:#202F4E; --paper-3:#33456B;
  --line-c:#3C4E75;

  --mint:var(--navy); --mint2:var(--navy-2); --mint3:var(--navy-3);
  --peri:rgba(242,160,70,.16); --stone:var(--navy-4);
  --coral:#E4695F; --blush:rgba(228,105,95,.14);
  --ink:#F2F5FA; --ink2:#9BAAC6;

  --disp:"Vazirmatn",system-ui,sans-serif;
  --body:"Vazirmatn",system-ui,sans-serif;
  --mono:"Vazirmatn","JetBrains Mono",ui-monospace,monospace;
  --line:1px;
  --pop:cubic-bezier(.2,.8,.3,1);
  --shadow:0 1px 2px rgba(0,0,0,.25), 0 6px 20px rgba(0,0,0,.22);
  --shadow-lg:0 2px 6px rgba(0,0,0,.3), 0 16px 40px rgba(0,0,0,.3);
  --r:14px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--navy);color:var(--ink);font-family:var(--body);line-height:1.75}
h1,h2{font-family:var(--disp);font-weight:800;line-height:1}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

/* ---------- bar ---------- */

.bar{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px clamp(16px,4vw,40px);
  border-bottom:var(--line) solid var(--ink);
  font:700 12px var(--mono);
  flex-wrap:wrap;
}
.bar__id{display:inline-flex;align-items:center;gap:10px}
.bar__pic,.bar__avatar{width:26px;height:26px;border:2px solid var(--ink);border-radius:50%;flex:none}
.bar__sub{color:var(--ink2)}
.bar__right{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}

.pill{
  border:2px solid var(--ink);border-radius:999px;padding:4px 13px;
  background:var(--blush);font:700 11.5px var(--mono);white-space:nowrap;
  transition:background .14s var(--pop),transform .14s var(--pop);
}
a.pill:hover{background:var(--coral);color:#fff;transform:translateY(-2px)}
.pill--muted{background:var(--stone);color:var(--ink2)}
.pill--ghost{background:#fff}
.pill--steam{background:var(--peri)}

/* ---------- layout ---------- */

.wrap{max-width:1120px;margin:0 auto;padding:clamp(24px,5vh,44px) clamp(16px,4vw,40px) 60px}

.tag{
  display:inline-block;background:var(--blush);border:2px solid var(--ink);
  border-radius:999px;padding:4px 13px;
  font:700 11px var(--mono);letter-spacing:.1em;text-transform:lowercase;
  margin-bottom:14px;
}
.intro h1{font-size:clamp(32px,5.5vw,54px);letter-spacing:-.035em;margin-bottom:10px}
.lede{color:var(--ink2);max-width:56ch;margin-bottom:clamp(22px,4vw,32px)}

/* ---------- controls ---------- */

.controls{
  background:var(--mint2);border:var(--line) solid var(--ink);border-radius:18px;
  padding:18px;margin-bottom:18px;
}
label{display:block;font:700 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink2);margin-bottom:7px}
.field__row{display:flex;gap:10px;flex-wrap:wrap}
#q{
  flex:1 1 320px;min-width:0;
  padding:12px 15px;background:#fff;border:var(--line) solid var(--ink);border-radius:12px;
  font-family:var(--mono);font-size:13px;
}
#q::placeholder{color:#9aa;font-size:12px}

.btn{
  border:var(--line) solid var(--ink);border-radius:12px;padding:12px 22px;
  background:var(--peri);font:700 13px var(--mono);cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;
  transition:transform .14s var(--pop),box-shadow .14s var(--pop),background .14s var(--pop);
}
.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 0 -1px var(--ink)}
.btn:disabled{opacity:.55;cursor:default}
.btn--ghost{background:#fff;padding:9px 16px;font-size:12px;border-radius:999px}
.btn svg{width:15px;height:15px;fill:currentColor}

.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}
.meta{font:400 11px var(--mono);color:var(--ink2)}

/* ---------- notice ---------- */

.notice{
  border:var(--line) solid var(--ink);border-radius:14px;
  padding:13px 16px;margin-bottom:18px;
  font:400 13px var(--mono);line-height:1.6;
}
.notice--error{background:var(--coral);color:#fff}
.notice--warn{background:var(--blush)}

/* ---------- results ---------- */

.results__head{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-bottom:16px;
}
.results__head h2{font-size:clamp(20px,3vw,28px);letter-spacing:-.03em}
.filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#search{
  padding:9px 14px;background:#fff;border:2px solid var(--ink);border-radius:999px;
  font-family:var(--mono);font-size:12px;min-width:180px;
}
.check{display:inline-flex;align-items:center;gap:7px;font:700 11px var(--mono);
  letter-spacing:.06em;text-transform:none;color:var(--ink);margin:0}
.check input{width:16px;height:16px;accent-color:#000}

.grid{
  list-style:none;display:grid;gap:12px;
  grid-template-columns:repeat(auto-fill,minmax(178px,1fr));
}

.card{
  position:relative;
  display:flex;flex-direction:column;
  background:var(--mint2);
  border:var(--line) solid var(--ink);
  border-radius:16px;
  overflow:hidden;
  transition:transform .16s var(--pop),box-shadow .16s var(--pop);
}
.card:hover{transform:translateY(-3px);box-shadow:0 6px 0 -1px var(--ink)}

.card__strip{height:7px;background:var(--r,var(--stone));border-bottom:2px solid var(--ink)}

.card__imgwrap{
  display:grid;place-items:center;
  padding:14px 10px 6px;
  min-height:118px;
  position:relative;
  background:radial-gradient(70% 60% at 50% 45%, color-mix(in srgb,var(--r,#ffffff) 26%, transparent), transparent 72%);
}
.card__img{width:auto;max-height:96px;object-fit:contain}
.card__ph{font:700 10px var(--mono);color:#8fa398;letter-spacing:.1em;text-transform:uppercase}

.card__body{padding:8px 13px 14px;display:grid;gap:3px}
.card__name{
  font-family:var(--disp);font-weight:700;font-size:13.5px;line-height:1.25;
  letter-spacing:-.01em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.card__tags{font:400 10.5px var(--mono);color:var(--ink2)}

.card__flags{position:absolute;top:9px;left:9px;z-index:4;display:flex;flex-direction:column;gap:4px;align-items:flex-start;pointer-events:none}
.flag{
  border:2px solid var(--ink);border-radius:6px;background:#fff;
  padding:1px 5px;font:700 9px var(--mono);letter-spacing:.08em;
}
.flag--st{background:#e4ae39}
.flag--sv{background:#ffd700}
.flag--lock{background:var(--stone);color:var(--ink2)}

.empty{
  border:var(--line) dashed var(--ink);border-radius:16px;
  padding:44px 20px;text-align:center;color:var(--ink2);
}
.empty b{color:var(--ink);font-family:var(--disp);font-size:17px}

/* ---------- footer ---------- */

.foot{
  border-top:var(--line) solid var(--ink);
  padding:16px clamp(16px,4vw,40px) 34px;
  font:400 11.5px var(--mono);color:var(--ink2);
}

@media (max-width:520px){
  .grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .btn{width:100%;justify-content:center}
  #q{flex-basis:100%}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms !important;animation-duration:.01ms !important}
  .card:hover,.btn:hover{transform:none}
}

/* ═══════════ pricing, detail sheet, cart ═══════════ */

.card{position:relative}
.card__hit{
  display:flex;flex-direction:column;width:100%;height:100%;
  background:none;border:0;padding:0;margin:0;text-align:left;cursor:pointer;font:inherit;color:inherit;
}
.card__hit:focus-visible{outline:3px solid var(--ink);outline-offset:-3px;border-radius:13px}

.card__money{display:flex;align-items:baseline;gap:7px;margin-top:6px;flex-wrap:wrap}
.card__payout{font-family:var(--disp);font-weight:800;font-size:17px;letter-spacing:-.02em}
.card__market{font-style:normal;font:400 10px var(--mono);color:var(--ink2)}

.phase{
  background:var(--peri);border:1.5px solid var(--ink);border-radius:5px;
  padding:0 4px;font-weight:700;
}

.card__verdict{
  position:absolute;left:9px;bottom:9px;
}
.verdict{
  display:inline-block;border:2px solid var(--ink);border-radius:999px;
  padding:1px 8px;font:700 9px var(--mono);letter-spacing:.09em;text-transform:uppercase;
  background:#fff;
}
.verdict--auto{background:#7fd6a0}
.verdict--review{background:#f2c94c}
.verdict--reject{background:var(--stone);color:var(--ink2)}
.card__body{padding-bottom:32px}

.flag--stk{background:var(--peri)}

.card.is-picked{box-shadow:0 0 0 4px var(--ink) inset,0 6px 0 -1px var(--ink)}
.card__tick{
  position:absolute;top:8px;right:8px;z-index:5;
  width:26px;height:26px;border-radius:50%;
  background:#7fd6a0;border:3px solid var(--ink);
  display:none;place-items:center;font-weight:900;font-size:13px;line-height:1;
  box-shadow:0 2px 0 0 var(--ink);
}
.card.is-picked .card__tick{display:grid}

/* ---------- sheet ---------- */

body.locked{overflow:hidden}

.sheet{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:18px}
/* display:grid/flex beats the hidden attribute — restore it explicitly,
   or an invisible overlay eats every click on the page. */
.sheet[hidden],.cart[hidden]{display:none}
.sheet__bg{position:absolute;inset:0;background:rgba(11,20,15,.55);backdrop-filter:blur(2px)}
.sheet__box{
  position:relative;z-index:1;
  width:min(560px,100%);max-height:88vh;overflow-y:auto;
  background:var(--mint2);border:var(--line) solid var(--ink);border-radius:20px;
  padding:22px;
  box-shadow:0 10px 0 -2px var(--ink);
}
.sheet__x{
  position:absolute;top:14px;right:14px;
  width:32px;height:32px;border:2px solid var(--ink);border-radius:50%;
  background:#fff;cursor:pointer;font-size:13px;line-height:1;
}
.sheet__x:hover{background:var(--coral);color:#fff}

.sheet__top{display:flex;gap:16px;align-items:flex-start;margin-bottom:16px;padding-right:34px}
.sheet__imgwrap{
  flex:none;width:150px;min-height:110px;display:grid;place-items:center;
  background:#fff;border:2px solid var(--ink);border-radius:14px;padding:8px;
}
.sheet__imgwrap img{max-width:100%;height:auto;font-size:0;color:transparent}
.sheet__head h3{font-family:var(--disp);font-weight:800;font-size:20px;line-height:1.15;letter-spacing:-.02em;margin-bottom:5px}
.sheet__sub{font:400 11.5px var(--mono);color:var(--ink2);margin-bottom:9px}

.specs{
  display:grid;grid-template-columns:auto 1fr;gap:5px 14px;
  background:#fff;border:2px solid var(--ink);border-radius:12px;padding:12px 14px;
  font:400 12px var(--mono);margin-bottom:16px;
}
.specs dt{color:var(--ink2)}
.specs dd{text-align:right;font-weight:700;overflow-wrap:anywhere}

.sheet__sect{margin-bottom:16px}
.sheet__sect h4{font:700 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);margin-bottom:8px}
.hint{font:400 10.5px var(--mono);color:var(--ink2);margin-top:7px;line-height:1.6}

.stickers,.markets,.reasons{list-style:none;display:grid;gap:6px}
.stickers li,.markets li{
  display:flex;align-items:center;gap:9px;
  background:#fff;border:2px solid var(--ink);border-radius:10px;padding:7px 11px;
  font:400 11.5px var(--mono);
}
.stickers li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stickers li em,.markets li em{font-style:normal;color:var(--ink2);font-size:10px}
.markets li .mk{flex:1;text-transform:capitalize;font-weight:700}
.markets li b{font-family:var(--disp);font-size:14px}
.reasons li{
  background:#fff;border-left:var(--line) solid #f2c94c;border-radius:0 8px 8px 0;
  padding:7px 11px;font:400 11.5px var(--mono);line-height:1.55;
}

.sheet__buy{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  border-top:var(--line) solid var(--ink);padding-top:15px;
}
.sheet__k{display:block;font:700 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2)}
.sheet__price{font-family:var(--disp);font-weight:900;font-size:30px;letter-spacing:-.03em;line-height:1.1}
.sheet__note{display:block;font-style:normal;font:400 10.5px var(--mono);color:var(--ink2);margin-top:2px}

.btn--sell{background:#7fd6a0}
.btn--sell:disabled{background:var(--stone)}
.btn--sm{padding:9px 15px;font-size:11.5px}

/* ---------- cart ---------- */

.cart{
  position:fixed;left:50%;top:66px;transform:translateX(-50%);
  z-index:70;display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;
  background:var(--mint2);border:var(--line) solid var(--ink);border-radius:999px;
  padding:10px 12px 10px 20px;
  box-shadow:0 7px 0 -1px var(--ink);
  max-width:calc(100% - 24px);
}
.cart__n{font:700 12px var(--mono)}
.cart__total{font-family:var(--disp);font-weight:900;font-size:21px;letter-spacing:-.02em}

@media (max-width:560px){
  .sheet__top{flex-direction:column}
  .sheet__imgwrap{width:100%}
  .cart{border-radius:18px;left:12px;right:12px;transform:none;max-width:none;top:60px}
}

/* ---------- liquidity meter ---------- */
.liq{display:flex;align-items:center;gap:7px;margin-top:7px}
.liq__bar{flex:1;height:6px;background:#fff;border:2px solid var(--ink);border-radius:999px;overflow:hidden;min-width:40px}
.liq__bar--lg{height:10px}
.liq__fill{display:block;height:100%;width:0;border-radius:0 999px 999px 0;transition:width .4s var(--pop)}
.liq--hi{background:#3ba55d}
.liq--mid{background:#f2c94c}
.liq--lo{background:var(--coral)}
.liq__txt{font:700 9px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);white-space:nowrap}

.liqbig{display:flex;align-items:center;gap:14px;background:#fff;border:2px solid var(--ink);border-radius:12px;padding:12px 14px}
.liqbig__score{font-family:var(--disp);font-weight:900;font-size:30px;line-height:1;letter-spacing:-.03em}
.liqbig__meta{flex:1;display:grid;gap:6px;min-width:0}
.liqbig__meta em{font-style:normal;font:400 10.5px var(--mono);color:var(--ink2);line-height:1.5}
.reasons--note li{border-left-color:var(--peri)}

.sheet__review{
  background:#f2c94c;border:2px solid var(--ink);border-radius:12px;
  padding:11px 14px;font:400 12px var(--mono);line-height:1.6;margin-bottom:16px;
}

.tot{float:right;font:700 10px var(--mono);letter-spacing:.06em;text-transform:none;color:var(--ink)}
.stickers li b{margin-left:auto;font-family:var(--disp);font-size:13px;white-space:nowrap}

/* items we won't buy: last and dimmed */
.card.v-reject{opacity:.42;filter:saturate(.35)}
.card.v-reject:hover{opacity:.75;transform:none;box-shadow:none}

/* review contact block */
.sheet__review{
  background:#f2c94c;border:2px solid var(--ink);border-radius:12px;
  padding:12px 14px;font:400 12px var(--mono);line-height:1.6;margin-bottom:16px;
}
.sheet__contact{margin-top:9px;font-weight:700}
.contacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
.contact{
  display:inline-flex;align-items:center;gap:7px;
  background:#fff;border:2px solid var(--ink);border-radius:999px;
  padding:6px 13px;font:700 11.5px var(--mono);
  transition:background .14s var(--pop),transform .14s var(--pop);
}
.contact svg{width:14px;height:14px;fill:var(--ink)}
.contact:hover{background:var(--peri);transform:translateY(-2px)}

/* ---------- applied stickers / charms on the card ---------- */
.card__imgwrap{position:relative}
.applied{
  position:absolute;left:8px;right:8px;bottom:4px;
  display:flex;flex-direction:row;flex-wrap:wrap;gap:3px;
  pointer-events:none;z-index:1;
}
.applied--right{justify-content:flex-start}
.applied img{
  width:20px;height:20px;object-fit:contain;
  background:rgba(255,255,255,.85);
  border:1.5px solid var(--ink);border-radius:5px;padding:1px;
}
.applied img.charm{border-radius:50%}

/* ---------- items we can't buy ---------- */
.card.v-reject{opacity:.45;filter:grayscale(1)}
.card.v-reject:hover{transform:none;box-shadow:none;opacity:.7}

/* ---------- review box with contacts ---------- */
.sheet__review{
  background:#f2c94c;border:2px solid var(--ink);border-radius:12px;
  padding:12px 14px;margin-bottom:16px;
}
.sheet__review p{font:400 12px var(--mono);line-height:1.6}
.sheet__contact{margin-top:8px;padding-top:8px;border-top:2px solid rgba(0,0,0,.18)}
.sheet__contact a{font-weight:700;text-decoration:underline;text-underline-offset:2px}
.sheet__contact a:hover{background:var(--ink);color:#f2c94c;text-decoration:none}
.sheet__contact span{opacity:.5;margin:0 4px}

.contacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
.contact{
  display:inline-flex;align-items:center;gap:7px;
  background:#fff;border:2px solid var(--ink);border-radius:999px;
  padding:7px 14px;font:700 12px var(--mono);
  transition:background .14s var(--pop),transform .14s var(--pop);
}
.contact svg{width:14px;height:14px;fill:var(--ink)}
.contact:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.contact:hover svg{fill:#fff}
.sheet__contact{margin-top:9px;padding-top:9px;border-top:2px solid rgba(0,0,0,.18)}

/* not-accepted items: still visible, clearly out of play */
.card.v-reject{opacity:.5;filter:grayscale(1)}
.card.v-reject:hover{opacity:.75;filter:grayscale(.6);transform:none;box-shadow:none}

.sheet__review p{margin:0 0 9px}
.sheet__contact{font:400 11px var(--mono);opacity:.8}
.contacts{display:flex;gap:8px;flex-wrap:wrap}
.contact{
  display:inline-flex;align-items:center;gap:7px;
  background:#fff;border:2px solid var(--ink);border-radius:999px;
  padding:7px 14px;font:700 11.5px var(--mono);
  transition:background .14s var(--pop),transform .14s var(--pop);
}
.contact:hover{background:var(--peri);transform:translateY(-2px)}
.contact svg{width:14px;height:14px;fill:var(--ink)}

.card__payout--soft{font-size:13px;opacity:.75}

/* ---------- persian ---------- */
html[lang="fa"] body{font-family:"Vazirmatn",var(--body)}
html[lang="fa"] h1,html[lang="fa"] h2,html[lang="fa"] .card__name,
html[lang="fa"] .card__payout,html[lang="fa"] .sheet__price{font-family:"Vazirmatn",var(--disp)}
html[dir="rtl"] .card__flags{left:auto;right:9px;align-items:flex-end}
html[dir="rtl"] .card__verdict{left:auto;right:9px}
html[dir="rtl"] .applied--right{justify-content:flex-end}
html[dir="rtl"] .specs dd{text-align:left}
html[dir="rtl"] .warn,html[dir="rtl"] .reasons li{border-left:0;border-right:var(--line) solid var(--coral);padding-left:0;padding-right:12px}

/* ---------- checkout ---------- */
.wrap--narrow{max-width:680px}
.co__h{font-size:20px;letter-spacing:-.02em;margin-bottom:12px}
.colist{list-style:none;display:grid;gap:6px;margin-bottom:14px}
.colist li{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#fff;border:2px solid var(--ink);border-radius:10px;
  padding:9px 13px;font:400 12px var(--mono);
}
.colist li b{font-family:var(--disp);font-size:14px;white-space:nowrap}
.co__total{
  display:flex;align-items:baseline;justify-content:space-between;
  border-top:var(--line) solid var(--ink);padding-top:12px;
  font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;
}
.co__total b{font-family:var(--disp);font-size:28px;letter-spacing:-.02em}
.co__rial{
  margin-top:8px;text-align:right;font:400 13px var(--mono);color:var(--ink2);
}
html[dir="rtl"] .co__rial{text-align:left}

.seg{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.seg__b{
  border:2px solid var(--ink);border-radius:999px;background:#fff;
  padding:8px 15px;font:700 12px var(--mono);cursor:pointer;
  transition:background .14s var(--pop),transform .14s var(--pop);
}
.seg__b:hover{transform:translateY(-2px)}
.seg__b.is-on{background:var(--peri)}

select{
  width:100%;padding:11px 13px;background:#fff;
  border:var(--line) solid var(--ink);border-radius:12px;
  font-family:var(--mono);font-size:13px;
}
.err{color:#a11;font:700 11.5px var(--mono);margin-top:6px}
.btn--wide{width:100%;justify-content:center;margin-top:6px}
.done .ref{font:400 13px var(--mono);margin:10px 0 16px}
.done .ref b{font-size:15px}
.f input,.f select{width:100%}
.wrap--narrow .controls{margin-bottom:18px}

/* Numbers, links and wallet addresses stay left-to-right even in RTL —
   a reversed card number is unreadable. */
#tradeUrl,#wallet,#cardNumber,#contactValue{direction:ltr;text-align:left}
html[dir="rtl"] #tradeUrl,html[dir="rtl"] #wallet,
html[dir="rtl"] #cardNumber,html[dir="rtl"] #contactValue{text-align:right}
html[dir="rtl"] .f label,html[dir="rtl"] .hint{text-align:right}
.f{margin-bottom:16px}
.hint{margin-top:6px}
.card__imgwrap.has-applied{padding-bottom:30px}

/* details button — selection is the primary action now, so info moves
   to its own control instead of owning the whole card */
.card__info{
  position:absolute;bottom:10px;right:10px;z-index:5;
  width:24px;height:24px;border-radius:50%;
  border:2px solid var(--ink);background:#fff;
  font:700 12px var(--mono);line-height:1;cursor:pointer;
  display:grid;place-items:center;
  transition:background .14s var(--pop),transform .14s var(--pop);
}
.card__info:hover{background:var(--peri);transform:scale(1.1)}
html[dir="rtl"] .card__info{right:auto;left:10px}

.card__hit{cursor:pointer}
.card.v-reject .card__hit,.card.v-review .card__hit{cursor:help}

.refbox{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--peri);border:var(--line) solid var(--ink);border-radius:14px;
  padding:14px 16px;margin-bottom:12px;
}
.refbox__k{font:700 10px var(--mono);letter-spacing:.16em;text-transform:uppercase}
.refbox__v{font-family:var(--disp);font-weight:900;font-size:24px;letter-spacing:-.01em;flex:1;direction:ltr}
.refnote{
  font:400 12px var(--mono);line-height:1.7;color:var(--ink2);
  border-left:var(--line) solid var(--coral);padding-left:12px;margin-bottom:16px;
}
html[dir="rtl"] .refnote{border-left:0;border-right:var(--line) solid var(--coral);padding-left:0;padding-right:12px}

/* ---------- wallet ---------- */
.balgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.bal{background:#fff;border:2px solid var(--ink);border-radius:14px;padding:13px 15px}
.bal--big{background:var(--peri);grid-column:1/-1}
.bal__k{display:block;font:700 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2)}
.bal__v{display:block;font-family:var(--disp);font-weight:900;font-size:24px;letter-spacing:-.02em;margin-top:2px}
.bal--big .bal__v{font-size:38px}
.bal__n{display:block;font-style:normal;font:400 10px var(--mono);color:var(--ink2);margin-top:3px}

.rows{list-style:none;display:grid;gap:8px}
.rows__empty{font:400 12px var(--mono);color:var(--ink2)}
.row2{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:#fff;border:2px solid var(--ink);border-radius:12px;padding:10px 13px}
.row2__l{display:grid;gap:2px;min-width:0}
.row2__l b{font:700 12px var(--mono)}
.row2__l em{font-style:normal;font:400 10.5px var(--mono);color:var(--ink2)}
.row2__r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.row2__r b{font-family:var(--disp);font-size:16px}
.row2__note{font-style:normal;font:400 10px var(--mono);color:var(--ink2)}
.chip2{border:2px solid var(--ink);border-radius:999px;padding:1px 9px;
  font:700 9px var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--mint-2)}
.chip2--accepted,.chip2--done{background:#7fd6a0}
.chip2--new,.chip2--pending{background:#f2c94c}
.chip2--reversed,.chip2--rejected{background:var(--coral);color:#fff}
.chip2--held{background:#f2994a}
.chip2--processing,.chip2--offer_sent{background:var(--peri)}
.txid{font:400 10px var(--mono);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  background:var(--mint-3);border:1px solid var(--ink);border-radius:5px;padding:1px 5px}

.paygrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.pay{border:var(--line) solid var(--ink);border-radius:12px;background:#fff;padding:11px 13px;
  text-align:left;cursor:pointer;font:inherit}
.pay b{display:block;font-family:var(--disp);font-size:14px}
.pay em{font-style:normal;font:400 10.5px var(--mono);color:var(--ink2)}
.pay.is-on{background:var(--peri)}
.pay.is-off{opacity:.5;cursor:not-allowed}

/* filters */
.pricebox{width:82px;padding:9px 11px;background:#fff;border:2px solid var(--ink);
  border-radius:999px;font-family:var(--mono);font-size:12px}
.sortsel{padding:9px 12px;background:#fff;border:2px solid var(--ink);
  border-radius:999px;font-family:var(--mono);font-size:12px}

/* buy: the order panel sits at the top, so give it presence */
#checkout{border-width:4px;box-shadow:0 6px 0 -1px var(--ink)}
.chip2--awaiting_payment{background:#f2c94c}
.chip2--paid,.chip2--delivered{background:#7fd6a0}
.chip2--sourcing{background:var(--peri)}
.chip2--refunded,.chip2--cancelled{background:var(--stone)}

/* clearer nav + language buttons */
.pill--nav{background:var(--mint-3);border-width:2px;font-weight:700}
.pill--nav:hover{background:var(--peri);color:var(--ink)}
.pill--lang{background:var(--coral);color:#fff;font-weight:700;letter-spacing:.04em}
.pill--lang:hover{background:var(--ink);color:var(--mint)}
html[lang="fa"] .pill--lang{font-family:var(--mono)}

/* wider modal for checkout */
.sheet__box--wide{width:min(680px,100%)}
.sheet__box--wide #checkout .co__h{margin-top:4px}

/* profile strip */
.profile{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.pf__avatar{border:3px solid var(--ink);border-radius:14px}
.pf__who{display:grid;gap:2px;min-width:0}
.pf__who b{font-family:var(--disp);font-size:20px;letter-spacing:-.02em}
.pf__who em{font-style:normal;font:400 11px var(--mono);color:var(--ink2)}
.pf__meta{margin-left:auto;display:flex;gap:16px;font:400 11px var(--mono);color:var(--ink2)}
html[dir="rtl"] .pf__meta{margin-left:0;margin-right:auto}
.pf__meta b{font-family:var(--disp);font-size:17px;color:var(--ink)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.two{grid-template-columns:1fr}}

/* phase is the difference between a $400 knife and a $4,000 one,
   so it gets its own chip rather than hiding in a tag line */
.phasechip{
  display:inline-block;align-self:flex-start;margin:2px 0 4px;
  border:2px solid var(--ink);border-radius:999px;padding:1px 9px;
  font:700 9.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;
  background:var(--peri);
}
.phasechip--ruby{background:#d9455f;color:#fff}
.phasechip--sapphire{background:#3f6fd8;color:#fff}
.phasechip--blackpearl{background:#2b2b33;color:#fff}
.phasechip--emerald{background:#1f9b5a;color:#fff}
.phasechip--phase1{background:#c9a6e8}
.phasechip--phase2{background:#8fb8f0}
.phasechip--phase3{background:#7fd6a0}
.phasechip--phase4{background:#f2b880}
.specs dd.ok{color:#1f7a4d;font-weight:700}
.specs dd.warn2{color:#b4632c;font-weight:700}


/* ---------- landing ---------- */
.hero{text-align:center;padding:26px 0 18px}
.hero h1{font-size:clamp(34px,6vw,58px);line-height:1.02;letter-spacing:-.03em;margin-bottom:10px}
.hero .lede{max-width:520px;margin:0 auto}

.reel{
  position:relative;overflow:hidden;margin:6px 0 22px;
  border:var(--line) solid var(--ink);border-radius:18px;background:var(--mint-2);
  box-shadow:0 5px 0 -1px var(--ink);
}
.reel::before,.reel::after{
  content:"";position:absolute;top:0;bottom:0;width:60px;z-index:2;pointer-events:none;
}
.reel::before{left:0;background:linear-gradient(90deg,var(--mint-2),transparent)}
.reel::after{right:0;background:linear-gradient(270deg,var(--mint-2),transparent)}
.reel__track{display:flex;gap:10px;padding:14px;width:max-content;animation:reel 46s linear infinite;will-change:transform}
.reel:hover .reel__track{animation-play-state:paused}
@keyframes reel{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.reel__track{animation:none}}
.reel__item{
  flex:0 0 auto;width:132px;display:grid;justify-items:center;gap:4px;
  background:#fff;border:2px solid var(--ink);border-radius:12px;padding:8px 6px;
}
.reel__item img{width:104px;height:66px;object-fit:contain}
.reel__item span{
  font:400 9px var(--mono);color:var(--ink2);text-align:center;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

.choose{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}
@media (max-width:700px){.choose{grid-template-columns:1fr}}
.choice{
  position:relative;display:block;background:var(--mint-2);
  border:var(--line) solid var(--ink);border-radius:20px;padding:20px 22px 30px;
  box-shadow:0 5px 0 -1px var(--ink);
  transition:transform .16s var(--pop),box-shadow .16s var(--pop),background .16s var(--pop);
}
.choice:hover{transform:translateY(-3px);box-shadow:0 9px 0 -1px var(--ink);background:#fff}
.choice--alt{background:var(--peri)}
.choice--alt:hover{background:#cdd6f5}
.choice__k{font:700 9.5px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink2)}
.choice b{display:block;font-family:var(--disp);font-size:26px;letter-spacing:-.025em;margin:4px 0 6px}
.choice em{font-style:normal;font:400 13px/1.6 var(--body);color:var(--ink2)}
.choice__go{position:absolute;right:20px;bottom:14px;font-size:22px;font-weight:900}
html[dir="rtl"] .choice__go{right:auto;left:20px}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-bottom:20px}
.fact{background:#fff;border:2px solid var(--ink);border-radius:14px;padding:14px 16px}
.fact b{display:block;font-family:var(--disp);font-size:16px;margin-bottom:4px}
.fact em{font-style:normal;font:400 12px/1.6 var(--body);color:var(--ink2)}

.steps{margin-bottom:20px}
.steps h2{font-size:22px;letter-spacing:-.02em;margin-bottom:12px}
.steplist{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.steplist li{
  counter-increment:s;position:relative;background:var(--mint-3);
  border:2px solid var(--ink);border-radius:14px;padding:34px 14px 14px;
}
.steplist li::before{
  content:counter(s);position:absolute;top:10px;left:14px;
  width:22px;height:22px;border-radius:50%;background:var(--peri);
  border:2px solid var(--ink);display:grid;place-items:center;
  font:700 11px var(--mono);
}
html[dir="rtl"] .steplist li::before{left:auto;right:14px}
.steplist b{display:block;font-family:var(--disp);font-size:15px;margin-bottom:3px}
.steplist em{font-style:normal;font:400 11.5px/1.6 var(--body);color:var(--ink2)}

.cta{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:var(--peri);border:var(--line) solid var(--ink);border-radius:20px;
  padding:20px 24px;box-shadow:0 5px 0 -1px var(--ink);margin-bottom:10px;
}
.cta b{font-family:var(--disp);font-size:20px;letter-spacing:-.02em}

/* inventory value */
.invsum{
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  background:var(--peri);border:var(--line) solid var(--ink);border-radius:18px;
  padding:16px 20px;margin-bottom:16px;box-shadow:0 4px 0 -1px var(--ink);
}
.invsum__k{display:block;font:700 10px var(--mono);letter-spacing:.16em;text-transform:uppercase}
.invsum__v{display:block;font-family:var(--disp);font-weight:900;font-size:34px;letter-spacing:-.03em;line-height:1.05}
.invsum__n{display:block;font-style:normal;font:400 11px var(--mono);color:var(--ink2);margin-top:2px}
.invsum__side{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font:400 11px var(--mono)}
.invsum__side b{font-family:var(--disp);font-size:18px}

/* sourcing explainer */
.sourcebox{background:var(--mint-3)}
.tag--alt{background:var(--coral);color:#fff;border-color:var(--ink)}
.sourcelede{font:400 13.5px/1.65 var(--body);color:var(--ink2);margin-bottom:10px;max-width:62ch}
.sourcepoints{list-style:none;display:grid;gap:5px;margin-bottom:14px}
.sourcepoints li{position:relative;padding-left:20px;font:400 12.5px/1.6 var(--body)}
.sourcepoints li::before{content:"→";position:absolute;left:0;font-weight:900}
html[dir="rtl"] .sourcepoints li{padding-left:0;padding-right:20px}
html[dir="rtl"] .sourcepoints li::before{left:auto;right:0;content:"←"}

/* ==========================================================
   MOBILE

   Written after testing at 390px. The recurring faults were:
   inputs wider than their container (no border-box), the modal
   close button sitting on top of the heading, and fixed bars
   overlapping content.
   ========================================================== */

*,*::before,*::after{box-sizing:border-box}
input,select,textarea,button{max-width:100%}

@media (max-width:620px){
  .wrap{padding-left:14px;padding-right:14px}

  /* header wraps instead of squashing */
  .bar{flex-wrap:wrap;gap:8px;padding:10px 14px}
  .bar__right{flex-wrap:wrap;gap:6px}
  .pill{font-size:10.5px;padding:6px 11px}
  .bar__sub{display:none}

  h1{font-size:30px}
  .hero h1{font-size:32px}
  .co__h{font-size:18px}

  /* modals: full-width, scrollable, and the X keeps clear of the title */
  .sheet__box{
    width:calc(100% - 20px);max-height:88vh;overflow-y:auto;
    padding:44px 16px 18px;border-radius:16px;
  }
  .sheet__box--wide{width:calc(100% - 20px)}
  .sheet__x{top:10px;right:10px;width:30px;height:30px}
  html[dir="rtl"] .sheet__x{right:auto;left:10px}
  .sheet__box > h2:first-of-type,.sheet__box .co__h{margin-top:0;padding-right:34px}
  html[dir="rtl"] .sheet__box > h2:first-of-type,
  html[dir="rtl"] .sheet__box .co__h{padding-right:0;padding-left:34px}

  /* forms */
  .f{margin-bottom:14px}
  .f input,.f select,.inp,input,select{width:100%;font-size:16px}  /* 16px stops iOS zooming */
  .field__row{flex-direction:column;align-items:stretch;gap:8px}
  .field__row .btn{width:100%;justify-content:center}
  .two{grid-template-columns:1fr}
  .seg{gap:5px}
  .seg__b{padding:7px 12px;font-size:11px}

  /* filters stack rather than colliding */
  .results__head{flex-direction:column;align-items:stretch;gap:10px}
  .filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  .filters input[type="search"],.filters #shopSearch,.filters #search{grid-column:1/-1}
  .sortsel,.pricebox{width:100%}
  .check{grid-column:1/-1}

  /* cards: two up, then one on very narrow screens */
  .grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .card__name{font-size:12px}
  .card__payout{font-size:15px}
  @media (max-width:380px){ .grid{grid-template-columns:1fr} }

  /* the floating cart must not cover the header or the first row */
  .cart{
    position:fixed;top:auto;bottom:10px;left:10px;right:10px;transform:none;
    max-width:none;border-radius:16px;padding:10px 12px;flex-wrap:wrap;gap:8px;
  }
  .cart .btn{flex:1 1 auto;justify-content:center}
  body{padding-bottom:76px}

  /* landing */
  .choose{grid-template-columns:1fr}
  .choice b{font-size:21px}
  .facts{grid-template-columns:1fr}
  .steplist{grid-template-columns:1fr}
  .cta{flex-direction:column;align-items:stretch;text-align:center}
  .cta .btn{width:100%;justify-content:center}
  .reel__item{width:112px}
  .reel__item img{width:88px;height:56px}

  /* wallet + profile */
  .balgrid{grid-template-columns:1fr 1fr}
  .bal--big{grid-column:1/-1}
  .bal--big .bal__v{font-size:30px}
  .profile{gap:12px}
  .pf__meta{margin-left:0;width:100%;justify-content:space-between}
  html[dir="rtl"] .pf__meta{margin-right:0}
  .row2{flex-direction:column;align-items:flex-start;gap:8px}
  .row2__r{width:100%;justify-content:space-between}
  .txid{max-width:100%}

  /* inventory summary */
  .invsum{flex-direction:column;align-items:stretch;gap:12px}
  .invsum__side{justify-content:space-between}
  .invsum__side .btn{width:100%;justify-content:center;margin-top:4px}

  /* details sheet */
  .specs{grid-template-columns:1fr auto}
  .sheet__price{flex-direction:column;align-items:stretch;gap:10px}
  .sheet__price .btn{width:100%;justify-content:center}

  /* checkout summary rows */
  .colist li{flex-direction:column;align-items:flex-start;gap:4px}
  .refbox{flex-direction:column;align-items:stretch;text-align:center}
  .refbox__v{font-size:20px;word-break:break-all}

  .paygrid{grid-template-columns:1fr}
}

/* admin: tables scroll instead of breaking the layout */
@media (max-width:900px){
  .awrap{padding:14px 10px 50px}
  .acard{padding:12px}
  .acard table{display:block;overflow-x:auto;white-space:nowrap}
  .stats{grid-template-columns:1fr 1fr}
  .filters2{flex-direction:column;align-items:stretch}
  .filters2 .sel,.filters2 .inp{width:100%}
}

/* KYC */
.levelbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.levelbar__k{font:700 10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink2)}
.levelbar__v{font-family:var(--disp);font-size:30px;line-height:1}
.lvl{border-width:3px}
.lvl__head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}
.lvl__n{
  flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:var(--peri);
  border:2px solid var(--ink);display:grid;place-items:center;font:900 14px var(--disp);
}
.lvl__head b{display:block;font-family:var(--disp);font-size:17px}
.lvl__head em{font-style:normal;font:400 12px/1.6 var(--body);color:var(--ink2)}
.lvl__head .chip2{margin-left:auto;flex:0 0 auto}
html[dir="rtl"] .lvl__head .chip2{margin-left:0;margin-right:auto}
.chip2--done{background:#7fd6a0}
.chip2--pending{background:var(--stone)}
.attest{
  background:#fff;border:2px solid var(--ink);border-radius:12px;padding:14px;
  font:400 12.5px/1.9 var(--mono);white-space:pre-wrap;margin:8px 0 10px;
}
html[dir="rtl"] .attest{direction:rtl;text-align:right}
.sendrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
.sendrow__note{font:400 11px var(--mono);color:var(--ink2)}
.btn--ig{background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7);color:#fff}
.reqlist{list-style:none;display:grid;gap:4px;margin:4px 0 12px;font:400 12px var(--mono)}
.reqlist li::before{content:"○ ";font-weight:700}
.reqlist li.ok{color:#1f7a4d}
.reqlist li.ok::before{content:"✓ "}
.reqlist li.todo{color:#b4632c}
.kycrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;flex-wrap:wrap}
.kycrow b{font-family:var(--disp);font-size:18px}

/* payout methods */
.pay__h{font-family:var(--disp);font-size:14px;margin:14px 0 8px}
.wallets{list-style:none;display:grid;gap:6px;margin-bottom:10px}
.wallets li{display:flex;align-items:center;gap:10px;background:#fff;border:2px solid var(--ink);
  border-radius:10px;padding:8px 11px;font:400 11px var(--mono)}
.wallets li b{font-family:var(--mono);font-size:10px;letter-spacing:.1em}
.wallets li .btn{margin-left:auto}
html[dir="rtl"] .wallets li .btn{margin-left:0;margin-right:auto}
.walletadd{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.walletadd input{flex:1 1 220px}
@media (max-width:620px){
  .walletadd{flex-direction:column}
  .walletadd .btn{width:100%;justify-content:center}
  .lvl__head{flex-wrap:wrap}
  .lvl__head .chip2{margin-left:0}
}
.attest--screen{font-size:14px;line-height:2.1;border-width:3px;background:#fff}

/* tabs */
.tabs{display:grid;grid-template-columns:190px 1fr;gap:16px;align-items:start}
.tabs__nav{display:grid;gap:6px;position:sticky;top:80px}
.tabs__b{
  text-align:left;background:var(--mint-2);border:2px solid var(--ink);border-radius:12px;
  padding:11px 14px;font:700 12.5px var(--mono);cursor:pointer;
  transition:background .14s var(--pop),transform .14s var(--pop);
}
html[dir="rtl"] .tabs__b{text-align:right}
.tabs__b:hover{transform:translateX(2px)}
html[dir="rtl"] .tabs__b:hover{transform:translateX(-2px)}
.tabs__b.is-on{background:var(--peri);box-shadow:0 3px 0 -1px var(--ink)}
.tabs__body{min-width:0}
@media (max-width:860px){
  .tabs{grid-template-columns:1fr}
  .tabs__nav{position:static;display:flex;overflow-x:auto;gap:6px;padding-bottom:4px}
  .tabs__b{flex:0 0 auto;white-space:nowrap}
}

/* order page */
.orderbanner{
  position:relative;display:block;background:var(--mint-3);
  border:var(--line) solid var(--ink);border-radius:18px;padding:18px 22px 22px;
  margin-bottom:18px;box-shadow:0 4px 0 -1px var(--ink);
  transition:transform .16s var(--pop),background .16s var(--pop);
}
.orderbanner:hover{transform:translateY(-2px);background:#fff}
.orderbanner b{display:block;font-family:var(--disp);font-size:21px;margin:6px 0 4px}
.orderbanner em{font-style:normal;font:400 12.5px/1.6 var(--body);color:var(--ink2);max-width:60ch;display:block}
.orderfilters{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.pager2{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px}
.pager2__k{font:400 11px var(--mono);color:var(--ink2)}
@media (max-width:620px){
  .orderfilters{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .orderfilters .sortsel{grid-column:1/-1}
}

/* deposit warning */
.warnbox{
  background:#ffe9e7;border:3px solid var(--coral);border-radius:14px;
  padding:14px 16px;margin-bottom:12px;
}
.warnbox b{display:block;font-family:var(--disp);font-size:15px;margin-bottom:8px}
.warnbox ul{list-style:none;display:grid;gap:6px}
.warnbox li{position:relative;padding-left:18px;font:400 12.5px/1.6 var(--body)}
.warnbox li::before{content:"!";position:absolute;left:0;font-weight:900;color:var(--coral)}
html[dir="rtl"] .warnbox li{padding-left:0;padding-right:18px}
html[dir="rtl"] .warnbox li::before{left:auto;right:0}
.ackrow{display:flex;gap:9px;align-items:flex-start;font:400 12.5px/1.5 var(--body)}
.ackrow input{margin-top:2px;flex:0 0 auto}

/* payment picker */
.paypick{display:grid;gap:8px}
.paypick__b{
  text-align:left;background:#fff;border:2px solid var(--ink);border-radius:12px;
  padding:11px 14px;cursor:pointer;font:inherit;
  transition:background .14s var(--pop);
}
html[dir="rtl"] .paypick__b{text-align:right}
.paypick__b b{display:block;font-family:var(--disp);font-size:14px}
.paypick__b em{font-style:normal;font:400 11px var(--mono);color:var(--ink2)}
.paypick__b.is-on{background:var(--peri)}
.paypick__b.is-off{opacity:.45;cursor:not-allowed}
.paypick__b.is-short.is-on{background:#ffe9e7}

.topupbanner{
  position:relative;display:block;background:var(--peri);
  border:var(--line) solid var(--ink);border-radius:16px;padding:14px 20px 16px;
  margin-bottom:16px;box-shadow:0 4px 0 -1px var(--ink);
  transition:transform .16s var(--pop);
}
.topupbanner:hover{transform:translateY(-2px)}
.topupbanner b{display:block;font-family:var(--disp);font-size:17px}
.topupbanner em{font-style:normal;font:400 12px var(--body);color:var(--ink2)}
.bal--dep{background:var(--mint-3);border-style:dashed}

/* legal pages */
.legal h1{font-size:32px;margin-bottom:6px}
.legal h2{font-family:var(--disp);font-size:17px;margin:24px 0 8px}
.legal p{font:400 13.5px/1.75 var(--body);margin-bottom:10px;max-width:68ch}
.legal ul{list-style:none;display:grid;gap:8px;margin-bottom:12px;max-width:68ch}
.legal li{position:relative;padding-left:18px;font:400 13.5px/1.7 var(--body)}
.legal li::before{content:"—";position:absolute;left:0;color:var(--ink2)}
html[dir="rtl"] .legal li{padding-left:0;padding-right:18px}
html[dir="rtl"] .legal li::before{left:auto;right:0}
.foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.legal-links{display:flex;gap:14px}
.legal-links a{font:400 11px var(--mono);color:var(--ink2)}
.legal-links a:hover{color:var(--ink)}

/* deletion */
.delbox{background:#ffe9e7;border:3px solid var(--coral);border-radius:14px;padding:14px 16px;margin-top:12px}
.delbox b{display:block;font-family:var(--disp);font-size:15px;margin-bottom:6px}
.delbox p{font:400 12.5px/1.6 var(--body);margin-bottom:10px}
.tradestat{font:400 12px/1.6 var(--body);margin:8px 0;padding:8px 11px;border-radius:10px;border:2px solid var(--ink)}
.tradestat.is-ok{background:#dff3e6}
.tradestat.is-warn{background:#fff3d6}
.tradestat.is-bad{background:#ffe9e7}

/* recent activity */
.ticker{margin-bottom:18px}
.ticker__h{font-family:var(--disp);font-size:18px;margin-bottom:10px}
.ticker__list{list-style:none;display:grid;gap:6px;max-height:340px;overflow-y:auto}
.ticker__row{
  display:flex;align-items:center;gap:11px;background:#fff;
  border:2px solid var(--ink);border-radius:12px;padding:7px 12px;
}
.ticker__row img{width:44px;height:30px;object-fit:contain;flex:0 0 auto}
.ticker__mid{display:grid;min-width:0;flex:1}
.ticker__mid b{font:600 12.5px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ticker__mid em{font-style:normal;font:400 10.5px var(--mono);color:var(--ink2)}
.ticker__when{font:400 10.5px var(--mono);color:var(--ink2);white-space:nowrap}
@media (max-width:620px){.ticker__list{max-height:260px}}

/* faq */
.q{border:2px solid var(--ink);border-radius:12px;background:#fff;margin-bottom:8px;overflow:hidden}
.q summary{cursor:pointer;padding:12px 15px;font:600 13.5px var(--body);list-style:none}
.q summary::-webkit-details-marker{display:none}
.q summary::after{content:"+";float:right;font-weight:900;font-family:var(--mono)}
html[dir="rtl"] .q summary::after{float:left}
.q[open] summary::after{content:"\2212"}
.q[open] summary{background:var(--mint-3)}
.q p{padding:0 15px 13px;margin:0;font:400 13px/1.7 var(--body);color:var(--ink2)}
.foot-social{display:flex;gap:12px}
.foot-social a{font:400 11px var(--mono);color:var(--ink2)}
.foot-social a:hover{color:var(--ink)}

/* item detail on cards */
.card__stickers{display:flex;gap:3px;margin:3px 0;flex-wrap:wrap}
.card__stickers img{width:22px;height:22px;object-fit:contain;
  background:#fff;border:1px solid var(--ink);border-radius:4px}
.card__stickername{font:400 8.5px var(--mono);color:var(--ink2);
  border:1px solid var(--ink2);border-radius:4px;padding:1px 4px}
.card__charm{font:400 9.5px var(--mono);color:var(--ink2)}
.card__nametag{font:400 9.5px var(--mono);color:#7a5c1f;font-style:italic}
/* Quality chips: what the item is, never what we charge for it. */
.patchip{
  display:inline-block;align-self:flex-start;margin:3px 3px 0 0;
  border:2px solid var(--ink);border-radius:999px;padding:1px 9px;
  font:700 9px/1.9 var(--mono);letter-spacing:.05em;text-transform:uppercase;
  background:#ffd9a8;white-space:nowrap;
}
.patchip--st{background:#d9e6ff}
html[dir="rtl"] .patchip{margin:3px 0 0 3px}

/* inspect buttons sit in the card body, clear of the tradeable badge */
.card__view{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
.card__viewbtn{
  font:700 8.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;
  background:#fff;border:2px solid var(--ink);border-radius:999px;padding:2px 9px;
}
.card__viewbtn:hover{background:var(--mint-3)}
.card__viewbtn--3d{background:var(--peri)}
.card__viewbtn--3d:hover{background:#cdd6f5}
.card__viewbtn--info{background:var(--mint-3)}


/* sticker and charm rows in the detail sheet */
.stickers li img{
  width:46px;height:36px;object-fit:contain;flex:0 0 auto;
  background:#fff;border:2px solid var(--ink);border-radius:8px;padding:2px;
}
.sheet__sect .stickers li{align-items:center;gap:10px}
.sheet__sect .stickers li span{
  font:400 11.5px var(--body);white-space:normal;overflow:visible;text-overflow:clip;
}
.card__quote{display:grid;margin-top:4px}
.card__quote b{font:800 15px var(--disp)}
.card__quote em{font-style:normal;font:400 10px var(--mono);color:var(--ink2)}
.card__viewbtn--ask{background:#ffd9a8;align-self:flex-start;margin-top:6px}

/* ============ shared header ============ */
.nav{
  display:flex;align-items:center;gap:18px;
  padding:11px 22px;background:var(--mint-2);
  border-bottom:3px solid var(--ink);position:sticky;top:0;z-index:60;
}
.nav__id{display:flex;align-items:center;gap:9px;font:800 17px var(--disp);color:var(--ink);flex:0 0 auto}
.nav__id img{border-radius:8px}
.nav__links{display:flex;align-items:center;gap:4px;flex:1;min-width:0}
.nav__links a{
  font:600 12.5px var(--body);color:var(--ink);padding:7px 12px;border-radius:999px;
  white-space:nowrap;border:2px solid transparent;
}
.nav__links a:hover{background:#fff;border-color:var(--ink)}
.nav__links a.is-here{background:var(--peri);border-color:var(--ink)}
.nav__right{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.pill--cta{background:var(--peri)}
.nav__burger{display:none;flex-direction:column;gap:4px;background:none;border:0;cursor:pointer;padding:6px}
.nav__burger span{display:block;width:22px;height:2.5px;background:var(--ink);border-radius:2px}

@media (max-width:900px){
  .nav{flex-wrap:wrap;gap:10px;padding:10px 14px}
  .nav__burger{display:flex;order:3;margin-left:auto}
  html[dir="rtl"] .nav__burger{margin-left:0;margin-right:auto}
  .nav__right{order:2}
  .nav__links{
    order:4;flex-basis:100%;display:none;flex-direction:column;align-items:stretch;gap:2px;
    padding-top:8px;border-top:2px solid var(--ink);
  }
  .nav__links.is-open{display:flex}
  .nav__links a{padding:11px 12px}
}

/* ============ social icons ============ */
.soc{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border:2px solid var(--ink);border-radius:999px;
  background:#fff;color:var(--ink);
}
.soc:hover{background:var(--peri)}

/* ============ footer ============ */
.ft{background:var(--mint-2);border-top:3px solid var(--ink);margin-top:44px;padding:32px 22px 20px}
.ft__grid{
  max-width:1120px;margin:0 auto;display:grid;gap:26px;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
}
.ft__col{display:flex;flex-direction:column;gap:7px;min-width:0}
.ft__col h4{font:800 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);margin-bottom:2px}
.ft__col a{font:500 13px var(--body);color:var(--ink)}
.ft__col a:hover{text-decoration:underline}
.ft__id{display:flex;align-items:center;gap:9px;font:800 18px var(--disp);color:var(--ink)}
.ft__id img{border-radius:8px}
.ft__blurb{font:400 12.5px/1.7 var(--body);color:var(--ink2);max-width:34ch}
.ft__soc{display:flex;gap:8px;margin-top:4px}
.ft__badges{
  max-width:1120px;margin:26px auto 0;padding-top:18px;border-top:2px solid var(--ink);
  display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:center;
}
.ft__badges img,.ft__badges a{max-height:88px}
.ft__base{
  max-width:1120px;margin:18px auto 0;padding-top:14px;border-top:2px solid var(--ink);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font:400 11px var(--mono);color:var(--ink2);
}
.ft__note{max-width:52ch}
@media (max-width:820px){
  .ft__grid{grid-template-columns:1fr 1fr}
  .ft__col--brand{grid-column:1 / -1}
}
@media (max-width:480px){ .ft__grid{grid-template-columns:1fr} }

/* ============ 404 ============ */
.oops{text-align:center;padding-top:48px}
.oops__code{font:800 84px/1 var(--disp);color:var(--peri);-webkit-text-stroke:3px var(--ink)}
.oops__links{
  display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  margin:26px auto;max-width:760px;text-align:left;
}
html[dir="rtl"] .oops__links{text-align:right}
.oops__card{
  display:grid;gap:3px;background:#fff;border:3px solid var(--ink);border-radius:14px;
  padding:14px 16px;box-shadow:4px 4px 0 var(--ink);
}
.oops__card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.oops__card b{font:800 15px var(--disp)}
.oops__card span{font:400 12px var(--body);color:var(--ink2)}

/* ============ contact ============ */
.contact-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:18px 0 8px}
.contact-card{
  display:grid;gap:3px;background:#fff;border:3px solid var(--ink);border-radius:14px;
  padding:14px 16px;box-shadow:4px 4px 0 var(--ink);
}
.contact-card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.contact-card b{font:800 15px var(--disp)}
.contact-card span{font:400 12px var(--body);color:var(--ink2)}

/* ============ delivery promise ============ */
.deliver{
  display:flex;align-items:center;gap:10px;margin:0 0 16px;
  background:#dff3e6;border:3px solid var(--ink);border-radius:14px;padding:11px 15px;
}
.deliver b{font:800 13px var(--disp)}
.deliver span{font:400 12px/1.6 var(--body);color:var(--ink2)}

/* لوگو */
.nav__id img{ height:34px;width:auto;border-radius:0 }
.ft__id img{ height:38px;width:auto;border-radius:0 }
@media (max-width:520px){ .nav__id img{ height:28px } }

/* ============================================================
   تم شب — روی همون ساختار
   ============================================================ */

body{ background:var(--navy); color:var(--ink) }

/* --- سطح‌ها --- */
.card,.oops__card,.contact-card,.q,.sheet__box,.co,.controls,.tile,.panel,
.ticker__row,.deliver,.specs,.stickers li{
  background:var(--navy-2) !important;
  border:1px solid var(--line-c) !important;
  border-radius:var(--r) !important;
  box-shadow:var(--shadow) !important;
  color:var(--ink);
}
.card:hover,.oops__card:hover,.contact-card:hover{
  border-color:var(--orange) !important;
  box-shadow:var(--shadow-lg) !important;
  transform:translateY(-2px);
}

/* --- دکمه‌ها --- */
.btn,.pill,.abtn,.card__viewbtn{
  border:1px solid var(--line-c);
  border-radius:999px;
  background:var(--navy-3);
  color:var(--ink);
  box-shadow:none;
  font-weight:600;
}
.btn:hover,.pill:hover,.card__viewbtn:hover{
  border-color:var(--orange); color:var(--orange); transform:translateY(-1px);
}
.btn--sell,.pill--cta,.btn--primary,.card__viewbtn--3d{
  background:var(--orange); border-color:var(--orange); color:#1A2540;
}
.btn--sell:hover,.pill--cta:hover,.card__viewbtn--3d:hover{
  background:var(--orange-2); border-color:var(--orange-2); color:#1A2540;
}
.btn--ghost{ background:transparent }

/* --- هدر --- */
.nav{
  background:var(--navy-3);
  border-bottom:1px solid var(--line-c);
  box-shadow:0 2px 20px rgba(0,0,0,.28);
}
.nav__id img{ height:40px;width:auto }
.nav__links a{ color:var(--ink2);border:1px solid transparent }
.nav__links a:hover{ background:var(--navy-2);color:var(--ink);border-color:var(--line-c) }
.nav__links a.is-here{ background:var(--peri);border-color:var(--orange);color:var(--orange) }
.nav__burger span{ background:var(--ink) }

/* --- فوتر --- */
.ft{ background:var(--navy-3);border-top:1px solid var(--line-c);margin-top:56px }
.ft__id img{ height:44px;width:auto }
.ft__col h4{ color:var(--orange) }
.ft__col a{ color:var(--ink2) }
.ft__col a:hover{ color:var(--orange) }
.ft__blurb,.ft__base,.ft__note{ color:var(--ink2) }
.ft__badges,.ft__base{ border-top:1px solid var(--line-c) }
.soc{ background:var(--navy-2);border:1px solid var(--line-c);color:var(--ink2) }
.soc:hover{ border-color:var(--orange);color:var(--orange) }

/* --- ورودی‌ها --- */
.inp,input[type="text"],input[type="url"],input[type="email"],input[type="number"],
select,textarea{
  background:var(--navy-3) !important;
  border:1px solid var(--line-c) !important;
  color:var(--ink) !important;
  border-radius:10px;
}
input::placeholder,textarea::placeholder{ color:var(--ink2) }
.inp:focus,input:focus,select:focus,textarea:focus{ border-color:var(--orange) !important;outline:none }
select option{ background:var(--navy-3);color:var(--ink) }

/* --- چیپ‌ها --- */
.patchip{
  background:var(--peri);border:1px solid var(--orange);color:var(--orange);
  border-radius:8px;text-transform:none;letter-spacing:0;font-weight:700;
}
.patchip--st{ background:rgba(155,170,198,.12);border-color:var(--navy-4);color:var(--ink2) }
.tag,.flag,.verdict{ border-radius:8px;border-width:1px }

/* --- تصویر آیتم --- */
.card__imgwrap{ background:var(--navy-3) }
.card__ph{ color:var(--ink2) }
.reel__item{ background:var(--navy-2);border:1px solid var(--line-c) }
.reel::before{ background:linear-gradient(90deg,var(--navy),transparent) }
.reel::after{ background:linear-gradient(270deg,var(--navy),transparent) }
.reel{ background:var(--navy-3);border:1px solid var(--line-c);border-radius:var(--r) }

/* --- متن --- */
h1,h2,h3,h4{ color:var(--ink) }
.lede,.hint,.muted{ color:var(--ink2) }
a{ color:inherit }
.legal p{ color:var(--ink2) }
.legal h2{ color:var(--orange) }

/* --- تحویل --- */
.deliver{ background:var(--peri) !important;border-color:var(--orange) !important }
.deliver b{ color:var(--orange) }
.deliver span{ color:var(--ink) }

/* --- ۴۰۴ --- */
.oops__code{ color:var(--orange);-webkit-text-stroke:0 }

/* --- سوالات --- */
.q summary{ color:var(--ink) }
.q[open] summary{ background:var(--navy-3) }
.q p{ color:var(--ink2) }

.card__money,.specs dd{ font-variant-numeric:tabular-nums;color:var(--ink) }
.specs dt{ color:var(--ink2) }

/* کارت‌های تأکیدی و تیترها روی تم شب */
.co--alt,.tile--alt,.card--alt,.panel--alt,[class*="--accent"]{
  background:var(--peri) !important;
  border-color:var(--orange) !important;
}
.co h2,.co h3,.tile h3,.tile h4,.panel h3,
.co__h,.tile__h,.step__h{ color:var(--ink) !important }
.co p,.tile p,.panel p{ color:var(--ink2) }
.tag,.tag--alt{ background:var(--peri);border:1px solid var(--orange);color:var(--orange) }
.step__n,.num,.count{ background:var(--orange);color:#1A2540;border-color:var(--orange) }
.cta,.banner{ background:var(--navy-2);border:1px solid var(--line-c) }

/* بنر شارژ و بقیه سطح‌های باقی‌مانده */
.topupbanner,.sourcebanner,.paypick,.seg,.sheet__sect,.summary,.money,.filters,.filters2{
  background:var(--navy-2);
  border:1px solid var(--line-c);
  color:var(--ink);
}
.topupbanner{ background:var(--peri);border-color:var(--orange) }
.topupbanner b,.topupbanner h3{ color:var(--orange) }
.topupbanner span,.topupbanner p{ color:var(--ink) }
.paypick__b,.seg__b{
  background:var(--navy-3);border:1px solid var(--line-c);color:var(--ink2);
}
.paypick__b.is-on,.seg__b.is-on{
  background:var(--orange);border-color:var(--orange);color:#1A2540;
}
.q,.specs{ background:var(--navy-2) }
.sheet__bg{ background:rgba(10,16,30,.72) }
.card__stickers img,.stickers li img{ background:var(--navy-3);border-color:var(--line-c) }
table,th,td{ color:var(--ink);border-color:var(--line-c) }
th{ color:var(--ink2) }
hr{ border-color:var(--line-c) }

/* یه input بدون type هم text حساب می‌شه، ولی input[type="text"]
   بهش نمی‌خوره — برای همین انتخابگر رو باز می‌کنیم. */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
textarea,select{
  background:var(--navy-3) !important;
  border:1px solid var(--line-c) !important;
  color:var(--ink) !important;
}
input:focus,textarea:focus,select:focus{ border-color:var(--orange) !important }

/* بنر شارژ: حاشیه و سایه‌ش از تم روشن مونده بود */
.topupbanner{
  background:var(--peri) !important;
  border:1px solid var(--orange) !important;
  box-shadow:var(--shadow) !important;
}
.topupbanner b{ color:var(--orange) }
.topupbanner span{ color:var(--ink2) }

/* هرجای دیگه که از --ink برای حاشیه استفاده می‌کرد */
.sourcebanner,.co,.controls,.summary,.reel{
  border-color:var(--line-c) !important;
  box-shadow:var(--shadow) !important;
}

/* کارت‌های ویژگی — نارنجی با تیتر سفید و متن سرمه‌ای */
.fact{
  background:var(--orange) !important;
  border:1px solid var(--orange) !important;
  border-radius:var(--r) !important;
  box-shadow:var(--shadow) !important;
  padding:16px 18px;
}
.fact b{ color:#FFFFFF !important;font-weight:800;font-size:16px;margin-bottom:5px }
.fact em{ color:#1E2C49 !important;font-weight:500;line-height:1.75 }
.fact:hover{
  background:var(--orange-2) !important;
  border-color:var(--orange-2) !important;
  transform:translateY(-2px);
  box-shadow:var(--shadow-lg) !important;
}

/* فوتر پنج ستون داره (اعتماد اضافه شده) — گرید چهارتایی بود و
   ستون پنجم می‌افتاد پایین. */
.ft__grid{ grid-template-columns:1.7fr 1fr 1fr 1fr 1fr }
@media (max-width:1000px){ .ft__grid{ grid-template-columns:1fr 1fr 1fr } }
@media (max-width:700px){
  .ft__grid{ grid-template-columns:1fr 1fr }
  .ft__col--brand{ grid-column:1 / -1 }
}
@media (max-width:460px){ .ft__grid{ grid-template-columns:1fr } }

/* ۴۰۴: چهار کارت باید تو یه ردیف یا دو در دو بشینن، نه سه و یکی. */
.oops{ text-align:center;padding:56px 0 40px }
.oops__links{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:640px;
}
@media (min-width:900px){ .oops__links{ grid-template-columns:repeat(4,minmax(0,1fr));max-width:1000px } }
@media (max-width:520px){ .oops__links{ grid-template-columns:1fr } }
.oops .lede{ max-width:56ch;margin-inline:auto }
.oops__card{ text-align:start }
.oops .hint{ margin-top:22px }
.oops .hint{ text-align:center;font-family:var(--body);font-size:12.5px;letter-spacing:0 }
.ft__base{ align-items:center }
.ft__note{ max-width:60ch;text-align:end }
@media (max-width:640px){ .ft__base{ justify-content:center;text-align:center } .ft__note{ text-align:center } }

.floornote{ margin:6px 0 0;font:500 11.5px var(--body);color:var(--ink2) }
.floornote.is-raised{ color:var(--orange) }

/* دو کادر قیمت با یه برچسب واحد کنارشون — نه داخل هرکدوم */
.pricepair{ display:inline-flex;align-items:center;gap:8px }
.pricepair .pricebox{ width:110px }
.pricepair__unit{ font:600 12px var(--body);color:var(--ink2);white-space:nowrap }
.pricepair .pricebox{ width:124px;text-align:center;font-family:var(--body) }
.pricepair .pricebox::placeholder{ font-family:var(--body);opacity:.75 }

/* ============================================================
   خوانایی روی تم شب

   هرجا پس‌زمینه روشن یا نارنجیه، متن باید سرمه‌ای باشه نه سفید.
   سفید روی نارنجی نسبت کنتراست ۱.۹ می‌ده که عملاً خونده نمی‌شه.
   ============================================================ */

/* دکمه اطلاعات روی کارت — سفید روی سفید بود، نامرئی */
.card__info{
  background:var(--navy-3) !important;
  border:2px solid var(--orange) !important;
  color:var(--orange) !important;
}
.card__info:hover{ background:var(--orange) !important;color:#16223C !important }

/* هر سطح نارنجی: متن سرمه‌ای */
/* Only where the surface really is orange. A blanket rule put navy
   text on navy cards, which is the same bug in the other direction. */
.btn--sell,.pill--cta,.card__viewbtn--3d{ color:#16223C }
.fact em{ color:#16223C !important }
.fact b{ color:#FFFFFF !important }

/* برچسب وضعیت و فاز: زمینه روشن، پس متن تیره */
.verdict,.card__verdict,.phasechip,.badge,.chip--light{
  color:#16223C !important;
}
.notice--warn,.notice--bad{ color:#16223C !important }

/* لینک‌ها روی سطح نارنجی */
.deliver a,.fact a,.topupbanner a{ color:#16223C;text-decoration:underline }

/* دو کارت انتخاب: یکی سرمه‌ای، یکی نارنجی (choice--alt).
   متن هرکدوم باید با زمینه خودش بخونه، نه یه رنگ برای هردو. */
.choice{ background:var(--navy-2) !important;border:1px solid var(--line-c) !important }
.choice .choice__k{ color:var(--ink2) !important }
.choice b,.choice h2,.choice h3{ color:var(--ink) !important }
.choice p,.choice em{ color:var(--ink2) !important }
.choice .choice__go{ color:var(--orange) !important }

.choice--alt{ background:var(--orange) !important;border-color:var(--orange) !important }
.choice--alt .choice__k{ color:#3A2A10 !important }
.choice--alt b,.choice--alt h2,.choice--alt h3{ color:#FFFFFF !important }
.choice--alt p,.choice--alt em{ color:#16223C !important }
.choice--alt .choice__go{ color:#16223C !important }

/* نوار ارزش اینونتوری و نوار تحویل — زمینه نارنجی */
.invsum{ background:var(--peri) !important;border:1px solid var(--orange) !important }
.invsum__k{ color:var(--ink2) !important }
.invsum__v{ color:var(--ink) !important }
.invsum .btn{ background:var(--navy-3) !important;color:var(--ink) !important;border-color:var(--line-c) !important }
.invsum .btn:hover{ border-color:var(--orange) !important;color:var(--orange) !important }

/* آخرین موارد خوانایی */

/* هشدار: متن سرمه‌ای روی زمینه قرمز کم‌رنگ خونده نمی‌شد */
.notice--warn,.notice--bad{
  background:rgba(228,105,95,.16) !important;
  border:1px solid var(--coral) !important;
  color:var(--ink) !important;
}
.notice--warn b,.notice--bad b{ color:var(--coral) !important }

/* تیتر کارت نارنجی: سرمه‌ای خواناتر از سفیده */
.choice--alt b,.choice--alt h2,.choice--alt h3{ color:#16223C !important }

/* چیپ‌ها و متن‌های کم‌رنگ روی سطح‌های نارنجی‌تینت */
.patchip{ color:var(--orange-2) !important }
.patchip--st{ color:var(--ink) !important;border-color:var(--ink2) !important }
.topupbanner em,.topupbanner span{ color:var(--ink) !important }
.invsum__k{ color:var(--ink) !important }

/* برچسب‌های روی کارت — زمینه روشن، متن باید تیره باشه */
.flag--st,.flag--sv,.flag--souvenir{ color:#2A2205 !important;font-weight:700 }
.flag--lock{ color:var(--ink) !important }
.verdict--no,.card__verdict--no{ background:rgba(228,105,95,.18) !important;border-color:var(--coral) !important;color:var(--ink) !important }
.verdict--ok,.card__verdict--ok{ background:rgba(127,214,160,.18) !important;border-color:#7FD6A0 !important;color:var(--ink) !important }
.phase,.phasechip{ color:var(--ink) !important }
.invsum__n{ color:var(--ink) !important }

/* برچسب‌های وضعیت زمینه روشن دارن (سبز، طلایی) — متنشون باید تیره
   باشه. قبلاً روشن گذاشته بودم که روی سبز روشن خونده نمی‌شد. */
.card__verdict,.verdict,.flag--st,.flag--sv,.flag--souvenir{
  color:#14203A !important;
  font-weight:700;
}

/* «قبول نمی‌کنیم» زمینه سرمه‌ای داره نه روشن — متن باید روشن باشه */
.verdict--review,.card__verdict--review,.verdict--no{
  background:rgba(228,105,95,.2) !important;
  border-color:var(--coral) !important;
  color:var(--ink) !important;
}
/* دکمه بستن مودال: سفید روی سفید بود */
.sheet__x{
  background:var(--navy-3) !important;
  border:1px solid var(--line-c) !important;
  color:var(--ink) !important;
}
.sheet__x:hover{ background:var(--coral) !important;border-color:var(--coral) !important;color:#fff !important }

/* سه حالت وضعیت، هرکدوم با متن مناسب زمینه خودش */
.verdict--auto{ background:#7FD6A0 !important;color:#14203A !important }
.verdict--review{ background:#F2C94C !important;color:#2A2205 !important }
.verdict--reject{
  background:rgba(155,170,198,.18) !important;
  border:1px solid var(--ink2) !important;
  color:var(--ink) !important;
}

/* حساب کاربری و احراز هویت — سطح‌های روشن باقی‌مانده */
.bal,.bal__box,.balcard,.attest,.todo,.paycard,.method{
  background:var(--navy-2) !important;
  border:1px solid var(--line-c) !important;
  color:var(--ink) !important;
}
.bal__v,.bal__k{ color:var(--ink) !important }
.bal__n,.bal em,.todo em{ color:var(--ink2) !important }
.attest,.attest--screen{
  background:var(--navy-3) !important;
  color:var(--ink) !important;
  border:1px solid var(--orange) !important;
}
.todo{ color:var(--ink) !important }
.todo.is-done{ color:var(--ink2) !important }

/* گزینه‌های پرداخت روی صفحه حساب */
.pay{
  background:var(--navy-2) !important;
  border:1px solid var(--line-c) !important;
  color:var(--ink) !important;
}
.pay b{ color:var(--ink) !important }
.pay em{ color:var(--ink2) !important;font-style:normal }
.pay.is-on{ background:var(--peri) !important;border-color:var(--orange) !important }
.pay.is-on b{ color:var(--orange) !important }
.pay.is-off,.pay:disabled{ opacity:.65 }
.pay.is-off b,.pay:disabled b{ color:var(--ink2) !important }
.pay.is-on b{ color:var(--orange-2) !important }
.pay.is-on em{ color:var(--ink) !important }
.depnote,.acc__hint{ color:var(--ink) !important }

/* بلوک «قیمت دستی» تو شیت — زمینه زرد روشنه، پس متن و دکمه‌هاش
   باید تیره باشن. سفید روی زرد اصلاً خونده نمی‌شه. */
.sheet__review{
  background:#F2C94C !important;
  border:1px solid #C9A227 !important;
  color:#2A2205 !important;
}
.sheet__review p,.sheet__review span,.sheet__review b,.sheet__review em{
  color:#2A2205 !important;
}
.sheet__contact{ color:#3A3208 !important;font-weight:600 }

.contact{
  background:#2A2205 !important;
  border:1px solid #2A2205 !important;
  color:#FFF6DF !important;
}
.contact:hover{ background:#14203A !important;border-color:#14203A !important;color:#FFFFFF !important }
.contact svg{ fill:currentColor !important }
/* دکمه اصلی نارنجی: متن سرمه‌ای، همه‌جا */
.btn--sell,.btn--primary,.pill--cta,.card__viewbtn--3d{
  background:var(--orange) !important;
  border-color:var(--orange) !important;
  color:#16223C !important;
  font-weight:700;
}
.btn--sell:hover,.btn--primary:hover,.pill--cta:hover{
  background:var(--orange-2) !important;border-color:var(--orange-2) !important;color:#16223C !important;
}
.btn--sell:disabled,.btn--primary:disabled{ opacity:.55 }

/* برچسب ثابت کنار هر فیلتر — بعد از انتخاب هم معلوم باشه چی رو
   فیلتر می‌کنه، نه فقط اینکه چی انتخاب شده. */
.selectfield{ position:relative;display:inline-flex;align-items:center;width:100% }
.selectfield__label{
  position:absolute;inset-inline-start:14px;z-index:2;pointer-events:none;
  font:700 10.5px var(--body);color:var(--orange);
  letter-spacing:.02em;white-space:nowrap;
}
.selectfield .sortsel{
  width:100%;
  padding-inline-start:74px;
}

/* ردیف‌های سفارش، خرید و برداشت — زمینه سفید مونده بود از تم روشن */
.row2{
  background:var(--navy-2) !important;
  border:1px solid var(--line-c) !important;
  color:var(--ink) !important;
}
.row2:hover{ border-color:var(--orange) !important }
.row2__l b{ color:var(--ink) !important }
.row2__l em,.row2__note{ color:var(--ink2) !important }
.row2__r b{ color:var(--ink) !important }
.rows__empty{ color:var(--ink2) !important }

/* برچسب وضعیت روی ردیف‌ها: زمینه روشن، متن تیره */
.chip2{ border:1px solid var(--line-c) !important;background:var(--navy-3) !important;color:var(--ink) !important }
.chip2--accepted,.chip2--done{ background:#7FD6A0 !important;color:#14203A !important;border-color:#7FD6A0 !important }
.chip2--new,.chip2--pending{ background:#F2C94C !important;color:#2A2205 !important;border-color:#F2C94C !important }
.chip2--cancelled,.chip2--declined,.chip2--reversed{
  background:rgba(228,105,95,.2) !important;color:var(--ink) !important;border-color:var(--coral) !important;
}

/* حساب‌های ذخیره‌شده برای برداشت */
.saved{ display:grid;gap:8px }
.savedrow{
  display:grid;gap:2px;text-align:start;
  background:var(--navy-3);border:1px solid var(--line-c);border-radius:12px;
  padding:9px 13px;cursor:pointer;
}
.savedrow:hover{ border-color:var(--orange) }
.savedrow.is-on{ border-color:var(--orange);background:var(--peri) }
.savedrow b{ font:700 10px var(--body);color:var(--orange);letter-spacing:.04em }
.savedrow span{ font:600 12.5px var(--mono);color:var(--ink);direction:ltr;text-align:start }
.savedrow em{ font-style:normal;font:400 11px var(--body);color:var(--ink2) }
.pricepair--wide .pricebox{ width:100%;text-align:start }

/* دکمه بستن روی تیتر می‌افتاد — تو RTL سمت راست بود و تیتر هم
   راست‌چین. حالا سمت شروع خط می‌شینه و تیتر ازش فاصله داره. */
/* In RTL the text starts on the right, so the close button belongs on
   the LEFT — inset-inline-end. It was pinned to the right, directly on
   top of the heading. */
.sheet__x{
  position:absolute;top:14px;
  inset-inline-start:auto;
  inset-inline-end:14px;
  left:auto;right:auto;
  width:32px;height:32px;
  display:grid;place-items:center;
}
.sheet__box > h2:first-of-type,
.sheet__box > .co__h:first-of-type,
.sheet__box .sheet__top{
  padding-inline-end:46px;
}

/* منطق logical اینجا درست resolve نمی‌شد؛ با مقدار فیزیکی صریح. */
html[dir="rtl"] .sheet__x{ left:14px !important; right:auto !important }
html[dir="rtl"] .sheet__box > h2,
html[dir="rtl"] .sheet__box > .co__h,
html[dir="rtl"] .sheet__box > p.hint:first-of-type{
  padding-left:48px;
  padding-right:0;
}

/* نرخ کلید TF2 */
.keyrates{ display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:0 0 14px }
.keyrate{
  background:var(--navy-2);border:1px solid var(--line-c);border-radius:var(--r);
  padding:14px 16px;display:grid;gap:3px;box-shadow:var(--shadow);
}
.keyrate--alt{ background:var(--peri);border-color:var(--orange) }
.keyrate__k{ font:600 11px var(--body);color:var(--ink2) }
.keyrate--alt .keyrate__k{ color:var(--orange) }
.keyrate__v{ font:800 19px var(--disp);color:var(--ink);font-variant-numeric:tabular-nums }
.keyrate__n{ font-style:normal;font:500 11px var(--mono);color:var(--ink2) }
.keytotal{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  background:var(--peri);border:1px solid var(--orange);border-radius:var(--r);
  padding:12px 16px;margin:12px 0;
}
.keytotal span{ font:600 12px var(--body);color:var(--ink) }
.keytotal b{ font:800 20px var(--disp);color:var(--orange);font-variant-numeric:tabular-nums }
.keyhow{ margin-top:32px }
.keyhow h2{ font-size:18px;margin-bottom:10px }

/* ============ حالت تعمیر ============ */
body.maint{
  display:grid;place-items:center;min-height:100vh;
  background:var(--navy);padding:24px;
}
.maintbox{
  max-width:520px;width:100%;text-align:center;
  background:var(--navy-2);border:1px solid var(--line-c);border-radius:20px;
  padding:40px 32px;box-shadow:var(--shadow-lg);
}
.maint__logo{ height:56px;width:auto;margin-bottom:26px }
.maint__title{ font:800 30px var(--disp);color:var(--ink);margin-bottom:12px }
.maint__lede{ font:400 14px/1.9 var(--body);color:var(--ink2);margin-bottom:22px }
.maint__eta{
  display:inline-block;background:var(--peri);border:1px solid var(--orange);
  border-radius:999px;padding:7px 16px;margin-bottom:22px;
  font:600 12px var(--body);color:var(--orange);
}
.maint__contacts{ display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:24px }
.maint__contact{
  background:var(--orange);border:1px solid var(--orange);border-radius:999px;
  padding:9px 20px;font:700 13px var(--body);color:#16223C;
}
.maint__contact:hover{ background:var(--orange-2);border-color:var(--orange-2) }
.maint__note{
  font:400 12px/1.8 var(--body);color:var(--ink2);
  border-top:1px solid var(--line-c);padding-top:18px;margin:0;
}