*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#08080c;--surface:#111118;--card:#14141e;
  --border:#1e1e2e;--border-hover:#2a2a3a;
  --text:#d4d4dc;--dim:#666;--muted:#444;
  --green:#22c55e;--yellow:#eab308;--red:#ef4444;--amber:#f59e0b;--cyan:#06b6d4;
  --mono:'Geist Mono',monospace;
  --ease-out-quint:cubic-bezier(.23,1,.32,1);
  --ease-out-cubic:cubic-bezier(.215,.61,.355,1);
  --border-w:1px;
  --z-panel:100;
}
@media only screen and (min-device-pixel-ratio:2),(min-resolution:192dpi){
  :root{--border-w:0.5px}
}
body{font-family:'Geist',system-ui,sans-serif;-webkit-font-smoothing:antialiased;background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column}
button,a,input{touch-action:manipulation}
.shell{display:flex;flex:1;overflow:hidden}
.main{flex:1;padding:24px;overflow-y:auto;transition:margin-right 250ms var(--ease-out-quint)}
.main.shifted{margin-right:420px}

/* Header */
.header{display:flex;justify-content:space-between;align-items:center;padding:0 0 20px}
.header h1{font-size:14px;font-weight:600;color:var(--muted);opacity:.9;text-wrap:balance;text-transform:uppercase;letter-spacing:2px}
.header .name{font-size:13px;color:var(--dim);position:absolute;left:50%;transform:translateX(-50%)}
.header .time{font-family:var(--mono);font-size:11px;color:var(--dim);font-variant-numeric:tabular-nums}

/* Source Status Bar (replaces old .runs grid) */
.runs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.src-pill{display:inline-flex;align-items:center;gap:6px;background:var(--card);box-shadow:0 0 0 var(--border-w) var(--border);border-radius:6px;padding:6px 10px;cursor:default;font-family:var(--mono);font-size:10px;transition:box-shadow 150ms ease}
.src-icon{width:14px;height:14px;flex-shrink:0;opacity:.7}
@media(hover:hover) and (pointer:fine){.src-pill:hover{box-shadow:0 0 0 var(--border-w) var(--border-hover)}}
.src-pill.has-error{cursor:help}
.src-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.src-dot.live{background:var(--green);box-shadow:0 0 4px var(--green)}
.src-dot.stale{background:var(--yellow)}
.src-dot.dead{background:var(--red)}
.src-dot.waiting{background:var(--muted)}
.src-pill{cursor:pointer}
.src-pill.src-active{box-shadow:0 0 0 1px var(--amber)}
.src-label{color:var(--dim)}
.src-count{color:var(--text);font-weight:500}
.src-time{color:var(--muted);font-size:9px}

/* Source Popover */
.src-popover-backdrop{position:fixed;inset:0;z-index:200}
.src-popover{position:fixed;z-index:201;width:480px;max-height:70vh;background:var(--surface);box-shadow:0 0 0 var(--border-w) var(--border),0 16px 48px rgba(0,0,0,.5);border-radius:10px;display:flex;flex-direction:column;animation:src-pop-in 150ms var(--ease-out-quint)}
@keyframes src-pop-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.src-popover-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:var(--border-w) solid var(--border);flex-shrink:0}
.src-popover-head h3{font-size:12px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px}
.src-popover-head .src-pop-meta{font-family:var(--mono);font-size:10px;color:var(--dim);display:flex;align-items:center;gap:8px}
.src-popover-close{background:none;border:var(--border-w) solid var(--border);color:var(--dim);cursor:pointer;width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;font-family:var(--mono);transition:border-color 150ms ease,color 150ms ease}
@media(hover:hover) and (pointer:fine){.src-popover-close:hover{border-color:var(--text);color:var(--text)}}
.src-popover-body{flex:1;overflow-y:auto;padding:12px 16px;font-family:var(--mono);font-size:10px;line-height:1.6;color:var(--dim);white-space:pre-wrap;word-break:break-all}
.src-popover-body::-webkit-scrollbar{width:6px}
.src-popover-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:3px}
.src-popover-loading{padding:24px;text-align:center;color:var(--muted);font-family:var(--mono);font-size:11px}
.fix-btn{background:var(--red);color:#fff;border:none;border-radius:4px;padding:3px 10px;font-family:var(--mono);font-size:9px;font-weight:600;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:opacity 150ms}
.fix-btn:hover{opacity:.85}
.fix-btn:disabled{opacity:.5;cursor:wait}
.fix-stream-header{font-family:var(--mono);font-size:10px;color:var(--dim);padding-bottom:8px;border-bottom:var(--border-w) solid var(--border);margin-bottom:8px}
.fix-output{font-family:var(--mono);font-size:10px;line-height:1.5;color:var(--text);white-space:pre-wrap;word-break:break-all;max-height:400px;overflow-y:auto;margin:0;background:none;border:none}
.fix-output::-webkit-scrollbar{width:6px}
.fix-output::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:3px}

