:root {
  --neko-bg-main: #08040b;
  --neko-bg-base: #100716;
  --neko-bg-card: #170b20;
  --neko-bg-hover: #2a1538;
  --neko-border: #51206c;
  --neko-primary: #aa2ed3;
  --neko-primary-strong: #dc55f3;
  --neko-text: #fff8ff;
  --neko-muted: #c9b8d2;
}

#neko-access-gate {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  box-sizing: border-box;
  padding: 40px;
  color: #fff;
  text-align: center;
  background: radial-gradient(circle at center, #25102f 0%, #0a050d 58%, #050207 100%);
  font-family: Arial, sans-serif;
}

#neko-access-gate img { width: 148px; height: 148px; object-fit: contain; }
#neko-access-gate h1 { margin: 0; font-size: 42px; }
#neko-access-gate p { margin: 0; max-width: 720px; color: #d5cddd; font-size: 23px; line-height: 1.45; }
#neko-access-gate.neko-access-error p { color: #ffb4b4; }

.neko-access-spinner {
  width: 48px;
  height: 48px;
  border: 5px solid rgba(255,255,255,.2);
  border-top-color: #d63cff;
  border-radius: 50%;
  animation: neko-access-spin .85s linear infinite;
}

@keyframes neko-access-spin { to { transform: rotate(360deg); } }

html, body, #root {
  background: var(--neko-bg-main) !important;
  color: var(--neko-text) !important;
  scroll-behavior: auto !important;
}

[class*="header"], [class*="navbar"], [class*="sidebar"] {
  border-color: rgba(81, 32, 108, .75) !important;
}

[class*="popup"], [class*="modal"], [role="dialog"], [class*="keyboard"] {
  border-color: var(--neko-border) !important;
}

/* Foco estável para controles de TV. */
button, [role="button"], input, select, textarea, [tabindex] {
  transition: none !important;
}

button:focus-visible, [role="button"]:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible,
button:focus, [role="button"]:focus {
  outline: .18rem solid var(--neko-primary-strong) !important;
  outline-offset: .15rem !important;
  box-shadow: none !important;
  transform: none !important;
}

button.active, [class*="button"].active, [class*="btn"].active,
[class*="selected"], [class*="focused"] {
  border-color: var(--neko-primary-strong) !important;
}

[class*="loader"], [class*="spinner"] { border-top-color: var(--neko-primary-strong) !important; }
[class*="progress"] [class*="bar"], [class*="timeline"] [class*="progress"] { background: var(--neko-primary-strong) !important; }

/* Ícones locais fornecidos por all.min.css; a imagem de marca permanece a logo NekoPlayer. */
.neko-fa-icon {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: currentColor;
  object-fit: initial !important;
  background: none !important;
}

[class*="menu"] .neko-fa-icon,
[class*="settings"] .neko-fa-icon,
[class*="button"] .neko-fa-icon {
  min-width: 1.15em;
  font-size: 1.8rem;
  line-height: 1;
}

/* O controle extra de versões anteriores foi removido; o app usa apenas o Back nativo. */
#neko-back-button { display: none !important; }
[class*="back"], [class*="arrow-left"] {
  animation: none !important;
  transition: none !important;
}

.neko-device-code-row { position: relative !important; }

.neko-device-code-value {
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  color: inherit;
  font: inherit;
  text-align: right;
}

/* Rodapé da tela Adicionar playlist: texto e QR ficam em áreas independentes. */
body.neko-add-playlist-open .neko-add-playlist-footer {
  box-sizing: border-box !important;
  position: fixed !important;
  left: 2rem !important;
  right: 2rem !important;
  bottom: 1.5rem !important;
  width: auto !important;
  max-width: none !important;
  min-height: 9.5rem !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(25rem, 34rem) !important;
  gap: 2rem !important;
  align-items: end !important;
  overflow: visible !important;
  z-index: 120 !important;
}

