/* Source Code Extractor — report UI. Scoped under .xr so it never leaks into the page. */
.xr { --xr-bg: #030712; --xr-panel: #0d1117; --xr-panel-2: #111827; --xr-line: rgba(255,255,255,.07); --xr-line-2: rgba(255,255,255,.12);
      --xr-text: #e5e7eb; --xr-muted: #9ca3af; --xr-dim: #6b7280; --xr-accent: #10b981; --xr-accent-2: #34d399; --xr-warn: #f59e0b; --xr-bad: #f87171; --xr-info: #60a5fa;
      --xr-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace;
      background: var(--xr-bg); color: var(--xr-text); border-top: 1px solid var(--xr-line); padding-block: 4rem 5rem; }
.xr * { box-sizing: border-box; }
.xr-wrap { max-width: 80rem; margin: 0 auto; padding-inline: clamp(1rem, 4vw, 2rem); }
.xr-head { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: flex-end; justify-content: space-between; margin-bottom: 1.75rem; }
.xr-eyebrow { font: 700 .65rem/1 var(--xr-mono); letter-spacing: .25em; text-transform: uppercase; color: var(--xr-accent); margin: 0 0 .6rem; }
.xr-title { font-size: clamp(1.25rem, 2.5vw, 1.75rem); font-weight: 800; letter-spacing: -.01em; margin: 0; word-break: break-all; }
.xr-sub { color: var(--xr-dim); font: .78rem/1.5 var(--xr-mono); margin: .5rem 0 0; }
.xr-actions { display: flex; flex-wrap: wrap; gap: .5rem; }

.xr-btn { appearance: none; cursor: pointer; border: 1px solid var(--xr-line-2); background: rgba(255,255,255,.03); color: var(--xr-text);
          font: 600 .75rem/1 var(--xr-mono); padding: .6rem .85rem; border-radius: .6rem; transition: border-color .2s, background .2s; display: inline-flex; align-items: center; gap: .45rem; }
.xr-btn:hover { border-color: var(--xr-accent); background: rgba(16,185,129,.08); }
.xr-btn:disabled { opacity: .45; cursor: default; }
.xr-btn.is-primary { background: var(--xr-accent); color: #04110c; border-color: var(--xr-accent); }
.xr-btn.is-primary:hover { background: var(--xr-accent-2); }

.xr-tabs { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--xr-line); margin-bottom: 1.75rem; }
.xr-tabs::-webkit-scrollbar { display: none; }
.xr-tab { appearance: none; background: none; border: 0; border-bottom: 2px solid transparent; color: var(--xr-muted); cursor: pointer; white-space: nowrap;
          font: 600 .8rem/1 var(--xr-mono); padding: .8rem .9rem; margin-bottom: -1px; letter-spacing: .04em; }
.xr-tab:hover { color: var(--xr-text); }
.xr-tab[aria-selected="true"] { color: var(--xr-accent-2); border-bottom-color: var(--xr-accent); }
.xr-tab .xr-count { color: var(--xr-dim); margin-left: .35rem; font-weight: 500; }
.xr-panel[hidden] { display: none; }

