.tutorials-page{--learn-ink:#f5f8ff;--learn-muted:#9baac2;--learn-line:rgba(166,193,232,.15);--learn-blue:#2772ff;--learn-cyan:#4bd6ff;--learn-panel:#0c1830;background:#071329;color:var(--learn-ink);overflow-x:hidden}.tutorials-nav-wrap{position:absolute;background:rgba(5,15,34,.78);backdrop-filter:blur(16px);z-index:20}.tutorials-page .nav{height:84px}.tutorials-page .nav-links a[aria-current=page]{color:#59d8ff;opacity:1}.tutorials-page :focus-visible{outline:2px solid var(--learn-cyan);outline-offset:4px}.tutorials-page button,.tutorials-page a{-webkit-tap-highlight-color:transparent}.learn-hero{position:relative;overflow:hidden;padding:144px 0 28px;background:radial-gradient(ellipse at 77% 40%,rgba(34,97,196,.19),transparent 38%),linear-gradient(120deg,#071329,#0b1934 63%,#08142a)}.learn-hero:before{position:absolute;inset:0;content:"";pointer-events:none;background-image:linear-gradient(rgba(146,177,225,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(146,177,225,.035) 1px,transparent 1px);background-size:62px 62px;mask-image:linear-gradient(90deg,transparent,#000)}.learn-hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;min-height:425px;gap:35px}.learn-kicker{display:flex;align-items:center;gap:9px;color:#96a9c5;font-size:9px;font-weight:800;letter-spacing:1.8px}.learn-kicker i,.live-dot{width:7px;height:7px;border-radius:50%;background:#43d3ff;box-shadow:0 0 0 5px rgba(67,211,255,.1)}.learn-hero h1{font-size:clamp(62px,7vw,92px);letter-spacing:-5px;line-height:.91;margin:25px 0 20px}.learn-hero h1 em,.learn-cta h2 em{font-style:normal;background:linear-gradient(90deg,#f4fbff,#54d8ff 65%,#5c8bff);background-clip:text;color:transparent}.learn-lead{max-width:535px;color:#b2bfd2;font-size:15px;line-height:1.8}.learn-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:27px}.learn-button{display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:14px 18px;min-height:46px;border:1px solid transparent;border-radius:3px;font-size:11px;font-weight:700;transition:transform .2s,border-color .2s,background .2s;color:#fff;cursor:pointer}.learn-button:hover{transform:translateY(-2px)}.learn-button.primary{background:linear-gradient(105deg,#2264ea,#218cca);box-shadow:0 8px 28px rgba(23,101,235,.16)}.learn-button.secondary{border-color:rgba(180,207,246,.24);background:rgba(255,255,255,.025)}.learn-button span{font-size:16px}.learn-note{margin-top:18px;color:#8091ac;font-size:9px}.learn-hero-bottom{display:flex;justify-content:space-between;border-top:1px solid var(--learn-line);padding-top:15px;color:#8092ad;font-size:8px;letter-spacing:1.3px}.learning-orbit{position:relative;width:min(100%,440px);aspect-ratio:1;margin:auto;display:grid;place-items:center}.orbit-ring{position:absolute;inset:9%;border:1px solid rgba(63,163,255,.23);border-radius:50%;box-shadow:0 0 75px rgba(42,105,222,.12),inset 0 0 60px rgba(42,105,222,.08);animation:orbit-breathe 7s ease-in-out infinite}.orbit-ring:before,.orbit-ring:after{content:"";position:absolute;inset:13%;border:1px solid rgba(63,163,255,.18);border-radius:50%;transform:rotateX(68deg)}.orbit-ring:after{transform:rotateY(68deg)}.orbit-core{width:115px;height:115px;border:1px solid rgba(83,199,255,.55);border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 40% 30%,#143d74,#09162c 72%);box-shadow:0 0 44px rgba(46,148,255,.2);font-weight:800;font-size:32px;z-index:2}.orbit-core small{font-size:6px;letter-spacing:1.3px;color:#9bacc4}.orbit-node{position:absolute;padding:10px 12px;border:1px solid rgba(121,160,214,.22);background:rgba(8,22,44,.9);font-size:9px;color:#c4d0e1;box-shadow:0 8px 24px #061024;animation:node-float 5s ease-in-out infinite}.orbit-node:before{content:"";display:inline-block;width:5px;height:5px;margin-right:7px;border-radius:50%;background:#4ccfff}.orbit-node.n1{top:10%;left:40%}.orbit-node.n2{top:27%;right:1%;animation-delay:.4s}.orbit-node.n3{right:4%;bottom:27%;animation-delay:.8s}.orbit-node.n4{bottom:11%;left:43%;animation-delay:1.2s}.orbit-node.n5{left:3%;bottom:28%;animation-delay:1.6s}.orbit-node.n6{top:27%;left:2%;animation-delay:2s}@keyframes node-float{50%{transform:translateY(-5px)}}@keyframes orbit-breathe{50%{transform:scale(1.025);opacity:.8}}.learn-dashboard{padding:48px 0 51px;background:#0a172c;border-block:1px solid rgba(166,193,232,.08)}.learn-section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:28px}.learn-section-head h2,.interview-layout h2{font-size:clamp(32px,4vw,45px);line-height:1.05;letter-spacing:-1.8px;margin-top:12px}.learn-section-head>p,.interview-layout>div>p:not(.learn-kicker){max-width:420px;color:var(--learn-muted);font-size:12px;line-height:1.8}.learn-inline-link{color:#70d5ff;font-size:11px;font-weight:700}.learn-inline-link span{font-size:15px;margin-left:6px}.journey-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:11px}.journey-card{position:relative;min-height:125px;padding:19px;border:1px solid var(--learn-line);background:linear-gradient(145deg,rgba(21,40,72,.8),rgba(11,25,48,.8))}.journey-card>strong{display:block;margin:12px 0 5px;font-size:28px}.journey-card>span:last-child{color:#a4b2c8;font-size:10px}.journey-label{color:#8da0bc;font-size:8px;letter-spacing:1.2px}.journey-progress>strong{font-size:24px}.progress-track{height:3px;background:#243750}.progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,#3276ff,#4ad9ff);transition:width .4s}.journey-progress p{margin-top:10px;color:#93a2b9;font-size:9px}.journey-icon{position:absolute;top:17px;right:17px;color:#56cfff;font-size:8px}.my-learning-row{display:flex;justify-content:space-between;align-items:center;margin-top:16px;color:#8e9fb7;font-size:9px}.my-learning-row>div{display:flex;align-items:center;gap:9px}.live-dot{width:6px;height:6px;box-shadow:none}.text-button{border:0;background:none;color:#64ceff;font:inherit;cursor:pointer}.text-button span{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;border:1px solid var(--learn-line);border-radius:50%}.learn-section{padding:86px 0}.technologies-section{background:#071329}.tech-toolbar{display:grid;grid-template-columns:minmax(220px,.8fr) 2fr;gap:16px;align-items:start}.learn-search{height:44px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--learn-line);background:rgba(255,255,255,.025)}.learn-search>span{color:#55caff;font-size:23px;transform:rotate(-20deg)}.learn-search input{width:100%;border:0;outline:0;background:transparent;color:#f4f7fc;font:inherit;font-size:11px}.learn-search input::placeholder{color:#8292aa}.category-tabs{display:flex;gap:6px;flex-wrap:wrap}.category-tab,.popular-row button{padding:9px 11px;border:1px solid var(--learn-line);background:transparent;color:#aab8cd;font:inherit;font-size:8px;cursor:pointer;transition:.2s}.category-tab:hover,.category-tab.active,.popular-row button:hover{color:white;border-color:#3185ec;background:rgba(40,114,227,.16)}.popular-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:14px 0 20px}.popular-row>span{margin-right:5px;color:#7d8ea8;font-size:8px;letter-spacing:1.1px}.popular-row button{padding:6px 9px;font-size:8px}.tech-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.tech-card{position:relative;display:flex;min-height:153px;flex-direction:column;align-items:flex-start;padding:16px;border:1px solid var(--learn-line);background:linear-gradient(150deg,rgba(16,33,61,.85),rgba(9,23,44,.85));color:#fff;text-align:left;cursor:pointer;transition:transform .2s,border-color .2s,box-shadow .2s}.tech-card:hover{transform:translateY(-3px);border-color:rgba(66,194,255,.55);box-shadow:0 14px 35px rgba(0,0,0,.18)}.tech-icon{display:grid;place-items:center;width:29px;height:29px;border:1px solid rgba(66,191,255,.35);background:rgba(53,129,229,.11);color:#68d7ff;font-size:8px;font-weight:800}.tech-category{position:absolute;right:12px;top:19px;color:#798ca8;font-size:7px}.tech-card>strong{margin-top:13px;font-size:15px}.tech-range{display:flex;align-items:center;gap:6px;margin-top:7px;color:#9cacc2;font-size:8px}.tech-range i{width:23px;height:1px;background:#42bce9}.tech-card-foot{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:auto;padding-top:12px;color:#7e91ad;font-size:8px}.tech-card-foot b{color:#5dd2ff;font-size:13px}.learn-more-button{display:block;margin:22px auto 0;padding:11px 16px;border:1px solid var(--learn-line);background:transparent;color:#9bb0cf;font:inherit;font-size:9px;cursor:pointer}.learn-more-button:hover{border-color:#48caff;color:white}.learn-more-button[hidden]{display:none}.recommendation-panel{display:flex;align-items:center;gap:24px;padding:17px;margin-top:22px;border:1px solid rgba(72,194,255,.22);background:rgba(19,49,86,.35)}.recommendation-panel h3{margin-top:6px;font-size:15px}.recommendation-panel #recommendation-list{display:flex;gap:7px;flex-wrap:wrap}.recommendation-panel button,.detail-related button{padding:8px 10px;border:1px solid var(--learn-line);background:rgba(255,255,255,.03);color:#c6d3e5;font:inherit;font-size:8px;cursor:pointer}.recommendation-panel button:hover,.detail-related button:hover{border-color:#4bd6ff}.paths-section{background:#0b192d;border-block:1px solid rgba(166,193,232,.07)}.path-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:25px 0 11px}.path-tab{display:flex;align-items:center;gap:10px;min-height:45px;padding:10px;border:1px solid var(--learn-line);background:rgba(255,255,255,.02);color:#a9b8ce;text-align:left;font:inherit;font-size:9px;cursor:pointer}.path-tab>span{color:#56cfff;font-size:8px}.path-tab:hover,.path-tab.active{border-color:rgba(78,180,250,.48);background:rgba(34,98,170,.15);color:#fff}.path-detail{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;padding:28px;border:1px solid var(--learn-line);background:linear-gradient(125deg,#10213a,#0b182d)}.path-number{color:#55caff;font-size:8px;letter-spacing:1.5px}.path-overview h3{margin:16px 0 8px;font-size:26px;letter-spacing:-.7px}.path-overview>p{max-width:350px;color:#a7b5c9;font-size:11px;line-height:1.7}.path-stats{display:flex;gap:6px;flex-wrap:wrap;margin:17px 0}.path-stats span{padding:7px 9px;border:1px solid var(--learn-line);color:#a6b5ca;font-size:8px}.path-start{margin-top:3px}.path-curriculum ol{display:grid;grid-template-columns:repeat(2,1fr);gap:0 15px;margin:13px 0 0;padding:0;list-style:none}.path-curriculum li{position:relative;display:flex;align-items:center;gap:10px;min-height:34px;border-bottom:1px solid rgba(166,193,232,.09)}.path-curriculum li>span{color:#64c9fa;font-size:8px}.path-curriculum li>b{font-size:9px;font-weight:500;color:#d2dbea}.path-curriculum li.skill-done>b{text-decoration:line-through;color:#7b8eaa}.library-section{background:#071329}.library-toolbar{display:grid;grid-template-columns:minmax(250px,1fr) repeat(3,minmax(120px,.32fr));gap:8px}.select-filter{display:flex;flex-direction:column;gap:4px;padding:6px 9px;border:1px solid var(--learn-line);background:rgba(255,255,255,.025)}.select-filter span{color:#8293ab;font-size:7px}.select-filter select{width:100%;border:0;background:#0a1930;color:#d4deeb;font:inherit;font-size:9px}.library-meta{display:flex;justify-content:space-between;align-items:center;margin:16px 0 11px;color:#90a1b8;font-size:9px}.tutorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.lesson-card{display:flex;min-height:220px;flex-direction:column;padding:16px;border:1px solid var(--learn-line);background:linear-gradient(150deg,#0e1f39,#0a172b);transition:transform .2s,border-color .2s}.lesson-card:hover{transform:translateY(-3px);border-color:rgba(78,180,250,.5)}.lesson-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;color:#61caff;font-size:8px}.source-tag{padding:5px 7px;border:1px solid rgba(160,184,217,.18);color:#91a1b8;font-size:7px}.original-tag{border-color:rgba(75,211,255,.28);color:#60d2ff}.lesson-card h3{margin-top:15px;font-size:14px;line-height:1.4}.lesson-card>p{margin-top:8px;color:#9baac0;font-size:9px;line-height:1.7}.lesson-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.lesson-meta span{padding:5px 7px;background:rgba(255,255,255,.045);color:#99abc4;font-size:7px}.lesson-card-bottom{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:13px}.lesson-open{border:0;background:transparent;color:#68d2ff;font:inherit;font-size:9px;font-weight:700;cursor:pointer}.save-button{padding:6px 8px;border:1px solid var(--learn-line);background:transparent;color:#a8b7cc;font:inherit;font-size:8px;cursor:pointer}.save-button.saved{color:#67d3ff;border-color:rgba(73,196,255,.4)}.completed-mark{margin-left:auto;color:#70dda9;font-size:8px}.empty-state{grid-column:1/-1;padding:30px;border:1px solid var(--learn-line);color:#9daec3;text-align:center;font-size:11px}.build-section{background:#0b192d}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.project-card{min-height:170px;padding:17px;border:1px solid var(--learn-line);background:linear-gradient(150deg,#10213b,#0b182c)}.project-level{color:#57ceff;font-size:7px;letter-spacing:1.2px}.project-card h3{margin:13px 0 7px;font-size:14px}.project-card p{min-height:37px;color:#a0aec1;font-size:9px;line-height:1.65}.project-tags{margin-top:12px;color:#70bfff;font-size:8px}.project-time{display:block;margin-top:8px;color:#778ba6;font-size:8px}.interview-section{background:#071329}.interview-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px}.interview-layout>div>p:not(.learn-kicker){margin:17px 0}.interview-layout .learn-inline-link{display:inline-block;margin-top:8px}.interview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.interview-grid a{display:flex;align-items:center;gap:8px;min-height:47px;padding:10px;border:1px solid var(--learn-line);background:rgba(255,255,255,.02);color:#d5dfed}.interview-grid a:hover{border-color:#48caff}.interview-grid a span{color:#60ccff;font-size:7px}.interview-grid a strong{font-size:8px;font-weight:500}.interview-grid a b{margin-left:auto;color:#5acaff}.learn-cta{padding:67px 0;background:radial-gradient(ellipse at 85% 30%,rgba(78,75,235,.2),transparent 37%),linear-gradient(105deg,#10264b,#0c1a33);border-top:1px solid var(--learn-line)}.learn-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.learn-cta h2{font-size:clamp(35px,5vw,55px);line-height:1.02;letter-spacing:-2.5px;margin:14px 0}.learn-cta-inner>div>p:last-child{color:#a4b4ca;font-size:11px}.learn-cta-inner>div:last-child{display:flex;flex-direction:column;gap:8px;min-width:200px}.tutorial-detail-overlay[hidden]{display:none}.tutorial-detail-overlay{position:fixed;z-index:60;inset:0;display:grid;place-items:center;padding:20px}.detail-backdrop{position:absolute;inset:0;background:rgba(1,7,17,.78);backdrop-filter:blur(8px)}.detail-dialog{position:relative;max-height:min(88vh,850px);width:min(700px,100%);overflow:auto;padding:32px;border:1px solid rgba(110,173,231,.3);background:#0d1c33;box-shadow:0 25px 100px rgba(0,0,0,.45)}.detail-close{position:absolute;top:13px;right:14px;width:34px;height:34px;border:1px solid var(--learn-line);background:transparent;color:#fff;font-size:22px;cursor:pointer}.detail-dialog h2{max-width:560px;margin:16px 40px 12px 0;font-size:32px;line-height:1.1;letter-spacing:-1px}.detail-meta{display:flex;gap:7px;flex-wrap:wrap}.detail-meta span{padding:6px 8px;background:rgba(255,255,255,.05);color:#99abc3;font-size:8px}.detail-guide{margin-top:24px;color:#afbdd0;font-size:11px;line-height:1.8}.detail-guide h3,.community-resource h3,.detail-related h3{margin:18px 0 6px;color:#f3f6fb;font-size:13px}.detail-guide ol,.detail-guide ul{padding-left:19px}.detail-guide li{padding:3px 0}.practice-prompt{margin-top:18px;padding:15px;border:1px solid rgba(82,198,255,.18);background:rgba(44,123,184,.08)}.practice-prompt b{color:#6bd3ff}.community-resource{display:flex;gap:16px;margin-top:25px;padding:18px;border:1px solid var(--learn-line);background:rgba(255,255,255,.025)}.community-mark{display:grid;place-items:center;flex:0 0 39px;height:39px;background:#ed3344;font-size:11px;font-weight:800}.community-resource h3{margin-top:0}.community-resource p{margin:8px 0;color:#a4b4ca;font-size:10px;line-height:1.7}.community-resource .learn-button{margin-top:7px}.detail-related{margin-top:18px}.detail-related>button{margin:2px}.detail-actions{display:flex;gap:8px;margin-top:22px;padding-top:17px;border-top:1px solid var(--learn-line)}body.detail-open{overflow:hidden}.tutorials-page footer{background:#081326}@media(max-width:1000px){.learn-hero-grid{grid-template-columns:1fr .8fr}.learn-hero h1{font-size:72px}.tech-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.journey-grid{grid-template-columns:repeat(3,1fr)}.journey-progress{grid-column:span 3}.tutorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.library-toolbar{grid-template-columns:1fr 1fr}.library-search{grid-column:1/-1}}@media(max-width:760px){.tutorials-page .nav{height:70px}.learn-hero{padding-top:112px}.learn-hero-grid{grid-template-columns:1fr;gap:0}.learn-hero-copy{position:relative;z-index:2}.learn-hero h1{font-size:68px}.learning-orbit{width:min(88vw,360px);margin:-10px auto -4px}.learn-hero-bottom{font-size:7px}.learn-section{padding:65px 0}.learn-section-head{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:22px}.learn-section-head>p{max-width:600px}.tech-toolbar{grid-template-columns:1fr}.category-tabs{flex-wrap:nowrap;overflow:auto;padding:2px 1px 8px}.category-tab{white-space:nowrap}.path-tabs{grid-template-columns:repeat(2,1fr)}.path-detail{grid-template-columns:1fr;gap:28px;padding:21px}.interview-layout{grid-template-columns:1fr;gap:25px}.learn-cta-inner{align-items:flex-start;flex-direction:column}.learn-cta-inner>div:last-child{width:100%;flex-direction:row;flex-wrap:wrap}.learn-cta-inner .learn-button{flex:1}.recommendation-panel{align-items:flex-start;flex-direction:column;gap:12px}}@media(max-width:560px){.learn-hero{padding-bottom:22px}.learn-hero h1{font-size:57px;letter-spacing:-3px}.learn-lead{font-size:13px}.learn-actions{align-items:stretch;flex-direction:column}.learn-actions .learn-button{justify-content:space-between}.learning-orbit{width:min(100%,320px)}.orbit-node{padding:8px;font-size:7px}.orbit-core{width:93px;height:93px;font-size:27px}.learn-hero-bottom span{font-size:6px;letter-spacing:.3px}.learn-dashboard{padding:38px 0}.learn-section-head h2,.interview-layout h2{font-size:34px}.journey-grid{grid-template-columns:repeat(2,1fr)}.journey-progress{grid-column:span 2}.journey-card{min-height:107px;padding:14px}.journey-card>strong{font-size:24px}.my-learning-row{align-items:flex-start;gap:10px;flex-direction:column}.tech-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.tech-card{min-height:140px;padding:12px}.tech-card>strong{font-size:13px}.tech-category{font-size:6px}.path-tabs{grid-template-columns:1fr 1fr;gap:5px}.path-tab{font-size:8px;padding:8px;min-height:48px}.path-curriculum ol{grid-template-columns:1fr}.library-toolbar{grid-template-columns:1fr 1fr}.library-search{grid-column:1/-1}.select-filter select{font-size:8px}.tutorial-grid,.project-grid{grid-template-columns:1fr}.lesson-card{min-height:190px}.project-card{min-height:150px}.interview-grid{grid-template-columns:repeat(2,1fr)}.interview-grid a{padding:8px;gap:5px}.interview-grid a strong{font-size:7px}.learn-cta-inner>div:last-child{flex-direction:column}.detail-dialog{padding:25px 18px}.detail-dialog h2{font-size:26px}.detail-actions{flex-wrap:wrap}.detail-actions .learn-button{flex:1}.community-resource{padding:13px;gap:10px}}@media(prefers-reduced-motion:reduce){.tutorials-page *, .tutorials-page *:before,.tutorials-page *:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.tech-progress{width:100%;height:2px;margin-top:8px;background:#253650}.tech-progress i{display:block;height:100%;background:linear-gradient(90deg,#3276ff,#4ad9ff)}.tech-progress-label{margin-top:4px;color:#91a5c2;font-size:7px}.project-complete{margin-top:12px;padding:7px 9px;border:1px solid var(--learn-line);background:transparent;color:#a8b8cd;text-align:left;font:inherit;font-size:8px;cursor:pointer}.project-complete:hover,.project-complete.is-complete{border-color:rgba(75,211,255,.4);color:#6ed5ff}
