:root{--bg-gradient:linear-gradient(135deg, #060a13 0%, #0a1124 50%, #121c35 100%);--text-primary:#f3f4f6;--text-secondary:#9ca3af;--accent-dev-h:180;--accent-dev-s:100%;--accent-dev-l:50%;--accent-dev:hsl(var(--accent-dev-h), var(--accent-dev-s), var(--accent-dev-l));--accent-prod-h:275;--accent-prod-s:100%;--accent-prod-l:65%;--accent-prod:hsl(var(--accent-prod-h), var(--accent-prod-s), var(--accent-prod-l));--accent-cons-h:38;--accent-cons-s:100%;--accent-cons-l:55%;--accent-cons:hsl(var(--accent-cons-h), var(--accent-cons-s), var(--accent-cons-l));--theme-color:var(--accent-dev);--theme-glow:hsla(var(--accent-dev-h), var(--accent-dev-s), var(--accent-dev-l), .15);--theme-glow-strong:hsla(var(--accent-dev-h), var(--accent-dev-s), var(--accent-dev-l), .5);--font-heading:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--glass-bg:#0a0f1e80;--glass-border:#ffffff0d;--glass-border-hover:#ffffff1f;--glass-shadow:0 20px 50px #00000080}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-gradient);width:100%;height:100%;color:var(--text-primary);font-family:var(--font-body);background-attachment:fixed;font-size:16px;line-height:1.6;transition:background 1.5s;overflow-x:hidden}#cursor-glow{background:radial-gradient(circle, var(--theme-glow) 0%, #0000 70%);pointer-events:none;z-index:1;width:300px;height:300px;transition:background .5s;position:fixed;top:-150px;left:-150px}#webgl-canvas{z-index:0;pointer-events:auto;width:100%;height:100%;position:fixed;top:0;left:0}#app{z-index:2;pointer-events:none;flex-direction:column;justify-content:space-between;min-height:100vh;display:flex;position:relative}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);pointer-events:auto;border-radius:16px;transition:border-color .3s,box-shadow .3s,transform .3s}.hud-top{justify-content:space-between;align-items:center;width:100%;padding:2rem 4rem;display:flex}.brand{pointer-events:auto;align-items:center;gap:.6rem;display:flex}.logo-dot{background-color:var(--theme-color);width:10px;height:10px;box-shadow:0 0 10px var(--theme-glow-strong);border-radius:50%;transition:background-color .5s,box-shadow .5s}.logo-text{font-family:var(--font-heading);letter-spacing:2px;background:linear-gradient(135deg, #fff, var(--theme-color));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.2rem;font-weight:800;transition:filter .5s}.hud-controls{pointer-events:auto;align-items:center;gap:1rem;display:flex}.lang-switcher{border-radius:26px;justify-content:center;align-items:center;gap:.25rem;height:52px;padding:.25rem;display:flex}.lang-btn{color:var(--text-secondary);font-family:var(--font-heading);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:.8rem;font-weight:800;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex}.lang-btn:hover{color:var(--text-primary);background:#ffffff08}.lang-btn.active{color:var(--theme-color);box-shadow:0 0 15px var(--theme-glow);background:#ffffff14;border:1px solid #ffffff14}.weather-widget{border-radius:26px;align-items:center;min-width:250px;height:52px;padding:.75rem 1.25rem;font-size:.85rem;display:flex}.weather-loading{color:var(--text-secondary);align-items:center;gap:.5rem;font-size:.8rem;display:flex}.spinner{border:2px solid #ffffff1a;border-top-color:var(--theme-color);border-radius:50%;width:14px;height:14px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.weather-content{align-items:center;gap:.75rem;width:100%;display:flex}.weather-icon{font-size:1.2rem}.weather-info{flex-direction:column;display:flex}.weather-city{color:var(--text-primary);font-weight:600}.weather-temp{color:var(--text-secondary);font-size:.75rem}.scene-status{border-left:1px solid #ffffff1a;flex-direction:column;margin-left:auto;padding-left:.75rem;display:flex}.status-label{color:var(--text-secondary);font-size:.7rem}.status-value{color:var(--theme-color);font-weight:600;transition:color .5s}.main-layout{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;width:100%;max-width:1440px;margin:0 auto;padding:0 4rem 2rem;display:grid}.hero-section{flex-direction:column;gap:2.5rem;display:flex}.hero-text{pointer-events:auto}.hero-text h1{font-family:var(--font-heading);letter-spacing:-1px;background:linear-gradient(135deg,#fff,#8892b0);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:1.5rem;font-size:4rem;font-weight:800;line-height:1.1}.hero-text .tagline{color:var(--text-secondary);max-width:480px;font-size:1.25rem}.role-nav{flex-direction:column;gap:.75rem;width:fit-content;padding:.75rem;display:flex}.nav-tab{color:var(--text-secondary);font-family:var(--font-heading);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;align-items:center;gap:.75rem;width:250px;padding:.85rem 1.5rem;font-size:1rem;font-weight:600;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex}.nav-tab .tab-icon{opacity:.6;justify-content:center;align-items:center;transition:opacity .3s,transform .3s;display:flex}.nav-tab:hover{color:var(--text-primary);background:#ffffff08}.nav-tab:hover .tab-icon{opacity:.9;transform:translate(2px)}.nav-tab.active{color:var(--theme-color);background:#ffffff0d;border-color:#ffffff14;box-shadow:0 4px 20px #0003}.nav-tab.active .tab-icon{opacity:1;color:var(--theme-color)}.content-section{align-items:center;min-height:380px;display:flex;position:relative}.role-content{opacity:0;pointer-events:none;flex-direction:column;gap:1.5rem;width:100%;padding:2.5rem;transition:opacity .5s,transform .5s cubic-bezier(.16,1,.3,1);display:flex;position:absolute;top:50%;left:0;transform:translateY(-50%)scale(.95)}.role-content.active{opacity:1;pointer-events:auto;position:relative;top:auto;left:auto;transform:translateY(0)scale(1)}.content-header h2{font-family:var(--font-heading);color:#fff;margin-bottom:.5rem;font-size:1.8rem;font-weight:600}.glow-line{background-color:var(--theme-color);width:60px;height:2px;box-shadow:0 0 10px var(--theme-color);border-radius:1px;transition:background-color .5s,box-shadow .5s,width .5s}.role-content:hover .glow-line{width:120px}.description{color:var(--text-secondary);font-size:1.05rem;line-height:1.7}.skills-grid{flex-wrap:wrap;gap:.6rem;margin-top:.5rem;display:flex}.skill-tag{color:#e5e7eb;background:#ffffff0a;border:1px solid #ffffff0f;border-radius:20px;padding:.4rem .85rem;font-size:.8rem;font-weight:500;transition:all .3s}.skill-tag:hover{border-color:var(--theme-color);box-shadow:0 0 12px rgba(var(--theme-color), .2);color:#fff;background:#ffffff14;transform:translateY(-2px)}.hud-bottom{justify-content:space-between;align-items:center;width:100%;padding:2rem 4rem;display:flex}.copyright{color:var(--text-secondary);font-size:.85rem}.social-links{pointer-events:auto;gap:1.25rem;display:flex}.social-icon{color:var(--text-secondary);background:#ffffff08;border:1px solid #ffffff0d;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex}.social-icon svg{transition:transform .4s}.social-icon:hover{color:var(--theme-color);border-color:var(--theme-glow-strong);box-shadow:0 0 15px var(--theme-glow);background:#ffffff0f}.social-icon:hover svg{transform:scale(1.15)}.hidden{display:none!important}@media (width<=1024px){.main-layout{grid-template-columns:1fr;gap:3rem;padding:0 2rem 2rem}.hud-top{padding:1.5rem 2rem}.hud-bottom{flex-direction:column;gap:1.5rem;padding:1.5rem 2rem}.hero-section{text-align:center;align-items:center}.hero-text .tagline{margin:0 auto}.role-nav{flex-flow:wrap;justify-content:center;width:100%}.nav-tab{flex-grow:1;justify-content:center;width:auto;max-width:220px}.content-section{min-height:auto}.role-content{padding:2rem;display:none;position:relative;top:auto;left:auto;transform:none}.role-content.active{display:flex;transform:none}}@media (width<=640px){.hero-text h1{font-size:2.8rem}.hud-top{flex-direction:column;align-items:center;gap:1rem}.nav-tab{padding:.75rem 1rem;font-size:.9rem}}