.scroll-progress{position:fixed;inset:0 0 auto;z-index:100;height:2px;pointer-events:none}.scroll-progress i{display:block;width:0;height:100%;background:var(--red);box-shadow:0 0 14px var(--red)}
.navin{display:grid;grid-template-columns:1fr auto 1fr}.brand{justify-self:start}.links{justify-self:center}.nav-actions{justify-self:end;display:flex;align-items:center;gap:10px}.icon-link,.social-dock a{display:grid;place-items:center;color:var(--text);border:1px solid var(--line);background:rgba(18,21,24,.94);transition:.2s}.icon-link{width:40px;height:40px}.icon-link:hover,.social-dock a:hover{color:#fff;border-color:var(--red);background:var(--red);transform:translateY(-2px)}.icon-link svg,.social-dock svg{width:19px;height:19px;fill:currentColor}
.social-dock{position:fixed;right:22px;bottom:22px;z-index:19;display:flex;gap:8px;padding:8px;border:1px solid var(--line);background:rgba(11,13,15,.88);backdrop-filter:blur(16px);box-shadow:0 14px 40px rgba(0,0,0,.28)}.social-dock a{width:40px;height:40px;text-decoration:none}
.principle{appearance:none;background:var(--panel);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background .2s,border-color .2s}.principle:hover,.principle.active{background:#1d1819}.principle.active{box-shadow:inset 0 -3px var(--red)}.workflow-readout{margin-top:18px;padding:22px 26px;border:1px solid var(--line);display:grid;grid-template-columns:150px 1fr 80px;gap:22px;align-items:center;background:#08090a}.workflow-readout span{font:.72rem ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--red);letter-spacing:.12em}.workflow-readout h3{margin:0 0 4px}.workflow-readout p{margin:0;color:var(--muted)}.workflow-readout i{height:2px;background:var(--red);animation:pulse-line 1.8s ease-in-out infinite}@keyframes pulse-line{50%{opacity:.25;transform:scaleX(.55)}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}.reveal.is-visible{opacity:1;transform:none}.work{--mx:50%;--my:50%;background:radial-gradient(500px circle at var(--mx) var(--my),rgba(255,73,63,.09),transparent 45%),var(--panel)}
@media(max-width:850px){.navin{grid-template-columns:auto 1fr auto}.nav-actions{grid-column:3}.links{grid-column:1/-1;justify-self:stretch}.workflow-readout{grid-template-columns:1fr}.workflow-readout i{width:80px}.social-dock{right:auto;left:50%;transform:translateX(-50%);bottom:12px}.footer{padding-bottom:92px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.workflow-readout i{animation:none}}
.capability-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line)}.capability{padding:34px;min-height:260px;border-right:1px solid var(--line);background:var(--panel)}.capability:last-child{border:0}.capability>span,.timeline article span{color:var(--red);font:.72rem ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.12em}.capability h3{font-size:1.35rem;margin:48px 0 12px}.capability p,.timeline p{color:var(--muted)}.skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}.skill-grid>div{border:1px solid var(--line);padding:26px}.skill-grid h3{margin-top:0}.skill-grid ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}.skill-grid li{border:1px solid var(--line);padding:6px 9px;color:#c5ccd2;font:.76rem ui-monospace,SFMono-Regular,Menlo,monospace}.timeline{border-top:1px solid var(--line);margin-top:48px}.timeline article{display:grid;grid-template-columns:220px 1fr;gap:30px;padding:28px 0;border-bottom:1px solid var(--line)}.timeline time{color:var(--muted);font:.8rem ui-monospace,SFMono-Regular,Menlo,monospace}.timeline h3{margin:5px 0;font-size:1.35rem}
@media(max-width:850px){.capability-grid,.skill-grid{grid-template-columns:1fr}.capability{border-right:0;border-bottom:1px solid var(--line)}.timeline article{grid-template-columns:1fr;gap:8px}}
.project-collection{margin-top:28px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,transparent)}.collection-head{min-height:72px;padding:18px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.collection-head>div{display:flex;align-items:center;gap:12px}.collection-head b{text-transform:uppercase;letter-spacing:.1em;font:700 .8rem ui-monospace,SFMono-Regular,Menlo,monospace}.collection-head small{color:var(--muted)}.collection-index{display:grid;place-items:center;width:32px;height:28px;background:color-mix(in srgb,var(--red) 14%,transparent);color:var(--red);font:.72rem ui-monospace,SFMono-Regular,Menlo,monospace}.live-pulse{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px color-mix(in srgb,var(--green) 14%,transparent);animation:live-pulse 1.8s infinite}@keyframes live-pulse{50%{box-shadow:0 0 0 10px transparent}}.live-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.live-card{min-height:330px;padding:32px;border-right:1px solid var(--line)}.live-card:nth-child(even),.live-card:last-child{border-right:0}.live-card-top{display:flex;justify-content:space-between;color:var(--muted);font:.7rem ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}.live-card-top .online{color:var(--green)}.live-card h3{font-size:clamp(1.7rem,3vw,2.6rem);line-height:1;margin:55px 0 14px}.live-card p{color:var(--muted)}.project-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px}.project-actions .btn{margin:0}.live-link{color:var(--green)}.editorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.editorial-project{padding:24px;border-right:1px solid var(--line)}.editorial-project:nth-child(even),.editorial-project:last-child{border-right:0}.editorial-media{height:260px;position:relative;overflow:hidden;margin-bottom:24px;background:#08090a}.editorial-media img{width:100%;height:100%;object-fit:cover;transition:.45s}.editorial-project:hover img{transform:scale(1.035)}.editorial-media>span{position:absolute;left:12px;bottom:12px;padding:7px 9px;background:rgba(8,9,10,.85);color:#fff;font:.7rem ui-monospace,SFMono-Regular,Menlo,monospace}.editorial-project>div>small{color:var(--red);font:.7rem ui-monospace,SFMono-Regular,Menlo,monospace}.editorial-project h3{font-size:1.6rem;margin:10px 0}.editorial-project p{color:var(--muted)}.lab-browser{display:grid;grid-template-columns:.85fr 1.15fr;min-height:530px}.lab-list{border-right:1px solid var(--line);padding:20px}.lab-path{padding:10px 12px;margin-bottom:10px;color:var(--muted);background:color-mix(in srgb,var(--bg) 75%,transparent);font:.75rem ui-monospace,SFMono-Regular,Menlo,monospace}.lab-item{width:100%;display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;padding:17px 14px;border:1px solid var(--line);border-radius:0;background:transparent;color:var(--text);text-align:left;margin-bottom:8px}.lab-item:hover,.lab-item.active{background:color-mix(in srgb,var(--red) 10%,var(--panel));border-color:var(--red)}.lab-item>span,.lab-item>i{color:var(--red);font:normal .72rem ui-monospace,SFMono-Regular,Menlo,monospace}.lab-item b,.lab-item small{display:block}.lab-item small{font-size:.75rem}.lab-stats{display:flex;gap:22px;margin:22px 4px 0;color:var(--muted);font:.72rem ui-monospace,SFMono-Regular,Menlo,monospace}.lab-stats b{color:var(--text)}.lab-preview{padding:30px;display:flex;flex-direction:column}.lab-preview-media{height:240px;overflow:hidden;background:#08090a;margin-bottom:28px}.lab-preview-media img{width:100%;height:100%;object-fit:cover}.lab-preview>span{color:var(--red);font:.72rem ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.1em}.lab-preview h3{font-size:2rem;margin:10px 0}.lab-preview p{color:var(--muted)}.is-hidden{display:none!important}
@media(max-width:850px){.live-grid,.editorial-grid,.lab-browser{grid-template-columns:1fr}.live-card,.editorial-project,.lab-list{border-right:0;border-bottom:1px solid var(--line)}.collection-head{align-items:flex-start;flex-direction:column}.lab-preview-media,.editorial-media{height:auto;aspect-ratio:16/10}}
@media(max-width:520px){.live-card,.lab-preview{padding:24px}.lab-list{padding:12px}.lab-item{grid-template-columns:30px 1fr auto}.project-actions .btn{width:100%;justify-content:center}}
:root{color-scheme:light;--bg:#f8fafc;--panel:#fff;--panel2:#eff6ff;--text:#1e293b;--muted:#64748b;--line:#dbeafe;--red:#2563eb;--red2:#1d4ed8;--green:#059669}html[data-theme=dark]{color-scheme:dark;--bg:#0b0d0f;--panel:#121518;--panel2:#181c20;--text:#f3f5f7;--muted:#9ca6af;--line:#293038;--red:#ff493f;--red2:#8f241f;--green:#78e3b0}body:before{opacity:.055;background-image:linear-gradient(rgba(37,99,235,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.35) 1px,transparent 1px)}html[data-theme=dark] body:before{opacity:.045;background-image:linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px)}.nav{background:rgba(248,250,252,.9)}html[data-theme=dark] .nav{background:rgba(11,13,15,.88)}.lead,.about-copy p{color:#475569}.work p,.principle p,.case-body p,.case-body li{color:var(--muted)}html[data-theme=dark] .lead,html[data-theme=dark] .about-copy p{color:#c5ccd2}.tag,.skill-grid li{color:var(--text)}.terminal{background:#070809;color:#f3f5f7}.contact-box{background:linear-gradient(135deg,#dbeafe,#fff 65%);border-color:#93c5fd}html[data-theme=dark] .contact-box{background:linear-gradient(135deg,#32100e,#121518 65%);border-color:#59201c}.icon-link,.theme-toggle,.social-dock a{color:var(--text);background:color-mix(in srgb,var(--panel) 94%,transparent)}.social-dock{background:color-mix(in srgb,var(--bg) 88%,transparent)}.theme-toggle{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);cursor:pointer;transition:.2s}.theme-toggle:hover{color:#fff;border-color:var(--red);background:var(--red);transform:translateY(-2px)}.theme-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.theme-toggle .moon-icon{display:none;fill:currentColor;stroke:none}html[data-theme=dark] .theme-toggle .sun-icon{display:none}html[data-theme=dark] .theme-toggle .moon-icon{display:block}.portrait{width:100%;overflow:hidden}.portrait img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;filter:none}