/* Restrained digital details. Artwork stays full colour and uninterrupted. */
:root{--accent:#ceff63;--pink:#f9dce9}
.pink{color:var(--pink)}
.typing-cursor{display:inline-block;width:.035em;height:.75em;background:var(--accent);margin-left:.075em;vertical-align:-.01em;animation:cursor-blink 1.15s steps(1,end) infinite}
@keyframes cursor-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.hero h1{animation:headline-arrive .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes headline-arrive{from{opacity:.1;transform:translateY(13px);letter-spacing:-.075em}to{opacity:1;transform:none;letter-spacing:-.065em}}
.wordmark:hover .pixel-mark{animation:star-turn .4s steps(4) 1}
@keyframes star-turn{to{transform:rotate(180deg)}}
.feature-frame{border:1px solid #4e5445;border-radius:9px;overflow:hidden;position:relative;box-shadow:5px 5px 0 #ceff630a}
.feature-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid #3f4438;background:#191c17;font-size:12px;color:#c0c5b8}
.feature-bar .pink{margin-right:10px;font-size:16px}
.hero-screen{height:auto;aspect-ratio:16/9}
.hero-screen>img{object-position:center}
.hero-screen:after{background:linear-gradient(180deg,#0003,transparent 38%,#000c)}
.screen-bottom strong{font-family:Suit,sans-serif;font-size:clamp(23px,3vw,40px);letter-spacing:-1px}
.episode{font-size:.6em;font-weight:400;margin-left:10px;color:var(--pink)}
.screen-footer{padding:16px 20px;font-size:12px;background:#171916;align-items:center}
.screen-label{border:1px solid #ceff6350;border-radius:4px}
.hero-play{border-radius:12px;box-shadow:4px 4px 0 #1119;transition:box-shadow .2s,rotate .2s}
.hero-screen:hover .hero-play{box-shadow:6px 6px 0 #f9dce940;rotate:-5deg}
.discipline-strip{margin-top:48px}
.discipline-strip .pixel:nth-of-type(4){color:var(--pink)}
.filters{gap:7px;align-items:center}
.filter{border:1px solid transparent;border-radius:5px;transition:background .16s,border-color .16s,box-shadow .16s}
.filter.active{box-shadow:3px 3px 0 #ceff6320}
.filter:hover:not(.active){border-color:#65685d}
.filter:active,.load-more:active{box-shadow:inset 0 2px 0 #0004;transform:translateY(2px)}
.ai-jump{font-size:14px;color:var(--pink);padding:12px;margin-left:auto;border-bottom:1px dashed #f9dce94d}
.ai-jump:hover{background:#f9dce910;border-radius:5px}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 28px}
.project-card,.project-card:nth-child(even){padding:12px 12px 18px;border:1px solid #343833;border-radius:9px;background:#151715;min-width:0;transition:border-color .2s,box-shadow .2s;display:flex;flex-direction:column;animation:card-arrive .4s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--card-delay,0ms)}
.project-card:hover,.project-card:focus-within{border-color:#8aab50;box-shadow:4px 4px 0 #ceff6309}
.project-card:nth-child(even):hover,.project-card:nth-child(even):focus-within{border-color:#bc9fad;box-shadow:4px 4px 0 #f9dce909}
.project-thumb,.project-card:nth-child(even) .project-thumb{aspect-ratio:16/9;border-radius:4px;flex-shrink:0}
.project-thumb:before{content:'+';position:absolute;right:13px;top:10px;z-index:1;font-family:Silkscreen,monospace;color:var(--pink);font-size:20px;line-height:1;padding:3px;background:#1119;border-radius:2px}
.project-id{border:1px solid #ffffff30;border-radius:3px;left:12px;top:12px}
.project-thumb .project-play{border-radius:7px;border:1px solid #ffffff45}
.project-title-line,.project-type,.project-role,.project-tools{margin-inline:5px}
.project-title-line h3{font-size:21px;min-height:3em}
.project-type{margin-top:19px}
.project-role{margin-bottom:14px}
.project-tools{margin-top:auto;padding-top:12px;border-top:1px dashed #343b30}
.project-title-line>span{color:var(--pink);transition:transform .2s}
.project-card:hover .project-title-line>span{transform:translate(2px,-2px)}
@keyframes pixel-shift{0%{transform:translateX(-2px);filter:drop-shadow(2px 0 var(--pink))}45%{transform:translateX(2px);filter:drop-shadow(-2px 0 var(--accent))}100%{transform:none;filter:none}}
@keyframes card-arrive{from{opacity:.4;transform:translateY(9px)}to{opacity:1;transform:none}}
.ai-section{padding-bottom:90px}
.ai-section .section-head{margin-bottom:28px}
.ai-section h2>span{display:inline-block;margin-left:4px}
.lab-note{display:flex;gap:25px;align-items:center;padding:16px 20px;border:1px dashed #79636e;background:#f9dce907;border-radius:6px;margin-bottom:24px}
.lab-note>.pixel{font-size:12px;white-space:nowrap;color:var(--pink)}
.lab-note>p{font-size:14px;color:#bcb2b8;line-height:1.7;word-break:keep-all}
.ai-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.ai-card{margin:0;padding:12px 12px 20px;border:1px solid #55474e;border-radius:9px;background:#1a1719;min-width:0}
.sample-image{aspect-ratio:16/9;position:relative;overflow:hidden;border-radius:4px}
.sample-image img{transition:transform .4s}
.ai-card:hover .sample-image img{transform:scale(1.035)}
.sample-badge{position:absolute;left:12px;top:12px;background:var(--pink);color:#292027;padding:4px 9px;border-radius:3px;font-size:12px}
.sample-corner{position:absolute;right:13px;bottom:13px;color:var(--pink);background:#161015bb;padding:3px 8px}
.ai-card figcaption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:21px 5px 0}
.ai-card h3{font-family:Suit,sans-serif;font-size:21px;font-weight:500;line-height:1.5;margin-top:8px}
.tool-window{border-radius:8px;overflow:hidden;border-color:#676459;box-shadow:5px 5px 0 #f9dce908}
.tool-content>.pixel .accent{color:var(--pink)}
.tool-row:hover{background:#ceff6305}
.contact-top>span{transition:transform .2s}
.contact:hover .contact-top>span{animation:heart-pop .45s 1}
@keyframes heart-pop{50%{transform:scale(1.15) rotate(-5deg)}}
.section-arrived{animation:section-arrive .55s ease-out both}
@keyframes section-arrive{from{opacity:.6;transform:translateY(12px)}to{opacity:1;transform:none}}
.footer-credit{text-align:center;color:var(--muted)}
.footer-credit p{font-size:12px;line-height:1.7;margin-top:5px}
.footer-credit p span{display:inline-block;margin-left:4px}
.footer-credit:hover p span{animation:heart-pop .45s 1}
@media(max-width:1050px){.ai-jump{margin-left:0}.project-title-line h3,.ai-card h3{font-size:19px}.lab-note{gap:16px}}
@media(max-width:650px){
 .hero-screen{height:auto;aspect-ratio:16/9}.hero-screen>img{object-position:center}
 .hero-play{width:44px;height:44px;border-radius:9px;font-size:14px}
 .screen-bottom{left:14px;bottom:12px}.screen-bottom strong{font-size:21px}.screen-bottom small{font-size:10px}
 .screen-label{top:10px;left:12px;font-size:10px;padding:3px 7px}
 .feature-bar{padding:9px 12px;font-size:11px}.feature-bar .pink{font-size:13px}
 .screen-footer{padding:12px;font-size:10px}.episode{margin-left:4px}
 .project-grid,.ai-grid{grid-template-columns:minmax(0,1fr);gap:25px}
 .project-card,.project-card:nth-child(even){padding:9px 9px 17px}
 .project-title-line h3{min-height:0;font-size:20px}
 .project-id,.sample-badge{font-size:11px}
 .ai-section{padding-bottom:55px}.ai-section h2{font-size:37px}
 .lab-note{align-items:start;flex-direction:column;gap:9px;padding:15px}
 .lab-note>p{font-size:14px}.ai-jump{font-size:12px}
 .footer{display:grid;grid-template-columns:auto 1fr}.footer-credit{grid-row:2;grid-column:1/-1;text-align:left}
 .footer>a:last-child{text-align:right}.footer-credit p{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.typing-cursor{opacity:1}*,*:before,*:after{animation:none!important;transition:none!important}}