:root{color-scheme:only light;--paper:#fffdf5;--yellow:#fbff48;--ink:#121212;--pink:#ff70a6;--blue:#73a7ff;--green:#62ef87}*{box-sizing:border-box}html{scroll-behavior:smooth}.showcase-page{margin:0;color:var(--ink);background:var(--paper);background-image:radial-gradient(#c7c6c0 1px,transparent 1px);background-size:20px 20px;font-family:'Space Grotesk',Arial,sans-serif}.show-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 4vw;border-bottom:3px solid;background:var(--paper)}.show-nav a{color:inherit;text-decoration:none}.brand{border:2px solid;padding:5px 12px;font-size:24px;font-weight:700;box-shadow:4px 4px black}.show-nav>div{display:flex;gap:20px;font:700 12px 'JetBrains Mono',monospace}.show-nav>div a:hover{background:var(--yellow)}.showcase-shell{max-width:1280px;margin:0 auto;padding:0 28px}.page-header{padding:35px 0 24px}.back-link,.plain-link{color:inherit;font:12px 'JetBrains Mono',monospace;display:inline-block;margin:8px 0 22px;text-underline-offset:4px}.page-title-row{display:flex;align-items:center;justify-content:space-between;gap:15px}.kicker{font:700 11px/1.5 'JetBrains Mono',monospace;letter-spacing:.7px;margin:10px 0 16px}.show-title{font-size:clamp(35px,6vw,76px);letter-spacing:-.055em;line-height:1;margin:10px 0 18px;font-weight:700;overflow-wrap:anywhere}.show-title span{background:var(--ink);color:white;padding:0 4px}.mono-copy{font:14px/1.7 'JetBrains Mono',monospace;max-width:780px}.gallery-controls{display:flex;gap:18px;align-items:center;margin:15px 0 22px}.search-label{flex:1}.search-label input{width:100%;border:2px solid black;background:white;padding:16px;font:12px 'JetBrains Mono',monospace;outline-offset:4px}.filter-buttons{display:flex;gap:10px}.filter-buttons button{border:2px solid;background:var(--paper);padding:14px;font:700 11px 'JetBrains Mono',monospace;cursor:pointer}.filter-buttons .active{background:black;color:white}.showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin:20px 0 48px}.neo-card{border:3px solid black;background:white;box-shadow:6px 6px black;transition:transform .2s,box-shadow .2s;position:relative;transform-style:preserve-3d}.gallery-card{padding:16px;width:100%;text-align:left;color:inherit;font:inherit;cursor:pointer;display:flex;flex-direction:column;min-height:100%;background:var(--card-color,#ff70a6)}.card-image{width:100%;height:180px;border:2px solid black;background:white;object-fit:contain;padding:6px;display:block}.card-number{display:flex;justify-content:space-between;font:700 11px 'JetBrains Mono',monospace;margin:0 0 15px}.gallery-card h2{font-size:25px;line-height:1.15;letter-spacing:-.7px;overflow-wrap:anywhere;margin:20px 0 12px}.card-meta{font:11px/1.6 'JetBrains Mono',monospace;margin:0 0 16px}.card-action{background:var(--paper);border:2px solid;text-align:center;padding:13px;font:700 11px 'JetBrains Mono',monospace;margin-top:auto;box-shadow:3px 3px black}.credential-symbol,.project-cover{height:160px;border:2px solid;display:flex;align-items:center;justify-content:center;flex-direction:column;background:var(--paper);font:700 34px 'JetBrains Mono',monospace}.credential-symbol small,.project-cover small{font:10px 'JetBrains Mono',monospace;margin-top:12px}.project-cover{background:var(--card-color)}.project-card{background:white}.project-card .card-meta{color:#454545}.card-image[aria-busy=true]{opacity:.5}.show-footer{background:black;color:white;padding:28px 4vw;display:flex;justify-content:space-between;align-items:center;font:700 23px 'Space Grotesk',sans-serif}.show-footer a{color:var(--yellow);font:12px 'JetBrains Mono',monospace}dialog{padding:0;border:3px solid black;box-shadow:10px 10px black;width:min(1080px,calc(100% - 36px));max-height:90dvh;background:var(--paper);color:var(--ink)}dialog::backdrop{background:rgba(18,18,18,.65);backdrop-filter:blur(3px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;background:var(--yellow);border-bottom:3px solid;padding:12px 20px;position:sticky;top:0;z-index:2;font:700 11px 'JetBrains Mono',monospace}.dialog-header button{background:var(--paper);border:2px solid;font-size:25px;cursor:pointer;width:38px;height:38px}.dialog-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:28px;padding:25px}.detail-image{width:100%;max-height:580px;object-fit:contain;background:white;border:2px solid;padding:8px}.detail-info h2{font:700 34px/1.05 'Space Grotesk',sans-serif;letter-spacing:-1px;margin:8px 0 24px}.detail-info p{font:12px/1.7 'JetBrains Mono',monospace}.detail-info dt{font:700 10px 'JetBrains Mono',monospace;color:#555;margin:19px 0 6px}.detail-info dd{font:13px/1.5 'JetBrains Mono',monospace;overflow-wrap:anywhere;margin:0}.neo-link{display:inline-flex;align-items:center;justify-content:center;gap:14px;background:var(--paper);border:2px solid black;color:black;text-decoration:none;padding:14px 20px;font:700 12px 'JetBrains Mono',monospace;box-shadow:4px 4px black;transition:transform .2s,box-shadow .2s;cursor:pointer}.neo-link:hover{transform:translate(3px,3px);box-shadow:1px 1px black;background:var(--yellow)}.neo-link:active{transform:translate(4px,4px);box-shadow:none}.dark-link{background:black;color:white}.detail-info .neo-link{display:flex;margin:17px 0}.detail-info .dark-link:hover{color:black}.project-graphic{background:var(--green);border:3px solid;padding:30px;display:flex;align-items:center;justify-content:center;font:700 50px 'Space Grotesk',sans-serif;min-height:280px;overflow-wrap:anywhere}.repo-preview{border:2px solid;padding:16px;background:white;font:12px/1.8 'JetBrains Mono',monospace}.repo-preview a{display:block;color:inherit;overflow-wrap:anywhere;text-decoration:underline}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.lc-section{background:var(--yellow);border-top:4px solid black;border-bottom:4px solid black;padding:50px 0;color:black}.lc-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}.lc-panel{padding:24px;background:var(--paper)}.lc-panel pre{font:700 16px/1.5 'JetBrains Mono',monospace;margin-bottom:24px}.lc-panel .neo-link{display:flex}.lc-panel .plain-link{margin:18px 0 0}.handle-chip{border:2px solid;background:white;padding:12px 18px;display:inline-block;font:700 19px 'JetBrains Mono',monospace;box-shadow:4px 4px black;margin-top:15px}.home-portals{display:flex;justify-content:center;gap:16px;position:relative;z-index:10;margin-top:26px;margin-bottom:65px}.home-portals .neo-link{background:var(--paper)}#mini-scene{width:140px;height:140px;position:relative;flex-shrink:0;display:grid;place-items:center}#mini-scene canvas{width:140px;height:140px}.css-cube{width:60px;height:60px;border:3px solid;background:var(--yellow);box-shadow:14px 14px 0 var(--pink),17px 17px 0 black;transform:rotate(-13deg);animation:cubeFloat 5s ease-in-out infinite}.reveal-card{animation:cardIn .45s ease-out both;animation-delay:var(--delay,0s)}@keyframes cardIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes cubeFloat{50%{transform:translateY(-8px) rotate(8deg)}}:focus-visible{outline:3px solid #3b82f6;outline-offset:5px}@media(hover:hover) and (pointer:fine){.neo-card:hover{box-shadow:12px 12px black;transform:translateY(-5px)}}@media(max-width:767px){.show-nav{padding:16px;gap:15px;flex-wrap:wrap}.brand{font-size:21px}.show-nav>div{font-size:10px;gap:16px;flex-wrap:wrap}.showcase-shell{padding:0 18px}.page-header{padding:24px 0 14px}.show-title{font-size:39px}.page-title-row{gap:10px}.page-title-row #mini-scene{width:70px;height:90px;position:absolute;right:20px;top:92px;opacity:.25;pointer-events:none}.page-title-row h1{position:relative;z-index:1}.css-cube{width:35px;height:35px}.mono-copy{font-size:12px}.gallery-controls{flex-wrap:wrap;gap:12px}.search-label{flex-basis:100%}.filter-buttons{flex-wrap:wrap}.filter-buttons button{font-size:10px;padding:10px}.showcase-grid{grid-template-columns:1fr;gap:22px}.gallery-card h2{font-size:26px}.card-image{height:210px}.dialog-layout{grid-template-columns:1fr;padding:16px;gap:24px}dialog{max-height:92dvh;width:calc(100% - 24px);box-shadow:5px 5px black}.dialog-header{padding:12px;font-size:9px}.detail-info h2{font-size:30px}.detail-image{max-height:330px}.show-footer{font-size:20px}.lc-layout{grid-template-columns:1fr;gap:28px}.lc-section{padding:32px 0}.home-portals{gap:12px;margin-top:22px;margin-bottom:60px}.home-portals .neo-link{padding:12px;font-size:10px}.project-graphic{min-height:220px;font-size:36px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal-card,.css-cube{animation:none}.neo-card,.neo-link{transition:none}#mini-scene canvas{display:none}}@media(min-width:768px) and (max-width:1100px){.showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Hover lab: paper layers, playful arrows and tactile controls. */
.gallery-card{isolation:isolate;overflow:hidden}
.reveal-card{animation-fill-mode:backwards}
.gallery-card::after{content:'';position:absolute;inset:0;pointer-events:none;border:9px solid transparent;transition:border-color .25s;z-index:0}
.card-image,.project-cover,.credential-symbol{transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .3s;position:relative;z-index:1}
.card-number>span{display:inline-block;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.card-action{position:relative;z-index:1;transition:transform .25s,box-shadow .25s,background .25s,color .25s;overflow:hidden}
.card-action::after{content:'';position:absolute;top:0;bottom:0;left:-55%;width:35%;background:rgba(255,255,255,.5);transform:skewX(-20deg);pointer-events:none}
.neo-link>span,.neo-link i{display:inline-block;transition:transform .3s}
.show-nav>div a,.back-link,.plain-link{position:relative}
.show-nav>div a::after,.back-link::after,.plain-link::after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:3px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.brand,.filter-buttons button,.dialog-header button{transition:transform .25s,box-shadow .25s,background .25s}
.search-label input{transition:box-shadow .25s,background .25s}
.search-label input:focus{background:#fffdf5;box-shadow:5px 5px black}
.gallery-card:focus-visible{outline:4px solid #121212;outline-offset:7px}
@keyframes paperShine{to{left:135%}}
@keyframes arrowNudge{50%{transform:translate(3px,-3px)}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .gallery-card:hover::after{border-color:rgba(255,255,255,.22)}
 .gallery-card:hover .card-image{transform:translateY(-3px) rotate(-1.2deg) scale(1.015);box-shadow:4px 5px black}
 .gallery-card:hover .project-cover,.gallery-card:hover .credential-symbol{transform:translateY(-4px) rotate(1.2deg);box-shadow:-4px 5px black}
 .gallery-card:hover .card-number>span{transform:translate(3px,-3px) rotate(9deg)}
 .gallery-card:hover .card-action{background:#121212;color:#fbff48;transform:translate(-2px,-2px);box-shadow:5px 5px black}
 .gallery-card:hover .card-action::after{animation:paperShine .65s ease-out both}
 .neo-link:hover>span,.neo-link:hover i{transform:translate(3px,-3px)}
 .show-nav>div a:hover::after,.back-link:hover::after,.plain-link:hover::after{transform:scaleX(1)}
 .brand:hover{background:var(--yellow);transform:rotate(-3deg) translateY(-2px);box-shadow:6px 6px black}
 .filter-buttons button:hover{transform:translateY(-3px);box-shadow:3px 4px black;background:var(--yellow);color:black}
 .dialog-header button:hover{transform:rotate(8deg);background:var(--pink);box-shadow:3px 3px black}
 /* Home stays cream/yellow, with lift and staggered inner movement. */
 body:not(.showcase-page) nav a{transition:transform .25s,background .25s,color .25s,box-shadow .25s}
 body:not(.showcase-page) nav a:hover{transform:translateY(-2px) rotate(-1deg)}
 body>section:first-of-type a{transition:transform .25s,box-shadow .25s,background .25s,color .25s}
 body>section:first-of-type a:hover i{animation:arrowNudge .45s ease-out 2}
 #skills .group{transition:transform .25s,box-shadow .25s,background .25s!important}
 #skills .group>div{transition:transform .25s,color .25s,opacity .25s}
 #skills .group:hover{transform:translateY(-6px) rotate(-2deg);box-shadow:6px 6px #62ef87;z-index:2}
 #skills .group:hover>div:first-child{opacity:1;transform:translateY(-3px)}
 #skills .group:hover>div:last-child{transform:translateY(2px) scale(1.08)}
 #about .group{transition:transform .35s,box-shadow .35s}
 #about .group:hover{transform:rotate(-2deg);box-shadow:10px 10px black}
 #about .group img{transition:filter .5s,transform .5s}
 #about .group:hover img{transform:scale(1.055)}
 #projects article,#work article{transition:transform .3s,box-shadow .3s}
 #projects article:hover,#work article:hover{transform:translateY(-6px);box-shadow:12px 12px black}
 #projects article img,#work article img{transition:transform .45s,opacity .45s}
 #projects article:hover img,#work article:hover img{transform:scale(1.035)}
 .lc-panel:hover{box-shadow:11px 11px black;transform:translateY(-5px) rotate(-.6deg)}
 .handle-chip{transition:transform .25s,box-shadow .25s}
 .handle-chip:hover{transform:rotate(-3deg) translateY(-3px);box-shadow:6px 6px black}
 .glitch-hover:hover{animation-iteration-count:2}
}
@media(hover:none),(pointer:coarse){
 .gallery-card:active,.neo-link:active,.filter-buttons button:active{transform:translate(2px,2px);box-shadow:1px 1px black}
 .gallery-card:active .card-action{background:black;color:#fbff48}
}
@media(prefers-reduced-motion:reduce){
 .gallery-card::after,.card-image,.project-cover,.credential-symbol,.card-number>span,.card-action,.neo-link>span,.neo-link i,.show-nav a,.back-link,.plain-link,.brand,.filter-buttons button,.dialog-header button,.search-label input{transition:none!important;animation:none!important}
 .card-action::after{display:none}
 .gallery-card:hover,.neo-link:hover,.gallery-card:active,.neo-link:active,.filter-buttons button:active{transform:none!important}
 .glitch-hover:hover{animation:none!important;transform:none!important}
}