#case-view .case-hero-copy{grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)!important;column-gap:64px!important;row-gap:20px!important;align-items:start!important}
#case-view .case-title{grid-row:2/4!important;align-self:start;max-width:100%;font-size:clamp(38px,5.3vw,78px)!important;line-height:1.06!important}
#case-view .case-hero-facts{grid-row:2!important;grid-column:2!important;margin:0!important;padding:0!important;gap:24px!important}
#case-view .project-team{grid-row:3;grid-column:2;margin:0!important;font-size:15px;line-height:1.5}
#case-view .project-team p{margin:0 0 5px}
#case-view .project-team{border:0!important;box-shadow:none!important;padding:0!important;background:transparent!important}
#case-view .project-team::before,#case-view .project-team::after{display:none!important}
#case-view .project-team p{font-weight:400;display:flex;flex-direction:column;margin-bottom:14px}
#case-view .project-team p strong{font-family:'Satoshi',Arial,sans-serif!important;font-weight:700!important;color:inherit;font-size:13px;line-height:1.5}
#case-view .behance-hero{padding-top:40px!important;padding-bottom:40px!important}
#case-view .project-cover-stage img{height:auto!important;min-height:0!important;aspect-ratio:auto!important;object-fit:contain!important;filter:none!important}
#case-view .project-cover-stage{margin-bottom:56px!important;background:#fff}
#case-view .case-project-description{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)!important;gap:48px!important}
#case-view .case-project-description p{max-width:62ch}
#case-view .case-project-details{display:flex!important;gap:48px!important;padding:0!important;margin-bottom:32px!important}
#case-view .case-project-story{padding:32px!important;margin:0 0 56px!important;background:#fff!important;gap:48px!important}
#case-view .case-project-story p{color:#111!important;font-size:17px!important;line-height:1.65!important}
#case-view .case-project-story .eyebrow{color:#073cf5!important}
#case-view .case-media{display:block!important;width:100%}
#case-view .case-media-group{padding:0!important;margin:0 0 40px!important;border:0!important}
#case-view .case-media-item{margin:0 0 28px!important;background:none!important}
#case-view .case-media .case-media-item.media-joins-next{margin-bottom:0!important}
#case-view .case-media .case-media-group.media-group-joins-next{margin-bottom:0!important}
#case-view .case-media img{display:block;width:100%;height:auto;object-fit:contain}
#case-view .project-video-caption{font:500 14px/1.5 'Satoshi',Arial,sans-serif;color:#515761;padding:12px 0 0}
#case-view .case-media video{aspect-ratio:16/9;object-fit:contain;background:#111}
#case-view .case-award-tag{grid-column:1/-1;background:#fff!important;color:#073cf5!important;padding:12px!important;max-width:100%}
#case-view .case-related-heading{font-size:22px!important;margin-top:56px}
#case-view .case-project-link{min-width:0}
#case-view .case-project-nav{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:32px!important;margin:24px 0 0!important;padding:0!important;border:0!important;align-items:start}
#case-view .case-project-link{display:block;width:100%;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;color:#073cf5!important;text-align:left;box-shadow:none!important;transform:none!important}
#case-view .related-project-visual{width:100%;aspect-ratio:16/10;overflow:hidden;background:#eee}
#case-view .related-project-visual img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
#case-view .related-project-copy{position:relative;display:grid;gap:8px;padding:20px 36px 0 0}
#case-view .related-project-copy>span{display:block;font:500 13px/1.4 'Satoshi',Arial,sans-serif;letter-spacing:.04em;color:#515761!important}
#case-view .case-project-link .related-project-copy strong{margin:0!important;color:#073cf5!important;font-size:clamp(22px,2.6vw,36px)!important;line-height:1.15!important;overflow-wrap:anywhere}
#case-view .case-project-link strong span{display:inline;color:inherit!important;font:inherit;letter-spacing:inherit}
#case-view .related-project-copy .related-project-arrow{position:absolute;right:0;top:18px;font-size:24px;color:#073cf5!important}
#case-view .case-project-link:focus-visible{outline:3px solid #073cf5;outline-offset:8px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){#case-view .case-project-link:hover img{transform:scale(1.035)}}
@media(max-width:640px){#case-view .case-project-nav{grid-template-columns:minmax(0,1fr)!important;gap:32px!important}#case-view .related-project-copy{padding-top:16px}}
#case-view .case-hero-copy>.case-project-details{grid-column:1;grid-row:4;margin:8px 0 0!important;gap:32px!important;flex-wrap:wrap}
#case-view .case-hero-copy>.case-project-details span,#case-view .case-hero-copy>.case-project-details strong{color:#fff!important}
#case-view .project-gallery{min-width:0;margin:0 0 28px}
#case-view .project-gallery-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#073cf5 #eee;overscroll-behavior-x:contain}
#case-view .project-gallery-track>.case-media-item{flex:0 0 100%;min-width:0;scroll-snap-align:start;margin:0!important}
#case-view .project-gallery-track img{width:100%;height:auto;max-height:85svh;object-fit:contain;background:#fff}
#case-view .project-gallery-controls{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:16px;color:#073cf5}
#case-view .project-gallery-controls button{width:48px;height:44px;border:1px solid #073cf5;background:#fff;color:#073cf5;font-size:24px;cursor:pointer}
#case-view .project-gallery-controls button:disabled{opacity:.3;cursor:default}
#case-view .project-gallery-controls span{font-size:14px}
@media(max-width:700px){#case-view .case-hero-copy>.case-project-details{grid-column:1;grid-row:auto;margin:0!important}}
@media(max-width:700px){#case-view .case-hero-copy{grid-template-columns:1fr!important;gap:24px!important}#case-view .case-title,#case-view .case-hero-facts,#case-view .project-team{grid-row:auto!important;grid-column:1!important}#case-view .case-title{font-size:clamp(34px,10vw,58px)!important}#case-view .case-project-description{grid-template-columns:1fr!important;gap:12px!important}#case-view .case-project-story{padding:0!important;grid-template-columns:1fr!important;gap:24px!important}#case-view .case-project-details{flex-wrap:wrap;gap:24px!important}#case-view .project-cover-stage{margin-bottom:32px!important}#case-view .case-media-group{margin-bottom:28px!important}}
/* Shared card system across campaign, creativity and related archives. */
#portfolio-view .portfolio-grid,#personal-view .personal-category-grid,#personal-view .archive-grid,#case-view .case-project-nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:40px 28px!important;align-items:start!important}
#portfolio-view .project-card:nth-child(n),#personal-view .personal-category-card:nth-child(n){grid-column:auto!important;align-self:start!important;min-width:0}
#portfolio-view .project-card:nth-child(n) img,#personal-view .personal-category-card:nth-child(n)>img,#personal-view .archive-item-media,#personal-view.video-ai-mode .archive-item-media,#case-view .related-project-visual{width:100%!important;aspect-ratio:16/10!important;height:auto!important;overflow:hidden}
#personal-view .archive-item-media{display:block!important}
#portfolio-view .project-card:nth-child(n) img,#personal-view .personal-category-card:nth-child(n)>img,#personal-view .archive-item-media img,#personal-view .archive-item-media video{object-fit:cover!important}
#personal-view .archive-item-media img,#personal-view .archive-item-media video{width:100%!important;height:100%!important}
#portfolio-view .project-card .project-card-content,#personal-view .category-card-copy,#case-view .related-project-copy{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:baseline!important;gap:8px 16px!important;padding:16px 0 0!important;border:0!important;background:transparent!important;min-height:0!important;text-align:left!important}
#portfolio-view .project-card .project-name,#personal-view .category-card-copy strong,#case-view .case-project-link .related-project-copy strong{grid-column:1!important;grid-row:1!important;font-family:'Clash Display',Arial,sans-serif!important;font-size:clamp(20px,2vw,28px)!important;line-height:1.2!important;font-weight:700!important;letter-spacing:.015em!important;margin:0!important;color:#073cf5!important}
#case-view .related-project-copy>span:first-child{grid-column:2;grid-row:1;text-align:right;font-size:13px!important}
#case-view .related-project-arrow{display:none!important}
#personal-view .archive-item{border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;min-width:0}
@media(hover:hover){#portfolio-view .project-card:hover img,#personal-view .personal-category-card:hover>img,#personal-view .archive-item:hover .archive-item-media{transform:none!important}}
@media(max-width:640px){#portfolio-view .portfolio-grid,#personal-view .personal-category-grid,#personal-view .archive-grid,#case-view .case-project-nav{grid-template-columns:minmax(0,1fr)!important;gap:32px!important}}
/* Mirror the two project story columns on the page grid. */
#case-view .case-project-story{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:clamp(32px,8vw,128px)!important;padding:32px 0!important;width:100%!important;max-width:none!important}
#case-view .case-project-story>section{width:100%;max-width:52ch;min-width:0}
#case-view .case-project-story>section:first-child{justify-self:start}
#case-view .case-project-story>section:last-child{justify-self:end}
#case-view .case-project-story p{max-width:none!important}
@media(max-width:700px){#case-view .case-project-story{grid-template-columns:minmax(0,1fr)!important;gap:28px!important;padding:24px 0!important}#case-view .case-project-story>section{max-width:none}}
/* Keep project metadata aligned with the title, without a trailing empty row. */
#case-view .case-title{grid-row:2!important;margin:0!important}
#case-view .case-hero-copy>.case-project-details{grid-row:3!important;align-self:start;margin:0!important}
#case-view .case-project-description{margin:40px 0!important;padding:0!important}
#case-view .case-project-story{margin-bottom:40px!important}
#case-view .case-related-heading{margin:48px 0 24px!important}
#case-view .case-project-nav{margin-top:0!important}
#case-view .case-foot{margin-top:48px!important}
#portfolio-view .project-card .project-name,#personal-view .category-card-copy strong{min-width:0;overflow-wrap:break-word}
#portfolio-view .project-card .project-name span,#personal-view .category-card-copy strong span span{display:inline;font:inherit;color:inherit;letter-spacing:inherit}
button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible,[tabindex="0"]:focus-visible{outline:2px solid #073cf5;outline-offset:5px}
.site-header button:focus-visible,.site-header a:focus-visible{outline-color:#fff}
@media(max-width:700px){#case-view .case-title,#case-view .case-hero-copy>.case-project-details{grid-row:auto!important}#case-view .case-project-description{margin:32px 0!important}#case-view .case-hero-facts{flex-wrap:wrap!important;gap:20px!important}#case-view .case-my-role{min-width:0!important}#case-view .case-title{overflow-wrap:break-word!important}}
/* Preserve the original internal Creativity galleries. */
#personal-view .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:36px 24px!important}
#personal-view .archive-item-media{aspect-ratio:4/5!important;background:#f4f4f4}
#personal-view .archive-item-media img{object-fit:contain!important}
#personal-view.video-ai-mode .archive-item-media{aspect-ratio:16/10!important}
@media(max-width:900px){#personal-view .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){#personal-view .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px 12px!important}}
/* Compact interior navigation into two consistent rows on phones. */
@media(max-width:700px){
.site-header.interior-header{display:grid!important;grid-template-columns:32px minmax(0,1fr) auto!important;gap:12px 8px!important;padding:12px var(--gutter)!important;align-items:center!important}
.interior-header .header-back-button{grid-column:1;grid-row:1;width:32px;min-height:44px;padding:0!important}
.interior-header>div{grid-column:2;grid-row:1;min-width:0}
.interior-header .wordmark{font-size:12px!important;gap:6px!important;white-space:nowrap}
.interior-header .wordmark-logo{width:22px!important;height:22px!important}
.interior-header .header-contact{grid-column:3;grid-row:1;margin:0!important;padding:10px 8px!important;font-size:10px!important;min-height:44px;display:flex;align-items:center}
.interior-header .site-nav{grid-column:1/-1;grid-row:2;display:flex!important;justify-content:space-between!important;width:100%;margin:0!important;gap:12px!important}
.interior-header .site-nav button{min-height:44px;padding:8px 0!important;font-size:11px!important}
}
/* The cover belongs to the opening project card, alongside its information. */
#case-view .behance-hero{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)!important;gap:clamp(28px,4vw,64px)!important;align-items:start!important}
#case-view .case-hero-copy{grid-template-columns:minmax(0,1fr)!important;gap:24px!important;min-width:0}
#case-view .case-kicker,#case-view .case-title,#case-view .case-hero-facts,#case-view .project-team,#case-view .case-hero-copy>.case-project-details{grid-column:1!important;grid-row:auto!important}
#case-view .case-title{font-size:clamp(32px,3.7vw,58px)!important;line-height:1.06!important;overflow-wrap:break-word!important}
#case-view .case-hero-facts{display:flex!important;justify-content:space-between;gap:24px!important}
#case-view .project-team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px}
#case-view .project-team>span{grid-column:1/-1}
#case-view .project-team p{margin:0!important}
#case-view .project-header-cover{min-width:0;align-self:start;position:sticky;top:116px}
#case-view .project-header-cover .case-visual{display:block;width:100%!important;height:auto!important;max-height:72svh;object-fit:contain!important;margin:0!important;filter:none!important}
@media(max-width:800px){#case-view .behance-hero{grid-template-columns:minmax(0,1fr)!important;gap:32px!important}#case-view .project-header-cover{position:static}#case-view .case-title{font-size:clamp(32px,8vw,52px)!important}}
/* Keep the complete desktop playfield and HUD inside the available viewport. */
@media(min-width:801px){
#play-view:has(#game-wrap:not([hidden])){height:100svh;min-height:0;overflow:hidden;display:flex;flex-direction:column}
#play-view .play-header{flex:0 0 auto}
#play-view #game-wrap:not([hidden]){flex:1;min-height:0!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;padding:16px 24px!important;gap:0;background:#101722;overflow:hidden}
#play-view .game-screen{flex:0 1 auto;width:min(100%,calc((100svh - 200px) * 1280 / 600))!important;max-width:1440px!important;margin:0!important;min-height:0}
#play-view #game-canvas{display:block;width:100%!important;height:auto!important;aspect-ratio:1280/600;border:0!important;border-radius:0!important;box-shadow:none!important;margin:0!important}
#play-view .game-topbar,#play-view .game-bottom{width:min(100%,calc((100svh - 200px) * 1280 / 600))!important;max-width:1440px!important;min-height:40px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:8px 14px!important;margin:0!important;font-size:12px!important;background:#073cf5!important;color:#fff}
}
/* Softer edges with a stationary project cover. */
:root{--surface-radius:8px;--control-radius:6px}
#case-view .project-header-cover{position:static!important;top:auto!important;border-radius:var(--surface-radius);overflow:hidden}
#case-view .project-header-cover .case-visual{border-radius:var(--surface-radius)}
#portfolio-view .project-card img,#personal-view .personal-category-card>img,#personal-view .archive-item-media,#case-view .related-project-visual,#case-view .case-media-item img,#case-view .case-media-item video,#case-view .project-gallery-track{border-radius:var(--surface-radius)!important}
.site-header .header-contact{background:#fff!important;color:#073cf5!important;border:1px solid #fff!important;border-radius:var(--control-radius)!important}
#home-view .site-header .header-contact{background:#fff!important;color:#073cf5!important}
.site-header .header-contact:hover{background:#eef2ff!important;border-color:#eef2ff!important}
.primary-button,.secondary-button,.back-button,.archive-back-button,.project-gallery-controls button,.viewer-nav button,.modal-close{border-radius:var(--control-radius)!important}
.media-viewer .viewer-frame img,.media-viewer .viewer-frame video{border-radius:var(--surface-radius)}
/* Each project medium has its own alternating, consistently padded surface. */
#case-view .case-media-group{display:contents!important}
#case-view .case-media .project-media-card{display:block!important;margin:0 0 24px!important;padding:clamp(16px,3vw,40px)!important;background:#fff!important;border:1px solid rgba(7,60,245,.14)!important;border-radius:12px!important;overflow:hidden}
#case-view .case-media .project-media-card-blue{background:#e7efff!important;border-color:#e7efff!important}
#case-view .project-media-card img,#case-view .project-media-card video{display:block;width:100%;height:auto;max-height:none!important;object-fit:contain!important;border-radius:8px!important}
#case-view .project-video-caption{padding-top:16px!important;color:#073cf5!important}
#case-view .case-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:13px!important;line-height:1.4!important}
#case-view .case-kicker .case-award-tag{display:inline-flex!important;align-items:center;gap:8px!important;width:auto!important;max-width:100%;margin:0!important;padding:7px 10px!important;border:1px solid rgba(255,255,255,.65)!important;border-radius:6px!important;background:#fff!important;color:#073cf5!important;font:700 10px/1.3 'Satoshi',Arial,sans-serif!important;letter-spacing:.04em!important}
#case-view .case-kicker .case-award-tag span,#case-view .case-kicker .case-award-tag strong{color:#073cf5!important;font:inherit!important;margin:0!important;padding:0!important}
#case-view .case-hero-facts{flex-direction:row!important;align-items:start!important}
#case-view .case-hero-facts .case-my-role{flex:1;min-width:0}
#case-view .case-hero-facts .case-my-year{flex:0 0 auto}
#case-view .case-hero-copy{gap:20px!important}
#case-view .project-team{font-size:14px;gap:10px 20px}
#case-view .project-team p strong{font-size:12px}
@media(max-width:700px){#case-view .case-media .project-media-card{margin-bottom:20px!important;padding:12px!important;border-radius:10px!important}#case-view .case-kicker .case-award-tag{flex-wrap:wrap}}
/* Media sit in full-width alternating bands, without external card borders. */
#case-view .case-media .project-media-card{position:relative;isolation:isolate;overflow:visible!important;margin:0!important;padding:clamp(24px,4vw,56px) 0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
#case-view .case-media .project-media-card::before{content:'';position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:#fff;pointer-events:none}
#case-view .case-media .project-media-card-blue{background:transparent!important;border:0!important}
#case-view .case-media .project-media-card-blue::before{background:#e7efff}
#case-view .case-hero-facts{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:20px!important;width:100%!important;min-width:0!important}
#case-view .case-hero-facts .case-my-role,#case-view .case-hero-facts .case-my-year{width:auto!important;max-width:none!important;min-width:0!important;flex:none!important}
#case-view .case-hero-facts strong{white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important}
@media(max-width:700px){#case-view .case-media .project-media-card{padding:24px 0!important;margin:0!important;border-radius:0!important}}
#case-view .case-media .project-media-card-blue::before{background:#073cf5}
#case-view .project-media-card-blue .project-video-caption{color:#fff!important}
/* Creativity collections retain each work's natural aspect ratio. */
#personal-view .archive-grid{display:block!important;columns:3;column-gap:24px!important}
#personal-view .archive-grid .archive-item{display:inline-block!important;vertical-align:top;width:100%!important;margin:0 0 24px!important;break-inside:avoid;page-break-inside:avoid;height:auto!important;overflow:visible!important;position:relative}
#personal-view .archive-grid .archive-item-media,#personal-view.video-ai-mode .archive-grid .archive-item-media{display:block!important;position:relative!important;aspect-ratio:auto!important;height:auto!important;min-height:0!important;background:transparent!important;overflow:hidden}
#personal-view .archive-grid .archive-item-media img,#personal-view .archive-grid .archive-item-media video{display:block!important;position:static!important;inset:auto!important;width:100%!important;height:auto!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;transform:none!important}
#personal-view .archive-grid .archive-item:focus-visible{outline:3px solid #073cf5;outline-offset:5px}
@media(max-width:900px){#personal-view .archive-grid{columns:2;column-gap:16px!important}#personal-view .archive-grid .archive-item{margin-bottom:16px!important}}
@media(max-width:380px){#personal-view .archive-grid{column-gap:12px!important}}
#personal-view .archive-grid .archive-item{aspect-ratio:auto!important;min-height:0!important}
/* A clear three-part viewer: artwork information, media, navigation. */
body:has(#personal-viewer:not([hidden])){overflow:hidden}
#personal-viewer:not([hidden]){position:fixed!important;inset:0!important;z-index:1000!important;background:#073cf5!important;display:flex!important;align-items:stretch!important;padding:0!important;overflow:hidden!important}
#personal-viewer .viewer-frame{display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;width:100%!important;max-width:none!important;height:100svh!important;max-height:100svh!important;margin:0!important;padding:20px clamp(16px,4vw,56px)!important;border:0!important;overflow:hidden!important;gap:16px!important;background:#073cf5!important}
#personal-viewer .viewer-topline{display:flex!important;align-items:center;justify-content:space-between;gap:24px;padding:0 0 16px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.25)!important;min-width:0}
#personal-viewer .viewer-title{min-width:0;display:flex!important;flex-direction:column;gap:5px;text-align:left!important}
#personal-viewer .viewer-title strong{font:700 clamp(17px,2vw,25px)/1.2 'Clash Display',Arial,sans-serif!important;letter-spacing:.015em;overflow-wrap:anywhere;color:#fff!important}
#personal-viewer .viewer-title span{font:400 13px/1.4 'Satoshi',Arial,sans-serif!important;opacity:.8;color:#fff!important}
#personal-viewer .modal-close{position:static!important;flex:0 0 44px;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;display:grid;place-items:center;border:1px solid rgba(255,255,255,.6)!important;background:transparent!important;box-shadow:none!important;color:#fff!important;font:400 30px/1 'Satoshi',Arial,sans-serif!important;transform:none!important;margin:0!important;padding:0!important}
#personal-viewer .viewer-media-wrap{display:flex!important;align-items:center;justify-content:center;min-width:0;min-height:0;margin:0!important;border:0!important;overflow:hidden!important;background:transparent!important}
#personal-viewer .viewer-media-wrap img,#personal-viewer .viewer-media-wrap video{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;min-height:0!important;object-fit:contain!important;background:transparent!important;border-radius:8px}
#personal-viewer .viewer-nav{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:16px 0 0!important;border:0!important;border-top:1px solid rgba(255,255,255,.25)!important}
#personal-viewer .viewer-nav button{min-height:44px;padding:10px 16px!important;font:700 12px/1.3 'Satoshi',Arial,sans-serif!important;letter-spacing:.03em!important;border:1px solid rgba(255,255,255,.55)!important;background:transparent!important;color:#fff!important;width:max-content;max-width:100%}
#personal-viewer .viewer-nav button:last-child{justify-self:end}
#personal-viewer .viewer-counter{font:500 13px/1.3 'Satoshi',Arial,sans-serif;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
#personal-viewer button:hover{background:#fff!important;color:#073cf5!important}
#personal-viewer button:focus-visible,#personal-viewer video:focus-visible{outline:2px solid #fff!important;outline-offset:4px}
@media(max-width:640px){#personal-viewer .viewer-frame{padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))!important;gap:12px!important}#personal-viewer .viewer-topline{gap:12px;padding-bottom:12px!important}#personal-viewer .viewer-title span{font-size:11px!important}#personal-viewer .viewer-nav{gap:8px;padding-top:12px!important}#personal-viewer .viewer-nav button{font-size:10px!important;padding:8px!important}#personal-viewer .viewer-counter{font-size:11px}}
#personal-viewer .viewer-nav>[data-personal-prev]{grid-column:1!important;grid-row:1!important}
#personal-viewer .viewer-nav>.viewer-counter{grid-column:2!important;grid-row:1!important;justify-self:center}
#personal-viewer .viewer-nav>[data-personal-next]{grid-column:3!important;grid-row:1!important}
#home-view .home-header .wordmark>span{display:none!important}
/* Play is a game archive, sharing the portfolio's card proportions. */
#play-view{background:#fff!important;color:#111;min-height:100svh}
#play-view::before,#play-view::after{display:none!important}
#play-view .play-heading{background:#073cf5;color:#fff;padding:56px var(--gutter);margin:0 0 48px}
#play-view .play-heading h1{font:700 clamp(40px,6vw,84px)/1.02 'Clash Display',Arial,sans-serif;margin:0;color:#fff}
.play-game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 28px;padding:0 var(--gutter) 64px;max-width:1700px;margin:0 auto}
.play-game-card{display:block;color:#073cf5;text-decoration:none;min-width:0}
.play-game-card>img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px}
.play-game-card>strong{display:block;margin-top:16px;font:700 clamp(20px,2vw,28px)/1.2 'Clash Display',Arial,sans-serif;letter-spacing:.015em}
.play-game-card:hover>strong{text-decoration:underline;text-underline-offset:5px}
.play-game-card:focus-visible{outline:3px solid #073cf5;outline-offset:6px;border-radius:8px}
@media(max-width:640px){#play-view .play-heading{padding:32px var(--gutter);margin-bottom:32px}.play-game-grid{grid-template-columns:minmax(0,1fr);gap:32px}}
#play-view .play-game-grid{padding-top:48px!important}
@media(max-width:640px){#play-view .play-game-grid{padding-top:32px!important}}
#play-view .play-heading{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:24px!important;padding:56px var(--gutter)!important;margin:0!important;border:0!important;max-width:none!important}
#play-view .play-heading .mono{color:#fff!important;font:500 13px/1.4 'Satoshi',Arial,sans-serif;letter-spacing:.08em;white-space:nowrap}
#play-view .play-heading h1{font-size:clamp(40px,6vw,84px)!important;line-height:1.02!important;letter-spacing:.015em!important}
#play-view .play-game-grid{gap:40px 28px!important;padding:48px var(--gutter) 0!important;max-width:none!important}
#play-view .play-game-card>img{aspect-ratio:16/10!important}
#play-view .play-game-card:first-child>img{object-fit:contain;background:#000}
#play-view .play-game-card>strong{font-family:'Clash Display',Arial,sans-serif!important;font-weight:700!important;font-size:clamp(20px,2vw,28px)!important;line-height:1.2!important;margin-top:16px!important;letter-spacing:.015em!important}
#play-view .page-footer{margin-top:48px!important}
@media(max-width:640px){#play-view .play-heading{padding:32px var(--gutter)!important;gap:16px!important}#play-view .play-game-grid{padding-top:32px!important;gap:32px!important}}
#case-view .project-related-band{position:relative;isolation:isolate;padding:48px 0;margin:0}
#case-view .project-related-band::before{content:'';position:absolute;z-index:-1;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);background:#fff}
#case-view .project-related-band-blue::before{background:#073cf5}
#case-view .project-related-band .case-related-heading{margin:0 0 28px!important}
#case-view .project-related-band-blue .case-related-heading,#case-view .project-related-band-blue .case-project-link .related-project-copy strong,#case-view .project-related-band-blue .related-project-copy>span:first-child{color:#fff!important}
#case-view .project-related-band-blue .case-project-link:focus-visible{outline-color:#fff!important}
@media(max-width:640px){#case-view .project-related-band{padding:32px 0}}
/* Project pages use spacing and colour, without horizontal divider rules. */
#case-view .site-header,#case-view .behance-hero,#case-view .case-project-description,#case-view .case-project-story,#case-view .case-project-details,#case-view .case-media-group,#case-view .case-project-nav,#case-view .case-foot,#case-view .case-section,#case-view .case-hero-facts,#case-view .case-my-role,#case-view .case-my-year{border:0!important;box-shadow:none!important}
#case-view hr{display:none!important}
/* Consistent project rhythm and a clean final navigation area. */
#case-view .case-related-heading,#case-view .case-foot{border:0!important;box-shadow:none!important;background-image:none!important}
#case-view .case-related-heading::before,#case-view .case-related-heading::after,#case-view .case-foot::before,#case-view .case-foot::after{display:none!important;content:none!important}
#case-view .case-foot{margin:0!important;padding:28px 0 36px!important;min-height:0!important;gap:24px!important;align-items:center!important}
#case-view .case-foot .back-button{margin:0!important;padding:10px 0!important;min-height:44px}
#case-view .project-related-band{padding:48px 0!important}
#case-view .project-related-band .case-related-heading{padding:0!important;margin:0 0 24px!important;line-height:1.3!important}
#case-view .case-project-description{margin:40px 0 32px!important}
#case-view .case-project-story{padding:0 0 40px!important;margin:0!important}
#case-view .case-media{margin:0!important;padding:0!important}
#case-view .case-media .project-media-card{padding:40px 0!important}
@media(max-width:700px){#case-view .case-project-description{margin:28px 0!important}#case-view .case-project-story{padding-bottom:28px!important}#case-view .case-media .project-media-card{padding:28px 0!important}#case-view .project-related-band{padding:32px 0!important}#case-view .case-foot{padding:20px 0 28px!important;gap:16px!important}}
/* Shared archive-card interaction across ADV, Creativity and Play. */
#portfolio-view .project-card img,#personal-view .personal-category-card>img,#play-view .play-game-card>img{transition:filter .25s ease!important}
@media(hover:hover){#portfolio-view .project-card:hover img,#personal-view .personal-category-card:hover>img,#play-view .play-game-card:hover>img{filter:brightness(.9)!important;transform:none!important}#portfolio-view .project-card:hover .project-name,#personal-view .personal-category-card:hover .category-card-copy strong,#play-view .play-game-card:hover>strong{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}}
#personal-view .archive-grid.dynamic-mosaic{position:relative!important;columns:auto!important;display:block!important;transition:height .35s ease}
#personal-view .archive-grid.dynamic-mosaic .archive-item{position:absolute!important;top:0;left:0;width:var(--tile-width)!important;transform:translate(var(--tile-x),var(--tile-y))!important;margin:0!important;transition:transform .35s cubic-bezier(.2,.7,.2,1),width .35s cubic-bezier(.2,.7,.2,1)!important;z-index:1}
#personal-view .archive-grid.dynamic-mosaic .archive-item.is-expanded{z-index:2}
@media(prefers-reduced-motion:reduce){#personal-view .archive-grid.dynamic-mosaic,#personal-view .archive-grid.dynamic-mosaic .archive-item,#portfolio-view .project-card img,#personal-view .personal-category-card>img,#play-view .play-game-card>img{transition:none!important}}
/* Play follows the same archive heading and caption system as the other areas. */
#play-view .play-heading{padding:56px var(--gutter)!important;align-items:end!important;min-height:0!important}
#play-view .play-heading .eyebrow{display:block!important;margin:0 0 18px!important;color:#fff!important;font:500 13px/1.4 'Satoshi',Arial,sans-serif!important;letter-spacing:.08em!important}
#play-view .play-game-grid{padding-top:48px!important;gap:40px 28px!important}
#play-view .play-card-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:8px 16px;padding:16px 0 0;min-width:0}
#play-view .play-card-copy>strong{font:700 clamp(20px,2vw,28px)/1.2 'Clash Display',Arial,sans-serif!important;letter-spacing:.015em!important;color:#073cf5;margin:0}
#play-view .play-card-copy>span{font:400 13px/1.4 'Satoshi',Arial,sans-serif;color:#515761;text-align:right}
#play-view .page-footer{margin:48px 0 0!important;padding:24px var(--gutter) 40px!important}
@media(hover:hover){#play-view .play-game-card:hover .play-card-copy>strong{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}}
@media(max-width:640px){#play-view .play-heading{padding:32px var(--gutter)!important}#play-view .play-game-grid{padding-top:32px!important;gap:32px!important}#play-view .page-footer{margin-top:32px!important}}
/* Gentle hover reflow without inherited dark thumbnail frames. */
#personal-view .archive-grid .archive-item,#personal-view .archive-grid .archive-item:hover,#personal-view .archive-grid .archive-item:focus,#personal-view .archive-grid .archive-item-media,#personal-view .archive-grid .archive-item-media img,#personal-view .archive-grid .archive-item-media video{background:transparent!important;border:0!important;box-shadow:none!important}
#personal-view .archive-grid .archive-item::before,#personal-view .archive-grid .archive-item::after{display:none!important}
#personal-view .archive-grid .archive-item:not(:focus-visible){outline:none!important}
#personal-view .archive-grid.dynamic-mosaic{transition:height 1s cubic-bezier(.22,.61,.36,1)!important}
#personal-view .archive-grid.dynamic-mosaic .archive-item{transition:transform 1s cubic-bezier(.22,.61,.36,1),width 1s cubic-bezier(.22,.61,.36,1)!important;will-change:transform}
@media(prefers-reduced-motion:reduce){#personal-view .archive-grid.dynamic-mosaic,#personal-view .archive-grid.dynamic-mosaic .archive-item{transition:none!important}}
#personal-view .archive-grid.dynamic-mosaic:not(.mosaic-ready) .archive-item{transition:none!important}