
.design-ui .wrap{max-width:1240px;margin:auto;padding-inline:32px}
.design-ui .design-hero{position:relative;padding:66px 0 58px;isolation:isolate}
.design-ui .design-hero:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.25;background-image:radial-gradient(#40d5c6 1px,transparent 1px);background-size:26px 26px;mask-image:none}
.design-ui .hero-grid{display:grid;grid-template-columns:1.04fr 1fr;align-items:center;gap:70px}
.design-ui .kicker{display:flex;align-items:center;gap:10px;font:13px var(--mono);color:var(--mint);margin-bottom:25px}
.design-ui .kicker .live{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 6px #40d5c612}
.design-ui .design-hero h1{font-size:clamp(41px,4.6vw,66px);line-height:1.12;letter-spacing:-1.8px;margin:0 0 25px;font-weight:750}
.design-ui .design-hero h1 em{font-style:normal;color:var(--mint);display:inline-block;position:relative}
.design-ui .design-hero h1 em:after{content:'';display:block;height:4px;background:var(--orange);width:78%;border-radius:100%;margin-top:10px;transform:rotate(-2deg)}
.design-ui .design-hero .lead{color:#40d5c6;font-size:20px;line-height:1.8;max-width:470px;margin:0 0 27px}
.design-ui .design-hero .lead strong{color:#f5f5f5;font-weight:normal}
.design-ui .actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.design-ui .primary{background:var(--mint);color:#40d5c6;font-weight:bold;display:inline-flex;align-items:center;justify-content:center;gap:20px;border:0;border-radius:10px;padding:14px 23px;min-height:52px;box-shadow:0 6px 0 #40d5c6;transition:transform .18s,box-shadow .18s}
.design-ui .primary:hover{transform:translateY(2px);box-shadow:0 4px 0 #40d5c6}
.design-ui .primary .arrow{font-size:22px;line-height:1}
.design-ui .text-button{border:0;background:transparent;padding:12px 0;color:#dedede;font-size:15px;text-decoration:underline;text-underline-offset:6px;text-decoration-color:#40d5c6}
.design-ui .micro{margin:24px 0 0;color:#40d5c6;font-size:13px;display:flex;gap:18px;flex-wrap:wrap}
.design-ui .micro span:before{content:'✓';margin-inline-end:6px;color:var(--mint)}
.design-ui .visual{position:relative;min-width:0;padding-top:18px;padding-bottom:18px}
.design-ui .hero-footer{border-top:1px solid #40d5c6;margin-top:62px;padding-top:22px;display:flex;gap:16px;align-items:center;justify-content:space-between}
.design-ui .hero-footer p{font-size:14px;color:#40d5c6;margin:0}
.design-ui .route-dots{display:flex;align-items:center;gap:11px;font-size:13px;color:#40d5c6}
.design-ui .route-dots i{width:6px;height:6px;border-radius:50%;background:var(--mint);font-style:normal}
.design-ui .route-dots span:nth-of-type(2){color:#b49aff}
.design-ui .route-dots span:nth-of-type(3){color:var(--orange)}
.design-ui .light{background:var(--paper);color:var(--ink);padding:68px 0 78px;position:relative}
.design-ui .section-top{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:29px}
.design-ui .eyebrow{font:12px var(--mono);color:#40d5c6;margin:0 0 12px}
.design-ui .section-top h2,.design-ui .challenge h2{font-size:clamp(29px,3.2vw,41px);line-height:1.2;letter-spacing:-.8px;margin:0 0 10px}
.design-ui .section-top p{font-size:17px;color:#717171;margin:0}
.design-ui .course-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}
.design-ui .course{min-width:0;background:#ffffff;border:1px solid #dcdcdc;border-radius:12px;overflow:hidden;transition:transform .18s,box-shadow .18s}
.design-ui .course:hover{transform:translateY(-5px);box-shadow:0 14px 24px #2a2a2a0b}
.design-ui .course-art{height:130px;direction:ltr;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;font-family:var(--mono);background:#e8e8e8;color:#40d5c6}
.design-ui .course:nth-child(2) .course-art{background:#eaeaea;color:#40d5c6}
.design-ui .course:nth-child(3) .course-art{background:#e9e9e9;color:#b49aff}
.design-ui .course:nth-child(4) .course-art{background:#eaeaea;color:#40d5c6}
.design-ui .art-braces{font-size:60px;letter-spacing:15px;line-height:1;transform:rotate(-8deg)}
.design-ui .art-braces span{color:#b49aff;font-size:32px;letter-spacing:0;vertical-align:middle}
.design-ui .art-stack{display:grid;gap:5px;transform:rotate(-8deg)}
.design-ui .art-stack i{height:16px;width:78px;border:1.5px solid #b49aff;background:#ffffff99;border-radius:4px}
.design-ui .art-stack i:first-child{transform:translateX(14px);background:#b49aff}
.design-ui .art-web{font-size:35px;transform:rotate(5deg);border:1.5px solid #b49aff;background:#ffffff88;padding:3px 15px;border-radius:8px;box-shadow:7px 7px 0 #b49aff44}
.design-ui .art-play{border:1.5px solid #40d5c6;border-radius:15px;font-size:35px;line-height:1;padding:13px 20px;transform:rotate(-7deg);background:#ffffff88}
.design-ui .course-number{position:absolute;left:12px;top:10px;font-size:11px;opacity:.5}
.design-ui .course-copy{padding:21px 20px 19px}
.design-ui .course .pill{font-size:11px;color:#40d5c6;background:#f0f0f0;border:1px solid #e2e2e2;padding:3px 8px;border-radius:4px;display:inline-block;margin-bottom:11px}
.design-ui .course h3{font-size:23px;line-height:1.2;margin:0 0 10px;letter-spacing:-.3px}
.design-ui .course p{font-size:15px;color:#797979;line-height:1.7;margin:0;min-height:76px}
.design-ui .course .course-link{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-top:1px solid #eaeaea;padding:15px 0 0;margin-top:20px;background:none;text-align:right;font-size:14px;color:#40d5c6}
.design-ui .course .course-link:hover{color:#b49aff}
.design-ui .course[hidden]{display:none}
.design-ui .challenge{padding:70px 0 74px}
.design-ui .challenge .eyebrow{color:var(--orange)}
.design-ui .challenge p{color:var(--muted);font-size:18px;max-width:380px}
.design-ui .reveal{animation:rise .8s both}
.design-ui .delay{animation-delay:.15s}
.design-ui .tiny-symbol{position:absolute;color:#40d5c644;font:27px var(--mono);pointer-events:none;animation:drift 7s ease-in-out infinite}
.design-ui .s1{left:3%;top:18%}
.design-ui .s2{left:48%;bottom:5%;animation-delay:-3s}
.design-ui .s3{right:2%;top:38%;font-size:18px;color:#b49aff33}
@keyframes blink{50%{opacity:0}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes drift{50%{transform:translateY(-12px) rotate(5deg)}}
@media(min-width:1600px){.design-ui .design-hero{padding-top:85px;padding-bottom:70px}}
@media(max-width:1050px){.design-ui .hero-grid{gap:35px}
.design-ui .design-hero h1{font-size:48px}
.design-ui .course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.design-ui .course p{min-height:0}
.design-ui .hero-footer{gap:20px;flex-wrap:wrap}}
@media(max-width:760px){.design-ui .wrap{padding-inline:20px}
.design-ui .design-hero{padding:38px 0}
.design-ui .hero-grid{grid-template-columns:minmax(0,1fr);gap:40px}
.design-ui .design-hero h1{font-size:clamp(40px,9vw,58px);max-width:560px}
.design-ui .design-hero .lead{font-size:18px}
.design-ui .kicker{margin-bottom:20px}
.design-ui .visual{max-width:580px;width:100%;margin:auto;padding-inline:5px}
.design-ui .hero-footer{margin-top:35px;padding-top:20px}
.design-ui .hero-footer .code-slogan{display:none}
.design-ui .section-top{align-items:start;flex-direction:column;gap:20px}
.design-ui .light{padding:45px 0 50px}
.design-ui .challenge{padding:45px 0}
.design-ui .challenge p{max-width:100%}
.design-ui .hero-footer p{font-size:13px}
.design-ui .route-dots{font-size:12px}}
@media(max-width:440px){.design-ui .design-hero h1{letter-spacing:-1.1px}
.design-ui .course-grid{grid-template-columns:minmax(0,1fr)}
.design-ui .course{display:grid;grid-template-columns:100px minmax(0,1fr)}
.design-ui .course-art{height:100%;min-height:200px}
.design-ui .course-copy{padding:18px}
.design-ui .course-number{font-size:10px}
.design-ui .art-braces{font-size:40px;letter-spacing:6px}
.design-ui .art-braces span{font-size:20px}
.design-ui .art-web{font-size:23px;padding:3px 8px}
.design-ui .art-stack i{width:54px}
.design-ui .art-play{font-size:24px;padding:9px 12px}
.design-ui .course p{font-size:14px}
.design-ui .course h3{font-size:22px}
.design-ui .course .course-link{margin-top:15px;font-size:13px}
.design-ui .hero-footer{display:block}
.design-ui .route-dots{margin-top:14px}
.design-ui .actions{gap:12px}
.design-ui .primary{padding:12px 18px;font-size:16px}
.design-ui .text-button{font-size:14px}
.design-ui .micro{gap:12px;font-size:12px}}
.design-ui .design-hero{padding-bottom:88px;background:var(--bg)}
.design-ui .light{border-radius:36px 36px 0 0;margin-top:-28px;background:var(--paper);border-top:3px solid #40d5c6;box-shadow:none}
.design-ui .light:before{content:'';position:absolute;top:-20px;inset-inline-start:calc(50% - 20px);width:40px;height:40px;border:1px solid #40d5c6;border-radius:12px;background:#e7e7e7;transform:rotate(45deg)}
.design-ui .light:after{content:'↓';position:absolute;top:-19px;inset-inline-start:calc(50% - 20px);width:40px;height:40px;text-align:center;color:#40d5c6;font:22px/40px var(--mono)}
.design-ui .challenge{background:var(--bg);padding-top:80px;border-top:3px solid #40d5c6;border-radius:32px 32px 0 0;margin-top:-28px;position:relative}
.design-ui .typed-line{display:block;min-height:1.12em}
.design-ui .design-hero h1 em{transform-origin:center;min-height:1.4em}
.design-ui .typed-line:empty:after{content:'\00a0'}
.design-ui #codeTitle{visibility:hidden}
.design-ui #codeTitle.title-pop{visibility:visible;animation:titlePop 1.15s cubic-bezier(.22,.7,.3,1) both}
.design-ui .typing-now:after{content:'';display:inline-block;height:.8em;width:3px;margin-inline-start:5px;background:var(--mint);animation:blink .7s steps(1) infinite}
@keyframes titlePop{0%{opacity:0;transform:scale(.72)}35%{opacity:1;transform:scale(1.13)}65%{transform:scale(.94)}100%{opacity:1;transform:scale(1)}}
@media(max-width:760px){.design-ui .design-hero{padding-bottom:65px}
.design-ui .light{border-radius:24px 24px 0 0}
.design-ui .challenge{padding-top:60px;border-radius:24px 24px 0 0}}
.design-ui .light{border-radius:28px 28px 0 0;border-top:1px solid #40d5c6}
.design-ui .light:before,.design-ui .light:after{display:none}
.design-ui .challenge{background:var(--paper);color:var(--ink);margin-top:0;border:0;border-radius:0;padding-top:38px}
.design-ui .challenge .wrap{border-top:1px solid #d9d9d9;padding-top:46px}
.design-ui .challenge p{color:#40d5c6}
.design-ui .challenge .eyebrow{color:#40d5c6}
.design-ui .challenge .callout{color:#40d5c6}
.design-ui .challenge .callout span{color:#40d5c6}
.design-ui .course-art{background:#e8e8e8}
.design-ui .hero-footer{border-top-color:#40d5c6}
.design-ui .design-hero{background:#f7f7f7}
.design-ui .design-hero:before{opacity:.09;background-image:radial-gradient(#767676 1px,transparent 1px)}
.design-ui .kicker{color:#40d5c6}
.design-ui .kicker .live{background:#40d5c6;box-shadow:0 0 0 5px #40d5c60c}
.design-ui .design-hero h1 em{color:#40d5c6}
.design-ui .design-hero h1 em:after{background:#40d5c6;height:3px;opacity:.35}
.design-ui .design-hero .lead{color:#6c6c6c}
.design-ui .design-hero .lead strong{color:#3b3b3b}
.design-ui .primary{background:#40d5c6;color:#ffffff;box-shadow:0 5px 0 #40d5c6}
.design-ui .primary:hover{box-shadow:0 3px 0 #40d5c6}
.design-ui .text-button{color:#40d5c6;text-decoration-color:#bcbcbc}
.design-ui .micro{color:#7c7c7c}
.design-ui .hero-footer{border-top:1px solid #dddddd}
.design-ui .hero-footer p{color:#6d6d6d}
.design-ui .route-dots,.design-ui .route-dots span:nth-of-type(2),.design-ui .route-dots span:nth-of-type(3){color:#40d5c6}
.design-ui .route-dots i{background:#40d5c6}
.design-ui .light{background:#f0f0f0;border:0;border-radius:28px 28px 0 0;box-shadow:none}
.design-ui .eyebrow{color:#40d5c6}
.design-ui .section-top p{color:#767676}
.design-ui .course{border-color:#dedede;background:#ffffff}
.design-ui .course-art,.design-ui .course:nth-child(2) .course-art,.design-ui .course:nth-child(3) .course-art,.design-ui .course:nth-child(4) .course-art{background:#ededed;color:#40d5c6}
.design-ui .course h3{color:#323232}
.design-ui .course .pill{color:#40d5c6;background:#f3f3f3;border-color:#e5e5e5}
.design-ui .course p{color:#787878}
.design-ui .course .course-link{color:#40d5c6;border-top-color:#e9e9e9}
.design-ui .course .course-link:hover{color:#40d5c6}
.design-ui .art-braces span{color:#40d5c6}
.design-ui .art-web{border-color:#bebebe;box-shadow:7px 7px 0 #d6d6d644}
.design-ui .art-stack i{border-color:#40d5c6}
.design-ui .art-stack i:first-child{background:#40d5c6}
.design-ui .challenge{background:#f0f0f0;color:#2b2b2b}
.design-ui .challenge .wrap{border-top-color:#dadada}
.design-ui .challenge p,.design-ui .challenge .callout{color:#717171}
.design-ui .challenge .eyebrow,.design-ui .challenge .callout span{color:#40d5c6}
.design-ui .typing-now:after{background:#40d5c6}
.design-ui .tiny-symbol{color:#b4b4b444}
.design-ui .s3{color:#b4b4b444}
.design-ui .design-hero{background:#1e1e1e}
.design-ui .design-hero:before{opacity:.12;background-image:radial-gradient(#8b8b8b 1px,transparent 1px)}
.design-ui .kicker{color:#b49aff}
.design-ui .kicker .live{background:#40d5c6;box-shadow:0 0 0 5px #40d5c615}
.design-ui .design-hero h1{color:#efefef}
.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .design-hero h1 em:after{background:#b49aff;opacity:1;height:3px}
.design-ui .design-hero .lead{color:#b7b7b7}
.design-ui .design-hero .lead strong{color:#e6e6e6}
.design-ui .primary{background:#40d5c6;color:#272727;box-shadow:0 5px 0 #40d5c6}
.design-ui .primary:hover{box-shadow:0 3px 0 #40d5c6}
.design-ui .text-button{color:#b49aff;text-decoration-color:#606060}
.design-ui .micro{color:#a4a4a4}
.design-ui .micro span:before{color:#40d5c6}
.design-ui .typing-now:after{background:#b49aff}
.design-ui .hero-footer{border-top-color:#414141}
.design-ui .hero-footer p{color:#c4c4c4}
.design-ui .route-dots{color:#b49aff}
.design-ui .route-dots span:nth-of-type(2){color:#b49aff}
.design-ui .route-dots span:nth-of-type(3){color:#b49aff}
.design-ui .route-dots i{background:#40d5c6}
.design-ui .tiny-symbol,.design-ui .s3{color:#85858533}
.design-ui .light{background:#f4f4f4;border:0;border-radius:24px 24px 0 0;color:#292929;box-shadow:none}
.design-ui .light:before,.design-ui .light:after{display:none}
.design-ui .section-top h2{color:#292929}
.design-ui .eyebrow{color:#40d5c6}
.design-ui .section-top p{color:#717171}
.design-ui .course{border-color:#dddddd}
.design-ui .course h3{color:#292929}
.design-ui .course p{color:#717171}
.design-ui .course .course-link{color:#40d5c6}
.design-ui .course .pill{background:#f2f2f2;color:#6e6e6e;border-color:#e1e1e1}
.design-ui .course:nth-child(1){border-top:3px solid #b49aff}
.design-ui .course:nth-child(2){border-top:3px solid #b49aff}
.design-ui .course:nth-child(3){border-top:3px solid #40d5c6}
.design-ui .course:nth-child(4){border-top:3px solid #b49aff}
.design-ui .course:nth-child(1) .course-art{background:#ededed;color:#40d5c6}
.design-ui .course:nth-child(2) .course-art{background:#eaeaea;color:#b49aff}
.design-ui .course:nth-child(3) .course-art{background:#ededed;color:#40d5c6}
.design-ui .course:nth-child(4) .course-art{background:#efefef;color:#b49aff}
.design-ui .art-braces span{color:#b49aff}
.design-ui .art-stack i{border-color:#b49aff}
.design-ui .art-stack i:first-child{background:#b49aff}
.design-ui .art-web{border-color:#40d5c6;box-shadow:6px 6px 0 #40d5c6}
.design-ui .art-play{border-color:#b49aff}
.design-ui .challenge{background:#f4f4f4;color:#292929;border:0}
.design-ui .challenge .wrap{border-top-color:#dbdbdb}
.design-ui .challenge p,.design-ui .challenge .callout{color:#717171}
.design-ui .challenge .eyebrow{color:#b49aff}
.design-ui .challenge .callout span{color:#40d5c6}
.design-ui .design-hero{background:#242424}
.design-ui .design-hero:before{opacity:.06}
.design-ui .light{background:#e5e5e5;border-radius:0;margin-top:0;border-top:8px solid #383838;padding-top:60px}
.design-ui .design-hero{padding-bottom:60px}
.design-ui .hero-footer{border-top-color:#454545}
.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .design-hero h1 em:after{background:#b49aff;opacity:.5}
.design-ui .primary{background:#b49aff;color:#40d5c6;box-shadow:0 5px 0 #40d5c6}
.design-ui .primary:hover{box-shadow:0 3px 0 #40d5c6}
.design-ui .kicker{color:#b49aff}
.design-ui .kicker .live{background:#b49aff;box-shadow:0 0 0 5px #b49aff12}
.design-ui .route-dots,.design-ui .route-dots span:nth-of-type(2),.design-ui .route-dots span:nth-of-type(3){color:#bcbcbc}
.design-ui .route-dots i{background:#b49aff}
.design-ui .micro span:before{color:#b49aff}
.design-ui .course,.design-ui .course:nth-child(1),.design-ui .course:nth-child(2),.design-ui .course:nth-child(3),.design-ui .course:nth-child(4){border:1px solid #cecece;background:#f7f7f7;box-shadow:none}
.design-ui .course-art,.design-ui .course:nth-child(1) .course-art,.design-ui .course:nth-child(2) .course-art,.design-ui .course:nth-child(3) .course-art,.design-ui .course:nth-child(4) .course-art{background:#303030;color:#b49aff;border-bottom:1px solid #454545}
.design-ui .course:nth-child(2) .course-art{color:#b49aff}
.design-ui .course:nth-child(3) .course-art{color:#40d5c6}
.design-ui .course:nth-child(4) .course-art{color:#b49aff}
.design-ui .art-braces span{color:#b49aff}
.design-ui .art-stack i{background:#ffffff0b;border-color:#b49aff}
.design-ui .art-stack i:first-child{background:#b49aff2b}
.design-ui .art-web{background:#ffffff08;border-color:#40d5c6;box-shadow:none}
.design-ui .art-play{background:#ffffff08;border-color:#b49aff}
.design-ui .course .course-link{color:#40d5c6;border-top-color:#dedede}
.design-ui .course .pill{background:#eeeeee;color:#6e6e6e;border-color:#dddddd}
.design-ui .challenge{background:#e5e5e5}
.design-ui .challenge .wrap{border-top-color:#c7c7c7}
.design-ui .challenge .eyebrow{color:#686868}
@media(max-width:760px){.design-ui .light{border-radius:0;padding-top:40px}
.design-ui .design-hero{padding-bottom:40px}}
.design-ui .primary{background:#b49aff;color:#202020;box-shadow:0 5px 0 #b49aff}
.design-ui .primary:hover{box-shadow:0 3px 0 #b49aff}
.design-ui .course .course-link{color:#b49aff}
@media(max-width:760px){.design-ui .hero-footer .code-slogan{display:block;width:100%;margin-top:16px;font-size:12px}}
.design-ui .kicker,.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .kicker .live{background:#b49aff;box-shadow:0 0 0 5px #b49aff1a}
.design-ui .design-hero h1 em:after,.design-ui .typing-now:after,.design-ui .route-dots i{background:#b49aff}
.design-ui .primary{background:#b49aff;color:#ffffff;box-shadow:0 5px 0 #b49aff}
.design-ui .primary:hover{background:#b49aff;box-shadow:0 3px 0 #b49aff}
.design-ui .micro span:before{color:#b49aff}
.design-ui .text-button{color:#b49aff;text-decoration-color:#b49aff}
.design-ui .course .course-link{color:#b49aff}
.design-ui .course:hover{border-color:#b49aff;box-shadow:0 8px 0 #b49aff10}
.design-ui .course:nth-child(1) .course-art{color:#40d5c6}
.design-ui .art-braces span{color:#40d5c6}
.design-ui .design-hero h1 .typed-line:first-child{color:#40d5c6}
.design-ui .design-hero h1 .typed-line:nth-child(2){color:#efefef}
.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .design-hero h1 em:after{background:#40d5c6}
.design-ui .kicker{color:#40d5c6}
.design-ui .kicker .live{background:#b49aff}
.design-ui .text-button{color:#40d5c6;text-decoration-color:#40d5c6}
.design-ui .micro span:first-child:before{color:#40d5c6}
.design-ui .micro span:last-child:before{color:#b49aff}
.design-ui .route-dots i:nth-of-type(2){background:#40d5c6}
.design-ui .route-dots span:nth-of-type(1){color:#b49aff}
.design-ui .route-dots span:nth-of-type(3){color:#40d5c6}
.design-ui .course:nth-child(1),.design-ui .course:nth-child(3){border-top:3px solid #40d5c6}
.design-ui .course:nth-child(2),.design-ui .course:nth-child(4){border-top:3px solid #b49aff}
.design-ui .course:nth-child(1) .course-art,.design-ui .course:nth-child(3) .course-art{color:#40d5c6}
.design-ui .course:nth-child(2) .course-art,.design-ui .course:nth-child(4) .course-art{color:#b49aff}
.design-ui .course:nth-child(1) button,.design-ui .course:nth-child(3) button{color:#40d5c6}
.design-ui .course:nth-child(2) button,.design-ui .course:nth-child(4) button{color:#b49aff}
.design-ui .art-stack i{border-color:#b49aff}
.design-ui .art-stack i:first-child{background:#b49aff2b}
.design-ui .art-web{border-color:#40d5c6;color:#40d5c6;box-shadow:none}
.design-ui .art-play{border-color:#b49aff}
.design-ui .light,.design-ui .challenge{background:#f3f3f3}
.design-ui .course{background:#fff;border-color:#d8d8d8}
.design-ui .course .pill{background:#f1f1f1;border-color:#dedede;color:#666}
.design-ui .section-top p,.design-ui .course p,.design-ui .challenge p,.design-ui .challenge .callout{color:#666}
.design-ui .eyebrow,.design-ui .challenge .eyebrow{color:#737373}
.design-ui .design-hero h1 .typed-line:first-child{color:#fff}
.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .design-hero h1 em:after{background:#40d5c6}
.design-ui .course,.design-ui .course:nth-child(1),.design-ui .course:nth-child(2),.design-ui .course:nth-child(3),.design-ui .course:nth-child(4){border-top:1px solid #d8d8d8}
.design-ui .course .course-link,.design-ui .course:nth-child(1) button,.design-ui .course:nth-child(2) button,.design-ui .course:nth-child(3) button,.design-ui .course:nth-child(4) button{color:#333}
.design-ui .course .course-link:hover{color:#b49aff}
.design-ui .course-art,.design-ui .course:nth-child(1) .course-art,.design-ui .course:nth-child(2) .course-art,.design-ui .course:nth-child(3) .course-art,.design-ui .course:nth-child(4) .course-art{background:#303030;color:#40d5c6}
.design-ui .art-braces span,.design-ui .art-stack,.design-ui .art-web,.design-ui .art-play{color:#40d5c6}
.design-ui .art-stack i,.design-ui .art-web,.design-ui .art-play{border-color:#40d5c6}
.design-ui .art-stack i:first-child{background:#40d5c622}
.design-ui .lesson-screen{border:1px solid #555;border-radius:18px;background:#2b2b2b;overflow:hidden;box-shadow:0 12px 0 #191919;transform:rotate(-1deg)}
.design-ui .lesson-bar{padding:15px 20px;border-bottom:1px solid #444;display:flex;align-items:center;gap:9px;font-size:14px;color:#eee}
.design-ui .lesson-live{width:7px;height:7px;background:#b49aff;border-radius:50%}
.design-ui .lesson-badge{margin-inline-start:auto;color:#40d5c6;font-size:12px}
.design-ui .lesson-stage{position:relative;min-height:335px;padding:30px 24px 50px 100px}
.design-ui .lesson-board{background:#242424;border:1px solid #666;border-radius:12px;padding:24px 18px;min-height:245px;position:relative}
.design-ui .board-label{color:#eee;font-size:20px;font-weight:bold;margin-bottom:25px}
.design-ui .lesson-steps{display:grid;gap:10px}
.design-ui .lesson-step{display:flex;gap:14px;align-items:center;color:#999;font:12px var(--mono);border-radius:6px;padding:7px 10px}
.design-ui .lesson-step b{font:18px var(--sans);color:#ddd}
.design-ui .ls1{animation:lessonHighlight 9s infinite}
.design-ui .ls2{animation:lessonHighlight 9s 3s infinite}
.design-ui .ls3{animation:lessonHighlight 9s 6s infinite}
.design-ui .lesson-success{font-size:13px;color:#40d5c6;margin-top:14px;animation:lessonSuccess 9s infinite}
.design-ui .lesson-teacher{position:absolute;width:150px;height:210px;left:-8px;bottom:7px}
.design-ui .teacher-arm{transform-origin:113px 125px;animation:teacherPoint 3s ease-in-out infinite}
.design-ui .lesson-caption{border-top:1px solid #444;padding:16px 20px;font-size:14px;color:#bbb;text-align:center}
@keyframes lessonHighlight{0%,28%{background:#b49aff1c;color:#b49aff;box-shadow:inset -3px 0 #b49aff}33%,100%{background:transparent;color:#999;box-shadow:none}}
@keyframes lessonSuccess{0%,65%{opacity:.25}75%,100%{opacity:1}}
@keyframes teacherPoint{50%{transform:rotate(-9deg)}}
@media(max-width:440px){.design-ui .lesson-stage{padding:24px 15px 40px 70px;min-height:310px}
.design-ui .lesson-teacher{width:115px;height:180px;left:-12px}
.design-ui .board-label{font-size:18px}
.design-ui .lesson-board{padding:20px 12px}
.design-ui .lesson-caption{font-size:12px}}
@media(prefers-reduced-motion:reduce){.design-ui .lesson-step,.design-ui .teacher-arm,.design-ui .lesson-success{animation:none}
.design-ui .lesson-success{opacity:1}}
.design-ui .topic-discovery h2{margin-top:0}
.design-ui .topic-discovery p{max-width:none}
.design-ui .topic-cloud{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:19px 14px;padding:35px 0 18px;max-width:1000px;margin:auto}
.design-ui .topic-bubble{display:inline-flex;align-items:center;gap:16px;background:#fff;border:1px solid #ccc;border-radius:12px;padding:13px 21px;font-size:19px;color:#333;box-shadow:0 4px 0 #ddd;animation:topicAppear .5s both,topicFloat var(--float) ease-in-out infinite;animation-delay:var(--delay),calc(var(--delay) + .5s);transition:border-color .2s,background .2s}
.design-ui .topic-bubble span{font-size:15px;color:#999}
.design-ui .topic-bubble:nth-child(3n+1){border-top:3px solid #b49aff}
.design-ui .topic-bubble:nth-child(3n+2){border-top:3px solid #40d5c6}
.design-ui .topic-bubble:hover,.design-ui .topic-bubble:focus-visible{animation-play-state:paused;background:#303030;color:#fff;border-color:#b49aff}
.design-ui .topic-bubble:hover span{color:#40d5c6}
@keyframes topicAppear{from{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes topicFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-width:440px){.design-ui .topic-cloud{gap:13px 9px}
.design-ui .topic-bubble{font-size:16px;padding:10px 13px;gap:10px}}
@media(prefers-reduced-motion:reduce){.design-ui .topic-bubble{animation:none}}
.design-ui .topic-cloud{display:block;position:relative;height:700px;max-width:1120px;padding:0;margin:15px auto 0;isolation:isolate}
.design-ui .topic-cloud:before,.design-ui .topic-cloud:after{content:'';position:absolute;border:1px dashed #ccc;border-radius:50%;inset:8% 10%;z-index:-1;pointer-events:none}
.design-ui .topic-cloud:after{inset:26% 24%;border-color:#d8d8d8}
.design-ui .topic-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;direction:ltr;font:700 30px/1.15 var(--mono);letter-spacing:-1px;pointer-events:none}
.design-ui .topic-center span{color:#333;display:block}
.design-ui .topic-center strong{color:#b49aff;display:block}
.design-ui .topic-center small{font:14px var(--sans);color:#777;display:block;margin-top:12px;letter-spacing:0;direction:rtl}
.design-ui .topic-bubble{position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;rotate:var(--tilt);white-space:nowrap;font-size:16px;padding:11px 16px;gap:10px;z-index:1;box-shadow:0 3px 0 #ddd}
.design-ui .topic-bubble:hover,.design-ui .topic-bubble:focus-visible{z-index:3;rotate:0deg}
@media(max-width:900px){.design-ui .topic-cloud{height:620px}
.design-ui .topic-bubble{font-size:14px;padding:9px 11px;gap:6px}
.design-ui .topic-center{font-size:25px}}
@media(max-width:650px){.design-ui .topic-cloud{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:19px 12px;height:auto;padding:15px 0 30px}
.design-ui .topic-cloud:before,.design-ui .topic-cloud:after{display:none}
.design-ui .topic-center{position:static;transform:none;width:100%;margin:10px 0 25px;font-size:30px}
.design-ui .topic-bubble{position:relative;left:auto;top:auto;translate:none;font-size:15px;max-width:100%}
.design-ui .topic-bubble:nth-child(3n){margin-top:12px}
.design-ui .topic-bubble:nth-child(4n){margin-inline:8px}}
.design-ui .lesson-step:after{content:'';display:block;width:8px;height:8px;border:1px solid #40d5c6;border-radius:50%;margin-inline-start:auto;flex:0 0 8px;box-sizing:border-box}
.design-ui .primary{color:#292929}
.design-ui .course .course-link:hover,.design-ui .topic-center strong{color:#716012}
.design-ui .light,.design-ui .challenge{background:#f6f4ee}
.design-ui .course{background:#fffefa;border-color:#dedbd3}
.design-ui .course .pill{background:#f2f0e9;border-color:#e3e0d7}
.design-ui .topic-bubble{background:#fffefa;border-color:#d1cec6;box-shadow:0 3px 0 #e0ddd5}
.design-ui .kicker,.design-ui .design-hero h1 em{color:#40d5c6}
.design-ui .design-hero h1 em:after{background:#40d5c6}
.design-ui .kicker .live,.design-ui .typing-now:after,.design-ui .route-dots i{background:#40d5c6}
.design-ui .kicker .live{box-shadow:0 0 0 5px #40d5c615}
.design-ui .text-button{color:#40d5c6;text-decoration-color:#608b85}
.design-ui .micro span:first-child:before,.design-ui .micro span:last-child:before{color:#40d5c6}
.design-ui .primary{background:#b49aff;color:#30251e;box-shadow:0 5px 0 #ac704a}
.design-ui .primary:hover{background:#ffba90;box-shadow:0 3px 0 #ac704a}
.design-ui .route-dots span:nth-of-type(1),.design-ui .route-dots span:nth-of-type(3){color:#c7c7c1}
.design-ui .course:hover{border-color:#79b9ad;box-shadow:0 8px 0 #40d5c60b}
.design-ui .course .course-link,.design-ui .course:nth-child(1) button,.design-ui .course:nth-child(2) button,.design-ui .course:nth-child(3) button,.design-ui .course:nth-child(4) button,.design-ui .course .course-link:hover{color:#246f65}
.design-ui .lesson-live{background:#b49aff}
.design-ui .lesson-step{animation-name:lessonHighlightTurquoise}
.design-ui .lesson-step:after{border-color:#40d5c6}
.design-ui .lesson-screen .teacher-arm path:last-child{stroke:#b49aff}
@keyframes lessonHighlightTurquoise{0%,28%{background:#40d5c615;color:#40d5c6;box-shadow:inset -3px 0 #40d5c6}33%,100%{background:transparent;color:#999;box-shadow:none}}
.design-ui .topic-bubble:nth-child(3n+1),.design-ui .topic-bubble:nth-child(3n+2){border-top:1px solid #d1cec6}
.design-ui .topic-bubble span{color:#358579}
.design-ui .topic-bubble:hover,.design-ui .topic-bubble:focus-visible{border-color:#40d5c6}
.design-ui .topic-center strong{color:#246f65}
.design-ui .topic-center span{color:#333}
.design-ui .topic-cloud:before,.design-ui .topic-cloud:after{border-color:#d2d0c8}
@media(prefers-reduced-motion:reduce){.design-ui .lesson-step{animation:none}}
.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .design-hero h1 em:after{background:#40d5c6;width:100%;height:5px}
.design-ui .kicker{color:#40d5c6}
.design-ui .lesson-screen{border:2px solid #40d5c6;box-shadow:10px 12px 0 #b49aff;transform:rotate(-2deg)}
.design-ui .light{border-top:6px solid #40d5c6}
.design-ui .section-top h2{max-width:690px}
.design-ui .course{transition:transform .2s,box-shadow .2s}
.design-ui .course:nth-child(odd){transform:rotate(-1deg)}
.design-ui .course:nth-child(even){transform:rotate(1deg)}
.design-ui .course:hover{transform:translateY(-7px) rotate(0);box-shadow:5px 7px 0 #40d5c64a}
.design-ui .course:nth-child(1) .course-art,.design-ui .course:nth-child(3) .course-art{background:#40d5c6;color:#243632}
.design-ui .course:nth-child(2) .course-art,.design-ui .course:nth-child(4) .course-art{background:#b49aff;color:#3c2e25}
.design-ui .course-art{border:0}
.design-ui .art-braces span,.design-ui .art-web,.design-ui .art-play{color:inherit}
.design-ui .art-stack i,.design-ui .art-web,.design-ui .art-play{border-color:currentColor}
.design-ui .art-stack i:first-child{background:#ffffff55}
.design-ui .course-number{color:#252525;opacity:.6}
.design-ui .topic-center{background:#303030;padding:22px 28px;border-radius:20px;box-shadow:7px 7px 0 #b49aff}
.design-ui .topic-center span{color:#fff}
.design-ui .topic-center strong{color:#40d5c6}
.design-ui .topic-center small{color:#bbb}
.design-ui .topic-bubble:nth-child(4n+1){background:#d8f3ec;border-color:#90cfc1}
.design-ui .topic-bubble:nth-child(4n+2){background:#ffeadb;border-color:#dfb69b}
.design-ui .topic-bubble:hover,.design-ui .topic-bubble:focus-visible{background:#303030}
@media(max-width:760px){.design-ui .lesson-screen{box-shadow:6px 8px 0 #b49aff}}
@media(max-width:650px){.design-ui .topic-center{width:auto;flex-basis:75%;margin-inline:auto}
.design-ui .course:nth-child(n){transform:none}}
.design-ui .primary{background:#b49aff;color:#241c3c;box-shadow:0 5px 0 #7157ad}
.design-ui .primary:hover{background:#c5b0ff;box-shadow:0 3px 0 #7157ad}
.design-ui .design-hero h1 em{color:#b49aff}
.design-ui .design-hero h1 em:after{background:#40d5c6}
.design-ui .lesson-screen{box-shadow:10px 12px 0 #8f74d1}
.design-ui .lesson-live{background:#b49aff}
.design-ui .lesson-screen .teacher-arm path:last-child{stroke:#b49aff}
.design-ui .course:nth-child(2) .course-art,.design-ui .course:nth-child(4) .course-art{background:#b49aff;color:#302347}
.design-ui .topic-bubble:nth-child(4n+2){background:#eee7fb;border-color:#c7b9e4}
.design-ui .topic-center{box-shadow:7px 7px 0 #b49aff}
@media(max-width:760px){.design-ui .lesson-screen{box-shadow:6px 8px 0 #8f74d1}}

.design-ui{--ink:#191919;--bg:#242424;--panel:#303030;--white:#fff;--muted:#aaa;--paper:#f6f4ee;--mint:#40d5c6;--orange:#b49aff;--purple:#b49aff;--mono:Consolas,"Courier New",monospace;--sans:Calibri,Arial,sans-serif}
.design-ui .wrap{max-width:1240px;margin:auto;padding-inline:32px}
.design-ui .design-hero,.design-ui .light,.design-ui .topic-discovery{border-radius:18px;margin-block:22px}
.design-ui .hero-copy>p{margin-block:0 25px}
.design-ui .course .course-link{display:flex;justify-content:space-between;gap:8px;font-weight:700}
.design-ui .topic-discovery .topic-bubble{color:#292929}
.design-ui .topic-discovery .topic-bubble:hover,.design-ui .topic-discovery .topic-bubble:focus-visible{color:#fff}
.design-ui .mahat-link{margin-block:18px 6px}
.design-ui .highschool-note p{margin:0}
.design-ui .typed-line{display:block}
.site-header .wordmark{display:inline-flex;direction:ltr;gap:5px;flex-wrap:wrap;max-width:260px;font:700 22px/1.05 Consolas,monospace;text-align:left;align-items:center}
.site-header .wordmark span{font:inherit;color:inherit}
.site-header .wordmark .wordmark-code{color:#f7f7f2}
.site-header .wordmark .wordmark-do{display:inline-flex;align-items:center;color:#40d5c6}
.site-header .wordmark .logo-letter-d{width:20px;height:25px}
.site-header .wordmark .logo-bracket,.site-header .wordmark .logo-period{color:#b49aff}
.site-header .wordmark .design-author{width:100%;font:12px/1.4 Calibri,Arial,sans-serif;color:#b4bfd0;text-align:center}
@media(max-width:760px){.design-ui .wrap{padding-inline:18px}.design-ui .design-hero,.design-ui .light,.design-ui .topic-discovery{border-radius:12px}.site-header .wordmark{font-size:18px}.site-header .wordmark .logo-letter-d{width:17px;height:21px}}
@media(prefers-reduced-motion:reduce){.design-ui *,.design-ui *::before,.design-ui *::after{animation:none!important;transition:none!important}}

/* Remove only the full-section shells. Individual cards and controls keep their design. */
main:has(#homeHero:not([hidden])){max-width:none;padding-inline:0}
.design-ui .design-hero,.design-ui .light,.design-ui .topic-discovery{
  margin-block:0;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.design-ui .topic-discovery .wrap{border-top:0}
main:has(#homeHero:not([hidden])) .learning-layout{max-width:1240px;margin-inline:auto;padding-inline:28px}
@media(max-width:720px){main:has(#homeHero:not([hidden])) .learning-layout{padding-inline:20px}}

/* One navy page background, with lighter blue surfaces for the existing cards. */
:root{--home-blue:#10151f;--home-panel:#19283b;--home-raised:#213752;--home-edge:#415a79;--home-text:#edf3ff;--home-muted:#b9c9e0}
body:has(#homeHero:not([hidden])) .site-header{background:var(--home-blue)}
.design-ui .design-hero,.design-ui .light,.design-ui .challenge{background:transparent;color:var(--home-text)}
.design-ui .design-hero:before{background-image:radial-gradient(#6493cb 1px,transparent 1px)}
.design-ui .design-hero .lead,.design-ui .section-top p,.design-ui .challenge p,.design-ui .challenge .callout{color:var(--home-muted)}
.design-ui .section-top h2,.design-ui .challenge h2,.design-ui .course h3{color:var(--home-text)}
.design-ui .section-top .eyebrow,.design-ui .challenge .eyebrow{color:#b49aff}
.design-ui .hero-footer,.design-ui .lesson-bar,.design-ui .lesson-caption{border-color:var(--home-edge)}
.design-ui .lesson-screen,.design-ui .topic-center{background:var(--home-panel)}
.design-ui .lesson-board{background:#162338;border-color:var(--home-edge)}
.design-ui .course:nth-child(n){background:var(--home-panel);border-color:var(--home-edge)}
.design-ui .course:nth-child(n):hover{border-color:#40d5c6}
.design-ui .course:nth-child(n) .course-art{background:var(--home-raised);color:#40d5c6}
.design-ui .course:nth-child(even) .course-art{background:#283b60;color:#d0bdff}
.design-ui .course-number{color:var(--home-text);opacity:.85}
.design-ui .course .pill{background:#223653;border-color:var(--home-edge);color:var(--home-muted)}
.design-ui .course p,.design-ui .topic-center small{color:var(--home-muted)}
.design-ui .course .course-link{color:#76ebde;border-top-color:var(--home-edge)}
.design-ui .course .course-link:hover{color:#d0bdff}
.design-ui .topic-cloud:before,.design-ui .topic-cloud:after{border-color:var(--home-edge)}
.design-ui .topic-discovery .topic-bubble:nth-child(n){background:var(--home-panel);color:var(--home-text);border-color:var(--home-edge);box-shadow:0 3px 0 #0b1120}
.design-ui .topic-discovery .topic-bubble:nth-child(even){background:#263755;border-color:#566b96}
.design-ui .topic-discovery .topic-bubble span{color:#83dfd7}
.design-ui .topic-discovery .topic-bubble:nth-child(n):is(:hover,:focus-visible){background:var(--home-raised);border-color:#40d5c6}

/* Keep the home palette across the catalog and the three viewer layouts. */
@media screen{
  .site-header,.reading-view .top,.activity-view .activity-header,.presentation-view .header{
    background:var(--home-blue);border-bottom-color:var(--home-edge)
  }
  #learningLayout .card,#learningLayout .curriculum-sidebar,#learningLayout #simHelp,#learningLayout #gameHelp,
  #learningLayout .topic-progress a,#learningLayout :is(input,select),.site-header .exam:hover{
    background:var(--home-panel);border-color:var(--home-edge);color:var(--home-text)
  }
  #learningLayout .card:is(.folder,.area-card):hover,.site-header .exam.active,
  .reading-view .topnav a:is(:hover,.current){
    background:var(--home-raised);border-color:var(--home-edge);color:#83dfd7
  }
  #learningLayout .library,footer,.site-footer{border-color:var(--home-edge)}
  #learningLayout .section-label,.reading-view .eyebrow,.activity-view .crumbs .category,.presentation-view .heading small{
    color:#d0bdff
  }
  #learningLayout .folder .icon,#learningLayout .card .icon{background:var(--home-raised);color:#d0bdff}
  #learningLayout .card p,.reading-view .intro>p,.activity-view .crumbs,.presentation-view .hint,.site-footer{color:var(--home-muted)}
  #learningLayout .folder-open,.reading-view .return-origin,.reading-view .prose h2{color:#83dfd7}
  .reading-view,.activity-view,.presentation-view{background:var(--home-blue);color:var(--home-text)}
  .reading-view :is(.intro,.sidebar,.lesson-next),.reading-view .meta span{border-color:var(--home-edge)}
  .reading-view :is(.prose pre,.lesson-figure:not(.source-color),.lesson-practice,.tools button,.meta .mint),
  .presentation-view .slide-frame{
    background:var(--home-panel);border-color:var(--home-edge)
  }
  .reading-view .lesson-practice a,.presentation-view :is(.toolbar button,.zoom),
  .activity-view .button.back,.presentation-view .back{
    background:var(--home-raised);border-color:var(--home-edge);color:var(--home-text)
  }
  .reading-view .lesson-practice a:hover,.activity-view .button.back:hover,.presentation-view .back:hover{
    border-color:#40d5c6;color:#83dfd7
  }
  .reading-view .float-download,.activity-view .button.download,.presentation-view .download{
    background:#b49aff;border-color:#b49aff;color:#241c3c
  }
  .reading-view .float-download:hover,.activity-view .button.download:hover,.presentation-view .download:hover{
    background:#d0bdff;border-color:#d0bdff
  }
  .activity-view .activity-main iframe{background:var(--home-panel)}
}

@media screen{
 .theme-toggle[hidden]{display:none}
 .theme-toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:42px;padding:7px 10px;border:1px solid #566e91;border-radius:9px;background:#19283b;color:#edf3ff;font:700 13px Calibri,Arial,sans-serif;white-space:nowrap;cursor:pointer}
 .theme-toggle svg{width:16px;height:16px;flex:none}
 .theme-toggle .theme-moon,html[data-color-theme="light"] .theme-toggle .theme-sun{display:none}
 html[data-color-theme="light"] .theme-toggle .theme-moon{display:block}
 .theme-toggle:hover{background:#283b60;border-color:#b49aff}
 .theme-toggle:focus-visible{outline:2px solid #b49aff;outline-offset:3px}
 @media(max-width:720px){
  .site-header .header-inner{position:relative}
  .site-header .theme-toggle{position:absolute;inset-block-start:14px;inset-inline-end:18px}
  .reading-view .header-inner{flex-wrap:wrap}
  .reading-view .topnav{order:3;width:100%}
  .reading-view .theme-toggle{margin-inline-start:auto}
  .activity-view .theme-toggle{padding-inline:8px;min-height:40px}
 }
 @media(max-width:380px){.activity-view .theme-toggle span{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}}
}
@media screen{
 html[data-color-theme="light"]{
  color-scheme:light;
  --bg:#eff6ff;--panel:#fff;--border:#a8bfdc;--text:#172b48;--muted:#415675;--mint:#096359;--purple:#6139a1;
  --home-blue:#eff6ff;--home-panel:#fff;--home-raised:#e3efff;--home-edge:#a8bfdc;--home-text:#172b48;--home-muted:#415675
 }
 html[data-color-theme="light"] body{background:var(--bg);color:var(--text)}
 html[data-color-theme="light"] :is(.site-header,.reading-view .top,.activity-header,.presentation-view .header){background:#f6faff}
 html[data-color-theme="light"] .theme-toggle{background:#fff;border-color:#8da8cf;color:#172b48}
 html[data-color-theme="light"] .theme-toggle:hover{background:#e3efff;border-color:#6139a1}
 html[data-color-theme="light"] :is(a,button):focus-visible{outline-color:#6139a1}
 html[data-color-theme="light"] :is(.exam,.topnav a,.crumb,.area-code,.tag,.curriculum-sidebar p,.curriculum-sidebar a,#stats,#breadcrumbs,#breadcrumbs button,.folder small,.area-bottom,.tools-label,.toc a,.toplink,.robot-board caption,.presentation-view .count){color:var(--muted)}
 html[data-color-theme="light"] :is(.site-header #exams .exam:hover,.site-header #exams .exam.active,.reading-view .topnav a.current,.curriculum-sidebar a[aria-current],.curriculum-sidebar a:hover,.toc a:hover,.toc a.active){background:#dbeaff;color:#174569;border-color:#a8bfdc}
 html[data-color-theme="light"] .site-header .wordmark :is(.wordmark-code,.design-author){color:#172b48}
 html[data-color-theme="light"] .site-header .wordmark .wordmark-do{color:#096359}
 html[data-color-theme="light"] .site-header .wordmark :is(.logo-bracket,.logo-period){color:#6139a1}
 html[data-color-theme="light"] .design-ui :is(.design-hero,.light,.challenge){background:transparent;color:var(--text)}
 html[data-color-theme="light"] .design-ui .design-hero h1 .typed-line{color:var(--text)}
 html[data-color-theme="light"] .design-ui .design-hero h1 em{color:var(--purple)}
 html[data-color-theme="light"] .design-ui :is(.kicker,.text-button,.section-top .eyebrow,.challenge .eyebrow){color:var(--mint)}
 html[data-color-theme="light"] .design-ui .design-hero .lead strong{color:var(--text)}
 html[data-color-theme="light"] .design-ui :is(.micro,.route-dots,.route-dots span){color:var(--muted)}
 html[data-color-theme="light"] .design-ui .highschool-note :is(strong,p){color:var(--text)!important}
 html[data-color-theme="light"] .design-ui :is(.lesson-bar,.lesson-caption,.board-label,.lesson-step b,.topic-center span){color:var(--text)}
 html[data-color-theme="light"] .design-ui :is(.lesson-badge,.lesson-success,.topic-center strong){color:var(--mint)}
 html[data-color-theme="light"] .design-ui .lesson-screen{box-shadow:7px 8px 0 #cfc0f0}
 html[data-color-theme="light"] .design-ui .lesson-board{background:#e3efff}
 html[data-color-theme="light"] .design-ui .course:nth-child(n) .course-art{background:#d9f0f6;color:#096359}
 html[data-color-theme="light"] .design-ui .course:nth-child(even) .course-art{background:#ebe4fa;color:#6139a1}
 html[data-color-theme="light"] .design-ui .course .pill{background:#edf4ff}
 html[data-color-theme="light"] .design-ui .course .course-link{color:var(--mint)}
 html[data-color-theme="light"] .design-ui .course .course-link:hover{color:var(--purple)}
 html[data-color-theme="light"] .design-ui .topic-discovery .topic-bubble:nth-child(n){background:#fff;color:var(--text);box-shadow:0 3px 0 #c9d9ee}
 html[data-color-theme="light"] .design-ui .topic-discovery .topic-bubble:nth-child(even){background:#ece7fa;border-color:#b8a7d8}
 html[data-color-theme="light"] .design-ui .topic-discovery .topic-bubble:is(:hover,:focus-visible){background:#dbeaff;color:var(--text)}
 html[data-color-theme="light"] .design-ui .topic-discovery .topic-bubble span{color:var(--mint)}
 html[data-color-theme="light"] #learningLayout :is(.section-label,.folder .icon,.card .icon,.area-simulators .area-symbol,.area-games .area-symbol,.practice-kind){color:var(--purple)}
 html[data-color-theme="light"] #learningLayout :is(.folder-open,.area-symbol,.area-bottom b,.topic-progress a,#simHelp h3,#gameHelp h3){color:var(--mint)}
 html[data-color-theme="light"] :is(#simHelp p,#gameHelp p,summary,.footer-brand,footer,.site-footer){color:var(--muted)}
 html[data-color-theme="light"] :is(.guide-panel,dialog,.start-grid>a){background:#fff;border-color:var(--border);color:var(--text)}
 html[data-color-theme="light"] :is(.guide-panel,.start-grid>a) :is(p,span,small){color:var(--muted)}
 html[data-color-theme="light"] :is(input,select,textarea){background:#fff;border-color:var(--border);color:var(--text)}
 html[data-color-theme="light"] input::placeholder{color:var(--muted)}
 html[data-color-theme="light"] :is(.tools button:not(.theme-toggle),.link,button[type="submit"]){background:#d9f0ed;color:#123c38}
 html[data-color-theme="light"] :is(.secondary,.tools button:not(.theme-toggle):hover){background:#e3efff;color:var(--text);border-color:var(--border)}
 html[data-color-theme="light"] .reading-view :is(.eyebrow,.return-origin,.prose h2,.lesson-next a){color:var(--mint)}
 html[data-color-theme="light"] .reading-view :is(.prose,.prose pre,.meta,.tools button,.lesson-practice p){color:var(--text)}
 html[data-color-theme="light"] .reading-view .prose :is(bdi,.syntax-blue){color:#174e86}
 html[data-color-theme="light"] .reading-view .practice-kind,html[data-color-theme="light"] :is(.activity-view .crumbs .category,.presentation-view .heading small){color:var(--purple)}
 html[data-color-theme="light"] .reading-view .lesson-figure img,html[data-color-theme="light"] .reading-view .scan-fragment img{filter:none;mix-blend-mode:normal}
 html[data-color-theme="light"] .reading-view :is(.table-scroll tr:nth-child(even),.table-scroll tr:first-child,.toc a,.server-layers>div){background:#e3efff}
 html[data-color-theme="light"] :is(.reading-view .float-download,.activity-view .button.download,.presentation-view .download){background:#e9dcff;border-color:#ac8ed6;color:#3b2062}
}
