@import"https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Outfit:wght@300;400;500;600;700&display=swap";:root{color-scheme:dark;--font-display: "Outfit", system-ui, sans-serif;--font-mono: "Space Mono", "Fira Code", ui-monospace, monospace;line-height:1.6;font-weight:400;--bg: #08070b;--bg-gradient: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(120, 80, 200, .15), transparent);--surface: #0f0e14;--surface-2: #16141e;--surface-hover: #1c1a26;--border: #2a2636;--border-hover: #3d3654;--text: #e8e4f0;--text-muted: #8b8598;--text-dim: #5c5670;--accent: #8b5cf6;--accent-bright: #a78bfa;--accent-glow: rgba(139, 92, 246, .4);--accent-subtle: rgba(139, 92, 246, .1);--live: #22c55e;--live-glow: rgba(34, 197, 94, .5);--lab: #f59e0b;--radius: 12px;--radius-sm: 8px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;overflow-x:hidden;background-color:var(--bg);background-image:var(--bg-gradient);color:var(--text);font-family:var(--font-display)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes glow{0%,to{box-shadow:0 0 20px var(--accent-glow),0 0 40px #8b5cf61a}50%{box-shadow:0 0 30px var(--accent-glow),0 0 60px #8b5cf633}}@keyframes pulse-dot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.7}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes cursor-blink{0%,50%{opacity:1}51%,to{opacity:0}}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes border-glow{0%,to{border-color:var(--border)}50%{border-color:var(--border-hover)}}#app{position:relative;z-index:1;max-width:720px;margin:0 auto;padding:64px 24px 80px}.hero{padding:32px;border-radius:var(--radius);background:linear-gradient(135deg,var(--surface) 0%,var(--surface-2) 100%);border:1px solid var(--border);position:relative;overflow:hidden;animation:fadeInUp .6s ease-out}.hero:before{content:"";position:absolute;top:0;left:32px;right:32px;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);border-radius:2px}.hero:after{content:"";position:absolute;top:-100px;right:-100px;width:300px;height:300px;background:radial-gradient(circle,var(--accent-subtle) 0%,transparent 70%);pointer-events:none}.hero-top{display:flex;align-items:center;gap:20px;position:relative;z-index:1;margin-bottom:16px}.avatar{width:64px;height:64px;border-radius:var(--radius);border:2px solid var(--accent);object-fit:cover;animation:glow 3s ease-in-out infinite;transition:transform .3s ease}.avatar:hover{transform:scale(1.08) rotate(3deg)}.eyebrow{font-family:var(--font-mono);font-size:.75rem;color:var(--accent-bright);text-transform:uppercase;letter-spacing:.15em;margin-bottom:4px}.hero h1{margin:0;font-size:2.5rem;font-weight:700;letter-spacing:-.02em;background:linear-gradient(135deg,var(--text) 0%,var(--text-muted) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero>p{margin:0;color:var(--text-muted);font-size:1.1rem;line-height:1.7;max-width:540px;position:relative;z-index:1}section{margin-top:24px;padding:28px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);animation:fadeInUp .6s ease-out backwards;transition:border-color .3s ease}section:nth-child(2){animation-delay:.1s}section:nth-child(3){animation-delay:.15s}section:nth-child(4){animation-delay:.2s}section:nth-child(5){animation-delay:.25s}section:hover{border-color:var(--border-hover)}section h2{margin:0 0 16px;font-family:var(--font-mono);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--text-dim)}.section-body{margin:0;color:var(--text-muted);line-height:1.7}.projects{display:grid;gap:12px}.project{display:block;padding:20px;border-radius:var(--radius-sm);background:var(--surface-2);border:1px solid var(--border);text-decoration:none;color:inherit;position:relative;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.project:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,var(--accent-subtle) 0%,transparent 60%);opacity:0;transition:opacity .3s ease}.project:hover:before{opacity:1}.project:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 32px #0000004d,0 0 0 1px var(--accent-subtle)}.project-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;position:relative;z-index:1}.project strong{font-size:1.1rem;font-weight:600;color:var(--text);transition:color .3s ease}.project:hover strong{color:var(--accent-bright)}.project .section-body{position:relative;z-index:1;font-size:.95rem}.project .open{display:block;margin-top:12px;font-family:var(--font-mono);font-size:.75rem;color:var(--accent);opacity:0;transform:translate(-8px);transition:all .3s ease;position:relative;z-index:1}.project:hover .open{opacity:1;transform:translate(0)}.status{font-family:var(--font-mono);font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:4px 10px 4px 20px;border-radius:999px;background:var(--surface);color:var(--text-muted);position:relative}.status:before{content:"";position:absolute;left:8px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:var(--text-dim)}.project[data-status=live] .status{color:var(--live);background:#22c55e1a}.project[data-status=live] .status:before{background:var(--live);box-shadow:0 0 8px var(--live-glow);animation:pulse-dot 2s ease-in-out infinite}.project[data-status=lab] .status{color:var(--lab);background:#f59e0b1a}.project[data-status=lab] .status:before{background:var(--lab)}.notes{display:grid;gap:10px;padding:0;margin:0;list-style:none}.notes li{display:flex;align-items:center;gap:12px;color:var(--text-muted);padding:8px 0;transition:all .3s ease}.notes li:before{content:"→";font-family:var(--font-mono);color:var(--accent);font-size:.9rem;transition:transform .3s ease}.notes li:hover{color:var(--text)}.notes li:hover:before{transform:translate(4px)}.links{display:flex;flex-wrap:wrap;gap:10px}.links a{font-family:var(--font-mono);font-size:.85rem;color:var(--text);text-decoration:none;padding:10px 20px;border-radius:var(--radius-sm);background:var(--surface-2);border:1px solid var(--border);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.links a:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(139,92,246,.1),transparent);transform:translate(-100%);transition:transform .5s ease}.links a:hover:before{transform:translate(100%)}.links a:hover{border-color:var(--accent);color:var(--accent-bright);transform:translateY(-2px);box-shadow:0 4px 16px #8b5cf633}footer{margin-top:48px;padding-top:24px;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:.85rem;color:var(--text-dim);animation:fadeInUp .6s ease-out .3s backwards}footer:after{content:"▋";animation:cursor-blink 1s step-end infinite;margin-left:4px;color:var(--accent)}@media (max-width: 640px){#app{padding:40px 16px 60px}.hero{padding:24px}.hero h1{font-size:2rem}.hero>p{font-size:1rem}section{padding:20px}.avatar{width:56px;height:56px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}