/* LearnLab motion: decorative enhancement; content is visible without JavaScript. */
.reading-progress{position:fixed;inset:0 0 auto;height:3px;z-index:90;pointer-events:none;background:linear-gradient(90deg,#6e7fea,#408eb8,#8395be);transform:scaleX(var(--reading-progress,0));transform-origin:left;will-change:transform}.motion-control{border:1px solid #d1d7e4;background:#ebeff7;color:#657088;border-radius:30px;padding:6px 11px;font:inherit;font-size:9px;cursor:pointer;white-space:nowrap}.motion-control:hover{background:#dee4f1}.motion-control:focus-visible{outline:3px solid #d5ae58;outline-offset:3px}.hero-section{isolation:isolate}.hero-section:before{content:'';position:absolute;inset:-80px -15% -60px;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 12% 5%,#dce7fd6b,transparent 37%),radial-gradient(ellipse at 83% 65%,#e0edcb8c,transparent 39%);animation:ambient-drift 16s ease-in-out infinite alternate}.hero-copy h1 em{background:linear-gradient(100deg,#294aca 5%,#6680dd 42%,#177f85 70%,#294aca 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ink-shift 12s ease-in-out infinite}.hero-copy .kicker{animation:soft-arrive .65s ease both}.hero-copy h1{animation:soft-arrive .8s cubic-bezier(.2,.7,.2,1) .08s both}.hero-copy>p{animation:soft-arrive .8s ease .16s both}.hero-copy .hero-actions{animation:soft-arrive .8s ease .24s both}.hero-copy .tiny-trust{animation:soft-arrive .8s ease .32s both}.code-window.python{animation:python-hover 7s ease-in-out infinite}.code-window.sql{animation:sql-hover 8s ease-in-out infinite}.window-result{position:relative;overflow:hidden}.window-result:after{content:'';position:absolute;inset:0;transform:translateX(-110%);background:linear-gradient(100deg,transparent,#bbd7ff12,transparent);animation:code-sweep 9s ease-in-out infinite;pointer-events:none}.course-card{isolation:isolate;box-shadow:0 9px 30px #283f6b05;transition:transform .25s ease,box-shadow .3s,border-color .3s}.course-card:after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--card-x,50%) var(--card-y,20%),#b5c5ff50,transparent 60%);opacity:0;transition:opacity .3s}.course-card.sql:after{background:radial-gradient(circle at var(--card-x,50%) var(--card-y,20%),#a3d9bd55,transparent 60%)}.course-card:hover:after,.course-card:focus-within:after{opacity:1}.course-card:hover{border-color:#b7c5ec;box-shadow:0 22px 45px #23396b13}.course-card.sql:hover{border-color:#a1aecd;box-shadow:0 22px 45px #1d563c13}.course-card .lang-icon{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .3s}.course-card:hover .lang-icon{transform:translateY(-3px) rotate(-6deg);box-shadow:0 8px 20px #3c5fc31c}.course-card.sql:hover .lang-icon{transform:translateY(-3px) rotate(5deg)}.button{transition:transform .2s,box-shadow .25s,background .25s,translate .2s}.button:active{transform:translateY(0) scale(.97)}.button span{transition:transform .2s}.button:hover span{transform:translate(3px,-1px)}.click-ripple{position:absolute;width:14px;height:14px;border-radius:50%;background:#ffffff50;pointer-events:none;animation:touch-ripple .65s ease-out both}.ui-arrive{animation:soft-arrive .5s cubic-bezier(.2,.65,.2,1) var(--motion-delay,0ms) backwards}.site-nav nav a{position:relative}.site-nav nav a:after{content:'';position:absolute;inset:auto 0 -7px;height:2px;background:#8094ce;transform:scaleX(0);transform-origin:left;transition:transform .25s}.site-nav nav a:hover:after,.site-nav nav a:focus-visible:after{transform:scaleX(1)}.step-number{transition:transform .3s,background .3s,box-shadow .3s}.steps article:hover .step-number{transform:rotate(-8deg) translateY(-3px);background:#d9e0f0;box-shadow:0 6px 15px #80945b15}.demo-box{transition:box-shadow .35s,transform .35s}.demo-box:hover{transform:translateY(-3px);box-shadow:0 26px 55px #1e29442a}.demo-tab{transition:background .25s,color .25s,transform .2s}.demo-tab:active{transform:scale(.96)}.worked-answer[open]>:not(summary),.translation[open]>:not(summary),.faq-list details[open]>p{animation:answer-arrive .3s ease both}.motion-live .stat,.motion-live .track,.motion-live .project-card,.motion-live .course-card-small{transition:transform .25s,box-shadow .25s,border-color .25s}.motion-live .stat:hover{transform:translateY(-3px);box-shadow:0 10px 25px #272d5108}.motion-live .project-card:hover,.motion-live .course-card-small:hover{transform:translateY(-4px);border-color:#c6c1e2;box-shadow:0 15px 35px #28254d0a}.motion-live .nav-link{transition:background .2s,color .2s,transform .2s}.motion-live .nav-link:hover{transform:translateX(3px);background:#262e4b;color:#e7e9f5}.motion-live .nav-link.active{box-shadow:inset 3px 0 #9f9be4}.motion-live.course-sql .nav-link.active{box-shadow:inset 3px 0 #87c3a7}.motion-live .progress-fill{transform-origin:left;animation:progress-reveal .7s cubic-bezier(.2,.6,.2,1) both}.motion-live .quiz-option{transition:background .2s,border-color .2s,transform .2s}.motion-live .quiz-option:hover{transform:translateX(3px);border-color:#b5a8d8}.motion-live .quiz-option.correct{animation:success-pop .4s ease}.motion-live .validation-feedback.passed{animation:answer-arrive .3s ease}.motion-live .answer-panel:not([hidden]){animation:answer-arrive .35s ease}.motion-live dialog[open]{animation:dialog-arrive .22s ease both}.motion-live .course-mark{animation:mark-hover 7s ease-in-out infinite}.motion-live.course-sql .course-mark{animation-name:mark-hover-sql}.motion-live .lesson-row{transition:background .2s,transform .2s}.motion-live .lesson-row:not(.locked):hover{transform:translateX(2px)}.motion-live .editor-wrap{transition:box-shadow .3s,border-color .3s}.motion-live .editor-wrap:focus-within{border-color:#7e8ad4;box-shadow:0 0 0 3px #9183d615}.motion-live .lesson-steps .passed{transition:background .25s,color .25s}.motion-live .lesson-steps .passed:last-of-type{animation:success-pop .4s ease}.motion-live .session-banner{transition:background .3s}.motion-live .session-banner:hover{background:#e8edf5}.motion-off *,body.motion-off *:before,body.motion-off *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motion-off .ui-arrive{opacity:1;transform:none}.motion-off .reading-progress{display:none}.motion-off .hero-copy h1 em{background:none;color:#2c4ec4}.motion-off .course-card{transform:none!important;translate:none!important}
@keyframes ambient-drift{to{transform:translate3d(2%,-2%,0) scale(1.025);opacity:.75}}@keyframes ink-shift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes soft-arrive{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}@keyframes answer-arrive{from{opacity:.4;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@keyframes python-hover{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-9px) rotate(-5deg)}}@keyframes sql-hover{0%,100%{transform:translateY(0) rotate(6deg)}50%{transform:translateY(8px) rotate(4deg)}}@keyframes code-sweep{0%,65%{transform:translateX(-110%)}90%,100%{transform:translateX(110%)}}@keyframes touch-ripple{from{transform:scale(0);opacity:.8}to{transform:scale(32);opacity:0}}@keyframes progress-reveal{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes success-pop{0%{transform:scale(.985)}55%{transform:scale(1.015)}100%{transform:scale(1)}}@keyframes dialog-arrive{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes mark-hover{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-7px) rotate(-3deg)}}@keyframes mark-hover-sql{0%,100%{transform:translateY(0) rotate(7deg)}50%{transform:translateY(-7px) rotate(3deg)}}
@media(max-width:760px){.hero-section:before{animation:none}.code-window.python,.code-window.sql{animation-duration:10s}.course-card:hover{transform:none!important}.motion-live .nav-link:hover{transform:none}.motion-control{font-size:8px;padding:5px 9px}.reading-progress{height:2px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hero-copy h1 em{background:none;color:#2c4ec4}.ui-arrive{opacity:1;transform:none}.reading-progress{display:none}}
.motion-sleep .hero-section:before,.motion-sleep .hero-copy h1 em,.motion-sleep .code-window,.motion-sleep .float-note,.motion-sleep .floating-star,.motion-sleep .course-mark,.motion-sleep .window-result:after{animation-play-state:paused}