:root{--bg: #ffffff;--bg-alt: #f5f5f7;--bg-dark: #0a0a0a;--bg-dark-2: #16161a;--ink: #1d1d1f;--ink-weak: #6e6e73;--ink-faint: #86868b;--ink-on-dark: #f5f5f7;--ink-weak-on-dark: #a1a1a6;--accent: #0071e3;--accent-2: #0a84ff;--accent-on-dark: #2997ff;--danger: #ff375f;--border: #e8e8ed;--border-dark: rgba(255, 255, 255, .14);--grad-brand: linear-gradient(120deg, #0a84ff 0%, #5e5ce6 55%, #bf5af2 100%);--r-sm: 10px;--r-md: 16px;--r-lg: 22px;--r-xl: 28px;--shadow-sm: 0 2px 10px rgba(0, 0, 0, .06);--shadow-md: 0 8px 30px rgba(0, 0, 0, .1);--shadow-lg: 0 24px 60px rgba(0, 0, 0, .16);--shadow-dark: 0 18px 48px rgba(0, 0, 0, .4);--nav-h: 54px;--font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--fs-hero: clamp(42px, 6.6vw, 76px);--fs-title: clamp(30px, 4.4vw, 46px);--fs-h2: clamp(22px, 3vw, 32px);--fs-h3: clamp(18px, 2vw, 22px);--fs-body: 17px;--fs-sm: 15px;--fs-xs: 13px;--ls-tight: -.015em;--ls-tight-2: -.03em;--ease: cubic-bezier(.22, 1, .36, 1);--dur: .7s}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font-sans);font-size:var(--fs-body);line-height:1.6;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:var(--ls-tight);color:var(--ink)}p{margin:0}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button{font-family:inherit;cursor:pointer}ul{margin:0;padding:0;list-style:none}::selection{background:#0071e32e}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}.container--narrow{max-width:880px}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}.section{padding:110px 0}.section--alt{background:var(--bg-alt)}.section--dark{background:var(--bg-dark);color:var(--ink-on-dark)}.section--dark h1,.section--dark h2,.section--dark h3{color:var(--ink-on-dark)}.section__head{max-width:640px;margin-bottom:56px}.section__head--center{margin-inline:auto;text-align:center}.section__title{font-size:var(--fs-title);letter-spacing:var(--ls-tight-2);line-height:1.1;margin-top:14px}.section__title--gradient{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.section__sub{color:var(--ink-weak);margin-top:16px;font-size:var(--fs-lg, 19px)}.section--dark .section__sub{color:var(--ink-weak-on-dark)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 26px;border-radius:980px;font-size:var(--fs-body);font-weight:500;letter-spacing:-.01em;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur) var(--ease)}.btn--primary{background:var(--accent);color:#fff;box-shadow:0 6px 24px #0071e352}.btn--primary:hover{transform:scale(1.03);box-shadow:0 10px 32px #0071e366}.btn--ghost{background:#0000000d;color:var(--ink)}.btn--ghost:hover{background:#00000017;transform:scale(1.03)}.btn--dark{background:var(--ink-on-dark);color:var(--ink)}.btn--dark:hover{transform:scale(1.03)}.btn--sm{padding:9px 20px;font-size:var(--fs-sm)}.link-accent{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-weight:500;transition:color .3s var(--ease)}.link-accent:hover{color:var(--accent-2)}.link-accent:hover .arrow{transform:translate(3px)}.arrow{display:inline-block;transition:transform .3s var(--ease)}.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:980px;font-size:var(--fs-xs);font-weight:600;letter-spacing:.02em;background:#0000000d;color:var(--ink)}.chip--outline{background:transparent;border:1px solid var(--border);color:var(--ink)}.nav{position:fixed;inset:0 0 auto;z-index:100;height:var(--nav-h);background:#ffffffb8;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(0,0,0,.08)}.nav__inner{height:100%;display:flex;align-items:center;justify-content:space-between}.nav__brand{display:inline-flex;align-items:center;gap:9px;font-size:18px;font-weight:600;letter-spacing:-.015em}.nav__logo{width:26px;height:26px;border-radius:8px;background:var(--grad-brand);display:grid;place-items:center;color:#fff;font-size:14px;box-shadow:var(--shadow-sm)}.nav__links{display:flex;align-items:center;gap:6px}.nav__link{position:relative;padding:8px 14px;border-radius:980px;font-size:var(--fs-sm);font-weight:500;color:var(--ink);transition:background .3s var(--ease),color .3s var(--ease)}.nav__link:hover{background:#0000000d}.nav__link.router-link-active{color:var(--accent);background:#0071e31a}.hero{position:relative;padding:calc(var(--nav-h) + 96px) 0 110px;overflow:hidden;text-align:center}.hero__glow{content:"";position:absolute;inset:-40% -20% auto;height:90%;background:radial-gradient(42% 60% at 30% 20%,rgba(10,132,255,.16),transparent),radial-gradient(46% 60% at 70% 28%,rgba(94,92,230,.18),transparent);pointer-events:none}.hero__inner{position:relative;z-index:1;max-width:840px;margin:0 auto}.hero__eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:980px;font-size:var(--fs-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);background:#0071e314;border:1px solid rgba(0,113,227,.16)}.hero__title{margin-top:30px;font-size:var(--fs-hero);font-weight:600;letter-spacing:var(--ls-tight-2);line-height:1.05}.hero__title em{font-style:normal;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.hero__sub{margin:26px auto 0;max-width:620px;font-size:clamp(18px,2.2vw,22px);color:var(--ink-weak);letter-spacing:-.01em}.hero__actions{margin-top:42px;display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.marquee{background:var(--bg-dark);color:var(--ink-on-dark);padding:34px 0;overflow:hidden}.marquee__track{display:flex;align-items:center;gap:28px;white-space:nowrap;animation:marquee 30s linear infinite;width:max-content;min-width:100%}.marquee__item{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-body);color:var(--ink-weak-on-dark)}.marquee__item .dot{color:var(--accent-on-dark)}@keyframes marquee{to{transform:translate(-50%)}}.cat-card{position:relative;display:block;padding:34px 32px;border-radius:var(--r-lg);background:var(--bg-dark-2);border:1px solid var(--border-dark);overflow:hidden;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease)}.cat-card:after{content:"";position:absolute;top:-40%;right:-30%;width:60%;height:80%;background:var(--cat-glow, var(--grad-brand));opacity:.14;filter:blur(40px);pointer-events:none;transition:opacity var(--dur) var(--ease)}.cat-card:hover{transform:translateY(-6px);border-color:#ffffff52;box-shadow:var(--shadow-dark)}.cat-card:hover:after{opacity:.26}.cat-card__icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px;background:#ffffff14;border:1px solid rgba(255,255,255,.12)}.cat-card__name{margin-top:20px;font-size:var(--fs-h3);color:var(--ink-on-dark);display:flex;align-items:center;justify-content:space-between}.cat-card__desc{margin-top:10px;font-size:var(--fs-sm);color:var(--ink-weak-on-dark);line-height:1.55}.cat-card__meta{margin-top:20px;display:flex;align-items:center;justify-content:space-between;font-size:var(--fs-xs);color:var(--ink-weak-on-dark)}.tool-card{display:block;border-radius:var(--r-lg);background:var(--bg);border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease)}.tool-card:hover{transform:translateY(-8px);border-color:#0071e347;box-shadow:var(--shadow-lg)}.tool-card__media{position:relative;height:152px;display:grid;place-items:center;overflow:hidden}.tool-card__media:after{content:"";position:absolute;top:-60%;left:-10%;width:120%;height:140%;background:radial-gradient(closest-side,rgba(255,255,255,.42),transparent 70%);opacity:.5}.tool-card__icon{position:relative;z-index:1;font-size:52px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.24));transition:transform var(--dur) var(--ease)}.tool-card:hover .tool-card__icon{transform:scale(1.12) rotate(-4deg)}.tool-card__body{padding:20px 22px 22px}.tool-card__name{margin-top:12px;font-size:19px;font-weight:600}.tool-card__tagline{margin-top:6px;font-size:var(--fs-sm);color:var(--ink-weak);line-height:1.5;min-height:2.4em}.tool-card__foot{margin-top:16px;display:flex;align-items:center;justify-content:space-between}.tool-card .chip{background:#0071e314;color:var(--accent)}.grid-cats{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}.grid-cats .cat-card{grid-column:span 6}.grid-tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}.skeleton{position:relative;overflow:hidden;background:#ececf1;border-radius:var(--r-md)}.skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);animation:shimmer 1.4s infinite}@keyframes shimmer{to{transform:translate(100%)}}.skel-card{background:var(--bg);border-radius:var(--r-lg);border:1px solid var(--border);overflow:hidden}.skel-card__media{height:152px;border-radius:var(--r-md);margin:12px 12px 0}.skel-card__body{padding:18px 22px 24px}.skel-card .line{height:14px;border-radius:8px;margin-top:10px}.state{padding:70px 0;text-align:center;color:var(--ink-weak)}.state__icon{font-size:44px}.state__title{margin-top:16px;font-size:var(--fs-h3);color:var(--ink)}.state__desc{margin-top:8px}.footer{background:var(--bg-alt);border-top:1px solid var(--border);padding:64px 0 40px;font-size:var(--fs-sm);color:var(--ink-weak)}.footer__grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:36px}.footer__brand{font-size:18px;font-weight:600;color:var(--ink)}.footer__about{margin-top:12px;max-width:280px;line-height:1.6}.footer__col-title{font-size:var(--fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ink);margin-bottom:14px}.footer__links a{display:block;padding:5px 0;transition:color .3s var(--ease)}.footer__links a:hover{color:var(--accent)}.footer__bottom{margin-top:48px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:var(--fs-xs)}.page-head{padding-top:calc(var(--nav-h) + 64px);padding-bottom:30px}.page-head__title{font-size:var(--fs-title);letter-spacing:var(--ls-tight-2);line-height:1.1}.page-head__sub{margin-top:14px;color:var(--ink-weak);font-size:19px}.search{display:flex;align-items:center;gap:10px;width:100%;max-width:360px;padding:12px 18px;border-radius:980px;background:var(--bg-alt);border:1px solid var(--border);transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}.search:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px #0071e324}.search input{flex:1;border:none;outline:none;background:transparent;font-size:var(--fs-sm);color:var(--ink)}.filters{display:flex;flex-wrap:wrap;gap:10px}.filter-pill{padding:8px 16px;border-radius:980px;font-size:var(--fs-sm);font-weight:500;color:var(--ink);background:var(--bg);border:1px solid var(--border);transition:all .3s var(--ease)}.filter-pill:hover{border-color:var(--accent)}.filter-pill--active{background:var(--accent);border-color:var(--accent);color:#fff}.page-enter-active,.page-leave-active{transition:opacity .24s var(--ease),transform .24s var(--ease)}.page-enter-from{opacity:0;transform:translateY(10px)}.page-leave-to{opacity:0;transform:translateY(-6px)}.reveal{opacity:0;transform:translateY(28px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}.reveal.in{opacity:1;transform:translateY(0)}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal,.marquee__track{animation:none;transition:none;opacity:1;transform:none}}@media(max-width:860px){.section{padding:80px 0}.grid-cats .cat-card{grid-column:span 12}.footer__grid{grid-template-columns:1fr 1fr}.hero{padding:calc(var(--nav-h) + 70px) 0 84px}}@media(max-width:560px){.footer__grid{grid-template-columns:1fr}.nav__links{display:none}.hero__actions .btn{width:100%}}
