:root{
  --ink:#14211D;--side:#0E1B17;--paper:#F2F3EE;--card:#FFFFFF;--line:#E3E6DD;
  --gold:#B7862B;--gold-2:#D4A74A;--gold-soft:#F7EDD6;
  --green:#1F7A5A;--red:#B5402F;--muted:#69726C;
  --radius:14px;
  --shadow:0 1px 2px rgba(16,32,26,.04),0 10px 28px -14px rgba(16,32,26,.16);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:'Vazirmatn',Tahoma,sans-serif;background:var(--paper);color:var(--ink);display:flex;-webkit-font-smoothing:antialiased}

/* نقش‌ها: هر بخش فقط برای نقش خودش دیده می‌شود */
body:not(.is-admin) .only-admin{display:none!important}
body.is-admin .only-user{display:none!important}

/* ===== منوی سمت راست ===== */
#sidebar{width:252px;background:linear-gradient(180deg,#12231D 0%,#0B1713 100%);color:#DCE4DF;padding:26px 14px 20px;display:flex;flex-direction:column;gap:4px;flex-shrink:0}
#sidebar .brand{font-weight:800;font-size:21px;padding:2px 12px 24px;color:#fff;letter-spacing:-.2px}
#sidebar .brand span{color:var(--gold-2)}
.menu-item{display:flex;align-items:center;gap:11px;width:100%;text-align:right;background:none;border:0;color:inherit;font:inherit;font-size:14.5px;padding:11px 14px;border-radius:11px;cursor:pointer;transition:background .15s,color .15s}
.menu-item svg{width:19px;height:19px;flex-shrink:0;opacity:.75;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.menu-item:hover{background:rgba(255,255,255,.06);color:#fff}
.menu-item:hover svg{opacity:1}
.menu-item.active{background:linear-gradient(135deg,#CB9D3F,#A97A22);color:#1A1405;font-weight:700;box-shadow:0 6px 16px -8px rgba(183,134,43,.7)}
.menu-item.active svg{opacity:1}
.menu-item:focus-visible{outline:2px solid var(--gold-2);outline-offset:2px}

/* ===== محتوا ===== */
#content{flex:1;padding:32px 40px 40px;overflow-y:auto;min-width:0}
.page{display:none}
.page.active{display:block;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
h1{font-size:24px;font-weight:800;margin:0 0 6px;letter-spacing:-.3px}
.sub{color:var(--muted);font-size:13.5px;margin:0 0 24px;line-height:1.8}
.demo-note{background:#FFF6DC;border:1px solid #EBD592;color:#6B5208;padding:10px 14px;border-radius:12px;font-size:13px;margin-bottom:18px;display:none}

/* ===== قیمت‌ها ===== */
.prices{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-bottom:24px}
.price{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s}
.price:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(16,32,26,.22)}
.price .n{font-size:13px;color:var(--muted)}
.price .v{font-size:21px;font-weight:800;margin:8px 0 8px;font-variant-numeric:tabular-nums}
.price .c{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;padding:3px 9px;border-radius:20px}
.price .c.up{background:rgba(31,122,90,.1)}
.price .c.down{background:rgba(181,64,47,.1)}
.up{color:var(--green)}.down{color:var(--red)}

/* ===== کارت‌ها و جدول ===== */
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:10px;flex-wrap:wrap}
.panel-head h2{font-size:16px;font-weight:700;margin:0}
.seg{display:inline-flex}
.seg button{font:inherit;font-size:13px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:6px 14px;cursor:pointer;transition:background .15s}
.seg button:hover{background:#F6F7F2}
.seg button:first-child{border-radius:0 10px 10px 0}.seg button:last-child{border-radius:10px 0 0 10px}
.seg button:not(:first-child){margin-right:-1px}
.seg button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.chart-wrap{height:320px}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:right;padding:13px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-weight:600;color:var(--muted);font-size:12.5px;background:#F8F9F5}
th:first-child{border-radius:0 10px 10px 0}th:last-child{border-radius:10px 0 0 10px}
tbody tr{transition:background .12s}
tbody tr:hover{background:#FAFBF7}
tbody tr:last-child td{border-bottom:0}
td.num{font-variant-numeric:tabular-nums}
.empty{padding:34px;text-align:center;color:var(--muted)}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:24px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.stat::before{content:"";position:absolute;top:0;right:0;width:4px;height:100%;background:linear-gradient(180deg,var(--gold-2),var(--gold))}
.stat .n{font-size:13px;color:var(--muted)}
.stat .v{font-size:25px;font-weight:800;margin-top:10px;font-variant-numeric:tabular-nums}

/* ===== دکمه‌ها و فرم‌ها ===== */
.btn{font:inherit;border:0;border-radius:10px;padding:10px 20px;cursor:pointer;background:var(--ink);color:#fff;transition:filter .15s,transform .1s}
.btn:hover{filter:brightness(1.12)}
.btn:active{transform:translateY(1px)}
.btn.gold{background:linear-gradient(135deg,#C99B3C,#AB7C24);color:#1A1405;font-weight:700;box-shadow:0 6px 14px -8px rgba(183,134,43,.8)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.sm{padding:6px 14px;font-size:13px}
.btn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.field label{font-size:13px;color:var(--muted)}
.field input,.field select,.toolbar input,.toolbar select,.plan-sel{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus,.toolbar input:focus,.toolbar select:focus,.plan-sel:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(183,134,43,.18)}
.plan-sel{padding:6px 10px;font-size:13px}
.check{display:flex;gap:9px;align-items:center;margin-bottom:12px;font-size:14px}
.check input{accent-color:var(--gold);width:16px;height:16px}
.preview{background:#F8F9F5;border:1px dashed #D3D8CC;border-radius:12px;padding:14px;margin-bottom:16px;font-size:14px;line-height:2}
.form-box{max-width:480px;margin:18px 0 24px}
.msg{font-size:13px;margin-top:10px;min-height:18px}
.msg.ok{color:var(--green)}
.msg.err{color:var(--red)}

/* ===== نوار قیمت (دیگر چسبان نیست و روی عنوان‌ها نمی‌افتد) ===== */
.ticker{display:flex;flex-wrap:wrap;gap:8px 10px;margin:0 0 22px;padding:0}
.ticker span{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#EAF0EC;font-size:13px;padding:8px 16px;border-radius:999px;box-shadow:0 8px 18px -12px rgba(20,33,29,.6)}
.ticker span::before{content:"";width:8px;height:8px;border-radius:50%;background:#3DD598;flex-shrink:0}
.ticker b{color:#EBC878;font-weight:800;font-variant-numeric:tabular-nums}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(61,213,152,0)}100%{box-shadow:0 0 0 0 rgba(61,213,152,0)}}

/* ===== هشدارهای ۲۴ ساعت اخیر ===== */
.alert-banner{display:none;background:var(--card);border:1px solid var(--line);border-right:4px solid var(--gold);border-radius:var(--radius);padding:14px 18px 6px;margin-bottom:22px;font-size:13.5px;line-height:1.9;max-height:210px;overflow-y:auto;box-shadow:var(--shadow)}
.alert-banner::before{content:"هشدارهای ۲۴ ساعت اخیر";display:block;font-size:12px;font-weight:700;color:var(--gold);margin-bottom:6px}
.alert-banner div{padding:9px 0;border-top:1px solid var(--line)}
.alert-banner div+div{margin-top:0}
.alert-banner .up{color:var(--green)}.alert-banner .down{color:var(--red)}

.set-pane{display:none;margin-top:18px}
.set-pane.active{display:block}
.mt{margin-top:20px}
/* ===== صفحه تاریخچه: تب‌های خرید/فروش/واریز/برداشت ===== */
.hist-pane{display:none;margin-top:18px}
.hist-pane.active{display:block;animation:fadeIn .2s ease}
.badge{display:inline-block;font-size:11px;padding:2px 9px;border-radius:20px;background:var(--gold);color:#1A1405;font-weight:700;margin-right:6px}
.pill{display:inline-block;font-size:12px;padding:3px 11px;border-radius:20px;background:#EEF1EA;border:1px solid var(--line)}
.pill.done{background:#E4F3EC;border-color:#A9D5BF;color:#14573F}
.pill.wait{background:#FFF4D6;border-color:#E8CF8A;color:#6B5208}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.toolbar input{flex:1;min-width:200px}
.hint{font-size:12px;color:var(--muted);margin-top:4px}


/* ===== صفحه ورود / ثبت‌نام ===== */
#loginScreen{display:none;position:fixed;inset:0;z-index:1000;background:radial-gradient(1100px 500px at 85% -10%,#E9DDBA 0%,transparent 60%),radial-gradient(900px 500px at 0% 110%,#CFE3D8 0%,transparent 60%),var(--paper);align-items:center;justify-content:center;padding:20px;overflow-y:auto}
.locked #loginScreen{display:flex}
.locked #sidebar,.locked #content{display:none}
.login-card{width:100%;max-width:420px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:34px 30px;box-shadow:0 30px 60px -30px rgba(16,32,26,.35)}
.login-card.hidden{display:none}
.login-brand{font-weight:800;font-size:23px;margin-bottom:16px}
.login-brand span{color:var(--gold)}
.login-card .btn{width:100%;padding:12px}
.login-card .msg{color:var(--red)}
.login-card .msg.info{color:var(--muted)}
.switch-line{margin-top:16px;text-align:center;font-size:13px;color:var(--muted)}
.link-btn{font:inherit;font-size:13px;background:none;border:0;padding:0;color:var(--gold);font-weight:700;cursor:pointer;text-decoration:underline}
.pw{position:relative;display:flex}
.pw input{flex:1;padding-left:62px}
.pw .eye{position:absolute;left:6px;top:50%;transform:translateY(-50%);font:inherit;font-size:12px;background:none;border:0;color:var(--muted);cursor:pointer;padding:4px 8px}
.side-user{margin-top:auto;padding:14px 12px 0;border-top:1px solid rgba(255,255,255,.1);font-size:13px}
.side-user .nm{color:#fff;margin-bottom:10px;word-break:break-word;font-weight:600}
.side-user .btn{width:100%;background:rgba(255,255,255,.08);padding:8px 10px}
.side-user .btn:hover{background:rgba(255,255,255,.16);filter:none}


/* ===== نحوه تحویل (کارت‌های انتخابی) ===== */
.methods{display:grid;gap:8px}
.opt,.field .opt{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"r t" "r f";column-gap:12px;row-gap:2px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:#fff;font-size:14px;color:var(--ink);transition:border-color .15s,background .15s}
.opt input{grid-area:r;accent-color:var(--gold);width:16px;height:16px;margin:0}
.opt .opt-t{grid-area:t;font-weight:600}
.opt .opt-f,.field .opt .opt-f{grid-area:f;font-size:12.5px;color:var(--muted)}
.opt:hover{border-color:#CFC29A}
.opt:has(input:checked){border-color:var(--gold);background:var(--gold-soft)}
.fee-line{display:flex;justify-content:space-between;gap:10px}
.fee-line.total{border-top:1px dashed #D3D8CC;margin-top:4px;padding-top:4px;font-weight:700}


/* ===== درگاه واقعی و QR دوگانه ===== */
.pay-amount{display:flex;justify-content:space-between;align-items:center;background:var(--gold-soft);border:1px solid #EBD592;border-radius:12px;padding:14px 16px;margin-bottom:18px}
.pay-amount span{font-size:13px;color:#6B5208}
.pay-amount b{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.pay-check.fail{background:#F8E3DF;color:var(--red)}
.qr-show-meta{font-size:15px;font-weight:700;margin-bottom:6px}
.qr-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
html[data-theme=dark] .pay-amount{background:#3A2F14;border-color:#6B5520}
html[data-theme=dark] .pay-amount span{color:#EBD592}
html[data-theme=dark] .pay-check.fail{background:#3B1D18}

/* ===== صفحه کد QR ===== */
.qr-panel{display:flex;gap:32px;align-items:flex-start;flex-wrap:wrap}
.qr-side{flex:1;min-width:260px;max-width:460px}
.qr-box{width:268px;min-height:268px;border:1px solid var(--line);border-radius:20px;display:flex;align-items:center;justify-content:center;background:#fff;padding:18px;margin-inline:auto;box-shadow:var(--shadow)}
.qr-box img,.qr-box canvas{max-width:100%;height:auto;display:block}
.qr-empty{color:var(--muted);font-size:13px;text-align:center;line-height:2}
.link-line{direction:ltr;text-align:left;word-break:break-all;font-size:12px;color:var(--muted);margin-bottom:10px}

/* ===== درگاه پرداخت آزمایشی ===== */
#payScreen{display:none;position:fixed;inset:0;z-index:2000;background:radial-gradient(1000px 500px at 80% -10%,#E9DDBA 0%,transparent 60%),radial-gradient(900px 500px at 0% 110%,#CFE3D8 0%,transparent 60%),var(--paper);align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto}
.paying #payScreen{display:flex}
.paying #loginScreen,.paying #sidebar,.paying #content{display:none!important}
.pay-wrap{width:100%;max-width:440px;margin:auto}
.pay-ribbon{background:#FFF1C9;border:1px solid #EBD592;color:#6B5208;border-radius:12px;padding:10px 14px;font-size:12.5px;line-height:1.9;margin-bottom:14px;text-align:center;font-weight:600}
.pay-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px 26px;box-shadow:0 30px 60px -30px rgba(16,32,26,.35)}
.pay-to{background:#F8F9F5;border-radius:12px;padding:12px 14px;margin-bottom:18px;font-size:14px}
.pay-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.pay-row>.field{min-width:0}
.pay-card .field input,.pay-card .field select{width:100%;min-width:0}
.pay-card .btn{width:100%;padding:12px}
.pay-card input[dir=ltr]{text-align:left}
.pay-done{text-align:center}
.pay-check{width:68px;height:68px;border-radius:50%;background:#E4F3EC;color:var(--green);display:flex;align-items:center;justify-content:center;margin:4px auto 16px;font-size:34px;font-weight:800}
.pay-done .preview{text-align:right}

/* ===== پرتفوی و خرید خودکار درصدی ===== */
.pos{color:var(--green)}.neg{color:var(--red)}
.rule-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.rule-row:last-child{border-bottom:0}
.rule-row .pct{display:flex;align-items:center;gap:6px}
.rule-row .pct input{width:84px;text-align:center}
.hint.neg{color:var(--red)}
.remember{margin:2px 0 14px}
.add-asset{display:flex;gap:8px;align-items:center;margin-top:10px}
.add-asset select{flex:1;min-width:0}
.rule-x{font:inherit;font-size:13px;background:none;border:0;color:var(--muted);cursor:pointer;padding:4px 8px;border-radius:8px}
.rule-x:hover{background:rgba(181,64,47,.1);color:var(--red)}

/* ===== کارت‌های بانکی، فروش و برداشت ===== */
.card-list{display:grid;gap:10px;margin-bottom:16px}
.bank-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff}
.bank-card .bc-main{min-width:0}
.bank-card .bc-bank{font-weight:700;font-size:14px}
.bank-card .bc-num{direction:ltr;text-align:right;font-variant-numeric:tabular-nums;letter-spacing:1px;color:var(--muted);font-size:13.5px;margin:3px 0}
.bank-card .bc-own{font-size:12.5px;color:var(--muted)}
.btn.danger{background:#fff;color:var(--red);border:1px solid #E7C3BC}
.btn.danger:hover{background:rgba(181,64,47,.08);filter:none}
.pill.rej{background:#FBE7E3;border-color:#E7B7AF;color:#8A2D20}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px;align-items:start}
.two-col .form-box{margin:0;max-width:none}
.sell-box{max-width:520px}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}
.inline-btn{display:flex;gap:8px}
.inline-btn input{flex:1;min-width:0}

/* ===== اسپرد، خرید دوره‌ای و سفارش قیمت هدف ===== */
.price .bs{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--muted);margin:0 0 9px;font-variant-numeric:tabular-nums}
.price .bs b{font-weight:700}
.price .bs .b b{color:var(--green)}.price .bs .s b{color:var(--red)}
.pill.off{background:#EEF1EA;color:#69726C}
.sub-note{font-size:12.5px;color:var(--muted);line-height:1.9}

/* ===== دکمه تغییر تم ===== */
.theme-fab{position:fixed;left:16px;bottom:16px;z-index:3000;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:18px;line-height:1;cursor:pointer;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;transition:transform .15s}
.theme-fab:hover{transform:scale(1.07)}
.theme-fab:focus-visible{outline:2px solid var(--gold-2);outline-offset:2px}

/* ===== حالت تاریک ===== */
html[data-theme=dark]{
  color-scheme:dark;
  --ink:#E6ECE8;--paper:#0F1714;--card:#17221E;--line:#2A3832;--muted:#93A099;
  --gold:#D4A74A;--gold-2:#E2B95C;--gold-soft:#3A2F14;--green:#3DD598;--red:#F0786A;
  --shadow:0 1px 2px rgba(0,0,0,.35),0 10px 28px -14px rgba(0,0,0,.65);
}
html[data-theme=dark] #sidebar{background:linear-gradient(180deg,#0C1613 0%,#070E0B 100%);border-left:1px solid #1B2823}
html[data-theme=dark] .seg button{background:var(--card);color:var(--ink)}
html[data-theme=dark] .seg button:hover{background:#1E2C27}
html[data-theme=dark] .seg button.on{background:var(--gold);color:#1A1405;border-color:var(--gold)}
html[data-theme=dark] th{background:#1B2723}
html[data-theme=dark] tbody tr:hover{background:#1B2723}
html[data-theme=dark] .btn{background:#2A3A34;color:#EAF0EC}
html[data-theme=dark] .btn.gold{background:linear-gradient(135deg,#C99B3C,#AB7C24);color:#1A1405}
html[data-theme=dark] .btn.ghost{background:var(--card);color:var(--ink);border:1px solid var(--line)}
html[data-theme=dark] .btn.danger{background:var(--card);color:var(--red);border:1px solid #5A2B24}
html[data-theme=dark] .btn.danger:hover{background:rgba(240,120,106,.12)}
html[data-theme=dark] .side-user .btn{background:rgba(255,255,255,.08)}
html[data-theme=dark] .field input,html[data-theme=dark] .field select,html[data-theme=dark] .toolbar input,html[data-theme=dark] .toolbar select,html[data-theme=dark] .plan-sel{background:#101A17;color:var(--ink)}
html[data-theme=dark] input::placeholder{color:#5F6D66}
html[data-theme=dark] .preview,html[data-theme=dark] .pay-to{background:#1B2723;border-color:#34443D}
html[data-theme=dark] .fee-line.total{border-top-color:#34443D}
html[data-theme=dark] .demo-note,html[data-theme=dark] .pay-ribbon{background:#3A2F14;border-color:#6B5520;color:#EBD592}
html[data-theme=dark] .pill{background:#22302B}
html[data-theme=dark] .pill.done{background:#14382B;border-color:#25624A;color:#7FE0B5}
html[data-theme=dark] .pill.wait{background:#3A2F14;border-color:#6B5520;color:#EBC878}
html[data-theme=dark] .pill.rej{background:#3E1E19;border-color:#7A3328;color:#F4A79B}
html[data-theme=dark] .pill.off{background:#22302B;color:#93A099}
html[data-theme=dark] .opt,html[data-theme=dark] .field .opt{background:var(--card);color:var(--ink)}
html[data-theme=dark] .opt:hover{border-color:#6B5520}
html[data-theme=dark] .opt:has(input:checked){background:var(--gold-soft);border-color:var(--gold)}
html[data-theme=dark] .bank-card,html[data-theme=dark] .pay-card{background:var(--card)}
html[data-theme=dark] .pay-check{background:#14382B}
html[data-theme=dark] .ticker span{background:#22302B}
html[data-theme=dark] #loginScreen,html[data-theme=dark] #payScreen{background:radial-gradient(1100px 500px at 85% -10%,#3A2F14 0%,transparent 60%),radial-gradient(900px 500px at 0% 110%,#12352A 0%,transparent 60%),var(--paper)}
html[data-theme=dark] .login-card{box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
html[data-theme=dark] .qr-box{background:#fff}
html[data-theme=dark] .rule-x:hover{background:rgba(240,120,106,.14)}
.rep-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.rep-tools input,.rep-tools select{font:inherit;font-size:13px;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}
.rep-tools label{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px}

/* ===== موبایل: نوار بالا + منوی کشویی ===== */
#mobileBar,#navOverlay{display:none}
@media(max-width:760px){
  html{-webkit-text-size-adjust:100%}
  body{display:block;height:auto;min-height:100%;overflow-x:hidden}
  #mobileBar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:900;height:54px;padding:0 14px;background:var(--side);color:#fff;box-shadow:0 6px 18px -10px rgba(0,0,0,.5)}
  #mobileBar .mb-brand{font-weight:800;font-size:19px}
  #mobileBar .mb-brand span{color:var(--gold-2)}
  #navToggle{font:inherit;font-size:22px;line-height:1;width:42px;height:42px;border-radius:11px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:#fff;cursor:pointer}
  .locked #mobileBar,.paying #mobileBar{display:none!important}
  #navOverlay{display:block;position:fixed;inset:0;z-index:2400;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .2s}
  body.nav-open #navOverlay{opacity:1;pointer-events:auto}
  #sidebar{position:fixed;top:0;bottom:0;right:0;width:min(290px,84vw);z-index:2500;overflow-y:auto;transform:translateX(100%);transition:transform .22s ease,box-shadow .22s;flex-direction:column;padding:22px 12px 18px;box-shadow:none}
  body.nav-open #sidebar{transform:none;box-shadow:-20px 0 40px -20px rgba(0,0,0,.6)}
  body.nav-open{overflow:hidden}
  #sidebar .brand{display:block}
  .menu-item{width:100%;padding:12px 14px;font-size:15px}
  .menu-item svg{display:block}
  .side-user{margin-top:auto;padding:14px 12px 0;border-top:1px solid rgba(255,255,255,.1);display:block}
  .side-user .nm{margin-bottom:10px}
  .side-user .btn{width:100%}
  #content{overflow:visible;padding:18px 14px 84px}
  h1{font-size:21px}
  .sub{margin-bottom:18px}
  .panel{padding:16px;border-radius:12px}
  .panel-head h2{font-size:15px}
  .two-col{grid-template-columns:minmax(0,1fr);gap:14px}
  .prices{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .price{padding:12px}
  .price .v{font-size:17px}
  .price .bs{flex-direction:column;gap:2px}
  .stat-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
  .stat{padding:15px}
  .stat .v{font-size:20px}
  .chart-wrap{height:250px}
  th,td{padding:10px 10px;font-size:13px}
  .table-wrap{-webkit-overflow-scrolling:touch}
  .seg{max-width:100%;overflow-x:auto;flex-wrap:nowrap}
  .seg button{white-space:nowrap;flex-shrink:0}
  .toolbar input,.toolbar select{min-width:0;flex:1 1 100%}
  .rep-tools{gap:8px}
  .rep-tools label{flex:1 1 140px}
  .rep-tools input[type=date]{flex:1;min-width:0}
  #page-transactions .tx-tools{padding:12px 0 14px}
  #page-transactions .tx-tools #txSearch{flex:1 1 100%;min-width:0}
  #page-transactions .tx-tools label{flex:1 1 140px}
  #page-transactions .tx-tools input[type=date]{flex:1;min-width:0}
  #page-transactions .tx-tools select{flex:1 1 140px}
  .tx-pager{padding:12px 0}
  .field input,.field select,.toolbar input,.toolbar select,.plan-sel,.rep-tools input,.rep-tools select,.tx-tools input,.tx-tools select,.pay-card input,.pay-card select,.rule-row .pct input{font-size:16px}
  .qr-panel{gap:20px}
  .qr-side{min-width:0;flex:1 1 100%}
  .qr-box{width:min(268px,100%)}
  .form-box{max-width:none}
  .btn-row .btn{flex:1 1 auto}
  .rule-row{flex-wrap:wrap}
  .ticker span{font-size:12px;padding:7px 12px}
  .alert-banner{padding:12px 14px 4px}
  .login-card{padding:26px 20px}
  .pay-card{padding:22px 18px}
  .theme-fab{left:12px;bottom:12px;width:40px;height:40px}
}

/* ===== خطای دریافت قیمت ===== */
.price-err{display:none;background:#FBE7E3;border:1px solid #E7B7AF;color:#8A2D20;padding:10px 14px;border-radius:12px;font-size:13px;margin-bottom:18px;line-height:1.9;font-weight:600}
html[data-theme=dark] .price-err{background:#3E1E19;border-color:#7A3328;color:#F4A79B}

/* ===== کیف پول: خلاصه دارایی و جدول ===== */
.s2{font-size:12.5px;color:var(--muted);margin-top:5px;font-variant-numeric:tabular-nums;min-height:1em}
.s2.up{color:var(--green)}.s2.down{color:var(--red)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:30px 0 12px}
.sec-head h2{font-size:18px;margin:0}
.wealth{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px 34px;background:linear-gradient(140deg,#15291F 0%,#0B1713 75%);color:#E8EEEA;border:1px solid #22362D;border-radius:18px;padding:28px 30px 24px;margin-bottom:18px;overflow:hidden;box-shadow:0 22px 44px -26px rgba(8,20,15,.75)}
.wealth::before{content:"";position:absolute;top:0;right:0;left:0;height:3px;background:linear-gradient(90deg,var(--gold-2),var(--gold),transparent 85%)}
.wealth-label{font-size:13px;color:#9FB0A7}
.wealth-total{display:flex;align-items:baseline;gap:9px;margin-top:8px;font-size:40px;font-weight:800;line-height:1.1;letter-spacing:-.5px;font-variant-numeric:tabular-nums;color:#fff}
.wealth-total small{font-size:15px;font-weight:600;color:var(--gold-2);letter-spacing:0}
.wealth-usd{margin-top:8px;font-size:15px;color:#C9D6CF;font-variant-numeric:tabular-nums;min-height:1.2em}
.wealth-split{display:flex;gap:22px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:#9FB0A7}
.wealth-split b{color:#fff;font-weight:700;margin-inline-start:7px;font-variant-numeric:tabular-nums}
.wealth-rates{display:flex;flex-direction:column;gap:8px;align-self:center}
.rate-chip{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.04);font-size:13px}
.rate-chip span{color:#9FB0A7}
.rate-chip b{color:#fff;font-variant-numeric:tabular-nums}
.rate-note{font-size:11.5px;color:#7F918A;padding:0 4px}
.alloc{grid-column:1/-1}
.alloc-bar{display:flex;gap:3px;height:12px;border-radius:7px;overflow:hidden;background:rgba(255,255,255,.07)}
.alloc-bar i{display:block;min-width:4px;border-radius:3px}
.alloc-legend{list-style:none;margin:13px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:12.5px;color:#B9C7C0}
.alloc-legend li{display:flex;align-items:center;gap:7px}
.alloc-legend li i{width:9px;height:9px;border-radius:3px;flex-shrink:0}
.alloc-legend b{color:#fff;font-variant-numeric:tabular-nums}
.wealth-actions{grid-column:1/-1;display:flex}
.cash-grid .stat .v{font-size:22px}
.assets-table td{vertical-align:middle}
.asset-cell{display:flex;align-items:center;gap:12px}
.asset-name{font-weight:700;line-height:1.4}
.asset-src{display:flex;gap:6px;margin-top:4px;flex-wrap:wrap}
.src-tag{font-size:11.5px;font-weight:600;padding:1px 9px;border-radius:20px;background:var(--gold-soft);color:#7A5A12}
.src-tag.man{background:rgba(31,122,90,.1);color:var(--green)}
.ag{width:36px;height:36px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:800;font-size:14px;color:#fff;background:#69726C}
.ag.sm{font-size:10.5px}
.ag-gold{background:linear-gradient(135deg,#CB9D3F,#A97A22);color:#1A1405}
.ag-coin{background:#8C6A1F}.ag-usd{background:#2F7D5B}.ag-eur{background:#3D6FA8}.ag-gbp{background:#7B5AA6}.ag-aed{background:#B5702F}.ag-try{background:#B5402F}
.unit{color:var(--muted);font-size:12px;margin-inline-start:5px}
.share{display:flex;align-items:center;gap:9px;min-width:96px;font-variant-numeric:tabular-nums;font-size:13px}
.share i{display:block;height:6px;border-radius:4px;background:linear-gradient(90deg,var(--gold),var(--gold-2));flex-shrink:0}
.assets-table td .s2{margin-top:2px;font-size:12px}
html[data-theme=dark] .src-tag{color:#EBC878}
html[data-theme=dark] .src-tag.man{background:rgba(61,213,152,.12)}
@media(max-width:760px){
  .wealth{grid-template-columns:1fr;padding:22px 18px 20px;gap:18px}
  .wealth-total{font-size:30px}
  .wealth-rates{align-self:stretch}
  .cash-grid{grid-template-columns:1fr}
}

/* ===== صفحه ورود: ستون عمودی، گرافیک شیک ===== */
#loginScreen{padding:24px 16px}
#loginScreen::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:linear-gradient(rgba(183,134,43,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(183,134,43,.07) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse at center,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse at center,#000 20%,transparent 75%)}
.login-card{position:relative;width:100%;max-width:410px;margin:auto;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:28px;background:var(--card);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 40px 80px -36px rgba(16,32,26,.45),0 12px 30px -18px rgba(16,32,26,.25)}
.lc-head{position:relative;padding:34px 28px 30px;text-align:center;color:#fff;overflow:hidden;background:radial-gradient(260px 160px at 85% 0%,rgba(212,167,74,.28),transparent 70%),linear-gradient(160deg,#16302A 0%,#0B1713 100%)}
.lc-head svg.deco{position:absolute;inset:0;width:100%;height:100%;opacity:.55;pointer-events:none}
.lc-mark{position:relative;width:62px;height:62px;margin:0 auto 14px;border-radius:19px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#E2B755,#A97A22);box-shadow:0 14px 26px -10px rgba(212,167,74,.75),inset 0 1px 0 rgba(255,255,255,.55)}
.lc-mark svg{width:32px;height:32px;stroke:#1A1405;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.lc-brand{position:relative;font-size:23px;font-weight:800;letter-spacing:-.2px}
.lc-brand span{color:var(--gold-2)}
.lc-head h1{position:relative;margin:14px 0 4px;font-size:17px;font-weight:700;color:#fff}
.lc-head .sub{position:relative;margin:0;font-size:12.5px;color:#A9BDB4}
.lc-body{padding:26px 26px 24px}
.login-card .field{margin-bottom:14px}
.login-card .field label{font-size:12.5px;font-weight:600;color:var(--muted)}
.fi{position:relative;display:flex}
.fi>svg{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:19px;height:19px;stroke:var(--muted);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;transition:stroke .15s}
.fi:focus-within>svg{stroke:var(--gold)}
.login-card .fi input{flex:1;width:100%;padding:13px 44px 13px 14px;border-radius:14px;border:1px solid var(--line);background:#F8F9F5;font-size:15px}
.login-card .fi input:focus{background:#fff}
.login-card .pw input{padding-left:66px}
.login-card .pw .eye{left:8px;font-size:12px;font-weight:600;color:var(--gold);padding:6px 10px;border-radius:9px}
.login-card .pw .eye:hover{background:var(--gold-soft)}
.login-card .check.remember{font-size:12.5px;color:var(--muted);margin:2px 0 16px}
.login-card .btn.gold,.login-card .btn{width:100%;padding:14px;border-radius:14px;font-size:15.5px;font-weight:700}
.login-card .btn.gold{background:linear-gradient(135deg,#D9AE50,#A97A22);color:#1A1405;box-shadow:0 14px 24px -12px rgba(183,134,43,.8),inset 0 1px 0 rgba(255,255,255,.45)}
.login-card .btn.gold:hover{filter:brightness(1.05);transform:translateY(-1px)}
.login-card .msg{text-align:center;min-height:20px}
.login-card .switch-line{margin-top:14px;padding-top:16px;border-top:1px solid var(--line)}
@media (max-width:520px){
  #loginScreen{padding:0;align-items:stretch}
  .login-card{max-width:none;border-radius:0;border:0;min-height:100%;margin:0;display:flex;flex-direction:column}
  .lc-body{flex:1}
}
.locked .theme-fab{display:none}
html[data-theme=dark] .login-card .fi input{background:#101A17}
html[data-theme=dark] .login-card .fi input:focus{background:#0B1411}
html[data-theme=dark] #loginScreen::before{opacity:.25}

/* ===== نسخهٔ کلاسیک و روشن‌تر ===== */
#loginScreen{background:radial-gradient(900px 520px at 90% -10%,#F1E1B4 0%,transparent 60%),radial-gradient(800px 520px at 0% 110%,#F4E9CF 0%,transparent 60%),#FAF6EC}
#loginScreen::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;left:-140px;top:-120px;background:radial-gradient(circle,rgba(212,167,74,.25),transparent 65%);filter:blur(10px);pointer-events:none;animation:orb 9s ease-in-out infinite alternate}
@keyframes orb{to{transform:translate(60px,50px) scale(1.15)}}
.login-card{border:1px solid rgba(183,134,43,.28);background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 6px rgba(255,255,255,.55),0 50px 90px -40px rgba(120,86,20,.45),0 14px 34px -18px rgba(120,86,20,.28);animation:cardIn .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes cardIn{from{opacity:0;transform:translateY(22px) scale(.98)}to{opacity:1;transform:none}}
.login-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:linear-gradient(135deg,rgba(226,183,85,.9),transparent 35%,transparent 65%,rgba(226,183,85,.8));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:3}
.lc-head{color:#2B2110;padding:38px 28px 32px;background:radial-gradient(280px 180px at 85% 0%,rgba(226,183,85,.38),transparent 70%),radial-gradient(240px 160px at 5% 100%,rgba(255,255,255,.9),transparent 70%),linear-gradient(165deg,#FBF1D6 0%,#F3E2B6 55%,#EBD49A 100%)}
.lc-head svg.deco{opacity:1}
.lc-head svg.deco *{stroke:#B7862B!important;stroke-opacity:.28!important}
.lc-head::after{content:"";position:absolute;left:50%;bottom:0;width:150px;height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#B7862B,transparent)}
.lc-mark{width:68px;height:68px;border-radius:50%;background:conic-gradient(from 210deg,#F3D585,#B7862B,#F8E3A0,#A97A22,#F3D585);box-shadow:0 16px 28px -12px rgba(150,105,20,.65),0 0 0 6px rgba(255,255,255,.55),0 0 0 7px rgba(183,134,43,.35);animation:float 4.5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-5px)}}
.lc-mark svg{stroke:#2B1D05}
.lc-brand{font-size:26px;letter-spacing:0;background:linear-gradient(90deg,#2B2110,#7A5A17 50%,#2B2110);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lc-brand span{-webkit-text-fill-color:transparent;background:linear-gradient(90deg,#B7862B,#E2B755);-webkit-background-clip:text;background-clip:text}
.lc-head h1{color:#3A2C12;font-size:16.5px}
.lc-head .sub{color:#7B6A45}
.login-card .fi input{background:#FFFDF8;border:1px solid #E8DEC4}
.login-card .fi input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(183,134,43,.15)}
.login-card .btn.gold{position:relative;overflow:hidden;background:linear-gradient(135deg,#E6BE62 0%,#B7862B 55%,#D9AE50 100%);letter-spacing:.2px}
.login-card .btn.gold::after{content:"";position:absolute;top:0;bottom:0;width:60px;left:-80px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:shine 4.5s ease-in-out infinite}
@keyframes shine{0%,55%{left:-80px}100%{left:120%}}
.login-card .switch-line{border-top:0;position:relative}
.login-card .switch-line::before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,#DCCB9C,transparent)}
.lc-trust{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:16px;font-size:11.5px;color:#8A7A55}
.lc-trust span{display:inline-flex;align-items:center;gap:5px}
.lc-trust svg{width:14px;height:14px;stroke:#B7862B;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lc-body .field,.lc-body .check,.lc-body .btn,.lc-body .switch-line{animation:rise .6s cubic-bezier(.2,.8,.2,1) both}
.lc-body>*:nth-child(1){animation-delay:.15s}.lc-body>*:nth-child(2){animation-delay:.22s}.lc-body>*:nth-child(3){animation-delay:.29s}.lc-body>*:nth-child(4){animation-delay:.36s}.lc-body>*:nth-child(5){animation-delay:.43s}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
html[data-theme=dark] #loginScreen{background:radial-gradient(900px 520px at 90% -10%,#3A2F14 0%,transparent 60%),radial-gradient(800px 520px at 0% 110%,#2A2113 0%,transparent 60%),#14110B}
html[data-theme=dark] .login-card{background:rgba(28,24,16,.9);box-shadow:0 0 0 6px rgba(255,255,255,.03),0 50px 90px -40px rgba(0,0,0,.8)}
html[data-theme=dark] .lc-head{color:#F4E7C4;background:radial-gradient(280px 180px at 85% 0%,rgba(226,183,85,.25),transparent 70%),linear-gradient(165deg,#3A2E18,#241C0E)}
html[data-theme=dark] .lc-head h1{color:#F4E7C4}
html[data-theme=dark] .lc-head .sub,html[data-theme=dark] .lc-trust{color:#B8A57A}
html[data-theme=dark] .lc-brand{background:linear-gradient(90deg,#F4E7C4,#E2B755,#F4E7C4);-webkit-background-clip:text;background-clip:text}
html[data-theme=dark] .login-card .fi input{background:#1B1710;border-color:#3A3220}
@media (prefers-reduced-motion:reduce){.login-card,.lc-body>*,.lc-mark,#loginScreen::after,.login-card .btn.gold::after{animation:none!important}}

/* ===== جان‌دارتر ===== */
.lc-head{padding:44px 28px 54px}
.lc-head svg.deco *{stroke-opacity:1!important}
.lc-head svg.deco .d-rings{stroke-opacity:.3!important;stroke-width:1}
.lc-head svg.deco .d-area,.lc-head svg.deco .d-dots *,.lc-head svg.deco .coin,.lc-head svg.deco .spk path{stroke:none!important}
.lc-head svg.deco .d-line{stroke:url(#dg1)!important;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.6s .3s cubic-bezier(.4,0,.2,1) forwards;filter:drop-shadow(0 3px 5px rgba(183,134,43,.45))}
@keyframes draw{to{stroke-dashoffset:0}}
.lc-head svg.deco .d-area{opacity:0;animation:fade 1.4s 1.6s forwards}
@keyframes fade{to{opacity:1}}
.lc-head svg.deco .pulse{transform-box:fill-box;transform-origin:center;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.9);opacity:0}}
.lc-head svg.deco .coin{transform-box:fill-box;transform-origin:center;animation:bob 5s ease-in-out infinite;filter:drop-shadow(0 4px 5px rgba(120,86,20,.4))}
.lc-head svg.deco .c2{animation-delay:-1.5s}.lc-head svg.deco .c3{animation-delay:-3s}.lc-head svg.deco .c4{animation-delay:-2.2s}
@keyframes bob{50%{transform:translateY(-9px) rotate(14deg)}}
.lc-head svg.deco .spk path{transform-box:fill-box;transform-origin:center;animation:twinkle 2.8s ease-in-out infinite}
.lc-head svg.deco .s2{animation-delay:-.9s}.lc-head svg.deco .s3{animation-delay:-1.6s}.lc-head svg.deco .s4{animation-delay:-2.2s}
@keyframes twinkle{0%,100%{opacity:.25;transform:scale(.6)}50%{opacity:1;transform:scale(1.2)}}
.lc-mark{width:76px;height:76px;box-shadow:0 18px 34px -10px rgba(150,105,20,.8),0 0 0 6px rgba(255,255,255,.65),0 0 0 7px rgba(183,134,43,.45),0 0 40px rgba(226,183,85,.55)}
.lc-mark svg{width:36px;height:36px}
.lc-brand{font-size:30px;text-shadow:none}
.lc-head h1{font-size:18px;font-weight:800}
.lc-body{padding:30px 26px 24px;margin-top:-22px;position:relative;border-radius:26px 26px 0 0;background:linear-gradient(180deg,#fff,#FFFDF8)}
.login-card .fi input{padding-top:14px;padding-bottom:14px;box-shadow:0 2px 6px -3px rgba(120,86,20,.18)}
.fi>svg{stroke:#B7862B}
.login-card .btn.gold{padding:16px;font-size:16.5px;box-shadow:0 18px 30px -12px rgba(183,134,43,.95),0 0 0 4px rgba(226,183,85,.18),inset 0 1px 0 rgba(255,255,255,.6)}
.login-card .btn.gold:hover{box-shadow:0 22px 36px -12px rgba(183,134,43,1),0 0 0 6px rgba(226,183,85,.25),inset 0 1px 0 rgba(255,255,255,.6)}
.login-card{box-shadow:0 0 0 6px rgba(255,255,255,.6),0 60px 100px -40px rgba(150,105,20,.6),0 0 90px -20px rgba(226,183,85,.5)}
.lc-trust span{padding:5px 11px;border:1px solid #EBDDB5;border-radius:20px;background:#FFF9E8}
html[data-theme=dark] .lc-body{background:linear-gradient(180deg,#221D13,#1C1810)}
html[data-theme=dark] .lc-head svg.deco .d-rings{stroke-opacity:.35!important}
html[data-theme=dark] .lc-trust span{background:#2A2314;border-color:#4A3E22}
@media (prefers-reduced-motion:reduce){.lc-head svg.deco *{animation:none!important}.lc-head svg.deco .d-line{stroke-dashoffset:0}.lc-head svg.deco .d-area{opacity:1}}
.registerform-fix{}
#registerForm .lc-head svg.deco .d-line{stroke:url(#dg1b)!important}

/* ===== پولیش ظاهری «کیف من» ===== */
:root{--paper:#F4F2EB;--shadow:0 1px 2px rgba(16,32,26,.04),0 14px 34px -18px rgba(16,32,26,.2)}
body{background:radial-gradient(1200px 500px at 85% -10%,rgba(212,167,74,.12),transparent 60%),var(--paper)}
.brand,.mb-brand,.lc-brand,.login-brand{display:flex;align-items:center;gap:10px}
.brand::before,.mb-brand::before,.lc-brand::before,.login-brand::before{content:"";width:34px;height:34px;flex-shrink:0;border-radius:11px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1405' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7.5A2.5 2.5 0 0 1 6.5 5H18v3'/%3E%3Cpath d='M4 7.5V17a2 2 0 0 0 2 2h12.5a1.5 1.5 0 0 0 1.5-1.5v-8A1.5 1.5 0 0 0 18.5 8H6.5A2.5 2.5 0 0 1 4 7.5Z'/%3E%3Ccircle cx='16' cy='13.5' r='1' fill='%231A1405'/%3E%3C/svg%3E") center/20px no-repeat,linear-gradient(135deg,#E3BC5F,#B7862B);box-shadow:0 8px 18px -8px rgba(183,134,43,.8)}
.brand span,.mb-brand span,.lc-brand span,.login-brand span{margin-right:-6px}
#sidebar{box-shadow:-10px 0 40px -20px rgba(0,0,0,.5)}
.menu-item{border-radius:12px;position:relative}
.menu-item.active::after{content:"";position:absolute;left:10px;width:6px;height:6px;border-radius:50%;background:#1A1405;opacity:.55}
h1{font-size:26px;letter-spacing:-.4px}
.panel,.stat,.price,.login-card{border-radius:18px;border-color:rgba(16,32,26,.07)}
.panel{padding:24px}
.stat{background:linear-gradient(180deg,#fff,#FCFBF7)}
.stat .v{font-size:27px}
.price{transition:transform .2s,box-shadow .2s}
.price:hover{transform:translateY(-3px)}
.btn{border-radius:12px;font-weight:600;letter-spacing:.1px;box-shadow:0 6px 16px -10px rgba(16,32,26,.5)}
.btn:hover{transform:translateY(-1px)}
input:focus,select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(183,134,43,.16)}
th{background:#F6F4EC;font-size:12px;letter-spacing:.2px}
tbody tr:hover{background:#FBF8EE}
.login-card{box-shadow:0 40px 80px -36px rgba(16,32,26,.45);padding:38px 32px}
::selection{background:var(--gold-soft)}
/* حالت تاریک */
:root[data-theme=dark] body{background:radial-gradient(1200px 500px at 85% -10%,rgba(212,167,74,.09),transparent 60%),var(--paper)}
:root[data-theme=dark] .stat{background:var(--card)}
:root[data-theme=dark] th{background:rgba(255,255,255,.04)}
:root[data-theme=dark] tbody tr:hover{background:rgba(255,255,255,.03)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== پاس نهایی UI: فاصله‌ها، فرم‌ها، موبایل، دسترس‌پذیری ===== */
.lc-brand::before{display:none}
.lc-brand,.login-brand{justify-content:center}
.sub{max-width:68ch;margin-bottom:26px}
.panel,.stat-grid,.prices{margin-bottom:20px}
.panel:last-child{margin-bottom:0}
.panel-head h2{font-size:16.5px}
.field{display:block;margin-bottom:14px}
.field label,label.lbl{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:7px}
.field input,.field select,.field textarea{width:100%}
input,select,textarea,.plan-sel{min-height:44px;font-size:14.5px}
select{appearance:none;-webkit-appearance:none;min-width:132px;padding-left:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2369726C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat left 13px center}
input[type=date]{min-width:150px}
input::placeholder{color:#A3AAA4}
.seg button{padding:8px 16px;font-weight:600}
.seg button.on{background:linear-gradient(135deg,#1B2F28,#0E1B17);box-shadow:0 6px 14px -8px rgba(14,27,23,.8)}
.btn.ghost,.btn.secondary{box-shadow:none}
.table-wrap{border-radius:14px}
td,th{padding:14px 16px}
.empty{margin:6px 0;border:1.5px dashed var(--line);border-radius:14px;background:rgba(183,134,43,.04);padding:38px 20px;line-height:2}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:10px}
button,.menu-item,.seg button{-webkit-tap-highlight-color:transparent}
#content{scrollbar-width:thin;scrollbar-color:#CFC7B0 transparent}
@media(max-width:760px){
  #content{padding:20px 16px 96px}
  h1{font-size:23px}
  .panel{padding:18px;border-radius:16px}
  .panel-head{align-items:flex-start}
  .seg{max-width:100%;overflow-x:auto}
  .btn,.menu-item{min-height:46px}
  select,input[type=date]{width:100%}
  .stat-grid{grid-template-columns:1fr 1fr;gap:12px}
  .stat .v{font-size:21px}
}
:root[data-theme=dark] select{background-color:var(--card)}
:root[data-theme=dark] .empty{background:rgba(212,167,74,.05);border-color:rgba(255,255,255,.1)}
:root[data-theme=dark] .seg button.on{background:var(--gold);color:#1A1405;border-color:var(--gold)}

.form-box{max-width:560px}
td.empty{border:0;border-radius:0;background:none;padding:34px 16px}
.hint:empty{display:none}

/* ════════════════════════════════════════════════════════════════════
   🎨 PRO UI/UX OVERHAUL — v2.0 "Refined Premium Fintech"
   طراحی حرفه‌ای، دقیق و بی‌نقص — الهام‌گرفته از Revolut / Wise / Stripe
   ════════════════════════════════════════════════════════════════════ */

:root{
  /* ─── ریفاین شده پالت رنگ ─── */
  --ink:#0F1C18;
  --ink-2:#1A2B25;
  --paper:#F5F4ED;
  --paper-2:#EEEEE5;
  --card:#FFFFFF;
  --card-2:#FBFBF6;
  --line:#E4E7DD;
  --line-2:#D8DCCD;
  --muted:#6A746E;
  --muted-2:#8B938D;

  --gold:#B7862B;
  --gold-2:#D4A74A;
  --gold-3:#EBC878;
  --gold-soft:#F7EDD6;
  --gold-deep:#8C6520;

  --green:#1F7A5A;
  --green-2:#2DA177;
  --green-soft:#E4F3EC;
  --red:#B5402F;
  --red-2:#D55A48;
  --red-soft:#FBE7E3;
  --blue:#2F6FA8;
  --purple:#7B5AA6;

  /* ─── توکن‌های اسپیسینگ (grid 4px) ─── */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-7:32px; --s-8:40px; --s-9:48px; --s-10:64px;

  /* ─── رادیوس ─── */
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:22px; --r-2xl:28px; --r-pill:999px;

  /* ─── سیستم سایه چندلایه ─── */
  --sh-xs:0 1px 2px rgba(16,32,26,.05);
  --sh-sm:0 1px 2px rgba(16,32,26,.04),0 4px 12px -4px rgba(16,32,26,.08);
  --sh-md:0 2px 4px rgba(16,32,26,.04),0 12px 28px -10px rgba(16,32,26,.16);
  --sh-lg:0 4px 8px rgba(16,32,26,.06),0 24px 48px -16px rgba(16,32,26,.22);
  --sh-xl:0 8px 16px rgba(16,32,26,.08),0 40px 80px -24px rgba(16,32,26,.32);
  --sh-gold:0 8px 24px -8px rgba(183,134,43,.5);
  --sh-inset:inset 0 1px 0 rgba(255,255,255,.6);

  /* ─── انیمیشن ─── */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --ease-smooth:cubic-bezier(.4,0,.2,1);
  --t-fast:.15s; --t-base:.25s; --t-slow:.4s;

  /* ─── z-index ─── */
  --z-toast:9000; --z-modal:8000; --z-dropdown:7000; --z-header:6000; --z-fab:5000; --z-sidebar:4000;
}

/* ─── حالت تاریک ریفاین‌شده ─── */
html[data-theme=dark]{
  --ink:#E8EEE9;
  --ink-2:#C9D2CB;
  --paper:#0D1411;
  --paper-2:#0A100D;
  --card:#16201C;
  --card-2:#1B2722;
  --line:#2A3832;
  --line-2:#3A4942;
  --muted:#93A099;
  --muted-2:#6B7872;
  --gold:#D4A74A;
  --gold-2:#E2B95C;
  --gold-3:#F0D088;
  --gold-soft:#3A2F14;
  --gold-deep:#EBC878;
  --green:#3DD598;
  --green-2:#5FE5B0;
  --green-soft:#14382B;
  --red:#F0786A;
  --red-2:#F49286;
  --red-soft:#3E1E19;
  --sh-xs:0 1px 2px rgba(0,0,0,.4);
  --sh-sm:0 1px 2px rgba(0,0,0,.35),0 4px 12px -4px rgba(0,0,0,.5);
  --sh-md:0 2px 4px rgba(0,0,0,.4),0 12px 28px -10px rgba(0,0,0,.65);
  --sh-lg:0 4px 8px rgba(0,0,0,.4),0 24px 48px -16px rgba(0,0,0,.8);
  --sh-xl:0 8px 16px rgba(0,0,0,.4),0 40px 80px -24px rgba(0,0,0,.9);
  --sh-gold:0 8px 24px -8px rgba(212,167,74,.4);
  --sh-inset:inset 0 1px 0 rgba(255,255,255,.04);
}

/* ═══════ 1. بدنه و پس‌زمینه ═══════ */
body{
  background:
    radial-gradient(1400px 600px at 90% -10%, rgba(212,167,74,.10), transparent 55%),
    radial-gradient(1100px 500px at 0% 110%, rgba(31,122,90,.06), transparent 55%),
    var(--paper);
  background-attachment:fixed;
  font-feature-settings:"ss01","cv01";
  letter-spacing:-.005em;
}
html[data-theme=dark] body{
  background:
    radial-gradient(1400px 600px at 90% -10%, rgba(212,167,74,.08), transparent 55%),
    radial-gradient(1100px 500px at 0% 110%, rgba(61,213,152,.04), transparent 55%),
    var(--paper);
}

/* ═══════ 2. سایدبار — کاملاً بازطراحی‌شده ═══════ */
#sidebar{
  background:
    linear-gradient(180deg, rgba(212,167,74,.04) 0%, transparent 30%),
    linear-gradient(180deg, #12231D 0%, #0A1612 100%);
  border-left:1px solid rgba(255,255,255,.04);
  box-shadow:-20px 0 60px -30px rgba(0,0,0,.5);
  padding:24px 14px 16px !important;
}
html[data-theme=dark] #sidebar{
  background:
    linear-gradient(180deg, rgba(212,167,74,.05) 0%, transparent 30%),
    linear-gradient(180deg, #0C1613 0%, #050A08 100%);
}
#sidebar .brand{
  padding:4px 12px 22px !important;
  font-size:22px !important;
  letter-spacing:-.3px;
  position:relative;
}
#sidebar .brand::after{
  content:""; position:absolute; bottom:14px; right:12px; left:12px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(212,167,74,.25), transparent);
}

/* منو آیتم‌ها — حالت فعال با نوار کناری و درخشش */
.menu-item{
  position:relative;
  margin:2px 0;
  padding:11px 14px !important;
  font-size:14px !important;
  font-weight:500;
  border-radius:12px !important;
  overflow:hidden;
  transition:all var(--t-base) var(--ease-out);
}
.menu-item::before{
  content:""; position:absolute; right:0; top:50%; transform:translateY(-50%) scaleY(0);
  width:3px; height:60%; background:linear-gradient(180deg, var(--gold-2), var(--gold));
  border-radius:3px 0 0 3px;
  transition:transform var(--t-base) var(--ease-spring);
}
.menu-item:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
  transform:translateX(-2px);
}
.menu-item:hover svg{
  opacity:1;
  transform:scale(1.08);
}
.menu-item svg{
  transition:all var(--t-base) var(--ease-out);
}
.menu-item.active{
  background:linear-gradient(135deg, rgba(212,167,74,.18), rgba(183,134,43,.10)) !important;
  color:#fff !important;
  font-weight:700 !important;
  box-shadow:inset 0 0 0 1px rgba(212,167,74,.35), 0 8px 20px -8px rgba(183,134,43,.4);
}
.menu-item.active::before{ transform:translateY(-50%) scaleY(1); }
.menu-item.active svg{
  color:var(--gold-3);
  opacity:1;
  filter:drop-shadow(0 0 6px rgba(212,167,74,.5));
}
.menu-item.active::after{ display:none; } /* حذف نقطه قدیمی */

/* پروفایل کاربر در پایین سایدبار */
.side-user{
  margin-top:auto;
  padding:14px 12px 4px !important;
  border-top:1px solid rgba(255,255,255,.07) !important;
  border-radius:14px;
  background:rgba(255,255,255,.02);
}
.side-user .nm{
  display:flex; align-items:center; gap:10px;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  margin-bottom:10px !important;
}
.side-user .nm::before{
  content:""; width:32px; height:32px; flex-shrink:0;
  border-radius:50%;
  background:linear-gradient(135deg, var(--gold-2), var(--gold-deep));
  display:inline-block;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231A1405'%3E%3Cpath d='M12 12c2.8 0 5-2.2 5-5s-2.2-5-5-5-5 2.2-5 5 2.2 5 5 5zm0 2c-3.3 0-10 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5z'/%3E%3C/svg%3E");
  background-size:18px; background-repeat:no-repeat; background-position:center;
}
.side-user .nm > span:first-child{
  flex:1; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-weight:600 !important;
  color:#fff !important;
  font-size:13px !important;
}
.side-user .btn{
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.08);
  font-weight:600;
  font-size:13px;
  transition:all var(--t-base);
}
.side-user .btn:hover{
  background:rgba(181,64,47,.18) !important;
  border-color:rgba(181,64,47,.3);
  color:#F49286 !important;
}

/* ═══════ 3. محتوا و هدر صفحه ═══════ */
#content{
  padding:32px 40px 60px !important;
  scroll-behavior:smooth;
}
#content::before{
  content:""; display:block; height:0;
}
.page{
  animation:pageIn .45s var(--ease-out) !important;
}
@keyframes pageIn{
  from{ opacity:0; transform:translateY(12px) scale(.99); }
  to{ opacity:1; transform:none; }
}
h1{
  font-size:28px !important;
  font-weight:800 !important;
  letter-spacing:-.6px !important;
  background:linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  margin-bottom:8px !important;
}
html[data-theme=dark] h1{
  background:linear-gradient(135deg, #F0F5F1 0%, #C9D2CB 100%);
  -webkit-background-clip:text; background-clip:text;
}
.sub{
  font-size:14px !important;
  color:var(--muted) !important;
  line-height:1.85 !important;
  max-width:72ch;
  margin-bottom:28px !important;
}

/* ═══════ 4. کارت‌های آماری — با اسپارک‌لاین و درخشش ═══════ */
.stat{
  position:relative;
  padding:22px !important;
  border-radius:var(--r-lg) !important;
  background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%) !important;
  border:1px solid var(--line) !important;
  box-shadow:var(--sh-sm) !important;
  overflow:hidden;
  transition:all var(--t-base) var(--ease-out);
}
.stat::before{
  content:""; position:absolute; top:0; right:0; width:4px; height:100%;
  background:linear-gradient(180deg, var(--gold-2), var(--gold));
  border-radius:0 0 0 4px;
}
.stat::after{
  content:""; position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background:radial-gradient(circle at center, rgba(212,167,74,.08) 0%, transparent 40%);
  opacity:0; transition:opacity var(--t-slow);
  pointer-events:none;
}
.stat:hover{
  transform:translateY(-3px);
  box-shadow:var(--sh-md) !important;
  border-color:var(--line-2) !important;
}
.stat:hover::after{ opacity:1; }
.stat .n{
  font-size:12.5px !important;
  font-weight:600;
  letter-spacing:.2px;
  text-transform:uppercase;
  opacity:.8;
}
.stat .v{
  font-size:26px !important;
  font-weight:800 !important;
  margin-top:10px !important;
  letter-spacing:-.5px;
  font-variant-numeric:tabular-nums;
}

/* ═══════ 5. کارت‌های قیمت — با افکت hover پیشرفته ═══════ */
.prices{
  gap:16px !important;
}
.price{
  padding:18px 20px !important;
  border-radius:var(--r-lg) !important;
  background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%) !important;
  border:1px solid var(--line) !important;
  box-shadow:var(--sh-sm) !important;
  position:relative;
  overflow:hidden;
  transition:all var(--t-base) var(--ease-out);
}
.price::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--gold-2), transparent);
  transform:scaleX(0); transform-origin:center;
  transition:transform var(--t-slow) var(--ease-out);
}
.price:hover{
  transform:translateY(-4px);
  box-shadow:var(--sh-lg) !important;
  border-color:rgba(212,167,74,.3) !important;
}
.price:hover::before{ transform:scaleX(1); }
.price .v{
  font-size:22px !important;
  background:linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
html[data-theme=dark] .price .v{
  background:linear-gradient(135deg, #F0F5F1, #C9D2CB);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.price .c.up, .price .c.down{
  padding:4px 10px !important;
  font-weight:700 !important;
  font-size:12px !important;
  position:relative;
  overflow:hidden;
}
.price .c.up::before, .price .c.down::before{
  content:""; position:absolute; inset:0; opacity:.15;
  background:currentColor;
}

/* ═══════ 6. پنل‌ها — با هدر چسبان و دکمه‌های زیباتر ═══════ */
.panel{
  padding:24px !important;
  border-radius:var(--r-lg) !important;
  background:var(--card) !important;
  border:1px solid var(--line) !important;
  box-shadow:var(--sh-sm) !important;
  position:relative;
  transition:box-shadow var(--t-base);
}
.panel:hover{ box-shadow:var(--sh-md) !important; }
.panel-head{
  margin-bottom:20px !important;
  padding-bottom:16px;
  border-bottom:1px solid var(--line);
  position:relative;
}
.panel-head::after{
  content:""; position:absolute; bottom:-1px; right:0; width:40px; height:2px;
  background:linear-gradient(90deg, var(--gold-2), transparent);
  border-radius:2px;
}
.panel-head h2{
  font-size:16.5px !important;
  font-weight:700 !important;
  letter-spacing:-.2px;
  display:flex; align-items:center; gap:8px;
}
.panel-head h2::before{
  content:""; width:4px; height:18px;
  background:linear-gradient(180deg, var(--gold-2), var(--gold));
  border-radius:2px;
}

/* ═══════ 7. دکمه‌ها — با ریپل و گرادیانت ═══════ */
.btn{
  position:relative;
  overflow:hidden;
  font-weight:600 !important;
  letter-spacing:.1px;
  border-radius:var(--r-md) !important;
  transition:all var(--t-base) var(--ease-out) !important;
  box-shadow:var(--sh-xs) !important;
  isolation:isolate;
}
.btn::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.15), transparent);
  opacity:0; transition:opacity var(--t-base);
  z-index:-1;
}
.btn:hover{
  transform:translateY(-1px);
  box-shadow:var(--sh-sm) !important;
}
.btn:hover::before{ opacity:1; }
.btn:active{
  transform:translateY(0);
  box-shadow:var(--sh-xs) !important;
}
.btn.gold{
  background:linear-gradient(135deg, #E2B95C 0%, #B7862B 50%, #D4A74A 100%) !important;
  color:#1A1405 !important;
  box-shadow:var(--sh-gold), var(--sh-inset) !important;
  font-weight:700 !important;
}
.btn.gold::after{
  content:""; position:absolute; top:0; bottom:0; width:60px; left:-80px;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.4), transparent);
  transform:skewX(-20deg);
  transition:left .6s var(--ease-out);
}
.btn.gold:hover::after{ left:120%; }
.btn.gold:hover{
  box-shadow:0 12px 28px -8px rgba(183,134,43,.7), var(--sh-inset) !important;
  filter:brightness(1.05);
}
.btn.ghost{
  background:var(--card) !important;
  border:1px solid var(--line) !important;
}
.btn.ghost:hover{
  background:var(--card-2) !important;
  border-color:var(--gold) !important;
  color:var(--gold-deep) !important;
}
html[data-theme=dark] .btn.ghost:hover{ color:var(--gold-3) !important; }
.btn.danger{
  background:var(--card) !important;
  border:1px solid #E7C3BC !important;
  color:var(--red) !important;
}
.btn.danger:hover{
  background:var(--red-soft) !important;
  border-color:var(--red) !important;
}

/* افکت ریپل */
.btn .ripple{
  position:absolute; border-radius:50%;
  background:rgba(255,255,255,.4);
  transform:scale(0); animation:ripple .6s var(--ease-out);
  pointer-events:none;
}
@keyframes ripple{ to{ transform:scale(4); opacity:0; } }

/* ═══════ 8. جداول — مدرن با هدر چسبان ═══════ */
.table-wrap{
  border-radius:var(--r-md);
  overflow:hidden;
  border:1px solid var(--line);
}
table{
  font-size:13.5px !important;
}
th{
  background:linear-gradient(180deg, var(--card-2), var(--card)) !important;
  font-weight:700 !important;
  font-size:11.5px !important;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:var(--muted) !important;
  padding:14px 16px !important;
  position:sticky; top:0;
  border-bottom:2px solid var(--line-2) !important;
  white-space:nowrap;
}
th:first-child{ border-radius:0 10px 0 0 !important; }
th:last-child{ border-radius:10px 0 0 0 !important; }
td{
  padding:14px 16px !important;
  border-bottom:1px solid var(--line) !important;
  transition:background var(--t-fast);
}
tbody tr{
  transition:all var(--t-fast);
  position:relative;
}
tbody tr:hover{
  background:linear-gradient(90deg, transparent, rgba(212,167,74,.06), transparent) !important;
}
tbody tr:hover td{
  color:var(--ink);
}
tbody tr:last-child td{ border-bottom:0 !important; }
td.num{
  font-variant-numeric:tabular-nums;
  font-weight:500;
}

/* ═══════ 9. فرم‌ها — با focus حرفه‌ای ═══════ */
.field input, .field select, .toolbar input, .toolbar select, .plan-sel,
.rep-tools input, .rep-tools select, .tx-tools input, .tx-tools select{
  border-radius:var(--r-md) !important;
  border:1.5px solid var(--line) !important;
  background:var(--card) !important;
  transition:all var(--t-base) var(--ease-out) !important;
  font-size:14.5px !important;
  font-weight:500;
}
.field input:hover, .field select:hover{
  border-color:var(--line-2) !important;
}
.field input:focus, .field select:focus,
.toolbar input:focus, .toolbar select:focus,
.rep-tools input:focus, .rep-tools select:focus{
  outline:none !important;
  border-color:var(--gold) !important;
  box-shadow:0 0 0 4px rgba(183,134,43,.14), var(--sh-xs) !important;
  background:var(--card) !important;
}
.field label, label.lbl{
  font-weight:600 !important;
  font-size:12.5px !important;
  letter-spacing:.2px;
  color:var(--ink-2) !important;
  text-transform:uppercase;
  margin-bottom:8px !important;
}
.field label::after, label.lbl::after{
  content:attr(data-req);
  color:var(--red);
  margin-right:4px;
  font-weight:700;
}

/* ═══════ 10. Segmented Control — مدرن‌تر ═══════ */
.seg{
  background:var(--card-2);
  padding:3px;
  border-radius:var(--r-md);
  border:1px solid var(--line);
}
.seg button{
  border:0 !important;
  background:transparent !important;
  color:var(--muted) !important;
  padding:7px 14px !important;
  border-radius:9px !important;
  font-weight:600 !important;
  font-size:12.5px !important;
  transition:all var(--t-base) var(--ease-out) !important;
  position:relative;
}
.seg button:hover{
  color:var(--ink) !important;
  background:rgba(212,167,74,.08) !important;
}
.seg button.on{
  background:linear-gradient(135deg, #1B2F28, #0E1B17) !important;
  color:#fff !important;
  box-shadow:0 4px 12px -4px rgba(14,27,23,.5) !important;
}
html[data-theme=dark] .seg button.on{
  background:linear-gradient(135deg, var(--gold-2), var(--gold)) !important;
  color:#1A1405 !important;
  box-shadow:0 4px 12px -4px rgba(212,167,74,.4) !important;
}

/* ═══════ 11. نوار قیمت ticker — انیمیشن بهتر ═══════ */
.ticker{
  gap:10px 12px !important;
  margin-bottom:24px !important;
}
.ticker span{
  background:linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 100%) !important;
  color:#EAF0EC !important;
  padding:9px 18px !important;
  border-radius:var(--r-pill) !important;
  box-shadow:var(--sh-sm) !important;
  border:1px solid rgba(255,255,255,.05);
  font-size:13px !important;
  font-weight:500;
  transition:transform var(--t-base);
  animation:slideInLeft .5s var(--ease-out) both;
}
.ticker span:hover{
  transform:translateY(-2px);
  box-shadow:var(--sh-md) !important;
}
@keyframes slideInLeft{
  from{ opacity:0; transform:translateX(20px); }
  to{ opacity:1; transform:none; }
}
.ticker span::before{
  background:#3DD598 !important;
  box-shadow:0 0 0 0 rgba(61,213,152,.6) !important;
}
html[data-theme=dark] .ticker span{
  background:linear-gradient(135deg, #1F2E28, #182520) !important;
  border-color:rgba(255,255,255,.06);
}

/* ═══════ 12. Pill ها — با آیکن ═══════ */
.pill{
  font-weight:700 !important;
  padding:4px 11px !important;
  font-size:11.5px !important;
  border-radius:var(--r-pill) !important;
  letter-spacing:.2px;
  display:inline-flex; align-items:center; gap:5px;
}
.pill::before{
  content:""; width:6px; height:6px; border-radius:50%;
  background:currentColor;
}
.pill.done{ background:var(--green-soft) !important; color:var(--green) !important; border-color:transparent !important; }
.pill.wait{ background:#FFF4D6 !important; color:#8A6A12 !important; border-color:transparent !important; }
.pill.rej{ background:var(--red-soft) !important; color:var(--red) !important; border-color:transparent !important; }
.pill.off{ background:var(--paper-2) !important; color:var(--muted) !important; border-color:transparent !important; }
html[data-theme=dark] .pill.wait{ background:#3A2F14 !important; color:var(--gold-3) !important; }

/* ═══════ 13. اسکلت بار (Skeleton) — برای لودینگ ═══════ */
.skeleton{
  background:linear-gradient(90deg,
    var(--paper-2) 0%,
    var(--line) 50%,
    var(--paper-2) 100%);
  background-size:200% 100%;
  animation:shimmer 1.6s infinite linear;
  border-radius:var(--r-md);
  display:inline-block;
}
@keyframes shimmer{
  0%{ background-position:200% 0; }
  100%{ background-position:-200% 0; }
}
.skeleton-line{ height:14px; margin-bottom:8px; }
.skeleton-line.short{ width:60%; }
.skeleton-line.medium{ width:80%; }
.skeleton-block{ height:80px; }

/* ═══════ 14. Toast Notifications ═══════ */
#toastContainer{
  position:fixed;
  top:24px; left:50%;
  transform:translateX(-50%);
  z-index:var(--z-toast);
  display:flex; flex-direction:column; gap:10px;
  pointer-events:none;
  max-width:calc(100vw - 32px);
}
.toast{
  pointer-events:auto;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  padding:14px 18px 14px 16px;
  box-shadow:var(--sh-lg);
  display:flex; align-items:flex-start; gap:12px;
  font-size:13.5px; font-weight:500;
  min-width:280px; max-width:420px;
  position:relative;
  overflow:hidden;
  animation:toastIn .4s var(--ease-spring) both;
  border-right:4px solid var(--gold);
}
.toast.success{ border-right-color:var(--green); }
.toast.error{ border-right-color:var(--red); }
.toast.info{ border-right-color:var(--blue); }
.toast::after{
  content:""; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:currentColor; opacity:.4;
  transform-origin:left;
  animation:toastBar 4s linear forwards;
}
.toast.success::after{ background:var(--green); }
.toast.error::after{ background:var(--red); }
.toast.info::after{ background:var(--gold); }
.toast.out{ animation:toastOut .3s var(--ease-in-out) forwards; }
@keyframes toastIn{
  from{ opacity:0; transform:translateY(-30px) scale(.95); }
  to{ opacity:1; transform:none; }
}
@keyframes toastOut{
  to{ opacity:0; transform:translateY(-20px) scale(.95); }
}
@keyframes toastBar{
  from{ transform:scaleX(1); }
  to{ transform:scaleX(0); }
}
.toast-icon{
  width:24px; height:24px; flex-shrink:0;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:800;
  color:#fff;
}
.toast.success .toast-icon{ background:var(--green); }
.toast.error .toast-icon{ background:var(--red); }
.toast.info .toast-icon{ background:var(--gold); }
.toast-body{ flex:1; line-height:1.6; }
.toast-title{ font-weight:700; margin-bottom:2px; }
.toast-close{
  background:none; border:0; color:var(--muted);
  cursor:pointer; font-size:18px; padding:0 4px;
  line-height:1;
}
.toast-close:hover{ color:var(--ink); }

/* ═══════ 15. Top Progress Bar — حذف شد (آزاردهنده بود) ═══════ */
/* (قبلاً نوار بالای صفحه برای هر fetch نمایش داده می‌شد که حذف شد) */

/* ═══════ کارت هویت کسب‌وکار در صفحه QR ═══════ */
.biz-quick-card{
  background:linear-gradient(135deg, var(--card) 0%, var(--card-2) 100%) !important;
  border:1px solid var(--line) !important;
  position:relative;
  overflow:hidden;
}
.biz-quick-card::before{
  content:""; position:absolute; top:0; right:0; width:5px; height:100%;
  background:linear-gradient(180deg, var(--gold-2), var(--gold));
}
.biz-quick-body{
  display:flex;
  align-items:center;
  gap:18px;
  padding:6px 0 4px;
  flex-wrap:wrap;
}
.biz-quick-logo{
  width:64px; height:64px;
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  background:linear-gradient(135deg, var(--gold-2), var(--gold));
  color:#fff;
  font-weight:800;
  font-size:28px;
  box-shadow:var(--sh-sm);
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  border:1px solid var(--line);
  overflow:hidden;
}
.biz-quick-logo.has-logo span{ display:none; }
.biz-quick-info{
  flex:1;
  min-width:180px;
}
.biz-quick-name{
  font-size:20px;
  font-weight:800;
  letter-spacing:-.3px;
  color:var(--ink);
  line-height:1.3;
}
.biz-quick-sub{
  font-size:13px;
  color:var(--gold-deep);
  font-weight:600;
  margin-top:3px;
}
html[data-theme=dark] .biz-quick-sub{ color:var(--gold-3); }
.biz-quick-meta{
  font-size:12px;
  color:var(--muted);
  margin-top:6px;
  line-height:1.7;
}
.biz-quick-status{
  flex-shrink:0;
}
.biz-quick-form{
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid var(--line);
  animation:pageIn .3s var(--ease-out);
}
.biz-form-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
@media(max-width:760px){
  .biz-quick-body{ gap:12px; }
  .biz-quick-logo{ width:54px; height:54px; font-size:24px; border-radius:13px; }
  .biz-quick-name{ font-size:17px; }
  .biz-quick-sub{ font-size:12px; }
  .biz-form-row{ flex-direction:column; }
}

/* ═══════ 16. Empty state — با تصویر SVG ═══════ */
.empty{
  padding:48px 24px !important;
  text-align:center;
  color:var(--muted) !important;
  position:relative;
  border-radius:var(--r-md);
}
.empty::before{
  content:""; display:block;
  width:80px; height:80px; margin:0 auto 16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none'%3E%3Crect x='12' y='20' width='56' height='44' rx='6' fill='%23F7EDD6' stroke='%23D4A74A' stroke-width='1.5'/%3E%3Crect x='12' y='20' width='56' height='10' rx='6' fill='%23D4A74A' opacity='.2'/%3E%3Ccircle cx='22' cy='25' r='2' fill='%23D4A74A'/%3E%3Ccircle cx='30' cy='25' r='2' fill='%23D4A74A' opacity='.6'/%3E%3Ccircle cx='38' cy='25' r='2' fill='%23D4A74A' opacity='.3'/%3E%3Crect x='20' y='38' width='40' height='4' rx='2' fill='%23D4A74A' opacity='.4'/%3E%3Crect x='20' y='48' width='28' height='4' rx='2' fill='%23D4A74A' opacity='.3'/%3E%3Crect x='20' y='56' width='34' height='3' rx='1.5' fill='%23D4A74A' opacity='.2'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity:.7;
}
.empty.empty-search::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none'%3E%3Ccircle cx='34' cy='34' r='20' stroke='%23D4A74A' stroke-width='2.5' opacity='.5'/%3E%3Cpath d='M48 48l16 16' stroke='%23D4A74A' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M28 34h12M34 28v12' stroke='%23D4A74A' stroke-width='2' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E");
}
.empty.empty-success::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none'%3E%3Ccircle cx='40' cy='40' r='28' fill='%23E4F3EC' stroke='%231F7A5A' stroke-width='2'/%3E%3Cpath d='M28 40l8 8 16-16' stroke='%231F7A5A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ═══════ 17. کارت بانکی — افکت 3D ═══════ */
.bank-card{
  padding:16px 18px !important;
  border-radius:var(--r-md) !important;
  background:linear-gradient(135deg, var(--card) 0%, var(--card-2) 100%) !important;
  border:1px solid var(--line) !important;
  transition:all var(--t-base) var(--ease-out) !important;
  position:relative;
  overflow:hidden;
}
.bank-card::before{
  content:""; position:absolute; top:0; right:0; width:60px; height:60px;
  background:radial-gradient(circle at top right, rgba(212,167,74,.1), transparent 70%);
  pointer-events:none;
}
.bank-card:hover{
  border-color:var(--gold) !important;
  transform:translateY(-2px);
  box-shadow:var(--sh-md) !important;
}
.bank-card .bc-bank{ font-weight:700 !important; }

/* ═══════ 18. Floating Action Button ═══════ */
.theme-fab{
  width:46px !important; height:46px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg, var(--card), var(--card-2)) !important;
  box-shadow:var(--sh-md) !important;
  border:1px solid var(--line) !important;
  font-size:20px !important;
  transition:all var(--t-base) var(--ease-spring) !important;
}
.theme-fab:hover{
  transform:scale(1.1) rotate(15deg) !important;
  box-shadow:var(--sh-lg) !important;
  border-color:var(--gold) !important;
}

/* ═══════ 19. کارت ثروت (Wealth) — ریفاین‌شده ═══════ */
.wealth{
  background:
    radial-gradient(circle at 100% 0%, rgba(212,167,74,.15), transparent 50%),
    linear-gradient(140deg, #15291F 0%, #0B1713 75%) !important;
  border:1px solid #22362D !important;
  border-radius:var(--r-xl) !important;
  padding:32px 32px 28px !important;
  position:relative;
  overflow:hidden;
}
.wealth::before{
  background:linear-gradient(90deg, var(--gold-3), var(--gold-2), var(--gold), transparent 85%) !important;
  height:4px !important;
}
.wealth-total{
  font-size:44px !important;
  font-weight:800 !important;
  letter-spacing:-1px !important;
  background:linear-gradient(135deg, #fff 0%, #EBC878 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 40px rgba(212,167,74,.3);
}
.rate-chip{
  background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  backdrop-filter:blur(8px);
  transition:all var(--t-base);
}
.rate-chip:hover{
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(212,167,74,.3) !important;
}

/* ═══════ 20. فرم ورود — پولیش نهایی ═══════ */
.login-card{
  border-radius:var(--r-2xl) !important;
}
.lc-mark{
  animation:float 4.5s ease-in-out infinite, markGlow 3s ease-in-out infinite !important;
}
@keyframes markGlow{
  50%{ filter:drop-shadow(0 0 30px rgba(212,167,74,.6)); }
}
.lc-body .btn.gold{
  position:relative;
  overflow:hidden;
}
.lc-body .btn.gold::before{
  content:""; position:absolute; top:0; bottom:0; width:80px; left:-100px;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform:skewX(-20deg);
  animation:shine 4s ease-in-out infinite;
}
@keyframes shine{
  0%, 60%{ left:-100px; }
  100%{ left:130%; }
}

/* ═══════ 21. اسکرول‌بار سفارشی ═══════ */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{
  background:var(--line-2);
  border-radius:5px;
  border:2px solid var(--paper);
}
::-webkit-scrollbar-thumb:hover{ background:var(--gold); }
html[data-theme=dark] ::-webkit-scrollbar-thumb{
  background:#2A3832;
  border-color:var(--paper);
}
#content{ scrollbar-width:thin; scrollbar-color:var(--line-2) transparent; }

/* ═══════ 22. انیمیشن شمارش اعداد ═══════ */
.counter{
  display:inline-block;
  font-variant-numeric:tabular-nums;
}
.counter.changing{
  animation:countPulse .3s var(--ease-out);
}
@keyframes countPulse{
  50%{ transform:scale(1.05); color:var(--gold); }
}

/* ═══════ 23. نمودار — استایل بهتر ═══════ */
.chart-wrap{
  position:relative;
  border-radius:var(--r-md);
  background:linear-gradient(180deg, transparent, rgba(212,167,74,.02));
}

/* ═══════ 24. موبایل — Bottom Nav و بهبود‌ها ═══════ */
#mobileBar{
  background:linear-gradient(180deg, #12231D 0%, #0A1612 100%) !important;
  border-bottom:1px solid rgba(212,167,74,.15);
  backdrop-filter:blur(12px);
}
#mobileBar .mb-brand{ font-size:18px !important; }
#navToggle{
  background:rgba(212,167,74,.15) !important;
  border-color:rgba(212,167,74,.25) !important;
  color:var(--gold-3) !important;
  transition:all var(--t-base);
}
#navToggle:active{ transform:scale(.95); }

/* Bottom Nav موبایل */
#mobileNav{
  display:none;
  position:fixed; bottom:0; left:0; right:0;
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,1));
  backdrop-filter:blur(16px);
  border-top:1px solid var(--line);
  padding:8px 12px calc(8px + env(safe-area-inset-bottom));
  z-index:var(--z-header);
  justify-content:space-around;
  box-shadow:0 -4px 20px -8px rgba(0,0,0,.1);
}
html[data-theme=dark] #mobileNav{
  background:linear-gradient(180deg, rgba(22,32,28,.95), rgba(22,32,28,1));
  border-color:var(--line);
}
#mobileNav button{
  flex:1; background:none; border:0;
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:6px 4px; font:inherit; font-size:10.5px; font-weight:600;
  color:var(--muted); cursor:pointer;
  transition:color var(--t-base);
  -webkit-tap-highlight-color:transparent;
}
#mobileNav button svg{
  width:22px; height:22px;
  stroke:currentColor; fill:none; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
  transition:transform var(--t-base) var(--ease-spring);
}
#mobileNav button.active{ color:var(--gold-deep); }
html[data-theme=dark] #mobileNav button.active{ color:var(--gold-3); }
#mobileNav button.active svg{ transform:scale(1.15) translateY(-2px); }
#mobileNav button:active svg{ transform:scale(.92); }

@media(max-width:760px){
  #mobileNav{ display:flex; }
  #content{ padding-bottom:90px !important; }
  #mobileBar .mb-brand{ font-size:17px !important; }
  .wealth{ padding:24px 20px !important; }
  .wealth-total{ font-size:32px !important; }
  h1{ font-size:23px !important; }
  .panel{ padding:18px !important; }
  .stat{ padding:16px !important; }
  .stat .v{ font-size:21px !important; }
  .price{ padding:14px !important; }
  .price .v{ font-size:18px !important; }
  .toast{ min-width:260px; max-width:calc(100vw - 32px); }
  #toastContainer{ top:12px; }
}

/* ═══════ 25. Hint و پیام‌ها ═══════ */
.hint{
  font-size:12.5px !important;
  color:var(--muted) !important;
  line-height:1.8 !important;
}
.msg{
  font-size:13px !important;
  padding:10px 14px;
  border-radius:var(--r-md);
  margin-top:12px;
  font-weight:500;
}
.msg.ok{
  background:var(--green-soft);
  color:var(--green);
  border:1px solid rgba(31,122,90,.2);
}
.msg.err{
  background:var(--red-soft);
  color:var(--red);
  border:1px solid rgba(181,64,47,.2);
}

/* ═══════ 26. optgroup و select سفارشی ═══════ */
select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23B7862B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") !important;
  background-position:left 14px center !important;
  padding-left:38px !important;
}

/* ═══════ 27. focus-visible حرفه‌ای ═══════ */
:focus-visible{
  outline:2px solid var(--gold-2);
  outline-offset:2px;
  border-radius:var(--r-sm);
}
button:focus-visible, .menu-item:focus-visible, .seg button:focus-visible{
  outline-offset:3px;
}

/* ═══════ 28. tooltip ساده برای آیکن‌ها ═══════ */
[data-tip]{ position:relative; }
[data-tip]::after{
  content:attr(data-tip);
  position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%);
  background:var(--ink); color:#fff;
  padding:6px 10px; border-radius:6px;
  font-size:11px; white-space:nowrap;
  opacity:0; pointer-events:none;
  transition:opacity var(--t-base);
  z-index:var(--z-dropdown);
}
[data-tip]:hover::after{ opacity:1; }

/* ═══════ 29. Reduced motion ═══════ */
@media(prefers-reduced-motion:reduce){
  *, *::before, *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

/* ═══════ 30. بهبود نمودار درخشش ═══════ */
canvas{ max-width:100%; }

/* انیمیشن ورود برای stat-grid و prices */
.stat-grid > .stat, .prices > .price{
  animation:cardSlideIn .5s var(--ease-out) both;
}
.stat-grid > .stat:nth-child(1), .prices > .price:nth-child(1){ animation-delay:.05s; }
.stat-grid > .stat:nth-child(2), .prices > .price:nth-child(2){ animation-delay:.10s; }
.stat-grid > .stat:nth-child(3), .prices > .price:nth-child(3){ animation-delay:.15s; }
.stat-grid > .stat:nth-child(4), .prices > .price:nth-child(4){ animation-delay:.20s; }
.stat-grid > .stat:nth-child(5), .prices > .price:nth-child(5){ animation-delay:.25s; }
.stat-grid > .stat:nth-child(6), .prices > .price:nth-child(6){ animation-delay:.30s; }
.stat-grid > .stat:nth-child(7), .prices > .price:nth-child(7){ animation-delay:.35s; }
.stat-grid > .stat:nth-child(8), .prices > .price:nth-child(8){ animation-delay:.40s; }
@keyframes cardSlideIn{
  from{ opacity:0; transform:translateY(16px); }
  to{ opacity:1; transform:none; }
}

/* پیام demo-note بهتر */
.demo-note{
  background:linear-gradient(135deg, #FFF6DC, #FFEFC4) !important;
  border:1px solid #EBD592 !important;
  border-right:4px solid var(--gold) !important;
  border-radius:var(--r-md) !important;
  padding:12px 16px !important;
  font-size:13px !important;
  display:flex; align-items:center; gap:10px;
}

/* اعلان هشدار بهتر */
.alert-banner{
  border-right:4px solid var(--gold) !important;
  border-radius:var(--r-md) !important;
  padding:16px 20px 8px !important;
}

/* اسپرد خرید/فروش بهتر */
.price .bs{
  padding:6px 10px;
  background:var(--paper-2);
  border-radius:var(--r-sm);
  margin:8px 0 !important;
}

/* پیش‌نمایش‌ها (preview) */
.preview{
  background:linear-gradient(135deg, var(--card-2), var(--paper-2)) !important;
  border:1px dashed var(--line-2) !important;
  border-radius:var(--r-md) !important;
  padding:14px 16px !important;
  font-size:13.5px !important;
  line-height:2 !important;
}

/* تگ‌های دارایی (src-tag) */
.src-tag{
  font-weight:700 !important;
  letter-spacing:.2px;
}

/* آیکن دارایی (asset glyph) */
.ag{
  box-shadow:0 4px 12px -4px currentColor;
  transition:transform var(--t-base) var(--ease-spring);
}
.ag:hover{ transform:scale(1.1) rotate(5deg); }

/* لینک‌های QR */
.qr-actions .btn{
  flex:1; min-width:80px;
}

/* افکت fade-in برای صفحات */
.page.active{ animation:pageIn .4s var(--ease-out); }

/* نشانگر زنده (live dot) — فقط نقطه ثابت بدون pulse */
.ticker span::before{
  animation:none !important;
}

/* ═══ افکت بسیار ظریف هنگام تغییر قیمت ═══
   فقط تغییر رنگ ملایم متن قیمت — بدون glow شدید، بدون تغییر سایز،
   بدون افکت روی کل کارت. کوتاه (۶۰۰ms) و خفیف. */
.price .v{
  transition:color .3s ease-out;
  border-radius:4px;
  padding:0 2px;
  margin:0 -2px;
}
/* فقط رنگ عدد تغییر می‌کند — نور شدید و glow حذف شد */
.price.flash-up .v{
  animation:flashUp .6s ease-out;
}
.price.flash-down .v{
  animation:flashDown .6s ease-out;
}
@keyframes flashUp{
  0%{ color:var(--ink); }
  20%{ color:#1F7A5A; }
  100%{ color:var(--ink); }
}
@keyframes flashDown{
  0%{ color:var(--ink); }
  20%{ color:#B5402F; }
  100%{ color:var(--ink); }
}
html[data-theme=dark] .price.flash-up .v{
  animation:flashUpDark .6s ease-out;
}
html[data-theme=dark] .price.flash-down .v{
  animation:flashDownDark .6s ease-out;
}
@keyframes flashUpDark{
  0%{ color:var(--ink); }
  20%{ color:#3DD598; }
  100%{ color:var(--ink); }
}
@keyframes flashDownDark{
  0%{ color:var(--ink); }
  20%{ color:#F0786A; }
  100%{ color:var(--ink); }
}
/* افکت روی کل کارت حذف شد — فقط روی عدد قیمت اعمال می‌شود */

/* فیلد جستجو با آیکن */
.toolbar input[type=search], #txSearch{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236A746E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:42px !important;
}
.toolbar input[type=search]:focus, #txSearch:focus{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23B7862B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
}

/* hover برای input file/radio/checkbox */
.opt:hover{
  border-color:var(--gold) !important;
  background:var(--gold-soft) !important;
  transform:translateX(-2px);
}
.opt{ transition:all var(--t-base) var(--ease-out); }

/* بهبود دکمه‌های در جدول */
.btn.sm{
  padding:7px 14px !important;
  font-size:12.5px !important;
  font-weight:600 !important;
}

/* برای اعداد بزرگ در جداول - راست‌چین بهتر */
td.num{ direction:ltr; text-align:right !important; }
th:last-child{ text-align:right !important; }
th:not(:last-child){ text-align:right !important; }

/* بهبود اعداد در wealth */
.wealth b, .wealth-total, .wealth-usd{
  font-variant-numeric:tabular-nums;
}

/* بهبود ticker b */
.ticker b{
  background:linear-gradient(135deg, var(--gold-3), var(--gold-2));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:800 !important;
}

/* اعداد فارسی در کلی — بهتر نمایش داده شوند */
body{ font-variant-numeric:tabular-nums; }

/* حذف outline پیش‌فرض روی دکمه‌ها در فایرفاکس */
button::-moz-focus-inner{ border:0; }

/* بهبود mobileBar brand */
#mobileBar .mb-brand{
  background:linear-gradient(135deg, #fff, #EBC878);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:800 !important;
}
#mobileBar .mb-brand span{ -webkit-text-fill-color:initial; color:var(--gold-3); }

/* پیام‌های موفق/خطا با انیمیشن */
.msg.ok, .msg.err{
  animation:msgSlide .4s var(--ease-spring);
}
@keyframes msgSlide{
  from{ opacity:0; transform:translateX(-12px); }
  to{ opacity:1; transform:none; }
}

/* بهبود استایل input[type=date] */
input[type=date]{
  font-family:inherit;
  cursor:pointer;
}
input[type=date]::-webkit-calendar-picker-indicator{
  filter:invert(.5) sepia(1) saturate(2) hue-rotate(10deg);
  cursor:pointer;
}
html[data-theme=dark] input[type=date]::-webkit-calendar-picker-indicator{
  filter:invert(.8) sepia(1) saturate(2) hue-rotate(10deg);
}

/* بهبود checkbox */
.check input[type=checkbox]{
  width:18px !important; height:18px !important;
  border-radius:5px;
  cursor:pointer;
  transition:all var(--t-base);
}
.check input[type=checkbox]:checked{
  background:linear-gradient(135deg, var(--gold-2), var(--gold));
}

/* بهبود radio buttons */
.opt input[type=radio]{
  width:18px !important; height:18px !important;
  cursor:pointer;
}

/* بهبود پیام‌های inline در پنل تنظیمات */
.set-pane.active{ animation:pageIn .3s var(--ease-out); }
.hist-pane.active{ animation:pageIn .3s var(--ease-out); }

/* بهبود QR box */
.qr-box{
  border:1px solid var(--line) !important;
  border-radius:var(--r-xl) !important;
  box-shadow:var(--sh-md), 0 0 0 8px var(--card) !important;
  position:relative;
  overflow:hidden;
}
.qr-box::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(212,167,74,.05), transparent 50%);
  pointer-events:none;
}

/* خروجی اسپارک‌لاین (نمودار کوچک) */
.sparkline{
  height:32px; width:80px;
  display:inline-block;
  vertical-align:middle;
}

/* فیلد رمز با آیکن */
.fi > svg{
  transition:all var(--t-base);
}

/* بهبود انیمیشن transition صفحات */
.page{ animation-fill-mode:both; }

/* جلوگیری از انتخاب متن روی دکمه‌ها */
button, .menu-item, .seg button{ user-select:none; }

/* بهبود افکت hover روی menu-item */
.menu-item svg{
  transition:transform var(--t-base) var(--ease-spring), opacity var(--t-base);
}

/* بهبود استایل پایه */
*{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
html, body{ text-rendering:optimizeLegibility; }

/* نمایش بهتر اعداد در جداول بزرگ */
.assets-table td, .assets-table th{ font-size:13px !important; }

/* بهبود کلاس share (سهم دارایی) */
.share i{
  background:linear-gradient(90deg, var(--gold), var(--gold-3)) !important;
  border-radius:3px;
  box-shadow:0 0 8px rgba(212,167,74,.4);
}

/* بهبود alloc-bar */
.alloc-bar{
  height:14px !important;
  border-radius:7px !important;
  background:rgba(255,255,255,.07) !important;
  overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.2);
}
.alloc-bar i{
  transition:width var(--t-slow) var(--ease-out);
  position:relative;
}
.alloc-bar i::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.3), transparent);
}

/* اسکرول‌بار نازک‌تر در داخل پنل‌ها */
.table-wrap::-webkit-scrollbar{ height:6px; }

/* حالت focus بهتر برای accessibility */
.btn:focus-visible{
  outline:3px solid rgba(212,167,74,.5);
  outline-offset:2px;
}

/* بهبود نمایش خطای قیمت */
.price-err{
  border-right:4px solid var(--red) !important;
  border-radius:var(--r-md) !important;
  animation:msgSlide .4s var(--ease-spring);
}

/* بهبود سرستون ثروت */
.wealth-label{
  font-size:13px !important;
  font-weight:600;
  letter-spacing:.3px;
  text-transform:uppercase;
  opacity:.7;
}

/* لینک‌های داخل متن */
a{ color:var(--gold-deep); text-decoration:none; transition:color var(--t-base); }
a:hover{ color:var(--gold); text-decoration:underline; }
html[data-theme=dark] a{ color:var(--gold-3); }

/* بهبود نمایشگر مبلغ پرداخت */
.pay-amount{
  background:linear-gradient(135deg, var(--gold-soft), #FFF9E0) !important;
  border:1px solid #EBD592 !important;
  border-radius:var(--r-md) !important;
  padding:18px 20px !important;
  position:relative;
  overflow:hidden;
}
.pay-amount::before{
  content:""; position:absolute; top:0; right:0; width:4px; height:100%;
  background:linear-gradient(180deg, var(--gold-2), var(--gold));
}
.pay-amount b{
  font-size:24px !important;
  background:linear-gradient(135deg, var(--gold-deep), var(--gold));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* بهبود trust badges در صفحه ورود */
.lc-trust span{
  transition:all var(--t-base);
  font-weight:600 !important;
}
.lc-trust span:hover{
  transform:translateY(-2px);
  box-shadow:var(--sh-sm);
}

/* ═══════ فعالیت‌های زنده (داشبورد ادمین) ═══════ */
.act-panel .panel-head h2{gap:10px}
.act-live{width:9px;height:9px;border-radius:50%;background:#3DD598;box-shadow:0 0 0 0 rgba(61,213,152,.6);animation:actPulse 2s infinite}
@keyframes actPulse{70%{box-shadow:0 0 0 8px rgba(61,213,152,0)}100%{box-shadow:0 0 0 0 rgba(61,213,152,0)}}
.act-new{font-size:11px;font-weight:700;background:var(--red);color:#fff;border-radius:999px;padding:2px 9px}
.act-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.act-sum div{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card-2)}
.act-sum span{display:block;font-size:12px;color:var(--muted)}
.act-sum b{display:block;font-size:15px;margin-top:4px;font-variant-numeric:tabular-nums}
.act-list{display:flex;flex-direction:column;gap:8px;max-height:560px;overflow-y:auto;padding:2px}
.act-row{border:1px solid var(--line);border-radius:14px;background:var(--card);transition:border-color .2s,box-shadow .2s}
.act-row:hover{border-color:var(--line-2);box-shadow:var(--sh-sm)}
.act-row.is-new{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,167,74,.15);animation:actIn .5s var(--ease-out)}
@keyframes actIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.act-main{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;width:100%;background:none;border:0;font:inherit;color:inherit;text-align:right}
.act-ic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;font-weight:800;color:#fff}
.act-ic.deposit{background:#2F7D5B}.act-ic.buy{background:linear-gradient(135deg,#CB9D3F,#A97A22);color:#1A1405}.act-ic.sell{background:#3D6FA8}
.act-ic.withdraw{background:#B5402F}.act-ic.subscription{background:#7B5AA6}
.act-txt{flex:1;min-width:0}
.act-title{display:block;font-weight:700;font-size:14px;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.act-meta{display:block;font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.act-amt{text-align:left;flex-shrink:0}
.act-amt b{display:block;white-space:nowrap;font-size:15px;font-variant-numeric:tabular-nums}
.act-amt small{display:block;font-size:11.5px;color:var(--muted)}
.act-amt .pos{color:var(--green)}.act-amt .neg{color:var(--red)}
.act-det{display:none;border-top:1px dashed var(--line-2);padding:12px 14px 14px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px 18px;font-size:13px}
.act-row.open .act-det{display:grid}
.act-det div span{display:block;font-size:11.5px;color:var(--muted)}
.act-det div b{font-weight:600;word-break:break-all}
.act-badge{display:inline-block;font-size:10.5px;font-weight:700;background:var(--gold);color:#1A1405;border-radius:6px;padding:1px 7px;margin-right:6px;vertical-align:middle}
.act-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
@media(max-width:760px){
  .act-sum{grid-template-columns:1fr 1fr;gap:8px}
  .act-sum b{font-size:13.5px}
  .act-main{flex-wrap:wrap;padding:12px}
  .act-txt{flex:1 1 calc(100% - 56px)}
  .act-amt{width:100%;text-align:right;padding-right:52px}
  .act-title,.act-meta{white-space:normal}
}