/* Grid */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:24px}
.card{background:var(--card);box-shadow:0 0 0 var(--border-w) var(--border);border:none;border-radius:8px;padding:16px;cursor:pointer;transition:transform 150ms var(--ease-out-cubic),box-shadow 150ms ease;position:relative;isolation:isolate}
.card:active{transform:scale(.98)}
.card.active{box-shadow:0 0 0 1px var(--amber)}
.card.flash{box-shadow:0 0 0 1px var(--amber);transition:none}
.card:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
@media(hover:hover) and (pointer:fine){
  .card:hover{transform:translateY(-1px);box-shadow:0 0 0 var(--border-w) var(--border-hover),0 4px 12px rgba(0,0,0,.3)}
}
.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.card-title{font-size:12px;font-weight:600;color:var(--text)}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.dot.live{background:var(--green);box-shadow:0 0 6px var(--green)}
.dot.stale{background:var(--yellow);box-shadow:0 0 4px var(--yellow)}
.dot.dead{background:var(--red);box-shadow:0 0 4px var(--red)}
.dot.waiting{background:var(--muted)}
.card-body{font-family:var(--mono);font-size:11px;line-height:1.7;color:var(--dim);font-variant-numeric:tabular-nums}
.card-body .metric{color:var(--text);font-weight:500}
.card-body .alert{color:var(--amber);font-size:10px}
.card-body .good{color:var(--green)}
.card-body .bad{color:var(--red)}
.card-age{font-family:var(--mono);font-size:9px;color:var(--muted);margin-top:8px;text-align:right;font-variant-numeric:tabular-nums}

/* Activity Feed */
.feed{background:var(--surface);border-top:var(--border-w) solid var(--border);padding:16px 24px}
.feed-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.feed-header h2{font-size:11px;font-weight:500;color:var(--muted)}
.feed-scroll{max-height:180px;overflow-y:auto}
.ev{font-family:var(--mono);font-size:10px;line-height:2;color:var(--dim);display:flex;align-items:center;gap:8px}
.ev .ts{color:var(--cyan);flex-shrink:0;width:44px;font-variant-numeric:tabular-nums}
.ev .domain-tag{font-size:9px;font-weight:500;padding:2px 6px;border-radius:3px;flex-shrink:0;min-width:50px;text-align:center;background:rgba(255,255,255,.06);color:var(--dim)}
.ev .msg{flex:1}

