@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
:root{
  --bg:#f0f2f5; --surface:#fff; --border:#e0e3ea;
  --accent:#5b4fcf; --accent-l:#edeaff;
  --text:#1a1c27; --muted:#6b7280;
  --red:#dc2626; --red-l:#fee2e2;
  --green:#16a34a; --green-l:#dcfce7;
  --yellow:#d97706; --yellow-l:#fef3c7;
  --blue:#2563eb; --blue-l:#dbeafe;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);font-size:13px;line-height:1.5}
button,input,select{font-family:inherit}
.topbar{background:var(--surface);border-bottom:1px solid var(--border);padding:0 22px;height:48px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:200}
.tl,.tr{display:flex;align-items:center;gap:10px}.tb-brand{font-size:13px;font-weight:700}.tb-dot{color:var(--border);font-size:16px}.tb-sub{font-size:12px;color:var(--muted)}
.ptag{background:var(--accent-l);color:var(--accent);padding:2px 10px;border-radius:99px;font-size:11px;font-weight:600}
.date-pair{display:flex;align-items:center;gap:6px;background:#f3f4f6;border:1px solid var(--border);border-radius:8px;padding:3px 8px}
.date-pair span{font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase}.date-pair input{border:none;background:transparent;font-size:12px;width:116px;outline:none}
.reset-btn,.mini-btn,.primary-btn{background:#fff;border:1px solid var(--border);color:var(--muted);padding:5px 13px;border-radius:7px;font-size:11px;cursor:pointer;transition:.15s}
.reset-btn:hover,.mini-btn:hover{border-color:var(--accent);color:var(--accent)}.danger{color:var(--red)!important;border-color:var(--red)!important}
.primary-btn{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.user-chip-login{display:inline-flex;align-items:center;gap:8px;background:var(--accent-l);border-radius:8px;padding:6px 12px;font-size:12px;color:var(--accent);font-weight:600}
.shell{display:flex;min-height:calc(100vh - 48px)}#sidebar{width:220px;min-width:220px;background:var(--surface);border-right:1px solid var(--border);overflow-y:auto;padding:16px 0;flex-shrink:0}
.side-h{padding:0 16px 12px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}
.sidebar-year{padding:4px 16px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-top:8px}
.sidebar-month{display:flex;align-items:center;justify-content:space-between;padding:7px 16px;font-size:13px;cursor:pointer;transition:background .12s;border-left:3px solid transparent;gap:6px;background:none;border-top:none;border-right:none;border-bottom:none;width:100%;text-align:left}
.sidebar-month:hover{background:#f3f4f6}.sidebar-month.active{background:var(--accent-l);border-left-color:var(--accent);color:var(--accent);font-weight:600}.sidebar-month.loaded{color:var(--text)}
.sidebar-month-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.upload-zone{padding:12px 16px 0;border-top:1px solid var(--border);margin-top:8px}.upload-zone input{width:100%;font-size:11px;margin-bottom:7px}
.sidebar-month-btn{background:none;border:none;padding:0;display:flex;align-items:center;justify-content:space-between;gap:8px;color:inherit;width:100%;text-align:left;cursor:pointer}
.month-actions{display:flex;gap:4px;flex-shrink:0}
.month-actions .mini-btn{padding:2px 6px;font-size:12px;line-height:1}
.upload-zone button{width:100%;background:var(--accent);color:#fff;border:none;padding:8px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer}.upload-zone #uploadStatus{font-size:11px;color:var(--muted);margin-top:6px}
.main{flex:1;overflow:auto;min-width:0}.tabbar{background:var(--surface);border-bottom:1px solid var(--border);padding:0 22px;display:flex;overflow-x:auto}
.tbtn{padding:10px 14px;font-size:12px;font-weight:500;color:var(--muted);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;transition:.15s}.tbtn:hover{color:var(--text)}.tbtn.on{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}
.page{padding:18px 22px;max-width:1300px;margin:0 auto}.panel{display:none}.panel.on{display:block}
.krow{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px;margin-bottom:16px}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:13px 15px;border-top:3px solid var(--accent)}
.kpi.k1{border-top-color:#5b4fcf}.kpi.k2{border-top-color:#db2777}.kpi.k3{border-top-color:#059669}.kpi.k4{border-top-color:#d97706}.kpi.k5{border-top-color:#dc2626}.kpi.k6{border-top-color:#2563eb}
.kpi-lbl{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:600;margin-bottom:5px}.kpi-val{font-size:24px;font-weight:700;font-family:'JetBrains Mono',monospace;line-height:1;color:var(--text)}.kpi-sub{font-size:10px;color:var(--muted);margin-top:3px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-bottom:14px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px;margin-bottom:14px}.card-t{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:12px}
.sec-t{font-size:15px;font-weight:700;margin-bottom:14px}.cw{position:relative;width:100%}.cw.h200{height:200px}.cw.h240{height:240px}.cw.h320{height:320px}.cw.h360{height:360px}
table{width:100%;border-collapse:collapse;font-size:12px}thead th{text-align:left;padding:7px 11px;font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:600;border-bottom:1px solid var(--border);white-space:nowrap;background:var(--bg)}tbody tr{border-bottom:1px solid #f0f2f5}tbody tr:hover{background:#f7f8fc}tbody td{padding:8px 11px;vertical-align:middle}.mono{font-family:'JetBrains Mono',monospace;font-size:11px}.rk{color:var(--muted);font-size:10px;font-family:'JetBrains Mono',monospace}
.b{display:inline-block;padding:2px 7px;border-radius:99px;font-size:10px;font-weight:600;white-space:nowrap}.b-ok{background:var(--green-l);color:var(--green)}.b-bad{background:var(--red-l);color:var(--red)}.b-warn{background:var(--yellow-l);color:var(--yellow)}.b-info{background:var(--blue-l);color:var(--blue)}.b-grey{background:#f3f4f6;color:#6b7280}
.filter-card{padding:12px 14px}.filter-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.filter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.filter-grid .wide{grid-column:1/-1}.filter-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:6px}
.filter-accordion{border:1px solid var(--border);border-radius:10px;background:#f9fafc;padding:6px 10px}
.filter-accordion summary{list-style:none;cursor:pointer;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:2px 0;display:flex;align-items:center;gap:8px}
.filter-accordion summary::-webkit-details-marker{display:none}
.filter-accordion summary::after{content:"▾";float:right;font-size:10px;color:#64748b}
.filter-accordion[open] summary::after{content:"▴"}
.filter-accordion .chip-group{margin-top:8px}
.acc-count{background:var(--accent);color:#fff;border-radius:999px;min-width:16px;height:16px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}
.table-help{font-size:11px;color:var(--muted);margin:-4px 0 10px}
.arg-row-click{cursor:pointer}
.vol-wrap{min-width:110px}
.vol-bg{height:6px;background:#e5e7eb;border-radius:999px;overflow:hidden}
.vol-fill{height:100%;background:var(--accent);border-radius:999px}
.vol-label{font-size:10px;color:var(--muted);margin-top:4px}
.chip-group{display:flex;gap:5px;flex-wrap:wrap}.scroll-chips{max-height:84px;overflow:auto}.op-chip,.sort-pill,.subtab{padding:4px 12px;border-radius:99px;font-size:12px;font-weight:500;cursor:pointer;background:#f3f4f6;color:var(--muted);border:1px solid var(--border);transition:.15s;white-space:nowrap}
.op-chip:hover,.sort-pill:hover,.subtab:hover{border-color:var(--accent);color:var(--accent)}.op-chip.on{background:var(--accent-l);color:var(--accent);border-color:var(--accent);font-weight:600}.sort-pill.on,.subtab.on{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}
.sort-row,.frow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.frow input,.frow select,select,input[type=text]{border:1px solid var(--border);background:#fff;color:var(--text);padding:5px 9px;border-radius:7px;font-size:12px;outline:none}
.filter-card .sort-row{margin-top:10px}
.op-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:14px}.op-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;cursor:pointer;transition:.15s;border-top:3px solid var(--accent)}.op-card:hover{box-shadow:0 4px 16px rgba(91,79,207,.12);border-color:var(--accent)}
.op-card-name{font-size:15px;font-weight:700;margin-bottom:2px}.op-card-sub{font-size:11px;color:var(--muted);margin-bottom:12px}.op-card-score{font-size:28px;font-weight:700;font-family:'JetBrains Mono',monospace;line-height:1;margin-bottom:3px}.op-card-score-lbl{font-size:10px;color:var(--muted);margin-bottom:12px}
.op-stat-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.op-stat-lbl{font-size:11px;color:var(--muted)}.op-stat-bar{flex:1;margin:0 8px;background:var(--border);border-radius:99px;height:4px;overflow:hidden}.op-stat-fill{height:100%;border-radius:99px;background:var(--accent)}.op-stat-val{font-size:11px;font-family:'JetBrains Mono',monospace;min-width:42px;text-align:right}
.detail-head{display:flex;align-items:center;justify-content:space-between}.empty{text-align:center;padding:32px;color:var(--muted);font-size:13px}.subtabs{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:14px}.subtab{border-radius:0;border:none;border-right:1px solid var(--border)}.subtab:last-child{border-right:none}
.mbar{display:flex;align-items:center;gap:6px;min-width:80px}.mbar-bg{flex:1;background:var(--border);border-radius:99px;height:4px;overflow:hidden}.mbar-f{height:100%;border-radius:99px;background:var(--accent)}
.dt-container{width:100%}.dt-container table{width:100%!important}.dt-container .dt-search input,.dt-container .dt-length select{border:1px solid var(--border);border-radius:7px;padding:4px 8px}.dt-container .dt-paging .dt-paging-button.current{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important}
.sla-left-table thead th,.sla-left-table tbody td{text-align:left!important}
.report-general{font-size:16px}
.report-title{font-size:36px;font-weight:800;line-height:1.1;margin-bottom:4px}
.report-period{font-size:16px;color:var(--muted);margin-bottom:18px}
.report-section{margin-bottom:18px}
.report-section-title{font-size:29px;font-weight:800;line-height:1.2;margin-bottom:6px}
.report-section p{font-size:16px;line-height:1.55;margin:4px 0}
.report-table-wrap{overflow:auto;border:1px solid var(--border);border-radius:10px}
.report-table{width:100%;border-collapse:collapse;font-size:14px}
.report-table thead th{background:#f7f8fc;text-align:left;padding:10px 12px;border-bottom:1px solid var(--border)}
.report-table tbody td{padding:10px 12px;border-bottom:1px solid #eef1f6}
.report-table tbody tr:last-child td{border-bottom:none}
.report-callout{border:1px solid var(--border);border-radius:10px;padding:12px 14px}
.report-callout-title{font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:800;margin-bottom:8px}
.report-callout ul{margin:0;padding-left:18px}
.report-callout li{margin:5px 0}
.report-callout.ok{background:var(--green-l);border-color:#86efac}
.report-callout.ok .report-callout-title{color:#166534}
.report-callout.warn{background:#fff7ed;border-color:#fdba74}
.report-callout.warn .report-callout-title{color:#9a3412}
.report-inline-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}
.report-title-sm{font-size:36px;font-weight:800;line-height:1.1;margin-bottom:4px}
.report-subtitle{font-size:30px;font-weight:800;line-height:1.2;margin-bottom:6px}
.report-compare .report-callout{margin-top:10px}
.report-metric-table th,.report-metric-table td{text-align:left}
.report-trend{display:inline-flex;align-items:center;justify-content:center;min-width:14px;font-size:16px;font-weight:700;vertical-align:middle}
.report-trend.good{color:var(--green)}
.report-trend.bad{color:var(--red)}
.report-trend.flat{color:var(--muted)}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:24px}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:36px 40px;width:100%;max-width:380px;box-shadow:0 4px 24px rgba(0,0,0,.06)}.brand-kicker{text-align:center;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);font-weight:600}.login-card h1{text-align:center;font-size:22px;margin:4px 0 24px}.login-card h1 span{color:var(--accent)}.login-card p{display:none}.login-card label{display:block;font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}.login-card input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;margin-bottom:14px}.login-card button{width:100%;padding:11px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer}.form-error{color:var(--red);font-size:12px;text-align:center;margin-top:10px;min-height:18px}
@media(max-width:900px){.shell{display:block}#sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border)}.g2,.g3{grid-template-columns:1fr}.filter-grid{grid-template-columns:1fr}.topbar{height:auto;align-items:flex-start;flex-direction:column;padding:10px 12px}.tl,.tr,.date-pair{flex-wrap:wrap}.page{padding:10px 12px}}