/* DevHub Responsive v6 — camada de correção segura, carregada por último. */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: hidden; -webkit-text-size-adjust: 100%; }
body { min-width: 0; overflow-x: hidden; }
img, video, iframe, canvas, svg { max-width: 100%; }
button, input, select, textarea { max-width: 100%; }
pre, code { overflow-wrap: anywhere; }

/* Contêineres flex/grid não podem forçar a largura da viewport. */
.console-page main, .console-page .workspace, .console-page .console-content,
.admin-page main, .docs-page .docs-main, .chat-studio, .chat-main,
.studio-toolbar, .studio-canvas, .studio-composer, .panel, .card { min-width: 0; }

/* Chat: evita toolbar estourando e composer cortado em tablets. */
#view-playground .chat-studio { min-width: 0; max-width: 100%; }
.chat-main .studio-toolbar { min-width: 0; flex-wrap: wrap; }
.chat-main .studio-brand { min-width: 0; flex: 1 1 150px; }
.chat-main .studio-selects { min-width: 0; max-width: 100%; flex: 1 1 260px; }
.chat-main .studio-selects select, .chat-main .model-switch { min-width: 0; max-width: 100%; }
.chat-main .studio-composer { max-width: calc(100% - 20px); }
.chat-main #prompt { width: 100%; max-width: 100%; resize: vertical; }
.chat-bubble, .chat-bubble-content, .chat-answer { max-width: 100%; overflow-wrap: anywhere; }

/* Conteúdo tabular: rolagem local, nunca na página inteira. */
.scroll, .table-wrap, .docs-main pre { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 760px) {
  .topbar { padding-left: max(14px, env(safe-area-inset-left)); padding-right: max(14px, env(safe-area-inset-right)); }
  .console-page .console-content, .console-page .workspace { width: 100%; max-width: 100%; }
  .console-page .sidebar { max-width: 100vw; overflow: hidden; }
  .console-page .sidebar nav { width: 100%; padding-bottom: 2px; }
  .console-page .nav-link { flex: 0 0 auto; white-space: nowrap; }
  .console-page .studio-toolbar { align-items: stretch; }
  .console-page .studio-brand, .console-page .studio-selects { flex-basis: 100%; width: 100%; }
  .console-page .studio-selects { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .console-page .studio-selects label { min-width: 0; width: 100%; }
  .console-page .studio-selects select { width: 100%; }
  #view-playground .chat-studio { min-height: 0; height: auto; }
  .chat-main .studio-canvas { width: 100%; min-height: 360px; height: auto; max-height: none; }
  .chat-main .studio-composer { width: calc(100% - 16px); max-width: calc(100% - 16px); margin-left: 8px; margin-right: 8px; }
  .composer-tools, .composer-footer, .dialog-actions { flex-wrap: wrap; }
  .composer-tools > *, .composer-footer > * { min-width: 0; }
  .console-page .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .console-page .metric, .console-page .panel, .console-page .card { min-width: 0; }
  dialog { width: calc(100vw - 24px); max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); overflow: auto; }
  .admin-page .section-head, .admin-page header { flex-wrap: wrap; }
  .admin-page #search { flex-wrap: wrap; }
  .admin-page #search input { flex: 1 1 180px; }
}

@media (max-width: 480px) {
  .topbar { gap: 9px; }
  .topbar-actions { min-width: 0; flex-wrap: wrap; justify-content: flex-end; }
  .console-page .console-content { padding-left: 12px; padding-right: 12px; }
  .console-page .panel { padding: 14px; }
  .console-page .metrics { gap: 7px; }
  .console-page .metric { padding: 13px 10px; min-height: 112px; }
  .console-page .studio-selects { grid-template-columns: 1fr; }
  .chat-main .studio-canvas { padding: 16px 11px; }
  .chat-main .studio-intro h2 { font-size: clamp(24px, 8vw, 30px); }
  .chat-main .studio-composer { padding: 9px 10px 8px !important; }
  .chat-main #prompt { font-size: 13px; min-height: 72px; }
  .console-page .package-list { grid-template-columns: 1fr; }
  .admin-page main { padding-left: 12px; padding-right: 12px; }
  .admin-page .card { padding: 12px; }
  .docs-page .docs-main { width: calc(100% - 24px); }
}

@media (max-width: 340px) {
  .console-page .metrics { grid-template-columns: 1fr; }
  .topbar .brand { font-size: 14px; }
  .topbar-actions .button, .topbar-actions a { padding-left: 8px; padding-right: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}