:root{--bg: #000000;--fg: #f0ede8;--font: "Times New Roman", Times, serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{background:var(--bg);color:var(--fg);font-family:var(--font);-webkit-font-smoothing:antialiased;cursor:url(/cursors/normal-select-small.png) 7 14,auto}img,video{-webkit-user-drag:none;-webkit-user-select:none;-webkit-touch-callout:none;user-select:none;pointer-events:none}.site{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}.site--click-flash,.site--click-flash *{cursor:url(/cursors/selection-cursor.png) 8 8,pointer!important}.door-transition{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;opacity:0;pointer-events:none;transition:opacity .38s ease;z-index:999}.door-transition--closed{opacity:1;pointer-events:all}.frame{position:relative;width:min(70vh,80vw);height:min(70vh,80vw)}.frame__gif{position:absolute;top:8.5%;right:11.5%;bottom:18.5%;left:11.5%;width:77%;height:72%;object-fit:cover;border-radius:2px}.frame__gif--shimmer{filter:url(#frame-shimmer)}.frame__gif--in{animation:frame-fade-in 83ms ease forwards}@keyframes frame-fade-in{0%{opacity:0}to{opacity:1}}.filter-defs{position:absolute;width:0;height:0;pointer-events:none}.frame__border{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;filter:invert(1);opacity:.85;pointer-events:none;z-index:1}.caption{position:absolute;top:calc(50% + min(35vh,40vw) - .5rem);left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.25rem}.caption__cuneiform{font-size:1.1rem;opacity:.7;letter-spacing:.1em;color:inherit;text-decoration:none}.caption__countdown{font-size:.75rem;opacity:.4;letter-spacing:.05em;font-variant-numeric:tabular-nums}.name{position:absolute;left:calc(50% - min(35vh,40vw) - 11rem);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;text-align:center;gap:.3rem}.name__en{font-size:1.4rem;font-weight:400;letter-spacing:.02em;opacity:.85}.name__op{font-size:1.2rem;font-weight:400;opacity:.55;color:inherit;text-decoration:none}.name__ar{font-size:1.2rem;font-weight:400;opacity:.55;direction:rtl}.nav{position:absolute;right:calc(50% - min(35vh,40vw) - 7rem);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-end;gap:.8rem}.nav__link{color:var(--fg);text-decoration:none;font-size:.85rem;font-family:var(--font);letter-spacing:.03em;opacity:.5;transition:opacity .2s ease;background:none;border:none;padding:0;cursor:pointer}.nav__link:hover{opacity:1;cursor:url(/cursors/door-cursor.png) 16 16,pointer}.about{max-width:520px;display:flex;flex-direction:column;gap:1.4rem;padding:2rem;font-size:.95rem;line-height:1.75;opacity:.8}.about__link{color:var(--fg);text-decoration:underline;text-underline-offset:3px;opacity:1;cursor:inherit;transition:opacity .2s ease}.about__link:hover{opacity:.6}.page{display:flex;flex-direction:column;align-items:center;gap:1rem}.page--projects{width:100%;height:100%;gap:.7rem;padding:1rem 1rem .8rem;justify-content:flex-start}.page__back{background:none;border:none;color:var(--fg);font-family:var(--font);font-size:.85rem;cursor:pointer;opacity:.4;transition:opacity .2s ease;align-self:center;padding:0}.page__back:hover{opacity:.8;cursor:url(/cursors/door-cursor.png) 16 16,pointer}.projects__area{flex:1 1 auto;min-height:0;width:100%;display:flex;justify-content:center;align-items:flex-start}.projects{display:grid;grid-template-columns:repeat(4,minmax(0,180px));gap:1.2rem 2.5rem;grid-auto-rows:6.5rem;max-width:800px;width:100%;justify-content:center;align-items:start}.projects__pager{display:flex;gap:1.1rem;align-items:center;justify-content:center;height:1.6rem;flex:0 0 auto}.projects__page{background:none;border:none;color:var(--fg);font-family:var(--font);font-size:.8rem;opacity:.3;padding:0;cursor:inherit;transition:opacity .2s ease}.projects__page:hover{opacity:.7;cursor:pointer}.projects__page--active{opacity:1}.project{position:relative;display:flex;flex-direction:column;color:var(--fg);max-width:180px;min-width:0}.project__star{font-size:.7rem;opacity:.75;margin-left:.15rem;vertical-align:super}.project__name{font-size:.8rem;overflow-wrap:anywhere;letter-spacing:.01em;text-transform:lowercase;color:var(--fg);text-decoration:none;cursor:inherit;transition:opacity .2s ease;align-self:flex-start}.project__name:hover{opacity:.6}.project__tech{font-size:.6rem;opacity:.3;letter-spacing:.02em;margin-top:.1rem}.project__toggle{background:none;border:none;color:var(--fg);font-family:var(--font);font-size:.55rem;letter-spacing:.05em;text-transform:lowercase;opacity:.35;cursor:inherit;padding:0;margin-top:.3rem;align-self:flex-start;transition:opacity .2s ease}.project__toggle:hover{opacity:.8}.project__desc{position:absolute;left:0;top:calc(100% + .25rem);z-index:20;width:15rem;max-width:78vw;max-height:40vh;overflow-y:auto;padding:.55rem .65rem;background:var(--bg);border:1px solid rgba(240,237,232,.16);border-radius:3px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .25s ease,transform .25s ease,visibility .25s}.project__desc--end{left:auto;right:0}.project__desc--up{top:auto;bottom:calc(100% + .25rem)}.project__desc--open{opacity:1;visibility:visible;transform:none}.project__desc>p{font-size:.65rem;line-height:1.55;opacity:.7}@media (max-width: 900px){.projects{gap:1.1rem 1.4rem}}@media (max-width: 768px){.site{flex-direction:column;justify-content:center;gap:1.2rem;padding:1rem}.name{position:static;transform:none;align-items:center;text-align:center}.name__en{font-size:1.3rem}.name__ar{font-size:1.1rem}.frame{width:min(85vw,60vh);height:min(85vw,60vh)}.nav{position:static;transform:none;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem 1.2rem;max-width:90vw}.nav__link{font-size:.8rem}.caption{position:static;transform:none}.projects{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;grid-auto-rows:7rem;max-width:100%}.project{max-width:100%}.project__desc{width:100%;min-width:11rem}.about{padding:1.5rem;font-size:.9rem}}
