:root{font-family:Inter,Arial,sans-serif;color:#e9f1ff;background:#03050a}*{box-sizing:border-box}body{margin:0;overflow:hidden}.app{height:100vh;display:grid;grid-template-rows:64px 1fr 34px;background:radial-gradient(circle at 50% 40%,#11172a,#03050a 62%)}header{display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid #25304a;background:#070a12dd}.brand{display:flex;gap:12px;align-items:center}.logo{width:36px;height:36px;display:grid;place-items:center;border:1px solid #405474;background:#101a2e;border-radius:9px;color:#79ddff;font-size:25px}.brand strong{font:700 13px monospace;letter-spacing:.12em}.brand span{display:block;color:#74819a;font-size:11px;margin-top:3px}.live{font:700 10px monospace;color:#8fa2be;border:1px solid #29354d;padding:7px 10px;border-radius:20px}.live i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ff3b8d;margin-right:7px;box-shadow:0 0 8px #ff3b8d}.workspace{min-height:0;display:grid;grid-template-columns:280px 1fr 310px}.panel{background:#080b13e8;border-color:#25304a;border-style:solid}.left{border-width:0 1px 0 0}.right{border-width:0 0 0 1px}.panelTitle{height:44px;display:flex;align-items:center;padding:0 14px;border-bottom:1px solid #222c42;font:700 10px monospace;letter-spacing:.1em;color:#a8b6cb}.panelTitle b{margin-left:auto;color:#6ae1ff}.search{margin:12px;display:flex;gap:7px;background:#0d1320;border:1px solid #29364f;border-radius:7px;padding:8px;color:#687892}.search input{width:100%;background:none;border:0;outline:0;color:#dce8f9}.filters{padding:0 12px 10px}.filters label{display:flex;align-items:center;justify-content:space-between;gap:10px;font:700 10px monospace;letter-spacing:.06em;color:#7f8da3}.filters select{flex:1;background:#0d1320;border:1px solid #29364f;border-radius:7px;color:#dce8f9;padding:7px 8px;font:600 11px monospace}.eventList{overflow:auto;height:calc(100vh - 198px)}.event{display:grid;width:100%;grid-template-columns:1fr auto;text-align:left;padding:12px 14px;background:none;border:0;border-bottom:1px solid #182035;color:#d9e3f0;cursor:pointer}.event:hover,.event.active{background:#11192a}.event.active{box-shadow:inset 3px 0 #ff3b8d}.event strong{font:700 11px monospace}.event span,.event small{display:block;color:#77869e;font-size:10px;margin-top:4px}.event em{font:700 10px monospace;color:#61d7f5;font-style:normal}.event small{grid-column:1/-1}.viewer{position:relative;min-width:0;overflow:hidden}.viewer canvas{display:block;width:100%;height:100%;cursor:grab}.viewer canvas:active{cursor:grabbing}.viewerLabel{position:absolute;left:18px;top:16px;font:700 10px monospace;color:#93a5bd}.viewerLabel span{font-family:Arial;font-weight:400;color:#596984;margin-left:10px}.controls{position:absolute;right:16px;bottom:16px;width:205px;border-width:1px;border-radius:9px;padding-bottom:9px}.controls .panelTitle{height:36px}.controls label{display:block;font-size:11px;color:#a6b2c4;margin:10px 12px}.controls input{accent-color:#ff3b8d;margin-right:7px}.heroMetric{padding:18px 16px;border-bottom:1px solid #222c42}.heroMetric span{font:700 9px monospace;text-transform:uppercase;color:#ff6eaa}.confidence a{color:#6ae1ff;font:700 11px monospace;text-decoration:none}.confidence a:hover{text-decoration:underline}.heroMetric strong{display:block;font:700 15px monospace;margin:7px 0;overflow-wrap:anywhere}.heroMetric small{color:#738199;font-size:10px}.metrics{display:grid;grid-template-columns:1fr 1fr}.metric{padding:14px 16px;border-bottom:1px solid #20283a}.metric:nth-child(odd){border-right:1px solid #20283a}.metric span{display:block;color:#6f7f97;font-size:10px}.metric strong{display:block;font:700 13px monospace;margin-top:6px}.confidence{padding:16px}.confidence div{display:flex;justify-content:space-between;font-size:10px;color:#8392a8}.confidence b{color:#65dcf8;font-family:monospace}.confidence progress{width:100%;height:6px;margin-top:9px;accent-color:#ff3b8d}.note{margin:14px;padding:12px;background:#0c1422;border:1px solid #25334c;border-radius:8px}.note b{font-size:10px}.note p{margin:5px 0 0;color:#8392a8;font-size:10px;line-height:1.5}footer{display:flex;align-items:center;gap:22px;padding:0 18px;border-top:1px solid #202a40;background:#070a12;color:#65738a;font-size:10px}footer span:before{content:'';display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#f8a441}footer span:nth-child(2):before{background:#ff3b8d}footer span:nth-child(3):before{background:#65d9ff}footer b{margin-left:auto;font:700 9px monospace;color:#8190a6}@media(max-width:900px){.workspace{grid-template-columns:220px 1fr}.right{display:none}}@media(max-width:620px){.workspace{grid-template-columns:1fr}.left{display:none}}