/* Brain lesson pilot styles (uses site variables; shares neuron-pilot.css) */
.ans-head { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 0.75rem; }
.ans-mode { font-family: var(--font-chrome); font-size: var(--size-small); color: var(--paper); margin: 0 0 0.6rem; letter-spacing: 0.03em; }
.ans-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr)); gap: 0.6rem 1rem; }
.ans-row { display: grid; grid-template-columns: 72px 1fr; gap: 0.6rem; align-items: center; border-top: 1px solid var(--rule); padding: 0.45rem 0 0.2rem; }
.ans-row svg { width: 72px; height: 54px; display: block; }
.ans-name { display: block; font-family: var(--font-chrome); font-size: var(--size-label); letter-spacing: 0.06em; text-transform: uppercase; color: var(--dust); }
.ans-state { display: block; font-family: var(--font-body); font-size: var(--size-small); line-height: 1.4; color: var(--paper); }
.ans-extra { margin: 0.8rem 0 0; font-family: var(--font-body); font-size: var(--size-small); color: var(--muted); }
.ans-pupil { transform-origin: 40px 30px; transition: transform 0.8s ease; transform: scale(0.45); }
#ans[data-mode="s"] .ans-pupil { transform: scale(1); }
.ans-heart { transform-origin: 40px 30px; animation: ansBeat 1.1s ease-in-out infinite; }
#ans[data-mode="s"] .ans-heart { animation-duration: 0.45s; }
@keyframes ansBeat { 0%, 100% { transform: scale(0.88); } 15% { transform: scale(1); } 30% { transform: scale(0.9); } }
.ans-lungs { transform-origin: 40px 34px; animation: ansBreathe 4s ease-in-out infinite; }
#ans[data-mode="s"] .ans-lungs { animation-duration: 1.4s; }
@keyframes ansBreathe { 0%, 100% { transform: scale(0.86); } 50% { transform: scale(1.04); } }
.ans-drop { opacity: 0.15; transition: opacity 0.6s; }
#ans[data-mode="s"] .ans-drop { opacity: 1; animation: ansDrip 1.2s ease-in infinite; }
#ans[data-mode="s"] .ans-drop2 { animation-delay: 0.5s; }
@keyframes ansDrip { 0% { transform: translateY(-3px); } 100% { transform: translateY(4px); } }
.ans-gut { stroke-dasharray: 14 8; animation: ansGut 1.6s linear infinite; transition: opacity 0.6s; }
#ans[data-mode="s"] .ans-gut { animation-play-state: paused; opacity: 0.3; }
@keyframes ansGut { to { stroke-dashoffset: -44; } }
.ans-out { opacity: 0; transition: opacity 0.6s; }
.ans-in { opacity: 1; transition: opacity 0.6s; }
#ans[data-mode="s"] .ans-out { opacity: 1; }
#ans[data-mode="s"] .ans-in { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .ans-heart, .ans-lungs, .ans-gut, #ans[data-mode="s"] .ans-drop { animation: none !important; }
}
.panel-label { font-family: var(--font-chrome); font-size: var(--size-label); letter-spacing: 0.06em; text-transform: uppercase; color: var(--dust); margin: 0.9rem 0 0.2rem; }
.panel-label:first-child { margin-top: 0; }
.diagram-scroll svg + .panel-label { margin-top: 1.4rem; }
/* 3D brain: loading indicator and fallback */
.b3d-stage .n3d-loading { z-index: 2; padding: 1rem; text-align: center; }
.b3d-load { display: flex; flex-direction: column; align-items: center; gap: 0.6rem; }
.b3d-bar { display: block; width: 11rem; max-width: 60vw; height: 3px; background: rgba(232,228,220,0.12); border-radius: 2px; overflow: hidden; }
.b3d-bar span { display: block; height: 100%; width: 4%; background: var(--dust); transition: width 0.2s linear; }
.b3d-stage .n3d-loading.b3d-failed { color: var(--paper); line-height: 1.5; }
@media (prefers-reduced-motion: reduce) { .b3d-bar span { transition: none; } }
/* Long source URLs (e.g. the DOI in References) wrap instead of widening the page on narrow phones. Added 2026-10-04. */
.refs a { overflow-wrap: anywhere; }