body.neko-add-playlist-open .neko-add-device-column {
  box-sizing: border-box !important;
  position: relative !important;
  min-height: 9.5rem !important;
  min-width: 0 !important;
  padding-right: 11rem !important;
  overflow: visible !important;
}

body.neko-add-playlist-open .neko-qr-host {
  box-sizing: border-box !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 9.5rem !important;
  height: 9.5rem !important;
  padding: .35rem !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border-radius: .4rem !important;
}

body.neko-add-playlist-open .neko-generated-qr {
  display: block !important;
  position: static !important;
  width: 8.8rem !important;
  height: 8.8rem !important;
  max-width: 8.8rem !important;
  max-height: 8.8rem !important;
  margin: 0 auto !important;
  background: #fff !important;
}

/* Bloqueio de licença expirada. */
#neko-expired-block {
  position: fixed;
  inset: 0;
  z-index: 65000;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  padding: 4rem;
  background: radial-gradient(circle at 25% 20%, #351246 0, #120719 38%, #070309 100%);
  color: var(--neko-text);
  font-family: Arial, sans-serif;
}

.neko-expired-card {
  width: 76rem;
  max-width: 94vw;
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr) 15rem;
  gap: 2.4rem;
  align-items: center;
  box-sizing: border-box;
  padding: 2.5rem;
  border: .12rem solid var(--neko-border);
  border-radius: 1.2rem;
  background: rgba(17, 8, 23, .97);
  box-shadow: 0 1rem 4rem rgba(0, 0, 0, .55);
}

.neko-expired-logo {
  width: 8rem;
  height: 8rem;
  object-fit: contain;
}

.neko-expired-copy h1 {
  margin: 0 0 .8rem;
  font-size: 2.5rem;
}

.neko-expired-copy p {
  margin: .6rem 0 1.1rem;
  color: var(--neko-muted);
  font-size: 1.25rem;
  line-height: 1.45;
}

.neko-expired-copy dl { margin: 1rem 0; }
.neko-expired-copy dl > div { display: flex; gap: 1rem; margin: .45rem 0; }
.neko-expired-copy dt { min-width: 9rem; color: var(--neko-muted); }
.neko-expired-copy dd { margin: 0; font-weight: 700; }

.neko-expired-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}

.neko-expired-actions button,
#neko-loading-recovery button {
  min-height: 3rem;
  padding: .6rem 1rem;
  border: .12rem solid var(--neko-primary);
  border-radius: .55rem;
  background: #24102f;
  color: var(--neko-text);
  font-size: 1rem;
}

.neko-expired-qr {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .7rem;
  color: var(--neko-muted);
  text-align: center;
}

.neko-expired-qr canvas {
  width: 14rem !important;
  height: 14rem !important;
  padding: .4rem;
  border-radius: .55rem;
  background: #fff;
}

/* Recuperação de carregamento que excedeu o limite. */
.neko-loading-timed-out { visibility: hidden !important; }

#neko-loading-recovery {
  position: fixed;
  inset: 0;
  z-index: 64000;
  display: grid;
  place-items: center;
  background: rgba(5, 2, 7, .92);
  color: var(--neko-text);
  font-family: Arial, sans-serif;
}

#neko-loading-recovery > div {
  width: 36rem;
  max-width: 86vw;
  padding: 2.4rem;
  border: .12rem solid var(--neko-border);
  border-radius: 1rem;
  background: var(--neko-bg-card);
  text-align: center;
}

#neko-loading-recovery i { color: #f3c545; font-size: 2.8rem; }
#neko-loading-recovery h2 { margin: .9rem 0 .5rem; }
#neko-loading-recovery p { color: var(--neko-muted); }
#neko-loading-recovery button { margin: .8rem .4rem 0; }

@media (max-width: 1100px) {
  .neko-expired-card {
    grid-template-columns: 6rem minmax(0, 1fr) 11rem;
    gap: 1.4rem;
  }
  .neko-expired-logo { width: 6rem; height: 6rem; }
  .neko-expired-qr canvas { width: 10rem !important; height: 10rem !important; }
}