.restart-banner {
  position: fixed;
  inset: auto 0 0;
  z-index: 1100;
  background: #2d4939;
  color: #fff;
  border-top: 1px solid #b9c9b5;
  box-shadow: 0 -8px 24px rgba(28, 52, 38, .18);
  font-family: Tajawal, sans-serif;
}

.restart-banner__inner {
  max-width: 1200px;
  margin: auto;
  padding: 11px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
}

.restart-banner__message {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-size: 17px;
  line-height: 1.4;
  text-align: center;
}

.restart-banner__message strong { font-weight: 800; }
.restart-banner__message span { color: #e3ecdf; }

.restart-banner__countdown {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
}

.restart-banner__countdown-label { margin-inline-end: 4px; color: #e3ecdf; }
.restart-banner__countdown-part { display: inline-flex; align-items: baseline; gap: 2px; }
.restart-banner__countdown-part b { font-size: 17px; font-variant-numeric: tabular-nums; }
.restart-banner__countdown-part small { font-size: 11px; color: #e3ecdf; }

.restart-banner__link {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: none;
  padding: 8px 18px;
  min-height: 42px;
  border-radius: 10px;
  background: #f5f3e8;
  color: #2d4939;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color .2s ease, transform .2s ease;
}

.restart-banner__link::after {
  content: '';
  position: absolute;
  inset: -30% auto -30% -45%;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .85), transparent);
  transform: translateX(-100%) skewX(-24deg);
  animation: restart-banner-shine 3.5s ease-in-out infinite;
  pointer-events: none;
}

@keyframes restart-banner-shine {
  0%, 35% { transform: translateX(-100%) skewX(-24deg); }
  70%, 100% { transform: translateX(750%) skewX(-24deg); }
}

.restart-banner__link:hover { background: #fff; transform: translateY(-2px); }
.restart-banner__link:focus-visible { outline: 3px solid #e9d9a6; outline-offset: 3px; }
body:has(> .restart-banner) { padding-bottom: 78px; }

@media (max-width: 900px) {
  .restart-banner__inner { flex-wrap: wrap; gap: 5px 18px; }
  .restart-banner__message { width: 100%; justify-content: center; }
  body:has(> .restart-banner) { padding-bottom: 106px; }
}

@media (max-width: 640px) {
  .restart-banner__inner { flex-direction: column; gap: 5px; padding: 8px 12px 10px; }
  .restart-banner__message { gap: 7px; font-size: 14px; }
  .restart-banner__countdown { font-size: 12px; }
  .restart-banner__countdown-part b { font-size: 15px; }
  .restart-banner__link { min-height: 38px; width: min(100%, 330px); font-size: 14px; }
  body:has(> .restart-banner) { padding-bottom: 134px; }
}

@media (max-width: 360px) {
  .restart-banner__message { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .restart-banner__link { transition: none; }
  .restart-banner__link::after { animation: none; }
}