.build-dock{position:relative;width:max-content;margin-top:26px;isolation:isolate}
.build-dock .cta{position:relative;margin:0;border:1px solid var(--red);transform-origin:15% 85%}
.paint-keeper,.stage-worker{position:absolute;bottom:0;width:52px;height:56px;z-index:2}
.stage-worker{pointer-events:none}
.paint-keeper{left:calc(100% + 5px);border:0;padding:0;transform-origin:center bottom}
.paint-keeper svg,.stage-worker svg{width:100%;height:100%;overflow:visible}
.build-dock.installing .cta{background:linear-gradient(to right,#ff5447 var(--paint,0%),#332324 var(--paint,0%));color:#fff4df}
.build-dock.installing .paint-keeper{visibility:hidden}
.build-dock .spark{position:absolute;left:6px;top:-10px;color:#ffd6a1;font:32px/1 monospace;pointer-events:none}

:root{color-scheme:dark;--paper:#100e0f;--ink:#f1ede5;--red:#ff5447;--line:#453634;--muted:#c1b2ac}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 Arial,sans-serif}
.wrap{width:min(1180px,91%);margin:auto}
header,footer,.section-head,.tabs,.status,.identity,nav{display:flex;align-items:center;gap:1rem}
header,footer,.section-head{justify-content:space-between}
header{min-height:70px;border-bottom:1px solid var(--line)}
a{color:inherit;text-underline-offset:5px}
nav a,.identity{text-decoration:none}
nav a:hover,nav a:focus-visible{color:var(--red)}
.mono,nav,.tabs,summary,.cta,footer{font:600 .76rem/1.6 Consolas,monospace}
.identity{font-weight:700;letter-spacing:.06em}.mark{color:var(--red);font:900 25px/1 monospace}
.hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:3%;min-height:590px;padding:55px 0}
.role,.status{color:var(--red);letter-spacing:.12em;text-transform:uppercase}
h1,h2,h3,p{margin:0}
h1{font-size:clamp(3.7rem,6.5vw,6.6rem);line-height:.93;letter-spacing:-.08em;margin:18px 0 24px}
h1 span{display:block;color:var(--red)}
.intro{max-width:42ch;color:var(--muted);font-size:1.05rem}
.cta{display:inline-block;color:#1b0907;background:var(--red);padding:12px 19px;text-decoration:none;margin-top:26px}
.studio{border:1px solid var(--line);position:relative;background-color:#171112;background-image:linear-gradient(#9b51451a 1px,transparent 1px),linear-gradient(90deg,#9b51451a 1px,transparent 1px);background-size:21px 21px}
.studio svg.scene{display:block;width:100%;height:auto}
.studio figcaption{border-top:1px solid var(--line);padding:10px 14px;display:flex;justify-content:space-between;font:11px/1.5 monospace;color:var(--muted)}
figure{margin:0}
.section{position:relative;border-top:1px solid var(--line);padding:36px 0 55px;scroll-margin-top:16px}
h2{font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.065em}
.tabs{gap:4px}
button{cursor:pointer;color:inherit;background:transparent}
.tabs button{font:inherit;border:1px solid var(--line);padding:7px 10px}
.tabs button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.empty{margin-top:20px;padding:30px;border:1px dashed #6b4944;min-height:135px;display:flex;align-items:center;gap:18px}
.empty-icon{color:var(--red);font:34px monospace}
.empty p,.bio p,footer{color:var(--muted)}
.bio{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:18px}
.bio h3{margin-bottom:8px}
footer{position:relative;min-height:98px;border-top:1px solid var(--line);padding-right:68px}
.worker-btn{position:absolute;right:0;bottom:10px;width:54px;height:72px;padding:0;border:0}
.worker-btn svg{width:100%;height:100%}.speech{position:absolute;right:0;bottom:80px;width:max-content;max-width:220px;background:var(--ink);color:var(--paper);padding:4px 10px;font:12px monospace}.speech:empty{display:none}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.builder{display:none;pointer-events:none}

.pending-part{opacity:0}
.pending-part:focus-within{opacity:1}
::highlight(unset-type){color:transparent;text-shadow:none}
.crew-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:8}
.artisan{position:absolute;top:0;left:0;width:40px;height:52px;filter:drop-shadow(0 2px 2px #120909);will-change:transform}
.artisan svg{width:100%;height:100%;overflow:visible}
.artisan .handtool{transform-origin:36px 40px;animation:tap-tool .32s ease-in-out infinite alternate}
@keyframes tap-tool{to{transform:rotate(-18deg)}}
.artisan small{position:absolute;left:30px;top:42px;background:#261a1c;color:#f8dcc6;border:1px solid #86564a;padding:0 4px;font:10px/16px monospace;white-space:nowrap}
.job-frame{position:absolute;left:0;top:0;border:1px dashed #ff8d72;box-shadow:0 0 0 1px #220a05;transform-origin:0 0}
.foreman{display:none}
@media(prefers-reduced-motion:no-preference){
 .worker-btn svg{animation:upkeep 4s ease-in-out infinite}
 @keyframes upkeep{0%,72%,100%{transform:rotate(0)}80%{transform:rotate(-7deg)}90%{transform:rotate(5deg)}}
}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:30px;padding:40px 0}.studio{max-width:520px;width:100%}.bio{grid-template-columns:1fr}.section-head{align-items:flex-start;flex-wrap:wrap}.extra{visibility:hidden}.wrap{width:90%}nav{gap:12px}.section{padding-bottom:36px}}
:focus-visible{outline:3px solid var(--red);outline-offset:4px}
/* The right panel sits 46px lower than the introduction. Both lower
   tiles share the same diagonal, with a narrow gutter cut between them. */
:root {
  --paper:#100f0e; --red:#ff553d; --ink:#fbefdd;
  --muted:#cbbeb1; --line:#413833;
}
html{scroll-padding-top:18px}
body{overflow-x:clip}
.wrap{width:min(1340px,94%);margin:auto}
header{height:77px;min-height:0;gap:9px;border:0;justify-content:flex-start}
.identity{margin-right:auto;padding:5px 0}
.identity svg{width:77px;height:34px;fill:var(--red)}
nav,.hire{border-radius:8px}
nav{border:1px solid var(--line);gap:4px;padding:2px 5px}
nav a,.hire{padding:8px 15px;font:600 13px/1.35 Arial,sans-serif}
.hire{color:#19120e;background:var(--ink);text-decoration:none}
.hire span{margin-left:12px}
.hero{--intro:54%;--bottom:74%;--gutter:8px;display:grid;grid-template-columns:var(--intro) 1fr;grid-template-rows:auto 174px;gap:var(--gutter) 0;position:relative;isolation:isolate;padding:0;min-height:0}
.hero-copy,.studio,.gallery-tile,.freelance-tile{border-radius:22px;position:relative}
.hero-copy{grid-column:1;grid-row:1;z-index:1;padding:clamp(25px,3vw,48px);padding-right:58px;background:linear-gradient(135deg,#302a25,#211e1d 65%);clip-path:polygon(0 0,100% 0,100% calc(100% - 61px),calc(100% - 61px) 100%,0 100%)}
.role{font:700 11px/1.3 Consolas,monospace;letter-spacing:.15em;display:flex;align-items:center;gap:8px;color:#ffd6c1}
.role i{height:7px;width:7px;background:var(--red);border-radius:50%}
h1{font-size:clamp(59px,6.6vw,99px);line-height:.89;font-weight:750;margin:17px 0 22px;letter-spacing:-.083em}
h1 span{color:var(--ink)}
.bio-strip{display:flex;align-items:flex-start;gap:14px;max-width:445px}
.thumb{flex:0 0 63px;aspect-ratio:1;background:repeating-linear-gradient(135deg,#ebd8b7 0 3px,#e5d0ad 3px 4px);border-radius:9px;overflow:hidden}
.thumb svg{width:100%;height:100%;transform:translateY(3px)}
.intro{font-size:clamp(14px,1.12vw,17px);line-height:1.45;color:#e2d3c4}
.signature{display:block;width:137px;height:auto;margin:4px 0 -1px}
.actions{display:flex;align-items:center;gap:12px;margin-top:19px}
.build-dock{margin:0}
.cta,.secondary{border-radius:8px;display:inline-block;font:700 13px/1.45 Arial,sans-serif;text-decoration:none;padding:10px 15px}
.secondary{color:var(--ink);border:1px solid #65594e;margin-left:45px}
.paint-keeper{height:43px;width:43px}
.studio{grid-column:2;grid-row:1;min-width:0;align-self:stretch;max-width:none;width:auto;aspect-ratio:auto;margin:0 0 -46px -54px;overflow:hidden;border:0;background:#271d19;clip-path:polygon(62px 0,100% 0,100% 100%,0 100%,0 calc(100% - 46px),62px calc(100% - 108px))}
.stage-depth{position:absolute;inset:0;overflow:hidden}
.shop-art{width:100%;height:100%;object-fit:cover;object-position:55% 50%;display:block}
.studio figcaption{position:absolute;bottom:12px;left:16px;right:15px;padding:6px 10px;align-items:center;background:#1d1714ed;color:#f2dcc8;border:1px solid #a37a6159;border-radius:6px;gap:7px;font:12px/1.25 Consolas,monospace}
.studio figcaption b{font-weight:500}
#signal{font-size:10px;white-space:nowrap;color:#dccab7}
#signal:before{content:'';display:inline-block;width:6px;height:6px;background:var(--red);border-radius:50%;margin-right:5px}
.sign-rig{position:absolute;top:17%;left:34%;width:31%;transform:rotate(-3deg);filter:drop-shadow(3px 7px 2px #0a0605a0);transform-origin:65% -25%}
.sign-rig svg{width:100%;display:block;overflow:visible}
.sign-metal{fill:#61402e;stroke:#d0956c;stroke-width:1.2}
.sign-color{fill:#ff6946}
.foundry-crew{position:absolute;inset:0;pointer-events:none}
.foundry-crew svg{position:absolute;width:8%;top:27%;left:35%;opacity:0;filter:drop-shadow(1px 3px 1px #190e0c)}
.foundry-crew .ink-worker{top:26%;left:32%}
.rivet{position:absolute;top:84%;left:12%;color:#ffe6bb;opacity:0}
.rivet:before{content:'âœ´';font:26px/1 monospace}
.gallery-tile,.freelance-tile{grid-column:1/-1;grid-row:2;text-decoration:none;color:var(--ink);display:flex;align-items:center}
.gallery-tile{align-self:stretch;width:var(--bottom);overflow:hidden;background-color:#201f1e;background-image:radial-gradient(#a39a8d44 .85px,transparent 1px);background-size:9px 9px;clip-path:polygon(0 0,calc(73% - 61px) 0,calc(73% - 61px) 46px,100% 46px,calc(100% - 67px) 100%,0 100%)}
.gallery-text{padding:10px 0 0 clamp(24px,3vw,48px);position:relative;z-index:1}
.gallery-text .mono,.freelance-tile .mono{font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.gallery-text .mono{color:#e4bba3}
.gallery-text strong,.freelance-tile strong{display:block;font-size:clamp(26px,3.4vw,52px);letter-spacing:-.065em;line-height:1.1}
.gallery-drawing{position:absolute;width:37%;height:84%;left:46%;bottom:0}
.tile-arrow{position:absolute;right:9%;bottom:15px;font-size:27px}
.freelance-tile{justify-self:end;align-self:end;width:calc(100% - var(--bottom) + 59px);height:calc(100% - 46px);padding:14px 12px 14px 70px;align-items:flex-start;justify-content:center;flex-direction:column;clip-path:polygon(67px 0,100% 0,100% 100%,0 100%);background:var(--red);color:#22120d}
.freelance-tile strong{font-size:clamp(21px,2.45vw,35px)}
.freelance-tile strong span{padding-left:.25em}
.section{padding-top:32px;margin-top:25px}
.tabs button{border-radius:6px}
.empty{border-radius:12px}
.bio{background:#201d1b;padding:25px;border-radius:14px}
#freelance{scroll-margin:30px}
.footer-sign{width:145px}
.skip{position:fixed;left:15px;top:-90px;background:var(--ink);color:var(--paper);padding:8px;z-index:20}
.skip:focus{top:10px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .gallery-drawing .sheets{transition:transform .28s ease-out}
 .gallery-tile:hover .sheets{transform:translate(0,-5px)}
 .secondary:hover,.tabs button:hover{border-color:var(--red)}
}
@media(max-width:760px){
 .wrap{width:94%}header{height:64px}nav a,.hire{padding:8px 9px;font-size:12px}.identity svg{width:60px}
 .hero{display:grid;grid-template-columns:minmax(0,1fr) 110px;grid-template-rows:auto auto auto;gap:7px}
 .hero-copy{grid-column:1/-1;padding:24px 21px 33px;clip-path:polygon(0 0,100% 0,100% calc(100% - 30px),calc(100% - 30px) 100%,0 100%)}
 .studio{grid-column:1/-1;grid-row:2;margin:0;clip-path:none;aspect-ratio:1.58}
 h1{font-size:clamp(59px,12vw,78px);margin-bottom:17px}
 .thumb{flex-basis:53px}.bio-strip{gap:12px}.signature{width:117px}
 .gallery-tile{grid-row:3;grid-column:1;width:100%;min-height:109px;clip-path:polygon(0 0,100% 0,100% calc(100% - 28px),calc(100% - 28px) 100%,0 100%)}
 .gallery-text{padding:0 15px}.gallery-text strong{font-size:clamp(23px,5vw,32px)}.gallery-drawing{width:30%;left:auto;right:-5%;opacity:.5}.tile-arrow{display:none}
 .freelance-tile{grid-column:2;grid-row:3;width:100%;height:100%;padding:14px 11px;clip-path:none}.freelance-tile strong{font-size:20px}
 .hero-copy,.studio,.gallery-tile,.freelance-tile{border-radius:15px}
 .actions{gap:4px}.cta,.secondary{padding:10px 12px}.bio{gap:22px}
}
@media(max-width:360px){
 .hire span{margin:0}.wrap{width:96%}.hero-copy{padding:22px 16px 30px}.hero{grid-template-columns:minmax(0,1fr) 97px}.gallery-drawing{display:none}
}

/* Edition room: a tactile paper stage against the charcoal portfolio. */
h1{font-family:"Arial Black","Segoe UI",Arial,sans-serif;font-weight:900;letter-spacing:-.078em}
h1 span{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:700;color:var(--red);letter-spacing:-.071em;line-height:1.05}
.hero-copy{align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.bio-strip{max-width:40ch}.intro{line-height:1.5}
.hero-copy .actions{margin-top:22px}
.printshop{background:#ead8b3;display:flex;flex-direction:column;justify-content:center;padding:16px 18px 16px 74px;min-width:0;color:#30251e}
.press-top{display:flex;align-items:center;gap:8px;border-bottom:1px solid #ac967a;padding:0 0 9px}
.press-top h2{font:italic 700 clamp(19px,2vw,30px)/1 Georgia,serif;letter-spacing:-.055em}
.press-lamp{width:9px;height:9px;border-radius:50%;background:#cd4329;box-shadow:0 0 0 2px #cbb998}
.edition,.drawer-proof span{margin-left:auto;font:700 11px/1.2 Consolas,monospace;letter-spacing:.06em}
.press-picture{flex:1;display:grid;place-items:center;min-height:0}
#press-scene{width:100%;display:block;overflow:visible;cursor:pointer;touch-action:pan-y}
.press-controls{display:flex;gap:8px;justify-content:center;position:relative;z-index:1}
.press-controls button,.enable-crew{font:700 13px/1.3 Arial,sans-serif;color:#33251f;background:#f8e9cd;border:1px solid #554338;border-radius:7px;padding:11px 15px;min-height:42px}
#press-button{background:#30251f;color:#fff1db;touch-action:none;user-select:none}
#press-button[aria-disabled="true"]{background:#984330}
.press-controls button span{margin-left:8px}
.drawer-panel{position:absolute;inset:12px 16px auto 73px;padding:14px;background:#fff0cf;color:#33251f;border:1.5px solid #594536;box-shadow:2px 4px 0 #604b3480;border-radius:9px;z-index:3}
.drawer-panel[hidden],#save-proof[hidden]{display:none}
.drawer-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.drawer-top h3{font:italic 700 24px Georgia,serif;letter-spacing:-.05em}
.drawer-top button{border:1px solid #a48b6e;color:#382c23;border-radius:50%;width:32px;height:32px;font-size:20px}
.drawer-cards{display:grid;grid-template-columns:85px 1fr;gap:14px;margin-top:8px;align-items:center}
.drawer-proof{background:#ead6ae;border:1px solid #ad9575;padding:9px;transform:rotate(-3deg);box-shadow:2px 2px 0 #806e556b}
.drawer-proof svg{width:100%;fill:transparent;stroke:#ad9378;stroke-width:2px}
.has-print .drawer-proof svg{fill:#d94832;stroke:none}
.drawer-proof span{font-size:8px}
.drawer-cards p{font-size:13px;line-height:1.4}
.drawer-cards a{font-size:12px;font-weight:bold;margin-right:10px;display:inline-block;padding:5px 0}
.enable-crew{margin:4px auto 0;padding:4px;min-height:24px;font-size:11px}
.sr-only,.studio figcaption.sr-only{position:absolute;top:0;left:0;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0}
@media(prefers-reduced-motion:no-preference){
 .drawer-panel{animation:draw-card .28s ease-out both}
 @keyframes draw-card{from{opacity:0;transform:translateY(18px) rotate(-2deg)}}
 .new-proof{animation:ink-flash .75s ease-out}
 @keyframes ink-flash{40%{background:#f4ae88}}
 .moving-arm{transform-origin:30px 36px;animation:work-arm .7s ease-in-out infinite alternate}
 .animated-courier .moving-arm{animation-duration:.4s}
 .moving-head{transform-origin:25px 24px;animation:nod-head .8s ease-in-out infinite alternate}
 .moving-legs{transform-origin:24px 46px;animation:step .39s ease-in-out infinite alternate}
 .moving-scarf{transform-origin:24px 26px;animation:trail .32s ease-in-out infinite alternate}
 @keyframes work-arm{from{transform:rotate(-26deg)}to{transform:rotate(16deg)}}
 @keyframes nod-head{from{transform:rotate(-7deg)}to{transform:rotate(4deg) translateY(1px)}}
 @keyframes step{from{transform:skewX(7deg) scaleY(.95)}to{transform:skewX(-6deg) scaleY(1.04)}}
 @keyframes trail{to{transform:rotate(16deg)}}
}
@media(max-width:760px){
 .printshop{padding:14px 12px;aspect-ratio:auto;min-height:0}
 .drawer-panel{inset:9px 9px auto}
 .press-top h2{font-size:23px}
 .press-controls button{padding:10px 12px}
 .hero-copy h1{margin:14px 0}.hero-copy .actions{margin-top:16px}
}
.shelf-entry{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 0;margin-bottom:10px;border-bottom:1px solid #cfb99a}
.shelf-entry span{font:10px/1.3 Consolas,monospace;color:#614c38}
.shelf-entry button{color:#452b20;font:700 13px/1.3 Arial,sans-serif;border:0;padding:8px 0;text-decoration:underline;text-underline-offset:3px}

/* Build on a true black canvas. Reserving each panel's footprint keeps
   scroll position stable while the surface and its controls are assembled. */
.crew-canvas,.crew-canvas body{background:#000}
.pending-part{pointer-events:none}
.bio{padding:0;background:none;border:0;gap:14px}
.bio>div{border-radius:14px;background:#211e1b;border:1px solid var(--line);padding:clamp(22px,3vw,38px)}
.email-card{display:inline-block;margin-top:12px;font-weight:700;color:var(--red)}
#news-slip{padding-top:10px;margin-top:10px;border-top:1px dashed #ad9575}
#news-slip[hidden],#news-slip [hidden]{display:none}
#news-slip h4{margin:0 0 4px;font:700 10px/1.3 Consolas,monospace;text-transform:uppercase;letter-spacing:.12em}
#news-slip a{display:block;color:#3e281b;font:700 16px/1.15 Georgia,serif;text-underline-offset:3px}
#news-slip small{display:block;font-size:10px;margin-top:4px;color:#68513b}
#news-slip p{font-size:12px}
.drawer-panel{max-height:calc(100% - 65px);overflow:auto;overscroll-behavior:contain}
@media(prefers-reduced-motion:no-preference){
 .artisan.approaching .moving-legs{animation:run-stride .19s ease-in-out infinite alternate}
 .artisan[data-task=panel] .moving-arm,.artisan[data-task=frame] .moving-arm{animation:ink-pass .38s ease-in-out infinite alternate}
 @keyframes run-stride{from{transform:skewX(-12deg) scaleY(.84)}to{transform:skewX(12deg) scaleY(1.06)}}
 @keyframes ink-pass{from{transform:rotate(-32deg)}to{transform:rotate(22deg)}}
}
@media(max-width:760px){
 .artisan{width:50px;height:58px}.artisan small{display:none}
 .bio>div{padding:24px}.printshop{min-height:273px}
 .press-controls button{min-height:44px}
}
@media(prefers-reduced-motion:no-preference){
 .moving-legs.boot-front{clip-path:polygon(-10px -10px,24px -10px,24px 75px,-10px 75px);transform-origin:22px 45px;animation:front-boot .37s ease-in-out infinite alternate}
 .moving-legs.boot-back{clip-path:polygon(24px -10px,75px -10px,75px 75px,24px 75px);transform-origin:26px 45px;animation:front-boot .37s ease-in-out infinite alternate-reverse}
 @keyframes front-boot{from{transform:rotate(-15deg) translateY(-1px)}to{transform:rotate(14deg) translateY(1px)}}
}
