/* Common interaction finish; each module keeps its own phenomenon and model. */
body.v30-visual-page .page-head::before { display:none; }
body.v30-visual-page { --fin-paper:#f6f6f0; --fin-cyan:#286595; --lab-ink:#253b47; --lab-muted:#5e717a; --lab-line:#d8dfdf; --lab-blue:#286595; }
body.v30-visual-page .main-area { background:#f6f6f0; background-image:none; }
body.v30-visual-page.v30-circuit { background:var(--bg-app,#f6f6f0); }
body.v30-visual-page :is(.page-head h1,.main-title) { font-weight:400; letter-spacing:-.035em; }
body.v30-visual-page .panel { border-radius:10px; border-color:#d8dfdf; box-shadow:none; }
body.v30-visual-page .panel-head { background:#f9faf7; }
body.v30-visual-page .vx-btn-primary { background:#176fa5; border-color:#176fa5; border-radius:8px; box-shadow:none; }
body.v30-visual-page :is(.vx-input,.vx-select,.vx-fieldset) { border-color:#d0dfe9; border-radius:7px; }
body.v30-visual-page :is(.obs-title,.obs-heading h3) { font-weight:400; color:#253b47; }
.thermal-experiment { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:start; gap:28px; margin:22px 0 28px; }
.thermal-experiment > .v30-observatory:not([data-trilha=circuito]) { display:block; min-width:0; margin:0; }
.thermal-experiment > .panel { min-width:0; margin:0; }
.thermal-experiment .obs-reading { padding-top:18px; }
.thermal-experiment .obs-scene { position:relative; }
.thermal-edit-feedback { font:12px/1.6 'IBM Plex Sans',sans-serif; color:#326382; padding:10px 12px; border-left:2px solid #8bbada; background:#edf5fb; }
@media(max-width:1000px) { .thermal-experiment { grid-template-columns:1fr; gap:20px; } .thermal-experiment > .v30-observatory:not([data-trilha=circuito]) { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); } }
@media(max-width:700px) { .thermal-experiment > .v30-observatory:not([data-trilha=circuito]) { display:block; } }
.v30-visual-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:12px 0 4px; }
.v30-visual-controls button,.v30-observatory .obs-replay { display:inline-flex!important; align-items:center; justify-content:center; min-height:44px; padding:8px 13px; border:1px solid #c7dce9; border-radius:8px; background:#fff; color:#245f84; font:500 12px 'IBM Plex Sans',sans-serif; cursor:pointer; box-shadow:0 1px 2px #25496309; transition:background-color 140ms ease,border-color 140ms ease; }
.v30-visual-controls button[aria-pressed=true] { color:#146a9b; background:#e5f2fb; border-color:#87b8d9; }
.v30-visual-controls button:focus-visible,.v30-observatory .obs-replay:focus-visible { outline:2px solid #287db1; outline-offset:3px; }
[data-motion-managed] { --visual-motion-duration:2.8s; }
.v30-observatory[data-motion-managed] .obs-scene { border-radius:10px; border-color:#d5e2eb; box-shadow:none; }
.v30-observatory[data-motion-managed] .obs-scene svg > rect:first-of-type { fill:#f4f8fb; }
.v30-observatory[data-motion-managed] .obs-scene svg > rect[fill="url(#obs-grid)"] { opacity:.18; }
.v30-observatory[data-motion-managed] .obs-scene svg > rect[fill="url(#obs-sky)"] { opacity:.25; }
.v30-observatory[data-motion-managed] .obs-scene rect[fill="url(#vap)"] { opacity:.25; }
.v30-observatory[data-motion-managed] .obs-scene g[filter="url(#obs-soft)"] { display:none; }
.v30-observatory[data-motion-managed] .obs-scene text { stroke-width:2px; font-size:13px; }
.v30-observatory[data-motion-managed] .obs-scene .mol { fill:#0284c7; opacity:.45; }
.v30-observatory[data-motion-managed] .obs-scene .drop { opacity:.7; }
.v30-observatory[data-motion-managed] .obs-scene .bubble { stroke:#669bbd; stroke-width:1; }
.v30-observatory[data-motion-managed] .obs-scene .nm-line { stroke-width:1.1; opacity:.55; }
.bench-svg[data-motion-managed] :is(.nm-flow,.nm-slow) { stroke-width:2.2; animation-duration:var(--spd,2.8s); }
.bench-svg[data-motion-managed] .nm-grip rect { filter:none; }
.v30-observatory[data-motion-managed] .obs-chip { border-radius:7px; background:#eaf2f7; }
.v30-observatory[data-motion-managed] .obs-scene :is(.hot,.cold) { filter:none; }
.v30-observatory[data-motion-managed] .obs-scene .moving { animation:obs-flow var(--spd,2.8s) linear infinite; }
.v30-observatory[data-motion-managed] .obs-scene .heat.moving { animation:none; }
.v30-observatory[data-motion-managed] .obs-scene .bubble { animation:obs-rise 3.6s linear infinite; }
.v30-observatory[data-motion-managed] .obs-scene .drop { animation:obs-drain 3.4s linear infinite; }
.v30-observatory[data-motion-managed] .obs-scene .mol { animation:obs-drift 4.6s linear infinite; }
.v30-observatory[data-motion-managed] .obs-scene .flowline,.v30-observatory[data-motion-managed] .obs-scene .nm-flow { animation:obs-flow var(--spd,2.8s) linear infinite; }
.v30-observatory[data-motion-managed] .obs-profile .moving { animation:obs-flow 3.2s linear infinite; }
.v30-observatory[data-motion-managed] .obs-scene .nm-flow { stroke-width:2.2; stroke-dasharray:.1 20; }
.v30-lab .panel,.v30-lab .eng-result,.v30-lab .result-hero,.v30-observatory[data-motion-managed] { animation:none!important; }
[data-motion-state=off] :is(.moving,.flowline,.mol,.bubble,.drop,.nm-flow,.nm-fan) { visibility:hidden; }
[data-motion-state=paused] :is(.moving,.flowline,.mol,.bubble,.drop,.nm-flow,.nm-fan) { animation-play-state:paused!important; }
[data-motion-state=running] :is(.moving,.flowline,.mol,.bubble,.drop,.nm-flow,.nm-fan) { animation-play-state:running; }
.v30-circuit .phys-drawing g.layer-active { animation:none; }
@media(hover:hover) { .v30-visual-controls button:hover,.v30-observatory .obs-replay:hover { background:#eef6fc; border-color:#90b9d4; } }
@media(prefers-reduced-motion:reduce) { .v30-visual-controls button,.v30-observatory .obs-replay { transition:none; } }
