/* DevHub console v17: one viewport shell, one content scroller, explicit session visibility. */
body.console-page { --console-top:64px; --console-sidebar:220px; }
html body.console-page #authView.hidden,
html body.console-page #consoleView.hidden,
html body.console-page #consoleView[hidden],
html body.console-page #authView[hidden],
html body.console-page .view.hidden { display:none !important; }
body.console-page:not([data-session-state="ready"]) #consoleView,
body.console-page:not([data-session-state="ready"]) .mobile-dock,
body.console-page:not([data-session-state="ready"]) .mobile-more-dialog { display:none !important; }
body.console-page[data-session-state="ready"] #authView { display:none !important; }
body.console-page .topbar { height:var(--console-top) !important; min-height:var(--console-top) !important; box-sizing:border-box; position:sticky !important; top:0 !important; z-index:80 !important; }
body.console-page[data-session-state="ready"] { height:100dvh !important; overflow:hidden !important; }
body.console-page[data-session-state="ready"] #consoleView:not(.hidden) {
  display:grid !important; grid-template-columns:var(--console-sidebar) minmax(0,1fr) !important;
  grid-template-rows:minmax(0,1fr) !important; width:100% !important; max-width:none !important;
  height:calc(100dvh - var(--console-top)) !important; min-height:0 !important; max-height:none !important;
  margin:0 !important; overflow:hidden !important;
}
body.console-page #consoleView > .sidebar {
  grid-column:1 !important; grid-row:1 !important; display:flex !important; flex-direction:column !important;
  position:relative !important; top:auto !important; left:auto !important; bottom:auto !important;
  width:100% !important; min-width:0 !important; height:100% !important; min-height:0 !important; max-height:none !important;
  padding:18px 12px !important; overflow-x:hidden !important; overflow-y:auto !important;
  overscroll-behavior:contain; scrollbar-width:thin; border-right:1px solid #302b26;
}
body.console-page #consoleView > .console-content {
  grid-column:2 !important; grid-row:1 !important; display:block !important; position:relative !important;
  width:100% !important; max-width:none !important; margin:0 !important;
  height:100% !important; min-height:0 !important; max-height:none !important;
  padding:28px clamp(18px,3vw,44px) 30px !important; overflow-x:hidden !important; overflow-y:auto !important;
  overscroll-behavior:contain; scrollbar-gutter:stable; scroll-behavior:auto;
}
body.console-page #consoleView > .sidebar .workspace { flex:0 0 auto; margin:0 0 20px !important; }
body.console-page #consoleView > .sidebar .workspace div { min-width:0; }
body.console-page #consoleView > .sidebar #consoleNav { flex:0 0 auto; gap:5px !important; }
body.console-page #consoleView > .sidebar #consoleNav .nav-link { min-height:40px !important; padding:10px 12px !important; }
body.console-page #consoleView > .sidebar .sidebar-access { flex:0 0 auto; margin:22px 0 14px !important; }
body.console-page #consoleView > .sidebar .sidebar-foot { margin-top:auto !important; padding:18px 6px 0 !important; }
body.console-page .mobile-dock, body.console-page .mobile-more-dialog { display:none; }
body.console-page .welcome { margin-bottom:22px !important; }
body.console-page .console-footer { margin-top:24px; }
body.console-page.chat-mode #verificationBanner { display:none !important; }
body.console-page.chat-mode #consoleView > .console-content {
  display:flex !important; flex-direction:column !important; padding:12px !important;
  overflow:hidden !important; scrollbar-gutter:auto;
}
body.console-page.chat-mode .console-content > .welcome,
body.console-page.chat-mode .console-footer,
body.console-page.chat-mode .catalog-panel { display:none !important; }
body.console-page.chat-mode .console-content > .notice { flex:0 0 auto; margin:0 0 8px !important; max-height:84px; overflow:auto; }
body.console-page.chat-mode #view-playground:not(.hidden) {
  display:flex !important; flex:1 1 0 !important; flex-direction:column !important;
  min-height:0 !important; height:auto !important; overflow:hidden !important;
}
body.console-page #view-playground .chat-studio {
  display:grid !important; flex:1 1 0 !important; grid-template-columns:230px minmax(0,1fr) !important;
  grid-template-rows:minmax(0,1fr) !important; width:100% !important; height:100% !important;
  min-height:0 !important; max-height:none !important; overflow:hidden !important;
  border:1px solid #302b26 !important; border-radius:14px !important;
}
body.console-page #view-playground .chat-history {
  display:flex !important; flex-direction:column !important; grid-column:1; grid-row:1;
  width:100% !important; height:100% !important; min-width:0 !important; min-height:0 !important; max-height:none !important;
  gap:0 !important; padding:14px 10px !important; overflow:hidden !important; border-right:1px solid #302b26;
}
body.console-page #view-playground .chat-history-top { flex:0 0 auto; margin-bottom:12px; }
.chat-history-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.chat-history-heading > span { font:10px 'JetBrains Mono',monospace; letter-spacing:1px; color:#aaa49a; }
body.console-page #view-playground .chat-history-search { display:block !important; width:100%; margin:10px 0 0; min-height:34px; padding:8px 10px; font-size:12px; }
body.console-page #view-playground #chatList { flex:1 1 0; min-height:0; display:block; overflow:auto; scrollbar-width:thin; }
body.console-page #view-playground .chat-history > p { display:block !important; flex:0 0 auto; font-size:10px; color:#938d82; margin:12px 4px 0; }
.chat-room-row { display:flex; align-items:center; min-width:0; gap:4px; margin-bottom:6px; }
body.console-page #view-playground .chat-room-row .chat-room { flex:1 1 0; min-width:0; width:auto; max-width:none; padding:10px; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; font-size:12px; }
body.console-page #view-playground .chat-room-delete { display:grid !important; place-items:center; flex:0 0 30px; width:30px; height:34px; padding:0; border:0; border-radius:8px; background:transparent; color:#b2a798; cursor:pointer; font-size:19px; }
body.console-page #view-playground .chat-room-delete:hover { background:#382b23; color:#ffb37b; }
.chat-history-empty { color:#938d82; padding:10px; font-size:12px; }
body.console-page #view-playground .chat-main {
  display:flex !important; flex-direction:column !important; grid-column:2; grid-row:1;
  width:100% !important; height:100% !important; min-width:0 !important; min-height:0 !important; overflow:hidden !important;
}
body.console-page #view-playground .chat-main .studio-toolbar {
  display:flex !important; flex-direction:row !important; flex:0 0 auto !important; flex-wrap:nowrap !important; align-items:center !important;
  min-height:60px !important; height:auto !important; padding:10px 16px !important; gap:10px !important;
}
body.console-page #view-playground .studio-brand { flex:1 1 0 !important; min-width:0 !important; width:auto !important; }
body.console-page #view-playground .studio-brand strong { font-size:14px !important; }
body.console-page #view-playground .studio-brand small,
body.console-page #view-playground .studio-selects > .badge { display:none !important; }
body.console-page #view-playground #newChatTop { display:none !important; }
body.console-page #view-playground .studio-selects { display:flex !important; flex:0 1 auto !important; width:auto !important; max-width:65% !important; min-width:0 !important; }
body.console-page #view-playground .model-switch { display:flex; min-width:0 !important; max-width:100% !important; font-size:12px !important; }
body.console-page #view-playground #selectedModelName { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.console-page #view-playground .chat-main .studio-canvas {
  display:flex !important; flex-direction:column !important; align-items:stretch !important; justify-content:flex-start !important;
  flex:1 1 0 !important; width:100% !important; height:auto !important; min-height:0 !important; max-height:none !important;
  overflow-x:hidden !important; overflow-y:auto !important; padding:24px clamp(12px,4vw,48px) !important;
  overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#4a4037 transparent; scroll-behavior:auto !important;
}
body.console-page #view-playground .chat-main .studio-intro {
  flex:0 0 auto !important; width:100%; max-width:640px; min-height:0 !important;
  margin:auto !important; padding:14px 0 !important; overflow:visible !important;
}
body.console-page #view-playground .chat-main .studio-intro h2 { font-size:clamp(24px,3vw,34px) !important; }
body.console-page #view-playground .prompt-suggestions { display:flex; flex-wrap:wrap; gap:8px !important; }
body.console-page #view-playground .prompt-suggestions button { flex:1 1 150px; padding:10px !important; }
body.console-page #view-playground .chat-main .chat-messages { display:block !important; flex:0 0 auto !important; min-height:0; width:100% !important; max-width:820px !important; margin:0 auto !important; overflow:visible !important; }
body.console-page #view-playground .chat-bubble { min-width:0; margin-bottom:22px !important; font-size:14px; }
body.console-page #view-playground .chat-answer,body.console-page #view-playground .chat-bubble-content { overflow-wrap:anywhere; line-height:1.7; }
body.console-page #view-playground .chat-main .studio-composer {
  position:relative !important; z-index:5; flex:0 0 auto !important;
  width:calc(100% - 28px) !important; max-width:850px !important;
  margin:6px auto 12px !important; padding:12px 14px !important; border-radius:16px !important;
}
body.console-page #view-playground .composer-prompt { display:block; margin:0 !important; }
body.console-page #view-playground #prompt { font-size:14px !important; line-height:1.5 !important; min-height:50px !important; max-height:120px !important; padding:6px !important; resize:none !important; }
body.console-page #view-playground .composer-footer { display:flex !important; flex-wrap:nowrap !important; align-items:center !important; justify-content:space-between !important; gap:8px !important; padding-top:6px !important; }
body.console-page #view-playground .composer-tools { display:flex !important; flex-wrap:nowrap !important; min-width:0 !important; }
body.console-page #view-playground #modelPrice { display:none !important; }
body.console-page #view-playground .play-actions { display:flex !important; flex-wrap:nowrap !important; align-items:center; gap:8px !important; }
body.console-page #view-playground .chat-attach-row { display:none !important; }
body.console-page #view-playground .file-upload-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:36px; padding:0 10px; border:1px solid #383831; border-radius:10px; background:#20201c; color:#ded5c9; }
body.console-page #view-playground .file-upload-button svg,body.console-page #view-playground .voice-input svg { width:17px; height:17px; }
body.console-page #view-playground .file-upload-button span { font-size:12px; }
body.console-page #view-playground .voice-input { display:inline-grid; place-items:center; width:36px; height:36px; min-height:36px; padding:0; border:1px solid #383831; border-radius:10px; background:#20201c; color:#ded5c9; }
body.console-page #view-playground .voice-input.is-listening { background:#432a1b; border-color:#e9a068; color:#ffd2ad; }
body.console-page #view-playground .chat-status { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px; margin-top:8px; font-size:10px; color:#ada395; }
body.console-page #view-playground .chat-access { font-size:12px; max-height:70px; overflow:auto; }
.chat-image-previews,.chat-files-preview,.chat-file-list { display:flex; flex-wrap:wrap; gap:8px; }
.chat-image-previews,.chat-files-preview { max-height:84px; overflow:auto; padding:4px 0 6px; }
.chat-image-preview { position:relative; width:54px; height:54px; }
.chat-image-preview img { width:100%; height:100%; object-fit:cover; border-radius:8px; }
.chat-image-name { display:none; }
.chat-image-remove { position:absolute; top:-3px; right:-3px; width:22px; height:22px; border:0; border-radius:50%; background:#42291c; color:white; }
.chat-file-chip { display:flex; align-items:center; gap:7px; min-width:0; max-width:100%; padding:6px 8px; border:1px solid #40362d; border-radius:9px; background:#1e1915; font-size:12px; }
.chat-file-info { display:flex; flex-direction:column; min-width:0; }
.chat-file-name { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-file-size { font-size:10px; color:#a3988b; }
.chat-file-remove { border:0; background:transparent; color:#ccc; cursor:pointer; }
.chat-file-list { margin-top:8px; }
.chat-image-gallery { display:flex; flex-wrap:wrap; gap:10px; }
.chat-image-card { margin:10px 0; max-width:min(100%,560px); }
.chat-image-card img,.chat-inline-image { max-width:100%; max-height:50dvh; object-fit:contain; border-radius:12px; }
.chat-image-caption,.chat-image-missing { font-size:11px; color:#a69a8d; }
body.console-page #view-playground .chat-main .hidden { display:none !important; }
body.console-page.sidebar-collapsed { --console-sidebar:72px; }
body.console-page.sidebar-collapsed #consoleView > .sidebar .workspace > div,
body.console-page.sidebar-collapsed #consoleView > .sidebar .nav-text,
body.console-page.sidebar-collapsed #consoleView > .sidebar .sidebar-foot { display:none !important; }
body.console-page.sidebar-collapsed #consoleView > .sidebar .nav-link { justify-content:center; padding-inline:4px !important; }
body.console-page.sidebar-collapsed #consoleView > .sidebar .workspace { justify-content:center; }
@media (min-width:701px) and (max-width:1050px) {
  body.console-page { --console-sidebar:190px; }
  body.console-page.sidebar-collapsed { --console-sidebar:72px; }
  body.console-page #view-playground .chat-studio { grid-template-columns:185px minmax(0,1fr) !important; }
  body.console-page #view-playground .studio-toolbar { padding:8px 10px !important; }
}
@media (max-width:700px) {
  body.console-page[data-session-state="ready"] #consoleView:not(.hidden) { display:block !important; height:calc(100dvh - var(--console-top)) !important; padding-bottom:0 !important; }
  body.console-page #consoleView > .sidebar { display:none !important; }
  body.console-page #consoleView > .console-content { width:100% !important; margin:0 !important; height:100% !important; padding:16px 12px calc(88px + env(safe-area-inset-bottom)) !important; }
  body.console-page.chat-mode #consoleView > .console-content { padding:6px 6px calc(86px + env(safe-area-inset-bottom)) !important; }
  body.console-page .topbar { padding-inline:12px !important; gap:10px !important; }
  body.console-page .topbar-label,body.console-page .topbar-actions .text-link,body.console-page #environmentBadge { display:none !important; }
  body.console-page .topbar-actions { gap:6px !important; }
  body.console-page .topbar .brand { font-size:16px !important; }
  body.console-page[data-session-state="ready"] .mobile-dock { display:grid !important; position:fixed; z-index:70; left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; height:62px; padding:6px; border:1px solid #3c342b; border-radius:16px; background:#181512f5; box-shadow:0 8px 30px #0008; }
  body.console-page .mobile-dock a,body.console-page .mobile-dock button { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:4px; min-width:0; padding:2px; border:0; border-radius:10px; color:#ada396; background:transparent; text-decoration:none; font-size:10px; }
  body.console-page .mobile-dock svg { width:18px; height:18px; }
  body.console-page .mobile-dock a.active { color:#ffd3ad; background:#3a291e; }
  body.console-page .mobile-more-dialog[open] { display:block; position:fixed; inset:auto 0 0; width:100%; max-width:none; margin:0; padding:20px; border:1px solid #40362e; border-radius:20px 20px 0 0; background:#191512; }
  .mobile-more-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:14px; }
  .mobile-more-head small { display:block; }
  .mobile-more-close { border:0; background:transparent; color:#ddd; font-size:24px; }
  .mobile-more-items { display:grid; gap:8px; }
  .mobile-more-items .nav-link { padding:12px !important; }
  body.console-page #view-playground .chat-studio { grid-template-columns:minmax(0,1fr) !important; grid-template-rows:70px minmax(0,1fr) !important; border-radius:12px !important; }
  body.console-page #view-playground .chat-history { display:grid !important; grid-template-rows:28px minmax(0,1fr); grid-column:1; grid-row:1; min-height:0 !important; max-height:none !important; padding:6px 10px !important; border-right:0; border-bottom:1px solid #302b26; }
  body.console-page #view-playground .chat-history-top { margin:0 !important; padding:0 !important; border:0 !important; }
  body.console-page #view-playground .chat-history-search,body.console-page #view-playground .chat-history > p { display:none !important; }
  body.console-page #view-playground #chatList { display:flex; flex:1 1 auto; gap:6px; overflow-x:auto; overflow-y:hidden; margin-top:4px; padding:0 !important; }
  body.console-page #view-playground .chat-room-row { flex:0 0 auto; width:160px; height:24px; margin:0; }
  body.console-page #view-playground .chat-room-row .chat-room { font-size:10px; min-height:24px !important; height:24px; padding:4px 6px; }
  body.console-page #view-playground .chat-room-delete { flex-basis:24px; width:24px; height:24px; }
  body.console-page #view-playground #newChat { padding:4px 8px; min-height:25px; font-size:10px; }
  body.console-page #view-playground .chat-main { grid-column:1; grid-row:2; }
  body.console-page #view-playground .chat-main .studio-toolbar { min-height:48px !important; padding:6px 10px !important; }
  body.console-page #view-playground .studio-brand strong { font-size:12px !important; }
  body.console-page #view-playground .studio-spark { display:none !important; }
  body.console-page #view-playground .model-switch { font-size:11px !important; padding:5px 8px !important; }
  body.console-page #view-playground .chat-main .studio-canvas { padding:12px !important; }
  body.console-page #view-playground .studio-orbit { display:none !important; }
  body.console-page #view-playground .chat-main .studio-intro p { font-size:12px !important; }
  body.console-page #view-playground .prompt-suggestions button { flex:1 1 100px; font-size:11px; }
  body.console-page #view-playground .prompt-suggestions button span { display:none; }
  body.console-page #view-playground .chat-main .studio-composer { width:calc(100% - 14px) !important; margin:4px auto 7px !important; padding:8px !important; }
  body.console-page #view-playground #prompt { font-size:16px !important; min-height:38px !important; max-height:90px !important; }
  body.console-page #view-playground .chat-main .chat-status { font-size:9px !important; margin-top:5px; }
  body.console-page #view-playground .composer-footer { gap:4px !important; }
  body.console-page #view-playground .play-actions { gap:5px !important; }
  body.console-page #view-playground .file-upload-button span { display:none; }
}
@media (max-height:450px) and (max-width:700px) {
  body.console-page { --console-top:44px; }
  body.console-page.chat-mode #consoleView > .console-content { padding-bottom:64px !important; }
  body.console-page #view-playground .chat-studio { grid-template-rows:34px minmax(0,1fr) !important; }
  body.console-page #view-playground #chatList { display:none; }
  body.console-page #view-playground .chat-main .studio-toolbar { min-height:34px !important; padding:3px 8px !important; }
  body.console-page #view-playground .chat-status { display:none !important; }
  body.console-page #view-playground #prompt { height:32px !important; min-height:30px !important; }
  body.console-page #view-playground .chat-main .studio-composer { padding:4px 8px !important; margin-bottom:4px !important; }
  body.console-page[data-session-state="ready"] .mobile-dock { height:48px; }
}