body:has(#voice.active), body:has(#voice.active) .app-shell { height: 100dvh !important; overflow: hidden !important; }
body:has(#voice.active) .main { height: 100dvh !important; min-height: 0 !important; display: grid !important; grid-template-rows: auto minmax(0,1fr) !important; overflow: hidden !important; }
#voice.view.active { display: block !important; height: 100% !important; min-height: 0 !important; overflow: hidden !important; }
#voice .voice-console { display: grid !important; height: 100% !important; min-height: 0 !important; grid-template-columns: minmax(0,4fr) minmax(0,1fr) !important; grid-template-rows: minmax(0,1fr) !important; gap: 12px !important; overflow: hidden !important; }
#voice .voice-brain-panel { display: grid !important; grid-template-rows: auto minmax(0,1fr) auto !important; min-height: 0 !important; height: 100% !important; overflow: hidden !important; }
#voice .voice-brain-stage { position: relative; height: 100% !important; min-height: 0 !important; min-width: 0; overflow: hidden !important; contain: layout paint; }
#voice .voice-brain-canvas { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; }
#voice .brain-field, #voice .brain-core, #voice .voice-rings { display: none !important; }
#voice .voice-brain-panel .panel-header { min-height: 0; padding: 10px 12px; }
#voice .voice-brain-panel .panel-header h2 { font-size: 18px; }
#voice .voice-brain-panel .panel-header p { display: none; }
#voice .voice-mode-strip { display: flex !important; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px; min-height: 44px; }
#voice .voice-mode-strip button, #voice .voice-screen-tools button, #voice .voice-screen-pager button { background: #0e2b34; border: 1px solid #315d65; color: #c5f5e7; padding: 7px 9px; font: 12px var(--font-body,sans-serif); cursor: pointer; }
#voice #voiceStatus { font: 11px var(--font-body,sans-serif); color: #c8b680; padding: 0; min-height: 0; }
#voice .voice-chat-panel { display: grid !important; grid-template-rows: minmax(0,3fr) minmax(0,2fr) !important; min-width: 0 !important; min-height: 0 !important; height: 100% !important; gap: 14px !important; overflow: hidden !important; padding: 0 !important; border: 0 !important; background: none !important; clip-path: none; }
#voice .voice-output-pane, #voice .voice-conversation-pane { display: grid; min-height: 0; min-width: 0; overflow: hidden; border-top: 1px solid #31545b; padding: 10px; background: #06151d; gap: 8px; }
#voice .voice-output-pane { grid-template-rows: auto minmax(0,1fr) 28px; }
#voice .voice-conversation-pane { grid-template-rows: auto minmax(0,1fr) 40px; }
#voice .voice-conversation-pane h2, #voice .voice-output-pane h2 { margin: 0; font-size: 15px; line-height: 22px; }
#voice .voice-output-pane .panel-header p { display: none; }
#voice .voice-screen-idle { display: grid; place-items: center; flex: 1; font: 14px var(--font-data,monospace); color: #42636b; }
.voice-report-options { margin-top: 18px; }
.voice-report-options summary { cursor: pointer; font-size: 13px; }
.voice-report-options .voice-screen-tools { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.voice-report-options select { width: 100%; }
#voice .voice-chat-panel .panel-header { padding: 0; margin: 0; min-height: 0; }
#voice .voice-screen-tools { display: flex; gap: 5px; min-width: 0; }
#voice .voice-screen-tools select { min-width: 0; flex: 1; width: 0; font-size: 12px; height: 34px; min-height: 0; padding: 4px; }
#voice .voice-screen-tools button { padding: 4px 7px; }
#voice .voice-display { display: flex !important; flex-direction: column; justify-content: flex-start !important; align-items: stretch; gap: 6px; min-height: 0 !important; height: 100% !important; padding: 10px !important; overflow: hidden !important; background: #06151d; contain: layout paint; }
#voice .voice-display > strong { font-size: 16px; line-height: 1.2; }
#voice .voice-display small { font: 10px var(--font-data,monospace); color: #9ab6bd; }
#voice .voice-display p, #voice .voice-display a { font: 13px/20px var(--font-body,sans-serif); white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
#voice .voice-display a { color: #72e6c4; }
#voice .voice-report-row { display: flex; flex-direction: column; gap: 3px; border-bottom: 1px solid #173842; padding: 4px 0; min-height: 0; }
#voice .voice-report-row button { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; width: 100%; border: 0; padding: 0; background: none; color: #a6c1c7; font: 11px/16px var(--font-body,sans-serif); cursor: pointer; }
#voice .voice-report-row span { font: 12px/17px var(--font-data,monospace); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#voice .voice-chart-row { display: grid; grid-template-columns: 34px minmax(0,1fr) 64px; align-items: center; gap: 8px; padding: 9px 0; font-size: 12px; }
#voice .voice-chart-row meter { width: 100%; accent-color: #70e3b3; }
#voice .voice-screen-pager { display: flex; align-items: center; justify-content: space-between; font: 11px var(--font-data,monospace); }
#voice .voice-screen-pager button { height: 28px; padding: 2px 8px; }
#voice .chat-box { display: grid !important; grid-template-columns: 28px 28px minmax(0,1fr); grid-template-rows: 16px minmax(0,1fr) 22px; align-content: stretch !important; min-height: 0 !important; height: 100% !important; gap: 3px; padding: 8px !important; overflow: hidden !important; }
#voice .chat-box > strong, #voice .chat-box > span { grid-column: 1 / -1; font: 11px/15px var(--font-body,sans-serif); overflow: hidden; overflow-wrap: anywhere; }
#voice .chat-box > button { border: 0; background: #15333b; color: #bdeddf; font-size: 11px; cursor: pointer; }
#voice .chat-form { display: grid !important; grid-template-columns: minmax(0,1fr) 65px !important; gap: 5px !important; height: 40px; margin: 0 !important; }
#voice .chat-form input, #voice .chat-form button { min-width: 0 !important; width: 100% !important; min-height: 0 !important; height: 40px; padding: 6px !important; font-size: 12px; }
#voice button:disabled { opacity: .4; cursor: not-allowed; }
.voice-connection-dialog { max-width: 420px; width: calc(100% - 30px); max-height: 90dvh; background: #0a2028; color: #d6eceb; border: 1px solid #3d737d; padding: 22px; border-radius: 6px; }
.voice-connection-dialog::backdrop { background: #000b; }
.voice-connection-dialog h2 { font-size: 20px; }
.voice-connection-dialog p, .voice-connection-dialog label { font: 13px/1.5 sans-serif; }
.voice-connection-dialog input { width: 100%; margin: 8px 0; }
.voice-connection-dialog button { background: #174653; color: #d4f8ed; border: 1px solid #438b94; padding: 8px 12px; cursor: pointer; }
.voice-mobile-nav { display: none; }
@media(max-width:760px) {
  body:has(#voice.active) .sidebar, body:has(#voice.active) .topbar { display: none !important; }
  body:has(#voice.active) .main { padding: 6px !important; grid-template-rows: minmax(0,1fr) !important; }
  #voice .voice-console { grid-template-columns: minmax(0,1fr) !important; grid-template-rows: minmax(180px,.9fr) minmax(340px,1.1fr) !important; gap: 6px !important; }
  #voice .voice-brain-panel .panel-header p { display: none; }
  #voice .voice-brain-panel .panel-header { padding: 4px 8px; }
  #voice .voice-brain-panel .panel-header h2 { font-size: 16px; }
  #voice .voice-mode-strip { gap: 5px; padding: 4px; }
  #voice .voice-mode-strip button { padding: 6px; }
  #voice .voice-chat-panel { grid-template-rows: minmax(0,3fr) minmax(0,2fr) !important; gap: 6px !important; padding: 0 !important; }
  #voice .voice-output-pane, #voice .voice-conversation-pane { padding: 6px; gap: 4px; }
  #voice .voice-output-pane { grid-template-rows: 22px minmax(0,1fr) 24px; }
  #voice .voice-conversation-pane { grid-template-rows: 22px minmax(0,1fr) 34px; }
  #voice .voice-chat-panel > .panel-header { display: none; }
  #voice .chat-form, #voice .chat-form input, #voice .chat-form button { height: 34px; }
  #voice .voice-screen-tools select { height: 28px; }
  #voice .chat-box { grid-template-rows: 12px minmax(0,1fr) 18px; padding: 4px !important; }
  #voice .chat-box > span { white-space: nowrap; text-overflow: ellipsis; }
  .voice-mobile-nav { display: block; min-width: 0; width: 80px; height: 29px; min-height: 0; padding: 3px; font-size: 11px; }
}