:root{--bg: #0a0a0a;--surface: #0a0a0a;--text: #f2f2f2;--text-dim: #9a9a9a;--accent: #ccff00;--accent-2: #a78bfa;--font-display: "Space Grotesk", sans-serif;--font-body: "Inter", sans-serif;--space: clamp(4rem, 10vh, 8rem);--pad-x: clamp(1.25rem, 5vw, 4rem)}*,*:before,*:after{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-body);line-height:1.6;-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--font-display);line-height:1.05;letter-spacing:-.02em}h1{font-size:clamp(2.75rem,9vw,7rem);font-weight:700}h2{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:2rem}a{color:var(--text);text-decoration:none}.accent{color:var(--accent)}::selection{background:var(--accent-2);color:var(--bg)}.btn{display:inline-block;padding:.9em 1.8em;border:1px solid var(--accent);border-radius:999px;color:var(--accent);font-family:var(--font-display);font-weight:500;transition:background .25s,color .25s}.btn:hover{background:var(--accent);color:var(--bg)}section{padding:var(--space) var(--pad-x);max-width:1200px;margin:0 auto}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.info-card{position:fixed;z-index:50;max-width:300px;width:max-content;padding:1.1rem 1.3rem;background:color-mix(in srgb,var(--surface) 90%,transparent);border:1px solid #2a2a2a;border-left:3px solid var(--accent);border-radius:.9rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 14px 44px #0000008c;opacity:0;transform:translateY(8px) scale(.98);transition:opacity .25s,transform .25s}.info-card.is-open{opacity:1;transform:none}.info-card__title{font-family:var(--font-display);font-size:1.1rem;margin-bottom:.4rem;padding-right:1rem}.info-card__text{color:var(--text-dim);font-size:.9rem;line-height:1.5}.info-card__close{position:absolute;top:.45rem;right:.6rem;background:none;border:none;color:var(--text-dim);font-size:1.3rem;line-height:1;cursor:pointer;transition:color .2s}.info-card__close:hover{color:var(--accent)}@media(max-width:700px){.info-card{left:1rem!important;right:1rem!important;top:auto!important;bottom:1rem;max-width:none;width:auto}}.skill-panel-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;opacity:0;pointer-events:none;transition:opacity .3s}.skill-panel-backdrop.is-open{opacity:1}.skill-panel{position:fixed;top:50%;right:10vw;width:min(480px,90vw);max-height:min(600px,80vh);overflow-y:auto;background:var(--surface);border:1px solid #2a2a2a;border-left:3px solid var(--skill-accent, var(--accent));border-radius:1.25rem;padding:2.75rem;box-shadow:0 24px 80px #0009;z-index:61;opacity:0;pointer-events:none;transform:translateY(-50%) translate(20px);transition:opacity .3s,transform .3s,border-color .15s}.skill-panel.is-open{opacity:1;pointer-events:auto;transform:translateY(-50%) translate(0)}.skill-panel.is-open.is-switching{opacity:.9;transform:translateY(-50%) translate(0) scale(.97);transition-duration:.15s}.skill-panel__title{font-family:var(--font-display);font-size:1.6rem;margin-bottom:1rem;padding-right:2rem;transition:opacity .15s ease,transform .15s ease}.skill-panel__text{color:var(--text-dim);font-size:1.05rem;line-height:1.7;transition:opacity .15s ease,transform .15s ease}.skill-panel.is-switching .skill-panel__title,.skill-panel.is-switching .skill-panel__text{opacity:0;transform:translateY(6px)}.skill-panel__close{position:absolute;top:1.25rem;right:1.25rem;background:none;border:none;color:var(--text-dim);font-size:1.8rem;line-height:1;cursor:pointer;transition:color .2s}.skill-panel__close:hover{color:var(--accent)}@media(max-width:700px){.skill-panel-backdrop{background:#0000008c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.skill-panel{top:0;right:0;left:0;bottom:0;width:auto;height:100%;max-height:none;border-radius:0;border-left:none;border-top:3px solid var(--skill-accent, var(--accent));padding:5rem 1.5rem 2rem;transform:translateY(20px)}.skill-panel.is-open{transform:none}.skill-panel.is-open.is-switching{transform:scale(.98)}}.nav{position:fixed;inset:0 0 auto 0;display:flex;justify-content:space-between;align-items:center;padding:1rem var(--pad-x);background:color-mix(in srgb,var(--bg) 80%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10}.nav-logo{font-family:var(--font-display);font-weight:700;font-size:1.25rem;color:var(--accent)}.nav nav{display:flex;gap:1.5rem}.nav nav a{color:var(--text-dim);font-size:.95rem;transition:color .2s}.nav nav a:hover,.nav nav a.active{color:var(--accent)}.scroll-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left}.hero{min-height:100svh;max-width:none;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1.5rem;position:relative;overflow:hidden}.hero h1 .hero-line{display:block;overflow:hidden;padding-bottom:.16em;margin-bottom:-.16em}.hero h1 .hero-line-inner{display:block}#hero-canvas{position:absolute;top:0;right:0;width:50%;height:100%;z-index:-1;pointer-events:none}#hero-canvas canvas{width:100%;height:100%;display:block}@media(max-width:700px){#hero-canvas{top:auto;bottom:0;width:100%;height:42%}.hero{padding-bottom:42svh}}.hero-kicker{color:var(--accent);font-family:var(--font-display);font-size:1.1rem}.hero-tagline{color:var(--text-dim);max-width:34rem;font-size:1.15rem}.marquee{overflow:hidden;border-top:1px solid #1c1c1c;border-bottom:1px solid #1c1c1c;padding:1.1rem 0}.marquee-track{display:flex;width:max-content;animation:marquee 28s linear infinite}.marquee-track span{display:flex;align-items:center;white-space:nowrap;font-family:var(--font-display);font-size:clamp(1.4rem,3.5vw,2.4rem);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--accent) 70%,transparent)}.marquee-track span:nth-child(2n){-webkit-text-stroke-color:color-mix(in srgb,var(--accent-2) 75%,transparent)}.marquee-track span:after{content:"•";margin:0 1.4rem;-webkit-text-stroke-color:color-mix(in srgb,var(--text-dim) 60%,transparent)}@keyframes marquee{to{transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}}.about-grid{display:grid;grid-template-columns:2fr 1fr;gap:3rem;align-items:center}.about-grid p{font-size:1.2rem;color:var(--text-dim)}.about-photo{width:100%;aspect-ratio:1;border-radius:1rem;object-fit:cover;display:block;background:linear-gradient(135deg,color-mix(in srgb,var(--accent-2) 20%,var(--surface)),color-mix(in srgb,var(--accent) 25%,var(--surface)))}.skill-group+.skill-group{margin-top:2rem}.skill-group h3{color:var(--text-dim);font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.85rem}.skills-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,max-content);gap:.75rem}.skills-grid li{display:flex;align-items:center;gap:.6rem;padding:.75rem 1.25rem;background:var(--surface);border:1px solid #222;border-radius:999px;font-family:var(--font-display);cursor:pointer;transition:border-color .2s,transform .2s}.skills-grid li:hover{border-color:var(--accent);transform:translateY(-3px)}.skill-icon{width:20px;height:20px}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.card{background:var(--surface);border:1px solid #222;border-radius:1rem;padding:1.25rem;display:flex;flex-direction:column;gap:.75rem;transition:border-color .2s,transform .2s;position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(280px circle at var(--mx, 50%) var(--my, 50%),color-mix(in srgb,var(--accent) 10%,transparent),transparent 70%);opacity:0;transition:opacity .3s;pointer-events:none}.card:hover:before{opacity:1}.card:hover{border-color:var(--accent);transform:translateY(-4px)}.card-thumb{width:100%;aspect-ratio:16 / 10;border-radius:.5rem;background:linear-gradient(135deg,#1d1d1d,#101010);object-fit:cover;display:block}.card p{color:var(--text-dim);font-size:.95rem}.card-links{display:flex;gap:1rem;margin-top:auto}.card-links a{color:var(--accent);font-size:.9rem}.card-links a:hover{text-decoration:underline}.contact{text-align:center}.contact p{color:var(--text-dim);margin-bottom:2rem}.contact-links{display:flex;justify-content:center;gap:1.5rem;margin-top:2rem}.contact-links a{color:var(--text-dim)}.contact-links a:hover{color:var(--accent)}.page-hero{padding-top:calc(var(--space) + 4rem)}.page-hero h1{font-size:clamp(2.5rem,7vw,5rem)}.project-meta{color:var(--text-dim);font-family:var(--font-display);margin-top:1rem}.project-cover{width:100%;aspect-ratio:21 / 9;object-fit:cover;border-radius:1rem;margin-top:3rem;display:block}.project-description p{font-size:1.2rem;color:var(--text-dim);max-width:44rem}.project-description p+p{margin-top:1.5rem}.project-video video{width:100%;border-radius:1rem;display:block}.gallery{columns:280px 3;gap:1rem}.gallery img{width:100%;border-radius:.75rem;margin-bottom:1rem;display:block}.featured-links{list-style:none;padding:0;display:flex;flex-direction:column;gap:.75rem}.featured-links a{color:var(--text-dim);transition:color .2s}.featured-links a:hover{color:var(--accent)}.featured-links a:before{content:"↗ ";color:var(--accent-2)}.footer{text-align:center;padding:2rem var(--pad-x);color:var(--text-dim);font-size:.85rem;border-top:1px solid #1c1c1c}.footer .credits{margin-top:.5rem;font-size:.7rem;opacity:.6}@media(max-width:700px){.about-grid{grid-template-columns:1fr}.nav nav{gap:1rem}.skills-grid{grid-template-columns:repeat(2,max-content)}}