: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}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}.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)}.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;cursor:pointer}.caption__cuneiform:hover{opacity:1}.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;cursor:pointer}.name__op:hover{opacity:.9}.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}.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;transition:opacity .2s ease}.about__link:hover{opacity:.6}.page{display:flex;flex-direction:column;align-items:center;gap:1rem}.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}.resume-preview{width:55vh;height:72vh;border:none;border-radius:4px}.projects{display:grid;grid-template-columns:repeat(4,auto);gap:1.2rem 2.5rem;max-width:800px;width:100%;align-items:start}.project{display:flex;flex-direction:column;color:var(--fg);max-width:180px}.project__name{font-size:.8rem;letter-spacing:.01em;text-transform:lowercase;color:var(--fg);text-decoration:none;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:pointer;padding:0;margin-top:.3rem;align-self:flex-start;transition:opacity .2s ease}.project__toggle:hover{opacity:.8}.project__desc{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .35s ease,opacity .3s ease}.project__desc--open{grid-template-rows:1fr;opacity:1}.project__desc>p{overflow:hidden;font-size:.65rem;line-height:1.55;opacity:.55;margin-top:.35rem}@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,1fr);gap:1rem;padding:0 1rem}.about{padding:1.5rem;font-size:.9rem}.resume-preview{width:90vw;height:75vh}}