html{background:#050505;scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:#050505;color:#f1f1f1;font-family:Arial,Helvetica,sans-serif}
button,a,summary{touch-action:manipulation}
button,summary{cursor:pointer}
a{color:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid #fff;outline-offset:5px}
::selection{background:#eee;color:#111}
#hz-portfolio{max-width:1440px;margin:0 auto;padding:0 clamp(22px,5.35vw,78px) 26px;container-type:inline-size}
#hz-portfolio .hp-header{padding-right:0;min-height:96px}
#hz-portfolio a.hp-brand{text-decoration:none;line-height:1.4}
#hz-portfolio .hp-nav a{font:12px/1.6 SFMono-Regular,Consolas,'Liberation Mono',monospace;color:#aaa;text-decoration:none;padding:12px 0}
#hz-portfolio .hp-nav a:hover{color:#fff}
#hz-portfolio .hp-nav .hp-nav-community{color:#eee}
#hz-portfolio .hp-stage{min-height:clamp(350px,41vw,520px)}
#hz-portfolio .hp-card{color:#f1f1f1;text-decoration:none}
#hz-portfolio .hp-card h3{font-size:clamp(30px,3.2vw,39px)}
#hz-portfolio .hp-card-link .hp-arrow{font-size:18px;line-height:1}
#hz-portfolio .hp-practice{background:#e9e9e7;color:#111;margin-top:20px;padding:27px 29px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:35px;align-items:center}
#hz-portfolio .hp-practice .hp-mono{color:#555;letter-spacing:1.4px}
#hz-portfolio .hp-practice h2{font-size:29px;font-weight:400;letter-spacing:-1px;line-height:1.15;margin:8px 0 10px}
#hz-portfolio .hp-practice p{color:#555;font-size:13px;line-height:1.8;max-width:440px}
#hz-portfolio .hp-practice-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid #aaa;border-bottom:1px solid #aaa}
#hz-portfolio .hp-practice-levels div{padding:17px 12px}
#hz-portfolio .hp-practice-levels div+div{border-left:1px solid #bbb}
#hz-portfolio .hp-practice-levels span{display:block;font:11px/1.6 SFMono-Regular,Consolas,'Liberation Mono',monospace;color:#666;margin-bottom:5px}
#hz-portfolio .hp-practice-levels strong{font-size:18px;font-weight:400;letter-spacing:-.4px}
#hz-portfolio .hp-footer{border-top:1px solid #303030;margin-top:27px;padding-top:19px}
#hz-portfolio .hp-footer a{font:inherit;text-decoration:none;color:#999}
#hz-portfolio .hp-footer a:hover{color:#fff}
#hz-portfolio .hp-motion{cursor:pointer}
#hz-portfolio a.hp-back{text-decoration:none;display:inline-flex}
#hz-portfolio .hp-course-heading{margin-bottom:24px}
#hz-portfolio .hp-course-heading h1{font-size:clamp(32px,4vw,47px);max-width:none}
#hz-portfolio .hp-study{--hp-course-height:clamp(350px,36vw,460px);height:var(--hp-course-height);grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:stretch}
#hz-portfolio .hp-media{height:100%;min-height:0;aspect-ratio:auto;padding:50px 24px;background:#0a0a0a;border:1px solid #414141}
#hz-portfolio .hp-media .hp-media-title{font-size:clamp(30px,3.7vw,47px);line-height:1.08;font-weight:400;letter-spacing:-1.8px}
#hz-portfolio .hp-outline{height:100%;min-height:0;border:1px solid #303030;display:flex;flex-direction:column;background:#0a0a0a}
#hz-portfolio .hp-outline-head{padding:17px 20px;border-bottom:1px solid #303030;flex:none;gap:12px}
#hz-portfolio .hp-outline-head h2{font-size:16px}
#hz-portfolio .hp-scroll-curriculum{overflow-y:auto;overscroll-behavior-y:contain;scrollbar-color:#858585 #151515;scrollbar-width:thin;min-height:0;flex:1;padding:7px 18px 14px 20px;margin:0;list-style:none;outline-offset:-3px}
#hz-portfolio .hp-scroll-curriculum::-webkit-scrollbar{width:6px}
#hz-portfolio .hp-scroll-curriculum::-webkit-scrollbar-track{background:#151515}
#hz-portfolio .hp-scroll-curriculum::-webkit-scrollbar-thumb{background:#858585;border-radius:0}
#hz-portfolio .hp-scroll-curriculum li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid #242424;color:#c5c5c5;font-size:13px;line-height:1.65}
#hz-portfolio .hp-scroll-curriculum li:last-child{border-bottom:0}
#hz-portfolio .hp-scroll-curriculum .hp-topic-num{font:11px/1.9 SFMono-Regular,Consolas,'Liberation Mono',monospace;color:#888}
#hz-portfolio .hp-scroll-curriculum .hp-hermes-note{display:block;color:#999;font-size:12px;line-height:1.75;margin-top:12px}
#hz-portfolio .hp-curriculum-hint{padding:9px 20px;border-top:1px solid #303030;color:#888;font:10px/1.6 SFMono-Regular,Consolas,'Liberation Mono',monospace;letter-spacing:.2px;display:flex;justify-content:space-between;flex:none;gap:12px}
#hz-portfolio .hp-community{margin-top:17px;padding:28px 29px;gap:28px}
#hz-portfolio .hp-community h2{font-size:clamp(29px,3.2vw,38px)}
#hz-portfolio .hp-community-action{min-width:210px}
#hz-portfolio a.hp-join{text-decoration:none;cursor:pointer;white-space:normal;min-height:50px;font-size:12px}
#hz-portfolio .hp-join .hp-arrow{font-size:18px;line-height:1}
#hz-portfolio .hp-membership-note{font:11px/1.6 SFMono-Regular,Consolas,'Liberation Mono',monospace;color:#888;margin-top:8px;text-align:center}
.hp-skip{position:absolute;top:10px;left:12px;padding:12px 18px;background:#eee;color:#111;transform:translateY(-180%);z-index:10}
.hp-skip:focus{transform:none}
@media(min-width:1450px){#hz-portfolio .hp-stage{min-height:520px}}
@media(max-width:760px){#hz-portfolio .hp-study{gap:16px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}#hz-portfolio .hp-outline-head{padding:16px}#hz-portfolio .hp-scroll-curriculum{padding-inline:16px}#hz-portfolio .hp-scroll-curriculum li{font-size:12px;gap:8px}#hz-portfolio .hp-practice{grid-template-columns:1fr;gap:20px}#hz-portfolio .hp-practice h2{font-size:28px}#hz-portfolio .hp-practice-levels div{padding:13px 18px}#hz-portfolio .hp-community-action{min-width:190px}}
@media(max-width:580px){#hz-portfolio{padding:0 22px 22px}#hz-portfolio .hp-header{min-height:92px;padding:14px 0;gap:6px;align-items:flex-start;justify-content:center}#hz-portfolio .hp-nav{gap:24px}#hz-portfolio .hp-nav a{padding:9px 0;min-height:40px}#hz-portfolio .hp-stage{min-height:290px}#hz-portfolio .hp-title-frame h1{font-size:17.1cqw}#hz-portfolio .hp-card h3{font-size:33px}#hz-portfolio .hp-card-meta{gap:10px;font-size:10px}#hz-portfolio .hp-practice{padding:24px;margin-top:16px;gap:18px}#hz-portfolio .hp-practice h2{font-size:27px}#hz-portfolio .hp-practice-levels div{padding:12px 8px}#hz-portfolio .hp-practice-levels strong{font-size:16px}#hz-portfolio .hp-study{--hp-course-height:300px;height:auto;grid-template-columns:minmax(0,1fr);gap:15px}#hz-portfolio .hp-media,#hz-portfolio .hp-outline{height:var(--hp-course-height)}#hz-portfolio .hp-media .hp-media-title{font-size:33px}#hz-portfolio .hp-scroll-curriculum li{font-size:13px}#hz-portfolio .hp-community{padding:24px;margin-top:15px}#hz-portfolio .hp-community h2{font-size:32px}#hz-portfolio .hp-community-action{min-width:0;margin-top:22px}#hz-portfolio .hp-join{width:100%}#hz-portfolio .hp-footer{gap:13px}#hz-portfolio .hp-motion{min-height:40px}#hz-portfolio .hp-course-heading h1{font-size:33px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#hz-portfolio .hp-rain span{animation:none}}