:root {
  --sample-bg: #f7f6f2;
  --sample-surface: #ffffff;
  --sample-soft: #edf2f3;
  --sample-ink: #172033;
  --sample-muted: #596779;
  --sample-line: #d7dfdf;
  --sample-blue: #2563eb;
  --sample-cyan: #087f9b;
  --sample-navy: #10223d;
  --sample-warm-soft: #f5f0e5;
  --sample-warm-ink: #715b31;
  --sample-mint-soft: #edf4f1;
  --sample-danger-soft: #f8eeee;
  --sample-question-soft: #edf4f5;
  --sample-action-soft: #eef4f1;
  --sample-evidence-bg: #eef4f5;
  --sample-evidence-ink: #172033;
  --sample-evidence-muted: #536274;
  --sample-evidence-line: #cedbdd;
  --sample-evidence-accent: #087f9b;
  --sample-limits-bg: #edf3f5;
  --sample-limits-ink: #172033;
  --sample-limits-muted: #596779;
  --sample-limits-line: #cad8dc;
  --sample-limits-accent: #087f9b;
  --sample-glow: rgba(14, 165, 233, .18);
  --sample-shadow: 0 24px 70px rgba(40, 55, 72, .13), 0 3px 10px rgba(40, 55, 72, .06);
}

html[data-theme="dark"] {
  --sample-bg: #081522;
  --sample-surface: #101f31;
  --sample-soft: #172a3d;
  --sample-ink: #f1f5f9;
  --sample-muted: #b3c0cf;
  --sample-line: #2a4055;
  --sample-blue: #60a5fa;
  --sample-cyan: #55d6e8;
  --sample-navy: #071522;
  --sample-warm-soft: #1b2932;
  --sample-warm-ink: #fde68a;
  --sample-mint-soft: #172c32;
  --sample-danger-soft: #281f29;
  --sample-question-soft: #152a35;
  --sample-action-soft: #172c2f;
  --sample-evidence-bg: #0b1a2a;
  --sample-evidence-ink: #f8fafc;
  --sample-evidence-muted: #a9b7c9;
  --sample-evidence-line: #2a4055;
  --sample-evidence-accent: #67e8f9;
  --sample-limits-bg: #071522;
  --sample-limits-ink: #f8fafc;
  --sample-limits-muted: #b3c0cf;
  --sample-limits-line: #2a4055;
  --sample-limits-accent: #67e8f9;
  --sample-glow: rgba(34, 211, 238, .15);
  --sample-shadow: 0 25px 75px rgba(0, 0, 0, .32);
}

.sample-page { background: var(--sample-bg); color: var(--sample-ink); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.sample-page main { overflow: hidden; }
.sample-shell { width: min(100% - 3rem, 76rem); margin-inline: auto; }
.sample-header { border-bottom: 1px solid color-mix(in srgb, var(--sample-line) 85%, transparent); background: color-mix(in srgb, var(--sample-bg) 90%, transparent); backdrop-filter: blur(18px); }
.sample-header-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.4rem; width: min(100% - 3rem, 88rem); min-height: 5rem; margin-inline: auto; }
.sample-header .account-actions { justify-self: end; }
.sample-header .account-actions > a:first-child { color: var(--sample-ink) !important; }
.sample-header .account-actions > a:first-child:hover { color: var(--sample-blue) !important; }
.sample-page-nav { display: flex; align-items: center; gap: 1.7rem; }
.sample-page-nav a { color: var(--sample-muted); font-size: .78rem; font-weight: 760; letter-spacing: .025em; transition: color .2s ease; }
.sample-page-nav a:hover { color: var(--sample-blue); }

