.page-frame{margin-inline:auto}.case-frame{width:1440px;max-width:100%;height:auto}.case-section{width:100%;height:auto;overflow:hidden}.case-frame p,.case-frame div{max-width:100%}.case-frame p{white-space:normal}.case-section>div{flex-shrink:1;min-width:0}.case-hero{isolation:isolate}.case-hero>.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transform:none}.hero-video[hidden]{display:none}.site-nav a{transition:color .2s}.site-nav a:hover{color:var(--lime)}.site-nav{width:100%}.site-footer{width:100%}.image-slot{flex-shrink:1;min-width:0}.visual-gallery{max-width:100%}.visual-gallery>div{flex-shrink:1;min-width:0}.site-motion .fade-in{transition:opacity .65s,translate .65s;opacity:0;translate:0 18px}.site-motion .fade-in.visible{opacity:1;translate:0 0}.video-toggle{position:absolute;right:24px;bottom:24px;z-index:5;border:1px solid #ffffff70;background:#191620dd;color:#f3eef7;font-size:13px;padding:10px 14px;border-radius:6px}.video-toggle[hidden]{display:none}.scroll-scene .image-slot img{transition:translate .6s}
#viewport{width:100%;overflow:hidden}#artboard{width:1728px;height:5812px;transform-origin:top left;position:relative}.home-frame{overflow:clip}.interactive{cursor:pointer;transition:filter .2s,translate .35s}.interactive:hover{filter:brightness(1.08)}.project-link{transition:translate .4s,filter .3s}.project-link:hover{translate:0 -10px;filter:brightness(1.05)}.hero-phone{animation:float 7s ease-in-out infinite}.hero-phone.second{animation-delay:-3.5s}@keyframes float{0%,100%{translate:0 0}50%{translate:0 -9px}}
[data-node-id="212:115"],[data-node-id="212:114"],[data-node-id="19:376"],[data-node-id="212:263"],[data-node-id="212:262"],[data-node-id="19:563"]{background:var(--surface);transition:background-color .25s}[data-node-id="212:122"],[data-node-id="212:264"]{border-color:transparent}
[data-node-id="212:113"]:has([data-node-id="212:122"]:hover,[data-node-id="212:186"]:hover,[data-node-id="212:122"]:focus-visible,[data-node-id="212:186"]:focus-visible) [data-node-id="212:115"],[data-node-id="212:113"]:has([data-node-id="212:193"]:hover,[data-node-id="212:193"]:focus-visible) [data-node-id="212:114"],[data-node-id="212:113"]:has([data-node-id="19:460"]:hover,[data-node-id="19:460"]:focus-visible) [data-node-id="19:376"],[data-node-id="212:258"]:has([data-node-id="212:264"]:hover,[data-node-id="212:267"]:hover,[data-node-id="212:264"]:focus-visible,[data-node-id="212:267"]:focus-visible) [data-node-id="212:263"],[data-node-id="212:258"]:has([data-node-id="212:274"]:hover,[data-node-id="212:274"]:focus-visible) [data-node-id="212:262"],[data-node-id="212:258"]:has([data-node-id="19:642"]:hover,[data-node-id="19:642"]:focus-visible) [data-node-id="19:563"]{background:var(--purple)}
@media(max-width:1100px){.case-section{padding-inline:6vw;gap:4vw}.case-section p{overflow-wrap:break-word}.case-section>div{max-width:100%}.context-grid{flex-wrap:wrap;gap:24px}.context-grid>div{width:45%}.case-section [data-name*="headline"],.case-section [data-name*="Headline"]{font-size:clamp(44px,7vw,94px);line-height:1.08}.case-section [data-name*="headline"] p,.case-section [data-name*="Headline"] p{line-height:1.08}}
@media(max-width:760px){.case-section{padding:64px 24px;height:auto!important;min-height:0!important}.case-section:not(.site-nav):not(.site-footer):not(.context-grid){flex-direction:column;align-items:flex-start;gap:32px}.case-hero{min-height:620px!important;justify-content:center}.case-hero [data-name="Hero story"]{padding:20px;width:100%}.site-nav{height:80px!important;padding:24px;gap:24px}.site-nav p,.site-nav a{width:auto;font-size:13px}.site-footer{padding:28px 24px;min-height:120px;gap:24px}.site-footer>p{width:auto;font-size:20px}.site-footer a{font-size:16px}.case-section>div{width:100%;margin-inline:0}.case-section p{width:100%;max-width:100%;font-size:18px;line-height:1.6}.case-section [data-name="Display headline"],.case-section [data-name="Story headline"]{font-size:44px;letter-spacing:-1px}.case-section [data-name="Display headline"] p,.case-section [data-name="Story headline"] p{font-size:inherit;line-height:1.1}.case-section [data-name="Hero story"]>p:first-child{font-size:12px;line-height:1.5}.case-section [data-name*="Copy"]{width:100%}.scroll-scene>div{height:auto;min-height:0}.scroll-scene .image-slot{height:auto;aspect-ratio:345/715;width:min(320px,100%);margin-inline:auto}.scroll-scene .image-slot:has(img[src*="steal/"]){aspect-ratio:16/9;width:100%}.scroll-scene .image-slot:has(img[src*="multiwars/"]){aspect-ratio:284/405;width:min(320px,100%)}.visual-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.visual-gallery>div{width:100%}.visual-gallery .image-slot{width:100%;height:320px}.visual-gallery p{font-size:13px}.context-grid{padding:32px 24px;gap:24px;align-items:flex-start}.context-grid>div{width:calc(50% - 12px)}.context-grid p{font-size:14px;line-height:1.5}.case-section [data-name="Summary columns"]{flex-direction:column;gap:32px}.case-section [data-name="Summary columns"]>div{width:100%}.case-section [data-name*="Headline"] p,.case-section [data-name*="headline"] p{font-size:clamp(38px,9vw,52px)!important;line-height:1.1!important}.case-section [data-name*="Selected designs / hero"]{height:360px;max-width:100%;overflow:visible}.case-section [data-name*="Selected designs / hero"]>div{scale:.6;flex-shrink:0;margin-inline:-70px}.video-toggle{right:16px;bottom:16px}}
@media(prefers-reduced-motion:reduce){.site-motion .fade-in{opacity:1;translate:0 0}.hero-phone{animation:none}}
@media(min-width:761px){[data-page="multiwars"] .site-nav,[data-page="foody"] .site-nav{width:822px;max-width:100%}}
.mobile-home{display:none}
@media(max-width:760px){body[data-page="home"] #viewport{display:none}.mobile-home{display:block;padding-top:16px}.mobile-nav{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;gap:16px;font-size:14px}.mobile-nav-links{display:flex;gap:14px;font-size:12px}.mobile-hero{padding:64px 24px 48px}.mobile-hero .tag{font-size:12px;line-height:1.6;color:#baafc7;margin-bottom:30px}.mobile-hero h1{font-size:34px;font-weight:500;line-height:1.35;margin:0 0 28px}.mobile-hero h1 span{background:#8964cf;box-decoration-break:clone;padding:2px 4px}.mobile-hero h1 span+span{background:#ebf777;color:#292331;display:inline}.mobile-hero .intro{font-size:16px;line-height:1.6;max-width:34ch;margin-bottom:28px}.mobile-cta{display:inline-block;padding:12px 16px;background:#8964cf;font-size:14px}.mobile-section{padding:36px 24px}.mobile-section h2{font-weight:500;font-size:28px;margin:0 0 28px}.mobile-card{display:block;margin-bottom:36px}.mobile-card-art{width:100%;height:280px;position:relative;background:#332a40;overflow:hidden;transition:background .25s}.mobile-card:hover .mobile-card-art{background:#8964cf}.mobile-card-stage{position:absolute;left:50%;top:0;transform:translateX(-50%) scale(.74);transform-origin:top center;width:354px;height:383px}.mobile-card-stage>div,.mobile-card-stage>a{left:0!important;top:0!important;position:relative!important}.mobile-card-stage.wide{width:606px;transform:translateX(-50%) scale(.74)}.mobile-card h3{font-size:18px;font-weight:500;margin:18px 0 8px}.mobile-card small{font-size:13px;color:#baafc7}.mobile-about img{width:180px;height:205px;object-fit:cover;margin-bottom:28px;border-left:6px solid #ebf777}.mobile-about p{font-size:16px;line-height:1.7;margin-bottom:18px}.mobile-about .skills{font-size:13px;color:#bea7de}.mobile-experience .row{margin:24px 0;padding-bottom:20px;border-bottom:1px solid #332a40;line-height:1.7;font-size:14px}.mobile-experience small{display:block;color:#baafc7}.mobile-contact{text-align:center;background:#8964cf;padding:56px 24px}.mobile-contact h2{font-size:32px;font-weight:500;margin:0 0 28px}.mobile-contact p{font-size:22px;line-height:1.4;margin-bottom:28px}.mobile-contact .mobile-cta{background:#a4ccc7;color:#191620}.mobile-social{display:flex;justify-content:center;gap:24px;margin-top:28px;font-size:14px}.mobile-footer{padding:24px;display:flex;justify-content:space-between;font-size:12px}}

@media(max-width:760px){.case-section [role=heading]{font-size:clamp(38px,9vw,52px)!important;letter-spacing:-1px!important;line-height:1.1!important}.case-section [role=heading] p{font-size:inherit!important;line-height:1.1!important}}
/* Review adjustments: consistent cards, footer and compact controls. */
[data-node-id="212:113"]:has([data-node-id="212:122"]:hover,[data-node-id="212:186"]:hover,[data-node-id="212:122"]:focus-visible,[data-node-id="212:186"]:focus-visible) :is([data-node-id="212:122"],[data-node-id="212:186"]){translate:0 -10px}
.site-footer>div p,[data-node-id="212:311"],[data-node-id="212:312"]{font-size:18px;line-height:28px}.site-footer>div .image-slot{width:18px;height:18px}.site-footer .footer-nav{display:flex;flex-direction:column;align-items:flex-end;gap:14px;margin-left:auto;max-width:300px}.site-footer .footer-nav a{width:auto;text-align:right;line-height:1.4}.next-project{font-size:20px;font-weight:500}.next-project small{display:block;font-size:12px;opacity:.8;margin-bottom:4px}.site-footer .footer-nav>a:not(.next-project){font-size:13px;opacity:.85}.video-toggle{width:40px;height:40px;padding:0;display:grid;place-items:center;border-radius:50%;background:#191620b8}.video-control-icon{display:block;width:12px;height:12px;background:currentColor}.video-toggle[data-state="paused"] .video-control-icon{width:0;height:0;background:none;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid currentColor;margin-left:3px}.card-zoom{background:transparent;padding:0;color:inherit;font:inherit;cursor:zoom-in}.card-lightbox{border:0;padding:24px;background:#191620;color:#f3eef7;max-width:92vw;max-height:94vh;width:fit-content;overflow:auto;border-radius:12px}.card-lightbox::backdrop{background:#000c;backdrop-filter:blur(5px)}.card-lightbox figure{margin:0}.card-lightbox img{width:auto;height:auto;max-width:80vw;max-height:78vh;object-fit:contain;transform:none}.card-lightbox figcaption{text-align:center;font-size:14px;padding-top:16px}.lightbox-close{position:absolute;right:8px;top:8px;width:36px;height:36px;border-radius:50%;background:#332a40;color:white;font-size:26px;line-height:1}.card-lightbox[open]{animation:lightbox-in .18s ease-out}@keyframes lightbox-in{from{opacity:0;scale:.97}to{opacity:1;scale:1}}
@media(max-width:760px){.site-footer>div p{font-size:14px;line-height:22px}.site-footer>div .image-slot{width:14px;height:14px}.site-footer .footer-nav{max-width:48%;gap:10px}.next-project{font-size:16px}.mobile-footer{font-size:11px}.mobile-hero h1 span{padding-inline:7px}.card-lightbox{padding:24px 12px}.card-lightbox img{max-width:84vw}.card-lightbox figcaption{font-size:12px}}
/* Navigation, direct-on-artwork comparison and interactive themes. */
[data-node-id="212:89"] a:not(.project-link):hover,.mobile-nav a:hover{color:var(--lime)}[data-node-id="212:89"] a:hover p{color:var(--lime)}.artwork-compare{position:relative;width:100%;height:auto!important;aspect-ratio:16/10;overflow:hidden;touch-action:pan-y;background:#201b2a;--split:50%}.artwork-compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;transform:none}.artwork-compare .compare-before{clip-path:inset(0 calc(100% - var(--split)) 0 0);background:#201b2a}.compare-control{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:4;cursor:ew-resize;margin:0}.compare-line{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:#ebf777;pointer-events:none;z-index:3}.compare-line:after{content:'↔';display:grid;place-items:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:#ebf777;color:#191620;font-size:23px;box-shadow:0 2px 8px #0005}.compare-label{position:absolute;bottom:18px;z-index:2;background:#191620d9;color:white;padding:7px 12px;font-size:13px;pointer-events:none}.compare-label.before{left:18px}.compare-label.after{right:18px}.artwork-compare:has(input:focus-visible){outline:3px solid #8964cf;outline-offset:4px}.theme-demo{width:100%;display:flex;flex-direction:column;align-items:center;gap:24px}.theme-buttons{display:flex;border:1px solid #29233155;border-radius:30px;padding:4px;gap:4px}.theme-buttons button{padding:10px 24px;border-radius:24px;background:transparent;color:#292331;font-size:15px}.theme-buttons button[aria-pressed=true]{background:#191620;color:#f3eef7}.theme-preview{height:710px;width:min(574px,100%);object-fit:contain;transform:none}.theme-caption{color:#292331;font-size:16px;text-align:center}.ai-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:60px;width:100%}.ai-gallery figure{margin:0;text-align:center}.ai-gallery img{height:710px;max-width:100%;width:auto;margin:auto;object-fit:contain;transform:none}.ai-gallery figcaption{margin-top:24px;font-size:18px;color:#292331}.ai-story{color:#292331;background:#bea7de;padding:110px 116px;gap:28px;display:flex;flex-direction:column;min-height:1280px}.ai-story .eyebrow{font-size:24px;line-height:32px;font-weight:500;letter-spacing:.5px}.ai-story h2{font-size:94px;line-height:1.08;letter-spacing:-2px;font-weight:500;margin:0}.ai-story>p{font-size:24px;line-height:32px;max-width:1000px}.ai-story .ai-note{font-size:16px;line-height:1.6}
@media(max-width:760px){.artwork-compare{aspect-ratio:16/11}.compare-line:after{width:34px;height:34px;font-size:20px}.compare-label{font-size:10px;bottom:10px}.compare-label.before{left:10px}.compare-label.after{right:10px}.theme-preview{height:580px}.ai-gallery{gap:20px}.ai-gallery img{height:auto;max-height:500px;width:100%}.ai-gallery figcaption{font-size:13px}.ai-story{padding:64px 24px;min-height:0}.ai-story h2{font-size:44px;line-height:1.1;letter-spacing:-1px}.ai-story .eyebrow{font-size:18px}.ai-story>p{font-size:18px;line-height:1.6}}
/* Header labels always occupy the right edge of the page. */
body .case-frame .site-nav{width:100%!important;max-width:100%;justify-content:space-between}.site-nav>p:last-child{width:auto;max-width:50%;margin-left:auto;text-align:right}.site-nav>a:first-child{flex-shrink:0}
/* Equal grid columns keep selected card artwork inside its own slot. */
[data-node-id="212:696"]{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px!important;width:100%!important;align-items:start}[data-node-id="212:696"]>div{width:100%!important;min-width:0;max-width:100%}[data-node-id="212:696"] .image-slot{width:100%!important;max-width:100%;height:auto!important;aspect-ratio:284/405;overflow:hidden;display:block}[data-node-id="212:696"] img{width:100%;height:100%;object-fit:contain}[data-node-id="212:696"] p{width:100%!important;overflow-wrap:break-word}
:is([data-node-id="212:452"],[data-node-id="212:455"],[data-node-id="212:458"]){transition:translate .25s,background-color .25s,box-shadow .25s;border-radius:8px;outline-offset:6px}
:is([data-node-id="212:452"],[data-node-id="212:455"],[data-node-id="212:458"]):is(:hover,:focus-visible){translate:8px 0;background:#8964cf14;box-shadow:-3px 0 0 #ebf777}
:is([data-node-id="212:452"],[data-node-id="212:455"],[data-node-id="212:458"]):is(:hover,:focus-visible)>p:first-child{color:#ebf777;transition:color .25s}
@media(max-width:760px){[data-node-id="212:696"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px!important}.site-nav>p:last-child{max-width:55%}}

/* All five portfolio artwork frames use the same border. */
body[data-page="home"] :is([data-node-id="212:122"],[data-node-id="212:194"],[data-node-id="19:461"],[data-node-id="212:264"],[data-node-id="212:275"]){border:3px solid #201b2a!important;box-sizing:border-box}
/* Multiwars: the design iterations form a scrollable, looping story. */
body[data-page="multiwars"] [data-node-id="212:749"]{display:flex;gap:60px;width:100%!important;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x pan-y;cursor:grab;overscroll-behavior-x:contain;padding-bottom:6px}
body[data-page="multiwars"] [data-node-id="212:749"]::-webkit-scrollbar{display:none}
body[data-page="multiwars"] [data-node-id="212:749"]>div{flex:0 0 calc((100% - 60px)/2);width:calc((100% - 60px)/2)!important;max-width:none;scroll-snap-align:start;scroll-snap-stop:always;gap:24px}
body[data-page="multiwars"] [data-node-id="212:749"] .image-slot{width:100%!important;height:auto!important;aspect-ratio:574/710;flex-shrink:0}
body[data-page="multiwars"] [data-node-id="212:749"] p{width:100%!important;font-size:20px;line-height:30px;letter-spacing:.2px}
body[data-page="multiwars"] [data-node-id="212:749"].dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
body[data-page="multiwars"] [data-node-id="182:43"]{width:min(596px,100%);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
body[data-page="multiwars"] [data-node-id="182:43"]>div{width:100%;min-width:0}
body[data-page="multiwars"] [data-node-id="182:43"] .image-slot{width:100%;height:auto;aspect-ratio:284/405}
body[data-page="multiwars"] [data-node-id="182:43"] p{white-space:normal;font-size:20px;line-height:30px}
.iteration-controls{display:flex;align-items:center;gap:10px;margin-left:auto;color:#292331}
.iteration-controls button{display:grid;place-items:center;width:36px;height:36px;border:1px solid #29233155;border-radius:50%;background:transparent;color:inherit;font-size:18px;cursor:pointer}
.iteration-controls button:hover{background:#29233112}.iteration-controls button:focus-visible,[data-node-id="212:749"]:focus-visible{outline:2px solid #292331;outline-offset:4px}
@media(max-width:760px){body[data-page="multiwars"] [data-node-id="212:749"]{gap:24px}body[data-page="multiwars"] [data-node-id="212:749"]>div{flex-basis:85%;width:85%!important}body[data-page="multiwars"] [data-node-id="212:749"] p,body[data-page="multiwars"] [data-node-id="182:43"] p{font-size:13px;line-height:20px}}
body[data-page="multiwars"] [data-node-id="212:667"]{background-image:url('../assets/media/multiwars.jpg');background-size:cover;background-position:center}
/* New Afterimage screens retain their proportions on compact layouts. */
@media(max-width:760px){
 body[data-page="afterimage"] [data-node-id="212:450"]{height:auto;flex-direction:column;gap:32px;align-items:flex-start}
 body[data-page="afterimage"] [data-node-id="212:451"]{width:100%}
 body[data-page="afterimage"] [data-node-id="212:461"]{width:min(315px,100%);height:auto;aspect-ratio:315/654;flex-shrink:0;margin:auto}
 body[data-page="afterimage"] [data-node-id="212:496"]{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 body[data-page="afterimage"] [data-node-id="212:496"]>div{width:100%;min-width:0}
 body[data-page="afterimage"] [data-node-id="212:496"] .image-slot{width:100%;height:auto;aspect-ratio:300/620}
 body[data-page="afterimage"] [data-node-id="212:512"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;width:100%}
 body[data-page="afterimage"] [data-node-id="212:512"]>div{height:auto;width:100%;min-width:0;align-items:flex-start}
 body[data-page="afterimage"] [data-node-id="212:521"]{grid-column:1/-1}
 body[data-page="afterimage"] [data-node-id="181:28"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;width:100%}
 body[data-page="afterimage"] [data-node-id="212:512"] .image-slot{width:100%;height:auto;aspect-ratio:280/605}
 body[data-page="afterimage"] [data-node-id="212:518"]{width:100%;height:auto;aspect-ratio:279/604}
}
/* Moving HUD annotations sit on the artwork without changing its layout. */
.hud-demo{height:auto!important;aspect-ratio:16/9;overflow:hidden;border-radius:8px;isolation:isolate}
.hud-focus{position:absolute;border:3px solid #ebf777;border-radius:8px;box-shadow:0 0 0 2000px #19162066;pointer-events:none;z-index:2;transition:left .65s ease,width .65s ease,top .65s ease,height .65s ease}
.hud-focus-label{position:absolute;left:10px;top:10px;background:#ebf777;color:#191620;padding:7px 12px;border-radius:4px;font-size:clamp(10px,1.2vw,17px);font-weight:500;line-height:1.3;white-space:nowrap}
.hud-timer-focus{position:absolute;left:0;top:95.5%;width:100%;height:4.5%;border:3px solid #ebf777;z-index:3;pointer-events:none;opacity:0;transition:opacity .4s}
.hud-demo[data-hud-focus="2"] .hud-timer-focus{opacity:1}
.hud-priority{background:transparent;color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;text-align:left;padding:0;cursor:pointer;transition:color .2s}
.hud-priority[aria-pressed="true"]{color:#543682}.hud-priority:focus-visible{outline:2px solid #543682;outline-offset:6px}
.hud-toggle{position:absolute;right:12px;bottom:38px;z-index:4;width:34px;height:34px;display:grid;place-items:center;border:1px solid #ffffff70;border-radius:50%;background:#191620cc;color:#f3eef7;font-size:13px}
@media(max-width:760px){.hud-focus,.hud-timer-focus{border-width:2px}.hud-focus-label{left:4px;top:4px;padding:4px 6px;font-size:10px}.hud-toggle{right:8px;bottom:18px;width:26px;height:26px;font-size:10px}[data-node-id="212:621"]{flex-direction:column;gap:24px!important}[data-node-id="212:621"]>div{width:100%!important}}
/* Keep the HUD explanations within their columns at narrower desktop widths. */
[data-node-id="212:621"]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:32px}
[data-node-id="212:621"]>div,[data-node-id="212:621"] p{width:100%;min-width:0;white-space:normal}
@media(max-width:760px){[data-node-id="212:621"]{grid-template-columns:1fr;gap:28px}}