.page-navigation-feedback {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: var(--page-navigation-main-left, 0);
  z-index: 120;
  overflow: hidden;
  color: var(--text, #f1f8f2);
  background:
    linear-gradient(rgba(5, 15, 17, 0.94), rgba(5, 12, 14, 0.97)),
    var(--site-background-image) center / cover no-repeat;
  opacity: 0;
  pointer-events: none;
}

.page-navigation-feedback[hidden] { display: none; }
.page-navigation-feedback.is-visible { opacity: 1; }

.page-navigation-feedback-shell {
  width: 100%;
  max-width: 1920px;
  min-height: 100%;
  margin: 0 auto;
  padding: 40px clamp(22px, 3.5vw, 52px) 54px;
}

.page-navigation-feedback-header {
  display: grid;
  max-width: 720px;
  gap: 8px;
}

.page-navigation-feedback-eyebrow {
  color: var(--accent, #b9ff46);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.page-navigation-feedback-title {
  color: rgba(246, 250, 250, 0.98);
  font-size: clamp(34px, 4.2vw, 54px);
  line-height: 1.05;
}

.page-navigation-feedback-subtitle {
  color: rgba(191, 205, 207, 0.7);
  font-size: 12px;
}

.page-navigation-feedback-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin-top: 34px;
}

.page-navigation-feedback-summary > span {
  display: grid;
  min-height: 112px;
  align-content: center;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(var(--accent-rgb), 0.1);
  border-radius: 16px;
  background: rgba(8, 18, 20, 0.78);
}

.page-navigation-feedback[data-target='history'] .page-navigation-feedback-summary > span:nth-child(n + 5) {
  display: none;
}

.page-navigation-feedback-summary i,
.page-navigation-feedback-summary b {
  display: block;
  height: 9px;
  border-radius: 999px;
  background: rgba(205, 220, 221, 0.12);
}

.page-navigation-feedback-summary i { width: 42%; }
.page-navigation-feedback-summary b { width: 66%; height: 20px; }

.page-navigation-feedback-content {
  display: grid;
  min-height: 330px;
  margin-top: 18px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  background: rgba(4, 12, 14, 0.68);
}

.page-navigation-feedback-card {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 18px;
  color: rgba(241, 248, 242, 0.94);
  font-size: 14px;
  font-weight: 850;
}

.page-navigation-feedback.is-history-return {
  background: transparent;
}

.page-navigation-feedback.is-history-return .page-navigation-feedback-shell {
  display: grid;
  min-height: 100%;
  padding: 0;
  place-items: center;
}

.page-navigation-feedback.is-history-return :is(
  .page-navigation-feedback-header,
  .page-navigation-feedback-summary
) {
  display: none;
}

.page-navigation-feedback.is-history-return .page-navigation-feedback-content {
  min-height: 0;
  margin: 0;
  border: 0;
  background: transparent;
}

.page-navigation-feedback.is-history-return .page-navigation-feedback-card {
  min-height: 48px;
  border: 1px solid rgba(var(--accent-rgb), 0.2);
  border-radius: 14px;
  background: rgba(6, 16, 18, 0.96);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.26);
}

