@import url('/static/components.css');
:root{--violet:#6d28d9;--purple:#5420a9;--ink:#172033;--muted:#677084;--line:#e8e6ee;--paper:#faf9f6;--lavender:#ede9fe;--lime:#d9f66f;--white:#fff;--radius:20px;font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{ -webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9b73ee;outline-offset:4px}h1,h2,h3,h4,.display{font-family:'Plus Jakarta Sans',Inter,sans-serif;letter-spacing:-.04em;margin:0;font-weight:700}h1{font-size:42px;line-height:1.18}h2{font-size:28px;line-height:1.3}h3{font-size:20px;line-height:1.4}p{line-height:1.7;margin:12px 0;color:var(--muted)}small,.small{font-size:13px;line-height:1.6}.muted{color:var(--muted)}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:700;color:var(--violet);margin-bottom:14px;display:block}.icon{width:22px;height:22px;flex:none;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.btn{border:1px solid transparent;border-radius:10px;padding:13px 21px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:600;font-size:14px;line-height:1.3;background:var(--violet);color:white;transition:background .2s,transform .2s}.btn:hover{background:var(--purple);transform:translateY(-1px)}.btn.secondary{background:white;border-color:var(--line);color:var(--ink)}.btn.secondary:hover{background:var(--lavender)}.btn.lime{background:var(--lime);color:var(--ink)}.btn.ghost{background:transparent;color:var(--ink);padding:11px}.btn.danger{background:#fff0ef;color:#ac2727}.btn.small{padding:9px 13px;font-size:12px}.btn.wide{width:100%}.text-link{color:var(--violet);font-weight:600;display:inline-flex;align-items:center;gap:8px;font-size:14px}.row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.between{justify-content:space-between}.stack{display:grid;gap:18px}.section{margin-top:36px}.panel{padding:28px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.pill{display:inline-flex;align-items:center;gap:7px;border-radius:100px;padding:6px 11px;background:var(--lavender);color:var(--purple);font-size:11px;font-weight:700;letter-spacing:.03em}.pill.green{background:#ecf6d4;color:#3d5814}.pill.gray{background:#f2f3f6;color:var(--muted)}.logo{width:182px;height:68px;object-fit:contain;display:block}.brand{display:inline-flex;align-items:center}.topnav{max-width:1280px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px 38px;border-bottom:1px solid var(--line)}.topnav nav{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:500}.landing{overflow:hidden}.hero{max-width:1280px;margin:auto;padding:74px 38px 84px;display:grid;grid-template-columns:1.05fr 1fr;gap:58px;align-items:center}.hero h1{font-size:clamp(44px,4.7vw,68px);line-height:1.08;letter-spacing:-.065em;max-width:620px}.hero h1 em{font-style:normal;color:var(--violet)}.hero .intro{max-width:440px;font-size:16px;margin:24px 0 30px}.hero .eyebrow{display:flex;gap:10px;align-items:center}.dot{width:7px;height:7px;background:var(--violet);border-radius:50%;display:inline-block}.hero-foot{font-size:12px;margin-top:23px;display:flex;gap:17px;align-items:center;color:var(--muted)}.hero-art{min-height:450px;position:relative;background:#eee9f8;border-radius:44% 44% 22% 30%;display:flex;align-items:center;justify-content:center}.hero-orbit{position:absolute;width:390px;height:390px;border:1px solid #d3c6ee;border-radius:50%;transform:rotate(-24deg) scaleX(1.18)}.hero-orbit.second{transform:rotate(40deg) scaleX(1.14);width:300px;height:300px}.passport-visual{width:260px;height:330px;position:relative;transform:rotate(-9deg);background:#6d28d9;border-radius:14px 24px 24px 14px;color:#fff;padding:30px;border-left:7px solid #5320a8;box-shadow:12px 20px 0 #d1c2e7}.passport-visual .eyebrow{color:#d9c5fc;font-size:9px;margin-bottom:24px}.passport-visual h2{font-size:31px;line-height:1.1}.passport-globe{width:100px;height:100px;margin:20px auto 17px;display:block;stroke:#c3a4f6;stroke-width:1;fill:none}.passport-visual .fine{font-size:10px;letter-spacing:.18em;color:#d9c5fc}.float-card{position:absolute;padding:16px 20px;background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:0 8px 25px #4021780a;display:flex;align-items:center;gap:12px;font-size:12px}.float-card b{display:block;font-size:13px;margin-bottom:3px}.float-card .circle{width:37px;height:37px;background:var(--lime);border-radius:50%;display:grid;place-items:center;color:#405518}.float-card.one{right:-6px;top:44px;transform:rotate(5deg)}.float-card.two{left:-28px;bottom:44px;transform:rotate(-4deg)}.art-note{position:absolute;bottom:-22px;right:12px;font-size:10px;color:var(--muted)}.spark{position:absolute;right:22px;bottom:70px;font-size:70px;color:var(--violet)}.topic-strip{background:var(--ink);color:white;display:flex;align-items:center;justify-content:center;gap:38px;flex-wrap:wrap;padding:23px 28px;font-size:12px;font-weight:500}.topic-strip span{display:flex;align-items:center;gap:10px}.topic-strip .icon{color:var(--lime);width:18px}.landing-section{max-width:1280px;margin:auto;padding:74px 38px}.landing-section .section-heading{margin-bottom:34px;max-width:650px}.feature-number{font-size:12px;color:var(--violet);font-weight:600;margin-bottom:24px}.feature{border-top:1px solid #d7d2de;padding-top:22px}.feature h3{font-size:22px;margin-bottom:12px}.feature p{font-size:14px;max-width:300px}.growth-banner{background:#eee9f8;border:0;padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.growth-banner h2{font-size:36px}.mini-path{display:grid;gap:14px}.mini-path div{display:flex;align-items:center;gap:14px;background:white;border-radius:13px;padding:17px 20px;font-size:14px}.mini-path .icon{color:var(--violet)}footer{max-width:1280px;margin:20px auto 0;padding:26px 38px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}footer nav{display:flex;gap:20px}.app-shell{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{background:white;border-right:1px solid var(--line);padding:16px 22px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.sidebar .logo{width:179px}.nav-caption{font-size:10px;letter-spacing:.12em;color:#9692a4;margin:30px 12px 12px;font-weight:600}.sidebar nav{display:grid;gap:5px}.nav-item{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:10px;font-size:13px;color:#677084;font-weight:500}.nav-item.active{background:#f0eafb;color:var(--violet);font-weight:600}.nav-item:hover{background:#f6f3fa}.side-bottom{margin-top:auto;padding-top:25px}.side-note{padding:20px 16px;border-radius:14px;background:#f7f5fc;font-size:12px;color:var(--muted);line-height:1.7}.side-note b{display:block;color:var(--ink);margin-bottom:5px}.app-right{min-width:0}.app-top{height:83px;background:#fff;border-bottom:1px solid var(--line);padding:0 42px;display:flex;align-items:center;justify-content:space-between;gap:20px}.crumb{font-size:12px;color:var(--muted)}.account-chip{display:flex;align-items:center;gap:11px;font-size:12px}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e8ddfa;color:var(--violet);font-weight:700}.app-main{max-width:1320px;margin:auto;padding:36px 42px 60px}.page-heading{margin-bottom:28px}.page-heading h1{font-size:32px}.page-heading p{font-size:14px;margin-bottom:0}.welcome{background:var(--violet);border:0;color:white;padding:32px 36px;position:relative;overflow:hidden}.welcome h2{max-width:500px;font-size:31px}.welcome p{color:#ded0f7;max-width:440px;font-size:14px}.welcome .btn{margin-top:12px}.welcome:after{content:'✳';position:absolute;right:45px;top:15px;font-size:170px;line-height:1;color:#9560e8;transform:rotate(12deg)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}.stat{padding:22px;background:white;border:1px solid var(--line);border-radius:14px}.stat-top{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px}.stat-top .icon{color:var(--violet);width:18px}.stat strong{font-family:'Plus Jakarta Sans',sans-serif;font-size:30px;display:block;margin-top:14px}.stat small{font-size:11px;color:var(--muted)}.section-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.section-title h2{font-size:20px}.empty{padding:40px 25px;text-align:center;border:1px dashed #dcd5e8;border-radius:16px;background:#fff}.empty .icon{height:35px;width:35px;color:#9a7cbf;margin-bottom:12px}.empty h3{font-size:18px}.empty p{font-size:13px;max-width:400px;margin:10px auto 20px}.empty.compact{padding:28px 20px}.empty.compact p{margin-bottom:0}.badge-list{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.badge{padding:24px 12px;text-align:center;border:1px solid var(--line);border-radius:16px;background:white}.badge .medal{width:64px;height:64px;border-radius:23px;background:#f0ecf7;color:#aaa0bb;display:grid;place-items:center;margin:0 auto 16px;transform:rotate(8deg)}.badge .medal .icon{height:30px;width:30px;transform:rotate(-8deg)}.badge.earned .medal{background:var(--lime);color:var(--purple)}.badge b{display:block;font-size:13px;margin:5px}.badge small{font-size:11px;color:var(--muted)}.course-card{overflow:hidden;background:white;border:1px solid var(--line);border-radius:18px;display:flex;flex-direction:column}.course-art{height:130px;background:var(--lavender);position:relative;padding:21px;display:flex;align-items:flex-start;justify-content:space-between}.course-art>.icon{height:65px;width:65px;position:absolute;right:28px;bottom:19px;stroke-width:1.2;color:var(--violet);transform:rotate(-10deg)}.course-card:nth-child(3n+2) .course-art{background:#eef4d9}.course-card:nth-child(3n+3) .course-art{background:#fbe9db}.course-content{padding:22px;display:flex;flex-direction:column;gap:12px;flex:1}.course-content h3{font-size:19px}.course-content p{font-size:13px;margin:0}.course-meta{display:flex;gap:14px;font-size:11px;color:var(--muted);align-items:center}.course-meta .icon{width:14px;height:14px}.course-content .btn{margin-top:auto}.filters{display:flex;gap:13px;margin-bottom:25px}.filters input{flex:1}.filters select{width:220px}.progress{width:100%;height:6px;accent-color:var(--violet);border:0;border-radius:6px;overflow:hidden}.progress::-webkit-progress-bar{background:#eee9f7}.progress::-webkit-progress-value{background:var(--violet)}.progress::-moz-progress-bar{background:var(--violet)}.passport-card{background:var(--ink);color:white;padding:34px;border-radius:20px;position:relative;overflow:hidden}.passport-card p{color:#bbbfd0}.passport-card .eyebrow{color:var(--lime)}.passport-card .passport-globe{position:absolute;right:-10px;bottom:-40px;width:220px;height:220px;opacity:.3}.passport-card .name{font-size:26px;margin:25px 0 35px}.passport-card .row{position:relative;z-index:1}.passport-card strong{display:block;font-size:25px;margin-bottom:5px}.passport-card small{color:#bbbfd0}.note{padding:15px 18px;background:#f0ecf8;border-radius:10px;color:#635477;font-size:12px;line-height:1.7}.note.success{background:#eff7e3;color:#42611d}.certificate{display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid var(--line);padding:20px 0}.certificate:last-child{border:0}.certificate h3{font-size:16px}.skill-row{padding:18px 0;border-bottom:1px solid var(--line)}.skill-row:last-child{border:0}.skill-row b{font-size:14px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;color:var(--muted);font-weight:500;font-size:11px;padding:14px 16px;border-bottom:1px solid var(--line)}td{padding:18px 16px;border-bottom:1px solid var(--line)}tr:last-child td{border:0}.rank{font-weight:700;color:var(--violet)}tr.you{background:#f5f0fd}.gift-art{height:130px;border-radius:14px;background:#f2eefb;display:grid;place-items:center;margin-bottom:20px}.gift-art .icon{width:58px;height:58px;color:var(--violet);stroke-width:1.2}.gift-card{display:flex;flex-direction:column}.gift-card p{font-size:13px;flex:1}.gift-card .btn{margin-top:20px}.wallet{background:var(--lime);border:0;padding:28px 32px;margin-bottom:30px}.wallet h2{font-size:34px}.wallet p{color:#5b663c;font-size:13px}.lesson-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:24px}.lesson-nav{align-self:start;padding:20px;background:white;border:1px solid var(--line);border-radius:16px}.lesson-nav a{display:flex;gap:10px;padding:13px 10px;font-size:12px;line-height:1.6;border-radius:8px}.lesson-nav a.selected{background:var(--lavender);color:var(--violet)}.lesson-nav .icon{width:18px;height:18px;margin-top:2px}.lesson-body{padding:35px;min-height:400px}.lesson-copy{white-space:pre-wrap;line-height:1.9;font-size:15px;margin:25px 0 35px;overflow-wrap:anywhere}.lesson-body iframe,.lesson-body video{width:100%;aspect-ratio:16/9;border:0;border-radius:12px;margin:24px 0}.question{border:0;margin:0 0 25px;padding:0}.question legend{font-weight:600;font-size:15px;margin-bottom:13px}.answer-option{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:13px;margin:8px 0;font-size:14px}.answer-option input{width:auto}.tabbar{display:flex;gap:8px;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:24px;overflow:auto}.tabbar a{padding:10px 18px;border-radius:9px;font-size:13px;white-space:nowrap}.tabbar a.active{background:var(--violet);color:#fff}.admin-row{padding:20px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px}.admin-row h3{font-size:17px}.editor-block{padding:22px;background:#f7f5fb;border:1px solid var(--line);border-radius:14px;margin:15px 0}.auth-wrap{max-width:1100px;margin:48px auto 70px;display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:0 38px}.auth-aside{padding:40px 20px 30px 0;display:flex;flex-direction:column;justify-content:center}.auth-aside h1{font-size:48px;line-height:1.15}.auth-aside h1 em{color:var(--violet);font-style:normal}.auth-form{padding:32px}.auth-form h2{margin-bottom:8px}.auth-form form{margin-top:24px}.field{display:grid;gap:7px;margin-bottom:18px}.field label{font-size:12px;font-weight:600}.field input,.field textarea,.field select,input.search,select{width:100%;border:1px solid #dcd9e4;background:#fff;border-radius:9px;padding:12px 13px;color:var(--ink);font-size:14px;line-height:1.5}.field textarea{resize:vertical;min-height:100px}.field input::placeholder,.field textarea::placeholder{color:#a09aa9}.field small{font-size:11px;color:var(--muted)}.check{display:flex;align-items:flex-start;gap:9px;font-size:12px;line-height:1.7;margin:16px 0}.check input{margin-top:4px;accent-color:var(--violet)}.form-error{color:#a52626;font-size:13px;line-height:1.6;margin:12px 0}.form-error:empty{display:none}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:22px}.auth-footer{text-align:center;font-size:12px;margin-top:20px}.auth-footer a{color:var(--violet);font-weight:600}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.span2{grid-column:span 2}.recovery-code{overflow-wrap:anywhere;background:var(--lavender);padding:18px;border-radius:10px;font-family:monospace;user-select:all;font-size:17px}.settings{max-width:650px}.loading{padding:90px;text-align:center;color:var(--muted)}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:100;max-width:90vw;background:var(--ink);color:#fff;padding:14px 24px;border-radius:12px;font-size:13px;box-shadow:0 10px 30px #17203322;display:none}#toast.show{display:block}dialog{border:0;border-radius:22px;padding:30px;max-width:650px;width:calc(100% - 32px);max-height:90vh;box-shadow:0 20px 100px #17203333}dialog::backdrop{background:#17203377;backdrop-filter:blur(3px)}dialog .close{float:right}.skip{position:fixed;top:-60px;left:20px;background:white;color:var(--violet);padding:12px;z-index:150}.skip:focus{top:12px}.public-main{max-width:1200px;margin:auto;padding:45px 38px 80px}.policy{max-width:760px;margin:auto}.policy h2{margin-top:30px}.mobile-brand{display:none}.spinner{width:18px;height:18px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:1500px){.app-main{padding-top:45px}.hero{padding-top:100px;padding-bottom:110px}}
@media(max-width:1100px){.app-shell{grid-template-columns:210px minmax(0,1fr)}.sidebar{padding:16px 12px}.app-main{padding:30px 25px}.app-top{padding:0 25px}.grid3{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.hero{gap:30px}.hero-art{min-height:400px}.hero-orbit{width:300px;height:300px}.passport-visual{width:220px;height:300px}.float-card{padding:12px}.float-card.one{right:-10px}.float-card.two{left:-5px}.lesson-layout{grid-template-columns:210px 1fr}.lesson-body{padding:25px}.badge-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.topnav{padding:10px 20px}.topnav .logo{width:155px;height:56px}.topnav nav>a:not(.btn){display:none}.topnav nav{gap:8px}.topnav .btn{font-size:12px;padding:11px 13px}.hero{grid-template-columns:1fr;padding:40px 24px 65px;gap:45px}.hero h1{font-size:49px}.hero .intro{font-size:15px}.hero-art{max-width:440px;width:100%;margin:auto;min-height:370px}.passport-visual{height:280px}.passport-visual h2{font-size:27px}.passport-globe{height:80px;margin-top:14px}.float-card.one{right:0;top:25px}.float-card.two{left:0;bottom:25px}.hero-orbit{width:280px;height:280px}.hero-orbit.second{width:240px;height:240px}.spark{right:5px;bottom:60px;font-size:55px}.topic-strip{gap:18px;font-size:10px}.landing-section{padding:48px 24px}.grid3,.grid2{grid-template-columns:1fr}.landing-section .grid3{gap:26px}.growth-banner{padding:28px;grid-template-columns:1fr;gap:20px}.growth-banner h2{font-size:28px}.feature p{max-width:none}footer{padding:24px;flex-wrap:wrap}.app-shell{display:block}.sidebar{position:sticky;height:auto;top:0;z-index:20;padding:0;border:0;border-bottom:1px solid var(--line)}.sidebar>.brand,.nav-caption,.side-bottom{display:none}.sidebar nav{display:flex;overflow:auto;padding:8px 10px;gap:3px}.nav-item{padding:10px 12px;gap:7px;font-size:11px;white-space:nowrap}.nav-item .icon{width:17px;height:17px}.app-top{height:65px;padding:0 20px}.crumb{display:none}.mobile-brand{display:block;font-family:'Plus Jakarta Sans';font-weight:700;font-size:13px}.account-chip .name-label{display:none}.app-main{padding:25px 20px 50px}.page-heading h1{font-size:28px}.welcome{padding:25px}.welcome h2{font-size:25px;max-width:270px;position:relative;z-index:1}.welcome p{position:relative;z-index:1;max-width:260px}.welcome:after{right:-20px;top:20px;opacity:.4}.welcome .btn{position:relative;z-index:1}.stats{gap:12px}.stat{padding:17px}.stat strong{font-size:27px}.badge-list{gap:12px}.panel{padding:22px}.filters{flex-direction:column}.filters select{width:100%}.lesson-layout{grid-template-columns:1fr}.lesson-nav{padding:15px;max-height:250px;overflow:auto}.lesson-body{padding:22px}.lesson-copy{font-size:14px}.auth-wrap{grid-template-columns:1fr;gap:22px;padding:0 20px;margin:30px auto}.auth-aside{padding:10px 3px}.auth-aside h1{font-size:34px}.auth-aside .mini-path{display:none}.auth-form{padding:25px}.form-grid{grid-template-columns:1fr}.span2{grid-column:auto}.public-main{padding:30px 20px 60px}.admin-row{align-items:flex-start;flex-direction:column}.section-title{align-items:flex-start}.section-title h2{font-size:19px}.certificate{align-items:flex-start;flex-direction:column}h1{font-size:30px}h2{font-size:24px}dialog{padding:24px}.wallet{padding:24px}.passport-card{padding:25px}.btn{min-height:42px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:760px){.topnav{gap:12px}.topnav .logo{width:140px}.topnav nav{gap:5px}.topnav .btn{gap:6px;padding:11px 10px}}
@media(max-width:360px){.topnav{padding:10px 14px}.topnav .logo{width:120px}}
