:root{
    --bg: #0a0a0a;
    --card: #1b1b1c00;
    --line:#24335A;
    --text:#EAF0FF;
    --muted:#A8B3D6;
    --primary:#3C76FF;
    --primary-2:#1D4ED8;
    --pos:#1BBE72;
    --neg:#E5484D;
    --radius:18px;
    --border:#1f2937;
    --shadow:0 14px 34px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Arial;background:var(--bg);color:var(--text);line-height:1.6}

.main {
    padding: 1rem 1.5rem;
}
/* Ticker */
.ticker{background:linear-gradient(90deg,var(--primary),var(--primary-2));color:#fff;overflow:hidden}
.ticker__inner{display:inline-flex;gap:22px;white-space:nowrap;animation:ticker 40s linear infinite;padding:8px 24px}
.ticker:hover .ticker__inner{animation-play-state:paused}
.tick{color:#fff;text-decoration:none}
.sep{opacity:.5}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* Fluid containers */
.container{max-width:100%;margin:0 auto;padding:0}
.hero-list.is-fluid{padding:0 0 18px}
.detail.is-fluid{min-height:calc(100vh - 85px);padding:22px 24px 36px}

/* Topbar */
.topbar{background:linear-gradient(180deg,var(--primary),var(--primary-2));color:#fff}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-weight:800;font-size:20px;letter-spacing:.2px}
.brand span{opacity:.9}
.nav{display:flex;gap:18px}
.nav__link{color:#fff;text-decoration:none;opacity:.9}
.nav__link.is-active,.nav__link:hover{opacity:1}
.actions{display:flex;gap:10px}
.btn{border:0;border-radius:12px;cursor:pointer;line-height:1;padding:10px 14px;font-weight:600}
.btn--primary{background:#888888;color:#111111}
.btn--ghost{background:rgba(255,255,255,.2);color:#fff}

/* Headings */
.title{font-size:28px}
.subtitle{margin:0 0 18px;color:var(--muted)}

/* KPI cards */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:10px 0 16px}
.kpi{
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    overflow: auto;height: 180px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow)}
.kpi span{display:block;color:var(--muted);font-size:12px}
.kpi b{display:block;font-size:20px;margin-top:4px}

.chartCont {
    height: 80%;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    overflow: auto;
}
.chartCont::-webkit-scrollbar,.kpi::-webkit-scrollbar {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important; /* IE 10+ */
}
/* Toolbar */
.toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:14px 0 18px;flex-wrap:wrap}
.search{position:relative;flex:1 1}
.search input{width:100%;height:42px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);padding:0 12px 0 42px;outline:none}
.search .icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);opacity:.6}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chip{border:1px solid var(--line);background:var(--card);padding:8px 12px;border-radius:999px;color:var(--text);cursor:pointer}
.chip.is-active,.chip:hover{border-color:var(--primary);box-shadow:0 0 0 3px rgba(20,92,244,.12)}