.xr-grid { display: grid; gap: .85rem; align-items: start; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.xr-grid.is-tight { grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr)); }
.xr-grid.is-wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.xr-card { background: var(--xr-panel); border: 1px solid var(--xr-line); border-radius: 1rem; padding: 1.1rem 1.2rem; min-width: 0; }
.xr-card h3 { margin: 0 0 .85rem; font: 700 .68rem/1 var(--xr-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--xr-dim); }
.xr-card h3 .xr-count { color: var(--xr-accent); margin-left: .4rem; }
.xr-section { margin-top: 1.5rem; }
.xr-stat { background: linear-gradient(145deg, rgba(16,185,129,.06), rgba(3,7,18,1)); border: 1px solid var(--xr-line); border-radius: .9rem; padding: .9rem 1rem; min-width: 0; }
.xr-stat b { display: block; font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em; color: #fff; line-height: 1.15; word-break: break-word; }
.xr-stat span { display: block; font: 700 .6rem/1.3 var(--xr-mono); letter-spacing: .15em; text-transform: uppercase; color: var(--xr-accent); margin-top: .35rem; }
.xr-stat small { display: block; color: var(--xr-dim); font: .68rem/1.4 var(--xr-mono); margin-top: .3rem; }

.xr-kv { display: grid; grid-template-columns: max-content 1fr; gap: .45rem 1rem; margin: 0; font-size: .82rem; }
.xr-kv dt { color: var(--xr-dim); font: 600 .7rem/1.6 var(--xr-mono); text-transform: uppercase; letter-spacing: .08em; }
.xr-kv dd { margin: 0; color: var(--xr-text); overflow-wrap: anywhere; line-height: 1.5; }
.xr-kv dd.is-empty { color: var(--xr-dim); font-style: italic; }
.xr-mono { font-family: var(--xr-mono); font-size: .76rem; }
.xr-muted { color: var(--xr-muted); }
.xr-dim { color: var(--xr-dim); }

.xr-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.xr-table { width: 100%; border-collapse: collapse; font-size: .78rem; }
.xr-table th { text-align: left; font: 700 .62rem/1.2 var(--xr-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--xr-dim); padding: .5rem .6rem; border-bottom: 1px solid var(--xr-line-2); white-space: nowrap; }
.xr-table td { padding: .5rem .6rem; border-bottom: 1px solid var(--xr-line); vertical-align: top; color: var(--xr-text); max-width: 34rem; overflow-wrap: anywhere; }
.xr-table td.is-num { text-align: right; font-family: var(--xr-mono); white-space: nowrap; }
.xr-table td.is-mono { font-family: var(--xr-mono); font-size: .72rem; }
.xr-table tr:last-child td { border-bottom: 0; }

.xr-badge { display: inline-block; font: 700 .6rem/1 var(--xr-mono); letter-spacing: .08em; text-transform: uppercase; padding: .3rem .5rem; border-radius: .4rem; border: 1px solid transparent; white-space: nowrap; vertical-align: middle; }
.xr-badge.is-high { color: var(--xr-accent-2); background: rgba(16,185,129,.12); border-color: rgba(16,185,129,.25); }
.xr-badge.is-medium { color: var(--xr-info); background: rgba(96,165,250,.12); border-color: rgba(96,165,250,.25); }
.xr-badge.is-low { color: var(--xr-muted); background: rgba(156,163,175,.1); border-color: rgba(156,163,175,.2); }
.xr-badge.is-implied { color: var(--xr-dim); background: transparent; border-color: var(--xr-line-2); }
.xr-badge.is-good { color: var(--xr-accent-2); background: rgba(16,185,129,.12); }
.xr-badge.is-warn { color: var(--xr-warn); background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.25); }
.xr-badge.is-bad { color: var(--xr-bad); background: rgba(248,113,113,.12); border-color: rgba(248,113,113,.25); }
.xr-badge.is-info { color: var(--xr-info); background: rgba(96,165,250,.1); }
.xr-badge.is-ver { color: #fff; background: rgba(255,255,255,.08); border-color: var(--xr-line-2); text-transform: none; letter-spacing: 0; }

.xr-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.xr-chip { display: inline-flex; align-items: center; gap: .4rem; font: 500 .74rem/1 var(--xr-mono); color: var(--xr-text); background: rgba(255,255,255,.04); border: 1px solid var(--xr-line); border-radius: 999px; padding: .4rem .7rem; max-width: 100%; }
.xr-chip .xr-count { color: var(--xr-dim); }
.xr-chip.is-accent { border-color: rgba(16,185,129,.3); color: var(--xr-accent-2); }

.xr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; font-size: .8rem; }
.xr-list li { display: flex; gap: .6rem; align-items: flex-start; line-height: 1.5; }
.xr-list li .xr-badge { flex: none; margin-top: .15rem; }
.xr-check { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.xr-check li { display: grid; grid-template-columns: 1.2rem 1fr; gap: .5rem; font-size: .8rem; line-height: 1.45; }
.xr-check li i { font-style: normal; font-weight: 800; }
.xr-check li.is-ok i { color: var(--xr-accent-2); }
.xr-check li.is-fail i { color: var(--xr-warn); }
.xr-check small { display: block; color: var(--xr-dim); font: .72rem/1.4 var(--xr-mono); }

.xr-tree { list-style: none; margin: 0; padding: 0; font-size: .8rem; }
.xr-tree li { padding: .25rem 0 .25rem calc(var(--lvl, 0) * 1.1rem); display: flex; gap: .55rem; align-items: baseline; border-left: 1px solid transparent; line-height: 1.45; }
.xr-tree li .xr-tag { font: 700 .62rem/1 var(--xr-mono); color: var(--xr-accent); min-width: 2.2rem; letter-spacing: .05em; }
.xr-tree li .xr-txt { overflow-wrap: anywhere; }
.xr-tree li .xr-meta { color: var(--xr-dim); font: .68rem/1 var(--xr-mono); }

.xr-bars { display: grid; gap: .4rem; font-size: .76rem; }
.xr-bar { display: grid; grid-template-columns: minmax(5rem, 9rem) 1fr max-content; gap: .6rem; align-items: center; }
.xr-bar .xr-track { height: .45rem; background: rgba(255,255,255,.05); border-radius: 999px; overflow: hidden; }
.xr-bar .xr-fill { height: 100%; background: linear-gradient(90deg, var(--xr-accent), var(--xr-accent-2)); border-radius: 999px; }
.xr-bar .xr-n { font-family: var(--xr-mono); color: var(--xr-muted); }

.xr-swatches { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 8.5rem), 1fr)); }
.xr-swatch { border: 1px solid var(--xr-line); border-radius: .75rem; overflow: hidden; background: var(--xr-panel-2); min-width: 0; }
.xr-swatch .xr-color { height: 3.2rem; background-image: repeating-conic-gradient(#1f2937 0 25%, #111827 0 50%); background-size: 12px 12px; position: relative; }
.xr-swatch .xr-color::after { content: ''; position: absolute; inset: 0; background: var(--c); }
.xr-swatch .xr-info { padding: .5rem .6rem; font: .68rem/1.4 var(--xr-mono); color: var(--xr-muted); }
.xr-swatch .xr-info b { display: block; color: var(--xr-text); font-weight: 600; }
.xr-palette { display: flex; height: 2.4rem; border-radius: .6rem; overflow: hidden; border: 1px solid var(--xr-line); }
.xr-palette span { flex: 1; }
.xr-dot { display: inline-block; width: .8rem; height: .8rem; border-radius: .2rem; border: 1px solid rgba(255,255,255,.15); vertical-align: -.1rem; margin-right: .35rem; background: var(--c); }
.xr-gradient { height: 1.6rem; border-radius: .4rem; border: 1px solid var(--xr-line); margin-top: .35rem; }

.xr-evidence { font: .68rem/1.5 var(--xr-mono); color: var(--xr-dim); margin: .4rem 0 0; overflow-wrap: anywhere; }
.xr-tech { display: flex; flex-direction: column; gap: .25rem; padding: .75rem .85rem; border: 1px solid var(--xr-line); border-radius: .75rem; background: var(--xr-panel-2); min-width: 0; }
.xr-tech .xr-tech-name { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-weight: 700; font-size: .85rem; }
.xr-foot { color: var(--xr-dim); font: .72rem/1.6 var(--xr-mono); margin: 2rem 0 0; }
.xr-empty { color: var(--xr-dim); font: .78rem/1.5 var(--xr-mono); font-style: italic; }
.xr-more { margin-top: .75rem; }
.xr-code { background: #050a14; border: 1px solid var(--xr-line); border-radius: .6rem; padding: .8rem .9rem; font: .72rem/1.55 var(--xr-mono); color: var(--xr-muted); white-space: pre; overflow-x: auto; max-height: 18rem; margin: 0; }

@media (max-width: 640px) {
    .xr { padding-block: 3rem 3.5rem; }
    .xr-kv { grid-template-columns: 1fr; gap: .15rem .5rem; }
    .xr-kv dt { margin-top: .5rem; }
    .xr-bar { grid-template-columns: minmax(4rem, 6rem) 1fr max-content; }
}
@media (prefers-reduced-motion: reduce) { .xr * { transition: none !important; } }

/* ── Analyse a pasted DOM ── */
.xr-rendered { margin: 0 0 1.75rem; border: 1px solid var(--xr-line); border-radius: .8rem; background: var(--xr-panel); overflow: hidden; }
.xr-rendered.is-wanted { border-color: rgba(245, 158, 11, .45); background: linear-gradient(160deg, rgba(245, 158, 11, .07), var(--xr-panel) 60%); }
.xr-rendered > summary { cursor: pointer; padding: .85rem 1.1rem; display: flex; flex-wrap: wrap; gap: .3rem 1rem; align-items: baseline; list-style: none; }
.xr-rendered > summary::-webkit-details-marker { display: none; }
.xr-rendered > summary::before { content: '▸'; color: var(--xr-accent); margin-right: .5rem; transition: transform .2s; display: inline-block; }
.xr-rendered[open] > summary::before { transform: rotate(90deg); }
.xr-rendered-title { color: var(--xr-text); font: 600 .82rem/1 var(--xr-mono); letter-spacing: .08em; }
.xr-rendered-hint { color: var(--xr-dim); font-size: .78rem; }
.xr-rendered.is-wanted .xr-rendered-hint { color: var(--xr-warn); }
.xr-rendered-body { padding: 0 1.1rem 1.1rem; display: grid; gap: .7rem; }
.xr-rendered-body p { margin: 0; color: var(--xr-muted); font-size: .84rem; line-height: 1.6; max-width: 62rem; }
.xr-rendered-body kbd { padding: .1rem .35rem; border: 1px solid var(--xr-line-2); border-radius: .25rem; font: 600 .74rem/1 var(--xr-mono); color: var(--xr-text); }
.xr-rendered-body #xr-rendered-snippet { cursor: copy; }
.xr-rendered-body textarea { width: 100%; padding: .8rem .9rem; border: 1px solid var(--xr-line-2); border-radius: .6rem; background: #050a14; color: var(--xr-text); font: .76rem/1.5 var(--xr-mono); resize: vertical; }
.xr-rendered-body textarea:focus { outline: none; border-color: var(--xr-accent); box-shadow: 0 0 0 3px rgba(16, 185, 129, .15); }