/* ===========================================================
   Launch celebration: sticky bottom bar, bunting ribbon edge and the
   full-screen ribbons/sparkles canvas (assets/js/launch.js). The bar is
   always dark navy with gold/cream text, so it reads the same in the
   light, evening and dark themes.
   =========================================================== */
:root { --launch-h: 0px; }

.launch-fx {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: 90; pointer-events: none; display: none;
}
.launch-fx.is-on { display: block; }

.launch-bar {
  padding: 0; margin: 0;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
  color: #FBF3D9;
  background: linear-gradient(100deg, #061A3E 0%, #0B2F6B 55%, #123A82 100%);
  border-top: 2px solid #F0D77B;
  box-shadow: 0 -14px 34px rgba(6, 26, 62, .35);
  transform: translateY(110%); transition: transform .55s cubic-bezier(.2, .9, .25, 1);
}
.launch-bar[hidden] { display: none; }
.launch-bar.is-in { transform: translateY(0); }

/* Bunting: a string of little pennants in the Khalsa colours along the top edge. */
.launch-bunting {
  position: absolute; left: 0; right: 0; top: -17px; height: 16px; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='16' viewBox='0 0 120 16'%3E%3Cpath d='M0 0h120' stroke='%23F0D77B' stroke-width='2'/%3E%3Cpath d='M2 1l14 0-7 14z' fill='%23F0D77B'/%3E%3Cpath d='M26 1l14 0-7 14z' fill='%23E8821E'/%3E%3Cpath d='M50 1l14 0-7 14z' fill='%23FFFFFF'/%3E%3Cpath d='M74 1l14 0-7 14z' fill='%23123A82'/%3E%3Cpath d='M98 1l14 0-7 14z' fill='%23F0D77B'/%3E%3C/svg%3E");
  background-repeat: repeat-x; background-size: 120px 16px;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25));
  animation: launchSway 4.5s ease-in-out infinite; transform-origin: 50% 0;
}
@keyframes launchSway { 0%, 100% { transform: skewX(0); } 50% { transform: skewX(-1.2deg); } }

/* A slow shimmer of light across the bar. */
.launch-bar::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 35%, rgba(240, 215, 123, .16) 50%, transparent 65%);
  background-size: 250% 100%; animation: launchShine 5.5s linear infinite;
}
@keyframes launchShine { from { background-position: 160% 0; } to { background-position: -90% 0; } }

.launch-inner {
  position: relative; z-index: 1; max-width: 1180px; margin: 0 auto;
  display: flex; align-items: center; gap: 16px; padding: 12px 56px 12px 22px;
}
.launch-ik { font-size: 30px; line-height: 1; color: #F0D77B; flex-shrink: 0; }
.launch-copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.launch-title { font: 600 17px/1.25 'Jost', sans-serif; letter-spacing: .01em; color: #F0D77B; }
.launch-text { font-size: 13px; line-height: 1.5; color: #E4E9F5; }

.launch-btn {
  flex-shrink: 0; cursor: pointer; border: 0; border-radius: 999px; padding: 11px 22px;
  font: 600 14px 'Poppins', sans-serif; color: #231a02;
  background: linear-gradient(135deg, #F0D77B, #C9A227);
  box-shadow: 0 8px 22px rgba(201, 162, 39, .45);
  transition: transform .18s, box-shadow .18s;
  animation: launchPulse 2.6s ease-in-out infinite;
}
.launch-btn:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 12px 28px rgba(240, 215, 123, .55); }
.launch-btn:focus-visible, .launch-close:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 3px; }
@keyframes launchPulse { 0%, 100% { box-shadow: 0 8px 22px rgba(201, 162, 39, .45), 0 0 0 0 rgba(240, 215, 123, .5); } 50% { box-shadow: 0 8px 22px rgba(201, 162, 39, .45), 0 0 0 10px rgba(240, 215, 123, 0); } }

.launch-close {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; border-radius: 50%; cursor: pointer;
  border: 1px solid rgba(240, 215, 123, .5); background: rgba(255, 255, 255, .08);
  color: #FBF3D9; font-size: 20px; line-height: 1;
}
.launch-close:hover { background: rgba(255, 255, 255, .18); }

/* The bar must never cover content or the floating radio button / mini player. */
body.has-launch-bar { padding-bottom: var(--launch-h); }
body.has-launch-bar .float-radio { bottom: calc(var(--launch-h) + 22px); }
body.has-launch-bar .mini-player { bottom: calc(var(--launch-h) + 16px); }

@media (max-width: 720px) {
  .launch-inner { flex-wrap: nowrap; gap: 10px; padding: 10px 50px 11px 14px; }
  .launch-ik, .launch-text { display: none; }
  .launch-copy { flex: 1; }
  .launch-title { font-size: 14.5px; }
  .launch-btn { width: auto; padding: 9px 14px; font-size: 13px; }
  .launch-close { right: 10px; width: 30px; height: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .launch-bar { transition: none; }
  .launch-bunting, .launch-bar::after, .launch-btn { animation: none; }
}

@media print { .launch-bar, .launch-fx { display: none !important; } }

/* Reduced motion: the button gives a single soft glow instead of ribbons. */
.launch-bar.is-pulse { animation: launchGlow 1.1s ease-out 1; }
@keyframes launchGlow { 0% { box-shadow: 0 -14px 34px rgba(6, 26, 62, .35), 0 0 0 0 rgba(240, 215, 123, .7); } 100% { box-shadow: 0 -14px 34px rgba(6, 26, 62, .35), 0 0 0 28px rgba(240, 215, 123, 0); } }
