:root { color-scheme: dark; font-family: "Courier New", Courier, monospace; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; color: #b7ffc9; background: radial-gradient(circle at 75% 5%, rgba(0,255,92,.09), transparent 34rem), linear-gradient(rgba(0,16,7,.86), rgba(0,5,2,.98)), #000; }
body::before { position: fixed; inset: 0; z-index: 20; content: ""; pointer-events: none; opacity: .16; background: repeating-linear-gradient(0deg, transparent 0, transparent 3px, rgba(65,255,121,.12) 4px); }
a { color: inherit; }
.auth-shell { width: min(470px, calc(100% - 32px)); margin: auto; padding: 44px 0; }
.back-link { display: inline-block; margin-bottom: 28px; color: #55ee83; text-decoration: none; font-size: .78rem; }
.back-link::before { content: "[ "; }
.back-link::after { content: " ]"; }
.auth-card, .panel { position: relative; padding: clamp(24px, 5vw, 38px); border: 1px solid #176d35; border-radius: 3px; background: rgba(0,12,5,.96); box-shadow: 0 0 0 1px rgba(53,255,112,.04), 0 0 34px rgba(0,255,76,.08), inset 0 0 30px rgba(0,255,76,.025); }
.auth-card::before, .panel::before { position: absolute; top: -8px; left: 14px; padding: 0 7px; content: "SYSTEM://SECURE"; color: #2dbb58; background: #000803; font-size: .58rem; letter-spacing: .12em; }
.eyebrow { margin: 0 0 9px; color: #4dff82; font-size: .68rem; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
h1 { margin: 0; color: #d7ffe1; font-size: clamp(2rem, 6vw, 3.5rem); letter-spacing: -.055em; line-height: 1; text-shadow: 0 0 18px rgba(69,255,121,.28); }
h1::after { content: "_"; color: #45ff79; animation: terminal-blink 1s steps(1) infinite; }
h2 { margin: 0 0 10px; font-size: 1.45rem; letter-spacing: -.035em; }
.lede, .panel > p:not(.eyebrow) { color: #6fc88a; line-height: 1.65; }
form { display: grid; gap: 16px; }
label { display: grid; gap: 8px; color: #74d691; font-size: .76rem; font-weight: 750; text-transform: uppercase; }
input { width: 100%; min-height: 47px; padding: 0 13px; border: 1px solid #176d35; border-radius: 2px; outline: 0; color: #adffc3; background: #000803; caret-color: #45ff79; font: inherit; }
input:focus { border-color: #45ff79; box-shadow: 0 0 0 2px rgba(69,255,121,.12), 0 0 16px rgba(69,255,121,.12); }
button, .header-actions a { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; padding: 0 16px; border: 1px solid #3cfa71; border-radius: 2px; color: #001b09; background: #45ff79; font: 800 .78rem/1 inherit; text-decoration: none; text-transform: uppercase; cursor: pointer; box-shadow: 0 0 12px rgba(69,255,121,.13); }
button:hover, .header-actions a:hover { color: #caffd7; background: #063717; box-shadow: 0 0 18px rgba(69,255,121,.25); }
.secondary { color: #67e98c; background: #001307; border: 1px solid #176d35; }
.status { min-height: 1.2em; color: #ff7474; font-size: .8rem; }
.status:empty { display: none; }
.status.success { width: min(1180px, calc(100% - 36px)); margin: 0 auto 20px; color: #45ff79; }
.admin-shell { padding: 48px 0; }
.admin-header { width: min(1180px, calc(100% - 36px)); display: flex; justify-content: space-between; gap: 25px; margin: 0 auto 34px; }
.header-actions { display: flex; align-items: flex-start; gap: 9px; }
.header-actions form { display: block; }
.admin-grid { width: min(1180px, calc(100% - 36px)); display: grid; grid-template-columns: 1.45fr .55fr; gap: 18px; margin: auto; align-items: start; }
.overview-panel { background: radial-gradient(circle at 85% 8%, rgba(48,255,106,.06), transparent 25rem), rgba(0,12,5,.96); }
.app-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin-top: 28px; }
.app-control { --accent: #45ff79; padding: 15px; border: 1px solid #164c29; border-radius: 2px; background: #000a04; }
.app-control > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.app-control h3 { margin: 0; color: #c9ffd7; font-size: .92rem; text-transform: uppercase; }
.app-control h3::before { content: "> "; color: #45ff79; }
.app-control form { grid-template-columns: 1fr 1fr; gap: 8px; }
.app-control button { min-height: 36px; color: #001b09; background: var(--accent); }
.app-control .stop-button { color: #67e98c; background: #001307; border: 1px solid #176d35; }
.app-state { display: inline-flex; align-items: center; gap: 6px; color: #9ca3af; font-size: .65rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.app-state::before { width: 7px; height: 7px; content: ""; border-radius: 50%; background: #646b78; }
.app-state.online { color: #45ff79; }
.app-state.online::before { background: #45ff79; box-shadow: 0 0 10px rgba(69,255,121,.85); }
.app-state.offline { color: #ffaaa5; }
.app-state.offline::before { background: #ff6b64; }
@keyframes terminal-blink { 50% { opacity: 0; } }
@media (max-width: 900px) { .admin-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .admin-header { flex-direction: column; } .header-actions { flex-wrap: wrap; } .app-list { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { h1::after { animation: none; } }