.page-navigation-feedback-spinner {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  border: 2px solid rgba(var(--accent-rgb), 0.2);
  border-top-color: var(--accent, #b9ff46);
  border-radius: 50%;
  animation: page-navigation-spin 620ms linear infinite;
}
.page-navigation-feedback-spinner img{display:none}

@media (min-width:901px){
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry{left:0;background:radial-gradient(circle at 50% 48%,rgba(75,186,255,.11),transparent 24%),radial-gradient(circle at 18% 8%,rgba(61,189,255,.12),transparent 31%),radial-gradient(circle at 86% 90%,rgba(151,92,255,.1),transparent 34%),linear-gradient(145deg,#071421 0%,#02060c 58%,#0c0819 100%)}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-shell{display:grid;min-height:100%;padding:0;place-items:center}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry :is(.page-navigation-feedback-header,.page-navigation-feedback-summary){display:none}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-content{min-height:0;margin:0;border:0;background:transparent}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-card{position:relative;display:grid;justify-items:center;gap:18px;min-width:260px;padding:34px;border:0;background:transparent;box-shadow:none;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC",sans-serif}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner{position:relative;width:76px;height:76px;border:0;border-radius:23px;background:#02070d;box-shadow:inset 0 1px rgba(255,255,255,.14),0 20px 52px rgba(0,0,0,.44),0 0 42px rgba(73,201,255,.18);animation:page-navigation-logo-breathe 1.8s cubic-bezier(.45,0,.2,1) infinite}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner img{display:block;width:100%;height:100%;border-radius:inherit}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::before,html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::after{content:"";position:absolute;top:50%;left:50%;width:176px;height:176px;border:1px solid rgba(102,218,255,.28);border-radius:50%;transform:translate(-50%,-50%);animation:page-navigation-entry-ring 1.8s linear infinite;pointer-events:none}
  html[data-entry-animation]:not([data-entry-animation="classic"]) .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::after{width:226px;height:226px;border-color:rgba(164,105,255,.16);animation-direction:reverse;animation-duration:2.6s}
  html[data-entry-animation="aurora"] .page-navigation-feedback.is-home-entry{background:radial-gradient(ellipse at 18% 18%,rgba(35,201,255,.25),transparent 38%),radial-gradient(ellipse at 82% 78%,rgba(115,69,255,.23),transparent 40%),linear-gradient(145deg,#071421,#02060c 58%,#0c0819)}
  html[data-entry-animation="liquid"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::before{width:210px;height:210px;border-radius:43% 57% 62% 38%/48% 41% 59% 52%;background:linear-gradient(145deg,rgba(89,207,255,.12),rgba(137,84,255,.08));backdrop-filter:blur(16px);animation:page-navigation-liquid 4s ease-in-out infinite}
  html[data-entry-animation="liquid"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::after{display:none}
  html[data-entry-animation="ink"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::before{width:240px;height:190px;border:0;border-radius:43% 57% 61% 39%/55% 38% 62% 45%;background:radial-gradient(circle at 34% 28%,rgba(47,78,96,.92),#02070b 68%);box-shadow:0 0 90px #000;mix-blend-mode:multiply;animation:page-navigation-ink 1.4s cubic-bezier(.16,1,.3,1) infinite alternate}
  html[data-entry-animation="ink"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::after{display:none}
  html[data-entry-animation="curtain"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::before{width:1px;height:58vh;border:0;border-radius:0;background:linear-gradient(transparent,#8fe7ff,transparent);box-shadow:0 0 36px rgba(90,218,255,.7);animation:page-navigation-curtain 1.5s ease-in-out infinite}
  html[data-entry-animation="curtain"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::after{display:none}
  html[data-entry-animation="orbit"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::before{width:260px;height:260px;animation-duration:5s}
  html[data-entry-animation="orbit"] .page-navigation-feedback.is-home-entry .page-navigation-feedback-spinner::after{width:360px;height:360px;animation-duration:8s}
}

.nav-item.is-navigation-pending {
  color: var(--accent-strong, #d8ff91);
  background: transparent;
  box-shadow: none;
}

.nav-current-page-feedback {
  min-width: 0;
  margin-left: auto;
  color: rgba(215, 232, 232, 0.72);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  opacity: 0;
  transform: translateX(-3px);
  transition: opacity 140ms ease, transform 180ms ease, color 140ms ease;
  white-space: nowrap;
}

.nav-item:is(
  .is-current-page-refreshing,
  .is-current-page-refresh-success,
  .is-current-page-refresh-error
) .nav-current-page-feedback {
  opacity: 1;
  transform: translateX(0);
}

.nav-item.is-current-page-refreshing .nav-dot {
  animation: current-page-refresh-pulse 720ms ease-in-out infinite;
}

.nav-item.is-current-page-refresh-success .nav-current-page-feedback {
  color: var(--accent-strong, #d8ff91);
}

.nav-item.is-current-page-refresh-error .nav-current-page-feedback {
  color: #ffb5b5;
}

.nav-item.is-current-page-tapped {
  animation: current-page-tap 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.home-first-frame-retry {
  min-width: 112px;
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid rgba(var(--accent-rgb), 0.28);
  border-radius: 11px;
  color: var(--accent-strong, #d8ff91);
  background: rgba(var(--accent-rgb), 0.08);
  cursor: pointer;
  font: inherit;
  font-weight: 850;
}

@keyframes page-navigation-spin { to { transform: rotate(1turn); } }
@keyframes page-navigation-logo-breathe{0%,100%{transform:scale(.985);filter:brightness(.94)}50%{transform:scale(1.035);filter:brightness(1.12)}}
@keyframes page-navigation-entry-ring{to{transform:translate(-50%,-50%) rotate(1turn)}}
@keyframes page-navigation-liquid{50%{transform:translate(-50%,-50%) rotate(180deg) scale(1.06);border-radius:61% 39% 43% 57%/38% 58% 42% 62%}}
@keyframes page-navigation-ink{from{opacity:.2;transform:translate(-50%,-50%) scale(.35) rotate(-16deg);filter:blur(12px)}to{opacity:.9;transform:translate(-50%,-50%) scale(1.15) rotate(7deg);filter:blur(1px)}}
@keyframes page-navigation-curtain{0%,100%{opacity:.24;transform:translate(-50%,-50%) scaleY(.35)}50%{opacity:1;transform:translate(-50%,-50%) scaleY(1)}}

@keyframes current-page-tap {
  0% { transform: scale(1); }
  48% { transform: scale(0.975); }
  100% { transform: scale(1); }
}

@keyframes current-page-refresh-pulse {
  0%, 100% { opacity: 0.55; transform: scale(0.82); }
  50% { opacity: 1; transform: scale(1.22); }
}

@media (max-width: 1200px) {
  .page-navigation-feedback-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-navigation-feedback[data-target='history'] .page-navigation-feedback-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .page-navigation-feedback-shell { padding: 86px 14px 28px; }
  .page-navigation-feedback-title { font-size: clamp(30px, 10vw, 42px); }
  .page-navigation-feedback-summary { gap: 8px; margin-top: 24px; }
  .page-navigation-feedback-summary > span { min-height: 88px; padding: 12px; }
  .page-navigation-feedback-content { min-height: 260px; margin-top: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .page-navigation-feedback-spinner { animation-duration: 1.2s; }
  .nav-item.is-current-page-tapped { animation: none; }
  .nav-item.is-current-page-refreshing .nav-dot { animation-duration: 1.4s; }
}