/* Table */
.table-wrap{overflow:auto}
.table{width:100%;min-width:1100px;border-collapse:separate;border-spacing:0}
.table thead th{text-align:left;padding:16px 18px;border-bottom:1px solid var(--line);font-weight:700;color:#3B4665;white-space:nowrap}
.table tbody td{padding:14px 18px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tbody tr{cursor:pointer}
.table tbody tr:hover{background:rgba(20,92,244,.06)}
.coin{display:inline-flex;align-items:center;gap:10px}
.coin small{opacity:.7}
.logo{width:24px;height:24px;border-radius:50%}
.spark{display:block}
.pos{color:var(--pos);font-weight:700}
.neg{color:var(--neg);font-weight:700}

/* Pager */
.pager{display:flex;gap:10px;align-items:center;justify-content:flex-end;margin:12px 0 0}
.pages{display:flex;gap:6px;flex-wrap:wrap}
.page-btn{border:1px solid var(--line);background:var(--card);padding:8px 12px;border-radius:10px;cursor:pointer;color:#ffffff}
.page-btn.is-active{border-color:var(--primary);box-shadow:0 0 0 3px rgba(20,92,244,.12)}

/* Detail (unchanged basics) */
.detail{display:grid;grid-template-columns:2fr 1fr;gap:18px}
.chart{flex: 1;padding:12px;display: flex;flex-direction: column;height:100%}
.tv{width:100%;flex: 1;overflow:hidden}
.tv-fallback{display:grid;place-items:center;height:540px;color:var(--muted)}
.chart-meta{display:flex;gap:16px;padding:10px 2px;flex-wrap:wrap}
.chart-meta .meta-item{background:rgba(20,92,244,.06);padding:8px 12px;border-radius:12px}
.chart-meta span{opacity:.7;margin-right:6px}

/* Chat */
.chat{display:flex;flex-direction:column;background:var(--card);box-shadow:var(--shadow);overflow:hidden;min-height:600px}
.chat__head{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.chat__title{margin:0;font-size:16px}
.chat__body{padding:14px;height:100%;overflow:auto;display:flex;flex-direction:column;gap:10px;background:linear-gradient(180deg,rgba(20,92,244,.04),transparent)}
.msg{display:flex}
.msg.me{justify-content:flex-end}
.msg.bot{justify-content:flex-start}
.bubble{max-width:80%;padding:10px 12px;border-radius:14px;line-height:1.5}
.me .bubble{background:#1D52FF;color:#fff;border-top-left-radius:6px}
.bot .bubble{background:#E8F0FF;color:#0E1535;border-top-right-radius:6px}
.typing{display:flex;gap:4px;padding:6px 12px}
.typing span{width:6px;height:6px;border-radius:50%;background:#9AB4FF;animation:blink 1s infinite}
.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.2}40%{opacity:1}}
.chat__form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}
.chat__form input{flex:1;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);padding:0 12px}
.chat__note{margin:0;color:var(--muted);padding:6px 12px}

/* Footer */
.footer{padding:28px 0 15px 0;color:#7A859F}
.footer .container{border-top:1px solid var(--line);padding:12px}

button:disabled {
    background-color: #666666 !important;
    color: #ffffff !important;
    opacity: 0.5;
    cursor: unset;
}

.mainSection {
    width: 100%;
    display: flex;
    flex-direction: row;
    position: relative
}
.w70 {
    width: 70%;
}
.news-section {
    width: 30%;
    position: sticky !important;
    top: 0;
    height: 100vh;
}

.svg {
    width: 50%;
    margin-left: auto;
}

/* Responsive */
@media (max-width:1200px){
    .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .table{min-width:1000px}
    .mainSection {
        flex-direction: column;
    }
    .news-section {
        width: 100%;
    }
    .w70 {
        width: 100%;
    }
}
@media (max-width:1024px){
    .detail{grid-template-columns:1fr}
    .tv{height:440px}
}
@media (max-width:760px){
    .toolbar{flex-direction:column;align-items:stretch}
    .search input{height:44px}
    .table{min-width:900px}
}

.site-header{
    background:rgba(11,15,26,.85);
    backdrop-filter: blur(10px);
    padding: 10px 20px;
    border-bottom:1px solid var(--border);
}
.site-header .container{
    display:flex; align-items:center; justify-content:space-between; gap:12px; height:64px;
}
.brand{ display:inline-flex; align-items:center; gap:8px; text-decoration:none; color:var(--text) }
.brand__logo{
    display:inline-flex; align-items:center; justify-content:center;
    width:28px; height:28px; border-radius:8px;
    background:linear-gradient(135deg, #111827, #1f2937);
    color:#F2A900; font-weight:900;
}
.brand__name{ font-weight:800; letter-spacing:.2px }

/* Footer */
.site-footer{
    margin-top:28px; border-top:1px solid var(--border); background:var(--card); color:var(--text);
}
.footer-grid{
    display:grid; grid-template-columns:2fr 1fr 1fr 2fr; gap:18px; padding:22px 0;
}
.footer-text{ color:var(--muted); margin:8px 0 }
.footer-title{ font-size:1rem; margin:0 0 8px; color:#d1d5db }
.footer-list{ list-style:none; padding:0; margin:0; display:grid; gap:6px }
.footer-list a{ color:#cbd5e1; text-decoration:none }
.footer-list a:hover{ color:#fff; text-decoration:underline }

.socials{ display:flex; align-items:center; gap:10px; margin-top:8px }
.social{
    display:inline-flex; align-items:center; justify-content:center;
    width:32px; height:32px; border-radius:10px; color:#cbd5e1;
    background:#0f172a; border:1px solid var(--border); text-decoration:none; transition:.2s;
}
.social:hover{ color:#fff; border-color:#334155 }

.newsletter{ display:flex; gap:8px; margin-top:8px }
.newsletter input{
    flex:1; background:#0f172a; border:1px solid var(--border); color:var(--text);
    border-radius:10px; padding:8px 10px; outline:none;
}
.newsletter button{
    background:linear-gradient(135deg, var(--accent), var(--accent2));
    color:#fff; border:none; border-radius:10px; padding:8px 12px; cursor:pointer; font-weight:600;
}

.footer-bottom{
    border-top:1px solid var(--border); background:#0f0f14; color:var(--muted);
    font-size:.9rem; padding:10px 0;
}

.kpi{ background:#141a2a; border:1px solid var(--border); border-radius:16px; padding:14px }
.kpi__label{ font-size:.95rem; color:var(--muted); margin-bottom:6px }
.kpi__value{ font-size:1.6rem; font-weight:800; line-height:1 }
.kpi__gauge{ margin-top:8px }
.gauge{
    margin-top: 2rem;
    position:relative; width:100%; height:16px; border-radius:999px; background:#0f172a; overflow:hidden; border:1px solid var(--border);
}
.gauge::after{
    content:attr(data-text);
    position:absolute; inset:0; display:none; align-items:center; justify-content:center;
    font-size:0rem; color:var(--muted);
}
.gauge::before{
    content:""; display:block; height:100%;
    width:calc(var(--val,0) * 1%);
    background:linear-gradient(90deg, #F2A900 0%, #EAB308 50%, #4ADE80 100%);
    transition:width .4s ease;
}

.fng-wrap{ color:#e5e7eb; font-family:Inter,ui-sans-serif,system-ui; }
.fng-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
.fng-cont{display:flex;flex-wrap: wrap;justify-content: space-between;align-items: center}
.fng-title{ font-size:.95rem; color:#9ca3af }
.fng-label{ margin-top:6px; font-size:.9rem; font-weight: bold; color:#9ca3af; text-align:center }

.asi-score{ display:inline-block; width:auto;margin: 0;white-space: nowrap;font-size:2rem;font-weight:bold}
.asi-labels{ display:flex; justify-content:space-between; font-size:.9rem; color:#9ca3af; margin:6px 2px 6px }
.asi-side{ opacity:.9 }
.asi-left{ text-align:left }
.asi-right{ text-align:right }
.asi-bar-wrap{ position:relative; height:8px; margin:4px 0 6px }
.asi-bar{ position:absolute; inset:0; display:grid; grid-template-columns: repeat(4, 1fr);
    border-radius:999px; overflow:hidden; border:1px solid #1f2937; background:#0f172a }
.asi-seg{ height:100% }
.asi-s1{ background:#EA3943 }   /* قرمز - BTC season قوی */
.asi-s2{ background:#EA8C00 }   /* نارنجی - BTC season */
.asi-s3{ background:#F3D42F }   /* زرد - Alt season */
.asi-s4{ background:#16C784 }   /* سبز - Alt season قوی */
.fsmall {display:inline-block; width:auto;font-weight: normal !important;font-size: 0.8rem !important;margin: 0;}
.asi-marker{ position:absolute; top:50%; transform:translate(-50%,-50%); pointer-events:none }
.asi-dot{ width:10px; height:10px; display:block; border-radius:50%;background:#fff; box-shadow:0 0 0 3px rgba(255,255,255,.25) }

.mini-card{background:#141a2a;border:1px solid #1f2937;border-radius:12px;padding:8px;max-width:240px}
.mini-title{font:600 12px/1.2 Inter,ui-sans-serif;color:#9ca3af;margin-bottom:6px}
.mini-spark svg{display:block;width:100%;height:auto}

.value {
    font-size: 22px;
    font-weight: bold;
    color: #16a34a;
    margin-bottom: 10px;
}
canvas {
    width: 100%;
    height: 80px;
}

.modal {
     position: fixed; top:0; left:0; right:0; bottom:0;
     background: rgba(0,0,0,0.6);
     display: flex;
     justify-content: center;
     align-items: center;
     z-index: 1000;
     opacity: 0;
     pointer-events: none; /* وقتی مخفی است کلیک نمی‌پذیرد */
     transition: opacity 0.3s ease;
}

.modal.show {
    opacity: 1;
    pointer-events: auto;
}

.modal-content {
    background: #1e1e1e;
    padding: 25px;
    border-radius: 14px;
    width: 90%;
    height: 90%;
    min-height: 500px;
    text-align: center;
    transform: scale(0.7);
    opacity: 0;
    transition: transform 0.4s cubic-bezier(0.68,-0.55,0.27,1.55), opacity 0.3s ease;
}

.modal.show .modal-content {
    transform: scale(1);
    opacity: 1;
}
.headerLinks {
    color: var(--text) !important;
    text-decoration: none !important;
    margin: 0 20px;
    white-space: nowrap;
}

@media (max-width:580px) {
    .fng-label {
        display: none;
    }
    .fng-cont {
        justify-content: center;
    }
}
@media (max-width:420px){
    .fng-label {display: none;}
    .asi-card{ padding:12px }
    .asi-dot{ width:10px; height:16px }
}

/* Responsive */
@media(max-width:980px){
    .nav{ display:none }
    .menu-toggle{ display:inline-block }
    .footer-grid{ grid-template-columns:1fr 1fr }
}
@media(max-width:560px){
    .header-search input{ width:120px }
    .footer-grid{ grid-template-columns:1fr; }
}