#motion-toggle { background:transparent; color:var(--ice); border:1px solid #ccebf438; border-radius:30px; padding:6px 12px; font-size:11px; cursor:pointer; }
.reading-progress { position:fixed; top:55px; left:0; right:0; z-index:55; height:2px; pointer-events:none; }
.reading-progress i { display:block; height:100%; background:linear-gradient(90deg,#90cedc,#efb56c); transform:scaleX(0); transform-origin:left; }
.section { position:relative; isolation:isolate; }
.section::before { content:""; position:absolute; inset:5% 0; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 80% 35%,#90cedc0b,transparent 60%); opacity:.3; animation:chapter-glow 9s ease-in-out infinite alternate; animation-play-state:paused; }
.section.in-view::before { animation-play-state:running; }
@keyframes chapter-glow { to { opacity:1; transform:translateY(12px); } }
.section .section-label::after { content:""; display:block; height:1px; width:54px; background:var(--amber); margin-top:15px; transform:scaleX(.2); transform-origin:left; opacity:.35; transition:transform .9s ease,opacity .9s; }
.section.in-view .section-label::after { transform:scaleX(1); opacity:1; }
.section .metric,.comparison-table tbody tr,.start-items article { transition:opacity .5s,transform .5s,background .3s; }
.section:not(.has-entered) .metric,.section:not(.has-entered) .comparison-table tbody tr,.section:not(.has-entered) .start-items article { opacity:0; transform:translateY(14px); }
.metric:nth-child(2),.start-items article:nth-child(2) { transition-delay:.12s; }
.metric:nth-child(3),.start-items article:nth-child(3) { transition-delay:.24s; }
.comparison-table tbody tr:nth-child(2) { transition-delay:.08s; }.comparison-table tbody tr:nth-child(3) { transition-delay:.16s; }.comparison-table tbody tr:nth-child(4) { transition-delay:.24s; }.comparison-table tbody tr:nth-child(5) { transition-delay:.32s; }
.comparison-table tbody tr:hover { background:#90cedc10; }
.case-workspace { position:relative; }
.case-journey { display:flex; align-items:center; gap:20px; color:var(--ice); font-size:12px; margin-top:22px; }
.case-journey i { color:var(--amber); font-style:normal; }
.case-journey.is-tracing span { animation:case-node .85s ease both; }
.case-journey.is-tracing span:nth-of-type(2) { animation-delay:.15s; }.case-journey.is-tracing span:nth-of-type(3) { animation-delay:.3s; }
@keyframes case-node { from { opacity:.3; transform:translateX(-5px); } to { opacity:1; transform:none; } }
.case-inspector.is-changing .inspector-block { animation:record-enter .4s ease both; }
.case-inspector.is-changing .inspector-block:nth-of-type(2) { animation-delay:.1s; }.case-inspector.is-changing .inspector-block:nth-of-type(3) { animation-delay:.2s; }
@keyframes record-enter { from { opacity:0; transform:translateY(6px); } }
.case-inspector.is-changing { border-top:2px solid #efb56c; }
.case-inspector { border-top:2px solid transparent; }
.capability-nav { display:flex; justify-content:space-between; align-items:center; margin:14px 0; color:var(--amber); font:12px ui-monospace,monospace; }
.capability-nav button { cursor:pointer; color:var(--ice); border:0; background:transparent; padding:10px; font-size:12px; }
.swipe-note { color:var(--muted); font-size:11px; }
.system-evidence::after { inset:0; opacity:.5; }
#system-panel-1 .system-evidence::after { background:radial-gradient(circle at 35% 70%,#efb56cb0 0,transparent 5%); animation:trace-point 6s ease-in-out infinite; }
@keyframes trace-point { 50% { transform:translate(26%,-37%); opacity:.9; } }
#system-panel-2 .system-evidence::after { inset:22%; border:1px solid #90cedc65; border-radius:50%; background:transparent; animation:scope-ring 5s ease-in-out infinite; }
@keyframes scope-ring { 50% { transform:scale(1.14); opacity:.85; } }
#system-panel-3 .system-evidence::after { background:linear-gradient(180deg,transparent 47%,#90cedc38 50%,transparent 54%); animation:review-scan 7s ease-in-out infinite; }
@keyframes review-scan { 0%,100% { transform:translateY(-30%); opacity:.2; } 50% { transform:translateY(30%); opacity:.7; } }
#system-panel-4 .system-evidence::after { background:radial-gradient(circle at 50% 50%,#efb56c40,transparent 35%); animation:decision-light 4s ease-in-out infinite alternate; }
@keyframes decision-light { to { opacity:.9; transform:scale(1.1); } }
.system-evidence::after { animation-play-state:paused!important; }.in-view .is-active .system-evidence::after { animation-play-state:running!important; }
.map-overview { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); grid-template-rows:minmax(0,1fr); gap:48px; height:calc(100svh - 56px); padding:24px 0; scroll-margin-top:56px; align-items:stretch; }
.map-copy { align-self:center; min-width:0; }.map-copy .section-label { margin:0 0 16px; }.map-copy .section-heading { font-size:clamp(28px,3.5vw,48px); }
.map-copy>p:not(.section-label) { font-size:12px; color:var(--muted); line-height:1.7; }
.map-stages { display:grid; gap:4px; margin:20px 0; }
.map-stages button { display:grid; grid-template-columns:30px 1fr; text-align:left; padding:12px; border:1px solid transparent; background:transparent; color:var(--ice); cursor:pointer; transition:background .25s,border-color .25s; }
.map-stages button small { grid-row:span 2; color:var(--amber); }.map-stages button b { font-size:16px; font-weight:500; }.map-stages button span { font-size:11px; color:var(--muted); }
.map-stages button[aria-pressed="true"] { background:#90cedc0c; border-color:#90cedc50; }
.map-fit { margin:0; display:flex; justify-content:center; align-items:center; min-height:0; height:100%; overflow:hidden; }
.map-image-wrap { position:relative; height:100%; max-width:100%; aspect-ratio:864/1821; }
.map-fit img { display:block; width:100%; height:100%; object-fit:contain; border-radius:6px; }
.map-highlight { display:none; position:absolute; left:0; width:100%; top:var(--stage-top); height:var(--stage-height); border:2px solid #c77e32; background:#efb56c12; box-shadow:0 0 18px #efb56c50; border-radius:8px; pointer-events:none; transition:top .4s,height .4s; }
.map-highlight.active { display:block; }
.map-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:14px; }
#map-open,.map-video-open { min-height:40px; border-radius:24px; padding:9px 18px; font-size:12px; cursor:pointer; }
#map-open { color:var(--ice); background:transparent; border:1px solid #90cedc50; }
.map-video-open { display:inline-flex; align-items:center; gap:9px; color:#081116; background:linear-gradient(135deg,#d7f2f7,#90cedc); border:1px solid #d7f2f7; box-shadow:0 8px 24px #90cedc20; transition:transform .25s ease,box-shadow .25s ease; }
.map-video-open:hover { transform:translateY(-2px); box-shadow:0 12px 30px #90cedc35; }
.map-play-symbol { display:grid; place-items:center; width:20px; height:20px; padding-left:2px; border-radius:50%; color:#d7f2f7; background:#10212a; font-size:8px; }
#video-dialog { width:min(94vw,560px); max-height:92svh; padding:0; overflow:auto; color:var(--ice); background:#081116; border:1px solid #90cedc62; border-radius:18px; box-shadow:0 28px 90px #000b; }
#video-dialog::backdrop { background:#020507e8; backdrop-filter:blur(10px); }
.video-dialog-shell { padding:14px; }
.video-dialog-header { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; padding:6px 4px 14px; }
.video-dialog-header span { display:block; color:var(--amber); font:10px ui-monospace,monospace; letter-spacing:.16em; }
.video-dialog-header h2 { margin:6px 0 0; color:#f2f7f8; font-size:18px; font-weight:500; }
#video-close { flex:none; padding:7px 12px; color:var(--ice); background:#13252e; border:1px solid #90cedc48; border-radius:20px; cursor:pointer; }
.video-stage { display:grid; place-items:center; min-height:0; overflow:hidden; border:1px solid #90cedc28; border-radius:12px; background:radial-gradient(circle at 50% 40%,#17303d,#030608 72%); }
#workflow-video { display:block; width:auto; max-width:100%; height:min(72svh,760px); max-height:100%; aspect-ratio:9/16; object-fit:contain; background:#030608; }
#video-dialog-note { margin:12px 6px 4px; color:var(--muted); font-size:11px; line-height:1.7; }
.scenario-panel.is-active .scenario-result>div { animation:record-enter .5s ease both; }.scenario-result>div:nth-child(2) { animation-delay:.12s!important; }.scenario-result>div:nth-child(3) { animation-delay:.24s!important; }
.in-view .boundary-tag i { animation:decision-light 3s ease-in-out infinite alternate; }
.faq-item[open] p { animation:record-enter .3s ease; }
#copy-status:not(:empty) { animation:record-enter .3s ease; }
.motion-light *, .motion-light *::before,.motion-light *::after { animation:none!important; transition-duration:.1s!important; }
.motion-light .hero-canvas { display:none; }
.motion-light .reveal,.motion-light .metric,.motion-light .start-items article,.motion-light .comparison-table tbody tr { opacity:1!important; transform:none!important; }
@media(max-width:760px) {
  .map-overview { grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); gap:12px; padding:12px 0; }
  .map-copy .section-heading { font-size:24px; }.map-copy h2 br { display:none; }
  .map-copy>.section-label,.map-copy>p:not(#map-stage-note),.map-stages button span { display:none; }
  .map-stages { display:flex; gap:4px; margin:10px 0; }.map-stages button { display:block; flex:1; padding:5px 2px; text-align:center; }
  .map-stages button small { display:block; font-size:9px; }.map-stages button b { font-size:11px; }
  #map-stage-note { margin:4px 0; font-size:10px; min-height:17px; }
  .map-actions { gap:7px; margin-top:6px; } #map-open,.map-video-open { min-height:34px; padding:5px 11px; font-size:10px; }
  .map-play-symbol { width:18px; height:18px; }
  #video-dialog { width:calc(100vw - 20px); max-height:96svh; border-radius:14px; } .video-dialog-shell { padding:10px; }
  .video-dialog-header h2 { font-size:16px; } #workflow-video { height:min(76svh,690px); }
  .map-fit { min-height:0; }.map-image-wrap { max-height:100%; }
  .case-journey { gap:10px; font-size:11px; }.swipe-note { font-size:9px; } #motion-toggle { font-size:10px; padding:5px 8px; }
}
@media(max-height:750px) and (min-width:761px) { .map-copy .section-heading { font-size:28px; }.map-stages { margin:8px 0; }.map-stages button { padding:5px; }.map-copy .section-label { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } .section .metric,.section .comparison-table tbody tr,.section .start-items article { opacity:1!important; transform:none!important; } }
