/* Loading splash — same retro window language as the popup (#mail-popup). */
#splash {
  position: fixed;
  inset: 0;
  z-index: 3000;
  background: #01353e;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  font-family: "Inter", system-ui, sans-serif;
  transition: opacity 0.5s ease;
}
#splash.sp-hide { opacity: 0; pointer-events: none; }

#splash .splash-window {
  width: min(560px, 92vw);
  background: #0051c6;
  border-radius: 12px;
  padding: 6px;
  box-shadow: -10px 10px 0 0 #042049;
  display: flex;
  flex-direction: column;
}
#splash .sp-edge { display: block; width: 100%; height: 6px; }
#splash .sp-edge img { display: block; width: 100%; height: 100%; }
#splash .sp-edge-b { transform: rotate(180deg); padding-right: 10px; mix-blend-mode: multiply; }

#splash .sp-titlebar { display: flex; align-items: center; gap: 20px; padding: 10px 20px; }
#splash .sp-dots { width: 69.64px; height: 17.82px; flex: none; }
#splash .sp-dots img { display: block; width: 100%; height: 100%; }
#splash .sp-title { margin: 0; font-size: 24px; color: #fff; white-space: nowrap; flex: none; }
#splash .sp-pin { flex: 1 0 0; min-width: 0; height: 17.82px; mix-blend-mode: multiply; }
#splash .sp-pin img { display: block; width: 100%; height: 100%; }

#splash .sp-panelwrap { padding: 10px 20px 16px; width: 100%; }
#splash .sp-panel {
  background: #fff;
  border-radius: 5px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
#splash .sp-line {
  margin: 0;
  font-family: "OCR A Std", "Share Tech Mono", "Courier New", monospace;
  font-size: 16px;
  line-height: 1.4;
  color: #0051c6;
  text-decoration: underline;
}
#splash .sp-sub { color: #000; text-decoration: none; }

#splash .sp-track {
  position: relative;
  height: 22px;
  background: rgba(86, 247, 126, 0.22);
  border-radius: 11px;
  overflow: hidden;
}
#splash .sp-fill {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 0%;
  background: #56f77e;
  border-right: 2px solid #0051c6;
  border-radius: 11px;
  transition: width 0.3s ease;
}
#splash .sp-pct {
  margin: 0;
  align-self: flex-end;
  font-family: "OCR A Std", "Share Tech Mono", "Courier New", monospace;
  font-size: 16px;
  color: #0051c6;
}
@media (max-width: 768px) {
  #splash .sp-panel { padding: 24px; }
  #splash .sp-title { font-size: 20px; }
  #splash .sp-line { font-size: 13px; }
}