:root{--bg-color:#fafbfc;--sidebar-bg:#fff;--card-bg:#fff;--primary-color:#6366f1;--primary-hover:#4f46e5;--primary-light:#eef2ff;--text-dark:#1e293b;--text-normal:#475569;--text-light:#64748b;--border-color:#e2e8f0;--shadow-color:rgba(100,116,139,.09);--primary-gradient:linear-gradient(135deg,#667eea,#764ba2)}
body{background:#fafbfc}#sidebar{background:linear-gradient(180deg,#fff,#fafbff);box-shadow:0 1px 3px var(--shadow-color)}
.sidebar-logo{display:inline-flex;align-items:center;gap:8px;font-weight:800;background:var(--primary-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.sidebar-logo:before{content:'';width:8px;height:8px;border-radius:50%;background:var(--primary-gradient)}
.sidebar-header{border-color:#f1f5f9}.user-info-panel .avatar{width:72px;height:72px;margin:0 auto 14px;box-shadow:0 0 0 4px #fff,0 3px 16px #c7d2fe}
.sidebar-nav{padding:16px;overflow:auto}.nav-link{padding:11px 14px;border-radius:10px;margin-bottom:4px;font-size:14px}.nav-link.active{background:var(--primary-gradient);color:#fff;box-shadow:0 4px 14px #6366f159}.nav-link:hover:not(.active){background:#f3f4ff}
.sidebar-auth-actions .btn-register,.user-actions a.btn-register{background:var(--primary-gradient);box-shadow:0 4px 12px #6366f14d}
.main-header{background:#ffffffc2;backdrop-filter:blur(14px);border-color:#f1f5f9;padding:14px 32px}.main-header .header-spacer{flex:1}.user-actions{gap:8px}
.top-header{position:relative;overflow:hidden;background:#fff;padding:48px 32px}.top-header:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 20% 20%,#6366f12e,transparent 40%),radial-gradient(circle at 80% 30%,#764ba226,transparent 45%),radial-gradient(circle at 50% 90%,#3b82f61f,transparent 50%)}
.top-header:after{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#f1f5f9 1px,transparent 1px),linear-gradient(90deg,#f1f5f9 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse at center,#000,transparent 70%);opacity:.5}.top-header-content{position:relative;z-index:1}.top-header-content h1{background:var(--primary-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;letter-spacing:-.02em}
.search-container input{height:56px;border-radius:16px;background:#fff;border:2px solid #f1f5f9;padding-left:56px;box-shadow:0 1px 3px var(--shadow-color)}.search-container input:focus{background:#fff;outline:none;border-color:var(--primary-color);box-shadow:0 0 0 4px #f3f4ff}.search-container svg{left:20px}
.hero-cta{display:flex;justify-content:center;gap:12px;margin-top:24px;flex-wrap:wrap}.hero-cta a{padding:12px 24px;border-radius:12px;text-decoration:none;font-weight:600;font-size:15px}.cta-primary{background:var(--primary-gradient);color:#fff;box-shadow:0 4px 14px #6366f159}.cta-secondary{background:#fff;color:#1e293b;border:1px solid var(--border-color)}.hero-cta a:hover{transform:translateY(-2px)}
.platform-stats{max-width:900px;margin:32px auto 0;position:relative;z-index:1}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.stat-card{background:#ffffffbf;backdrop-filter:blur(8px);border:1px solid var(--border-color);border-radius:16px;padding:20px 16px;text-align:left;transition:.2s}.stat-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #64748b1f}.stat-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--primary-gradient);color:#fff;margin-bottom:12px;font-size:18px}.stat-card:nth-child(2) .stat-icon{background:linear-gradient(135deg,#10b981,#059669)}.stat-card:nth-child(3) .stat-icon{background:linear-gradient(135deg,#3b82f6,#2563eb)}.stat-card:nth-child(4) .stat-icon{background:linear-gradient(135deg,#f59e0b,#ef4444)}.stat-value{font-size:26px;font-weight:800;line-height:1.1;color:#1e293b;word-break:break-word}.stat-label{font-size:13px;color:#64748b;margin-top:4px}.runtime-info{margin-top:20px;font-size:13px;color:#64748b;display:flex;justify-content:center;gap:24px;flex-wrap:wrap}
.announcement-bar{background:linear-gradient(135deg,#eef2ff,#f3f4ff);border:1px solid #e0e7ff;border-radius:16px;padding:18px 24px;box-shadow:0 4px 12px var(--shadow-color)}
.api-card{border:1px solid var(--border-color);box-shadow:0 1px 3px var(--shadow-color);position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s}.api-card:before{content:'';position:absolute;inset:0 0 auto;height:3px;background:var(--hot-bar,transparent)}.api-card:hover{transform:translateY(-4px);box-shadow:0 10px 30px #64748b1f;border-color:#e0e7ff}.api-card[data-hot="1"]{--hot-bar:linear-gradient(90deg,#dbeafe,#93c5fd)}.api-card[data-hot="2"]{--hot-bar:linear-gradient(90deg,#93c5fd,#60a5fa)}.api-card[data-hot="3"]{--hot-bar:linear-gradient(90deg,#60a5fa,#3b82f6)}.api-card[data-hot="4"]{--hot-bar:linear-gradient(90deg,#3b82f6,#6366f1)}.api-card[data-hot="5"]{--hot-bar:linear-gradient(90deg,#6366f1,#a855f7,#ef4444);background-image:linear-gradient(180deg,#6366f108,transparent 40%)}
.card-tags{display:flex;align-items:center;gap:8px;flex-shrink:0}.format-tag{border:1px solid var(--border-color);border-radius:6px;background:#f8fafc;color:#64748b;padding:3px 9px;font:600 11px/1.4 Consolas,monospace;letter-spacing:.04em}.hot-badge{font-size:11px;font-weight:700;color:#6366f1;background:#f3f4ff;border-radius:99px;padding:2px 8px;margin-left:6px}.hot-badge.hot-5{color:#dc2626;background:linear-gradient(135deg,#fef3c7,#fecaca)}.status-green{background:#d1fae5;color:#10b981}.status-red{background:#fef2f2;color:#ef4444}.status-yellow{background:#fffbeb;color:#f59e0b}.api-name{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px}.btn-details{background:var(--primary-gradient);padding:8px 18px;font-size:14px;font-weight:500}.btn-details:hover{background:var(--primary-gradient);box-shadow:0 4px 12px #6366f159}
@media(max-width:1024px){.platform-stats{padding:0 24px}}@media(max-width:768px){.main-header{padding:12px 16px}.platform-stats{padding:0 16px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stat-card{padding:16px 14px}.stat-value{font-size:20px}.runtime-info{gap:8px;flex-direction:column}.hero-cta a{padding:10px 18px;font-size:14px}.api-grid{grid-template-columns:minmax(0,1fr)}.card-tags{flex-wrap:wrap;justify-content:flex-end}.user-actions .btn-qq-group{display:none!important}}
#sidebar{box-shadow:0 1px 3px rgba(100,116,139,.08)}#sidebar:before{content:'';position:absolute;inset:0 0 auto;height:200px;background:radial-gradient(ellipse at top,#6366f114,transparent 70%);pointer-events:none}.sidebar-header,.user-info-panel,.sidebar-nav,.sidebar-footer{position:relative;z-index:1}.sidebar-logo:before{box-shadow:0 0 8px #6366f180;animation:logo-pulse 2s ease-in-out infinite}@keyframes logo-pulse{50%{opacity:.6;transform:scale(.85)}}
.nav-link{position:relative;color:#475569!important;transition:all .25s cubic-bezier(.4,0,.2,1)}.nav-link:hover{color:#6366f1!important;transform:translateX(2px)}.nav-link.active{color:#fff!important}.nav-link svg{transition:transform .25s}.nav-link:hover svg{transform:scale(1.1)}.nav-link .external-icon{margin-left:auto;margin-right:0}.main-header{backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px)}
.user-actions a{font-size:14px;font-weight:600;border-radius:10px}.user-actions .btn-qq-group{display:inline-flex;align-items:center;gap:6px;color:#fff!important;background:linear-gradient(135deg,#12c2e9,#c471ed 50%,#f64f59)!important;box-shadow:0 4px 12px #c471ed40}.user-actions .btn-login{background:#eef2ff;color:#6366f1}.user-actions .btn-register{color:#fff}.user-profile{padding:4px 12px 4px 4px;border-radius:99px}.user-profile .avatar{width:36px;height:36px}.stat-suffix{font-size:13px;color:#64748b;font-weight:500}.runtime-item{display:flex;align-items:center;gap:6px}.runtime-item>span{display:inline}.content-wrapper{padding:32px}.page-footer{padding:24px}.api-card{content-visibility:auto;contain-intrinsic-size:0 220px}.btn-details{position:relative;overflow:hidden;transition:all .3s}.btn-details:before{content:'';position:absolute;inset:0 auto 0 -100%;width:100%;background:linear-gradient(90deg,transparent,#ffffff33,transparent);transition:left .5s}.btn-details:hover:before{left:100%}