.motion-views{display:grid;grid-template-columns:1fr 1fr;background:#e7eee5;border-block:1px solid #c4d5cc}.plane-panel{border-right:1px solid #b9ccc6;display:flex;flex-direction:column;min-width:0;background:#eef3e8}.plane-view-label,.closeup-label{font:700 10px/1.4 system-ui,sans-serif;letter-spacing:.08em;color:#355b69;padding:10px 12px;margin:0;background:#f4f6ed}.plane-scene{background:linear-gradient(#cde5ef,#eef3e8);overflow:hidden}.plane-scene svg{display:block;width:100%;height:auto;aspect-ratio:600/250}.plane-scene .ground{fill:#a7bf92}.plane-scene .hill{fill:#c4d2ac}.plane-scene .flight-plane{transform-box:fill-box;transform-origin:center;animation:flight-level 7s linear infinite}.plane-scene .aircraft{fill:#2d749b;stroke:#244c62;stroke-width:3;stroke-linejoin:round}.plane-scene .window{fill:#fff7df}.plane-scene .rear-aircraft{transform-box:fill-box;transform-origin:center;animation:wake-roll 4s ease-in-out infinite}.plane-scene .rear-scene{display:none}.plane-scene .flight-path{fill:none;stroke:#7a9c91;stroke-width:3;opacity:.55}.plane-scene .path-climb,.plane-scene .path-down,.plane-scene .runway,.plane-scene .test-plane{display:none}.plane-scene .prop-blade{transform-box:fill-box;transform-origin:center;animation:prop-spin .6s linear infinite}.plane-observation{font:600 13px/1.6 system-ui,sans-serif;padding:10px 12px;color:#244a58;margin:0;min-height:62px}.plane-controls{padding:8px 12px;display:flex;gap:6px;flex-wrap:wrap}.plane-controls button{font:600 11px/1.4 system-ui,sans-serif;min-height:42px;padding:8px 9px;flex:1}.plane-controls button[aria-pressed=true]{background:#244c62;color:#fff7e8;border-color:#244c62}.plane-assumption{font:11px/1.6 system-ui,sans-serif;color:#506974;padding:8px 12px;margin:0}.plane-energy{padding:0 12px 12px;font:11px system-ui,sans-serif;color:#355b69}.plane-energy-bar{height:9px;border-radius:6px;background:#d5dfd1;margin-top:7px;overflow:hidden}.plane-energy-fill{height:100%;width:75%;background:#c76533;transition:width .4s}.motion-closeup{min-width:0;display:flex;flex-direction:column}.motion-closeup>.motion-stage{flex:1;display:flex;align-items:center}.motion-closeup>.motion-stage svg{width:100%;height:auto}.lesson-motion[data-flight=climb] .flight-plane{animation-name:flight-climb}.lesson-motion[data-flight=bump] .flight-plane{animation-name:flight-bump}.lesson-motion[data-flight=sink] .flight-plane{animation-name:flight-sink}.lesson-motion[data-flight=glide] .flight-plane{animation-name:flight-glide}.lesson-motion[data-flight=approach] .flight-plane{animation-name:flight-approach;animation-duration:10s}.lesson-motion[data-flight=steep] .flight-plane{animation-name:flight-steep;animation-duration:10s}.lesson-motion[data-flight=runway] .flight-plane{animation-name:flight-runway}.lesson-motion[data-flight=takeoff] .flight-plane{animation-name:flight-takeoff}.lesson-motion[data-flight=accelerate] .flight-plane{animation-name:flight-level;animation-timing-function:ease-in;animation-duration:5s}.lesson-motion[data-flight=fast] .flight-plane{animation-duration:4s}.lesson-motion[data-flight=veryfast] .flight-plane{animation-duration:2.6s}.lesson-motion[data-flight=climb] .path-level,.lesson-motion[data-flight=bump] .path-level,.lesson-motion[data-flight=takeoff] .path-level,.lesson-motion[data-flight=sink] .path-level,.lesson-motion[data-flight=glide] .path-level,.lesson-motion[data-flight=approach] .path-level,.lesson-motion[data-flight=steep] .path-level,.lesson-motion[data-flight=runway] .path-level{display:none}.lesson-motion[data-flight=climb] .path-climb,.lesson-motion[data-flight=bump] .path-climb,.lesson-motion[data-flight=takeoff] .path-climb{display:inline}.lesson-motion[data-flight=sink] .path-down,.lesson-motion[data-flight=glide] .path-down,.lesson-motion[data-flight=approach] .path-down,.lesson-motion[data-flight=steep] .path-down{display:inline}.lesson-motion[data-flight=runway] .runway,.lesson-motion[data-flight=takeoff] .runway{display:inline}.lesson-motion[data-flight=wake] .side-scene{display:none}.lesson-motion[data-flight=wake] .rear-scene{display:inline}.lesson-motion[data-concept=ram] .airliner{display:none}.lesson-motion[data-concept=ram] .test-plane{display:inline}.lesson-motion[data-plane-thrust=off] [data-concept=prop] .spin{animation-play-state:paused}.lesson-motion[data-concept=prop][data-plane-thrust=off] .motion-closeup .spin{animation-play-state:paused!important}.lesson-motion[data-concept=prop][data-plane-thrust=off] .motion-closeup .force{opacity:0}.lesson-motion[data-concept=prop][data-plane-thrust=off] .prop-blade{animation-play-state:paused!important}.lesson-motion[data-concept=drag][data-state=long] .plane-energy-fill{width:45%}.lesson-motion[data-paused=true] .plane-scene *,.lesson-motion.is-offscreen .plane-scene *,.lesson-motion.page-hidden .plane-scene *{animation-play-state:paused!important}
@keyframes flight-level{0%{transform:translate(170px,0);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,0);opacity:1}}@keyframes flight-climb{0%{transform:translate(170px,35px) rotate(7deg);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,-40px) rotate(7deg);opacity:1}}@keyframes flight-bump{0%{transform:translate(170px,30px);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,-35px);opacity:1}}@keyframes flight-sink{0%{transform:translate(170px,-45px) rotate(12deg);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,60px) rotate(12deg);opacity:1}}@keyframes flight-glide{0%{transform:translate(170px,-30px) rotate(-4deg);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,45px) rotate(-4deg);opacity:1}}@keyframes flight-approach{0%{transform:translate(170px,-25px) rotate(-3deg);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,30px) rotate(-3deg);opacity:1}}@keyframes flight-steep{0%{transform:translate(170px,-45px) rotate(-6deg);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,60px) rotate(-6deg);opacity:1}}@keyframes flight-runway{0%{transform:translate(170px,50px);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,50px);opacity:1}}@keyframes flight-takeoff{0%{transform:translate(170px,48px) rotate(5deg);opacity:1}5%,94%{opacity:1}100%{transform:translate(-170px,-25px) rotate(5deg);opacity:1}}@keyframes wake-roll{0%,100%{transform:rotate(0deg)}25%{transform:rotate(12deg)}75%{transform:rotate(-12deg)}}
@media(max-width:700px){.motion-views{grid-template-columns:1fr}.plane-panel{border-right:0;border-bottom:1px solid #b9ccc6}.plane-scene svg{max-height:210px}.plane-observation{min-height:0;font-size:13px}.motion-closeup>.motion-stage svg{max-height:210px}.plane-view-label,.closeup-label{font-size:9px}.plane-assumption{font-size:10px}}@media(prefers-reduced-motion:reduce){.lesson-motion:not([data-motion-opt-in=true]) .plane-scene *{animation:none!important}.lesson-motion:not([data-motion-opt-in=true]) .flight-plane{opacity:1;transform:translate(0,0)}.lesson-motion:not([data-motion-opt-in=true])[data-flight=climb] .flight-plane{transform:translate(0,-10px) rotate(7deg)}.lesson-motion:not([data-motion-opt-in=true])[data-flight=sink] .flight-plane{transform:translate(0,25px) rotate(12deg)}.lesson-motion:not([data-motion-opt-in=true])[data-flight=runway] .flight-plane{transform:translate(0,50px)}}

.lesson-motion:not([data-concept=prop]) .plane-scene .propeller{display:none}
.lesson-motion[data-concept=lift][data-lift-choice=more] .motion-closeup .force{stroke-width:7}
.lesson-motion[data-concept=lift][data-lift-choice=less] .motion-closeup .force{stroke-width:2;opacity:.55}