/* DragonToons M09 / Central de atualizacoes — CSS isolado e responsivo */
.dt-updates-launch {
  position: fixed; top: 88px; right: max(16px, env(safe-area-inset-right, 0px));
  z-index: 199; display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid rgba(79,226,239,.46); border-radius: 999px;
  padding: 10px 15px; color: #eafafa; background: #101c26;
  box-shadow: 0 10px 28px rgba(0,0,0,.4); font: 600 14px system-ui,sans-serif;
  cursor: pointer; max-width: calc(100vw - 32px)
}
.dt-updates-launch:hover,.dt-updates-launch:focus-visible { outline: 2px solid #4fe2ef; outline-offset: 3px; }
.dt-updates-unread {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px;
  color: #071318; background: #4fe2ef; font-size: 12px; font-weight: 800;
}
.dt-updates-unread[hidden] { display: none !important; }
.dt-updates-dialog {
  box-sizing: border-box; width: min(94vw, 580px); max-height: min(85vh, 720px);
  padding: 0; border: 1px solid rgba(79,226,239,.4); border-radius: 20px;
  color: #ebf8fa; background: #101923; box-shadow: 0 28px 75px #000a;
  font: 400 15px/1.6 system-ui,sans-serif; overflow-y: auto;
}
.dt-updates-dialog::backdrop { background: rgba(1,8,14,.74); }
.dt-updates-heading {
  position: sticky; top: 0; z-index: 1; display: flex; align-items: center;
  justify-content: space-between; gap: 16px; padding: 20px 22px 12px;
  border-bottom: 1px solid #38505c; background: #101923;
}
.dt-updates-heading h2 { margin: 0; font-size: 21px; line-height: 1.25; color: #e8fafa; flex: 1; }
.dt-updates-site-icon { display: block; width: 42px; height: 42px; object-fit: contain; border-radius: 9px; flex: none; }
.dt-updates-close,.dt-updates-optin-button {
  padding: 8px 14px; border-radius: 10px; border: 1px solid #4fb7c2;
  color: #e8fbfb; background: #1c3840; cursor: pointer; font-size: 14px;
}
.dt-updates-close:focus-visible,.dt-updates-link:focus-visible,.dt-updates-optin-button:focus-visible {
  outline: 2px solid #4fe2ef; outline-offset: 3px;
}
.dt-updates-intro,.dt-updates-status { margin: 10px 22px; color: #bbd0d8; }
.dt-updates-status { font-size: 13px; }
.dt-updates-list { list-style: none; padding: 0 22px 8px; margin: 0; display: grid; gap: 12px; }
.dt-updates-entry { padding: 15px 17px; background: #192833; border: 1px solid #2a4854; border-radius: 13px; }
.dt-updates-date { display: block; font-size: 12px; color: #81dae4; }
.dt-updates-entry h3 { margin: 5px 0; font-size: 17px; color: #fff; }
.dt-updates-author { margin: 2px 0 6px !important; color: #88ecf3 !important; font-size: 13px; font-weight: 700; }
.dt-updates-entry p { margin: 0 0 9px; color: #c4d6db; }
.dt-updates-link { color: #85ebf3; font-weight: 700; text-decoration: underline; }
.dt-updates-optin { margin: 6px 22px 22px; border-top: 1px solid #30414a; padding-top: 12px; }
.dt-updates-optin p { margin: 0 0 12px; font-size: 13px; color: #bcd0d8; }
.dt-updates-optin-button[disabled] { opacity: .6; cursor: not-allowed; }
@media (max-width: 600px) {
  .dt-updates-launch { top: auto; bottom: max(18px, env(safe-area-inset-bottom, 0px)); right: 15px; padding: 10px 13px; }
  .dt-updates-dialog { width: 94vw; max-height: 80dvh; }
  .dt-updates-heading { padding: 16px; }
  .dt-updates-heading h2 { font-size: 18px; }
  .dt-updates-intro,.dt-updates-status { margin-left: 16px; margin-right: 16px; }
  .dt-updates-list { padding-left: 16px; padding-right: 16px; }
  .dt-updates-optin { margin-left: 16px; margin-right: 16px; }
}
@media (prefers-reduced-motion: reduce) { .dt-updates-dialog { scroll-behavior: auto; } }