/* A working local index set into the monitor's hardware. */
.terminal-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-width: 44px; min-height: 44px; flex-shrink: 0; margin-left: auto; padding: 0 12px;
  border: 1px solid #776584; border-radius: 3px; background: #0d0813;
  box-shadow: inset 0 1px 3px #000b, 0 1px #ffffff10; color: #d1c4dc;
  font: 11px var(--mono); letter-spacing: .3px;
}
.terminal-toggle:hover { border-color: var(--accent); color: var(--white); }
.terminal-glyph { color: var(--amber); font-size: 14px; }
.terminal-toggle kbd { color: #b9a7c8; font: 11px var(--mono); }
.terminal-dialog {
  position: fixed; inset: calc(var(--terminal-offset, 0px) + 12vh) 20px auto;
  width: min(660px, calc(100vw - 40px)); max-width: none;
  max-height: calc(var(--terminal-viewport, 100dvh) - 12vh - 24px);
  margin: 0 auto; padding: 0; overflow: hidden;
  color: var(--white); background: #100a17; border: 1px solid #77618b; border-radius: 5px;
  box-shadow: 0 30px 100px #000b, 0 0 0 4px #07050bc7, inset 0 1px #d2b8ed16;
}
.terminal-dialog[open] { display: flex; flex-direction: column; }
.terminal-dialog::backdrop { background: #030107c4; backdrop-filter: blur(5px); }
.terminal-heading { display: flex; align-items: center; gap: 18px; padding: 23px 24px 16px; flex-shrink: 0; }
.terminal-heading > div { flex: 1; min-width: 0; }
.terminal-heading .eyebrow { color: var(--amber); font: 10px/1.5 var(--mono); letter-spacing: 1.5px; margin: 0 0 9px; }
.terminal-heading h2 { font: 400 27px/1.2 var(--font); letter-spacing: -.8px; margin: 0; }
.terminal-close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; border: 1px solid #493852; border-radius: 2px; background: #1a1024; color: #d0c0db; font: 21px var(--font); }
.terminal-close:hover { border-color: var(--accent); }
.terminal-query { display: flex; align-items: center; gap: 12px; margin: 0 24px; border-bottom: 1px solid #896c9e; flex-shrink: 0; }
.terminal-query > span { color: var(--amber); font: 19px var(--mono); }
.terminal-query input { width: 100%; min-width: 0; min-height: 52px; padding: 12px 0; color: #f3e9fc; background: transparent; border: 0; border-radius: 0; font: 16px/1.4 var(--font); }
.terminal-query input::placeholder { color: #b7a7c4; opacity: 1; }
.terminal-query:focus-within { border-bottom-color: var(--amber); }
.terminal-query input:focus-visible { outline-offset: 3px; outline-width: 1px; }
.terminal-status { margin: 15px 24px 9px; color: #b7a7c4; font: 10px/1.5 var(--mono); letter-spacing: .4px; flex-shrink: 0; }
.terminal-results { list-style: none; padding: 0 12px 12px; margin: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: #756086 #100a17; }
.terminal-results li + li { border-top: 1px solid #b696cb14; }
.terminal-result { display: flex; align-items: center; gap: 24px; min-height: 72px; padding: 13px 12px; border: 1px solid transparent; border-radius: 2px; }
.terminal-result:hover, .terminal-result:focus-visible { background: #b99adb0c; border-color: #8d6f9f80; outline-offset: -2px; }
.terminal-result-copy { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.terminal-result-type { color: #c7aade; font: 10px/1.4 var(--mono); }
.terminal-result-title { color: #f0e7f8; font-size: 16px; line-height: 1.35; }
.terminal-result-description { color: #bcadc8; font-size: 12px; line-height: 1.55; }
.terminal-result-arrow { color: var(--amber); margin-left: auto; flex-shrink: 0; }
.terminal-empty { margin: 7px 24px 24px; color: #cdbcd9; font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.terminal-help { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 13px 24px; border-top: 1px solid #84669842; background: #09050e; color: #bca9cc; font: 10px/1.5 var(--mono); flex-shrink: 0; }
.terminal-help kbd { color: #f3c68d; font: inherit; }
.terminal-help > span:last-child { margin-left: auto; }
@media (max-width: 640px) {
  .terminal-toggle { padding: 0 10px; margin-left: auto; }
  .terminal-toggle .terminal-button-label, .terminal-toggle kbd { display: none; }
  .monitor-controls .hardware-controls { margin-left: 0; }
  .terminal-dialog { inset: calc(var(--terminal-offset, 0px) + 16px) 12px auto; width: calc(100vw - 24px); max-height: calc(var(--terminal-viewport, 100dvh) - 32px); }
  .terminal-heading { padding: 17px 16px 13px; gap: 8px; }
  .terminal-heading h2 { font-size: 24px; }
  .terminal-query { margin-inline: 16px; gap: 8px; }
  .terminal-query input { min-height: 48px; }
  .terminal-status { margin-inline: 16px; }
  .terminal-results { padding-inline: 6px; }
  .terminal-result { padding-inline: 9px; gap: 12px; }
  .terminal-empty { margin-inline: 16px; }
  .terminal-help { padding: 12px 16px; gap: 12px; }
}
@media (max-width: 380px) {
  .monitor-controls .case-signature { display: none; }
  .monitor-controls .terminal-toggle { margin-left: 0; }
  .monitor-controls .hardware-controls { margin-left: auto; }
}
@media (max-height: 540px) {
  .terminal-dialog { inset-block-start: calc(var(--terminal-offset, 0px) + 12px); max-height: calc(var(--terminal-viewport, 100dvh) - 24px); }
  .terminal-heading { padding-top: 10px; padding-bottom: 7px; }
  .terminal-heading .eyebrow { display: none; }
  .terminal-query input { min-height: 44px; }
  .terminal-status { margin-top: 8px; }
  .terminal-help { padding-block: 8px; }
}
@media (prefers-reduced-transparency: reduce) {
  .terminal-dialog::backdrop { backdrop-filter: none; background: #030107ed; }
}
@media (forced-colors: active) {
  .terminal-dialog, .terminal-toggle, .terminal-close, .terminal-result { border-color: ButtonText; }
  .terminal-result:focus-visible { outline: 2px solid Highlight; }
  .terminal-dialog::backdrop { backdrop-filter: none; }
}
