:root{--bg:#0c1017;--bg-elev:#11161e;--bg-card:#121821;--line:#e2e8f014;--line-strong:#e2e8f029;--text:#e8eef6;--muted:#8b95a5;--faint:#667082;--accent:#6ea8fe;--accent-soft:#6ea8fe1f;--accent-glow:#6ea8fe2e;--danger:#3d4553;--radius:8px;--nav-h:68px;--max:1120px;--font:"IBM Plex Sans Arabic", "IBM Plex Sans", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;--shadow:0 12px 32px #00000047}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html,body,#root,.site{min-height:100%}body{color:var(--text);font-family:var(--font);background-color:var(--bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:72px 72px;margin:0;line-height:1.7}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(720px 320px at 50% -80px,#6ea8fe12,#0000 70%);position:fixed;inset:0}.site{z-index:1;position:relative}img,svg{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input{font:inherit}h1,h2,h3,p{margin:0}ul,ol{margin:0;padding:0;list-style:none}:focus-visible{outline:1px solid var(--accent);outline-offset:3px}.skip-link{inset-inline-start:12px;z-index:80;background:var(--accent);color:#081018;border-radius:4px;padding:8px 12px;position:absolute;top:-48px}.skip-link:focus{top:12px}.container{width:min(calc(100% - 40px), var(--max));margin-inline:auto}.kicker{color:var(--accent);font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;align-items:center;gap:12px;margin-bottom:12px;font-size:.74rem;font-weight:500;display:flex}.kicker-line{background:var(--accent);opacity:.7;width:28px;height:1px}.btn{border:1px solid var(--line-strong);min-height:44px;color:var(--text);cursor:pointer;background:0 0;border-radius:6px;justify-content:center;align-items:center;gap:8px;padding:0 16px;transition:border-color .16s,background .16s,color .16s;display:inline-flex}.btn svg{width:16px;height:16px}.btn-primary{background:var(--accent);color:#071018;border-color:#0000;font-weight:600}.btn-primary:hover{background:#8bbcff}.btn-ghost:hover,.btn-cv:hover{border-color:var(--accent);color:var(--accent)}.btn-cv{min-height:40px;padding-inline:12px;font-size:.86rem}.btn.is-static{cursor:default;color:var(--muted)}[dir=rtl] .flip-rtl{transform:scaleX(-1)}::selection{background:var(--accent-soft);color:var(--text)}.nav{z-index:40;height:var(--nav-h);background:var(--bg);border-bottom:1px solid #0000;position:sticky;top:0}.nav.is-scrolled{border-bottom-color:var(--line)}.nav-inner{width:min(calc(100% - 40px), var(--max));justify-content:space-between;align-items:center;gap:20px;height:100%;margin-inline:auto;display:flex}.nav-brand{font-family:var(--mono);letter-spacing:.02em;white-space:nowrap;font-size:1.05rem;font-weight:600}.nav-links{align-items:center;gap:22px;display:none}.nav-links a{color:var(--muted);font-size:.92rem;transition:color .16s}.nav-links a:hover{color:var(--text)}.nav-end{align-items:center;gap:10px;display:flex}.nav-toggle{border:1px solid var(--line);width:44px;height:44px;color:var(--text);background:0 0;border-radius:6px;justify-content:center;align-items:center;display:inline-flex}.mobile-menu{inset:var(--nav-h) 0 0 0;background:var(--bg);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,transform .18s,visibility .18s;position:fixed;transform:translateY(-8px)}.mobile-menu.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:none}.mobile-menu nav{gap:8px;padding:28px 20px;display:grid}.mobile-menu a{border-bottom:1px solid var(--line);align-items:center;min-height:48px;padding-inline:4px;font-size:1.2rem;display:flex}.hero{padding:56px 0 72px}.hero-grid{align-items:center;gap:36px;display:grid}.hero-kicker{color:var(--accent);font-family:var(--mono);letter-spacing:.18em;margin-bottom:16px;font-size:.78rem;font-weight:500}.hero h1{letter-spacing:-.03em;font-size:clamp(1.9rem,5.4vw,3.6rem);font-weight:700;line-height:1.25}.hero h1 span{color:#c5ced9;font-weight:600;display:block}.hero-lead{max-width:42rem;color:var(--muted);margin-top:18px;font-size:1.05rem}.hero-actions{flex-wrap:wrap;gap:10px;margin-top:26px;display:flex}.hero-badges{flex-wrap:wrap;gap:8px;margin-top:22px;display:flex}.hero-badges li,.tech-list li,.project-highlights li,.about-focus li,.timeline-card ul li{border:1px solid var(--line);min-height:28px;color:var(--muted);font-family:var(--mono);border-radius:4px;align-items:center;padding:0 10px;font-size:.74rem;display:inline-flex}.code-window{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--bg-elev);width:min(100%,420px);box-shadow:var(--shadow);margin-inline:auto;overflow:hidden}.code-window-bar{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:9px 12px;display:flex}.code-dots{gap:5px;display:flex}.code-dots i{background:#2d3541;border-radius:50%;width:8px;height:8px}.code-filename,.code-lang{font-family:var(--mono);color:var(--faint);font-size:.72rem}.code-filename{color:var(--muted);margin-inline-end:auto}.code-window-body{font-family:var(--mono);color:#d5deea;margin:0;padding:14px 12px 16px;font-size:.78rem;line-height:1.8;overflow:auto}.code-window-body .ln{color:#4d5666;width:18px;margin-inline-end:12px;display:inline-block}.kw{color:#8bb4ff}.cl,.fn{color:var(--text)}.st{color:#9db8a6}.cursor{background:var(--accent);vertical-align:-2px;width:7px;height:13px;margin-inline-start:3px;animation:1.1s step-end infinite blink;display:inline-block}.section{border-top:1px solid var(--line);padding:84px 0}.section-head{margin-bottom:32px}.section-title{letter-spacing:-.03em;font-size:clamp(1.7rem,3vw,2.3rem)}.about-grid,.contact-grid,.project-split{gap:28px;display:grid}.about-copy{color:var(--muted);gap:14px;font-size:1.04rem;display:grid}.about-focus,.tech-list,.project-highlights,.hero-badges,.timeline-card ul{flex-wrap:wrap;gap:8px;display:flex}.stat-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.stat-card,.skill-card,.build-card,.timeline-card,.feature-card,.project-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-card)}.stat-card{padding:18px 16px}.stat-card strong{color:var(--text);font-family:var(--mono);font-size:1.4rem;display:block}.stat-card span{color:var(--muted);font-size:.86rem}.stack-groups{gap:28px;display:grid}.stack-group h3{color:var(--muted);font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;font-size:.78rem;font-weight:500}.stack-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.skill-card{align-items:center;gap:10px;min-height:58px;padding:10px 12px;transition:border-color .16s,transform .16s;display:flex}.skill-card:hover,.build-card:hover,.project-card:hover,.feature-card:hover,.timeline-card:hover{border-color:var(--line-strong);transform:translateY(-2px)}.skill-card-icon{border:1px solid var(--line);width:34px;height:34px;color:var(--accent);border-radius:6px;place-items:center;display:grid}.skill-card-name{font-size:.95rem}.projects-layout,.projects-grid{gap:18px;display:grid}.project-card{transition:border-color .16s,transform .16s,box-shadow .16s;overflow:hidden}.project-card:hover{box-shadow:0 0 0 1px var(--accent-glow)}.project-card.is-featured{box-shadow:var(--shadow);border-color:#6ea8fe47}.project-card-media{border-bottom:1px solid var(--line);background:#0a0e14;display:block}.project-card-body{gap:12px;padding:20px;display:grid}.project-card-meta{color:var(--faint);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;flex-wrap:wrap;gap:8px;font-size:.72rem;display:flex}.featured-flag{color:var(--accent)}.project-card h3{font-size:1.35rem}.project-card-copy{color:var(--muted)}.project-card-actions{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.mockup{min-height:210px;padding:12px}.mockup.is-large{min-height:280px}.mockup-chrome{color:var(--faint);font-family:var(--mono);justify-content:space-between;margin-bottom:10px;font-size:.68rem;display:flex}.mockup-chrome b{color:var(--accent);font-weight:500}.mockup-body{grid-template-columns:88px 1fr;gap:10px;min-height:170px;display:grid}.mockup-side,.mockup-main,.mockup-lesson,.mockup-editor,.mockup-grid article,.mockup-pos,.mockup-tenants article{border:1px solid var(--line);background:#0e141c;border-radius:6px}.mockup-side{align-content:start;gap:8px;padding:10px 8px;display:grid}.mockup-brand{color:var(--accent);font-family:var(--mono);letter-spacing:.12em;font-size:.68rem}.mockup-side small,.mockup-lesson ol li{color:var(--muted);font-size:.68rem}.mockup-side small.is-active,.mockup-lesson ol li.is-active{color:var(--text)}.mockup-main{padding:10px}.mockup-kpis{grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:8px;display:grid}.mockup-kpis div,.mockup-row{border:1px solid var(--line);border-radius:4px;padding:8px}.mockup-kpis em,.mockup-kpis strong{font-style:normal;display:block}.mockup-kpis em{color:var(--faint);font-size:.62rem}.mockup-kpis strong{font-family:var(--mono);font-size:.92rem}.mockup-row{color:var(--muted);grid-template-columns:.7fr 1.2fr .4fr;gap:6px;margin-top:6px;font-size:.68rem;display:grid}.mockup-row.is-head{color:var(--faint)}.mockup-body-split{grid-template-columns:1fr 1.1fr}.mockup-lesson,.mockup-editor{padding:12px}.mockup-lesson p{color:var(--muted);margin:8px 0 12px;font-size:.78rem}.mockup-lesson ol{gap:8px;display:grid}.mockup-editor span{color:var(--faint);font-family:var(--mono);font-size:.68rem}.mockup-editor pre{color:#c9d4e3;font-family:var(--mono);margin:10px 0 0;font-size:.72rem;line-height:1.7}.mockup-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.mockup-grid article{min-height:86px;padding:10px}.mockup-grid i{background:#1a222d;border-radius:4px;height:42px;margin-bottom:8px;display:block}.mockup-grid span,.mockup-pos,.mockup-tenants article{color:var(--muted);font-size:.78rem}.mockup-pos,.mockup-tenants{gap:8px;min-height:160px;display:grid}.mockup-pos{grid-template-columns:1.4fr .8fr;padding:12px}.mockup-total,.mockup-tenants article{padding:12px}.mockup-total strong,.mockup-tenants .is-active span{color:var(--text);font-family:var(--mono);display:block}.mockup-tenants{grid-template-columns:1fr 1fr}.timeline{border-inline-start:1px solid var(--line-strong);gap:18px;padding-inline-start:22px;display:grid}.timeline-item{position:relative}.timeline-mark{top:22px;background:var(--bg);border:1px solid var(--accent);width:9px;height:9px;box-shadow:0 0 0 4px var(--accent-soft);border-radius:50%;position:absolute;inset-inline-start:-27px}.timeline-card{padding:20px}.timeline-card header h3{font-size:1.15rem}.timeline-card header p{color:var(--faint);font-family:var(--mono);flex-wrap:wrap;gap:10px;margin:8px 0 12px;font-size:.78rem;display:flex}.timeline-card>p{color:var(--muted);margin-bottom:12px}.build-grid,.feature-grid{gap:12px;display:grid}.build-card,.feature-card{padding:18px;transition:border-color .16s,transform .16s}.build-icon{border:1px solid var(--line);width:36px;height:36px;color:var(--accent);border-radius:6px;place-items:center;margin-bottom:14px;display:grid}.build-card h3,.feature-card h3{margin-bottom:8px;font-size:1.02rem}.build-card p,.feature-card p{color:var(--muted)}.contact-lead{max-width:40rem;color:var(--muted);font-size:1.08rem}.contact-actions{flex-wrap:wrap;gap:10px;display:flex}.contact-list{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-card);gap:12px;padding:16px;display:grid}.contact-list li{gap:2px;display:grid}.contact-list span{color:var(--faint);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}.contact-list a{color:var(--text);word-break:break-all}.contact-list a:hover{color:var(--accent)}.footer{border-top:1px solid var(--line);padding:28px 0}.footer-inner{gap:16px;display:grid}.footer strong{display:block}.footer p,.copyright{color:var(--muted);font-size:.9rem}.footer nav{flex-wrap:wrap;gap:16px;display:flex}.footer nav a{color:var(--muted);align-items:center;gap:6px;display:inline-flex}.footer nav a:hover{color:var(--text)}.footer svg{width:16px;height:16px}.project-page,.cv-page{padding:36px 0 88px}.back-link{color:var(--muted);align-items:center;gap:8px;margin-bottom:28px;display:inline-flex}.back-link svg{width:16px;height:16px;transform:scaleX(-1)}.project-hero h1{letter-spacing:-.03em;font-size:clamp(2rem,5vw,3.2rem)}.project-lead{max-width:44rem;color:var(--muted);margin:14px 0 20px;font-size:1.05rem}.project-showcase{border:1px solid var(--line);border-radius:var(--radius);background:#0a0e14;margin:28px 0 8px;overflow:hidden}.project-block{padding-top:36px}.project-block h2{margin-bottom:14px;font-size:1.2rem}.project-block p{color:var(--muted)}.detail-stack{gap:16px;display:grid}.detail-stack h3{color:var(--faint);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;font-size:.76rem}.arch-list{gap:10px;display:grid}.arch-list li{border:1px solid var(--line);color:var(--muted);background:var(--bg-card);border-radius:6px;padding:12px 14px}.screenshot-grid{gap:12px;display:grid}.empty-state{justify-items:start;gap:12px;padding:80px 0;display:grid}.cv-toolbar{justify-content:space-between;gap:10px;margin-bottom:18px;display:flex}.cv-sheet{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-card);gap:22px;padding:28px 22px;display:grid}.cv-head{border-bottom:1px solid var(--line);gap:12px;padding-bottom:16px;display:grid}.cv-head h1{font-size:1.8rem}.cv-head p,.cv-head li,.cv-sheet p{color:var(--muted)}.cv-sheet h2{color:var(--accent);font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px;font-size:.78rem}.cv-job+.cv-job{margin-top:14px}.cv-job h3{flex-wrap:wrap;gap:8px;margin-bottom:6px;display:flex}.cv-job h3 span{color:var(--faint);font-weight:400}.reveal{opacity:0;animation:none;transform:translateY(12px)}.reveal.is-visible{opacity:1;transition:opacity .42s,transform .42s;transform:none}@keyframes blink{50%{opacity:0}}@media (width>=720px){.nav-toggle{display:none}.nav-links{display:flex}.stack-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.hero{padding:72px 0 92px}.about-grid,.project-split,.projects-grid,.build-grid,.feature-grid,.screenshot-grid,.contact-grid{grid-template-columns:1fr 1fr}.contact-grid{grid-template-columns:1.2fr .8fr;align-items:start}.contact-actions{grid-column:1}.contact-list{grid-area:1/2/span 3}.footer-inner{grid-template-columns:1fr auto;align-items:center}.copyright{grid-column:1/-1}}@media (width>=980px){.hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(280px,.7fr);gap:48px}.code-window{margin-inline:0}.project-card.is-featured{grid-template-columns:1.15fr .85fr;display:grid}.project-card.is-featured .project-card-media{border-bottom:0;border-inline-end:1px solid var(--line)}.build-grid,.feature-grid{grid-template-columns:repeat(3,1fr)}.cv-head{grid-template-columns:1fr auto}}@media (width<=719px){.container,.nav-inner{width:min(calc(100% - 28px), var(--max))}.nav .btn-cv{display:none}.nav-brand{font-size:.95rem}.hero{padding-top:36px}.section{padding:64px 0}.mockup-body,.mockup-body-split,.mockup-pos,.mockup-tenants{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}@media print{.nav,.footer,.cv-toolbar,.skip-link{display:none!important}body,.cv-sheet{color:#111;background:#fff}.cv-sheet,.cv-head{border-color:#ddd}.cv-sheet h2{color:#111}.cv-head p,.cv-head li,.cv-sheet p{color:#333}}