:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:#07111f; color:#122033; }
* { box-sizing:border-box; }
.machines-panel { margin-bottom:18px; }
.login-shell { max-width:480px; margin:60px auto; padding:16px; }
.login-panel { padding:30px; }
.login-panel form { margin-top:24px; }
#loginError { color:#a62036; }
dialog { border:0; border-radius:18px; width:min(580px,94vw); max-height:90vh; padding:26px; }
.wide-dialog { width:min(920px,94vw); }
dialog::backdrop { background:#061528bb; }
.setup-form { display:grid; gap:14px; }
.setup-form p { margin:0; font-size:.9rem; overflow-wrap:anywhere; }
.muted { color:#66768a; }
.source-badge { color:#0b668e; font-size:.78rem; font-weight:700; }
.source-badge.agent { color:#9a5b08; }
.setup-form input { width:100%; }
.setup-form textarea { width:100%; min-height:430px; padding:14px; border:1px solid #ccd7e3; border-radius:10px; background:#07111f; color:#e9f9ff; font:13px/1.5 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; resize:vertical; white-space:pre; overflow:auto; }
.setup-form [role=alert] { color:#a62036; }
#machinesRows button { margin:3px; font-size:.9rem; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 10% 0%,#173d67 0,transparent 32%),#07111f; font-size:16px; }
button,input,select { font:inherit; }
.shell { width:min(1180px,calc(100% - 32px)); margin:0 auto; padding:38px 0 56px; }
.topbar { display:flex; align-items:end; justify-content:space-between; gap:24px; color:white; margin-bottom:26px; }
.eyebrow { margin:0 0 7px; color:#71d7ff; text-transform:uppercase; letter-spacing:.14em; font-weight:800; font-size:.78rem; }
h1 { margin:0; font-size:clamp(2rem,5vw,3.3rem); letter-spacing:-.055em; line-height:1; }
.health { display:flex; align-items:center; gap:9px; border:1px solid #ffffff2e; border-radius:999px; padding:9px 14px; background:#ffffff0e; }
.health span { width:9px; height:9px; border-radius:50%; background:#f2b84b; box-shadow:0 0 14px #f2b84b; }
.health.ok span { background:#39d98a; box-shadow:0 0 14px #39d98a; }
.health.bad span { background:#ff627c; box-shadow:0 0 14px #ff627c; }
.summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.summary article { min-height:118px; padding:20px; border-radius:16px; background:#f5f8fc; border-top:4px solid #2aa7df; box-shadow:0 15px 40px #0004; }
.summary span { display:block; color:#617086; font-size:.88rem; margin-bottom:13px; }
.summary strong { display:block; font-size:1.18rem; line-height:1.35; word-break:break-word; }
.toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:16px 0; padding:18px 20px; border-radius:16px; background:#10263e; color:white; border:1px solid #ffffff16; }
.device { display:grid; grid-template-columns:auto auto; gap:3px 10px; align-items:center; }
.device span,.device small { color:#9bb0c7; }
.device small { grid-column:1/-1; }
button { border:0; border-radius:10px; padding:12px 19px; background:#2aa7df; color:#04111e; font-weight:850; cursor:pointer; box-shadow:0 8px 22px #168fc34a; }
button:hover { filter:brightness(1.08); }
button:disabled { opacity:.55; cursor:wait; }
.secondary { background:#e7f5fb; box-shadow:none; color:#0b648a; }
.panel { background:white; border-radius:18px; overflow:hidden; box-shadow:0 20px 60px #0005; }
.panel-head { display:flex; align-items:end; justify-content:space-between; gap:24px; padding:24px; border-bottom:1px solid #e5ebf2; }
h2 { margin:0 0 5px; font-size:1.35rem; }
.panel-head p { margin:0; color:#66768a; }
form { display:flex; align-items:end; gap:10px; }
label { display:grid; gap:6px; color:#526277; font-size:.84rem; font-weight:750; }
input,select { min-height:43px; padding:8px 10px; border:1px solid #ccd7e3; border-radius:9px; color:#142337; background:white; }
.notice { margin:18px 24px 0; padding:12px 14px; border-radius:10px; background:#eaf7fd; color:#115f7d; }
.notice.error { background:#fff0f2; color:#a62036; }
.table-wrap { overflow:auto; max-height:540px; }
table { width:100%; border-collapse:collapse; }
th,td { padding:13px 24px; text-align:left; border-bottom:1px solid #edf1f5; white-space:nowrap; }
th { position:sticky; top:0; z-index:1; background:#f7f9fc; color:#536276; font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; }
td:first-child { font-weight:800; color:#0b668e; }
.empty { text-align:center; padding:46px; color:#7a899b; }
@media (max-width:820px) { .summary { grid-template-columns:repeat(2,1fr); } .panel-head { align-items:stretch; flex-direction:column; } form { width:100%; flex-wrap:wrap; } label { flex:1 1 140px; } }
@media (max-width:520px) { .shell { width:min(100% - 20px,1180px); padding-top:22px; } .topbar,.toolbar { align-items:stretch; flex-direction:column; } .summary { grid-template-columns:1fr; } .summary article { min-height:95px; } form button { width:100%; } th,td { padding:12px 16px; } }
