/* DVCOIN HOLOGRAPHIC ECONOMY MAP v1.4
   Canonical public state + separately labeled event-driven sandbox TEST DVC movement. */

.holoEconomy{
  position:relative;overflow:hidden;margin:22px 0 28px;padding:18px;border:1px solid rgba(113,246,200,.15);
  border-radius:24px;background:
    radial-gradient(circle at 50% 42%,rgba(113,246,200,.07),transparent 24%),
    radial-gradient(circle at 85% 14%,rgba(124,140,255,.08),transparent 24%),
    linear-gradient(145deg,rgba(5,18,27,.965),rgba(2,9,14,.99));
  box-shadow:0 34px 100px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.03)
}
.holoEconomy:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;
  background-image:
    linear-gradient(rgba(113,246,200,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(124,140,255,.055) 1px,transparent 1px);
  background-size:34px 34px;mask-image:radial-gradient(circle at 50% 46%,black,transparent 82%)
}
.holoEconomyHead{position:relative;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:13px}
.holoEconomyHead h2{font-size:clamp(24px,3vw,42px);line-height:.98;letter-spacing:-.045em;margin:5px 0 7px}
.holoEconomyHead p{max-width:820px;color:#8ea1ab;font-size:10px;line-height:1.55;margin:0}
.holoLiveBadge{display:flex;align-items:center;gap:7px;white-space:nowrap;border:1px solid rgba(113,246,200,.2);border-radius:999px;padding:8px 10px;background:rgba(113,246,200,.035);font:900 7px ui-monospace,monospace;letter-spacing:.1em;color:#9cefd1}
.holoLiveBadge i{width:7px;height:7px;border-radius:50%;background:#71F6C8;box-shadow:0 0 14px #71F6C8;animation:holoPulse 1.4s ease-in-out infinite}
.holoEconomyGrid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:12px}
.holoMapShell{position:relative;min-height:610px;border:1px solid rgba(113,246,200,.11);border-radius:20px;overflow:hidden;background:
  radial-gradient(circle at 50% 50%,rgba(113,246,200,.045),transparent 29%),
  linear-gradient(180deg,rgba(2,9,15,.74),rgba(2,7,12,.92))}
#economyMapCanvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.holoMapOverlay{position:absolute;inset:0;pointer-events:none}
.holoMapTitle{position:absolute;left:12px;top:11px;display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:999px;background:rgba(3,11,17,.64);border:1px solid rgba(113,246,200,.09);backdrop-filter:blur(10px);font:850 6px ui-monospace,monospace;letter-spacing:.11em;color:#68808a}
.holoMapTitle b{color:#b8fff0}.holoMapTitle i{width:5px;height:5px;border-radius:50%;background:#71F6C8;box-shadow:0 0 9px #71F6C8}
.holoMapLegend{position:absolute;left:12px;bottom:11px;display:flex;gap:6px;flex-wrap:wrap;max-width:75%}
.holoMapLegend span{display:flex;align-items:center;gap:5px;padding:5px 7px;border-radius:999px;background:rgba(2,8,13,.66);border:1px solid rgba(255,255,255,.06);backdrop-filter:blur(8px);font:800 5.5px ui-monospace,monospace;letter-spacing:.08em;color:#68808a}
.holoMapLegend i{width:6px;height:6px;border-radius:50%}.holoMapLegend .canonical i{background:#71F6C8;box-shadow:0 0 8px #71F6C8}.holoMapLegend .simulation i{background:#7C8CFF;box-shadow:0 0 8px #7C8CFF}.holoMapLegend .locked i{background:#D7AA55}
.holoMapMetrics{position:absolute;right:12px;top:12px;display:grid;gap:5px;width:min(180px,36%)}
.holoMapMetrics>span{display:grid;grid-template-columns:1fr auto;gap:8px;padding:7px 8px;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(2,8,13,.68);backdrop-filter:blur(10px)}
.holoMapMetrics small{font:800 5.5px ui-monospace,monospace;letter-spacing:.08em;color:#647b86}.holoMapMetrics b{font:900 8px ui-monospace,monospace;color:#eafffb;text-align:right}
.holoSide{display:grid;grid-template-rows:auto 1fr auto;gap:10px;min-width:0}
.holoSideCard{border:1px solid rgba(255,255,255,.075);border-radius:16px;padding:12px;background:linear-gradient(145deg,rgba(8,24,35,.82),rgba(3,11,17,.92));overflow:hidden}
.holoSideCard h3{font-size:13px;margin:3px 0}.holoSideCard>p{font-size:8px;color:#71858e;margin:0}
.holoMovement{position:relative;min-height:114px}
.holoMovementPulse{position:absolute;right:-14px;top:-18px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,rgba(113,246,200,.12),transparent 68%);animation:holoBreathe 2.5s ease-in-out infinite}
.holoMovement strong{display:block;font-size:clamp(19px,2vw,28px);letter-spacing:-.04em;margin-top:9px;max-width:80%}
.holoMovementMeta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.holoMovementMeta span{border:1px solid rgba(113,246,200,.11);border-radius:999px;padding:4px 6px;font:800 5.5px ui-monospace,monospace;letter-spacing:.08em;color:#758d97}
.holoReceiptList{display:grid;gap:6px;max-height:330px;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(113,246,200,.18) transparent}
.holoReceipt{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:8px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(1,7,11,.42)}
.holoReceipt>i{width:7px;height:7px;border-radius:50%}.holoReceipt.canonical>i{background:#71F6C8;box-shadow:0 0 10px #71F6C8}.holoReceipt.simulation>i,.holoReceipt.test>i{background:#7C8CFF;box-shadow:0 0 10px #7C8CFF}
.holoReceipt b,.holoReceipt small,.holoReceipt code{display:block}.holoReceipt b{font-size:8px}.holoReceipt small{font-size:6.5px;color:#667d87;margin-top:2px}.holoReceipt code{font-size:6px;color:#6c8791;text-align:right;max-width:72px;overflow:hidden;text-overflow:ellipsis}
.holoBoundary{font:800 5.8px ui-monospace,monospace;letter-spacing:.085em;line-height:1.45;color:#607782;text-transform:uppercase;border-top:1px solid rgba(255,255,255,.06);padding-top:9px}
.holoEmpty{padding:12px;border:1px dashed rgba(113,246,200,.09);border-radius:10px;color:#607782;font-size:8px}
.holoNodeStatus{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:9px}
.holoNodeStatus span{padding:7px;border:1px solid rgba(255,255,255,.055);border-radius:10px;background:rgba(0,0,0,.11)}
.holoNodeStatus small,.holoNodeStatus b{display:block}.holoNodeStatus small{font:800 5px ui-monospace,monospace;letter-spacing:.08em;color:#5f7781}.holoNodeStatus b{font-size:8px;margin-top:2px}
@keyframes holoPulse{0%,100%{opacity:.5;transform:scale(.86)}50%{opacity:1;transform:scale(1.12)}}
@keyframes holoBreathe{0%,100%{transform:scale(.88);opacity:.58}50%{transform:scale(1.12);opacity:1}}
@media(max-width:980px){.holoEconomyGrid{grid-template-columns:1fr}.holoMapShell{min-height:540px}.holoSide{grid-template-columns:1fr 1fr;grid-template-rows:auto}.holoSideCard:nth-child(2){grid-column:1/-1}.holoBoundary{grid-column:1/-1}}
@media(max-width:760px){.holoEconomy{padding:12px;border-radius:20px}.holoEconomyHead{flex-direction:column}.holoMapShell{min-height:490px}.holoMapMetrics{width:44%}.holoMapLegend{max-width:90%}.holoSide{display:grid;grid-template-columns:1fr}.holoSideCard:nth-child(2){grid-column:auto}.holoReceiptList{max-height:250px}}
@media(max-width:430px){.holoMapShell{min-height:455px}.holoMapMetrics{right:7px;top:7px;width:46%}.holoMapMetrics>span{padding:6px}.holoMapTitle{left:7px;top:7px}.holoMapLegend{left:7px;bottom:7px}.holoMapLegend span{font-size:5px}}
@media(prefers-reduced-motion:reduce){.holoLiveBadge i,.holoMovementPulse{animation:none!important}}