/* 0.5 — ambient depth, restrained motion, and clear surfaces */
:root{--ambient-red:rgba(219,84,114,.10);--ambient-green:rgba(45,177,124,.09);--ambient-blue:rgba(95,132,193,.065);--grid-ink:rgba(86,105,132,.08);--surface-shadow:0 10px 36px rgba(37,62,83,.055)}
html[data-theme=dark]{--ambient-red:rgba(202,63,103,.13);--ambient-green:rgba(37,167,117,.13);--ambient-blue:rgba(56,114,155,.10);--grid-ink:rgba(115,163,181,.075);--surface-shadow:0 16px 40px rgba(0,0,0,.16)}
body{isolation:isolate;background:#f7f9fc}html[data-theme=dark] body{background:#10171f}.academy-backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:strict}.ambient-orb{position:absolute;width:760px;height:760px;border-radius:50%;will-change:transform;opacity:.9}.ambient-orb.red{top:-350px;right:-230px;background:radial-gradient(circle,var(--ambient-red),transparent 68%);animation:ambient-red-drift 24s ease-in-out infinite alternate}.ambient-orb.green{top:12%;left:-380px;background:radial-gradient(circle,var(--ambient-green),transparent 68%);animation:ambient-green-drift 30s ease-in-out infinite alternate}.ambient-orb.blue{bottom:-450px;right:5%;background:radial-gradient(circle,var(--ambient-blue),transparent 68%);animation:ambient-red-drift 36s ease-in-out infinite alternate-reverse}.ambient-grid{position:absolute;inset:0;background-image:linear-gradient(var(--grid-ink) 1px,transparent 1px),linear-gradient(90deg,var(--grid-ink) 1px,transparent 1px);background-size:64px 64px;opacity:.55;mask-image:linear-gradient(to bottom,#000,transparent 80%);-webkit-mask-image:linear-gradient(to bottom,#000,transparent 80%)}.ambient-code{position:absolute;font:400 34px Consolas,monospace;color:rgba(115,131,155,.085);animation:code-drift 24s ease-in-out infinite alternate;user-select:none}.ambient-code.one{top:19%;right:2%;transform:rotate(-12deg)}.ambient-code.two{top:55%;left:3%;font-size:45px;animation-delay:-8s}.ambient-code.three{bottom:12%;right:17%;font-size:27px;animation-delay:-15s}html[data-theme=dark] .ambient-code{color:rgba(100,184,148,.075)}
header{position:relative;box-shadow:0 4px 30px #25374d04;background:linear-gradient(110deg,#ffffff,#ffffffed)}header:after{content:'';position:absolute;bottom:-1px;left:5%;right:5%;height:1px;background:linear-gradient(90deg,transparent,#e0c9d2,#c5e6d4,transparent)}html[data-theme=dark] header{background:linear-gradient(110deg,#141d27,#16232bcc);box-shadow:0 4px 25px #0001}html[data-theme=dark] header:after{background:linear-gradient(90deg,transparent,#793d54,#36745d,transparent)}.site-scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;z-index:1001;background:linear-gradient(90deg,#cf4c6a,#24a371);pointer-events:none}.brand .mark{transition:transform .25s ease,box-shadow .25s ease}.brand:hover .mark{transform:rotate(-5deg) scale(1.04);box-shadow:0 8px 22px #d53e6130}nav a{position:relative;transition:color .2s ease,background .2s ease}nav a[aria-current=page]{color:#237755}nav a[aria-current=page]:not(:last-child):after{content:'';position:absolute;width:18px;height:3px;border-radius:4px;bottom:-10px;right:calc(50% - 9px);background:#29a373}html[data-theme=dark] nav a[aria-current=page]{color:#7de0b0}
.hero{position:relative;padding-top:52px;padding-bottom:76px}.hero>div:first-child>.tag:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#36a577;vertical-align:middle;margin-left:8px;box-shadow:0 0 0 4px #32ac7910}.hero h1{letter-spacing:-1.9px}.hero .button{box-shadow:0 7px 20px #b42d4820}.hero .button:hover{box-shadow:0 10px 24px #b42d4832}.codeart{animation:editor-float 8s ease-in-out infinite;box-shadow:0 24px 65px #354b6914,0 3px 7px #354b6907}.floating{box-shadow:0 10px 28px #36765314}.card{box-shadow:var(--surface-shadow);overflow:hidden;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}.card:after{content:'';position:absolute;width:100%;height:2px;bottom:0;right:0;background:linear-gradient(90deg,transparent,#e59cac,#79c7a4,transparent);opacity:0;transition:opacity .24s ease}.card:hover:after{opacity:1}.card:hover{transform:translateY(-6px);box-shadow:0 18px 38px #2c435b0d}.courseicon{transition:transform .26s ease,box-shadow .26s ease}.card:hover .courseicon{transform:translateY(-2px) rotate(-5deg)}.cardfoot b{transition:transform .22s ease;display:inline-block}.card:hover .cardfoot b{transform:translateX(-4px)}.panel,.auth,.lab,.roadmap-info,.lesson-path-sidebar{box-shadow:var(--surface-shadow)}.auth{border-top:3px solid #d35470}.sectionhead h2:after{content:'';display:block;margin-top:8px;width:38px;height:3px;border-radius:100px;background:linear-gradient(90deg,#d75370,#329c73)}button,.button{transition:background .2s ease,box-shadow .2s ease,transform .15s ease,border-color .2s ease}button:active,.button:active{transform:translateY(1px)}.theme-toggle .theme-icon{transition:transform .35s ease}.theme-toggle:hover .theme-icon{transform:rotate(-20deg)}.option{transition:border-color .18s ease,background .18s ease,box-shadow .18s ease}.option:has(input:checked){box-shadow:0 0 0 2px #bc49650b}.course-accordion>summary,.path-module>summary{transition:background .18s ease}.path-module>summary:hover{background:#f4f8f6}.course-accordion>summary:hover{background:#f7faf8}.course-accordion .courseicon{transition:transform .2s ease}.course-accordion[open]>summary .courseicon{transform:rotate(-4deg)}.path-step.available>.step-dot{box-shadow:0 0 0 4px #def1e7,0 4px 10px #28845c1c}.path-step>a{transition:background .2s ease,transform .2s ease,border-color .2s ease}.path-step.available>a:hover{transform:translateX(-3px)}.progress-complete-pulse{animation:success-arrive .5s ease-out both}.notice-success,.success{animation:success-arrive .45s ease-out both}.ide-file-tab{position:relative}.ide-file-tab:before{content:'';position:absolute;top:-2px;left:0;width:35%;height:2px;background:#4dba87}.lab:focus-within{border-color:#b5cfc3}.preview-surface{box-shadow:inset 0 4px 12px #1f394308}.panel form button{box-shadow:0 5px 15px #a3223c12}.roadmap-heading .big-course-symbol{box-shadow:0 12px 25px #394c6008;transform:rotate(-5deg)}footer{background:linear-gradient(110deg,#fff,#f7fbf9)}
html[data-theme=dark] .card:hover{box-shadow:0 20px 40px #0003;border-color:#416f5a}html[data-theme=dark] .card:after{background:linear-gradient(90deg,transparent,#b85a78,#5dbe92,transparent)}html[data-theme=dark] .auth{border-top-color:#c95978}html[data-theme=dark] .path-module>summary:hover,html[data-theme=dark] .course-accordion>summary:hover{background:#203a30}html[data-theme=dark] .path-step.available>.step-dot{box-shadow:0 0 0 4px #234638,0 0 14px #53cb8f16}html[data-theme=dark] .lab:focus-within{border-color:#45765d}html[data-theme=dark] footer{background:linear-gradient(110deg,#141d27,#152720)}
@keyframes ambient-red-drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-60px,45px,0) scale(1.08)}}@keyframes ambient-green-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(75px,-45px,0)}}@keyframes code-drift{from{translate:0 0}to{translate:10px -22px}}@keyframes editor-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(-1.3deg)}}@keyframes success-arrive{from{opacity:.35;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.page-is-hidden .academy-backdrop *, .page-is-hidden .codeart{animation-play-state:paused!important}
@media(max-width:700px){.ambient-orb{width:500px;height:500px}.ambient-orb.red{right:-220px;top:-210px}.ambient-orb.green{left:-300px;top:35%}.ambient-orb.blue,.ambient-code{display:none}.ambient-grid{background-size:48px 48px;opacity:.32}.hero{padding-top:25px;padding-bottom:48px}.codeart{animation:none;transform:none}.card:hover{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.academy-backdrop *,.codeart,.notice-success,.success{animation:none!important;will-change:auto!important}*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.001ms!important}.card:hover,.brand:hover .mark,.card:hover .courseicon,.path-step.available>a:hover{transform:none!important}}
