*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--purple:#3C3489;--purple-mid:#534AB7;--purple-light:#EEEDFE;--teal:#0F6E56;--teal-light:#E1F5EE;--green:#27500A;--green-light:#EAF3DE;--amber:#633806;--amber-light:#FAEEDA;--red:#A32D2D;--red-light:#FCEBEB;--dot-success:#639922;--dot-pending:#BA7517;--dot-failed:#E24B4A;--bg:#F4F4F6;--bg-card:#FFFFFF;--bg-row:#F9F9FB;--border:#E4E4EA;--border-light:#EFEFF3;--text:#18181B;--text-muted:#71717A;--text-faint:#A1A1AA;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--sidebar-w:200px;--sidebar-collapsed:56px;--topbar-h:56px;--font:'Inter',system-ui,sans-serif;--shadow-card:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04)}
html,body{height:100%;font-family:var(--font);font-size:13px;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer;border:none;background:none}
.shell{display:flex;height:100vh;overflow:hidden}
.sidebar{width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--bg-card);border-right:1px solid var(--border);display:flex;flex-direction:column;transition:width .2s ease,min-width .2s ease;overflow:hidden;position:relative;z-index:10}
.sidebar.collapsed{width:var(--sidebar-collapsed);min-width:var(--sidebar-collapsed)}
.sidebar-inner{display:flex;flex-direction:column;height:100%;overflow:hidden}
.logo-area{display:flex;align-items:center;gap:10px;padding:16px 14px 14px;border-bottom:1px solid var(--border-light);flex-shrink:0;white-space:nowrap;overflow:hidden}
.logo-box{width:28px;height:28px;border-radius:8px;background:var(--purple);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-box i{color:#fff;font-size:15px}
.logo-name{font-size:14px;font-weight:600;color:var(--text);transition:opacity .15s}
.sidebar.collapsed .logo-name{opacity:0;width:0}
.collapse-btn{position:absolute;top:14px;right:10px;width:24px;height:24px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--text-muted);transition:background .15s,color .15s,right .2s}
.sidebar.collapsed .collapse-btn{right:14px}
.collapse-btn:hover{background:var(--bg);color:var(--purple)}
.collapse-btn i{font-size:16px}
.nav{padding:10px 8px;flex:1;overflow:hidden}
.nav-label{font-size:10px;color:var(--text-faint);padding:6px 8px 4px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;transition:opacity .15s}
.sidebar.collapsed .nav-label{opacity:0}
.ni{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--radius-md);color:var(--text-muted);margin-bottom:2px;white-space:nowrap;overflow:hidden;transition:background .15s,color .15s;font-size:13px}
.ni i{font-size:16px;flex-shrink:0}
.ni:hover{background:var(--bg);color:var(--text)}
.ni.active{background:var(--purple-light);color:var(--purple);font-weight:500}
.nav-text{transition:opacity .15s,width .15s;white-space:nowrap}
.sidebar.collapsed .nav-text{opacity:0;width:0;overflow:hidden}
.sidebar-footer{padding:10px 8px 12px;border-top:1px solid var(--border-light);flex-shrink:0;overflow:hidden}
.sb-user{display:flex;align-items:center;gap:9px;padding:7px 10px;white-space:nowrap;overflow:hidden}
.ava{width:28px;height:28px;border-radius:50%;background:var(--purple-light);color:var(--purple);font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sb-user-info p{font-size:12px;font-weight:500}
.sb-user-info span{font-size:11px;color:var(--text-muted)}
.logout-btn{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:var(--radius-md);color:var(--text-muted);font-size:12px;width:100%;transition:background .15s,color .15s;white-space:nowrap;overflow:hidden}
.logout-btn i{font-size:15px;flex-shrink:0}
.logout-btn:hover{background:var(--red-light);color:var(--red)}
.main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}
.topbar{height:var(--topbar-h);background:var(--bg-card);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 20px;flex-shrink:0}
.topbar-left h1{font-size:15px;font-weight:600}
.topbar-left p{font-size:11px;color:var(--text-muted);margin-top:1px}
.topbar-date{font-size:11px;color:var(--text-muted);background:var(--bg);padding:4px 10px;border-radius:20px;border:1px solid var(--border)}
.page-content{flex:1;overflow-y:auto}
.content-body{padding:20px;max-width:1400px}
.filter-bar{background:var(--bg-card);border-bottom:1px solid var(--border)}
.filter-row{display:flex;align-items:center;border-bottom:1px solid var(--border-light)}
.filter-row:last-child{border-bottom:none}
.filter-tag{display:flex;align-items:center;gap:6px;padding:9px 14px;border-right:1px solid var(--border-light);font-size:11px;font-weight:500;white-space:nowrap;width:148px;flex-shrink:0}
.filter-tag i{font-size:13px}
.filter-tag--weekly{color:var(--purple);background:var(--purple-light)}
.filter-tag--monthly{color:var(--teal);background:var(--teal-light)}
.filter-tag--launch{color:var(--amber);background:var(--amber-light)}
.filter-inputs{display:flex;align-items:center;gap:8px;padding:7px 14px;flex:1;flex-wrap:wrap}
.filter-inputs label{font-size:11px;color:var(--text-muted)}
.filter-inputs input[type="date"]{font-size:11px;padding:5px 8px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--text);font-family:var(--font);outline:none;transition:border-color .15s}
.filter-inputs input[type="date"]:focus{border-color:var(--purple-mid)}
.run-btn{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:500;padding:5px 12px;border-radius:var(--radius-sm);transition:opacity .15s;margin-left:auto}
.run-btn i{font-size:13px}
.run-btn:hover{opacity:.85}
.run-btn--weekly{background:var(--purple-light);color:var(--purple);border:1px solid var(--purple-mid)}
.run-btn--monthly{background:var(--teal-light);color:var(--teal);border:1px solid var(--teal)}
.run-btn--launch{background:var(--amber-light);color:var(--amber);border:1px solid var(--amber)}
.section-block{margin-bottom:4px}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.section-header-left{display:flex;align-items:center;gap:8px}
.section-header-left i{font-size:17px;color:var(--text-muted)}
.section-header-left h2{font-size:14px;font-weight:600;color:var(--text)}
.range-badge{font-size:11px;font-weight:500;padding:3px 10px;border-radius:20px}
.range-badge--weekly{background:var(--purple-light);color:var(--purple)}
.range-badge--monthly{background:var(--teal-light);color:var(--teal)}
.range-badge--launch{background:var(--amber-light);color:var(--amber)}
.section-divider{height:1px;background:var(--border-light);margin:20px 0}
.sub-heading{font-size:12px;font-weight:500;color:var(--text-muted);margin:14px 0 8px}
.cards-grid{display:grid;gap:10px;margin-bottom:4px}
.cards-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cards-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cards-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1100px){.cards-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.cards-grid--4,.cards-grid--3,.cards-grid--2{grid-template-columns:1fr}}
.mc{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px 16px 12px;box-shadow:var(--shadow-card);position:relative;overflow:hidden}
.mc::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:var(--radius-lg) var(--radius-lg) 0 0}
.mc--purple::before{background:var(--purple)}
.mc--teal::before{background:var(--teal)}
.mc--green::before{background:var(--dot-success)}
.mc--amber::before{background:var(--dot-pending)}
.mc--red::before{background:var(--dot-failed)}
.mc-label{font-size:11px;color:var(--text-muted);margin-bottom:8px;display:flex;align-items:center;gap:5px}
.mc-label i{font-size:13px}
.mc-val{font-size:28px;font-weight:600;line-height:1;color:var(--text);letter-spacing:-.5px}
.mc-sub{font-size:11px;color:var(--text-muted);margin-top:4px}
.pill{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:500;padding:2px 8px;border-radius:20px;margin-top:8px}
.pill--purple{background:var(--purple-light);color:var(--purple)}
.pill--teal{background:var(--teal-light);color:var(--teal)}
.pill--green{background:var(--green-light);color:var(--green)}
.pill--amber{background:var(--amber-light);color:var(--amber)}
.pill--red{background:var(--red-light);color:var(--red)}
.status-outer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:4px}
@media(max-width:900px){.status-outer-grid{grid-template-columns:1fr}}
.status-group-label{font-size:11px;font-weight:500;color:var(--text-muted);margin-bottom:7px}
.status-inner-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.sc{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 11px;box-shadow:var(--shadow-card)}
.sc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.sc-name{font-size:10px;color:var(--text-muted)}
.sc-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.sc-dot--success{background:var(--dot-success)}
.sc-dot--pending{background:var(--dot-pending)}
.sc-dot--failed{background:var(--dot-failed)}
.sc-val{font-size:18px;font-weight:600}
.sc-type{font-size:10px;color:var(--text-muted);margin-top:2px}
.panel{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card);margin-top:14px}
.panel-hdr{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-bottom:1px solid var(--border-light);background:var(--bg-row)}
.panel-hdr h3{font-size:12px;font-weight:600;display:flex;align-items:center;gap:7px;color:var(--text)}
.panel-hdr h3 i{font-size:15px;color:var(--text-muted)}
.badge-count{font-size:10px;font-weight:600;padding:2px 9px;border-radius:20px}
.badge-count--purple{background:var(--purple-light);color:var(--purple)}
.badge-count--teal{background:var(--teal-light);color:var(--teal)}
.badge-count--green{background:var(--green-light);color:var(--green)}
.badge-count--amber{background:var(--amber-light);color:var(--amber)}
.badge-count--red{background:var(--red-light);color:var(--red)}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse}
th{padding:8px 14px;text-align:left;font-size:10px;font-weight:600;color:var(--text-muted);background:var(--bg-row);border-bottom:1px solid var(--border-light);white-space:nowrap;text-transform:uppercase;letter-spacing:.04em}
td{padding:9px 14px;border-bottom:1px solid var(--border-light);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
tr:last-child td{border-bottom:none}
tr:hover td{background:var(--bg-row)}
.td-name{font-weight:500;color:var(--text)}
.td-muted{color:var(--text-muted)}
.td-empty{text-align:center;color:var(--text-muted);padding:28px 14px;font-size:12px}
.sp{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:500;padding:2px 8px;border-radius:20px}
.sp--active{background:var(--green-light);color:var(--green)}
.sp--inactive{background:var(--red-light);color:var(--red)}
.sdot{width:5px;height:5px;border-radius:50%}
.sp--active .sdot{background:var(--dot-success)}
.sp--inactive .sdot{background:var(--dot-failed)}
.login-body{background:var(--bg);display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-wrap{width:100%;max-width:400px;padding:16px}
.login-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:36px 32px 32px;box-shadow:0 4px 24px rgba(0,0,0,.07)}
.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:24px}
.login-brand-name{font-size:17px;font-weight:600}
.login-title{font-size:18px;font-weight:600;margin-bottom:4px}
.login-sub{font-size:12px;color:var(--text-muted);margin-bottom:22px}
.alert-error{display:flex;align-items:center;gap:7px;background:var(--red-light);color:var(--red);border:1px solid #f0c0c0;border-radius:var(--radius-md);padding:9px 12px;font-size:12px;margin-bottom:16px}
.alert-error i{font-size:15px;flex-shrink:0}
.login-form{display:flex;flex-direction:column;gap:14px}
.field-group{display:flex;flex-direction:column;gap:5px}
.field-group label{font-size:12px;font-weight:500;color:var(--text)}
.field-wrap{position:relative;display:flex;align-items:center}
.field-icon{position:absolute;left:11px;font-size:15px;color:var(--text-muted);pointer-events:none}
.field-wrap input{width:100%;padding:9px 12px 9px 34px;border:1px solid var(--border);border-radius:var(--radius-md);font-size:13px;font-family:var(--font);color:var(--text);background:var(--bg);outline:none;transition:border-color .15s,box-shadow .15s}
.field-wrap input:focus{border-color:var(--purple-mid);box-shadow:0 0 0 3px rgba(83,74,183,.12);background:#fff}
.login-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 16px;background:var(--purple);color:#fff;border-radius:var(--radius-md);font-size:13px;font-weight:500;font-family:var(--font);margin-top:4px;transition:background .15s}
.login-btn:hover{background:var(--purple-mid)}
.login-btn i{font-size:15px}