:root { color-scheme: dark; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; background: #06101f; color: #dcecff; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 18px; background: radial-gradient(circle at top, #142f5c, #030813 70%); }
.terminal { width: min(900px, 100%); min-height: min(640px, calc(100vh - 36px)); border: 1px solid #3166ad; border-radius: 10px; overflow: hidden; box-shadow: 0 22px 75px #0009; background: #06101f; display: flex; flex-direction: column; }
header { display: flex; gap: 10px; align-items: center; min-height: 43px; padding: 0 16px; color: #a9c9f5; background: #0c1b32; border-bottom: 1px solid #244b85; font-size: 12px; }
#status { margin-left: auto; color: #f1cc73; }.lamp { height: 10px; width: 10px; border-radius: 50%; background:#f1cc73; box-shadow: 0 0 8px #f1cc73; }
.output { flex: 1; padding: 20px; overflow: auto; white-space: pre-wrap; word-break: break-word; line-height: 1.55; }
.line { min-height: 1.55em; }.muted { color: #8ca9cc; }.error { color: #ff9797; }.success { color: #93c5fd; }.warning { color: #f1cc73; }.command { color: #b7d8ff; }
.audio-review { margin: 8px 0; color: #c7ddff; }.audio-review audio { display: block; width: min(100%, 360px); height: 34px; margin-top: 6px; }
form { display: flex; padding: 0 20px 20px; gap: 10px; align-items: center; } label { color: #93c5fd; white-space: nowrap; } input { flex: 1; border: 0; outline: 0; background: transparent; color: #edf5ff; font: inherit; min-width: 0; }
@media (max-width: 520px) { body { padding: 0; }.terminal { min-height: 100vh; border-radius: 0; border: 0; font-size: 13px; } header { font-size: 11px; min-height: 38px; padding: 0 14px; } .output { padding: 12px; line-height: 1.45; } .line { min-height: 1.45em; } form { padding: 0 12px 12px; gap: 8px; } }