:root{--pink:#ff1493;--pink2:#ff3aad;--ink:#08070a;--panel:#100b12;--paper:#eee9df;--muted:#9a919d}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:white;font-family:Inter,Arial,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(rgba(255,20,147,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,20,147,.025) 1px,transparent 1px);background-size:42px 42px;pointer-events:none;z-index:-1}
.noise{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}
.topbar{height:76px;padding:0 4vw;display:flex;align-items:center;border-bottom:1px solid #2b1726;position:relative;z-index:10;background:rgba(8,7,10,.9)}
.brand{font-family:"Barlow Condensed";font-size:22px;font-weight:800;letter-spacing:.08em;color:white;text-decoration:none}.brand span{color:var(--pink)}
nav{display:flex;gap:28px;margin-left:auto}nav a{font-family:"Barlow Condensed";font-weight:600;font-size:13px;letter-spacing:.12em;color:#aaa;text-decoration:none;position:relative}nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--pink);transition:.25s}nav a:hover{color:white}nav a:hover:after{right:0}
.status{font:600 10px Inter;margin-left:28px;color:#777;letter-spacing:.12em}.status i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--pink);box-shadow:0 0 12px var(--pink);margin-right:7px}
.hero{min-height:720px;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:4vw;padding:70px 6vw 65px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:480px;height:480px;border:1px solid rgba(255,20,147,.12);transform:rotate(45deg);right:-220px;top:120px}
.eyebrow,.section-index,.microline{font:600 10px Inter;letter-spacing:.17em;color:#8b7d8b;display:flex;align-items:center;gap:14px}.eyebrow b{color:var(--pink)}
h1,h2{font-family:"Barlow Condensed";font-weight:800;line-height:.84;letter-spacing:-.035em;margin:28px 0}h1{font-size:clamp(68px,7.8vw,128px)}h1 em,h2 b{font-style:normal;color:var(--pink);text-shadow:0 0 25px rgba(255,20,147,.14)}
.hero-copy>p{font:400 20px "Barlow Condensed";letter-spacing:.08em;color:#c7bdc6}.microline{margin-top:65px;justify-content:space-between;max-width:520px;border-top:1px solid #31212e;padding-top:12px}
.portal-wrap{max-width:710px;width:100%;justify-self:end}.portal-title{display:flex;justify-content:space-between;align-items:end;margin:0 18px 12px}.portal-title strong{font:800 42px "Barlow Condensed";font-style:italic;color:var(--pink);letter-spacing:-.04em}.portal-title span{font:600 9px Inter;letter-spacing:.2em;color:#786c78}
.portal{aspect-ratio:1.42;position:relative;overflow:hidden;background:#0b0710;border:1px solid rgba(255,20,147,.65);box-shadow:0 0 0 6px #0b080d,0 0 0 7px rgba(255,20,147,.24),0 24px 80px rgba(0,0,0,.55),inset 0 0 50px rgba(255,20,147,.08);clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,18px 100%,0 calc(100% - 18px),0 18px)}
.portal img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.06) contrast(1.04)}
.portal-grid{position:absolute;inset:0;background:linear-gradient(rgba(255,20,147,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,20,147,.08) 1px,transparent 1px);background-size:12.5% 16.66%;pointer-events:none}
.scan{position:absolute;inset:-100% 0;background:linear-gradient(transparent 48%,rgba(255,20,147,.12) 50%,transparent 52%);animation:scan 5s linear infinite;pointer-events:none}@keyframes scan{to{transform:translateY(100%)}}
.corner{position:absolute;width:42px;height:42px;border-color:#ff4ab0;filter:drop-shadow(0 0 5px var(--pink))}.tl{left:12px;top:12px;border-left:2px solid;border-top:2px solid}.tr{right:12px;top:12px;border-right:2px solid;border-top:2px solid}.bl{left:12px;bottom:12px;border-left:2px solid;border-bottom:2px solid}.br{right:12px;bottom:12px;border-right:2px solid;border-bottom:2px solid}
.hud{position:absolute;font:700 8px Inter;letter-spacing:.13em;color:#ff8fca;background:rgba(7,5,9,.72);padding:5px 7px;border-left:1px solid var(--pink)}.h1{left:18px;top:62px}.h2{left:18px;top:88px}.h3{right:18px;bottom:18px}
.category-strip{padding:55px 6vw 90px;background:#0b090c;border-top:1px solid #281522}.section-index span{height:1px;width:65px;background:var(--pink);box-shadow:0 0 7px var(--pink)}
.categories{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:28px}.categories button{min-height:125px;text-align:left;padding:22px 20px;background:#110c12;color:white;border:1px solid #402038;position:relative;cursor:pointer;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:.22s}.categories button:before,.categories button:after{content:"";position:absolute;background:var(--pink);transition:.22s}.categories button:before{height:1px;width:28px;top:0;left:10px}.categories button:after{width:1px;height:28px;left:0;top:10px}.categories button:hover{background:#1a0b16;border-color:var(--pink);transform:translateY(-4px);box-shadow:0 10px 30px rgba(255,20,147,.12)}.categories small{display:block;color:var(--pink);font:700 9px Inter}.categories span{display:block;margin-top:18px;font:700 26px "Barlow Condensed";letter-spacing:.03em}.categories i{display:block;margin-top:8px;font:600 8px Inter;font-style:normal;color:#756b75;letter-spacing:.15em}
.statement,.darkband,.about,.contact{padding:100px 7vw}.statement{background:var(--paper);color:#121014}.statement .section-index{color:#817a7e}.statement h2,.darkband h2,.contact h2{font-size:clamp(58px,7vw,105px);max-width:900px}.statement p,.darkband p,.about p{max-width:620px;font-size:17px;line-height:1.8;color:#777}
.darkband{background:#0b090c}.darkband>span,.about>span,.contact>span{font:600 10px Inter;color:var(--pink);letter-spacing:.18em}.about{background:#171018;display:flex;justify-content:space-between;gap:40px}.about p{margin:0;color:#b7abb6}
.contact{background:#050406;text-align:center}.contact h2{margin-left:auto;margin-right:auto}.contact button,.send{background:transparent;border:1px solid var(--pink);color:white;padding:16px 28px;font:700 11px Inter;letter-spacing:.14em;cursor:pointer;box-shadow:inset 0 0 0 0 var(--pink);transition:.25s}.contact button:hover,.send:hover{box-shadow:inset 220px 0 0 0 var(--pink)}
footer{padding:25px 5vw;border-top:1px solid #2b1726;display:flex;justify-content:space-between;font:600 9px Inter;letter-spacing:.15em;color:#675e67}footer b{color:var(--pink)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:50;display:none;align-items:center;justify-content:center;padding:24px}.modal.open{display:flex}.modal-card{width:min(900px,95vw);background:#100c11;border:1px solid var(--pink);padding:32px;position:relative;box-shadow:0 0 80px rgba(255,20,147,.12)}.close{position:absolute;right:14px;top:8px;border:0;background:none;color:var(--pink);font-size:30px;cursor:pointer}.gallery-placeholder{height:330px;margin-top:25px;border:1px dashed #4a2740;display:grid;place-items:center;color:#766b75}.form{width:min(520px,95vw)}.form h3{font:800 38px "Barlow Condensed";color:var(--pink)}.form label{display:block;font:600 9px Inter;letter-spacing:.14em;color:#a594a2;margin:18px 0}.form input,.form textarea{width:100%;margin-top:8px;background:#09070a;border:1px solid #37212f;color:white;padding:13px;font:14px Inter}.form textarea{height:130px}.formStatus{font-size:12px;color:#aaa}
@media(max-width:900px){nav{display:none}.status{margin-left:auto}.hero{grid-template-columns:1fr;padding-top:45px}.portal-wrap{justify-self:center}.microline{margin-top:35px}.categories{grid-template-columns:1fr 1fr}.hero{min-height:auto}.about{display:block}.about p{margin-top:30px}}
@media(max-width:560px){.topbar{padding:0 20px}.status{display:none}.hero{padding:40px 20px}.categories{grid-template-columns:1fr}.category-strip{padding-left:20px;padding-right:20px}.portal-title strong{font-size:30px}.portal-title span{font-size:7px}h1{font-size:65px}}

/* V2 — discipline-style CTA and contact system */
.contact button,.send{
  min-width:220px; min-height:62px; position:relative; text-align:left;
  padding:17px 22px 15px; background:#110c12; color:#fff;
  border:1px solid #402038; clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  box-shadow:none; font:700 13px "Barlow Condensed"; letter-spacing:.12em;
}
.contact button:before,.contact button:after,.send:before,.send:after{content:"";position:absolute;background:var(--pink);transition:.22s}
.contact button:before,.send:before{height:1px;width:30px;left:10px;top:0}
.contact button:after,.send:after{width:1px;height:30px;left:0;top:10px}
.contact button:hover,.send:hover{background:#1a0b16;border-color:var(--pink);transform:translateY(-3px);box-shadow:0 10px 30px rgba(255,20,147,.12)}
#contactModal .modal-card.form{clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);border:1px solid #542044;background:linear-gradient(145deg,#120c13,#09070a);box-shadow:0 0 0 6px #080609,0 0 0 7px rgba(255,20,147,.22),0 24px 80px rgba(0,0,0,.65)}
#contactModal .modal-card.form:before{content:"07 / CONTACT CHANNEL";display:block;color:var(--pink);font:700 9px Inter;letter-spacing:.18em;margin-bottom:12px}
#contactModal .form h3{margin:0 0 26px;font-size:46px;letter-spacing:-.02em}
#contactModal .form label{position:relative}
#contactModal .form input,#contactModal .form textarea{border:1px solid #3d2034;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);outline:none;transition:.2s}
#contactModal .form input:focus,#contactModal .form textarea:focus{border-color:var(--pink);box-shadow:0 0 18px rgba(255,20,147,.08)}
#contactModal .send{width:100%;margin-top:4px}
#contactModal #formStatus{font:600 9px Inter;letter-spacing:.12em;color:#8d7c89;min-height:14px}

/* Corrected transparent-PNG Pinky pass */
html,body,a,button,.portal,.categories button,.contact button,.close{cursor:url("../cursor/alien-pink.png") 3 4,auto}
input,textarea{cursor:text}
.portal{background:radial-gradient(circle at 50% 44%,rgba(255,20,147,.14),transparent 40%),linear-gradient(135deg,#120713,#070609 58%,#130817)}
.portal #pinkyPose{position:absolute;inset:10%;width:80%;height:80%;object-fit:contain;object-position:center;z-index:1;filter:saturate(1.04) contrast(1.02) drop-shadow(0 0 14px rgba(255,20,147,.12))}
.portal-grid,.scan,.corner,.hud{z-index:3}
.glitch-word,.glitch-brand{position:relative;display:inline-block}
.glitch-word:before,.glitch-word:after,.glitch-brand:before,.glitch-brand:after{content:attr(data-text);position:absolute;inset:0;opacity:0;pointer-events:none}
.is-glitching:before{opacity:.8;color:#00e5ff;transform:translate(-3px,1px);clip-path:polygon(0 8%,100% 8%,100% 34%,0 34%);animation:gA .46s steps(2,end)}
.is-glitching:after{opacity:.85;color:#ff1493;transform:translate(3px,-1px);clip-path:polygon(0 58%,100% 58%,100% 84%,0 84%);animation:gB .46s steps(2,end)}
.is-glitching{animation:gMain .46s steps(2,end)}
@keyframes gMain{0%,100%{transform:none}20%{transform:translateX(-2px)}38%{transform:translateX(3px)}56%{transform:translateX(-1px)}}
@keyframes gA{0%,100%{transform:translate(-3px,1px)}35%{transform:translate(5px,-1px)}65%{transform:translate(-4px,2px)}}
@keyframes gB{0%,100%{transform:translate(3px,-1px)}35%{transform:translate(-5px,1px)}65%{transform:translate(5px,-2px)}}


/* Neon Dodge Easter egg — isolated portal overlay */
.pinky-title-group{display:flex;align-items:center;gap:12px;min-width:0}
.pinky-label{position:relative;display:inline-block}
.pinky-label:before,.pinky-label:after{content:attr(data-text);position:absolute;inset:0;opacity:0;pointer-events:none}
.pinky-label.is-glitching:before{opacity:.8;color:#00e5ff;transform:translate(-3px,1px);clip-path:polygon(0 8%,100% 8%,100% 34%,0 34%);animation:gA .46s steps(2,end)}
.pinky-label.is-glitching:after{opacity:.85;color:#ff1493;transform:translate(3px,-1px);clip-path:polygon(0 58%,100% 58%,100% 84%,0 84%);animation:gB .46s steps(2,end)}
.arcade-toggle{width:36px;height:30px;padding:0;border:1px solid #542044;background:#100b12;display:grid;place-items:center;cursor:url("../cursor/alien-pink.png") 3 4,auto;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);transition:.18s;position:relative}
.arcade-toggle:hover,.arcade-toggle[aria-pressed="true"]{border-color:var(--pink);background:#1a0b16;box-shadow:0 0 14px rgba(255,20,147,.24);transform:translateY(-1px)}
.pixel-pad{position:relative;width:22px;height:13px;display:block;border:2px solid var(--pink);border-radius:3px;filter:drop-shadow(0 0 3px rgba(255,20,147,.7))}
.pixel-pad:before,.pixel-pad:after{content:"";position:absolute;background:var(--pink)}
.pixel-pad:before{width:7px;height:2px;left:3px;top:4px}.pixel-pad:after{width:2px;height:7px;left:5px;top:2px}
.pixel-pad i,.pixel-pad b{position:absolute;width:3px;height:3px;background:var(--pink);right:3px;border-radius:50%}.pixel-pad i{top:2px}.pixel-pad b{bottom:2px}.pixel-pad em{display:none}
.neon-dodge-frame{position:absolute;inset:0;width:100%;height:100%;border:0;margin:0;padding:0;display:block;background:#020104;z-index:4;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease;clip-path:inherit}
.portal.arcade-active .neon-dodge-frame{opacity:1;visibility:visible;pointer-events:auto}
.portal.arcade-active #pinkyPose,.portal.arcade-active .portal-grid,.portal.arcade-active .scan,.portal.arcade-active .hud{opacity:0;visibility:hidden;pointer-events:none}
.portal.arcade-active .corner{z-index:7;border-color:#fff;filter:drop-shadow(0 0 5px rgba(255,255,255,.65));pointer-events:none}
.portal.arcade-active{background:#020104}
.portal #pinkyPose,.portal-grid,.scan,.hud{transition:opacity .16s ease}
@media(max-width:560px){.pinky-title-group{gap:8px}.arcade-toggle{width:32px;height:27px}}


/* Top-right audio execute control — compact Variant C, quiet idle / hot-pink hover */
.audio-status{
  position:relative;
  isolation:isolate;
  font:600 13px "Barlow Condensed",sans-serif;
  margin-left:22px;
  width:105px;
  height:25px;
  padding:0 8px 0 10px;
  color:#85858b;
  letter-spacing:.12em;
  background:transparent;
  border:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  cursor:url("../cursor/alien-pink.png") 3 4,auto;
  transition:color .18s ease,filter .18s ease,background .18s ease;
  clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px);
}
.audio-status::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:#56565d;
  clip-path:inherit;
  transition:background .18s ease,box-shadow .18s ease;
}
.audio-status::after{
  content:"";
  position:absolute;
  inset:1px;
  z-index:-1;
  background:rgba(2,2,3,.88);
  clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px);
}
.audio-status:hover{color:var(--pink);filter:drop-shadow(0 0 7px rgba(255,20,147,.52))}
.audio-status:hover::before{background:var(--pink)}
.audio-status:focus-visible{outline:1px solid var(--pink);outline-offset:3px}
.audio-label{line-height:1;white-space:nowrap;position:relative;z-index:2}
.audio-indicator{width:12px;height:12px;display:inline-flex;align-items:flex-end;justify-content:center;gap:2px;position:relative;z-index:2;flex:0 0 12px}
.audio-indicator i{display:block;width:6px;height:6px;border-radius:50%;background:#707077;box-shadow:none;margin:auto;transition:background .18s ease,box-shadow .18s ease}
.audio-status:hover .audio-indicator i{background:var(--pink);box-shadow:0 0 8px rgba(255,20,147,.72)}
.audio-indicator b,.audio-indicator em{display:none}
.audio-status.is-playing{color:var(--pink);filter:drop-shadow(0 0 5px rgba(255,20,147,.34))}
.audio-status.is-playing::before{background:var(--pink)}
.audio-status.is-playing::after{background:rgba(2,2,3,.94)}
.audio-status.is-playing .audio-indicator{width:15px;height:12px;gap:2px;flex-basis:15px}
.audio-status.is-playing .audio-indicator i,.audio-status.is-playing .audio-indicator b,.audio-status.is-playing .audio-indicator em{display:block;width:3px;border-radius:0;background:var(--pink);box-shadow:0 0 6px rgba(255,20,147,.72);margin:0;transform-origin:bottom;animation:audioEq .48s steps(5,end) infinite}
.audio-status.is-playing .audio-indicator i{height:6px;animation-delay:-.08s}.audio-status.is-playing .audio-indicator b{height:11px;animation-delay:-.31s}.audio-status.is-playing .audio-indicator em{height:8px;animation-delay:-.17s}
@keyframes audioEq{0%,100%{transform:scaleY(.28)}20%{transform:scaleY(.72)}42%{transform:scaleY(1)}65%{transform:scaleY(.46)}82%{transform:scaleY(.86)}}
@media(max-width:900px){.audio-status{margin-left:auto}}
@media(max-width:560px){.audio-status{display:none}}
@media(prefers-reduced-motion:reduce){.audio-status.is-playing .audio-indicator i,.audio-status.is-playing .audio-indicator b,.audio-status.is-playing .audio-indicator em{animation:none}}


/* Sketch portfolio gallery */
#galleryModal{overflow:auto;align-items:flex-start;padding:4vh 24px}
#galleryModal .gallery-card{width:min(1320px,96vw);margin:auto;padding:32px 32px 38px;background:linear-gradient(145deg,#100c11,#080709);border-color:#48203b;box-shadow:0 24px 100px rgba(0,0,0,.78),0 0 0 1px rgba(255,20,147,.12)}
.gallery-content{margin-top:24px}
.sketch-gallery{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:96px;gap:12px}
.sketch-tile{position:relative;overflow:hidden;border:1px solid #34232f;background:#0a080a;padding:0;min-height:0;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);cursor:pointer}
.sketch-tile:nth-child(1){grid-column:span 7;grid-row:span 4}.sketch-tile:nth-child(2){grid-column:span 5;grid-row:span 4}.sketch-tile:nth-child(3){grid-column:span 5;grid-row:span 4}.sketch-tile:nth-child(4){grid-column:span 7;grid-row:span 4}.sketch-tile:nth-child(5){grid-column:span 7;grid-row:span 4}.sketch-tile:nth-child(6){grid-column:span 5;grid-row:span 4}
.sketch-tile img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .35s;filter:saturate(.82) contrast(1.02)}
.sketch-tile:after{content:"VIEW / EXPAND +";position:absolute;right:12px;bottom:10px;padding:6px 8px;background:rgba(7,5,7,.82);border:1px solid rgba(255,20,147,.55);color:#ff1493;font:700 8px Inter;letter-spacing:.14em;opacity:0;transform:translateY(6px);transition:.22s}
.sketch-tile:hover{border-color:#ff1493;box-shadow:0 0 24px rgba(255,20,147,.12)}.sketch-tile:hover img{transform:scale(1.025);filter:saturate(1) contrast(1.05)}.sketch-tile:hover:after{opacity:1;transform:none}
.sketch-lightbox{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.94);display:none;align-items:center;justify-content:center;padding:44px 70px;backdrop-filter:blur(7px)}
.sketch-lightbox.open{display:flex}.sketch-lightbox figure{margin:0;max-width:min(1380px,88vw);max-height:90vh;display:flex;flex-direction:column;align-items:center}.sketch-lightbox img{display:block;max-width:100%;max-height:82vh;object-fit:contain;border:1px solid #47233d;box-shadow:0 30px 100px rgba(0,0,0,.85),0 0 50px rgba(255,20,147,.08)}
.sketch-lightbox figcaption{width:100%;display:flex;justify-content:space-between;padding-top:10px;color:#756b75;font:600 8px Inter;letter-spacing:.16em}.sketch-lightbox figcaption b{color:#ff1493}
.sketch-lightbox-close{position:absolute;top:22px;right:28px;border:1px solid #4b3344;background:#090709;color:#aaa;width:34px;height:34px;font-size:22px;cursor:pointer}.sketch-lightbox-close:hover{color:#ff1493;border-color:#ff1493}
.sketch-lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:64px;background:rgba(10,7,10,.82);border:1px solid #3b2635;color:#8c7d88;font-size:34px;cursor:pointer}.sketch-lightbox-nav:hover{color:#ff1493;border-color:#ff1493}.sketch-lightbox-nav.prev{left:18px}.sketch-lightbox-nav.next{right:18px}
@media(max-width:800px){.sketch-gallery{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.sketch-tile:nth-child(n){grid-column:span 1;grid-row:span 1}.sketch-lightbox{padding:55px 18px}.sketch-lightbox-nav{display:none}}
@media(max-width:520px){#galleryModal .gallery-card{padding:24px 14px}.sketch-gallery{grid-template-columns:1fr;grid-auto-rows:auto}.sketch-tile:nth-child(n){aspect-ratio:16/10}.sketch-tile img{object-fit:cover}}

/* Sketch lightbox information panel */
.sketch-image-stage{position:relative;display:flex;align-items:center;justify-content:center;max-width:100%;max-height:82vh}
.sketch-image-stage>img{max-width:100%;max-height:82vh}
.sketch-info-toggle{position:absolute;top:12px;right:12px;z-index:4;width:28px;height:28px;padding:0;border:1px solid rgba(255,20,147,.72);background:rgba(5,5,7,.78);color:#ff1493;font:700 13px/26px Inter,Arial,sans-serif;text-align:center;cursor:pointer;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);transition:border-color .2s,background .2s,box-shadow .2s,color .2s}
.sketch-info-toggle:hover,.sketch-info-toggle[aria-expanded="true"]{background:rgba(255,20,147,.1);border-color:#ff1493;color:#fff;box-shadow:0 0 18px rgba(255,20,147,.28)}
.sketch-info-panel{position:absolute;top:48px;right:12px;z-index:3;width:min(360px,calc(100% - 24px));box-sizing:border-box;padding:0 14px;max-height:0;overflow:hidden;opacity:0;transform:translateY(-6px);background:rgba(5,5,7,.9);border:1px solid transparent;color:#c8bec6;backdrop-filter:blur(8px);transition:max-height .3s ease,opacity .22s ease,transform .3s ease,padding .3s ease,border-color .3s ease}
.sketch-info-panel.open{max-height:220px;padding:12px 14px 14px;opacity:1;transform:none;border-color:#ff1493;box-shadow:0 14px 34px rgba(0,0,0,.42)}
.sketch-info-label{display:block;margin-bottom:7px;color:#ff1493;font:700 8px Inter,Arial,sans-serif;letter-spacing:.18em}
.sketch-info-panel p{margin:0;color:#d6cdd3;font:400 11px/1.55 Inter,Arial,sans-serif;letter-spacing:.02em}
@media(max-width:520px){.sketch-info-toggle{top:8px;right:8px}.sketch-info-panel{top:42px;right:8px;width:calc(100% - 16px)}}

/* 03 / PROCESS: isolated four-stage accordion; never changes other section dimensions */
.process-accordion{display:flex;width:100%;height:clamp(320px,40vw,570px);overflow:hidden;isolation:isolate;margin-top:38px;--process-cut:28px;background:#d8d6d3}
.process-panel{appearance:none;position:relative;display:block;flex:1 1 0%;min-width:0;height:100%;padding:0;margin:0 0 0 calc(-1 * var(--process-cut));border:0;border-radius:0;overflow:hidden;clip-path:polygon(var(--process-cut) 0,100% 0,calc(100% - var(--process-cut)) 100%,0 100%);background:#b7b3b2;cursor:pointer;transition:flex-grow .7s cubic-bezier(.2,.75,.2,1);text-align:left}
.process-panel:first-child{margin-left:0;clip-path:polygon(0 0,100% 0,calc(100% - var(--process-cut)) 100%,0 100%)}
.process-panel:last-child{clip-path:polygon(var(--process-cut) 0,100% 0,100% 100%,0 100%)}
.process-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;filter:grayscale(.85) brightness(.76);transition:filter .45s,transform .7s}
.process-panel:hover img,.process-panel:focus-visible img{filter:grayscale(.2) brightness(.96);transform:scale(1.025)}
.process-panel.is-active{flex-grow:27}
.process-panel.is-active img{filter:none}
.process-panel:focus-visible{outline:2px solid #ff1493;outline-offset:-5px}
.process-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.66),transparent 37%);pointer-events:none}
.process-panel-label{position:absolute;z-index:2;bottom:23px;left:clamp(20px,3vw,45px);font-family:inherit;font-weight:800;font-size:clamp(11px,1vw,15px);letter-spacing:.1em;color:#fff;white-space:nowrap;text-shadow:0 2px 12px #000}
.process-panel-label small{display:block;font-size:10px;letter-spacing:.18em;margin-bottom:7px;color:#ff82c4}
.process-legend{display:flex;justify-content:space-between;gap:12px;padding-top:14px;color:#827a80;font-size:11px;font-weight:700;letter-spacing:.12em}
@media(max-width:650px){.process-accordion{height:420px;--process-cut:12px}.process-panel-label{left:16px;bottom:15px;writing-mode:vertical-rl;transform:rotate(180deg)}.process-panel.is-active .process-panel-label{writing-mode:initial;transform:none}.process-legend{font-size:9px}}
@media(prefers-reduced-motion:reduce){.process-panel,.process-panel img{transition:none}}

/* V15: compact two-column process, independent of other sections */
#process{padding-top:64px;padding-bottom:66px}
#process .process-layout{display:grid;grid-template-columns:minmax(240px,.36fr) minmax(0,.64fr);align-items:center;gap:clamp(24px,3.5vw,65px);margin-top:20px}
#process .process-copy{min-width:0}
#process .process-copy h2{font-size:clamp(43px,4.4vw,76px);line-height:.98;letter-spacing:-.055em;margin:0 0 18px;max-width:none}
#process .process-copy p{font-size:clamp(12px,1vw,15px);line-height:1.55;max-width:310px;margin:0}
#process .process-gallery{min-width:0}
#process .process-accordion{margin-top:0;height:clamp(260px,28vw,400px);--process-cut:15px}
#process .process-panel.is-active{flex-grow:6.1}
#process .process-panel-label{bottom:14px;left:19px;font-size:11px}
#process .process-panel-label small{font-size:9px}
#process .process-legend{font-size:9px;letter-spacing:.08em;padding-top:10px}
@media(max-width:820px){#process .process-layout{grid-template-columns:1fr;gap:22px}#process .process-copy h2{font-size:clamp(45px,7vw,72px)}#process .process-copy p{max-width:530px}#process .process-accordion{height:clamp(290px,53vw,440px)}}
@media(max-width:500px){#process{padding-top:48px;padding-bottom:50px}#process .process-accordion{height:310px;--process-cut:10px}#process .process-panel-label{left:12px;font-size:10px}#process .process-legend{font-size:8px}}

/* Minimal cyberpunk folder navigation */
.project-folder-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:24px 16px;padding:15px 0}
.project-folder{position:relative;min-height:160px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;text-align:left;gap:12px;padding:24px 20px 18px;background:linear-gradient(135deg,#171018,#09080b);border:1px solid #8e3669;color:#e9dfe6;cursor:pointer;transition:transform .22s,border-color .22s,box-shadow .22s}
.project-folder-tab{position:absolute;top:-12px;left:-1px;width:78px;height:12px;border:1px solid #8e3669;border-bottom:0;background:#171018;clip-path:polygon(0 0,72% 0,88% 100%,100% 100%,0 100%)}
.project-folder-number{font:700 10px Inter,Arial,sans-serif;letter-spacing:.18em;color:#ad7799}
.project-folder-title{font:800 clamp(17px,1.6vw,23px) Inter,Arial,sans-serif;letter-spacing:.035em}
.project-folder-action{font:700 9px Inter,Arial,sans-serif;letter-spacing:.17em;color:#ff1493}
.project-folder:hover,.project-folder:focus-visible,.project-folder.is-opening{transform:translateY(-3px);border-color:#ff1493;box-shadow:0 0 23px rgba(255,20,147,.2);outline:none}
.project-folder:hover .project-folder-tab,.project-folder.is-opening .project-folder-tab{border-color:#ff1493}
.project-folder.is-opening{background:#351028}
.project-back{margin:0 0 24px;padding:12px 18px;border:1px solid #ff1493;background:#110b11;color:#ff1493;font:700 10px Inter,Arial,sans-serif;letter-spacing:.12em;cursor:pointer}
.project-back:hover{background:#ff1493;color:#100710}
@media(max-width:560px){.project-folder-grid{grid-template-columns:1fr 1fr;gap:20px 10px}.project-folder{min-height:140px;padding:16px 12px}.project-folder-title{font-size:15px}}
@media(max-width:390px){.project-folder-grid{grid-template-columns:1fr}}

/* V18: next folder navigation within project galleries */
.project-gallery-nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 24px}
.project-gallery-nav .project-back{margin:0}
.project-next{padding:12px 18px;border:1px solid #ff1493;background:#140a12;color:#ff1493;font:700 10px Inter,Arial,sans-serif;letter-spacing:.12em;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.project-next:hover,.project-next:focus-visible{background:#ff1493;color:#100710;box-shadow:0 0 20px rgba(255,20,147,.3);outline:none}
.project-next span{margin-left:12px;font-size:14px}
@media(max-width:480px){.project-gallery-nav{gap:8px}.project-gallery-nav .project-back,.project-next{padding:11px 10px;font-size:9px}.project-next span{margin-left:4px}}