[data-logout] {
  min-width: 48px;
  min-height: 42px;
  border: 2px solid #0BFF01;
  background: #000000;
  color: #0BFF01;
  font-family: "VT323", monospace;
  font-size: 0.55rem;
  cursor: pointer;
}

.staff-mode-control {
  position: fixed !important;
  top: 8px;
  right: max(14px, calc((100vw - 1100px) / 2));
  z-index: 1500 !important;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border: 2px solid #0BFF01;
  background: #000000;
  color: #FEFCE5;
  font-family: "VT323", monospace;
  font-size: 1.1rem;
  min-width: 150px;
  height: 42px;
  white-space: nowrap;
}

.staff-management-link {
  position: fixed !important;
  top: 8px;
  right: max(180px, calc((100vw - 1100px) / 2 + 166px));
  z-index: 1500 !important;
  min-height: 38px;
  padding: 8px 10px;
  border: 2px solid #0BFF01;
  background: #000000;
  color: #FEFCE5;
  font-family: "VT323", monospace;
  font-size: 1.05rem;
  min-width: 150px;
  height: 42px;
  white-space: nowrap;
}

.staff-management-link:hover { background: #0BFF01; color: #000000; }

.staff-mode-control input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #0BFF01;
}

.staff-mode-control strong {
  color: #0BFF01;
}

@media (max-width: 760px) {
  .staff-mode-control {
    position: absolute;
    top: 6px;
    right: 10px;
    font-size: 1rem;
  }

  .staff-management-link {
    right: 180px;
  }
}

[data-guest-only][hidden],
[data-auth-only][hidden],
[data-logout][hidden] {
  display: none !important;
}

[data-logout]:hover,
[data-logout]:focus-visible {
  background: #0BFF01;
  color: #000000;
}

.logout-playing::after {
  content: "DECONNEXION...";
  position: fixed;
  inset: 0;
  z-index: 999;
  display: grid;
  place-items: center;
  background: #000000;
  color: #0BFF01;
  font-family: "VT323", monospace;
  font-size: clamp(0.7rem, 2vw, 1rem);
  letter-spacing: 0.1em;
  animation: logoutFlash 1.1s steps(2, end) forwards;
}

@keyframes logoutFlash {
  0%, 45% { opacity: 1; }
  46%, 100% { opacity: 0; }
}

.hive-dialog-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0, 0, 0, 0.88);
}

.hive-dialog {
  width: min(440px, 100%);
  padding: 22px;
  border: 3px solid #0BFF01;
  background: #000000;
  color: #FEFCE5;
  box-shadow: 8px 8px 0 rgba(11, 255, 1, 0.25);
  font-family: "VT323", monospace;
  font-size: 1.25rem;
}

.hive-dialog strong {
  color: #0BFF01;
  font-family: "VT323", monospace;
  font-size: 0.62rem;
}

.hive-dialog p { margin: 20px 0; line-height: 1.4; }
.hive-dialog-input { width: 100%; min-height: 44px; padding: 10px; border: 2px solid #0BFF01; background: #000000; color: #FEFCE5; font: inherit; }
.hive-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; }
.hive-dialog-button { padding: 10px 14px; border: 2px solid #0BFF01; background: #0BFF01; color: #000000; cursor: pointer; font-family: "VT323", monospace; font-size: 0.5rem; }
.hive-dialog-button.secondary { background: #000000; color: #FEFCE5; }