/* Detail Panel */
.panel{position:fixed;top:0;right:0;width:420px;height:100vh;background:var(--surface);border-left:var(--border-w) solid var(--border);display:flex;flex-direction:column;z-index:var(--z-panel);transform:translateX(100%);transition:transform 250ms var(--ease-out-quint)}
.panel.open{transform:translateX(0)}
.panel-head{padding:20px;border-bottom:var(--border-w) solid var(--border);display:flex;justify-content:space-between;align-items:center}
.panel-head h2{font-size:13px;font-weight:600}
.panel-close{background:none;border:var(--border-w) solid var(--border);color:var(--dim);cursor:pointer;min-width:44px;min-height:44px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:14px;font-family:var(--mono);transition:border-color 150ms ease,color 150ms ease}
.panel-close:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
@media(hover:hover) and (pointer:fine){
  .panel-close:hover{border-color:var(--text);color:var(--text)}
}
.panel-body{flex:1;overflow-y:auto;padding:16px 20px}
.panel-section{margin-bottom:20px}
.panel-section h3{font-size:10px;font-weight:500;color:var(--muted);margin-bottom:8px}
.panel-metrics{font-family:var(--mono);font-size:11px;line-height:1.8;color:var(--dim);font-variant-numeric:tabular-nums}
.panel-metrics .metric{color:var(--text)}
.panel-metrics .good{color:var(--green)}
.panel-metrics .bad{color:var(--red)}
.panel-metrics .alert{color:var(--amber)}
.panel-json{font-family:var(--mono);font-size:10px;line-height:1.6;color:var(--dim);background:var(--bg);padding:12px;border-radius:6px;max-height:300px;overflow-y:auto;white-space:pre-wrap;word-break:break-all}
.panel-json::-webkit-scrollbar{width:6px;height:6px}
.panel-json::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:3px}
.panel-events{list-style:none}
.panel-events li{font-family:var(--mono);font-size:10px;line-height:2;color:var(--dim)}
.panel-events .ts{color:var(--cyan);margin-right:6px;font-variant-numeric:tabular-nums}

/* Message Input */
.panel-msg{padding:16px 20px;border-top:var(--border-w) solid var(--border)}
.panel-msg-row{display:flex;gap:8px}
.panel-msg input{flex:1;background:var(--bg);box-shadow:0 0 0 var(--border-w) var(--border);border:none;border-radius:6px;padding:10px 12px;color:var(--text);font-family:var(--mono);font-size:16px;outline:none;transition:box-shadow 150ms ease;min-height:44px}
.panel-msg input:focus{box-shadow:0 0 0 1px var(--amber)}
.panel-msg input::placeholder{color:var(--muted);font-size:11px}
.panel-msg button{background:var(--amber);color:var(--bg);border:none;border-radius:6px;padding:10px 16px;font-family:'Geist',sans-serif;font-size:11px;font-weight:600;cursor:pointer;letter-spacing:.5px;min-height:44px;min-width:44px;transition:opacity 150ms ease}
.panel-msg button:active{transform:scale(.97)}
.panel-msg button:focus-visible{outline:2px solid var(--text);outline-offset:2px}
@media(hover:hover) and (pointer:fine){
  .panel-msg button:hover{opacity:.85}
}
.msg-sent{font-family:var(--mono);font-size:10px;color:var(--green);margin-top:8px;display:none}
.inbox-list{margin-top:10px}
.inbox-item{font-family:var(--mono);font-size:10px;line-height:1.8;color:var(--dim);padding:4px 0;border-bottom:var(--border-w) solid var(--border)}
.inbox-item .inbox-ts{color:var(--muted);margin-right:6px;font-variant-numeric:tabular-nums}

/* (old .run-pill removed — replaced by .src-pill above) */

/* Sessions Section */
.sessions-section{margin-bottom:24px}
.sessions-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.sessions-header h2{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:1.5px}
.sessions-header .sessions-meta{font-family:var(--mono);font-size:10px;color:var(--dim)}
.sessions-cats{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:12px}
.sess-cat{background:var(--card);box-shadow:0 0 0 var(--border-w) var(--border);border-radius:8px;padding:12px;cursor:pointer;transition:transform 150ms var(--ease-out-cubic),box-shadow 150ms ease}
@media(hover:hover) and (pointer:fine){.sess-cat:hover{transform:translateY(-1px);box-shadow:0 0 0 var(--border-w) var(--border-hover),0 4px 12px rgba(0,0,0,.3)}}
.sess-cat-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.sess-cat-label{font-size:11px;font-weight:600}
.sess-cat-count{font-family:var(--mono);font-size:18px;font-weight:700;color:var(--text);line-height:1}
.sess-cat-meta{font-family:var(--mono);font-size:9px;color:var(--dim);margin-top:4px}
.sess-cat-projects{margin-top:8px;max-height:0;overflow:hidden;transition:max-height 250ms var(--ease-out-quint)}
.sess-cat.expanded .sess-cat-projects{max-height:600px}
.sess-proj{font-family:var(--mono);font-size:10px;color:var(--dim);padding:3px 0;display:flex;justify-content:space-between;align-items:center;border-top:var(--border-w) solid var(--border)}
.sess-proj-name{color:var(--text);font-weight:500}
.sess-proj-age{font-variant-numeric:tabular-nums}
.sess-dot{width:6px;height:6px;border-radius:50%;display:inline-block;margin-right:4px}

