:root { --observatory-accent:#465064; }
.observatory-note { color:var(--muted); max-width:72ch; margin:12px 0 24px; font-size:12px; line-height:1.65; }
.observatory-loading,.observatory-error { padding:40px 0; border-top:1px solid var(--rule); margin-top:24px; }
.observatory-loading .eyebrow { display:block; }
.observatory-error p { margin:12px 0 20px; overflow-wrap:anywhere; }
.observation-toolbar { display:flex; flex-wrap:wrap; align-items:flex-end; gap:20px; padding:20px 0; border-block:1px solid var(--rule); margin-bottom:20px; }
.observation-toolbar>div { flex:0 1 240px; min-width:0; }
.observation-toolbar>p { flex:1 1 220px; margin:0; }
@media(min-width:701px) { .observation-toolbar:not(.issue-filters)>div { flex-basis:320px; } }
.visit-list-heading,.visit-row { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.15fr); gap:20px; }
.visit-list-heading { font:12px/1.5 var(--mono); color:var(--muted); padding:12px 16px; }
.visit-row { width:100%; padding:24px 16px; border:0; border-top:1px solid var(--rule); border-radius:0; text-align:left; align-items:start; }
.visit-row:hover { background:var(--panel); }
.visit-row strong { font-weight:500; }
.visit-identity,.visit-measure { display:flex; flex-direction:column; gap:8px; min-width:0; overflow-wrap:anywhere; }
.visit-identity>.metadata { font-size:12px; }
.visit-measure { font-size:12px; }
.visit-measure strong { font-size:16px; }
.visit-measure small { color:var(--muted); font-size:12px; }
.visit-measure .badge { align-self:flex-start; }
.visit-path { font-size:12px; }
.visit-path>span { color:var(--muted); margin-inline:4px; }
.visit-flag { display:inline-block; font-size:12px; color:var(--observatory-accent); }
.observation-pagination { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px; border-top:1px solid var(--rule); padding:24px 0; }
.visit-detail-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin:24px 0 16px; }
.visit-detail-heading h2 { font-size:24px; overflow-wrap:anywhere; }
.visit-detail-heading .metadata { margin-top:8px; overflow-wrap:anywhere; }
.visit-route { display:flex; flex-wrap:wrap; gap:12px; font-size:14px; margin-bottom:24px; }
.visit-route>span { color:var(--muted); }
.visit-ledger { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; margin:24px 0 12px; border-block:1px solid var(--rule); }
.visit-ledger>div { padding:20px 12px 20px 0; }
.visit-ledger>div+div { border-left:1px solid var(--rule); padding-left:16px; }
.visit-ledger dt { font-size:12px; color:var(--muted); }
.visit-ledger dd { margin:8px 0 0; font-size:24px; letter-spacing:-.03em; }
.recorded-view-layout { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:24px; align-items:start; }
.recorded-viewport-shell { width:100%; padding:8px; border:1px solid var(--rule); background:var(--panel); }
.recorded-viewport-caption { display:flex; gap:12px; justify-content:space-between; padding:4px 4px 12px; font:12px/1.5 var(--mono); color:var(--muted); }
.recorded-viewport { position:relative; overflow:hidden; width:100%; background:var(--paper); border:1px solid var(--rule); isolation:isolate; }
.recorded-element { position:absolute; overflow:hidden; border:1px solid var(--observatory-accent); background:var(--panel); min-width:0; }
.recorded-element.has-image { background:var(--paper); }
.recorded-element>img { display:block; width:100%; height:100%; object-fit:contain; }
.recorded-element>span { display:block; padding:8px; font-size:12px; line-height:1.4; color:var(--observatory-accent); overflow-wrap:anywhere; }
.recorded-element>b { position:absolute; top:0; left:0; min-width:16px; padding:2px 4px; background:var(--observatory-accent); color:var(--paper); font:10px/1.2 var(--mono); text-align:center; }
.recorded-viewport-label { position:absolute; bottom:8px; right:8px; background:var(--paper); color:var(--muted); padding:4px 8px; font:10px/1.5 var(--mono); z-index:1; }
.recorded-key { min-width:0; }
.recorded-key ol { margin:20px 0 0; padding-left:24px; }
.recorded-key li { padding:8px 0; font-size:12px; overflow-wrap:anywhere; }
.recorded-key li small { display:block; color:var(--muted); margin-top:4px; font-size:12px; }
.frame-controls { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; margin-top:20px; }
.frame-controls>label { flex:1 1 180px; margin:0; }
.frame-controls select { margin-top:8px; }
.frame-controls>button { flex:none; }
.observed-content-row { display:grid; grid-template-columns:48px minmax(0,1fr) auto; gap:16px; align-items:center; padding:16px 0; border-bottom:1px solid var(--rule); }
.observed-content-row>img { width:48px; height:64px; object-fit:contain; background:var(--panel); }
.observed-content-row strong { font-weight:500; }
.observed-content-row>div { min-width:0; overflow-wrap:anywhere; }
.content-type { font:10px/1.5 var(--mono); color:var(--muted); overflow-wrap:anywhere; }
.observation-disclosure>summary { display:flex; justify-content:space-between; gap:16px; align-items:center; min-height:44px; cursor:pointer; font-weight:600; list-style:none; }
.observation-disclosure>summary::before { content:'+'; font:18px/1 var(--mono); }
.observation-disclosure[open]>summary::before { content:'−'; }
.observation-disclosure>summary>span { margin-left:auto; font:12px/1.5 var(--mono); font-weight:400; color:var(--muted); }
.observation-disclosure>summary::-webkit-details-marker { display:none; }
.resource-table { margin-top:20px; }
.resource-row { display:grid; grid-template-columns:minmax(0,1fr) auto 128px; gap:16px; padding:16px 0; align-items:start; border-bottom:1px solid var(--rule); }
.resource-row strong { font:12px/1.5 var(--mono); overflow-wrap:anywhere; }
.resource-row>div { min-width:0; }
.resource-row .metadata { margin-top:4px; }
.visit-timeline { list-style:none; padding:0; margin:20px 0 0; }
.visit-timeline li { display:grid; grid-template-columns:140px minmax(0,1fr); gap:24px; padding:16px 0; border-bottom:1px solid var(--rule); }
.visit-timeline li>div { min-width:0; }
.visit-timeline strong { font-weight:500; text-transform:capitalize; }
.visit-timeline p { margin:8px 0; font-size:12px; overflow-wrap:anywhere; }
.issue-occurrence { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:20px 0; border-bottom:1px solid var(--rule); }
.issue-occurrence>div { min-width:0; }
.issue-occurrence p { margin-top:8px; overflow-wrap:anywhere; }
.issue-occurrence time { display:block; }
.issue-result-count { margin:24px 0 12px; }
.issue-group { border-top:1px solid var(--rule); }
.issue-group>summary { display:flex; justify-content:space-between; gap:24px; padding:24px 0; cursor:pointer; list-style:none; }
.issue-group>summary::-webkit-details-marker { display:none; }
.issue-group-title { display:flex; flex-direction:column; gap:8px; min-width:0; overflow-wrap:anywhere; }
.issue-group-title>strong { font:600 14px/1.5 var(--mono); }
.issue-group-title>small,.issue-group-count>small { font-size:12px; color:var(--muted); }
.issue-group-count { display:flex; flex-direction:column; gap:8px; flex:none; text-align:right; }
.issue-group-count>strong { font-size:14px; font-weight:500; }
.issue-group-detail { padding:0 0 24px; }
.issue-visit-row { display:flex; justify-content:space-between; gap:16px; padding:16px 0; align-items:center; border-bottom:1px solid var(--rule); }
.issue-visit-row>div { min-width:0; overflow-wrap:anywhere; }
.issue-visit-row>button { flex:none; }
.observation-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:20px 0 32px; border-block:1px solid var(--rule); }
.observation-summary>div { display:flex; flex-direction:column; gap:8px; padding:20px 16px 20px 0; }
.observation-summary>div+div { padding-left:20px; border-left:1px solid var(--rule); }
.observation-summary strong { font-size:18px; font-weight:500; }
.observation-summary span { font-size:12px; color:var(--muted); }
.observation-insight-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.observation-insight-grid h3 { margin-bottom:16px; }
.insight-route { display:block; color:var(--muted); font-size:12px; margin-top:4px; }
.observation-insight-grid .funnel-row>span { overflow-wrap:anywhere; }
.product-exposure-list { margin-top:16px; }
.exposure-head,.product-exposure-row { display:grid; grid-template-columns:minmax(0,2.2fr) repeat(3,minmax(0,1fr)); gap:16px; }
.exposure-head { font:12px/1.5 var(--mono); color:var(--muted); padding:12px 0; }
.product-exposure-row { padding:16px 0; border-top:1px solid var(--rule); align-items:center; font-size:12px; }
.exposure-product { display:flex; gap:12px; align-items:center; min-width:0; }
.exposure-product img { width:48px; height:64px; object-fit:contain; background:var(--panel); flex:none; }
.exposure-product>div { min-width:0; overflow-wrap:anywhere; }
.exposure-product strong { font-size:14px; font-weight:500; }
.exposure-product small { display:block; margin-top:6px; color:var(--muted); font-size:12px; }
@media(max-width:1000px) {
  .visit-list-heading { display:none; }
  .visit-row { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 16px; }
  .visit-identity { grid-column:1/-1; }
  .visit-ledger { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .visit-ledger>div:nth-child(4) { border-left:0; padding-left:0; }
  .recorded-view-layout { grid-template-columns:minmax(0,1fr); }
  .recorded-key ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; }
  .observation-insight-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
}
@media(max-width:700px) {
  .observation-toolbar { gap:16px; }
  .observation-toolbar>div { flex:1 1 100%; }
  .issue-filters>div { flex:1 1 130px; }
  .visit-row { padding:20px 0; gap:20px 12px; }
  .visit-measure strong { font-size:14px; }
  .visit-measure .badge { padding:4px; }
  .visit-detail-heading { gap:12px; }
  .visit-detail-heading h2 { font-size:20px; }
  .visit-ledger>div { padding-block:16px; }
  .visit-ledger>div+div { padding-left:12px; }
  .visit-ledger dd { font-size:20px; }
  .recorded-key ol { grid-template-columns:minmax(0,1fr); }
  .recorded-viewport-caption { font-size:10px; }
  .frame-controls { gap:8px; }
  .frame-controls>label { order:-1; flex-basis:100%; }
  .frame-controls>button { flex:1; }
  .observed-content-row { grid-template-columns:40px minmax(0,1fr); gap:12px; }
  .observed-content-row>img { width:40px; height:52px; }
  .observed-content-row>div:last-child { grid-column:2; }
  .resource-row { grid-template-columns:minmax(0,1fr) auto; gap:12px; }
  .resource-row>div:last-child { grid-column:1/-1; }
  .visit-timeline li { grid-template-columns:minmax(0,1fr); gap:8px; }
  .issue-group>summary { gap:16px; flex-wrap:wrap; }
  .issue-group-count { flex:1 1 100%; min-width:0; max-width:100%; flex-direction:row; flex-wrap:wrap; align-items:center; text-align:left; gap:12px; }
  .issue-group-count>small { min-width:0; max-width:100%; overflow-wrap:anywhere; }
  .issue-group-count .badge { order:0; }
  .issue-occurrence { flex-direction:column; gap:12px; }
  .issue-visit-row { flex-wrap:wrap; }
  .observation-summary { grid-template-columns:minmax(0,1fr); }
  .observation-summary>div+div { border-left:0; border-top:1px solid var(--rule); padding-left:0; }
  .exposure-head { display:none; }
  .product-exposure-row { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
  .exposure-product { grid-column:1/-1; }
  .product-exposure-row>span::before { content:attr(data-label); display:block; color:var(--muted); margin-bottom:4px; font-size:12px; }
}
.unseen-media-section { margin-top:32px; }
.unseen-media-section>.section-note { max-width:72ch; }
.unseen-media-list { margin-top:20px; }
.unseen-media-row { display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:16px; align-items:center; padding:16px 0; border-top:1px solid var(--rule); }
.unseen-media-row>img { width:64px; height:72px; object-fit:contain; background:var(--panel); }
.unseen-media-row>div { min-width:0; }
.unseen-media-row strong { font:12px/1.5 var(--mono); overflow-wrap:anywhere; }
@media(max-width:700px) { .unseen-media-row{grid-template-columns:48px minmax(0,1fr);gap:12px}.unseen-media-row>img{width:48px;height:64px}.unseen-media-row>button{grid-column:2;justify-self:start} }
.stopping-alerts{margin-bottom:32px;min-width:0}
.stopping-alert{border:1px solid var(--observatory-accent);border-left-width:4px;border-radius:4px;margin-top:16px;background:var(--panel)}
.stopping-alert summary{display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;padding:16px;min-height:44px;overflow-wrap:anywhere}
.stopping-alert summary>span{display:grid;gap:4px}.stopping-alert summary>strong{font:12px/1.5 var(--mono)}
.stopping-alert-body{padding:0 16px 16px}.stopping-alert-body p{margin:8px 0}.stopping-alert-body .cluster{flex-wrap:wrap}
.stopping-rule{margin-top:16px}.stopping-rule p{margin:12px 0}.stopping-empty{padding:16px 0;font-size:14px;border-bottom:1px solid var(--rule)}
@media(max-width:600px){.stopping-alert summary{align-items:flex-start;flex-direction:column}.stopping-alerts .section-heading{align-items:flex-start}}
