:root{
  --bg:#f5f7fb;--panel:#fff;--text:#172033;--muted:#788399;--line:#e5e9f1;--nav:#111827;
  --primary:#3458d4;--primary-soft:#eef2ff;--green:#17875d;--green-soft:#e9f8f1;--red:#c64a4a;--red-soft:#fff0f0;
  --orange:#b56b1f;--orange-soft:#fff6e9;--purple:#7a4ab5;--purple-soft:#f5eeff;--shadow:0 8px 26px rgba(30,41,59,.06)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:var(--bg)}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}.mono,code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.muted{display:block;color:var(--muted);font-size:12px;margin-top:4px}.text-danger{color:var(--red)!important}.monoish{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:238px;background:var(--nav);color:#e7ebf5;padding:24px 16px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;padding:0 8px 24px}.brand-mark{width:36px;height:36px;border-radius:11px;background:#f9d65c;color:#172033;display:grid;place-items:center;font-weight:900;font-size:19px}.brand-mark.big{width:48px;height:48px;border-radius:14px;font-size:24px}.brand strong{display:block;font-size:15px}.brand span{display:block;color:#97a3ba;font-size:11px;margin-top:2px}.nav{display:flex;flex-direction:column;gap:5px}.nav-item{display:flex;align-items:center;gap:11px;color:#aeb8ca;padding:11px 12px;border-radius:10px;font-size:14px;font-weight:600}.nav-item:hover{background:#1d2738;color:#fff}.nav-item.active{background:#26334a;color:#fff}.nav-icon{width:22px;text-align:center;font-size:18px}.sidebar-footer{margin-top:auto;padding:16px 6px 0;border-top:1px solid #293246}.readonly-pill{display:inline-flex;align-items:center;gap:7px;color:#a9b5c8;font-size:11px}.readonly-pill span{width:7px;height:7px;background:#4fd19a;border-radius:50%;box-shadow:0 0 0 3px rgba(79,209,154,.12)}.big-pill{background:var(--panel);padding:10px 14px;border:1px solid var(--line);border-radius:999px;color:var(--green);font-weight:700}.logout{margin-top:12px;border:0;background:transparent;color:#7f8ba0;padding:6px 0}.logout:hover{color:#fff}.main{margin-left:238px;min-width:0;width:calc(100% - 238px)}.content{max-width:1600px;margin:0 auto;padding:34px 34px 60px}.mobile-header{display:none}
.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:24px}.page-heading h1{font-size:30px;line-height:1.1;margin:4px 0 7px;letter-spacing:-.6px}.page-heading p{margin:0;color:var(--muted);max-width:760px;font-size:14px;line-height:1.5}.eyebrow{text-transform:uppercase;letter-spacing:.09em;font-size:10px;font-weight:800;color:var(--primary)}.heading-stat{min-width:100px;text-align:right}.heading-stat strong{display:block;font-size:26px}.heading-stat span{color:var(--muted);font-size:12px}.breadcrumbs{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;margin-bottom:18px}.breadcrumbs a{color:var(--primary)}
.filters{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;align-items:end;gap:10px;flex-wrap:wrap;box-shadow:var(--shadow);margin-bottom:18px}.filter{min-width:120px}.filter.grow{flex:1;min-width:220px}.filter label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:750;margin:0 0 6px 2px}.filter input,.filter select{height:38px;width:100%;min-width:116px;border:1px solid #dce2ec;border-radius:9px;background:#fff;color:var(--text);padding:0 10px;outline:none}.filter input:focus,.filter select:focus{border-color:#9aaee8;box-shadow:0 0 0 3px rgba(52,88,212,.08)}.filter-actions{display:flex;gap:7px}.button{display:inline-flex;height:38px;align-items:center;justify-content:center;padding:0 14px;border-radius:9px;border:1px solid transparent;font-weight:700;font-size:12px}.button.primary{background:var(--primary);color:#fff}.button.primary:hover{background:#294bbf}.button.ghost{background:#fff;border-color:#dce2ec;color:#465168}.button.ghost:hover{background:#f8f9fc}.button.small{height:32px;padding:0 10px}.button.wide{width:100%;height:44px;font-size:14px}
.table-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px}thead{background:#f8fafc}th{white-space:nowrap;text-align:left;color:#69758a;font-size:10px;text-transform:uppercase;letter-spacing:.045em;font-weight:800;padding:11px 14px;border-bottom:1px solid var(--line)}td{padding:12px 14px;border-bottom:1px solid #eef1f5;vertical-align:middle}tbody tr:last-child td{border-bottom:0}.click-row{cursor:pointer}.click-row:hover td{background:#fbfcff}.user-cell{display:flex;align-items:center;gap:10px}.avatar{width:34px;height:34px;border-radius:10px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center;font-weight:900;font-size:11px}.strong-link{font-weight:750;color:#273247}.strong-link:hover,.muted-link:hover{color:var(--primary)}.muted-link{color:#6f7c91;display:block}.chevron{font-size:23px;color:#a4aec0}.num{font-weight:750;text-align:center}.status-pill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:#eff2f6;color:#637083;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em}.status-pill.success{background:var(--green-soft);color:var(--green)}.status-pill.danger{background:var(--red-soft);color:var(--red)}.status-pill.large{padding:8px 13px;font-size:12px}.pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px}.page-btn{width:36px;height:34px;border:1px solid var(--line);background:#fff;border-radius:9px;display:grid;place-items:center}.page-btn.disabled{opacity:.4;pointer-events:none}.page-status{font-size:12px;color:var(--muted)}.empty{padding:30px;text-align:center;color:var(--muted)}.empty.compact{padding:15px}.empty.large{padding:60px}
.user-hero{display:flex;align-items:center;gap:15px;background:linear-gradient(135deg,#fff,#f8faff);border:1px solid var(--line);padding:18px 20px;border-radius:16px;box-shadow:var(--shadow);margin-bottom:16px}.hero-avatar{width:52px;height:52px;border-radius:14px;font-size:16px}.user-hero-main{min-width:0}.id-line{display:flex;align-items:center;gap:10px}.id-line h1{margin:1px 0 0;font-size:23px}.full-id{font-size:11px;color:#8b96a8;margin-top:3px;overflow-wrap:anywhere}.copy-btn{border:1px solid #dce2ec;background:#fff;color:#68758b;padding:5px 8px;border-radius:7px;font-size:10px}.copy-btn:hover{color:var(--primary);border-color:#b7c5ee}.hero-actions{margin-left:auto}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.metric{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:15px 16px;min-width:0}.metric>span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:750;margin-bottom:7px}.metric strong{display:block;font-size:15px;overflow-wrap:anywhere}.metric small{display:block;color:#96a0b2;font-size:10px;margin-top:3px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:17px;box-shadow:var(--shadow);min-width:0}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.panel-head h2{font-size:15px;margin:0}.panel-head p{font-size:11px;color:var(--muted);margin:4px 0 0}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin:0}.detail-grid>div.wide{grid-column:1/-1}.detail-grid dt{color:var(--muted);font-size:10px;margin-bottom:4px}.detail-grid dd{margin:0;font-size:12px;font-weight:650;overflow-wrap:anywhere}.profile-block{display:flex;flex-direction:column;gap:12px}.mini-label{display:block;color:var(--muted);font-size:10px;margin-bottom:6px}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;background:var(--primary-soft);color:#4358a9;padding:4px 7px;border-radius:6px}.chip.warning{background:var(--orange-soft);color:var(--orange)}.json-details{margin-top:12px}.json-details summary{cursor:pointer;color:var(--primary);font-size:10px;font-weight:700;user-select:none}.json-details pre,.panel pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#0f172a;color:#dce6f5;border-radius:10px;padding:12px;font-size:10px;line-height:1.55;max-height:420px;overflow:auto}.json-details.inline{margin-top:8px}.sessions-panel{margin-bottom:22px}.sessions-strip{display:flex;gap:9px;overflow:auto;padding:1px 0 6px}.session-card{flex:0 0 210px;border:1px solid var(--line);border-radius:10px;padding:10px;background:#fbfcfe}.session-card:hover,.session-card.selected{border-color:#b4c2ef;background:var(--primary-soft)}.session-card span,.session-card strong{display:block}.session-card strong{font-size:11px;margin:4px 0}.session-card>span:not(.session-number){font-size:10px;color:var(--muted);margin-top:4px}.session-number{font-size:9px;font-weight:850;color:var(--primary)}.session-duration{color:#57657c!important}.session-note{margin-top:8px}.count-badge{min-width:30px;height:26px;padding:0 8px;border-radius:999px;background:#f0f3f8;display:grid;place-items:center;font-size:10px;font-weight:750;color:#647188}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:24px 0 12px}.section-heading h2{font-size:19px;margin:0}.section-heading p{font-size:11px;color:var(--muted);margin:5px 0 0;max-width:800px}.order-switch{display:flex;background:#e9edf4;padding:3px;border-radius:9px;white-space:nowrap}.order-switch a{font-size:10px;color:#718096;padding:6px 9px;border-radius:7px}.order-switch a.active{background:#fff;color:#344054;box-shadow:0 1px 3px rgba(0,0,0,.08)}.timeline-summary{font-size:11px;color:var(--muted);margin:10px 0 14px}.timeline-summary strong{color:var(--text)}
.timeline{position:relative}.session-divider{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#e9edf4;color:#57657a;padding:7px 11px;border-radius:8px;font-size:10px;font-weight:700;margin:15px 0 8px 118px}.session-divider a{color:var(--primary);font-weight:650}.timeline-item{display:grid;grid-template-columns:100px 18px minmax(0,1fr);gap:10px;position:relative;padding-bottom:10px}.time-col{text-align:right;padding-top:8px}.time-col strong{font-size:11px}.time-col>span{display:block;color:var(--muted);font-size:9px;margin-top:2px}.time-col .delta{display:inline-block;margin-top:5px;background:#edf0f5;border-radius:999px;padding:3px 6px;color:#59667a;font-weight:700}.timeline-dot{position:relative}.timeline-dot::before{content:"";position:absolute;left:8px;top:0;bottom:-10px;width:1px;background:#dce2eb}.timeline-dot::after{content:"";position:absolute;left:4px;top:13px;width:9px;height:9px;border-radius:50%;background:#9ca8bb;border:2px solid var(--bg)}.timeline-item.tone-accent .timeline-dot::after{background:var(--primary)}.timeline-item.tone-success .timeline-dot::after{background:var(--green)}.timeline-item.tone-danger .timeline-dot::after{background:var(--red)}.timeline-item.tone-premium .timeline-dot::after{background:var(--purple)}.timeline-item.tone-reminder .timeline-dot::after{background:var(--orange)}.event-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px 13px;box-shadow:0 4px 12px rgba(30,41,59,.035)}.event-top{display:flex;justify-content:space-between;gap:12px}.event-top h3{font-size:13px;margin:3px 0 0}.event-type{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#8a95a7;font-size:9px}.event-links a{font-size:10px;color:var(--primary);font-weight:700}.event-meta-row{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:8px;color:#7b8799;font-size:9px}.event-meta-row strong{color:#465267}.event-badge{display:inline-block;padding:4px 7px;border-radius:7px;background:#f0f2f6;color:#58657a;font-size:10px;font-weight:750}.event-badge.tone-accent{background:var(--primary-soft);color:var(--primary)}.event-badge.tone-success{background:var(--green-soft);color:var(--green)}.event-badge.tone-danger{background:var(--red-soft);color:var(--red)}.event-badge.tone-premium{background:var(--purple-soft);color:var(--purple)}.event-badge.tone-reminder{background:var(--orange-soft);color:var(--orange)}.table-json{margin:0}.table-json summary{white-space:nowrap}.table-json pre{min-width:300px;max-width:700px;position:relative;z-index:2}.data-dots{display:flex;gap:3px}.data-dots span{width:20px;height:20px;border-radius:5px;background:#edf0f4;color:#b0b7c4;display:grid;place-items:center;font-size:8px;font-weight:900}.data-dots span.on{background:var(--green-soft);color:var(--green)}
.scan-heading{align-items:center}.scan-metrics{margin-bottom:16px}.scan-data-panel{margin-bottom:16px}.ocr-pre{max-height:320px!important;background:#f7f9fc!important;color:#344054!important;border:1px solid #e6eaf1;font-size:11px!important}.json-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}.json-grid .full{grid-column:1/-1}.compact-events{display:flex;flex-direction:column}.compact-event{display:grid;grid-template-columns:160px 210px 180px 1fr;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #edf0f4;font-size:10px}.compact-event:last-child{border-bottom:0}.compact-event code{color:#7d899b}
.notice{background:#fff9e9;border:1px solid #f0dfaa;border-radius:11px;padding:11px 13px;color:#705b24;font-size:11px;margin:-5px 0 16px}.schema-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.schema-card{padding-bottom:10px}.columns-list>div{display:grid;grid-template-columns:minmax(150px,1.2fr) minmax(100px,1fr) auto;gap:10px;align-items:center;padding:7px 3px;border-top:1px solid #edf0f4;font-size:10px}.columns-list code{font-weight:750;color:#3d4a5f}.columns-list span{color:#68768b}.columns-list small{color:#a0a9b8;text-align:right}.raw-card{max-height:70vh}.raw-table{min-width:max-content}.raw-table th span{display:block;text-transform:none;font-weight:500;letter-spacing:0;color:#a1aaba;margin-top:2px}.raw-table td{max-width:420px;vertical-align:top}.null{color:#a5aebb;font-style:italic;font-size:10px}.cell-pre{margin:0;max-width:400px;max-height:140px;overflow:auto;font-size:9px;background:#f8fafc;border-radius:6px;padding:7px}.cell-details{margin:0;max-width:340px}.cell-details summary{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#5d6a7f}.cell-details pre{max-height:260px}
.error-state{max-width:520px;margin:14vh auto;text-align:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:36px;box-shadow:var(--shadow)}.error-icon{width:44px;height:44px;border-radius:50%;background:var(--red-soft);color:var(--red);display:grid;place-items:center;font-weight:900;margin:0 auto 14px}.error-state h1{font-size:21px;margin:0 0 8px}.error-state p{color:var(--muted);font-size:12px;margin:0 0 20px}
.login-page{display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#eef2ff 0,transparent 35%),#f5f7fb;padding:20px}.login-card{width:min(390px,100%);background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:0 18px 60px rgba(30,41,59,.12)}.login-brand{display:flex;align-items:center;gap:13px;margin-bottom:24px}.login-brand h1{font-size:19px;margin:0}.login-brand p{font-size:11px;color:var(--muted);margin:3px 0 0}.login-form label{display:block;font-size:11px;font-weight:700;color:#556175;margin-bottom:13px}.login-form input{display:block;width:100%;height:42px;margin-top:6px;border:1px solid #dce2ec;border-radius:9px;padding:0 11px;outline:none}.login-form input:focus{border-color:#9aaee8;box-shadow:0 0 0 3px rgba(52,88,212,.08)}.login-note{display:flex;align-items:center;justify-content:center;gap:6px;color:#8a95a7;font-size:10px;margin-top:16px}.login-note span{width:6px;height:6px;background:var(--green);border-radius:50%}.alert{border-radius:9px;padding:10px 11px;font-size:11px;margin-bottom:14px}.alert.danger{background:var(--red-soft);color:var(--red)}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.two-col,.schema-grid{grid-template-columns:1fr}.compact-event{grid-template-columns:140px 1fr}.compact-event code,.compact-event details{grid-column:2}.filters{align-items:stretch}.filter{flex:1}.filter-actions{align-self:end}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:translateX(0);box-shadow:20px 0 50px rgba(0,0,0,.2)}.main{margin-left:0;width:100%}.mobile-header{height:52px;display:flex;align-items:center;gap:12px;padding:0 15px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.menu-button{border:0;background:#f0f3f7;border-radius:8px;width:34px;height:34px}.content{padding:20px 14px 45px}.page-heading{gap:10px}.page-heading h1{font-size:25px}.heading-stat{display:none}.filters{display:grid;grid-template-columns:1fr 1fr}.filter.grow{grid-column:1/-1}.filter-actions{grid-column:1/-1}.filter-actions>*{flex:1}.metric-grid{grid-template-columns:1fr 1fr}.user-hero{align-items:flex-start}.hero-actions{display:none}.full-id{max-width:250px}.timeline-item{grid-template-columns:70px 14px minmax(0,1fr);gap:6px}.session-divider{margin-left:84px}.time-col strong{font-size:10px}.event-meta-row{gap:5px 9px}.section-heading{align-items:flex-start;flex-direction:column}.two-col{grid-template-columns:1fr}.json-grid{grid-template-columns:1fr}.json-grid .full{grid-column:auto}.detail-grid{grid-template-columns:1fr}.detail-grid>div.wide{grid-column:auto}.compact-event{grid-template-columns:1fr}.compact-event code,.compact-event details{grid-column:auto}.login-card{padding:22px}}
@media(max-width:480px){.filters{grid-template-columns:1fr}.filter.grow,.filter-actions{grid-column:auto}.metric-grid{grid-template-columns:1fr}.user-hero{padding:14px}.hero-avatar{display:none}.id-line h1{font-size:19px}.timeline-item{grid-template-columns:1fr;padding-left:18px}.time-col{text-align:left;padding:0;display:flex;align-items:center;gap:7px}.time-col>span{display:inline}.timeline-dot{position:absolute;left:0;top:0;bottom:0}.timeline-dot::before{left:5px}.timeline-dot::after{left:1px;top:8px}.session-divider{margin-left:18px}.event-top{flex-direction:column}.sessions-strip{margin-right:-17px}.page-heading p{font-size:12px}}
