:root{--bg-0: #0a0a0f;--bg-1: #16161d;--ink: #ede8dc;--muted: rgba(237, 232, 220, .55);--amber: #f59e0b;--amber-dim: rgba(245, 158, 11, .12);--line: rgba(237, 232, 220, .14);--font-display: "Syne", system-ui, sans-serif;--font-body: system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:auto}body{font-family:var(--font-body);color:var(--ink);background:radial-gradient(1100px 700px at 75% -10%,var(--bg-1),transparent 60%),radial-gradient(900px 600px at 10% 110%,rgba(230,161,78,.07),transparent 60%),var(--bg-0);background-attachment:fixed;overflow-x:hidden}::selection{background:var(--amber);color:var(--bg-0)}:focus-visible{outline:2px solid var(--amber);outline-offset:3px}#canvas-wrap{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1}#loader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;background:var(--bg-0);transition:opacity .6s ease}#loader span{color:var(--amber);letter-spacing:.14em;animation:pulse 1.4s ease-in-out infinite}#loader.done{opacity:0;pointer-events:none}.top-links{display:flex;gap:1.4rem}.top-links a{color:var(--muted);font-size:.78rem;letter-spacing:.12em;text-decoration:none;transition:color .2s ease}.top-links a:hover{color:var(--amber)}.contact-row{display:flex;align-items:center;justify-content:center;gap:1.4rem;flex-wrap:wrap;margin-top:1.6rem}.contact-link{color:var(--muted);font-size:.82rem;letter-spacing:.08em;text-decoration:none;border-bottom:1px dashed var(--line);transition:color .2s ease}.contact-link:hover{color:var(--amber)}.outro-hint{margin-top:2.4rem;font-size:.75rem;color:var(--muted);opacity:.75}.outro-hint a{color:var(--amber);text-decoration:none}.mode-chip{position:fixed;top:0;left:0;z-index:6;padding:.45em 1em;font-size:.75rem;letter-spacing:.1em;color:var(--ink);background:#0a0a0fd9;border:1px solid rgba(245,158,11,.4);border-radius:999px;opacity:0;pointer-events:none;transition:opacity .3s ease;white-space:nowrap}.mode-chip.show{opacity:1}.mode-chip.static{position:static;display:inline-block;color:var(--muted)}#esc-chip{top:18px;left:50%;transform:translate(-50%)}.hero-actions{display:flex;align-items:center;gap:1rem;margin-top:1.6rem;flex-wrap:wrap}#op-panel{position:fixed;right:3.5vw;top:50%;transform:translateY(-50%) translate(28px);z-index:7;width:min(340px,84vw);padding:1.4rem 1.5rem;background:#0a0a0fe0;border:1px solid rgba(245,158,11,.35);border-radius:14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .35s ease,transform .35s ease}#op-panel.show{opacity:1;pointer-events:auto;transform:translateY(-50%) translate(0)}#op-panel .op-name{font-family:var(--font-display);font-size:1.7rem;margin:.25rem 0 .15rem}#op-panel .op-role{color:var(--amber);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.5rem}#op-panel .op-line{color:var(--ink);font-size:.95rem;line-height:1.5}#op-panel .op-bullets{margin:.7rem 0 .2rem;padding-left:1.05rem;color:var(--muted);font-size:.85rem;line-height:1.55}#op-panel .op-bullets li{margin-bottom:.3rem}#op-panel .op-chips{margin:.8rem 0}#op-panel .op-link{color:var(--amber);font-size:.8rem;text-decoration:none;border-bottom:1px dashed rgba(245,158,11,.5)}.op-row{display:flex;align-items:center;justify-content:space-between;margin-top:1.1rem}.op-btn{background:transparent;border:1px solid rgba(245,158,11,.4);color:var(--amber);border-radius:8px;padding:.35em .9em;font-size:.85rem;cursor:pointer}.op-btn:hover{background:var(--amber-dim)}.op-exit{width:100%;margin-top:.8rem;color:var(--muted);border-color:var(--line)}.op-dots{display:flex;gap:.45rem}.op-dot{width:8px;height:8px;border-radius:50%;background:#ede8dc33}.op-dot.on{background:var(--amber)}@media(pointer:coarse),(max-width:820px){#walk-hint{display:none}}#fade{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:var(--bg-0);opacity:0;pointer-events:none}#mii-tag,#nawaf-tag,#baddah-tag{position:fixed;top:0;left:0;z-index:5;transform:translate(-50%,-130%);padding:.3em .8em;font-size:.72rem;letter-spacing:.12em;color:var(--amber);background:#0a0a0fd1;border:1px solid rgba(245,158,11,.55);border-radius:999px;pointer-events:none;opacity:0;white-space:nowrap;transition:opacity .3s ease}@keyframes pulse{0%,to{opacity:.45}50%{opacity:1}}.top{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:1.1rem clamp(1.25rem,4vw,3rem)}.brand{font-family:var(--font-display);font-weight:800;font-size:.95rem;letter-spacing:.16em}.stack-tag{color:var(--muted);font-size:.75rem;letter-spacing:.08em}section{position:relative;min-height:100svh;display:flex;align-items:center;padding:clamp(1.5rem,6vw,6rem)}.content{max-width:min(36rem,100%)}.content.right{margin-left:auto}.content.center{margin-inline:auto;text-align:center}.mono{font-family:var(--font-mono)}.eyebrow{color:var(--amber);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:1.1rem}h1{font-family:var(--font-display);font-weight:800;font-size:clamp(2.7rem,7.5vw,5.4rem);line-height:1.02;letter-spacing:-.01em;margin-bottom:1.4rem}h2{font-family:var(--font-display);font-weight:700;font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.08;margin-bottom:1.1rem}.lede,.content p:not(.eyebrow):not(.cmd){color:var(--muted);font-size:1.05rem;line-height:1.7}.chip{color:var(--amber);background:var(--amber-dim);border:1px solid rgba(230,161,78,.25);border-radius:6px;padding:.1em .45em;font-size:.86em;white-space:nowrap}.cmd{margin-top:1.6rem;display:inline-block;color:var(--amber);background:#0e0c20bf;border:1px solid var(--line);border-radius:8px;padding:.7em 1em;font-size:.78rem;letter-spacing:.01em;max-width:100%;overflow-x:auto;text-align:left}.scroll-hint{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);color:var(--muted);font-size:.78rem;letter-spacing:.18em;animation:bob 2.2s ease-in-out infinite}@keyframes bob{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(8px)}}@media(prefers-reduced-motion:reduce){.scroll-hint,#loader span{animation:none}}@media(max-width:640px){h1{font-size:clamp(2rem,10.5vw,2.7rem)}.content.right{margin-left:0}.stack-tag{display:none}}.card{max-width:24rem;background:#0e0c208c;border:1px solid var(--line);border-radius:16px;padding:1.6rem 1.75rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card.right{margin-left:auto}.card .eyebrow{margin-bottom:.7rem}.project{font-family:var(--font-display);font-weight:800;font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1.05;margin-bottom:.55rem}.desc{color:var(--muted);font-size:.98rem;line-height:1.65}.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.05rem}.cta{display:inline-block;margin-top:1.5rem;color:var(--amber);text-decoration:none;font-weight:600;border-bottom:1px solid rgba(230,161,78,.4);padding-bottom:2px;transition:border-color .2s ease}.cta:hover{border-color:var(--amber)}@media(max-width:640px){.card.right{margin-left:0}}