:root{font-family:Inter,Segoe UI,Microsoft YaHei,sans-serif;color:#172234;background:#f3f6fa;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}main{max-width:1500px;margin:auto;padding:30px 28px 60px}header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}h1{font-size:32px;margin:5px 0 6px}header p,.panel-title p{color:#66748a;margin:0}.eyebrow{font-size:12px;letter-spacing:.13em;color:#2878d0;font-weight:700}.status{background:#e7f0fb;color:#235f9d;padding:8px 12px;border-radius:20px;font-size:13px}.filters,.panel,.welcome{background:#fff;border:1px solid #dde4ed;border-radius:12px;box-shadow:0 8px 25px #162a440d}.filters{display:grid;grid-template-columns:1.15fr .7fr .6fr 1fr 1.2fr 1fr 1fr auto;gap:14px;align-items:end;padding:18px}.filters label{display:flex;flex-direction:column;gap:7px;min-width:0;position:relative}.filters label>span{font-size:13px;font-weight:650}.filters b{color:#d53b3b}.filters input,.filters select{width:100%;height:40px;border:1px solid #cbd5e1;border-radius:7px;padding:0 10px;color:#172234}.filters input:focus,.filters select:focus{outline:2px solid #b7d4f4;border-color:#2878d0}.select-wrap{position:relative}.select-wrap svg{position:absolute;right:10px;top:12px;color:#77869a}.options{position:absolute;z-index:5;top:67px;width:100%;max-height:260px;overflow:auto;background:#fff;border:1px solid #ccd6e2;border-radius:8px;box-shadow:0 12px 30px #1a2b422e;padding:5px}.options button{display:block;width:100%;border:0;background:none;text-align:left;padding:8px;border-radius:5px}.options button:hover{background:#edf4fc}.options span{display:block;padding:12px;color:#748196}.select-wrap svg.picked{color:#21734a}.search,.more{border:0;background:#2878d0;color:#fff;border-radius:7px;height:40px;padding:0 18px;display:inline-flex;gap:7px;align-items:center;justify-content:center;font-weight:650}.search:disabled,.more:disabled{opacity:.55}.validation{grid-column:1/-1;color:#c93636;margin:0;font-size:13px}.notice{display:flex;gap:8px;align-items:center;margin-top:14px;padding:11px 14px;background:#fff6df;color:#785a17;border-radius:8px}.notice.error{background:#fff0f0;color:#a62d2d}.panel{margin-top:18px;padding:18px}.panel-title{display:flex;justify-content:space-between}.panel-title h2{margin:0 0 5px;font-size:19px}.chart{height:250px;width:100%}.table-wrap{overflow:auto;margin:15px -18px 0}table{width:100%;border-collapse:collapse;font-size:13px}th{position:sticky;top:0;background:#f5f7fa;text-align:left;color:#536176;white-space:nowrap}th,td{padding:10px 12px;border-bottom:1px solid #e7ebf0;vertical-align:top}td.time{white-space:nowrap}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;max-width:180px;overflow-wrap:anywhere}.logger{max-width:210px;overflow-wrap:anywhere}.message{min-width:380px;white-space:pre-wrap;overflow-wrap:anywhere}.message button{float:right;border:0;background:transparent;color:#64748b;padding:2px}.level{font-weight:700;font-size:11px}.level.error{color:#c53232}.level.warn{color:#a86800}.level.info{color:#21734a}.more{margin:16px auto 0}.empty,.welcome{text-align:center;color:#69778a;padding:48px}.welcome{margin-top:18px}.welcome h2{color:#27364a;margin:12px 0 5px}.welcome p{margin:0}@media(max-width:1100px){.filters{grid-template-columns:repeat(2,minmax(0,1fr))}.search{width:100%}}@media(max-width:650px){main{padding:20px 14px}header{align-items:flex-start;gap:16px}.status{display:none}.filters{grid-template-columns:1fr}.message{min-width:300px}}.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;gap:10px;color:#66748a;font-size:14px}.spinner{width:16px;height:16px;border:2px solid #cbd5e1;border-top-color:#2878d0;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}.exception{margin-top:6px;white-space:normal}.exception summary{cursor:pointer;color:#a62d2d;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}.exception pre{margin:6px 0 0;max-height:320px;overflow:auto;padding:8px 10px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;color:#334155;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
