/* Local review concept: a visual explanation, with the full guide on demand. */
.trial-visual { --ink:#142532; --blue:#1269bd; --line:#cdd8e1; --paper:#f2f5f7; }
.trial-visual .visual-intro { padding:36px 0 40px; }
.trial-visual .visual-intro-inner { display:grid; grid-template-columns:1.35fr 1fr; align-items:end; gap:50px; }
.trial-visual .visual-kicker { color:var(--blue); font-weight:600; font-size:14px; margin-bottom:16px; }
.trial-visual h1 { font:800 clamp(36px,4.6vw,64px)/1.05 var(--font-display); letter-spacing:-2px; color:var(--ink); margin:0; max-width:780px; }
.trial-visual h1 span { color:var(--blue); }
.trial-visual .visual-intro p { max-width:430px; line-height:1.6; }
.trial-visual .visual-intro .trial-actions { justify-content:flex-start; }
.trial-visual .visual-section { padding:40px 0 64px; }
.trial-visual .visual-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:24px; }
.trial-visual .visual-heading h2 { margin:0; font-size:clamp(25px,3vw,36px); }
.trial-visual .visual-play { color:var(--blue); background:white; border:1px solid var(--line); border-radius:30px; padding:12px 20px; font:600 14px var(--font-body); cursor:pointer; flex-shrink:0; min-height:44px; }
.trial-visual button:focus-visible,.trial-visual summary:focus-visible,.trial-visual a:focus-visible { outline:3px solid #1269bd; outline-offset:5px; }
.trial-visual .visual-board { border:1px solid var(--line); background:var(--paper); border-radius:18px; overflow:hidden; }
.trial-visual .visual-stages { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:12px 28px 0; gap:28px; }
.trial-visual .visual-stage { position:relative; border:0; border-bottom:3px solid transparent; padding:20px 12px; background:transparent; text-align:left; color:var(--ink); font:inherit; }
.trial-visual.visual-ready .visual-stage { cursor:pointer; }
.trial-visual .visual-stage:not(:last-child)::after { content:'→'; color:#7190a9; position:absolute; right:-26px; top:99px; font:300 32px var(--font-body); }
.trial-visual .visual-stage svg { display:block; width:100%; height:180px; margin-bottom:12px; }
.trial-visual .visual-stage strong { display:block; font:700 21px var(--font-display); margin-bottom:5px; }
.trial-visual .visual-stage span { color:#516473; font-size:14px; }
.trial-visual.visual-ready .visual-stage[aria-pressed="true"] { border-bottom-color:var(--blue); }
.trial-visual.visual-ready .visual-stage[aria-pressed="true"] strong { color:var(--blue); }
.trial-visual .visual-signal { stroke:var(--blue); stroke-width:3; fill:none; }
.trial-visual .visual-signal-dot { fill:var(--blue); }
.trial-visual.visual-ready .visual-stage[aria-pressed="false"] .visual-signal { stroke:#8095a4; }
.trial-visual .visual-panel { display:grid; grid-template-columns:1fr 1fr; background:white; border-top:1px solid var(--line); min-height:250px; }
.trial-visual .visual-panel-copy { padding:36px; align-self:center; }
.trial-visual .visual-panel-copy h3 { font-size:26px; margin-bottom:12px; }
.trial-visual .visual-panel-copy p { margin-bottom:16px; line-height:1.65; max-width:450px; }
.trial-visual .visual-panel-copy a { color:var(--blue); font-weight:600; }
.trial-visual .visual-panel figure { position:relative; margin:0; min-height:250px; }
.trial-visual .visual-panel img { display:block; width:100%; height:100%; max-height:310px; object-fit:cover; }
.trial-visual .visual-panel figcaption { position:absolute; bottom:12px; left:16px; right:16px; color:white; width:fit-content; background:#142532; padding:6px 10px; font-size:12px; }
.trial-visual .visual-panel .sensor-photo { object-position:center 73%; }
.trial-visual .visual-panel .chamber-photo { object-position:center 62%; }
.trial-visual .visual-footnote { font-size:13px; line-height:1.6; color:#516473; margin:14px 0 0; max-width:900px; }
.trial-visual .visual-video-section { background:var(--ink); color:white; padding:64px 0; }
.trial-visual .visual-video-section h2 { color:white; }
.trial-visual .visual-video-section .visual-kicker { color:#9bcdff; }
.trial-visual .visual-video-section p { color:#becdda; }
.trial-visual .visual-video { width:100%; height:auto; display:block; aspect-ratio:16/9; background:#0a141d; border-radius:12px; }
.trial-visual .visual-video::cue { background:rgba(0,0,0,.85); color:white; font-size:18px; }
.trial-visual .visual-video-meta { display:flex; justify-content:space-between; gap:16px; margin-top:16px; }
.trial-visual .visual-video-meta p { font-size:13px; margin:0; }
.trial-visual .visual-video-meta a { color:#9bcdff; font-size:14px; white-space:nowrap; }
.trial-visual .visual-transcript { margin-top:24px; max-width:900px; }
.trial-visual .visual-transcript summary { cursor:pointer; padding:12px 0; font-weight:600; }
.trial-visual .visual-transcript p { font-size:14px; margin:12px 0; }
.trial-visual .visual-details { padding:56px 0; }
.trial-visual .visual-details .trial-copy { max-width:1000px; }
.trial-visual .visual-detail { border-bottom:1px solid var(--line); scroll-margin-top:110px; }
.trial-visual .visual-detail summary { cursor:pointer; padding:22px 0; color:var(--ink); font:600 18px/1.4 var(--font-display); }
.trial-visual .visual-detail summary::marker { color:var(--blue); }
.trial-visual .visual-detail-content { padding:0 0 24px 20px; }
.trial-visual .visual-detail-content > h2 { font-size:25px; }
.trial-visual .visual-detail .trial-evidence { margin-top:16px; }
.trial-visual .visual-detail .trial-evidence:first-of-type { border-top:0; }
.trial-visual #worksheet { padding:50px 0; }
.trial-visual #worksheet .worksheet-preview { display:none; }
.trial-visual #worksheet .trial-print-source { display:none; }
.trial-visual #worksheet .trial-actions { margin-bottom:0!important; }
.trial-visual #next-step { display:none; }
.trial-visual .visual-controls[hidden],.trial-visual .visual-panel[hidden] { display:none; }
@keyframes trial-signal { 0% { opacity:.3; transform:translateY(3px); } 50% { opacity:1; transform:translateY(0); } 100% { opacity:.3; transform:translateY(3px); } }
@media (prefers-reduced-motion:no-preference) {
 .trial-visual[data-playing="true"] .visual-stage[aria-pressed="true"] .visual-signal { animation:trial-signal 1.8s ease-in-out infinite; }
 .trial-visual .visual-stage { transition:border-color .25s,color .25s; }
}
@media (max-width:767px) {
 .trial-visual .visual-intro-inner { grid-template-columns:1fr; gap:22px; }
 .trial-visual h1 { letter-spacing:-1.2px; }
 .trial-visual .visual-intro { padding:24px 0 20px; }
 .trial-visual .visual-intro p { margin-bottom:0; }
 .trial-visual .visual-heading { align-items:flex-start; gap:15px; flex-direction:column; }
 .trial-visual .visual-stages { gap:8px; padding:6px 8px 0; }
 .trial-visual .visual-stage { padding:14px 4px; text-align:center; }
 .trial-visual .visual-stage svg { height:100px; margin-bottom:8px; }
 .trial-visual .visual-stage strong { font-size:14px; }
 .trial-visual .visual-stage span { font-size:12px; }
 .trial-visual .visual-stage:not(:last-child)::after { font-size:18px; right:-10px; top:52px; }
 .trial-visual .visual-panel { grid-template-columns:1fr; }
 .trial-visual .visual-panel-copy { padding:24px; }
 .trial-visual .visual-panel-copy h3 { font-size:23px; }
 .trial-visual .visual-panel figure { min-height:210px; }
 .trial-visual .visual-panel img { height:240px; }
 .trial-visual .visual-video-section { padding:44px 0; }
 .trial-visual .visual-video-meta { flex-direction:column; }
 .trial-visual .visual-video::cue { font-size:11px; }
 .trial-visual .visual-detail-content { padding-left:0; }
 .trial-visual .visual-detail-content .grid-3 { grid-template-columns:1fr; }
}
@media print {
 .trial-visual #worksheet .worksheet-preview { display:block!important; }
 .trial-visual #worksheet .trial-print-source { display:block!important; }
}