.sample-hero { position: relative; min-height: min(58rem, 100vh); padding: 9.5rem 0 6.5rem; background: radial-gradient(circle at 77% 28%, var(--sample-glow), transparent 27rem), radial-gradient(circle at 10% 100%, color-mix(in srgb, var(--sample-blue) 7%, transparent), transparent 24rem); }
.sample-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, var(--sample-line), transparent); }
.sample-hero-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(32rem, 1.15fr); align-items: center; gap: clamp(3rem, 6vw, 6rem); }
.sample-kicker { color: var(--sample-cyan); font-size: .72rem; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; }
.sample-hero h1 { max-width: 18ch; margin-top: 1rem; font-size: calc(3rem - 1pt); font-weight: 800; letter-spacing: normal; line-height: 1.18; text-wrap: balance; }
.sample-lead { max-width: 39rem; margin-top: 1.6rem; color: var(--sample-muted); font-size: 1.125rem; line-height: 1.72; }
.sample-trust-badge { display: flex; align-items: center; gap: .65rem; width: fit-content; margin-top: 1.65rem; padding: .65rem .85rem; border: 1px solid color-mix(in srgb, var(--sample-cyan) 35%, var(--sample-line)); border-radius: 999px; background: color-mix(in srgb, var(--sample-cyan) 8%, var(--sample-surface)); color: var(--sample-ink); font-size: .75rem; }
.sample-trust-badge span { display: grid; place-items: center; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: var(--sample-cyan); color: white; font-size: .72rem; }
.sample-actions, .sample-cta-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.sample-primary-action, .sample-secondary-action { display: inline-flex; min-height: 3.25rem; align-items: center; justify-content: center; border-radius: .6rem; padding: .8rem 1.35rem; font-size: .9rem; font-weight: 800; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.sample-primary-action { border: 1px solid var(--sample-blue); background: var(--sample-blue); color: white; box-shadow: 0 12px 28px color-mix(in srgb, var(--sample-blue) 22%, transparent); }
.sample-secondary-action { border: 1px solid var(--sample-line); background: var(--sample-surface); color: var(--sample-ink); }
.sample-primary-action:hover, .sample-secondary-action:hover { transform: translateY(-2px); }
.sample-plain-note { max-width: 37rem; margin-top: 1.2rem; color: var(--sample-muted); font-size: .75rem; line-height: 1.55; }

.sample-video-card { overflow: hidden; border: 1px solid var(--sample-line); border-radius: 1.35rem; background: var(--sample-surface); box-shadow: var(--sample-shadow); }
.video-stage { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: #0a1220; }
.video-stage video { width: 100%; height: 100%; object-fit: cover; }
.video-stage::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(4, 9, 18, .08), transparent 55%, rgba(4, 9, 18, .5)); }
.media-mode-switch { position: absolute; z-index: 5; top: .85rem; left: .85rem; display: flex; gap: .25rem; padding: .25rem; border: 1px solid rgba(255,255,255,.2); border-radius: .75rem; background: rgba(7,17,31,.7); backdrop-filter: blur(10px); }
.media-mode-switch button { display: flex; align-items: center; gap: .42rem; border-radius: .52rem; padding: .48rem .68rem; color: #cbd5e1; font-size: .64rem; font-weight: 760; transition: background .2s ease, color .2s ease; }
.media-mode-switch button[aria-selected="true"] { background: rgba(255,255,255,.14); color: white; }
.media-mode-switch i { width: .4rem; height: .4rem; border-radius: 50%; background: #34d399; box-shadow: 0 0 0 .2rem rgba(52,211,153,.13); }
.media-mode-switch .tracking-mode-dot { background: #ef4444; box-shadow: 0 0 0 .2rem rgba(239,68,68,.15); }
.tracking-stage { position: absolute; z-index: 2; inset: 0; background: #020617; }
.tracking-stage[hidden] { display: none; }
.tracking-stage [hidden] { display: none !important; }
.tracking-stage > img { width: 100%; height: 100%; object-fit: contain; }
.tracking-pose-canvas { position: absolute; z-index: 3; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.tracking-box { position: absolute; z-index: 4; left: 24.6875%; top: 25.5572%; width: 50.8947%; height: 59.3401%; border: 2px solid #fbbf24; box-shadow: 0 0 0 1px rgba(15,23,42,.4), inset 0 0 25px rgba(251,191,36,.06); transition: left .24s ease, top .24s ease, width .24s ease, height .24s ease; }
.tracking-box::before, .tracking-box::after { content: ""; position: absolute; width: 1rem; height: 1rem; border-color: #fde68a; }
.tracking-box::before { top: -.22rem; left: -.22rem; border-top: 4px solid; border-left: 4px solid; }
.tracking-box::after { right: -.22rem; bottom: -.22rem; border-right: 4px solid; border-bottom: 4px solid; }
.tracking-box span { position: absolute; top: -1.55rem; left: -2px; padding: .22rem .4rem; border-radius: .25rem .25rem 0 0; background: #fbbf24; color: #172033; font-size: .56rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.tracking-face-box { position: absolute; z-index: 4; border: 2px dashed #6ee7b7; box-shadow: 0 0 18px rgba(52,211,153,.18); transition: left .24s ease, top .24s ease, width .24s ease, height .24s ease; }
.tracking-face-box span { position: absolute; right: -2px; bottom: -1.32rem; padding: .2rem .38rem; border-radius: 0 0 .25rem .25rem; background: #34d399; color: #052e2b; font-size: .54rem; font-weight: 900; text-transform: uppercase; white-space: nowrap; }
.tracking-layer-toolbar { position: absolute; z-index: 6; top: 3.65rem; left: .85rem; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; max-width: calc(100% - 1.7rem); padding: .3rem; border: 1px solid rgba(103,232,249,.22); border-radius: .58rem; background: rgba(7,17,31,.74); backdrop-filter: blur(9px); }
.tracking-layer-toolbar > span { padding-inline: .3rem; color: #94a3b8; font-size: .54rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.tracking-layer-toolbar button { border: 1px solid #334155; border-radius: .36rem; padding: .32rem .48rem; color: #94a3b8; font-size: .56rem; font-weight: 780; }
.tracking-layer-toolbar button[aria-pressed="true"] { border-color: rgba(103,232,249,.58); background: rgba(8,145,178,.24); color: #cffafe; }
.tracking-layer-toolbar button:disabled { cursor: not-allowed; opacity: .4; }
.tracking-face-readout { position: absolute; z-index: 4; left: .85rem; bottom: .75rem; max-width: 56%; border: 1px solid rgba(52,211,153,.3); border-radius: .5rem; padding: .42rem .58rem; background: rgba(7,17,31,.78); color: #a7f3d0; font-size: .56rem; line-height: 1.35; backdrop-filter: blur(8px); }
.tracking-readout { position: absolute; z-index: 4; right: .85rem; bottom: .75rem; display: flex; align-items: center; gap: .8rem; border: 1px solid rgba(251,191,36,.3); border-radius: .5rem; padding: .42rem .58rem; background: rgba(7,17,31,.78); color: #e2e8f0; font-size: .58rem; backdrop-filter: blur(8px); }
.tracking-readout span { display: flex; align-items: center; gap: .4rem; font-weight: 760; text-transform: uppercase; letter-spacing: .07em; }
.tracking-readout i { width: .42rem; height: .42rem; border-radius: 50%; background: #34d399; box-shadow: 0 0 0 .2rem rgba(52,211,153,.13); }
.tracking-readout b { color: #fde68a; font-variant-numeric: tabular-nums; }
.analysis-scan { position: absolute; z-index: 3; inset: 0; display: none; pointer-events: none; background: linear-gradient(180deg, transparent 0 47%, rgba(85,214,232,.8) 49.5%, rgba(85,214,232,.22) 50.5%, transparent 54%); filter: drop-shadow(0 0 10px rgba(85,214,232,.75)); }
.sample-video-card.is-replaying .analysis-scan { display: block; animation: sample-scan 2.1s ease-in-out infinite; }
@keyframes sample-scan { from { transform: translateY(-52%); } to { transform: translateY(52%); } }
.video-controls { display: grid; grid-template-columns: auto auto minmax(6rem, 1fr) auto; align-items: center; gap: .75rem; padding: .8rem 1rem; border-bottom: 1px solid var(--sample-line); }
.video-controls button { display: inline-flex; align-items: center; gap: .35rem; color: var(--sample-ink); font-size: .72rem; font-weight: 800; }
.video-time { color: var(--sample-muted); font-size: .68rem; font-variant-numeric: tabular-nums; }
.video-time b { color: var(--sample-ink); }
.video-controls input { width: 100%; accent-color: var(--sample-cyan); }
.tracking-controls { grid-template-columns: auto 1fr auto auto; align-items: center; gap: .65rem; padding: .72rem 1rem; border-bottom: 1px solid var(--sample-line); }
.tracking-controls:not([hidden]) { display: grid; }
.tracking-controls button { min-width: 2rem; min-height: 2rem; border: 1px solid var(--sample-line); border-radius: .45rem; padding-inline: .6rem; color: var(--sample-ink); font-size: .72rem; font-weight: 800; }
.tracking-controls div { text-align: center; }
.tracking-controls strong, .tracking-controls small { display: block; }
.tracking-controls strong { color: var(--sample-ink); font-size: .68rem; }
.tracking-controls small { margin-top: .1rem; color: var(--sample-muted); font-size: .57rem; }
.tracking-summary { align-items: center; justify-content: space-between; gap: 1rem; padding: .62rem 1rem; border-bottom: 1px solid var(--sample-line); background: color-mix(in srgb, #fbbf24 7%, var(--sample-surface)); font-size: .62rem; }
.tracking-summary:not([hidden]) { display: flex; }
.tracking-summary strong { color: var(--sample-ink); }
.tracking-summary span { color: var(--sample-muted); text-align: right; }
.analysis-replay { padding: 1rem 1.1rem 1.15rem; }
.replay-heading { display: flex; justify-content: space-between; gap: 1rem; color: var(--sample-muted); font-size: .7rem; }
.replay-heading b { color: var(--sample-cyan); font-variant-numeric: tabular-nums; }
.replay-track { overflow: hidden; height: .25rem; margin-top: .65rem; border-radius: 999px; background: var(--sample-soft); }
.replay-track i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--sample-blue), var(--sample-cyan)); transition: width .15s linear; }
.analysis-replay ol { display: grid; grid-template-columns: repeat(4, 1fr); gap: .55rem; margin-top: .9rem; }
.analysis-replay li { display: flex; gap: .5rem; min-width: 0; padding: .55rem; border: 1px solid transparent; border-radius: .6rem; opacity: .48; transition: opacity .25s ease, background .25s ease, border-color .25s ease; }
.analysis-replay li.is-active { border-color: color-mix(in srgb, var(--sample-cyan) 30%, var(--sample-line)); background: color-mix(in srgb, var(--sample-cyan) 8%, transparent); opacity: 1; }
.analysis-replay li > span { color: var(--sample-cyan); font-size: .62rem; font-weight: 850; }
.analysis-replay strong, .analysis-replay small { display: block; }
.analysis-replay strong { font-size: .68rem; }
.analysis-replay small { overflow: hidden; margin-top: .12rem; color: var(--sample-muted); font-size: .58rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }

.sample-context { padding: 5.5rem 0; border-bottom: 1px solid var(--sample-line); }
.context-grid { display: grid; grid-template-columns: .7fr 1.05fr .85fr; gap: 3rem; align-items: start; }
.context-intro h2, .section-heading h2, .limits-copy h2, .sample-cta-panel h2 { margin-top: .65rem; font-size: clamp(1.65rem, 2.25vw, 2rem); font-weight: 840; letter-spacing: -.042em; line-height: 1.05; }
.context-intro > p:last-child, .section-heading > p:last-child, .limits-copy > p:last-child { margin-top: 1rem; color: var(--sample-muted); line-height: 1.7; }
.profile-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
.profile-facts div { min-height: 6.2rem; padding: 1.15rem; border: 1px solid var(--sample-line); border-radius: .8rem; background: var(--sample-surface); }
.profile-facts dt { color: var(--sample-muted); font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.profile-facts dd { margin-top: .45rem; font-size: .91rem; font-weight: 790; line-height: 1.4; }
.owner-context { padding: 1.5rem; border-left: 3px solid var(--sample-cyan); background: color-mix(in srgb, var(--sample-cyan) 6%, var(--sample-surface)); }
.owner-context > span { color: var(--sample-cyan); font-size: .66rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.owner-context blockquote { margin-top: .75rem; font-size: .96rem; font-weight: 650; line-height: 1.62; }
.owner-context p { margin-top: .85rem; color: var(--sample-muted); font-size: .73rem; line-height: 1.5; }

.sample-section { padding: clamp(5rem, 8vw, 7.5rem) 0; scroll-margin-top: 5rem; }
.section-heading { max-width: 48rem; }
.result-section { background: linear-gradient(180deg, color-mix(in srgb, var(--sample-soft) 55%, transparent), transparent); }
.sample-answer-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1.35rem; margin-top: 2.4rem; padding: clamp(1.5rem, 3vw, 2.25rem); border: 1px solid color-mix(in srgb, #c8993d 34%, var(--sample-line)); border-radius: 1rem; background: linear-gradient(135deg, color-mix(in srgb, var(--sample-warm-soft) 62%, var(--sample-surface)), color-mix(in srgb, var(--sample-mint-soft) 42%, var(--sample-surface))); box-shadow: 0 16px 42px rgba(40,55,72,.08); }
.sample-answer-icon { display: grid; place-items: center; width: 4rem; height: 4rem; border: 1px solid color-mix(in srgb, #c8993d 38%, var(--sample-line)); border-radius: 50%; background: color-mix(in srgb, var(--sample-warm-soft) 72%, var(--sample-surface)); font-size: 1.8rem; }
.sample-answer-icon img { width: 1.75rem; height: 2rem; object-fit: contain; }
.sample-answer-card blockquote { font-size: clamp(1.65rem, 3vw, 2.55rem); font-weight: 850; letter-spacing: -.045em; line-height: 1.08; text-wrap: balance; }
.sample-answer-card blockquote + p { margin-top: .72rem; color: var(--sample-muted); font-size: 1rem; line-height: 1.6; }
.sample-answer-card small { display: block; margin-top: .85rem; color: var(--sample-muted); font-size: .7rem; line-height: 1.5; }
.sample-answer-confidence { align-self: start; border: 1px solid color-mix(in srgb, #c8993d 32%, var(--sample-line)); border-radius: 999px; padding: .4rem .7rem; background: color-mix(in srgb, var(--sample-warm-soft) 52%, var(--sample-surface)); color: var(--sample-warm-ink); font-size: .66rem; font-weight: 820; letter-spacing: .05em; text-transform: uppercase; }

.sample-why-panel { overflow: hidden; margin-top: 1rem; border: 1px solid color-mix(in srgb, #c8993d 28%, var(--sample-line)); border-radius: 1rem; background: linear-gradient(135deg, color-mix(in srgb, var(--sample-warm-soft) 44%, var(--sample-surface)), color-mix(in srgb, var(--sample-mint-soft) 38%, var(--sample-surface))); box-shadow: 0 12px 32px rgba(40,55,72,.055); }
.sample-why-panel summary { display: flex; cursor: pointer; list-style: none; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.5rem; color: var(--sample-warm-ink); font-size: 1.05rem; font-weight: 830; }
.sample-why-panel summary::-webkit-details-marker { display: none; }
.sample-why-panel summary i { font-style: normal; transition: transform .2s ease; }
.sample-why-panel[open] summary i { transform: rotate(180deg); }
.sample-why-content { padding: 1.4rem; border-top: 1px solid color-mix(in srgb, #c8993d 20%, var(--sample-line)); }
.sample-why-intro { max-width: 52rem; color: var(--sample-muted); font-size: .82rem; line-height: 1.6; }
.sample-cause-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: 1.15rem; }
.sample-cause-card { padding: 1.05rem; border: 1px solid var(--sample-line); border-radius: .75rem; background: color-mix(in srgb, var(--sample-surface) 88%, var(--sample-soft)); }
.sample-cause-card.is-primary { border-color: color-mix(in srgb, #c8993d 32%, var(--sample-line)); background: color-mix(in srgb, var(--sample-warm-soft) 48%, var(--sample-surface)); }
.sample-cause-card.is-safety { border-color: color-mix(in srgb, #dc6b79 27%, var(--sample-line)); background: color-mix(in srgb, var(--sample-danger-soft) 38%, var(--sample-surface)); }
.sample-cause-card > div { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.sample-cause-card h3 { font-size: .9rem; font-weight: 820; line-height: 1.3; }
.sample-cause-card span { flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--sample-line) 78%, transparent); border-radius: 999px; padding: .25rem .45rem; background: color-mix(in srgb, var(--sample-surface) 72%, transparent); color: var(--sample-muted); font-size: .56rem; font-weight: 790; }
.sample-cause-card p { margin-top: .65rem; color: var(--sample-muted); font-size: .76rem; line-height: 1.55; }
.sample-why-followup { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-top: .75rem; }
.sample-why-followup > div { padding: 1rem; border: 1px solid var(--sample-line); border-radius: .75rem; }
.sample-why-followup strong { display: block; color: var(--sample-cyan); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.sample-why-followup p { margin-top: .45rem; font-size: .78rem; line-height: 1.55; }
.sample-why-question { background: color-mix(in srgb, var(--sample-question-soft) 44%, var(--sample-surface)); }
.sample-why-action { background: color-mix(in srgb, var(--sample-action-soft) 36%, var(--sample-surface)); }

.result-detail-heading { max-width: 48rem; margin-top: clamp(3.5rem, 7vw, 5.5rem); }
.result-detail-heading h3 { margin-top: .65rem; font-size: clamp(1.55rem, 2.2vw, 1.9rem); font-weight: 840; letter-spacing: -.04em; line-height: 1.08; }
.result-detail-heading > p:last-child { margin-top: .85rem; color: var(--sample-muted); line-height: 1.65; }
.result-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-top: 3rem; }
.result-card { position: relative; overflow: hidden; min-height: 24rem; padding: clamp(1.5rem, 3vw, 2.3rem); border: 1px solid var(--sample-line); border-radius: 1rem; background: var(--sample-surface); box-shadow: 0 14px 40px rgba(40,55,72,.06); }
.result-card::before { content: ""; position: absolute; inset: 0 0 auto; height: .27rem; background: var(--sample-cyan); }
.sample-interpretation-card::before { background: linear-gradient(90deg, var(--sample-blue), var(--sample-cyan)); }
.result-card-top { display: flex; justify-content: space-between; gap: 1rem; color: var(--sample-cyan); font-size: .69rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.result-card-top b { border-radius: 999px; padding: .32rem .55rem; background: var(--sample-soft); color: var(--sample-muted); font-size: .59rem; letter-spacing: .04em; }
.result-card h3 { max-width: 19ch; margin-top: 3.2rem; font-size: clamp(1.5rem, 2.25vw, 2rem); font-weight: 840; letter-spacing: -.04em; line-height: 1.05; }
.result-card > p { max-width: 34rem; margin-top: 1.2rem; color: var(--sample-muted); line-height: 1.7; }
.confidence-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .85rem; margin-top: 2rem; }
.confidence-row > span { overflow: hidden; height: .45rem; border-radius: 999px; background: var(--sample-soft); }
.confidence-row i { display: block; width: var(--score); height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--sample-blue), var(--sample-cyan)); }
.confidence-row strong { font-size: .82rem; }
.result-card > small { display: block; margin-top: .65rem; color: var(--sample-muted); font-size: .65rem; }
.result-evidence { display: grid; grid-template-columns: .45fr 1.5fr; gap: 1.5rem 3rem; margin-top: 1rem; padding: 2rem; border: 1px solid var(--sample-evidence-line); border-radius: 1rem; background: var(--sample-evidence-bg); color: var(--sample-evidence-ink); }
.result-evidence .sample-kicker { color: var(--sample-evidence-accent); }
.result-evidence ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.result-evidence li { display: flex; gap: .7rem; }
.result-evidence li > span { color: var(--sample-evidence-accent); font-size: .67rem; font-weight: 850; }
.result-evidence li p { color: var(--sample-evidence-muted); font-size: .78rem; line-height: 1.55; }
.result-evidence li strong { display: block; margin-bottom: .25rem; color: var(--sample-evidence-ink); }
.result-scope { grid-column: 2; padding-top: 1.1rem; border-top: 1px solid var(--sample-evidence-line); color: var(--sample-evidence-muted); font-size: .75rem; line-height: 1.55; }
.result-scope strong { color: var(--sample-evidence-accent); }

.evidence-section { border-block: 1px solid var(--sample-line); }
.evidence-explorer { margin-top: 3rem; }
.evidence-tabs { display: flex; overflow-x: auto; gap: .45rem; padding-bottom: .8rem; scrollbar-width: thin; }
.evidence-tabs button { flex: 0 0 auto; border: 1px solid var(--sample-line); border-radius: 999px; padding: .65rem 1rem; background: var(--sample-surface); color: var(--sample-muted); font-size: .75rem; font-weight: 790; }
.evidence-tabs button[aria-selected="true"] { border-color: var(--sample-cyan); background: var(--sample-cyan); color: white; }
.evidence-panel { display: grid; grid-template-columns: minmax(20rem, .92fr) minmax(0, 1.08fr); overflow: hidden; min-height: 27rem; border: 1px solid var(--sample-line); border-radius: 1rem; background: var(--sample-surface); box-shadow: var(--sample-shadow); }
.evidence-panel img { width: 100%; height: 100%; object-fit: cover; }
.evidence-panel > div { padding: clamp(1.7rem, 4vw, 3.3rem); }
.evidence-time { color: var(--sample-cyan); font-size: .67rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.evidence-panel h3 { margin-top: .8rem; font-size: clamp(1.5rem, 2.25vw, 2rem); font-weight: 840; letter-spacing: -.04em; line-height: 1.05; }
.evidence-panel h3 + p { margin-top: 1.15rem; color: var(--sample-muted); line-height: 1.72; }
.evidence-metric { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding-block: .9rem; border-block: 1px solid var(--sample-line); color: var(--sample-muted); font-size: .73rem; }
.evidence-metric strong { color: var(--sample-ink); }
.evidence-limit { margin-top: 1.4rem; padding: 1rem; border-radius: .65rem; background: var(--sample-soft); color: var(--sample-muted); font-size: .73rem; line-height: 1.55; }
.evidence-limit strong { color: var(--sample-ink); }

.limits-section { background: var(--sample-limits-bg); color: var(--sample-limits-ink); }
.limits-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(3rem, 7vw, 7rem); }
.limits-copy .sample-kicker { color: var(--sample-limits-accent); }
.limits-copy > p:last-child { color: var(--sample-limits-muted); }
.limits-list { border-top: 1px solid var(--sample-limits-line); }
.limits-list li { display: grid; grid-template-columns: 2rem 1fr; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid var(--sample-limits-line); }
.limits-list li > span { color: var(--sample-limits-accent); font-size: .68rem; font-weight: 850; }
.limits-list p { color: var(--sample-limits-muted); font-size: .86rem; line-height: 1.6; }
.limits-list strong { color: var(--sample-limits-ink); }
.sample-final-cta { padding: 5rem 0; }
.sample-cta-panel { display: flex; align-items: center; justify-content: space-between; gap: 3rem; padding: clamp(2rem, 5vw, 4rem); border: 1px solid var(--sample-line); border-radius: 1.2rem; background: radial-gradient(circle at 88% 20%, var(--sample-glow), transparent 19rem), var(--sample-surface); box-shadow: var(--sample-shadow); }
.sample-cta-panel h2 { max-width: 24ch; }
.sample-cta-panel > div > p:last-child { margin-top: .8rem; color: var(--sample-muted); }
.sample-cta-actions { flex: 0 0 auto; margin-top: 0; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .sample-page-nav { display: none; }
  .sample-header-inner { grid-template-columns: 1fr auto; }
  .sample-hero { min-height: auto; }
  .sample-hero-grid { grid-template-columns: 1fr; }
  .sample-hero-copy { text-align: center; }
  .sample-hero h1, .sample-lead, .sample-plain-note, .sample-trust-badge { margin-inline: auto; }
  .sample-actions { justify-content: center; }
  .context-grid { grid-template-columns: 1fr 1fr; }
  .context-intro { grid-column: 1 / -1; max-width: 42rem; }
  .result-evidence { grid-template-columns: 1fr; }
  .result-evidence ol { grid-column: 1; }
  .result-scope { grid-column: 1; }
  .limits-grid { grid-template-columns: 1fr; }
  .limits-copy { max-width: 40rem; }
  .sample-cta-panel { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 700px) {
  .sample-shell, .sample-header-inner { width: min(100% - 1.25rem, 76rem); }
  .sample-header .account-actions > a:first-child { display: none; }
  .sample-header .theme-logo { max-width: 8.6rem; }
  .sample-hero { padding: 7.7rem 0 4.5rem; }
  .sample-hero h1 { font-size: 2.25rem; }
  .sample-trust-badge { align-items: flex-start; border-radius: .75rem; text-align: left; }
  .sample-video-card { border-radius: .9rem; }
  .control-word { display: none; }
  .media-mode-switch { right: .55rem; left: .55rem; justify-content: center; }
  .media-mode-switch button { justify-content: center; padding-inline: .5rem; font-size: .58rem; }
  .tracking-layer-toolbar { top: 3.45rem; right: .55rem; left: .55rem; justify-content: center; }
  .tracking-layer-toolbar > span { display: none; }
  .tracking-face-readout { left: .5rem; bottom: .45rem; max-width: 62%; font-size: .5rem; }
  .tracking-readout { right: .5rem; bottom: .45rem; }
  .tracking-readout span { display: none; }
  .tracking-summary { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .tracking-summary span { text-align: left; }
  .video-controls { grid-template-columns: auto auto 1fr auto; gap: .5rem; padding-inline: .7rem; }
  .analysis-replay ol { grid-template-columns: repeat(2, 1fr); }
  .sample-context { padding: 4rem 0; }
  .context-grid, .result-grid, .evidence-panel { grid-template-columns: 1fr; }
  .sample-answer-card { grid-template-columns: auto minmax(0, 1fr); }
  .sample-answer-confidence { grid-column: 2; justify-self: start; }
  .sample-cause-grid, .sample-why-followup { grid-template-columns: 1fr; }
  .profile-facts { grid-template-columns: 1fr 1fr; }
  .result-card { min-height: 21rem; }
  .result-evidence { padding: 1.35rem; }
  .result-evidence ol { grid-template-columns: 1fr; }
  .evidence-panel { min-height: 0; }
  .evidence-panel img { aspect-ratio: 16 / 10; }
  .sample-section { padding-block: 4.5rem; }
  .sample-cta-actions { width: 100%; }
  .sample-cta-actions a { width: 100%; }
}

@media (max-width: 430px) {
  .sample-header .account-actions > a:nth-child(2) { padding-inline: .7rem; font-size: .72rem; }
  .profile-facts { grid-template-columns: 1fr; }
  .sample-actions > * { width: 100%; }
  .sample-answer-card { grid-template-columns: 1fr; }
  .sample-answer-icon { width: 3.4rem; height: 3.4rem; }
  .sample-answer-confidence { grid-column: 1; }
  .sample-why-panel summary { padding-inline: 1rem; }
  .sample-why-content { padding: 1rem; }
  .sample-cause-card > div { flex-direction: column; }
  .analysis-replay small { display: none; }
  .result-card-top { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .sample-video-card.is-replaying .analysis-scan { animation: none; }
  html { scroll-behavior: auto; }
}