:root{--color-brand-500: #ffbd21;--color-brand-600: #f3a900;--color-ink: #172033;--color-muted: #667085;--color-surface: #ffffff;--color-canvas: #fffdf8;--color-border: #e7e9ee;--radius-card: 20px;--shadow-card: 0 12px 32px rgb(23 32 51 / 8%);--container: 1200px;--header-height: 76px}*{box-sizing:border-box}html{color:var(--color-ink);background:#fff;font-family:PingFang SC,Noto Sans SC,Inter,ui-sans-serif,system-ui,sans-serif}body{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit}.app-shell{min-height:100vh;display:flex;flex-direction:column}#main-content{flex:1}.container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{height:var(--header-height);background:#fffffff5;border-bottom:1px solid #eef0f4;position:sticky;top:0;z-index:20;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.header-inner{height:100%;display:flex;align-items:center;gap:32px}.brand{display:flex;align-items:center;gap:10px;min-width:190px}.brand-mark{display:grid;place-items:center;width:40px;height:46px;border-radius:48% 52% 45% 55%;background:#ffb91c;color:#191919;font-size:24px;font-weight:950;transform:rotate(-5deg)}.brand-copy{display:grid;line-height:1.05}.brand-copy strong{font-size:18px;font-weight:900}.brand-copy small{font-size:12px;margin-top:4px}.site-header nav{display:flex;gap:28px;font-size:15px;font-weight:650;white-space:nowrap}.site-header nav a{padding:26px 0 23px;border-bottom:3px solid transparent}.site-header nav a.router-link-active{border-color:var(--color-brand-500);color:#111}.header-action{min-width:92px;border:0;background:linear-gradient(135deg,#ffca3a,#ffb313);color:#141414;padding:12px 18px;border-radius:999px;font-weight:800;cursor:pointer}.mobile-menu{display:none;border:0;background:transparent}.site-header a:focus-visible,.button:focus-visible,.quick-card:focus-visible,.path-card:focus-visible{outline:3px solid #287cff;outline-offset:3px;border-radius:10px}.home-hero{min-height:410px;overflow:hidden;background:radial-gradient(circle at 8% 86%,rgba(102,211,180,.2),transparent 22%),radial-gradient(circle at 92% 16%,rgba(255,199,43,.22),transparent 24%),linear-gradient(120deg,#fff8d8,#fffdf4 45%,#fff5d4)}.hero-layout{height:410px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center}.hero-copy{position:relative;z-index:2;padding-left:58px}.hero-kicker{display:inline-flex;padding:6px 11px;border-radius:999px;background:#fff3bd;color:#a96800;font-size:12px;font-weight:800}.hero-copy h1{white-space:pre-line;max-width:510px;margin:14px 0 10px;font-size:clamp(42px,4.6vw,58px);line-height:1.08;letter-spacing:-.055em;font-weight:950}.hero-copy p{margin:0;color:#647086;font-size:19px}.hero-actions{display:flex;gap:14px;margin-top:22px}.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:9px;padding:0 26px;border:0;border-radius:999px;font-weight:800;cursor:pointer}.primary{background:linear-gradient(135deg,#ffca35,#ffb310);color:#171717;box-shadow:0 12px 28px #f4ac0038}.outline{border:1.5px solid #e8a900;background:#ffffffb3}.hero-visual{position:relative;align-self:end;height:390px}.hero-visual img{width:100%;height:100%;object-fit:contain;object-position:center bottom}.code-chip{position:absolute;padding:8px 14px;border-radius:9px;color:#fff;font-weight:750;box-shadow:0 8px 20px #232c4824;transform:rotate(-7deg)}.chip-python{right:10%;top:45px;background:#338ae7}.chip-scratch{right:2%;top:98px;background:#ff7827}.chip-cpp{right:7%;top:151px;background:#8058ea}.home-section{padding-top:36px}.home-section.compact{padding-top:38px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:20px}.section-heading h2{margin:2px 0 0;font-size:31px;letter-spacing:-.03em}.section-label{color:#ac7400;font-size:11px;font-weight:900;letter-spacing:.15em}.section-heading>a{display:flex;align-items:center;gap:5px;color:#1673df;font-weight:700;font-size:14px}.quick-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.quick-card{min-height:218px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 18px;border-radius:18px;transition:transform .2s,box-shadow .2s}.quick-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px #25344e1a}.quick-card.blue{background:#eef7ff;color:#1475d2}.quick-card.orange{background:#fff7e9;color:#f17119}.quick-card.green{background:#edf9f5;color:#04a874}.quick-card.purple{background:#f6f0ff;color:#8655ed}.quick-card.yellow{background:#fff9e5;color:#d99200}.quick-card h3{margin:15px 0;color:#131b32;font-size:18px;text-align:center}.quick-card span{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border-radius:999px;color:#fff}.quick-card.blue span{background:#2481ee}.quick-card.orange span{background:#ff7325}.quick-card.green span{background:#0bbd7e}.quick-card.purple span{background:#8b55ee}.quick-card.yellow span{background:#e5a30a}.path-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}.path-card{min-height:88px;display:flex;align-items:center;gap:14px;padding:18px;border-radius:14px;border:1px solid #f0f1f4;font-size:18px}.path-card strong{color:#171f33}.path-arrow{margin-left:auto}.path-card.orange{background:#fff8ed;color:#ef7e1a}.path-card.blue{background:#eff7ff;color:#1e7fd4}.path-card.indigo{background:#f1f5ff;color:#356ad7}.path-card.green{background:#effaf6;color:#08aa76}.path-card.pink{background:#fff1f6;color:#e65085}.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.course-card{display:grid;grid-template-columns:112px 1fr;gap:20px;align-items:center;padding:18px;border:1px solid #e9ebf0;border-radius:16px;background:#fff}.course-icon{height:104px;display:grid;place-items:center;border-radius:13px}.course-icon.blue{background:#e9f5ff;color:#1b81da}.course-icon.orange{background:#fff4dc;color:#ec7a19}.course-icon.pink{background:#fff0f5;color:#e95385}.course-card h3{margin:0 0 7px;font-size:17px}.course-tag{display:inline-flex;padding:4px 9px;border-radius:999px;background:#eef5ff;color:#2376cf;font-size:12px}.course-action{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:15px;padding:10px 14px;border-radius:999px;background:#ffc533;font-weight:800}.join-banner{margin-top:40px;margin-bottom:42px;display:flex;align-items:center;gap:22px;padding:26px 38px;border-radius:16px;background:linear-gradient(100deg,#fff2bf,#ffe7a0)}.join-icon{color:#d78c00}.join-banner h2{margin:0;font-size:24px}.join-banner p{margin:7px 0 0;color:#6b7280}.join-button{margin-left:auto;min-width:185px;background:#fff}.site-footer{padding:28px 0;color:#788193;border-top:1px solid #edf0f4}.footer-inner{display:flex;align-items:center;justify-content:space-between}.footer-inner>div{display:grid;grid-template-columns:auto auto;gap:4px 12px}.footer-inner strong{color:#1b2232}.footer-inner small{grid-column:1/-1}.site-footer nav{display:flex;gap:30px;font-size:13px}.eyebrow{margin:0 0 12px;color:var(--color-brand-600);font-size:14px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.page-section{padding-block:72px}.page-title{max-width:760px;margin:0;font-size:clamp(38px,6vw,60px);line-height:1.08;letter-spacing:-.045em}.page-description{max-width:650px;color:var(--color-muted);font-size:18px;line-height:1.7}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{min-height:150px;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}.direction-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}.direction-card,.content-panel{padding:28px;border:1px solid var(--color-border);border-radius:var(--radius-card);background:#fff;box-shadow:var(--shadow-card)}.direction-card h2,.content-panel h2{margin:18px 0 8px;font-size:26px}.direction-card p,.content-panel p{color:var(--color-muted);line-height:1.7}.tag{display:inline-flex;padding:6px 10px;border-radius:999px;background:#fff7df;color:var(--color-brand-600);font-size:13px;font-weight:700}.content-panel{max-width:760px;margin-top:36px}.card-button{text-align:left;font:inherit;cursor:pointer}.admin-grid{display:grid;grid-template-columns:minmax(300px,440px) 1fr;gap:28px;margin-top:32px}.form-grid{display:grid;gap:16px}.form-grid label{display:grid;gap:7px;font-weight:650}.form-grid input:not([type=checkbox]){min-height:44px;border:1px solid var(--color-border);border-radius:10px;padding:0 12px}.secondary{border:1px solid var(--color-border);background:#fff}.admin-list{display:grid;gap:12px;align-content:start}.admin-item{display:flex;justify-content:space-between;gap:20px;padding:20px;background:#fff;border:1px solid var(--color-border);border-radius:14px}.admin-item p{margin:6px 0 0;color:var(--color-muted)}.admin-item button{margin-left:8px}.error-state{padding:14px;color:#b42318;background:#fee4e2;border-radius:10px}.empty-state{color:var(--color-muted)}@media(max-width:980px){.site-header nav{display:none}.mobile-menu{display:block}.header-action{margin-left:auto}.hero-layout{grid-template-columns:1fr 1fr}.hero-copy{padding-left:10px}.hero-copy h1{font-size:44px}.quick-grid,.path-grid{grid-template-columns:repeat(3,1fr)}.course-grid{grid-template-columns:1fr}}@media(max-width:680px){.container{width:min(calc(100% - 28px),var(--container))}.brand{min-width:0}.brand-copy strong{font-size:16px}.header-action{min-width:70px;padding:10px 14px}.hero-layout{height:auto;min-height:570px;grid-template-columns:1fr}.hero-copy{padding:36px 4px 0}.hero-copy h1{font-size:38px}.hero-copy p{font-size:17px}.hero-actions{margin-top:18px}.hero-visual{height:270px}.code-chip{font-size:12px;padding:7px 10px}.chip-python{right:6%;top:30px}.chip-scratch{right:1%;top:72px}.chip-cpp{right:5%;top:114px}.home-section{padding-top:30px}.section-heading{align-items:center}.section-label{display:none}.section-heading h2{font-size:26px}.quick-grid,.direction-grid,.card-grid,.admin-grid{grid-template-columns:1fr}.quick-card{min-height:170px}.path-grid{grid-template-columns:1fr 1fr}.course-card{grid-template-columns:92px 1fr}.join-banner{align-items:flex-start;padding:24px;flex-wrap:wrap}.join-button{width:100%;margin-left:0}.footer-inner{align-items:flex-start;gap:24px}.site-footer nav{display:grid;grid-template-columns:1fr 1fr;gap:12px}}.footer-brand{display:grid;grid-template-columns:auto auto;gap:4px 12px}.footer-brand small,.icp-link{grid-column:1/-1}.icp-link{width:max-content;color:inherit;font-size:12px;transition:color .2s ease}.icp-link:hover,.icp-link:focus-visible{color:#b57700}.home-hero{position:relative}.hero-visual picture{display:block;width:100%;height:100%}.hero-arrow{position:absolute;z-index:5;top:50%;display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid rgba(23,32,51,.08);border-radius:50%;background:#ffffffe0;color:#31394b;box-shadow:0 8px 24px #232c481a;cursor:pointer;transform:translateY(-50%);transition:background-color .2s ease,box-shadow .2s ease,transform .2s ease}.hero-arrow:hover{background:#fff;box-shadow:0 12px 28px #232c4829;transform:translateY(-50%) scale(1.04)}.hero-arrow-left{left:18px}.hero-arrow-right{right:18px}.hero-pagination{position:absolute;z-index:5;left:50%;bottom:16px;display:flex;align-items:center;gap:8px;transform:translate(-50%)}.hero-pagination button{width:9px;height:9px;padding:0;border:0;border-radius:999px;background:#17203338;cursor:pointer;transition:width .25s ease,background-color .25s ease}.hero-pagination button.active{width:28px;background:var(--color-brand-500)}.hero-arrow:focus-visible,.hero-pagination button:focus-visible{outline:3px solid #287cff;outline-offset:3px}.hero-fade-enter-active,.hero-fade-leave-active{transition:opacity .42s ease,transform .42s ease}.hero-fade-enter-from{opacity:0;transform:translate(14px)}.hero-fade-leave-to{opacity:0;transform:translate(-14px)}@media(max-width:680px){.hero-arrow{top:auto;bottom:12px;width:40px;height:40px}.hero-arrow-left{left:18px}.hero-arrow-right{right:18px}.hero-pagination{bottom:27px}.hero-visual picture{height:100%}}@media(prefers-reduced-motion:reduce){.hero-fade-enter-active,.hero-fade-leave-active,.hero-arrow,.hero-pagination button{transition:none}.hero-fade-enter-from,.hero-fade-leave-to{transform:none}}.header-account{position:relative;flex:0 0 auto;margin-left:auto}.header-action:disabled{cursor:wait;opacity:.72}.header-account-placeholder{display:block;width:92px;height:42px;border-radius:999px;background:#f3f4f6}.account-menu-wrap{position:relative}.account-trigger{min-height:44px;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border:1px solid rgba(224,158,0,.2);border-radius:999px;background:#fff8db;color:#202536;font-weight:800;cursor:pointer}.account-trigger:hover{background:#fff2b8}.account-avatar{color:#dfa000}.account-trigger-name{max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-caret{transition:transform .18s ease}.account-caret.open{transform:rotate(180deg)}.account-menu{position:absolute;top:calc(100% + 10px);right:0;width:224px;padding:8px;border:1px solid #ece8dc;border-radius:16px;background:#fff;box-shadow:0 18px 48px #19203329}.account-menu:before{content:"";position:absolute;right:22px;top:-6px;width:10px;height:10px;border-top:1px solid #ece8dc;border-left:1px solid #ece8dc;background:#fff;transform:rotate(45deg)}.account-menu-user{display:grid;gap:3px;padding:10px 12px 12px;border-bottom:1px solid #f0f1f4}.account-menu-user span{color:var(--color-muted);font-size:12px}.account-menu-user strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-menu-item{width:100%;min-height:42px;display:flex;align-items:center;gap:10px;margin-top:5px;padding:0 11px;border:0;border-radius:10px;background:transparent;color:#30384b;font-weight:700;text-align:left;cursor:pointer}.account-menu-item:hover,.account-menu-item:focus-visible{background:#f7f8fa}.account-menu-logout{color:#b42318}.account-menu-logout:disabled{cursor:wait;opacity:.65}.header-auth-error{position:absolute;top:calc(100% + 10px);right:0;width:300px;margin:0;padding:10px 12px;border:1px solid #fecdca;border-radius:10px;background:#fffbfa;color:#b42318;font-size:13px;line-height:1.45;box-shadow:0 12px 30px #b423181a}.account-menu-enter-active,.account-menu-leave-active{transition:opacity .16s ease,transform .16s ease}.account-menu-enter-from,.account-menu-leave-to{opacity:0;transform:translateY(-5px)}@media(max-width:980px){.header-account{margin-left:auto}}@media(max-width:680px){.header-account-placeholder{width:70px;height:40px}.account-trigger-name{max-width:68px}.account-menu{right:-34px}.header-auth-error{right:-34px;width:min(300px,calc(100vw - 28px))}}@media(max-width:430px){.account-trigger-name{display:none}.account-trigger{padding-right:9px}}@media(prefers-reduced-motion:reduce){.account-caret,.account-menu-enter-active,.account-menu-leave-active{transition:none}}@media(min-width:681px){.hero-visual img{width:125%;max-width:none;transform:translate(-30%)}}