:root{--bg: #07070f;--surface: #0c0c1d;--surface2: #111126;--surface3: #18183a;--border: #22224a;--border2: #2e2e64;--border3: #3d3d7a;--text: #eeeeff;--text-muted: #7878aa;--text-dim: #3d3d66;--accent: #7c3aed;--accent-glow: rgba(124, 58, 237, .35);--nbu-usd: #f59e0b;--nbu-usd-glow: rgba(245, 158, 11, .25);--nbu-eur: #38bdf8;--nbu-eur-glow: rgba(56, 189, 248, .25);--pb-usd-buy: #4ade80;--pb-usd-buy-glow: rgba(74, 222, 128, .18);--pb-usd-sell: #fb7185;--pb-usd-sell-glow: rgba(251, 113, 133, .18);--pb-eur-buy: #c084fc;--pb-eur-buy-glow: rgba(192, 132, 252, .18);--pb-eur-sell: #fb923c;--pb-eur-sell-glow: rgba(251, 146, 60, .18);--radius: 12px;--radius-lg: 18px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:14px;scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh;-webkit-font-smoothing:antialiased;background-image:radial-gradient(ellipse 80% 50% at 20% -10%,rgba(124,58,237,.07) 0%,transparent 60%),radial-gradient(ellipse 60% 40% at 80% 110%,rgba(56,189,248,.04) 0%,transparent 60%);background-attachment:fixed}.header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 24px;height:62px;background:#0c0c1deb;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 4px 32px #00000080}.logo{display:flex;align-items:center;gap:12px;flex-shrink:0}.logo-icon{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#7c3aed,#0ea5e9);display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:800;color:#fff;box-shadow:0 0 20px #7c3aed8c,0 0 48px #7c3aed33}.logo h1{font-size:17px;font-weight:700;letter-spacing:-.01em;background:linear-gradient(90deg,#a78bfa,#38bdf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.header-chip{display:flex;align-items:center;gap:6px;padding:4px 12px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;font-size:12px;color:var(--text-muted);white-space:nowrap;transition:border-color .15s}.header-chip:hover{border-color:var(--border2)}.header-chip strong{font-weight:600}.header-chip.usd strong{color:var(--nbu-usd)}.header-chip.eur strong{color:var(--nbu-eur)}.collect-btn{padding:6px 16px;background:#7c3aed1f;border:1px solid rgba(124,58,237,.35);border-radius:20px;color:#a78bfa;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s;font-family:inherit}.collect-btn:hover{background:#7c3aed38;border-color:var(--accent);box-shadow:0 0 16px var(--accent-glow)}.collect-btn:disabled{opacity:.4;cursor:not-allowed}.layout{display:flex;min-height:calc(100vh - 62px)}.sidebar{width:220px;min-width:220px;background:var(--surface);border-right:1px solid var(--border);padding:24px 14px;position:sticky;top:62px;height:calc(100vh - 62px);overflow-y:auto}.main-content{flex:1;padding:24px;overflow-x:hidden;min-width:0}.filters{display:flex;flex-direction:column;gap:22px}.filter-label{display:block;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);margin-bottom:9px}.pills{display:flex;flex-wrap:wrap;gap:5px}.pill{padding:4px 11px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;color:var(--text-muted);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;font-family:inherit}.pill:hover{border-color:var(--border3);color:var(--text)}.pill.active{background:linear-gradient(135deg,#7c3aed47,#0ea5e92e);border-color:var(--accent);color:#c4b5fd;box-shadow:0 0 12px var(--accent-glow),inset 0 1px #ffffff0f}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:12px;margin-bottom:24px}.summary-card{position:relative;padding:18px 18px 16px;border-radius:var(--radius-lg);border:1px solid var(--border);background:linear-gradient(145deg,var(--surface2),var(--surface));overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s;cursor:default}.summary-card:before{content:"";position:absolute;top:0;left:20%;right:20%;height:1px}.summary-card:hover{transform:translateY(-2px)}.summary-card.nbu-usd{box-shadow:0 4px 24px #00000073,0 0 48px #f59e0b0d}.summary-card.nbu-usd:before{background:linear-gradient(90deg,transparent,var(--nbu-usd),transparent);box-shadow:0 0 10px var(--nbu-usd)}.summary-card.nbu-usd:hover{border-color:#f59e0b47;box-shadow:0 8px 32px #00000080,0 0 48px #f59e0b1a}.summary-card.nbu-eur{box-shadow:0 4px 24px #00000073,0 0 48px #38bdf80d}.summary-card.nbu-eur:before{background:linear-gradient(90deg,transparent,var(--nbu-eur),transparent);box-shadow:0 0 10px var(--nbu-eur)}.summary-card.nbu-eur:hover{border-color:#38bdf847;box-shadow:0 8px 32px #00000080,0 0 48px #38bdf81a}.summary-card.pb-usd{box-shadow:0 4px 24px #00000073,0 0 48px #4ade800a}.summary-card.pb-usd:before{background:linear-gradient(90deg,transparent,var(--pb-usd-buy),transparent);box-shadow:0 0 10px var(--pb-usd-buy)}.summary-card.pb-usd:hover{border-color:#4ade8038;box-shadow:0 8px 32px #00000080,0 0 48px #4ade8014}.summary-card.pb-eur{box-shadow:0 4px 24px #00000073,0 0 48px #c084fc0a}.summary-card.pb-eur:before{background:linear-gradient(90deg,transparent,var(--pb-eur-buy),transparent);box-shadow:0 0 10px var(--pb-eur-buy)}.summary-card.pb-eur:hover{border-color:#c084fc38;box-shadow:0 8px 32px #00000080,0 0 48px #c084fc14}.card-badge{display:inline-flex;align-items:center;gap:5px;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:2px 8px;border-radius:6px;margin-bottom:12px}.nbu-usd .card-badge{background:#f59e0b1a;color:var(--nbu-usd);border:1px solid rgba(245,158,11,.18)}.nbu-eur .card-badge{background:#38bdf81a;color:var(--nbu-eur);border:1px solid rgba(56,189,248,.18)}.pb-usd .card-badge{background:#4ade8017;color:var(--pb-usd-buy);border:1px solid rgba(74,222,128,.18)}.pb-eur .card-badge{background:#c084fc17;color:var(--pb-eur-buy);border:1px solid rgba(192,132,252,.18)}.card-main-rate{font-family:JetBrains Mono,monospace;font-size:27px;font-weight:700;letter-spacing:-.03em;line-height:1;margin-bottom:3px}.nbu-usd .card-main-rate{color:var(--nbu-usd);text-shadow:0 0 24px rgba(245,158,11,.45)}.nbu-eur .card-main-rate{color:var(--nbu-eur);text-shadow:0 0 24px rgba(56,189,248,.45)}.card-sub{font-size:10px;color:var(--text-dim);margin-top:4px}.card-buysell{display:flex;gap:18px;margin-top:2px}.card-side-label{font-size:9px;color:var(--text-dim);margin-bottom:3px;letter-spacing:.06em;text-transform:uppercase}.card-side-val{font-family:JetBrains Mono,monospace;font-size:17px;font-weight:700;letter-spacing:-.02em}.pb-usd .buy-val{color:var(--pb-usd-buy);text-shadow:0 0 14px rgba(74,222,128,.35)}.pb-usd .sell-val{color:var(--pb-usd-sell);text-shadow:0 0 14px rgba(251,113,133,.35)}.pb-eur .buy-val{color:var(--pb-eur-buy);text-shadow:0 0 14px rgba(192,132,252,.35)}.pb-eur .sell-val{color:var(--pb-eur-sell);text-shadow:0 0 14px rgba(251,146,60,.35)}.section{margin-bottom:20px}.section-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}.section-title{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}.card{background:linear-gradient(145deg,var(--surface2) 0%,var(--surface) 100%);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 4px 24px #00000059,inset 0 1px #ffffff06;transition:border-color .2s}.card:hover{border-color:var(--border2)}.chart-header{display:flex;align-items:center;gap:10px;padding:16px 18px 0}.chart-icon{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}.chart-icon.dynamics{background:#7c3aed24}.chart-icon.spread{background:#f59e0b1f}.chart-icon.premium{background:#4ade801a}.chart-header-text h3{font-size:13px;font-weight:600;color:var(--text);margin-bottom:2px}.chart-header-text p{font-size:11px;color:var(--text-dim);line-height:1.4}.charts-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}@media (max-width: 860px){.charts-grid{grid-template-columns:1fr}}.chart-wrap{padding:12px 4px 8px}.table-wrap{overflow-x:auto}.rates-table{width:100%;border-collapse:collapse;font-size:13px}.rates-table thead tr{border-bottom:1px solid var(--border)}.rates-table th{padding:11px 18px;text-align:right;font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;background:#11112699}.rates-table th:first-child{text-align:left;color:var(--text-dim)}.rates-table th.col-nbu-usd{color:var(--nbu-usd)}.rates-table th.col-nbu-eur{color:var(--nbu-eur)}.rates-table th.col-pb-usd-buy{color:var(--pb-usd-buy)}.rates-table th.col-pb-usd-sell{color:var(--pb-usd-sell)}.rates-table th.col-pb-eur-buy{color:var(--pb-eur-buy)}.rates-table th.col-pb-eur-sell{color:var(--pb-eur-sell)}.rates-table td{padding:9px 18px;border-bottom:1px solid rgba(34,34,74,.5);text-align:right;color:var(--text-muted)}.rates-table td:first-child{text-align:left;color:var(--text);font-weight:500}.rates-table tbody tr:last-child td{border-bottom:none}.rates-table tbody tr:hover td{background:#ffffff05}.rates-table tbody tr:hover td:first-child{color:#fff}.mono{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--text)}.val-nbu-usd{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--nbu-usd)}.val-nbu-eur{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--nbu-eur)}.val-pb-usd-buy{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--pb-usd-buy)}.val-pb-usd-sell{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--pb-usd-sell)}.val-pb-eur-buy{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--pb-eur-buy)}.val-pb-eur-sell{font-family:JetBrains Mono,monospace;font-size:12.5px;color:var(--pb-eur-sell)}.empty{color:var(--text-dim)}.loading-state,.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;height:200px;color:var(--text-dim);font-size:13px}.empty-state{height:100px}.spinner{width:28px;height:28px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;box-shadow:0 0 14px var(--accent-glow)}@keyframes spin{to{transform:rotate(360deg)}}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--accent)}
