:root{color:#21201c;letter-spacing:-.02em;background:#fdfdfc;font-family:Inter,Inter Display,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0}p,h1,h2,h3{font-size:inherit;margin:0;font-weight:400;line-height:24px}.page{flex-direction:column;gap:80px;width:min(768px,100%);margin:0 auto;padding:64px 24px 80px;display:flex}.header{justify-content:space-between;align-items:flex-start;display:flex}.identity{flex-direction:column;gap:8px;display:flex}.identity-mark{background:#e9eaec;border-radius:37px;width:34px;height:24px;display:block}.identity p,.intro,.entry p{color:#6a6a6a}.socials{align-items:center;gap:4px;display:flex}.socials img{flex:none;display:block}.intro{max-width:645px;padding-top:24px;line-height:24px}.intro a{color:#21201c;text-decoration:none}.intro a:hover,.intro a:focus-visible{text-underline-offset:3px;text-decoration:underline}.content{flex-direction:column;gap:40px;display:flex}.navigation{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.navigation button{color:#6a6a6a;white-space:nowrap;height:24px;letter-spacing:inherit;cursor:pointer;background:0 0;border:0;border-radius:37px;justify-content:center;align-items:center;padding:4px 12px;font-family:inherit;font-size:12px;line-height:24px;display:flex}.navigation button:focus-visible,.social:focus-visible{outline-offset:2px;outline:2px solid #6a6a6a}.tags span{background:#e9eaec}.experience{flex-direction:column;gap:32px;display:flex}.entries{flex-direction:column;gap:24px;display:flex}.entry-top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.tags{flex-shrink:0;gap:4px;display:flex}.tags span{color:#6a6a6a;white-space:nowrap;border-radius:37px;align-items:center;gap:8px;height:24px;padding:0 11px;font-size:12px;line-height:24px;display:flex}.tags img{width:12px;height:12px;display:block}@media (max-width:600px){.page{gap:64px;padding:40px 24px 64px}.header{gap:20px}.intro{padding-top:0}.entry-top{flex-direction:column;gap:6px}.entry p{margin-top:4px}.navigation{gap:4px 0;margin-left:-12px}.tags{flex-wrap:wrap}.content{gap:36px}}@media (max-width:380px){.header{flex-direction:column}.socials{align-self:flex-end}}.social{cursor:pointer;background:#e9eaec;border-radius:37px;align-items:center;height:24px;text-decoration:none;display:flex;overflow:hidden}.social img{object-fit:contain;flex:none;width:34px;height:24px}.social-label{grid-template-columns:0fr;transition:grid-template-columns .22s cubic-bezier(.23,1,.32,1);display:grid}.social-label>span{opacity:0;color:#21201c;white-space:nowrap;min-width:0;font-size:12px;line-height:24px;transition:opacity .15s,transform .22s cubic-bezier(.23,1,.32,1);overflow:hidden;transform:translate(-4px)}.social-label>span:after{content:"";width:11px;display:inline-block}.social:focus-visible .social-label{grid-template-columns:1fr}.social:focus-visible .social-label>span{opacity:1;transform:translate(0)}@media (hover:hover) and (pointer:fine){.social:hover .social-label{grid-template-columns:1fr}.social:hover .social-label>span{opacity:1;transform:translate(0)}}.empty-state{color:#6a6a6a}.company-link{color:inherit;text-decoration:none;position:relative}.company-logo{opacity:0;pointer-events:none;background:#21201c;border-radius:37px;justify-content:center;align-items:center;width:34px;height:24px;transition:opacity .16s,transform .22s cubic-bezier(.23,1,.32,1);display:flex;position:absolute;top:50%;right:calc(100% + 10px);transform:translate(4px,-50%)scale(.95)}.company-logo img{object-fit:contain;border-radius:3px;width:16px;height:16px}.company-link:hover .company-logo,.company-link:focus-visible .company-logo{opacity:1;transform:translateY(-50%)scale(1)}@media (max-width:600px){.company-link:hover,.company-link:focus-visible{padding-left:44px}.company-logo{left:0;right:auto}}.navigation{position:relative}.navigation button{z-index:1;transition:color .15s;position:relative}.navigation button:hover,.navigation button:focus-visible,.navigation button.active{color:#21201c}.tab-indicator{pointer-events:none;opacity:0;background:#e9eaec;border-radius:37px;height:24px;transition:transform .24s cubic-bezier(.32,.72,0,1),width .24s cubic-bezier(.32,.72,0,1);position:absolute;top:0;left:0}.tab-indicator-instant{transition:none}@media (prefers-reduced-motion:reduce){.tab-indicator,.social-label,.social-label>span{transition:none}.social-label>span{transform:none}}.company-arrow{color:#6a6a6a;opacity:0;pointer-events:none;transition:opacity .16s,transform .22s cubic-bezier(.23,1,.32,1);position:absolute;top:50%;left:calc(100% + 10px);transform:translate(-4px,-50%)}.company-link:hover .company-arrow,.company-link:focus-visible .company-arrow{opacity:1;transform:translateY(-50%)}@media (prefers-reduced-motion:reduce){.company-logo,.company-arrow{transition:none;transform:translateY(-50%)}.company-link:hover .company-logo,.company-link:focus-visible .company-logo,.company-link:hover .company-arrow,.company-link:focus-visible .company-arrow{transform:translateY(-50%)}}.writings-list{width:100%}.writing-row{border-bottom:1px solid #e9eaec;justify-content:space-between;align-items:center;gap:16px;padding:8px 0;display:flex}.writing-row h3{min-width:0}.writing-row time{color:#6a6a6a;white-space:nowrap;background:#e9eaec;border-radius:37px;flex-shrink:0;justify-content:center;align-items:center;height:24px;padding:0 11px;font-size:12px;line-height:24px;display:flex}.pixels-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px;width:100%;display:grid}.pixel{min-width:0;margin:0}.pixel-thumbnail{aspect-ratio:272/153;background:#e9eaec;border-radius:4px;overflow:hidden}.pixel img,.pixel video{object-fit:cover;width:100%;height:100%;display:block}.pixel figcaption{color:#6a6a6a;margin-top:8px;padding:0 8px;font-size:16px;line-height:24px}.timeline-list{width:100%;margin:0;padding:0;list-style:none}.timeline-item{gap:22px;padding-bottom:32px;display:flex;position:relative}.timeline-item:last-child{padding-bottom:0}.timeline-item:not(:last-child):before{content:"";background:repeating-linear-gradient(#a8a8a8 0 2px,#0000 2px 6px);width:1px;position:absolute;top:20px;bottom:-3px;left:6.5px}.timeline-marker{z-index:1;background:#fdfdfc;flex:none;width:14px;height:14px;margin-top:5px;display:block;position:relative}.timeline-marker-pakistan{padding:1px}.timeline-item>div{flex:1;min-width:0}.timeline-item p{color:#6a6a6a;max-width:528px}.timeline-item:nth-last-child(2):before{bottom:1px}.timeline-item:last-child .timeline-marker{width:15px;height:15px;margin:4.5px -.5px 0}.identity-mark{overflow:hidden}.identity-mark img{object-fit:cover;object-position:50% 35%;width:100%;height:100%;display:block}.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px;width:100%;display:grid}.project-thumbnail{aspect-ratio:272/153;background:#e9eaec;border-radius:4px;width:100%}.project-card h3{color:#6a6a6a;margin-top:8px;padding:0 8px;font-size:16px;line-height:24px}.project-card-link{color:inherit;text-decoration:none;display:block}.project-card-link:focus-visible,.project-back:focus-visible{outline-offset:3px;outline:2px solid #6a6a6a}.project-thumbnail{overflow:hidden}.project-thumbnail video{object-fit:cover;width:100%;height:100%;display:block}.project-card-link:hover h3{color:#21201c}.project-detail{gap:40px}.project-back{color:#6a6a6a;align-self:flex-start;text-decoration:none}.project-back:hover{text-decoration:underline}.project-detail-header p,.project-section>p{color:#6a6a6a}.project-detail-header{flex-direction:column;gap:8px;display:flex}.project-hero video,.project-media img,.project-media video{border-radius:4px;width:100%;height:auto;display:block}.project-hero,.project-media{width:100%}.project-section,.project-media{flex-direction:column;gap:16px;display:flex}.project-scene-links{flex-wrap:wrap;gap:16px;display:flex}.project-scene-links a{color:#21201c}.project-detail-header h1{font-size:16px;line-height:24px}.project-meta{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.project-tag,.project-site{color:#6a6a6a;background:#e9eaec;border-radius:37px;justify-content:center;align-items:center;min-height:24px;padding:0 11px;font-size:12px;line-height:24px;text-decoration:none;display:inline-flex}.project-site{color:#fdfdfc;background:#21201c;margin-left:auto}.project-site:hover{background:#494842;text-decoration:none}.project-site:focus-visible{outline-offset:2px;outline:2px solid #6a6a6a}.project-back{z-index:10;letter-spacing:-.02em;font-size:16px;line-height:24px;position:fixed;top:64px;left:clamp(24px,6vw,80px)}@media (max-width:1080px){.project-back{align-items:center;min-height:44px;display:inline-flex;position:static}}.project-detail-logo{object-fit:cover;border-radius:6px;width:40px;height:40px;display:block}.project-thumbnail img{object-fit:cover;width:100%;height:100%;display:block}.project-hero img{border-radius:4px;width:100%;height:auto;display:block}.project-image-wrap,.project-image-button{width:100%;display:block}.project-image-button{cursor:zoom-in;text-align:inherit;background:0 0;border:0;padding:0}.project-image-button:focus-visible{outline-offset:4px;outline:2px solid #6a6a6a}.image-viewer{background:0 0;border:0;outline:none;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:32px 96px;position:fixed;inset:0;overflow:hidden}.image-viewer[open]{justify-content:center;align-items:center;display:flex}.image-viewer::backdrop{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fdfdfccc}.image-viewer-image{object-fit:contain;transform-origin:50%;border-radius:8px;width:auto;max-width:100%;height:auto;max-height:100%;display:block;box-shadow:0 12px 40px #0000001f}.image-viewer-arrow{z-index:1;color:#21201c;cursor:pointer;background:#fff;border:0;border-radius:50%;place-items:center;width:44px;height:44px;padding:0;font-family:inherit;font-size:32px;line-height:1;display:grid;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 2px 12px #0000001a}.image-viewer-arrow.previous{left:24px}.image-viewer-arrow.next{right:24px}.image-viewer-arrow:focus-visible{outline-offset:3px;outline:2px solid #21201c}@media (hover:hover){.image-viewer-arrow:hover{background:#e9eaec}}@media (max-width:600px){.image-viewer{padding:24px 56px}.image-viewer-arrow{width:36px;height:36px}.image-viewer-arrow.previous{left:10px}.image-viewer-arrow.next{right:10px}}.project-detail-archive .project-media{columns:2;column-gap:16px;display:block}.project-detail-archive .project-media>.project-image-wrap,.project-detail-archive .project-media>video{break-inside:avoid;margin:0 0 16px}.pixels-description{color:#6a6a6a;max-width:645px}.pixel-link{color:inherit;text-decoration:none;display:block}.pixel h3{color:#6a6a6a;margin-top:8px;padding:0 8px;font-size:16px;line-height:24px}.pixel-link:hover h3{color:#21201c}.pixel-link:focus-visible{outline-offset:3px;outline:2px solid #6a6a6a}.pixel-frame{background:#e9eaec;border:0;border-radius:4px;width:100%;height:min(75vh,800px);min-height:480px;display:block}@media (max-width:600px){.pixel-frame{height:70vh;min-height:420px}}.pixel-title-row{align-items:center;gap:16px;width:100%;display:flex}.pixel-title-row h1{min-width:0}.pixel-title-row .project-site{flex-shrink:0}.pixel-detail .project-detail-header>p{max-width:75%}.location-text{white-space:nowrap}.maple-leaf{vertical-align:-2px;background:currentColor;width:16.875px;height:16px;margin-right:4px;display:inline-block;-webkit-mask:url(/assets/maple-leaf.svg) 50%/contain no-repeat;mask:url(/assets/maple-leaf.svg) 50%/contain no-repeat}@media (hover:hover){.location-text:hover{color:#a51f16}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.pixel-thumbnail img,.pixel-thumbnail video{transition:transform .22s cubic-bezier(.23,1,.32,1)}.pixel-link:hover .pixel-thumbnail img,.pixel-link:hover .pixel-thumbnail video{transform:scale(1.04)}}@media (max-width:600px){.page{gap:36px;padding:28px clamp(16px,5vw,28px) 56px}.header{flex-direction:column;gap:12px}.identity{flex-direction:row;align-items:center;gap:12px}.identity-mark{width:40px;height:40px}.identity h1,.experience>h2,.project-detail-header h1{font-size:20px;line-height:26px}.identity p,.project-card h3,.pixel h3{font-size:15px;line-height:22px}.socials{align-self:flex-start;gap:4px}.social{background:0 0;justify-content:center;width:44px;height:44px}.social img{width:42px;height:auto}.social-label{display:none}.intro{font-size:clamp(18px,4.7vw,21px);line-height:1.45}.content,.experience{gap:24px}.navigation{flex-wrap:nowrap;gap:0;margin:0;padding-block:3px;overflow-x:auto}.navigation button{flex:1 0 auto;height:44px;padding-inline:clamp(5px,1.7vw,10px);font-size:13px}.navigation button:focus-visible{outline-offset:-2px}.tab-indicator{height:36px;margin-top:4px}.projects-grid,.pixels-grid{grid-template-columns:1fr;row-gap:24px}.project-card h3,.pixel h3{padding-inline:0}.timeline-item{gap:16px}.timeline-item p,.entry p{font-size:15px;line-height:23px}.writing-row{flex-wrap:wrap;gap:4px 12px}.pixel-detail .project-detail-header>p{max-width:100%}.project-back{min-height:44px}.project-detail-archive .project-media{columns:1}.image-viewer{padding:20px 12px 76px}.image-viewer-arrow{width:44px;height:44px;top:auto;bottom:16px;transform:none}.pixel-frame{height:70svh;min-height:320px}}.project-tag-full{display:inline}@media (hover:hover) and (pointer:fine){.project-tag-full{opacity:0;grid-template-columns:0fr;transition:grid-template-columns .15s,opacity .15s;display:grid}.project-tag-full>span{white-space:nowrap;min-width:0;overflow:hidden}.project-tag:hover .project-tag-full{opacity:1;grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.project-tag-full{transition:none}}.project-tag,.project-site{font-weight:400}.project-site{position:relative}.project-site:before{content:"";position:absolute;inset:-10px 0}@media (max-width:600px){.project-tag-full{opacity:1;transition:none;display:inline}}.pixel-thumbnail-bordered{outline-offset:-1px;outline:1px solid #21201c33}.project-scene-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px;display:grid}@media (max-width:600px){.project-scene-cards{grid-template-columns:1fr;gap:24px}.project-scene-cards .project-card h3{padding-inline:0}}.project-detail .project-tag-full{opacity:1;transition:none;display:inline}.project-card-meta{justify-content:space-between;align-items:flex-start;gap:8px;margin-top:8px;display:flex}.project-card-meta h3{min-width:0;margin:0}.project-card-tags{flex-wrap:wrap;justify-content:flex-end;gap:4px;display:flex}.project-card-tags .project-tag{flex:none}@media (max-width:600px){.project-card-meta{flex-wrap:wrap}}.pixel-frame{flex-shrink:0;align-self:center;width:min(1200px,100vw - 48px);max-width:none}@media (max-width:600px){.pixel-frame{width:100%}}
