/* V160 | Return of Midgard launch widgets (lighter, lower, more scenic).
   Isolated CSS: does not alter the V158 hero logo, episode heading, or account controls.
   Wide desktop: upper-left + upper-right. Smaller layouts: accessible strip below nav. */
.rom-launch-widgets {
  position: absolute;
  z-index: 8;
  top: 48px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0 clamp(18px, 1.8vw, 38px);
  gap: 16px;
  pointer-events: none;
}
.rom-launch-widgets *, .rom-launch-widgets *::before, .rom-launch-widgets *::after {
  box-sizing: border-box;
}
.rom-launch-widgets > * { pointer-events: auto; }
.rom-launch-countdown, .rom-pre-reg-stat {
  color: #fff9e9;
  background: linear-gradient(145deg, rgba(8, 31, 50, .58), rgba(11, 37, 59, .39));
  border: 1px solid rgba(230, 194, 126, .47);
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(5, 20, 34, .16), inset 0 1px 0 rgba(255, 255, 255, .13);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  text-shadow: 0 1px 3px rgba(0,0,0,.65);
}
.rom-launch-countdown {
  flex: 0 0 296px;
  width: 296px;
  padding: 9px 12px 10px;
  text-align: center;
}
.rom-launch-kicker {
  margin: 0 0 4px;
  color: #e8cd93;
  font: 700 8px/1.4 Georgia, serif;
  letter-spacing: .21em;
}
.rom-launch-units {
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  border-top: 1px solid rgba(234, 207, 150, .25);
  padding-top: 5px;
}
.rom-launch-unit {
  min-width: 0;
  flex: 1 1 25%;
  padding: 1px 4px 2px;
  text-align: center;
}
.rom-launch-unit:not(:last-child) { border-right: 1px solid rgba(231, 208, 163, .31); }
.rom-launch-unit strong {
  display: block;
  font: 700 28px/1.08 Georgia, 'Times New Roman', serif;
  color: #fff6d9;
  font-variant-numeric: tabular-nums;
}
.rom-launch-unit span {
  display: block;
  padding-top: 3px;
  color: #d6e0e8;
  font: 700 8px/1.15 Arial, sans-serif;
  letter-spacing: .045em;
}
.rom-launch-date {
  display: block;
  margin-top: 8px;
  border-top: 1px solid rgba(234, 207, 150, .25);
  padding-top: 7px;
  white-space: nowrap;
  color: #f2dca9;
  font: 600 11px/1.2 Georgia, serif;
  letter-spacing: .015em;
}
.rom-pre-reg { flex: 0 0 218px; width: 218px; text-align: center; }
.rom-pre-reg-stat { padding: 9px 10px 11px; }
.rom-pre-reg-total {
  display: block;
  color: #f4d89d;
  font: 700 36px/1.05 Georgia, serif;
  font-variant-numeric: tabular-nums;
}
.rom-pre-reg-label {
  display: block;
  margin-top: 3px;
  font: 700 10px/1.3 Arial, sans-serif;
  letter-spacing: .12em;
  color: #f5f3ed;
}
.rom-pre-reg-action {
  display: block;
  margin-top: 7px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #d8b36e;
  background: linear-gradient(180deg, rgba(147, 104, 52, .75), rgba(83, 55, 35, .68));
  color: #fff7e1 !important;
  text-decoration: none !important;
  text-align: center;
  font: 700 10px/1.35 Georgia, serif;
  letter-spacing: .1em;
  box-shadow: 0 3px 9px rgba(5, 20, 34, .14), inset 0 1px rgba(255,255,255,.21);
  text-shadow: 0 1px 3px rgba(0,0,0,.5);
}
.rom-pre-reg-action:hover, .rom-pre-reg-action:focus-visible {
  background: linear-gradient(180deg, #b78a4c, #735332);
  color: #fff !important;
  outline-color: #fff1ca;
}
/* On narrower desktops there isn't enough room beside the existing logo and title.
   Keep the V158 header untouched: show cards below the navigation instead. */
@media (max-width: 1539px) {
  .rom-launch-widgets {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    z-index: 2;
    margin: 0 auto;
    padding: 12px 16px 4px;
    max-width: 960px;
    width: 100%;
    align-items: stretch;
  }
  .rom-launch-countdown { flex: 0 1 355px; width: 355px; }
  .rom-pre-reg { flex: 0 1 235px; width: 235px; }
}
@media (max-width: 650px) {
  .rom-launch-widgets {
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px 1px;
  }
  .rom-launch-countdown, .rom-pre-reg { width: 100%; flex: 0 0 auto; }
  .rom-pre-reg { display: grid; grid-template-columns: 1fr auto; gap: 9px; align-items: stretch; }
  .rom-pre-reg-stat { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
  .rom-pre-reg-total { font-size: 25px; }
  .rom-pre-reg-label { font-size: 8px; }
  .rom-pre-reg-action { margin-top: 0; display: flex; align-items: center; justify-content: center; max-width: 160px; }
}
@media (max-width: 360px) {
  .rom-launch-countdown { padding-left: 8px; padding-right: 8px; }
  .rom-launch-unit strong { font-size: 24px; }
  .rom-launch-date { font-size: 10px; }
  .rom-pre-reg-action { padding: 7px 8px; font-size: 9px; }
}

/* V164 | Scroll-following counters on desktop, original placement at the top.
   Mobile/tablet (<1200px) retain the previous normal flow. */
@media (min-width: 1200px) {
  .rom-launch-widgets.rom-launch-is-floating {
    position: fixed !important;
    top: 14px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 clamp(12px, 1.8vw, 32px) !important;
    z-index: 90 !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    pointer-events: none;
  }
  .rom-launch-is-floating > .rom-launch-countdown {
    flex: 0 0 260px;
    width: 260px;
    padding: 7px 9px 8px;
  }
  .rom-launch-is-floating .rom-launch-unit strong { font-size: 24px; }
  .rom-launch-is-floating .rom-launch-date { margin-top: 5px; padding-top: 5px; font-size: 10px; }
  .rom-launch-is-floating > .rom-pre-reg { flex: 0 0 185px; width: 185px; }
  .rom-launch-is-floating .rom-pre-reg-stat { padding: 6px 8px 7px; }
  .rom-launch-is-floating .rom-pre-reg-total { font-size: 29px; }
  .rom-launch-is-floating .rom-pre-reg-action { margin-top: 4px; padding: 6px 8px; }
  .rom-launch-is-floating .rom-launch-countdown,
  .rom-launch-is-floating .rom-pre-reg-stat {
    background: linear-gradient(145deg, rgba(8,31,50,.48), rgba(11,37,59,.33));
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }
}