: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}.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__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}.caption__countdown{font-size:.75rem;opacity:.4;letter-spacing:.05em;font-variant-numeric:tabular-nums}.name{position:absolute;left:calc(50% - min(35vh,40vw) - 7rem);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-start;gap:.3rem}.name__en{font-size:1.4rem;font-weight:400;letter-spacing:.02em;opacity:.85}.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:700px;width:100%}.project{display:flex;flex-direction:column;text-decoration:none;color:var(--fg);transition:opacity .2s ease}.project:hover{opacity:.6}.project__name{font-size:.8rem;letter-spacing:.01em;text-transform:lowercase}.project__tech{font-size:.6rem;opacity:.3;letter-spacing:.02em}@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}}