@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,450;0,500;0,600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
:root{
 --background:#f4f4f4;--foreground:#161616;--card:#fff;--border:#e0e0e0;--muted:#525252;
 --primary:#0f62fe;--primary-hover:#0353e9;--secondary:#009d9a;--danger:#da1e28;--warning:#f1c21b;
 --header:#161616;--header-muted:#c6c6c6;--layer:#e8e8e8;--field:#fff;
}
*{box-sizing:border-box}
html{background:var(--background)}
body{margin:0;background:var(--background);color:var(--foreground);font:15px/1.5 'IBM Plex Sans',sans-serif}
.top{height:48px;border-bottom:1px solid #393939;display:flex;align-items:center;gap:20px;padding:0 24px;position:sticky;top:0;background:var(--header);z-index:20;color:#f4f4f4}
.brand{font-weight:600;letter-spacing:.04em;color:#fff;text-decoration:none}
.top>div:nth-child(2){font-size:14px}.top span{color:var(--header-muted);font-weight:400}
.mode{margin-left:auto;font:11px 'IBM Plex Mono',monospace;color:#fff;border-left:1px solid #525252;padding:0 0 0 16px}
main{max-width:1440px;margin:auto;padding:40px 32px 64px}
.hero{display:grid;grid-template-columns:1.65fr .55fr;gap:32px;align-items:end;padding:28px 0 40px;border-bottom:1px solid var(--border)}
.hero h1{font-size:clamp(40px,5vw,72px);font-weight:300;line-height:1.02;max-width:1000px;margin:10px 0 18px;letter-spacing:-.035em}
.hero p{max-width:860px;color:var(--muted);font-size:18px}
.eyebrow{font:600 11px 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.12em;color:var(--primary)!important}
.status-card,.panel,.metrics>div{border:1px solid var(--border);background:var(--card);border-radius:0}
.status-card{padding:20px;display:grid;grid-template-columns:auto 1fr;gap:4px 10px}
.status-card small{grid-column:2;color:var(--muted)}.dot{width:8px;height:8px;border-radius:50%;background:var(--secondary);margin-top:7px}
.tabs{display:flex;gap:0;border-bottom:1px solid var(--border);overflow:auto;background:var(--card);position:sticky;top:48px;z-index:10}
.tabs button{background:none;border:0;border-right:1px solid var(--border);color:var(--muted);padding:14px 18px;white-space:nowrap;font:500 14px 'IBM Plex Sans',sans-serif}
.tabs button:hover{background:#e8e8e8;color:var(--foreground)}
.tabs button.active{color:var(--foreground);box-shadow:inset 0 -3px 0 var(--primary);background:#fff}
.view{display:none;padding-top:24px}.view.active{display:block}
.grid{display:grid;gap:16px}.two{grid-template-columns:1fr 1fr}.three{grid-template-columns:repeat(3,1fr)}
.panel{padding:24px}.panel h2{margin:4px 0 18px;font-weight:400}.panel-head{display:flex;justify-content:space-between;gap:16px}
.badge{font:500 11px 'IBM Plex Mono',monospace;color:#004144;border:1px solid #009d9a;background:#d9fbfb;padding:5px 8px;height:max-content}
.badge.muted{color:var(--muted);border-color:var(--border);background:#f4f4f4}
label{display:block;color:var(--muted);font-size:12px;margin:14px 0 5px}
textarea,select,input{width:100%;background:var(--field);border:1px solid #8d8d8d;color:var(--foreground);padding:11px;border-radius:0;font:13px 'IBM Plex Mono',monospace}
textarea:focus,select:focus,input:focus{outline:2px solid var(--primary);outline-offset:-2px;border-color:var(--primary)}
textarea{resize:vertical}.row{display:flex;gap:12px;align-items:end}.row>*{flex:1}
.file{border:1px dashed #8d8d8d;padding:10px}.file input{display:none}.file span{display:block;color:var(--foreground);margin-top:4px}
.primary,button{cursor:pointer}.primary,.panel button{border:1px solid var(--primary);background:var(--primary);color:#fff;padding:11px 16px;border-radius:0;font-weight:500}
.primary:hover,.panel button:hover{background:var(--primary-hover);border-color:var(--primary-hover)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}.chip{font:11px 'IBM Plex Mono',monospace;background:#e8e8e8;border:1px solid #c6c6c6;padding:6px 8px}
.timeline{font:12px 'IBM Plex Mono',monospace}.timeline .step{display:grid;grid-template-columns:82px 1fr;gap:14px;padding:10px 0;border-bottom:1px solid var(--border)}.timeline .ok{color:#007d79}.empty{color:var(--muted)}
.result{margin-top:18px;border-left:4px solid var(--secondary);border-top:1px solid var(--border);border-right:1px solid var(--border);border-bottom:1px solid var(--border);background:#fff;padding:24px}.hidden{display:none}
.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.finding{padding:16px;background:#fff}.finding b{display:block;margin-bottom:5px}.finding small{display:block;color:var(--muted);margin-top:4px}
.metrics{margin-bottom:16px}.metrics>div{padding:18px}.metrics span,.metrics small{display:block;color:var(--muted)}.metrics b{font-size:30px;font-weight:400}
.stream{height:390px;overflow:auto;background:#161616;color:#f4f4f4;border:1px solid #393939;padding:14px;font:11px 'IBM Plex Mono',monospace}.stream div{padding:5px 0;border-bottom:1px solid #262626}.stream .err{color:#ff8389}.stream .warn{color:#f1c21b}
.alerts .alert{border-left:4px solid var(--warning);background:#fff8e1;padding:14px;margin:10px 0;border-top:1px solid #f1c21b;border-right:1px solid #f1c21b;border-bottom:1px solid #f1c21b}.alerts .critical{border-left-color:var(--danger);border-top-color:#fa4d56;border-right-color:#fa4d56;border-bottom-color:#fa4d56;background:#fff1f1}
.checkgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin:18px 0;border:1px solid var(--border)}.checkgrid label{display:flex;gap:8px;align-items:center;margin:0;background:#fff;padding:11px}.checkgrid input{width:auto}
.risk{padding:14px 0;border-bottom:1px solid var(--border)}.risk strong{display:flex;justify-content:space-between}.risk .high{color:var(--danger)}.risk .medium{color:#8a6100}.risk p{color:var(--muted);margin:5px 0}
.graph{min-height:460px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:center}.node{border:1px solid var(--border);background:#fff;padding:16px;min-height:96px}.node.observed{border-left:4px solid var(--secondary)}.node.inferred{border-left:4px dashed #8a6100}.node.action{border-left:4px solid var(--primary)}.node small{display:block;color:var(--muted);margin-top:5px}
.connector code,pre{display:block;background:#f4f4f4;border:1px solid var(--border);padding:12px;color:#004144;overflow:auto;font-family:'IBM Plex Mono',monospace}
footer{max-width:1440px;margin:0 auto;padding:24px 32px;border-top:1px solid var(--border);color:var(--muted)}
.sourcebar{display:flex;flex-wrap:wrap;gap:1px;margin-bottom:16px;background:var(--border);border:1px solid var(--border)}.sourcebar span{font:500 11px 'IBM Plex Mono',monospace;color:var(--foreground);background:#fff;padding:8px 10px}.secondary{margin-top:0;margin-bottom:18px}
@media(max-width:850px){main{padding:24px 16px}.hero,.two,.three,.result-grid{grid-template-columns:1fr}.top{padding:0 16px}.top span{display:none}.mode{font-size:9px}.graph{grid-template-columns:1fr}.hero h1{font-size:42px}.tabs{top:48px}}