* { margin:0; padding:0; box-sizing:border-box; }
body {
  background: #000;
  color: #00ff41;
  font-family: 'Courier New', Courier, monospace;
  font-size: 14px;
  line-height: 1.4;
  min-height: 100vh;
}
.terminal-screen {
  max-width: 1000px;
  margin: 0 auto;
  padding: 10px;
  min-height: 100vh;
  border-left: 1px solid #003300;
  border-right: 1px solid #003300;
}
.terminal-header {
  border-bottom: 1px solid #00ff41;
  padding-bottom: 4px;
  margin-bottom: 8px;
  color: #00ff41;
  font-weight: bold;
}
.terminal-title {
  text-align: center;
  color: #00ff41;
  font-weight: bold;
  text-transform: uppercase;
  margin: 6px 0;
  letter-spacing: 2px;
}
.terminal-separator { color: #006600; margin: 4px 0; }
.terminal-body { padding: 8px 0; min-height: 400px; }
.terminal-field-row { margin: 4px 0; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.terminal-label { color: #00cc33; min-width: 220px; display: inline-block; }
.terminal-input {
  background: #001100;
  border: none;
  border-bottom: 1px solid #00ff41;
  color: #00ff41;
  font-family: 'Courier New', monospace;
  font-size: 14px;
  padding: 2px 6px;
  outline: none;
  width: 250px;
}
.terminal-input:focus { background: #002200; border-bottom-color: #66ff66; }
.terminal-input[type=password] { letter-spacing: 4px; }
.terminal-select {
  background: #001100;
  border: 1px solid #006600;
  color: #00ff41;
  font-family: 'Courier New', monospace;
  font-size: 14px;
  padding: 2px 6px;
}
.terminal-textarea {
  background: #001100;
  border: 1px solid #006600;
  color: #00ff41;
  font-family: 'Courier New', monospace;
  font-size: 13px;
  padding: 4px;
  width: 100%;
  resize: vertical;
}
.terminal-btn {
  background: #003300;
  color: #00ff41;
  border: 1px solid #00ff41;
  font-family: 'Courier New', monospace;
  font-size: 13px;
  padding: 4px 16px;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 2px;
  text-decoration: none;
  display: inline-block;
}
.terminal-btn:hover { background: #005500; color: #66ff66; }
.terminal-btn-danger { border-color: #ff4444; color: #ff4444; }
.terminal-btn-danger:hover { background: #330000; }
.terminal-btn-warning { border-color: #ffaa00; color: #ffaa00; }
.terminal-menu-item { margin: 3px 0; padding: 2px 0; }
.terminal-menu-item a { color: #00ff41; text-decoration: none; display: block; padding: 2px 4px; }
.terminal-menu-item a:hover { background: #003300; color: #66ff66; }
.terminal-table { width: 100%; border-collapse: collapse; margin: 8px 0; }
.terminal-table th {
  color: #00cc33;
  border-bottom: 1px solid #006600;
  padding: 4px 8px;
  text-align: left;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
}
.terminal-table td { padding: 3px 8px; border-bottom: 1px solid #001a00; color: #00ff41; font-size: 13px; }
.terminal-table tr:hover td { background: #001a00; }
.terminal-status {
  background: #001a00;
  border-top: 1px solid #006600;
  padding: 4px 8px;
  margin-top: 8px;
  font-size: 12px;
}
.terminal-status.error { color: #ff4444; border-top-color: #ff4444; background: #1a0000; }
.terminal-status.success { color: #66ff66; background: #001a00; }
.terminal-status.warning { color: #ffaa00; border-top-color: #ffaa00; background: #1a1000; }
.terminal-fkeys {
  border-top: 1px solid #006600;
  padding: 6px 8px;
  color: #006600;
  font-size: 12px;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #000;
  text-align: center;
  z-index: 50;
}
.terminal-fkeys span { margin: 0 8px; color: #00cc33; }
.terminal-fkeys span b { color: #00ff41; }
.terminal-cmd-line {
  border-top: 1px solid #006600;
  padding: 6px 8px;
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.terminal-cmd-label { color: #00cc33; white-space: nowrap; }
.terminal-cmd-input {
  background: none;
  border: none;
  border-bottom: 1px solid #00ff41;
  color: #00ff41;
  font-family: 'Courier New', monospace;
  font-size: 14px;
  flex: 1;
  outline: none;
  padding: 2px 4px;
}
.highlight { color: #66ff66; font-weight: bold; }
.dim { color: #006600; }
.label-highlight { color: #00aaff; }
.error-text { color: #ff4444; }
.warning-text { color: #ffaa00; }
.success-text { color: #66ff66; }
.pb-40 { padding-bottom: 50px; }
.mt-8 { margin-top: 8px; }
.pre-wrap { white-space: pre-wrap; }
.msg-row { border-bottom: 1px dotted #003300; padding: 4px 0; }
.msg-from { color: #00aaff; font-weight: bold; }
.msg-time { color: #006600; font-size: 12px; }
.msg-text { color: #00ff41; padding-left: 16px; }
.badge { background: #003300; color: #66ff66; border: 1px solid #006600; padding: 0 4px; font-size: 11px; }
.badge-alert { background: #330000; color: #ff4444; border-color: #ff4444; padding: 0 4px; font-size: 11px; }
.pager { margin: 8px 0; color: #006600; }
.pager a { color: #00cc33; margin: 0 4px; text-decoration: none; }
.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.9);
  z-index: 100;
  align-items: center;
  justify-content: center;
}
.modal-overlay.active { display: flex; }
.modal-box {
  background: #000;
  border: 2px solid #00ff41;
  padding: 20px;
  min-width: 400px;
  max-width: 700px;
  max-height: 80vh;
  overflow-y: auto;
}
.modal-title {
  color: #66ff66;
  font-weight: bold;
  margin-bottom: 12px;
  text-transform: uppercase;
  letter-spacing: 2px;
  border-bottom: 1px solid #006600;
  padding-bottom: 6px;
}
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #000; }
::-webkit-scrollbar-thumb { background: #003300; }
::-webkit-scrollbar-thumb:hover { background: #006600; }
.login-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  flex-direction: column;
}
.login-box {
  border: 2px solid #00ff41;
  padding: 40px 50px;
  min-width: 420px;
  background: #000;
}
.login-logo {
  text-align: center;
  color: #66ff66;
  font-size: 11px;
  letter-spacing: 3px;
  margin-bottom: 20px;
  line-height: 1.8;
}
.ai-response {
  background: #001a00;
  border: 1px solid #006600;
  padding: 12px;
  margin: 8px 0;
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 1.6;
}
.ai-thinking {
  color: #006600;
  font-style: italic;
  animation: blink 1s infinite;
}
@keyframes blink { 0%,100% { opacity:1; } 50% { opacity:0.3; } }
.cursor-blink::after {
  content: '_';
  animation: blink 1s infinite;
}
.form-section { margin: 12px 0; padding: 8px 0; border-top: 1px solid #003300; }
.form-section-title { color: #00aaff; font-size: 12px; letter-spacing: 2px; margin-bottom: 8px; text-transform: uppercase; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.perm-table { width: 100%; border-collapse: collapse; }
.perm-table th { color: #00aaff; padding: 4px 8px; font-size: 11px; text-transform: uppercase; border-bottom: 1px solid #003300; }
.perm-table td { padding: 3px 8px; border-bottom: 1px dotted #002200; font-size: 12px; }
.perm-table tr:hover td { background: #001100; }
@media (max-width: 768px) {
  .terminal-screen { padding: 4px; }
  .login-box { min-width: 300px; padding: 20px; }
  .terminal-fkeys { font-size: 10px; }
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
}