/* US Dept of the Treasury — a live national-debt counter (real value from the
   Treasury "Debt to the Penny" API, ticking up) + falling cash. Hidden until the
   egg activates (body.egg-on); stops at 7s.
   (loads only on /org/united-states-department-of-the-treasury) */

#debt-panel {
    position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%);
    z-index: 9999; pointer-events: none; text-align: center;
    background: rgba(4, 10, 6, 0.9); border: 1px solid #1c5a2a; border-radius: 10px;
    padding: 0.7rem 1.3rem; box-shadow: 0 0 30px rgba(57, 255, 20, 0.25);
    max-width: 94vw; opacity: 0; transition: opacity 0.5s ease;
}
body.egg-on #debt-panel { opacity: 1; }
#debt-panel .lbl { font-size: 0.62rem; letter-spacing: 0.28em; color: #6abf6a; }
#debt-num {
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: clamp(1.5rem, 6vw, 3rem); font-weight: 800; letter-spacing: 0.04em;
    color: #39ff14; text-shadow: 0 0 8px rgba(57, 255, 20, 0.85), 0 0 22px rgba(40, 200, 16, 0.5);
    font-variant-numeric: tabular-nums;
}
#debt-panel .sub { font-size: 0.66rem; color: #8fb894; margin-top: 0.18rem; }

#debt-cash {
    position: fixed; inset: 0; z-index: 9997; pointer-events: none; overflow: hidden;
}
#debt-cash span {
    position: absolute; top: -40px; font-size: 1.6rem;
    animation-name: cash-fall; animation-timing-function: linear; animation-iteration-count: infinite;
    animation-play-state: paused;   /* paused until the egg activates */
}
body.egg-on #debt-cash span { animation-play-state: running; }
#debt-cash span:nth-child(1) { left: 12%; animation-duration: 6.5s; animation-delay: 0s;   }
#debt-cash span:nth-child(2) { left: 28%; animation-duration: 8s;   animation-delay: 1.5s; }
#debt-cash span:nth-child(3) { left: 45%; animation-duration: 5.5s; animation-delay: 0.8s; }
#debt-cash span:nth-child(4) { left: 63%; animation-duration: 7.5s; animation-delay: 2.2s; }
#debt-cash span:nth-child(5) { left: 78%; animation-duration: 6s;   animation-delay: 0.4s; }
#debt-cash span:nth-child(6) { left: 90%; animation-duration: 8.5s; animation-delay: 3s;   }

@keyframes cash-fall {
    0%   { transform: translateY(0) rotate(0deg);   opacity: 0; }
    10%  { opacity: 0.9; }
    90%  { opacity: 0.9; }
    100% { transform: translateY(104vh) rotate(420deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    #debt-cash span { animation: none; display: none; }
}