@media(max-width:1100px){.grid{grid-template-columns:repeat(3,1fr)}.sessions-cats{grid-template-columns:repeat(4,1fr)}}
@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}.sessions-cats{grid-template-columns:repeat(3,1fr)}.main.shifted{margin-right:0}}
@media(max-width:600px){.grid{grid-template-columns:1fr}.sessions-cats{grid-template-columns:repeat(2,1fr)}}
/* SVG Charts */
.spark{display:block;margin:4px 0}
.chart{display:block;margin:8px 0}

/* Tables */
.tbl{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:10px}
.tbl th{text-align:left;color:var(--muted);font-weight:500;padding:4px 6px;border-bottom:var(--border-w) solid var(--border)}
.tbl td{padding:4px 6px;color:var(--dim);border-bottom:var(--border-w) solid var(--border)}
.tbl tr:last-child td{border-bottom:none}
.badge{display:inline-block;padding:1px 6px;border-radius:3px;font-size:9px;font-weight:500}
.badge-replied{background:rgba(34,197,94,.15);color:var(--green)}
.badge-emailed{background:rgba(6,182,212,.15);color:var(--cyan)}
.badge-presented{background:rgba(255,255,255,.08);color:var(--dim)}
.badge-action{background:rgba(245,158,11,.15);color:var(--amber)}
.badge-hot{background:rgba(239,68,68,.15);color:var(--red)}

/* Links */
a.ext{color:var(--cyan);text-decoration:none;transition:opacity 150ms ease}
a.ext:hover{opacity:.7;text-decoration:underline}
a.ext:focus-visible{outline:1px solid var(--cyan);outline-offset:1px}

/* Action buttons */
.btn-action{background:rgba(245,158,11,.12);color:var(--amber);border:var(--border-w) solid rgba(245,158,11,.3);border-radius:6px;padding:8px 14px;font-family:'Geist',sans-serif;font-size:11px;font-weight:600;cursor:pointer;min-height:44px;transition:opacity 150ms ease,border-color 150ms ease;display:inline-flex;align-items:center;gap:6px}
.btn-action:active{transform:scale(.97)}
.btn-action:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
@media(hover:hover) and (pointer:fine){.btn-action:hover{opacity:.85;border-color:var(--amber)}}

/* Issue row */
.issue-row{display:flex;align-items:baseline;gap:6px;padding:3px 0;font-family:var(--mono);font-size:10px;line-height:1.8}
.issue-num{color:var(--cyan);flex-shrink:0}
.issue-title{color:var(--dim);flex:1}
.issue-labels{display:flex;gap:3px;flex-shrink:0}
.issue-label{font-size:8px;padding:1px 4px;border-radius:2px;background:rgba(255,255,255,.06);color:var(--muted)}

/* Sentry colored levels */
.sentry-fatal{color:#ef4444}.sentry-error{color:#f97316}.sentry-warning{color:#eab308}.sentry-info{color:#06b6d4}

/* Sankey Chart */
.sankey-chart{display:block;overflow:visible}
.sankey-flow{transition:opacity 200ms ease}
.sankey-node{transition:opacity 200ms ease,filter 200ms ease}
.sankey-chart:hover .sankey-flow{opacity:0.06!important}
.sankey-chart:hover .sankey-node{opacity:0.3}
.sankey-chart .sankey-flow:hover{opacity:0.35!important}
.sankey-chart .sankey-flow:hover~.sankey-node{opacity:1}
.sankey-node:hover{opacity:1!important;filter:brightness(1.3)}
.sankey-node{cursor:pointer}
.sankey-flow{cursor:pointer}
.sankey-active{opacity:1!important;filter:brightness(1.4);stroke-width:2!important}
.recruit-row{transition:opacity 150ms ease}

@media(prefers-reduced-motion:reduce){
  .main,.panel,.card,.panel-close,.panel-msg input,.panel-msg button{transition:none}
  .card:active{transform:none}
}