:root{color-scheme:dark;--bg:#0a1022;--panel:#141e38;--ink:#f5f7ff;--dim:#bcc9e4;--blue:#9fbfff;--line:#344362}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.65 system-ui,sans-serif}a{color:var(--blue);text-underline-offset:.25em}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #c5eaff;outline-offset:5px}.shell{width:min(1150px,calc(100% - 40px));margin:auto}header,footer{padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--line)}header nav,.roles,.social{display:flex;gap:12px;flex-wrap:wrap}header a,.roles a,.social a{text-decoration:none}.brand{color:white;font-size:1.6rem;font-weight:900}.brand span,h1 span{color:var(--blue)}.hero{display:grid;grid-template-columns:1.05fr 1fr;grid-template-areas:"intro stage" "roles stage";align-items:center;column-gap:28px;padding:54px 0 70px}.intro{grid-area:intro;align-self:end}.roles{grid-area:roles;align-self:start}.stage{grid-area:stage;position:relative;isolation:isolate;display:grid;place-items:center;padding:26px 0;overflow:hidden}.stage figure{margin:0;width:min(280px,76vw);z-index:1;padding:7px;border:1px solid #8397c5;border-radius:23px;background:#17233d;box-shadow:0 15px 40px #0007}.stage img,.gallery img{display:block;width:100%;height:auto;border-radius:17px}.stage figcaption{padding:6px 8px;font-size:.72rem;letter-spacing:.15em}.depth{position:absolute;inset:0;transform:translate(var(--x,0),var(--y,0));pointer-events:none;background:radial-gradient(ellipse at center,#354b8a 0%,transparent 69%)}.depth i{position:absolute;border-radius:50%;aspect-ratio:1;width:29%;top:13%;left:7%;background:radial-gradient(circle at 28% 25%,#d0e4ffb0,transparent 25%),radial-gradient(circle at 68% 72%,#7a60eaae,transparent 66%),#23477670;box-shadow:inset 0 0 14px #b2d4ff99,0 12px 32px #0005;animation:drift 7s ease-in-out infinite alternate;animation-play-state:paused}.depth i:nth-child(2){top:49%;left:69%;width:26%;animation-delay:-3s}.depth i:nth-child(3){top:6%;left:74%;width:12%;animation-delay:-5s}.depth i:nth-child(4){top:76%;left:9%;width:15%;animation-delay:-2s}@keyframes drift{to{transform:translate(10px,-18px) rotate(10deg)}}.live .depth i,.live.wave i{animation-play-state:running}.label{color:var(--blue);font-size:.78rem;font-weight:750;letter-spacing:.11em;text-transform:uppercase}h1,h2,h3,p{margin:0 0 14px}h1{font-size:clamp(2.7rem,6vw,5.65rem);line-height:1.06;letter-spacing:-.065em}h1 span{display:block}h2{font-size:clamp(2rem,4vw,3.65rem);line-height:1.13;letter-spacing:-.045em}p{max-width:65ch;color:var(--dim)}.lead{font-size:1.18rem}.roles a,.social a,button{border:1px solid var(--line);border-radius:24px;padding:8px 14px;background:#192749;color:#e9f0ff;font:inherit}.chapter{padding:clamp(44px,8vw,100px) 0;border-top:1px solid var(--line)}.trail{padding-left:25px;list-style:none;border-left:2px solid var(--line)}.trail li{padding:12px 0;position:relative}.trail li::before{content:"";position:absolute;top:21px;left:-32px;width:12px;height:12px;border-radius:100%;background:#67769d}.trail li.current::before{background:#b6daff;box-shadow:0 0 17px #8db6ff}.projects,.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.projects article,aside{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:clamp(17px,3vw,32px)}.projects h3{font-size:1.9rem}.projects details{margin:14px 0;padding:12px;border-radius:12px;background:#0d1429}.demo li.active{color:#bbdcff;font-weight:800}summary,button{cursor:pointer}button{margin-top:6px}.music{background:#24162f}.music .chapter{display:grid;grid-template-columns:1fr 1fr;gap:24px}.wave{height:100px;display:flex;gap:7px;align-items:center}.wave i{width:8px;height:var(--h);border-radius:12px;background:linear-gradient(#efb4ff,#947bff);animation:pulse 1.4s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.13s);animation-play-state:paused}@keyframes pulse{to{transform:scaleY(.38)}}.social small{display:block}aside{margin-top:22px}footer{border-bottom:0}.skip{position:absolute;left:12px;top:-100px;background:var(--panel);padding:10px;z-index:10}.skip:focus{top:12px}@media(min-width:1000px){.stage figure{width:330px}}@media(max-width:719px){.hero{grid-template-columns:1fr;grid-template-areas:"intro" "stage" "roles";padding-top:30px}.stage figure{width:min(300px,76vw)}.depth i:nth-child(4){display:none}.projects,.music .chapter{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.depth{transform:none}}