/* © 2026 bladept696 — Centro de Comando / Hash Commander. Todos os direitos reservados.
   é proibido copiar, modificar, redistribuir ou publicar este ficheiro, no todo ou em parte, sem autorização escrita do autor.
   https://github.com/bladept696/centro-de-comando-v3 */
  /* ===== Cadeia de blocos ao estilo mempool.space ===== */
  .blocks-scroll.mp-chain{ position:relative; align-items:flex-start; gap:14px; padding:6px 10px 16px; }
  .mp-block{ flex:0 0 auto; width:132px; display:flex; flex-direction:column; align-items:center; gap:8px; }
  /* Cubo 3D escuro: a frente é o próprio .mp-cube; ::before é o topo e ::after a lateral.
     O "líquido" (cor da taxa) enche a frente e a lateral até --fill-h. */
  @property --fill-h{ syntax:'<percentage>'; inherits:true; initial-value:0%; }
  .mp-block{ padding-top:13px; }
  .mp-cube{
    position:relative; width:132px; height:132px; border-radius:2px;
    background:linear-gradient(170deg, color-mix(in srgb, var(--panel-2) 78%, #000), color-mix(in srgb, var(--deep) 55%, #000));
    border:1px solid var(--line-strong);
    box-shadow:0 16px 26px -16px #000;
    transition:transform .3s cubic-bezier(.16,1,.3,1), --fill-h 1.1s cubic-bezier(.22,1,.36,1);
  }
  .mp-cube::before{
    content:''; position:absolute; left:-1px; right:-1px; top:-13px; height:12px;
    transform-origin:bottom left; transform:skewX(-45deg);
    background:linear-gradient(90deg, color-mix(in srgb, var(--panel-2) 70%, #000), color-mix(in srgb, var(--panel-2) 95%, #fff)); border:1px solid var(--line-strong); border-bottom:none;
  }
  .mp-cube::after{
    content:''; position:absolute; top:-1px; bottom:-1px; right:-14px; width:12px;
    transform-origin:top left; transform:skewY(-45deg);
    background:linear-gradient(to top, color-mix(in srgb, var(--liq, #3bb7a8) 32%, #060a0e) 0 var(--fill-h), color-mix(in srgb, var(--deep) 70%, #000) var(--fill-h));
    border:1px solid var(--line-strong); border-left:none;
  }
  .mp-block:hover .mp-cube{ transform:translateY(-4px); }
  .mp-fill{
    position:absolute; left:0; right:0; bottom:0; height:var(--fill-h,0%);
    background:var(--fill-bg); transition:height 1.1s cubic-bezier(.22,1,.36,1);
  }
  .mp-fill::before{ content:''; position:absolute; left:0; right:0; top:0; height:2px; background:var(--liq, #ffffff55); box-shadow:0 0 8px var(--liq, transparent); }
  .mp-face{
    position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:3px; text-align:center; padding:6px; text-shadow:0 1px 3px #000d;
  }
  .mp-h{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px; color:var(--cyan); }
  .mp-fee{ font-size:13px; font-weight:700; }
  .mp-range{ font-size:10px; color:var(--text); opacity:.8; }
  .mp-tx{ font-size:11px; color:var(--text); margin-top:2px; }
  .mp-foot{ display:flex; align-items:center; justify-content:center; gap:6px; font-size:10px; color:var(--muted); max-width:132px; min-height:16px; }
  .mp-foot .mp-pool{ color:var(--cyan); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mp-foot img{ width:16px; height:16px; border-radius:4px; background:#081119; object-fit:contain; flex:0 0 auto; }
  .mp-time{ font-size:10px; color:var(--muted-2); }
  .mp-pending .mp-cube{ border-style:dashed; background:linear-gradient(170deg, color-mix(in srgb, var(--panel) 80%, #000), color-mix(in srgb, var(--deep) 60%, #000)); }
  .mp-pending .mp-cube::before, .mp-pending .mp-cube::after{ opacity:.75; }
  .mp-pending .mp-foot{ color:var(--amber); font-weight:600; }
  .mp-pending.mp-next .mp-cube{ border-color:var(--amber); animation:mpNextPulse 2.4s ease-in-out infinite; }
  .mp-tip .mp-cube{ border-color:var(--green-dim); animation:mpTipGlow 2.4s ease-in-out infinite; }
  .mp-sep{ flex:0 0 auto; align-self:stretch; min-width:70px; display:flex; flex-direction:column; align-items:center; gap:6px; }
  .mp-sep-line{ flex:1; min-height:110px; border-left:2px dashed var(--amber); opacity:.7; }
  .mp-sep-lbl{ font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--amber); white-space:nowrap; }
  .mp-sep-time{ color:var(--muted); letter-spacing:0; text-transform:none; }
  @keyframes mpNextPulse{
    0%,100%{ box-shadow:0 16px 26px -16px #000, 0 0 0 0 var(--amber-dim); }
    50%{ box-shadow:0 16px 26px -16px #000, 0 0 20px -2px var(--amber-dim); }
  }
  @keyframes mpTipGlow{
    0%,100%{ box-shadow:0 16px 26px -16px #000, 0 0 0 1px var(--green-dim); }
    50%{ box-shadow:0 16px 26px -16px #000, 0 0 0 1px var(--green-dim), 0 0 22px -4px var(--green-dim); }
  }
  /* Bloco novo: cai para a cadeia e pisca a verde uma vez */
  .mp-new{ animation:mpDrop .7s cubic-bezier(.22,1,.36,1) both; }
  .mp-new .mp-cube{ animation:mpNewFlash 1.6s ease-out .1s backwards; }
  .mp-new.mp-tip .mp-cube{ animation:mpNewFlash 1.6s ease-out .1s backwards, mpTipGlow 2.4s ease-in-out 1.7s infinite; }
  @keyframes mpDrop{ 0%{ opacity:0; transform:translateX(-46px) scale(.85); } 100%{ opacity:1; transform:none; } }
  @keyframes mpNewFlash{
    0%{ box-shadow:0 16px 26px -16px #000, 0 0 0 1px var(--green), 0 0 0 var(--green-dim); }
    35%{ box-shadow:0 16px 26px -16px #000, 0 0 0 1px var(--green), 0 0 36px 2px var(--green-dim); }
    100%{ box-shadow:0 16px 26px -16px #000, 0 0 0 1px transparent, 0 0 0 transparent; }
  }
  /* Medidor de "proximidade": topo = dificuldade do bloco, pontos = melhor share de cada máquina */
  .mp-face.mp-has-gauge{ padding-right:30px; }
  .mp-gauge{
    position:absolute; right:7px; top:9px; bottom:9px; width:20px; border-radius:6px;
    background:linear-gradient(to top, #ffffff08, #ffb02026); border:1px solid #ffffff1a;
  }
  .mp-gauge::before{
    content:''; position:absolute; left:-1px; right:-1px; top:-2px; height:2px; background:var(--amber);
    box-shadow:0 0 6px var(--amber); border-radius:2px;
  }
  .mp-dot{
    position:absolute; width:8px; height:8px; margin-bottom:-4px; border-radius:50%;
    background:var(--dot-c); box-shadow:0 0 7px var(--dot-c); animation:mpDotPop .6s cubic-bezier(.22,1,.36,1) both;
  }
  .mp-dot.mp-dot-shared{ background:transparent; border:2px solid var(--dot-c); box-shadow:none; }
  @keyframes mpDotPop{ 0%{ transform:scale(0); } 100%{ transform:scale(1); } }
  .mp-mybest{ font-size:10px; color:var(--amber); min-height:14px; font-weight:600; }
  .mp-legend{ display:flex; gap:12px; flex-wrap:wrap; font-size:10px; color:var(--muted); }
  .mp-legend i{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px; vertical-align:middle; background:var(--dot-c); box-shadow:0 0 6px var(--dot-c); }
  @media (prefers-reduced-motion: reduce){
    .mp-new, .mp-new .mp-cube, .mp-tip .mp-cube, .mp-pending.mp-next .mp-cube{ animation:none !important; }
    .mp-fill{ transition:none; }
  }

  .body-grid{
    display:grid;
    grid-template-columns: 280px minmax(0,1fr);
    gap:16px;
    padding:16px;
  }
  .body-grid > *{min-width:0;}
  /* minmax(0,1fr): um filho largo (faixa de blocos, tabelas) não alarga a coluna para além do ecrã do telemóvel */
  @media(max-width:900px){ .body-grid{grid-template-columns:minmax(0,1fr);} }

  .panel{
    background:var(--panel);
    border:1px solid var(--line-strong);
    border-radius:10px;
    padding:16px;
  }
  .panel-title{
    font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    color:var(--muted); margin:0 0 14px 0; display:flex; justify-content:space-between; align-items:center;
  }

