*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#0f1219;--bg-secondary:#161b26;--bg-card:#1c2130;--bg-card-hover:#222838;--bg-input:#1e2433;--accent-cyan:#0ea5e9;--accent-blue:#3b82f6;--accent-purple:#7c3aed;--accent-green:#10b981;--accent-orange:#f59e0b;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--border:#ffffff0f;--border-light:#ffffff1a;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--shadow-card:0 4px 24px #0003;--shadow-lg:0 12px 48px #00000059}html{scroll-behavior:smooth}body{background:var(--bg-primary);color:var(--text-primary);font-family:Inter,Noto Sans SC,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;overflow-x:hidden}::selection{background:#0ea5e940}#app{width:100%}.nav{z-index:100;-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);background:#0f1219e0;justify-content:space-between;align-items:center;height:64px;padding:0 32px;display:flex;position:fixed;top:0;left:0;right:0}.nav-left{align-items:center;gap:40px;display:flex}.nav-logo{flex-shrink:0;align-items:center;gap:10px;text-decoration:none;display:flex}.nav-logo-mark{background:0 0;border-radius:10px;flex-shrink:0;width:38px;height:38px;position:relative;overflow:hidden}.nav-logo-mark img{object-fit:contain;width:100%;height:100%;display:block}.nav-logo-text{letter-spacing:1px;background:linear-gradient(135deg,#a78bfa,#38bdf8,#34d399);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;align-items:baseline;gap:6px;font-size:17px;font-weight:700;display:flex}.nav-links{align-items:center;gap:4px;list-style:none;display:flex}.nav-links a{color:var(--text-secondary);border-radius:var(--radius-sm);align-items:center;gap:6px;padding:7px 16px;font-size:14px;font-weight:500;text-decoration:none;transition:all .25s;display:flex;position:relative}.nav-links a svg{opacity:.6;width:16px;height:16px;transition:opacity .25s}.nav-links a:hover{color:var(--text-primary);background:#ffffff0a}.nav-links a:hover svg{opacity:1}.nav-links a.active{color:var(--accent-cyan);background:#0ea5e91a}.nav-links a.active:after{content:"";background:var(--accent-cyan);border-radius:1px;width:20px;height:2px;position:absolute;bottom:2px;left:50%;transform:translate(-50%);box-shadow:0 0 8px #0ea5e966}.nav-right{align-items:center;gap:12px;display:flex}.nav-user-name{color:var(--text-secondary);font-size:14px;font-weight:500}.btn-login{border-radius:var(--radius-full);background:linear-gradient(135deg, var(--accent-purple), var(--accent-blue));color:#fff;cursor:pointer;border:none;padding:7px 24px;font-size:13px;font-weight:600;text-decoration:none;transition:all .25s;box-shadow:0 2px 12px #7c3aed40}.btn-login:hover{transform:translateY(-1px);box-shadow:0 4px 20px #7c3aed66}.hero{align-items:center;width:100%;height:100vh;min-height:560px;max-height:900px;display:flex;position:relative;overflow:hidden}.hero-overlay{z-index:1;background:linear-gradient(135deg,#0f1219eb 0%,#0f121999 50%,#0f1219d9 100%);position:absolute;inset:0}.hero-overlay:after{content:"";background:linear-gradient(to bottom, transparent 60%, var(--bg-primary) 100%);position:absolute;inset:0}.hero-particles{z-index:2;pointer-events:none;position:absolute;inset:0}.hero-content{z-index:10;width:100%;max-width:720px;padding:64px clamp(24px,5vw,80px) 0;position:relative}.hero-badge{border-radius:var(--radius-full);opacity:0;background:#0ea5e914;border:1px solid #0ea5e933;align-items:center;gap:8px;margin-bottom:28px;padding:6px 16px;animation:.7s .2s forwards fadeUp;display:inline-flex;transform:translateY(16px)}.hero-badge-dot{background:var(--accent-cyan);border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite pulse-dot}@keyframes pulse-dot{0%,to{opacity:1;box-shadow:0 0 #0ea5e966}50%{opacity:.6;box-shadow:0 0 0 6px #0ea5e900}}.hero-badge span{color:var(--accent-cyan);letter-spacing:1px;font-size:12px;font-weight:600}.hero-title{color:#fff;margin-bottom:20px;font-size:clamp(32px,5.5vw,64px);font-weight:700;line-height:1.15}.hero-title .line{display:block;overflow:hidden}.hero-title .line-inner{opacity:0;animation:.85s cubic-bezier(.16,1,.3,1) forwards slideUp;display:block;transform:translateY(100%)}.hero-title .line:first-child .line-inner{animation-delay:.3s}.hero-title .line:nth-child(2) .line-inner{animation-delay:.45s}.hero-title .line:nth-child(3) .line-inner{animation-delay:.6s}.hero-title .highlight{background:linear-gradient(135deg,#a78bfa 0%,#38bdf8 40%,#34d399 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-desc{color:var(--text-secondary);opacity:0;max-width:520px;margin-bottom:36px;font-size:clamp(14px,1.3vw,17px);font-weight:400;line-height:1.75;animation:.7s .8s forwards fadeUp;transform:translateY(16px)}.hero-actions{opacity:0;flex-wrap:wrap;align-items:center;gap:14px;animation:.7s 1s forwards fadeUp;display:flex;transform:translateY(16px)}.btn-hero-primary{border-radius:var(--radius-full);background:linear-gradient(135deg, var(--accent-purple), var(--accent-blue));color:#fff;cursor:pointer;border:none;align-items:center;gap:8px;padding:12px 32px;font-size:14px;font-weight:600;text-decoration:none;transition:all .25s;display:inline-flex;box-shadow:0 4px 20px #7c3aed4d}.btn-hero-primary:hover{transform:translateY(-2px);box-shadow:0 6px 28px #7c3aed73}.btn-hero-secondary{border-radius:var(--radius-full);color:var(--text-primary);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff26;align-items:center;gap:8px;padding:12px 32px;font-size:14px;font-weight:500;text-decoration:none;transition:all .25s;display:inline-flex}.btn-hero-secondary:hover{background:#ffffff14;border-color:#ffffff4d}.hero-stats{opacity:0;gap:40px;margin-top:48px;animation:.7s 1.2s forwards fadeUp;display:flex}.hero-stat-num{color:#fff;font-variant-numeric:tabular-nums;font-size:28px;font-weight:700}.hero-stat-num .num-highlight{background:linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-stat-label{color:var(--text-muted);margin-top:2px;font-size:12px;font-weight:500}.hero-scroll{z-index:10;opacity:0;animation:.7s 1.5s forwards fadeUp;position:absolute;bottom:32px;left:50%;transform:translate(-50%)}.hero-scroll span{text-align:center;color:var(--text-muted);letter-spacing:3px;text-transform:uppercase;margin-bottom:8px;font-size:10px;display:block}.hero-scroll-line{background:linear-gradient(#ffffff40,#0000);width:1px;height:36px;margin:0 auto}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}.footer{border-top:1px solid var(--border);margin-top:40px;padding:48px clamp(24px,5vw,80px) 32px}.footer-inner{max-width:1280px;margin:0 auto}.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px;display:grid}.footer-brand p{color:var(--text-muted);margin-top:12px;font-size:13px;line-height:1.6}.footer-col-title{color:#fff;margin-bottom:16px;font-size:14px;font-weight:600}.footer-col a{color:var(--text-secondary);font-size:13px;line-height:2.4;text-decoration:none;transition:color .2s;display:block}.footer-col a:hover{color:#fff}.footer-bottom{border-top:1px solid var(--border);color:var(--text-muted);justify-content:space-between;align-items:center;padding-top:24px;font-size:12px;display:flex}.footer-bottom a{color:var(--text-muted);text-decoration:none;transition:color .2s}.footer-bottom a:hover{color:var(--text-secondary)}@media (width<=768px){.nav{padding:0 16px}.nav-links{display:none}.hero-title{font-size:clamp(28px,9vw,40px)}.hero-stats{flex-wrap:wrap;gap:24px}.hero-stat-num{font-size:22px}.hero-desc{margin-bottom:24px}.hero-actions{gap:10px}.btn-hero-primary,.btn-hero-secondary{padding:10px 24px;font-size:13px}.footer-grid{grid-template-columns:1fr 1fr;gap:20px 24px}.footer-brand{grid-column:1/-1;margin-bottom:4px}.footer-brand p{margin-top:8px}.footer-bottom{text-align:center;flex-direction:column;gap:8px}.footer{padding:32px 16px 24px}.footer-col-title{margin-bottom:10px;font-size:13px}.footer-col a{line-height:2}}@media (width<=480px){.nav{height:56px}.hero{min-height:480px}.hero-content{padding-top:56px}.hero-badge{margin-bottom:20px;padding:5px 12px}.hero-badge span{font-size:11px}.hero-stats{gap:20px;margin-top:32px}.hero-stat-num{font-size:20px}.hero-stat-label{font-size:11px}.btn-hero-primary,.btn-hero-secondary{padding:10px 20px;font-size:13px}}
