:root{--bg:#f5f7fb;--card:#fff;--ink:#162033;--muted:#718096;--line:#e7ebf1;--brand:#6c5ce7;--brand2:#8b7cf6;--green:#18a874;--red:#e2545e;--amber:#e5a63b;--nav:#111827}*{box-sizing:border-box}body{margin:0;font-family:"DM Sans",sans-serif;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:238px;background:var(--nav);color:#fff;padding:28px 18px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;gap:12px;align-items:center;color:#fff;text-decoration:none;font-size:16px;font-weight:700;padding:0 10px 32px}.brand small{font-size:11px;color:#9ca3af;letter-spacing:.12em;text-transform:uppercase}.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,var(--brand),#a78bfa);font-size:23px;font-style:italic}.sidebar nav{display:grid;gap:7px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:10px;color:#aeb6c5;text-decoration:none;font-size:14px}.nav-item svg{width:18px}.nav-item:hover,.nav-item.active{background:#242d3d;color:#fff}.sidebar-footer{margin-top:auto}.user-chip{display:flex;gap:10px;align-items:center;padding:14px 8px;border-top:1px solid #293244;font-size:12px}.user-chip>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#312e81}.user-chip small{display:block;color:#7f8a9b}.ghost-button{border:0;background:transparent;color:inherit;display:flex;gap:7px;align-items:center;cursor:pointer}.ghost-button svg{width:16px}.sidebar-footer .ghost-button{color:#8994a7;padding:8px}.main-content{margin-left:238px;padding:35px;max-width:1560px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.page-header h1{font-size:28px;margin:3px 0}.page-header p{margin:0;color:var(--muted)}.eyebrow{font-size:10px!important;letter-spacing:.18em;font-weight:700;color:var(--brand)!important}.live-pill{font-size:12px;background:#eaf8f2;color:#16845e;padding:9px 13px;border-radius:20px}.live-pill span{display:inline-block;width:7px;height:7px;background:#20c78b;border-radius:50%;margin-right:7px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:18px}.metric-card,.chart-card,.panel-card,.table-card,.empty-card{background:var(--card);border:1px solid var(--line);border-radius:15px;box-shadow:0 2px 7px rgba(20,32,51,.025)}.metric-card{padding:20px}.metric-title{display:flex;gap:12px;align-items:center}.service-icon{width:39px;height:39px;border-radius:11px;display:grid;place-items:center;background:#f1efff;color:var(--brand)}.service-icon.vps{background:#eaf5ff;color:#328ad7}.service-icon.sync{background:#e9f9f3;color:#18a874}.service-icon svg{width:19px}.metric-title h3{margin:0;font-size:15px}.metric-title p{margin:3px 0 0;font-size:11px;color:var(--muted);text-transform:capitalize}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;background:#9ca3af}.status-dot.running,.status-dot.healthy{background:var(--green)}.status-dot.exited,.status-dot.unhealthy{background:var(--red)}.metric-values{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0 13px}.metric-values small,.run-summary small{display:block;font-size:9px;color:#98a2b3;letter-spacing:.1em}.metric-values strong{font-size:20px}.progress{height:4px;background:#edf0f5;border-radius:4px;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand2));border-radius:4px}.metric-card footer{display:flex;justify-content:space-between;color:#98a2b3;font-size:10px;margin-top:12px}.chart-card,.panel-card,.table-card{padding:22px;margin-bottom:18px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.section-heading h2{font-size:16px;margin:0}.section-heading p{font-size:12px;color:var(--muted);margin:4px 0}.section-heading a{font-size:12px;color:var(--brand);text-decoration:none}.range-picker,.chart-tabs{display:flex;background:#f3f5f8;border-radius:8px;padding:3px;gap:2px}.range-picker button,.chart-tabs button{border:0;background:transparent;color:#7d8798;border-radius:6px;padding:6px 10px;font-size:11px;cursor:pointer}.range-picker button.active,.chart-tabs button.active{background:#fff;color:var(--ink);box-shadow:0 1px 4px #d9dee7}.chart-tabs{display:inline-flex;margin-bottom:8px}.chart-wrap{height:265px}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.run-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.run-summary>div{padding:15px;background:#f8f9fc;border-radius:10px}.run-summary strong{display:block;font-size:19px;margin-top:5px}.green{color:var(--green)}.red{color:var(--red)}.status-badge{display:inline-flex;padding:5px 9px;border-radius:12px;font-size:10px;background:#edf0f5;color:#657084}.status-badge.success{background:#e9f8f2;color:#14865e}.status-badge.error{background:#feedef;color:#c9434d}.event-list{display:grid;gap:12px}.event{display:flex;gap:10px}.event-icon{color:var(--red)}.event-icon svg{width:17px}.event strong{font-size:12px;text-transform:capitalize}.event p{margin:2px 0;font-size:11px;color:#5f6878;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:420px}.event small{font-size:9px;color:#a0a8b5}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse}th{text-align:left;font-size:9px;letter-spacing:.1em;color:#98a2b3;padding:10px;border-bottom:1px solid var(--line)}td{padding:13px 10px;border-bottom:1px solid #f0f2f6;font-size:12px}td strong{display:block}td small{display:block;color:#98a2b3;font-size:9px;margin-top:2px}.empty-state,.empty-card{padding:28px;text-align:center;color:#98a2b3;font-size:12px}.filters{display:grid;grid-template-columns:180px 180px 1fr auto;gap:12px;align-items:end}.filters label,.login-form label{display:grid;gap:6px;color:#697386;font-size:11px;font-weight:600}.filters input,.filters select,.login-form input{height:40px;border:1px solid #dce1e9;border-radius:8px;background:#fff;padding:0 11px;color:var(--ink);outline:none}.filters input:focus,.filters select:focus,.login-form input:focus{border-color:var(--brand);box-shadow:0 0 0 3px #6c5ce71a}.filters>button,.login-form button{height:40px;border:0;border-radius:8px;background:var(--brand);color:#fff;padding:0 17px;display:flex;align-items:center;gap:7px;justify-content:center;cursor:pointer}.filters>button svg{width:16px}.log-toolbar{display:flex;justify-content:space-between;color:#98a2b3;font-size:11px;margin:20px 0 8px}.log-output{background:#0c1220;color:#c7d2e5;border-radius:10px;padding:18px;min-height:430px;max-height:65vh;overflow:auto;font:11px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap}.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 15% 20%,#eeeaff,transparent 28%),radial-gradient(circle at 85% 80%,#e7f8f2,transparent 30%),#f7f8fc}.login-card{width:min(420px,calc(100% - 32px));background:#fff;border:1px solid var(--line);border-radius:20px;padding:36px;box-shadow:0 24px 70px rgba(30,38,61,.10)}.login-brand{display:flex;gap:10px;align-items:center}.login-brand strong,.login-brand small{display:block}.login-brand small{font-size:10px;color:#8c96a7;letter-spacing:.12em}.login-copy{margin:35px 0 25px}.login-copy h1{font-size:25px;margin:0 0 7px}.login-copy p,.login-note{color:#8b94a3;font-size:12px}.login-form{display:grid;gap:16px}.login-form button{margin-top:5px}.login-note{text-align:center;margin:22px 0 0}.alert.error{background:#feedef;color:#b53d47;padding:10px 12px;border-radius:8px;font-size:12px;margin-bottom:16px}@media(max-width:1000px){.metric-grid{grid-template-columns:1fr}.two-columns{grid-template-columns:1fr}.filters{grid-template-columns:1fr 1fr}.search-label{grid-column:span 2}}@media(max-width:720px){.sidebar{position:static;width:auto;height:auto;padding:14px;flex-direction:row;align-items:center}.brand{padding:0}.sidebar nav{display:flex;margin-left:auto}.sidebar-footer{display:none}.nav-item{font-size:0}.nav-item svg{width:20px}.main-content{margin:0;padding:20px}.page-header{align-items:flex-start}.live-pill{display:none}.run-summary{grid-template-columns:1fr 1fr}.filters{grid-template-columns:1fr}.search-label{grid-column:auto}}
