/* Motion and exploration controls shared by every portfolio project. */
.motion-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;max-width:1360px;margin:28px auto;padding:18px 6%;color:#dce5d4;font:12px/1.5 'DM Sans',Arial,sans-serif}
.motion-bar-copy{display:flex;align-items:center;gap:12px}.motion-pulse{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:#d7fc70;box-shadow:0 0 0 7px #d7fc7010;animation:motionPulse 2.8s ease-in-out infinite}.motion-bar small{display:block;font-size:10px;color:#a2ac9f;margin-top:3px}
.motion-actions,.motion-controls{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.motion-button,.motion-jump{border:1px solid #48553e;border-radius:22px;background:#1b2418;color:#dce5d4;padding:8px 13px;font:11px/1.4 'DM Sans',Arial,sans-serif;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}.motion-button:hover{background:#304025;border-color:#a0c076;transform:translateY(-2px)}.motion-button:focus-visible,.motion-jump:focus-visible,.motion-search:focus-visible{outline:2px solid #d7fc70;outline-offset:4px}.motion-button[aria-pressed=true]{background:#d7fc70;color:#14200e}.motion-button:disabled{opacity:.65;cursor:default}.motion-jump{max-width:250px}.motion-controls{margin:16px 0 10px;position:relative;z-index:1}.motion-controls .motion-button{padding:6px 12px;font-size:10px}.motion-tablepanel{background:#141b12;border:1px solid #3b4b31;border-radius:12px;padding:16px;margin:12px 0;min-width:0;color:#e0e7da}.motion-tablepanel[hidden]{display:none}.motion-tablepanel label{display:flex;align-items:center;gap:8px;color:#c6d5bc;font-size:11px}.motion-search{display:block;width:100%;margin:12px 0;background:#1d2818;color:#f2f3e9;border:1px solid #48553e;border-radius:8px;padding:10px;font:12px 'DM Sans',Arial,sans-serif}.motion-table-scroll{max-height:300px;overflow:auto}.motion-tablepanel table{width:100%;border-collapse:collapse;font-size:11px;white-space:nowrap}.motion-tablepanel th,.motion-tablepanel td{text-align:left;padding:9px 12px;border-bottom:1px solid #35432d}.motion-tablepanel th{position:sticky;top:0;background:#25321e!important;color:#dce5d4!important}.motion-tablepanel small{color:#a2ac9f;font-size:10px}.motion-series{display:flex;gap:14px;flex-wrap:wrap;margin:12px 0}.motion-result{min-height:18px;margin-top:8px;font-size:11px;color:#b6c7aa}.motion-status{position:fixed;right:20px;bottom:20px;z-index:300;background:#d7fc70;color:#14200e;border-radius:12px;padding:13px 20px;font:12px 'DM Sans',Arial,sans-serif;box-shadow:0 10px 50px #0005;max-width:calc(100% - 40px)}.motion-status:empty{display:none}
.motion-focus{background:#151d12;color:#f2f3e9;border:1px solid #60724e;border-radius:18px;width:min(1200px,94vw);max-width:94vw;max-height:94vh;padding:25px;overflow:auto}.motion-focus::backdrop{background:#000c;backdrop-filter:blur(10px)}.motion-focus-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.motion-focus h2{font:500 clamp(18px,3vw,28px)/1.3 Manrope,Arial,sans-serif!important;letter-spacing:-.5px;margin:0}.motion-focus-stage{position:relative;min-height:300px;height:62vh}.motion-focus-stage>div{position:relative;width:100%!important;height:100%!important;max-height:none!important}.motion-focus-stage canvas{max-height:100%!important}.motion-focus-note{color:#a2ac9f;font:11px 'DM Sans',Arial,sans-serif;margin-top:20px}
.motion-visible{animation:motionArrive .8s cubic-bezier(.16,1,.3,1) both!important}.motion-card{transition:box-shadow .35s,border-color .35s}.motion-card:hover{border-color:#6c8555!important;box-shadow:0 14px 45px #0003,0 0 24px #d7fc7007!important}.motion-tour{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:18px 0}.motion-tour span{font:11px 'DM Sans',Arial,sans-serif;color:#a2ac9f}.motion-tour .motion-button{font-size:12px}
html[data-motion=on] .float{animation:motionFloat 6s ease-in-out infinite}html[data-motion=on] .float.two{animation-delay:-2s}html[data-motion=on] .float.three{animation-delay:-4s}html[data-motion=on] .spark i{animation:motionBars 2s ease-in-out infinite alternate;transform-origin:bottom}html[data-motion=on] .spark i:nth-child(2n){animation-delay:-.7s}html[data-motion=on] .preview .barrow i{animation:motionGrow 4s cubic-bezier(.16,1,.3,1) infinite;transform-origin:bottom}html[data-motion=on] .project .spotbars i{animation:motionBars .8s ease-in-out infinite alternate}html[data-motion=on] .project .spotbars i:nth-child(2n){animation-delay:-.4s}html[data-motion=on] .project .record{animation:motionSpin 8s linear infinite}html[data-motion=on] .project:hover .caremini,html[data-motion=on] .project:hover .miniwindow{transform:rotate(0deg) translateY(-7px);transition:transform .5s}html[data-motion=on] .careminibars i{animation:motionBars 2.4s ease-in-out infinite alternate;transform-origin:left}html[data-motion=on] .ticker-inner{animation:ticker 40s linear infinite!important}html[data-motion=on] .ticker:hover .ticker-inner{animation-play-state:paused!important}
@keyframes motionArrive{from{opacity:.15;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes motionFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}@keyframes motionBars{from{scale:1 .45}to{scale:1 1}}@keyframes motionGrow{from{transform:scaleY(.05)}to{transform:scaleY(1)}}@keyframes motionSpin{to{transform:rotate(360deg)}}@keyframes motionPulse{50%{box-shadow:0 0 0 11px #d7fc7005}}
html[data-motion=off] *,html[data-motion=off] *:before,html[data-motion=off] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(max-width:650px){.motion-bar{margin:12px auto;padding:15px 6%;gap:13px}.motion-bar-copy{font-size:11px}.motion-jump{max-width:180px}.motion-focus{padding:18px}.motion-focus-stage{height:55vh}.motion-controls .motion-button{min-height:34px}.motion-bar .motion-button{min-height:38px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Ambient movement is continuous, independent of hover or controls. */
html[data-motion=on] .caremini,html[data-motion=on] .miniwindow{animation:motionFloat 7s ease-in-out infinite}
html[data-motion=on] .chartbox svg{animation:motionChartGlow 5s ease-in-out infinite}
html[data-motion=on] .motion-card{animation:motionCardGlow 7s ease-in-out infinite}
html[data-motion=on] .motion-visible{animation:motionCardGlow 7s ease-in-out infinite!important}
html[data-motion=on] .preview .barrow i:nth-child(2n){animation-delay:-1s}
html[data-motion=on] .preview .barrow i:nth-child(3n){animation-delay:-2s}
@keyframes motionChartGlow{0%,100%{opacity:.65}50%{opacity:1}}
@keyframes motionCardGlow{0%,100%{box-shadow:0 0 0 #d7fc7000}50%{box-shadow:0 0 22px #d7fc700b}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}