/* Pixel studio: luminous type, neutral surfaces and stepped window corners. */
:root{--studio-edge:#41434c;--studio-shadow:#08090b;--surface:#191b20;--muted:#a6a7af;--line:#33353d;--pixel-frame:url('images/brand/pixel-window.svg?v=37') 12 stretch}
body{background:#111216;color:#eeeef1}
.header{border-bottom-color:#33353d}
.wordmark{display:inline-flex;align-items:center;gap:10px}
.wordmark .brand-symbol{width:35px;height:35px;display:block;image-rendering:pixelated;filter:none}
.footer .brand-symbol{width:26px;height:26px}
/* Depth belongs to the title. Media remains clear and full colour. */
.hero{position:relative;padding-bottom:14px}
.hero h1{display:flex;align-items:center;gap:8px;margin:20px -8px 22px;line-height:1;font-size:clamp(46px,10vw,142px);letter-spacing:0;animation:pixel-title-arrive .65s ease-out both;isolation:isolate}
.hero-lettering{display:block;width:calc(100% - 22px);height:auto;object-fit:contain;filter:drop-shadow(0 0 4px #ceff6325) drop-shadow(0 0 21px #ceff631a)}
.hero h1 .typing-cursor{flex:none;width:5px;height:.64em;margin:0 0 .07em;background:var(--accent);box-shadow:0 0 12px #ceff6350}
.hero h1.signal-title:before,.hero h1.signal-title:after{content:none}
.hero h1.signal-burst .hero-lettering{animation:headline-pixel-signal .38s steps(1,end)}
@keyframes pixel-title-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes headline-pixel-signal{0%,100%{transform:none}18%{transform:translateX(-2px);filter:drop-shadow(3px 0 #ff35a5) drop-shadow(-2px 0 #b9ff38)}36%{transform:translateX(1px);filter:drop-shadow(-3px 0 #ff35a5)}57%{transform:none;filter:drop-shadow(0 0 12px #ceff6380)}75%{filter:drop-shadow(2px 0 #ceff63)}}
.hero-description{padding-top:0}.hero-tags{color:#a6a7af}
.edit-timeline{background:transparent;border:0;border-block:1px solid #373943;border-radius:0;box-shadow:none;padding:16px 0;gap:24px}
.timeline-step{padding:0 16px 0 0;border:0;border-right:1px solid #373943;background:none;box-shadow:none;border-radius:0}
.timeline-step:last-of-type{border:0;padding-right:0}
.timeline-step:nth-child(2){background:none}
.timeline-step>.pixel{color:#aaaab3}
.timeline-clips{box-shadow:none;border-radius:0;padding:0}
.timeline-clips i{box-shadow:none}
.timeline-step:nth-child(2)>.pixel,.timeline-step:nth-child(2)>p{color:#f4bfdc}
/* Nine-slice outlines preserve square steps without rounding or bevels. */
.feature-frame,.tool-window,.avatar-window,.web-card,.cinema-cover,.publish-stage,dialog{
 border:12px solid transparent;border-image:var(--pixel-frame);border-radius:0;background:#191b20;background-clip:padding-box;box-shadow:none
}
.feature-frame{padding:0;overflow:visible;position:relative}
.feature-bar{padding:10px 14px 13px;background:none;border-bottom:1px solid #3c3e48;color:#cacbd1;text-shadow:none}
.feature-bar .pink{color:var(--accent)}
.hero-screen{border:0;border-radius:0;box-shadow:none;background:#0c0d10;overflow:hidden;isolation:isolate}
.hero-screen:before{content:none}
.hero-screen:after{background:linear-gradient(180deg,#0002,transparent 42%,#000b)}
.hero-screen>img{border-radius:0;filter:none;transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.hero-screen:hover>img{transform:scale(1.015);filter:none;animation:none}
.hero-play{background:var(--accent);color:#16171b;border:0;border-radius:0;clip-path:polygon(6px 0,calc(100% - 6px) 0,calc(100% - 6px) 3px,100% 3px,100% calc(100% - 6px),calc(100% - 3px) calc(100% - 6px),calc(100% - 3px) 100%,6px 100%,6px calc(100% - 3px),0 calc(100% - 3px),0 6px,6px 6px);box-shadow:none;rotate:0;transition:scale .18s}
.hero-screen:hover .hero-play{box-shadow:none;rotate:0;scale:1.06}
.screen-label{background:#111216db;border:1px solid #ceff6370;border-radius:0;box-shadow:none}
.screen-footer{min-height:52px;padding:14px;background:none;border:0;color:#b8b9c2;gap:14px}
.screen-footer>span:nth-child(2){color:#979aa7;background:none;border:0;padding:0;box-shadow:none}
.screen-footer>span:last-child{color:var(--pink)}
.discipline-strip{margin-top:42px;background:none;border-block:1px solid #33353d;box-shadow:none}
.section-head h2,.creative-heading h2,.collection-intro h1{text-shadow:none}
.creative-section{padding-top:65px;padding-bottom:45px}
.folder-grid{gap:24px 20px}
.folder-card,.folder-card:nth-child(even){margin-top:0;background:#191b20;background-clip:padding-box;border:12px solid transparent;border-image:url('images/brand/pixel-window-lime.svg?v=37') 12 stretch;border-radius:0;box-shadow:none;transition:transform .2s}
.folder-card:nth-child(even){border-image-source:url('images/brand/pixel-window-pink.svg?v=37')}
.folder-card .folder-tab,.folder-card:nth-child(even) .folder-tab{position:static;height:auto;display:flex;margin:0;padding:9px 8px 11px;background:none;border:0;border-bottom:1px solid #3c3e48;border-radius:0;box-shadow:none;color:var(--accent);font-size:11px}
.folder-card:nth-child(even) .folder-tab{color:var(--pink)}
.folder-preview{margin:8px 0 0;border:0;border-radius:0;box-shadow:none}
.folder-card:hover,.folder-card:nth-child(even):hover,.folder-card:focus-visible{transform:translateY(-4px);box-shadow:none}
.folder-card:active{transform:translateY(0)}
.folder-caption{padding:16px 7px 13px}
.folder-caption p,.folder-card:nth-child(even) .folder-caption p{color:#b7b8c2;font-size:14px;line-height:1.75}
.folder-caption>span{color:var(--accent)}.folder-card:nth-child(even) .folder-caption>span{color:var(--pink)}
.project-card,.project-card:nth-child(even){background:#17191e;border-color:#33353f;border-radius:0;box-shadow:none}
.project-card:hover,.project-card:nth-child(even):hover,.project-card:focus-within{border-color:#8cad51;box-shadow:none}
.project-thumb,.project-card:nth-child(even) .project-thumb{border-radius:0;box-shadow:none}
.project-summary{color:#c0c1c9}.project-role{color:#aaaeb8}.project-role>span{color:#8f929e}
.project-tools{border-top-color:#33353d;color:#aaadb8}
.scope-label{border-color:#444650;color:#c5c8d2;background:#22242a}
.filters{border-bottom-color:#33353d}.filter.active{background:var(--accent);border-color:var(--accent);color:#17191d;box-shadow:none;border-radius:2px}
.short-filters{background:#191b20;border:1px solid #41434c;border-radius:0;box-shadow:none}
.archive-index{background:#191b20f5;border-color:#484b57;border-radius:0}.archive-group-head{border-top-color:#444650}
.ai-card{background:#191b20;border-color:#4e4551;border-radius:0;box-shadow:none}
.lab-note{border-style:solid;border-color:#514652;background:#201c24;border-radius:0;box-shadow:none}
/* About is a calm charcoal field. Only the small windows carry pixel corners. */
.about-section{background:#16171c;border-block:1px solid #33353d;box-shadow:none}
.about-grid{gap:70px}
.about-copy>p{color:#b9bac4}
.about-side{gap:24px}
.avatar-window{padding:16px;gap:22px;grid-template-columns:160px minmax(0,1fr)}
.avatar-stage{border:0;border-radius:0;background:#e7ccdf;box-shadow:none;isolation:isolate}
.avatar-stage:after{content:none}
.avatar-caption h3{text-shadow:none;color:#f0eef4}
.avatar-caption p{color:#b8b9c4}
.avatar-caption>span:first-child{color:var(--accent)}
.avatar-caption>span:last-child{color:#f4bfdc;text-shadow:none}
.tool-window{overflow:visible}
.window-bar{background:var(--accent);color:#181a1f;border:0;border-bottom:2px solid #111216;box-shadow:none;text-shadow:none;padding:11px 15px}
.window-bar>span:last-child{font-family:Galmuri11,monospace;font-size:15px;letter-spacing:5px}
.tool-content{padding:25px;background:none}
.tool-content>.pixel{color:#ececf1}.tool-content>.pixel .accent{color:var(--pink)}
.tool-row{border-bottom-color:#363842}.tool-row>.mono{color:#989ba7}
.tool-level{color:#aaaeba}.tool-level.main{color:var(--accent);background:#ceff6310}
.tool-status{color:#aaaeba;border-top:1px solid #363842;text-shadow:none;font-size:11px}
.extra-tools>span{color:#aaaeba}.extra-tools p{color:#d0d1d9}
.role-notes{margin-top:30px;padding-top:24px;border:0;border-top:1px solid #41434d;border-image:none;background:transparent;border-radius:0;box-shadow:none;clip-path:none}
.role-notes-head h3{color:#e5e5ed}.role-notes-head>.mono{color:#9295a1}
.role-note{padding:16px 0;border:0;border-bottom:1px solid #33353e;background:none;border-radius:0;box-shadow:none}
.role-note:last-child{border-bottom:0}
.role-note:hover{background:#ceff6305;box-shadow:none;transform:none}
.role-note-number{color:var(--accent)}
.role-note strong{font-size:15px;color:#e1e2e9}.role-note small{font-size:13px;color:#aaaeba;line-height:1.8}
.role-note:hover strong{color:var(--accent)}
.contact h2{color:#eeeef3;text-shadow:none}.contact h2>span{text-shadow:none}
.copy-email,.load-more,.back-to-top,.menu-toggle{background:#1b1d24;border:1px solid #697151;border-radius:2px;box-shadow:none}
.copy-email{padding:10px 14px}.copy-email:active,.menu-toggle:active{transform:translateY(2px)}
.footer{border-top-color:#33353d}
.collection-nav{background:#191b20;border-color:#41434d;border-radius:0;box-shadow:none}
.collection-nav a[aria-current=page]{box-shadow:none}
.collection-stamp{box-shadow:3px 3px 0 #08090b}
.art-thumb{border:1px solid #41434c;border-radius:0;box-shadow:none}
.art-card,.art-card:nth-child(even){background:transparent}
.art-expand{box-shadow:none}
.web-card,.web-card:nth-child(even),.cinema-cover{background:#191b20;background-clip:padding-box;border:12px solid transparent;border-image:var(--pixel-frame);border-radius:0;box-shadow:none;overflow:visible}
.mini-browser,.cinema-cover .mini-browser{background:#252731;color:#c6c8d3;border-bottom:1px solid #484b57;box-shadow:none;text-shadow:none}
.web-preview{box-shadow:none}
.publish-stage{padding:25px}
.dialog-bar{background:#252731;border-bottom:1px solid #484b57}
@media(max-width:1050px){.about-grid{gap:35px}.avatar-window{grid-template-columns:115px minmax(0,1fr);gap:16px;padding:12px}.folder-grid{gap:24px 20px}.hero h1{margin-inline:-5px}}
@media(max-width:800px){.header.nav-ready .primary-nav{background:#191b20fa;border-color:#535661;border-radius:0;box-shadow:0 12px 26px #0005}}
@media(max-width:650px){
 .wordmark .brand-symbol{width:28px;height:28px}.wordmark{gap:7px}
 .hero h1{font-size:12vw;margin:23px -4px 19px;gap:3px}.hero-lettering{width:calc(100% - 12px)}.hero h1 .typing-cursor{width:3px;height:.54em}
 .feature-bar{padding:6px 5px 9px;font-size:10px}.feature-bar .pink{margin-right:5px}
 .hero-screen{border:0;border-radius:0}.screen-footer{padding:11px 5px;min-height:0;font-size:10px;gap:8px}.screen-footer>span:first-child{line-height:1.7}
 .edit-timeline{gap:10px;padding-block:14px}.timeline-step{padding-right:9px}.timeline-step>p{font-size:11px}
 .discipline-strip{margin-top:30px}.creative-section{padding-top:45px;padding-bottom:35px}
 .folder-grid{gap:18px 12px}.folder-card .folder-tab,.folder-card:nth-child(even) .folder-tab{font-size:10px;padding:6px 3px 9px;gap:8px}
 .folder-caption{padding:12px 3px}.folder-caption h3{font-size:15px}.folder-caption p,.folder-card:nth-child(even) .folder-caption p{font-size:12px}
 .folder-preview{margin:6px 0 0}
 .avatar-window{grid-template-columns:120px minmax(0,1fr);padding:10px;gap:16px}.avatar-caption h3{font-size:15px}.avatar-caption p{font-size:12px}
 .tool-content{padding:20px}.tool-status{font-size:10px}.role-note{padding-block:14px}.role-note small{font-size:13px}
 .publish-stage{padding:18px}.copy-email{padding:9px 12px}
}
@media(max-width:380px){.avatar-window{grid-template-columns:100px minmax(0,1fr);gap:12px;padding:8px}.avatar-caption>span:first-child{font-size:9px}.tool-row{grid-template-columns:53px 1fr auto;gap:7px}.tool-row strong{font-size:15px}}
@media(prefers-reduced-motion:reduce){.hero h1,.hero h1.signal-burst .hero-lettering{animation:none}.hero-lettering{filter:none}}

/* Same edge weight along corners and straight sides; the avatar has its own TV bezel. */
.hero h1 .typing-cursor{background:#ff83c8;box-shadow:0 0 13px #ff83c870}
.hero-lettering{filter:drop-shadow(0 0 3px #ceff6320) drop-shadow(0 0 17px #ceff6314)}
.avatar-stage{position:relative;border:8px solid #0b0c10;border-bottom-width:16px;outline:2px solid #71727f;outline-offset:0;border-radius:8px;box-shadow:inset 0 0 0 1px #fbe6f1;background:#e7ccdf}
.avatar-stage:after{content:'';position:absolute;bottom:-11px;right:7px;width:4px;height:4px;background:var(--accent);box-shadow:-9px 0 #777985;z-index:2}
.avatar-stage{overflow:visible}
.avatar-stage>img{clip-path:inset(0);border-radius:0}
#avatar-slot>img{transform:none;object-fit:cover;object-position:center bottom}
.archive-group-controls{display:flex;justify-content:space-between;align-items:center;gap:18px;border-top:1px solid #383a44;padding-top:16px;margin-top:22px}
.archive-group-controls>span{font-size:12px;color:var(--muted)}
.archive-group-toggle{border:1px solid #60674f;background:#202329;color:var(--accent);padding:10px 18px;font-size:14px;min-height:42px}
.archive-group-toggle:hover{background:var(--accent);color:#17191d}
@media(max-width:650px){.avatar-stage{border-width:6px;border-bottom-width:14px}.archive-group-controls{gap:10px}.archive-group-toggle{padding:9px 12px;font-size:13px}}

.avatar-stage{overflow:hidden}
.avatar-stage:after{bottom:2px;right:7px;box-shadow:0 0 0 3px #0b0c10,-9px 0 #777985}
#avatar-slot>img{transform:translateY(8%) scale(1.08);transform-origin:50% 100%;clip-path:none;object-fit:contain}