/* ===== СЦЕНА: «Дышащий рынок» + дракон-страж ===== */
#mxBg { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.mx-grain { position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .05; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
body.light .mx-grain { opacity: .03; }
.main-content { position: relative; }
.mx-glow { position: absolute; left: -6%; right: -6%; top: -70px; height: 300px; z-index: -1; pointer-events: none; color: #d4af37; opacity: .2; filter: blur(40px); background: radial-gradient(50% 60% at 50% 50%, currentColor, transparent 72%); transition: color 2.5s; animation: mxGlow 8s ease-in-out infinite; }
body[data-mx-mood="bullish"] .mx-glow { color: #4ade80; } body[data-mx-mood="bearish"] .mx-glow { color: #f87171; }
body.light .mx-glow { opacity: .12; }
@keyframes mxGlow { 50% { opacity: .3; } }
.page-content .hero { position: relative; }
.page-content .hero > :not(.mx-line) { position: relative; z-index: 1; }
.mx-line { position: absolute; right: 0; top: 0; width: 62%; height: 100%; z-index: 0; pointer-events: none; overflow: visible; }
.mx-line path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.mx-line.on path { animation: mxDraw 2.6s cubic-bezier(.4,0,.2,1) forwards; }
@keyframes mxDraw { to { stroke-dashoffset: 0; } }
#mxFire { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 899; pointer-events: none; }
.mx-chips { position: fixed; right: 14px; bottom: 142px; z-index: 901; width: 0; height: 0; }
.mx-chip { position: absolute; right: 0; bottom: 0; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 1px solid var(--gold-line, rgba(212,175,55,.45)); border-radius: 999px; background: #17140c; color: #fff; font-size: 12px; font-weight: 600; cursor: pointer; transform: translate(var(--dx), var(--dy)); animation: mxRise 1.1s cubic-bezier(.22,1,.36,1) both; box-shadow: 0 6px 20px rgba(0,0,0,.45); }
.mx-chip i { color: #ff8a2a; } .mx-chip.up b { color: var(--green, #4ade80); } .mx-chip.down b { color: var(--red, #f87171); }
.mx-chip:hover { border-color: var(--gold, #d4af37); }
body.light .mx-chip { background: #fff; color: #141414; }
@keyframes mxRise { from { opacity: 0; transform: translate(0,0) scale(.8); } }
@media (max-width: 760px) { .mx-line { width: 100%; opacity: .6; } }
@media (prefers-reduced-motion: reduce) { .mx-glow { animation: none !important; } .mx-line path { stroke-dashoffset: 0; } .mx-chip { animation: none; } }


/* ===== ГЛУБИНА: сияние в цвет рынка + стеклянные панели ===== */
.mx-aurora { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; --mx-mood: 212,175,55; }
body[data-mx-mood="bullish"] .mx-aurora { --mx-mood: 74,222,128; }
body[data-mx-mood="bearish"] .mx-aurora { --mx-mood: 248,113,113; }
.mx-aurora::before, .mx-aurora::after { content: ''; position: absolute; border-radius: 50%; filter: blur(110px); will-change: transform; }
.mx-aurora::before { width: 62vw; height: 56vh; left: -14vw; top: -18vh; background: radial-gradient(closest-side, rgba(212,175,55,.26), transparent); animation: mxDrift1 46s ease-in-out infinite alternate; }
.mx-aurora::after { width: 58vw; height: 60vh; right: -16vw; bottom: -22vh; background: radial-gradient(closest-side, rgba(var(--mx-mood),.22), transparent); animation: mxDrift2 54s ease-in-out infinite alternate; transition: background 2s; }
@keyframes mxDrift1 { to { transform: translate(14vw, 10vh) scale(1.15); } }
@keyframes mxDrift2 { to { transform: translate(-12vw, -8vh) scale(1.1); } }
body.light .mx-aurora::before, body.light .mx-aurora::after { opacity: .55; }

/* стеклянные панели: мягкий градиент, внутренний блик и золотая кромка сверху */
.sidebar, .top-cards, .table-wrapper, .mxd-hero {
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 24px 48px -28px rgba(0,0,0,.7);
}
body.light .sidebar, body.light .top-cards, body.light .table-wrapper, body.light .mxd-hero {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)) !important;
  box-shadow: inset 0 1px 0 #fff, 0 18px 40px -26px rgba(0,0,0,.25);
}
.top-cards { position: relative; }
.top-cards::before, .sidebar::before {
  content: ''; position: absolute; top: 0; left: 8%; right: 8%; height: 1px; z-index: 2; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(245,217,122,.55), transparent);
}
/* карточки ориентиров: при наведении снизу поднимается золотое свечение */
.top-card { position: relative; overflow: hidden; }
.top-card::after { content: ''; position: absolute; left: 0; right: 0; bottom: -60%; height: 100%; pointer-events: none;
  background: radial-gradient(60% 50% at 50% 100%, rgba(212,175,55,.16), transparent); opacity: 0; transition: opacity .25s cubic-bezier(.2,.8,.2,1), transform .25s cubic-bezier(.2,.8,.2,1); transform: translateY(12px); }
.top-card:hover::after { opacity: 1; transform: none; }
.top-card-price { letter-spacing: -.01em; text-shadow: 0 0 24px rgba(212,175,55,.12); }
/* строка таблицы: мягкий золотой градиент слева направо */
.market-table tbody tr:hover { background: linear-gradient(90deg, rgba(212,175,55,.10), rgba(212,175,55,.02) 60%, transparent) !important; }
/* активный фильтр-чип светится */
.filter-chip.active { box-shadow: 0 0 0 1px rgba(245,217,122,.5), 0 6px 22px -6px rgba(212,175,55,.55); }
@media (prefers-reduced-motion: reduce) { .mx-aurora::before, .mx-aurora::after { animation: none; } }
/* на телефонах: aurora без движения и с меньшим размытием, зерно выключено — экономим батарею */
@media (max-width: 760px) { .mx-aurora::before, .mx-aurora::after { animation: none; filter: blur(70px); } .mx-grain { display: none; } }


/* ===== Карта рынка ===== */
.mxh-head { margin-top: 22px; display: flex; justify-content: space-between; align-items: center; }
.mxh-right { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--text-secondary); }
.mxh-stat b.up { color: var(--green, #4ade80); } .mxh-stat b.down { color: var(--red, #f87171); }
.mxh-tf { display: inline-flex; padding: 2px; border: 1px solid var(--mx-line); border-radius: 8px; }
.mxh-tf button { border: 0; background: none; color: var(--text-secondary); font: 600 11px var(--mx-f-ui); padding: 4px 10px; border-radius: 6px; cursor: pointer; }
.mxh-tf button.on { background: var(--gold, #d4af37); color: #17130a; }
.mxh-wrap { position: relative; margin-bottom: 22px; padding: 6px; border: 1px solid var(--mx-line); border-radius: var(--mx-r);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 24px 48px -28px rgba(0,0,0,.7); }
.mxh-map { position: relative; height: 340px; }
.mxh-tile { position: absolute; box-sizing: border-box; border: 2px solid #0f0f0e; border-radius: 6px; padding: 4px 6px; overflow: hidden; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; color: #fff; font-family: var(--mx-f-ui); text-align: center;
  transition: filter .15s, transform .15s; }
.mxh-tile:hover { filter: brightness(1.35); z-index: 2; box-shadow: 0 0 0 1px rgba(245,217,122,.8); }
.mxh-tile b { font-size: 11px; font-weight: 800; letter-spacing: .02em; line-height: 1.1; }
.mxh-tile b.lg { font-size: 17px; }
.mxh-tile span { font-size: 10px; font-weight: 600; opacity: .9; }
.mxh-tile em { font-style: normal; font-size: 10px; opacity: .65; }
body.light .mxh-tile { border-color: #f4f5f7; }
body.light .mxh-wrap { background: rgba(255,255,255,.85); }
@media (max-width: 760px) { .mxh-map { height: 260px; } .mxh-stat { display: none; } }


/* ===== ДЕКОР: парящие монеты, HUD-уголки, орнамент заголовков ===== */
.page-content .hero > .mxc-coins { position: absolute; left: 40%; right: 26%; top: -6px; bottom: 6px; z-index: 0 !important; pointer-events: none; }
/* монета плавает внутри зоны .mxc-coins: kyrs-decor.js задаёт transform (куда плыть) и --mxc-t (за сколько секунд) */
.mxc-coin { position: absolute; left: 0; top: 0; border-radius: 50%; will-change: transform; transition: translate .6s cubic-bezier(.2,.7,.2,1), transform var(--mxc-t, 14s) cubic-bezier(.45,0,.55,1); }
.mxc-coin img { width: 100%; height: 100%; border-radius: 50%; display: block; box-shadow: 0 10px 30px -6px rgba(0,0,0,.8), 0 0 26px -4px rgba(212,175,55,.45); }
.mxc-coin::after { content: ''; position: absolute; inset: -5px; border-radius: 50%; border: 1px solid rgba(245,217,122,.22); }
@media (max-width: 1100px) { .mxc-coins { display: none; } }

/* HUD-уголки: золотые скобки, чуть вынесенные за край панели */
.mxh-wrap::after, .sidebar::after {
  content: ''; position: absolute; inset: -5px; pointer-events: none; z-index: 3; --c: rgba(245,217,122,.7); --l: 16px;
  background:
    linear-gradient(var(--c),var(--c)) top left / var(--l) 1.5px, linear-gradient(var(--c),var(--c)) top left / 1.5px var(--l),
    linear-gradient(var(--c),var(--c)) top right / var(--l) 1.5px, linear-gradient(var(--c),var(--c)) top right / 1.5px var(--l),
    linear-gradient(var(--c),var(--c)) bottom left / var(--l) 1.5px, linear-gradient(var(--c),var(--c)) bottom left / 1.5px var(--l),
    linear-gradient(var(--c),var(--c)) bottom right / var(--l) 1.5px, linear-gradient(var(--c),var(--c)) bottom right / 1.5px var(--l);
  background-repeat: no-repeat; opacity: .75;
}
.sidebar { overflow: visible !important; }
.sidebar > .sidebar-card:first-child { border-top-left-radius: var(--mx-r); border-top-right-radius: var(--mx-r); }
body.light .mxh-wrap::after, body.light .sidebar::after { --c: rgba(160,125,30,.7); }

/* заголовки секций: золотая линия до правого края с ромбом на конце */
.strip-title { flex: 1; color: var(--text-color); }
.strip-title > i { color: var(--gold, #d4af37); }
.strip-title::after { content: ''; flex: 1; height: 1px; margin-left: 8px; min-width: 40px;
  background: linear-gradient(90deg, rgba(212,175,55,.5), rgba(212,175,55,.08)); }
.strip-head { position: relative; }
.strip-title::before { content: ''; order: 9; width: 5px; height: 5px; transform: rotate(45deg); background: rgba(212,175,55,.55); margin-left: -2px; }

.mx-chip .fa-arrow-trend-up { color: var(--green, #4ade80); }
.mx-chip-title { background: var(--gold, #d4af37); border-color: var(--gold, #d4af37); color: #17130a; }
.mx-chip-title i { color: #17130a; font-size: 10px; }
body.light .mx-chip-title { color: #17130a; }
/* 13.10.2026: светлая тема — плитки «Карты рынка» полупрозрачные на белом (бледные), белый текст не читался → тёмный */
body.light .mxh-tile { color: #14161a; text-shadow: none; }