@font-face{font-family:Unispace;src:url("assets/fonts/unispace-regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Unispace;src:url("assets/fonts/unispace-bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
:root{color-scheme:dark;--ink:#f7f5ef;--muted:#c0c3d2;--cyan:#72f5e0;--border:rgba(114,245,224,.54);--panel:rgba(9,15,32,.83);--mono:Unispace,"Courier New",monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:#11182f;color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;min-height:100svh}
a{color:inherit;text-decoration:none}
button{font:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible,.ticker:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
::selection{background:var(--cyan);color:#10192c}
.city,#city-animation,.shade{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}
.city{z-index:-3;background:url('assets/city-pixel-v6.png') center center/cover no-repeat;image-rendering:pixelated}
#city-animation{z-index:-2;object-fit:cover;image-rendering:pixelated}
.shade{z-index:-1;background:linear-gradient(180deg,rgba(9,13,30,.08),rgba(9,13,30,.1) 48%,rgba(9,13,30,.5))}
.page{width:min(1180px,calc(100% - 96px));margin:auto;padding-bottom:32px}
.topbar{min-height:100px;display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:1.4px}
.wordmark{display:flex;gap:12px;align-items:center;font-weight:bold}.terminal-mark{color:var(--cyan);font-size:24px;letter-spacing:-4px;margin-right:5px}.muted{color:#f3e0ec;font-size:10px}
nav{display:flex;gap:32px}nav a{padding:10px 0}nav a:hover,.all-work:hover{color:var(--cyan)}nav span{color:var(--cyan);margin-left:5px}
main{display:grid;gap:32px}.panel{min-width:0;border:1px solid var(--border);background:var(--panel);box-shadow:0 0 0 3px rgba(20,218,215,.045),0 15px 50px rgba(0,0,0,.12);position:relative}.panel:before,.panel:after{content:"";position:absolute;width:7px;height:7px;background:var(--cyan);pointer-events:none}.panel:before{left:-1px;top:-1px}.panel:after{right:-1px;bottom:-1px}
.panel-label{border-bottom:1px solid rgba(114,245,224,.17);display:flex;align-items:center;gap:9px;padding:14px 25px;color:var(--muted);font-size:10px;letter-spacing:1.5px}.panel-index{margin-left:auto;color:var(--cyan);white-space:nowrap}.status-light{width:5px;height:5px;flex:none;background:var(--cyan);box-shadow:0 0 8px rgba(114,245,224,.5)}
.intro{text-align:center;padding:39px 24px 41px}.eyebrow{margin:0 0 12px;color:var(--muted);font-size:11px;letter-spacing:1.1px}h1{font-size:clamp(42px,5.9vw,78px);letter-spacing:-4px;line-height:1.15;margin:0 0 25px;font-weight:700;text-shadow:3px 3px 0 rgba(246,103,151,.15)}.cursor{color:var(--cyan);font-size:.8em;animation:cursor 1.8s steps(1) infinite}.roles{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:15px;font-size:clamp(13px,1.6vw,20px);font-weight:bold;margin:0;line-height:1.7}.roles i{color:var(--cyan);font-style:normal;font-weight:normal}
.ticker{--ticker-duration:32s;cursor:grab;user-select:none;touch-action:pan-y;border-top:1px solid rgba(114,245,224,.27);display:flex;height:58px;overflow:hidden;background:rgba(3,11,25,.65)}.ticker-label{z-index:1;display:flex;align-items:center;gap:22px;padding:0 24px;flex-shrink:0;font-size:10px;letter-spacing:1.2px;border-right:1px solid rgba(114,245,224,.27);color:var(--cyan)}.ticker-label span{font-size:18px}.ticker-window{overflow:hidden;display:flex;align-items:center;flex:1;min-width:0;mask-image:linear-gradient(90deg,transparent,#000 30px,#000 calc(100% - 30px),transparent)}.ticker-track{display:flex;width:max-content;animation:marquee var(--ticker-duration) linear infinite;will-change:transform}.ticker-group{display:flex;flex:none;align-items:center;gap:30px;padding-right:30px;white-space:nowrap;font-size:17px}.ticker-group b{font-size:10px;font-weight:normal;color:var(--cyan)}.ticker:hover .ticker-track,.ticker:focus-within .ticker-track{animation-play-state:paused}
.projects-body{padding:29px 34px 0}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:23px}.section-heading .eyebrow{font-size:10px;margin-bottom:8px}h2{font-size:37px;letter-spacing:-1.7px;margin:0;line-height:1.1}.accent{color:var(--cyan)}.section-count{color:var(--cyan);font-size:10px;letter-spacing:1.5px;padding:0;line-height:1.4;white-space:nowrap}.project{border-top:1px solid rgba(175,206,222,.17)}.project summary{display:flex;align-items:center;gap:20px;min-height:76px;cursor:pointer;list-style:none;padding:15px 0}.project summary::-webkit-details-marker{display:none}.project-no{align-self:center;color:var(--cyan);font-size:11px;opacity:.8}.project-title{font-size:17px;line-height:1.45;font-weight:700;letter-spacing:-.35px;flex:1}.desktop-break{display:none}.title-note{font-size:14px;color:var(--muted);font-weight:normal}.badge{color:var(--muted);font-size:8px;line-height:1.5;letter-spacing:1px;padding:5px 8px;border:1px solid rgba(175,206,222,.25);white-space:nowrap}.badge.soon{color:#f2b9cc;border-color:#754052}.badge.latest,.badge.live{color:var(--cyan);border-color:#30685e}.badge.live{background:rgba(114,245,224,.07)}.project-toggle{font-size:23px;color:var(--muted);margin-left:6px;width:15px;text-align:center}.project[open] .project-toggle{transform:rotate(45deg);color:var(--cyan)}.project summary:hover .project-title{color:var(--cyan)}.project-content{padding:0 40px 24px;max-width:800px;color:var(--muted);font-size:13px;line-height:1.8}.project-content p{margin:0 0 12px}.project-tech{font-size:11px;color:var(--cyan)}.project-link{display:inline-flex;gap:22px;border-bottom:1px solid var(--cyan);padding-bottom:3px;font-size:12px;color:var(--ink)}.project-link:hover{color:var(--cyan)}.all-work{display:flex;justify-content:space-between;padding:19px 0;border-top:1px solid rgba(175,206,222,.17);font-size:11px}.all-work span{color:var(--cyan);font-size:16px}
footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:25px 0 27px;color:#e5d7e3;font-size:10px}footer p{margin:0;line-height:1.8}.footer-cross{color:var(--cyan);margin-right:8px;font-size:18px}.footer-divider{margin:0 12px;color:var(--cyan)}#motion-toggle{color:inherit;background:rgba(9,15,32,.7);border:1px solid rgba(175,206,222,.3);padding:9px 12px;font-size:10px;cursor:pointer;flex-shrink:0}#motion-toggle:hover{border-color:var(--cyan);color:var(--cyan)}#motion-toggle[hidden]{display:none}.motion-icon{color:var(--cyan);margin-right:6px}.skip-link{position:fixed;z-index:10;left:16px;top:-70px;padding:14px;background:#12182b;color:var(--cyan)}.skip-link:focus{top:16px}
@keyframes marquee{to{transform:translateX(-50%)}}@keyframes cursor{50%{opacity:0}}
html.motion-paused *,html.motion-paused *:before,html.motion-paused *:after{animation-play-state:paused!important}html.page-hidden *,html.page-hidden *:before,html.page-hidden *:after{animation-play-state:paused!important}
@media(min-width:1500px){.page{width:min(1370px,calc(100% - 160px))}.topbar{min-height:120px}.intro{padding:49px 24px 50px}h1{font-size:88px}.roles{font-size:23px}.project-title{font-size:20px}.project summary{min-height:85px}.projects-body{padding:33px 40px 0}main{gap:40px}}
@media(max-width:900px){.page{width:calc(100% - 48px)}.intro{padding:35px 20px}.roles{gap:10px;font-size:14px}h1{letter-spacing:-2.5px}.projects-body{padding:25px 25px 0}.project-title{font-size:15px}.project summary{gap:15px}.section-count{font-size:10px}.badge{font-size:7px}.ticker-label{padding:0 18px;gap:16px}.ticker-group{font-size:15px}.topbar{min-height:85px}}
@media(max-width:600px){html{scroll-padding-top:16px}.page{width:calc(100% - 32px)}.topbar{min-height:75px;font-size:10px;letter-spacing:.5px}.wordmark{gap:8px}.muted{display:none}nav{gap:20px}.panel-label{font-size:8px;letter-spacing:.7px;padding:12px 16px}.intro{padding:34px 13px 30px}.intro .eyebrow{font-size:10px}h1{font-size:clamp(30px,8.1vw,48px);letter-spacing:-1.6px;margin-bottom:20px}.roles{max-width:320px;margin:auto;font-size:12px;gap:3px 8px;line-height:1.9}.roles{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;max-width:100%;font-size:11px}.roles i{display:none}.roles span{min-width:0}.ticker{height:50px}.ticker-label{font-size:8px;padding:0 12px;gap:9px}.ticker-group{font-size:14px;gap:22px;padding-right:22px}.ticker{--ticker-duration:36s}main{gap:22px}.projects-body{padding:23px 17px 0}.section-heading{align-items:start;margin-bottom:20px}.section-heading .eyebrow{font-size:8px;letter-spacing:0}.section-count{font-size:8px;letter-spacing:.7px;padding-top:0}h2{font-size:30px}.project summary{gap:10px;min-height:85px;flex-wrap:wrap;position:relative;padding:16px 26px 16px 27px}.project-no{position:absolute;left:0;top:20px;font-size:9px}.project-title{font-size:14px;flex:1 1 100%;letter-spacing:-.4px}.project-toggle{position:absolute;right:0;top:19px;font-size:21px}.badge{font-size:7px;padding:3px 6px}.title-note{font-size:12px}.project-content{padding:0 8px 20px 27px;font-size:12px}.project-tech{font-size:10px}.all-work{padding:17px 0;font-size:10px}footer{align-items:start;font-size:9px;padding:23px 0}.footer-divider{margin:0 5px}footer p>span:last-child{display:block;margin-left:21px}#motion-toggle{font-size:9px;padding:8px}.city{background-position:52% center}#city-animation{object-position:52% center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important}.ticker-window{mask-image:none}#city-animation{display:none}}

.ticker.is-dragging{cursor:grabbing}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Expanded project metadata stays readable on narrow screens. */
.project-meta{margin:16px 0;font-size:12px;line-height:1.85}
.project-meta>div{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;margin:0 0 10px}
.project-meta dt{color:var(--cyan);font-weight:700}
.project-meta dd{margin:0;color:var(--muted);overflow-wrap:anywhere}
.projects .project:last-child{border-bottom:0}
@media(max-width:600px){.project-meta{font-size:11px}.project-meta>div{grid-template-columns:1fr;gap:2px}.page{padding-bottom:24px}.hero .panel-label{flex-wrap:wrap}.hero .panel-index{flex-shrink:0}}

/* Terminal labels share one header style and the same color. */
.projects{padding:0}
.panel-label .panel-index{color:var(--cyan)}
.project-heading{display:flex;flex:1;min-width:0;flex-direction:column;gap:7px}
.project-heading .project-no{align-self:flex-start;position:static;white-space:nowrap;line-height:1.5}
.project-heading .project-title{flex:auto}
.project summary{min-height:90px}
@media(max-width:600px){.project-heading{flex:1 1 100%}.project summary{padding:16px 26px 16px 0}.project-heading .project-no{font-size:9px}.project-content{padding-left:0}.project-toggle{top:35px}}

/* Classification follows the project title; the row number stays separate. */
.project-kind{font-size:.78em;font-weight:400;color:var(--muted);letter-spacing:0}
@media(max-width:600px){.project summary{padding:16px 26px 16px 27px}.project-toggle{top:19px}}

/* Certificates and courses: local badges, links on course names. */
.credential-list{list-style:none;margin:0;padding:0}
.credential{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center;gap:26px;padding:25px 0;border-top:1px solid rgba(175,206,222,.17)}
.credential-badge{display:block;width:100px;height:100px;object-fit:contain}
.credential-copy{margin:0;line-height:1.9;overflow-wrap:anywhere}
.credential-issuer{font-size:12px;color:var(--muted)}
.credential-title{font-size:15px;color:var(--ink);text-decoration:underline;text-decoration-color:rgba(114,245,224,.55);text-underline-offset:5px}
.credential-title:hover{color:var(--cyan);text-decoration-color:var(--cyan)}
.credential-arrow{color:var(--cyan);white-space:nowrap}
.credential-course-icon{width:100px;height:100px;display:grid;place-items:center;border:1px solid rgba(114,245,224,.3);background:rgba(114,245,224,.045);color:var(--cyan);font-size:33px}
@media(max-width:600px){.credential{grid-template-columns:64px minmax(0,1fr);gap:15px;padding:21px 0;align-items:start}.credential-badge,.credential-course-icon{width:64px;height:64px}.credential-course-icon{font-size:25px}.credential-issuer{font-size:10px}.credential-title{font-size:12px}.credential-copy{line-height:1.85}#certificates-title{font-size:27px;line-height:1.2}}

/* Frame the supplied Udemy PNG's transparent padding without editing its pixels. */
.credential-badge-frame{display:block;position:relative;width:100px;height:100px;overflow:hidden}
.credential-badge-frame .credential-badge{position:absolute;left:50%;top:50%;width:163.333333%;height:163.333333%;max-width:none;transform:translate(-50%,-50%)}
@media(max-width:600px){.credential-badge-frame{width:64px;height:64px}}