/* =============================================================================
   SiMquality · Overlay de transição
   Loading "batimento cardíaco" usado entre login → home e personalizar → home.
   ============================================================================= */

.transicao-overlay {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: var(--bg);
    display: flex;
    align-items: center;
    justify-content: center;
}
.transicao-overlay.hidden { display: none; }

.transicao-loader { display: flex; flex-direction: column; align-items: center; gap: 20px; }

.transicao-orbit { width: 88px; height: 88px; color: var(--primary); }
.transicao-spin  { transform-box: fill-box; transform-origin: center; animation: transicaoSpin 2s cubic-bezier(0.5,0,0.5,1) infinite; }
@keyframes transicaoSpin { to { transform: rotate(360deg); } }
.transicao-core  { transform-box: fill-box; transform-origin: center; animation: transicaoPulse 1.3s ease-in-out infinite; }
@keyframes transicaoPulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(0.78); opacity: 0.65; } }

.transicao-word {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.7rem;
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--text-main);
}
.transicao-word b { color: var(--primary); font-weight: 700; }
.transicao-msg  { font-size: 0.85rem; color: var(--text-sub); margin: -6px 0 2px; }

.transicao-ecg { width: 200px; height: 42px; overflow: visible; }
.transicao-ecg-base {
    fill: none; stroke: var(--border-strong);
    stroke-width: 2;
    stroke-linejoin: round; stroke-linecap: round;
}
.transicao-ecg-pulse {
    fill: none; stroke: var(--primary);
    stroke-width: 2.6;
    stroke-linejoin: round; stroke-linecap: round;
    stroke-dasharray: 16 84;
    animation: transicaoEcg 1.5s linear infinite;
    filter: drop-shadow(0 0 3px var(--primary-soft));
}
@keyframes transicaoEcg { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }