/* Commercial navigation and discovery. Intentionally excludes the protected home hero. */
.topbar { font-family: 'Segoe UI','Microsoft YaHei',sans-serif; box-shadow:0 4px 24px #0005; border-bottom-color:#ffffff15; }
.topbar::after { display:none; }
.topbar .logo { gap:9px; }
.topbar .logo .name { font-family:'Microsoft YaHei',sans-serif; font-size:21px; font-weight:800; letter-spacing:2px; background:none; color:#eaf3ff; -webkit-text-fill-color:currentColor; }
.topbar .brand-caption { color:#77899e; font:9px/1.4 'Segoe UI',sans-serif; letter-spacing:1.8px; width:64px; white-space:normal; text-align:left; }
.topbar .crumb { border-left:1px solid #ffffff1c; padding-left:18px; font-size:12px; color:#a9b8cc; }
.topbar #user-chip { display:none; }
.topbar .app-link { height:38px; border-radius:6px; padding:0 15px; gap:8px; font:700 13px/1 'Segoe UI','Microsoft YaHei',sans-serif; letter-spacing:.2px; transition:filter .2s,box-shadow .2s; text-decoration:none; }
.topbar .app-link::before,.topbar .app-link::after { display:none; }
.topbar .app-link span { display:inline; }
.topbar .app-link small { font:800 8px/1 'Segoe UI',sans-serif; padding:4px; border:1px solid currentColor; border-radius:3px; opacity:.75; }
.topbar .app-link-silver { background:linear-gradient(115deg,#e4ecff,#acc7ff); color:#14213e; border:1px solid #d6e4ff; box-shadow:0 0 20px #97baff22,inset 0 1px #fff; }
.topbar .app-link.app-link-free { color:#99f7d3; background:linear-gradient(110deg,#123d35,#0b2826); border:1px solid #65e8b666; }
.topbar .app-link:hover { filter:brightness(1.14); box-shadow:0 0 22px #a0c7ff33; }
.topbar .tier-pill { display:inline-flex; gap:5px; background:none; border:0; color:#b8c9df; padding:4px; box-shadow:none; }
.topbar .tier-pill .tier-badge { display:none; }
.membership-entry { display:inline-flex; align-items:center; gap:6px; background:linear-gradient(130deg,#30271b,#191916); color:#eacb93; border:1px solid #dfb56f40; border-radius:6px; min-height:36px; padding:0 11px; font-size:12px; white-space:nowrap; cursor:pointer; }
.membership-entry svg { width:15px; height:15px; }
/* 顶栏「邀请好友」小图标按钮：比相邻的 银点创作/免费生图 入口矮一号，虚线边框 + 粉色系呼应邀请语义 */
.invite-entry { display:inline-flex; align-items:center; gap:5px; background:linear-gradient(130deg,#2b1b27,#191418); color:#ffb9dd; border:1px dashed #ff6ab866; border-radius:6px; min-height:30px; padding:0 9px; font:700 12px/1 'Segoe UI','Microsoft YaHei',sans-serif; letter-spacing:.2px; white-space:nowrap; cursor:pointer; transition:background .2s,border-color .2s,color .2s; }
.invite-entry svg { width:13px; height:13px; }
.invite-entry:hover { background:#ff6ab822; border-color:#ff8ecb; color:#ffd9ec; }
@media(max-width:860px) { .topbar .invite-entry span { display:none; } .topbar .invite-entry { padding:0 7px; } }
.creation-hub { padding:64px clamp(24px,5vw,84px) 20px; background:radial-gradient(ellipse at 15% 25%,#17243c44,transparent 55%),#080d15; font-family:'Segoe UI','Microsoft YaHei',sans-serif; }
.hub-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:28px; }
.hub-eyebrow { color:#8498b5; font:600 10px/1.6 'Segoe UI',sans-serif; letter-spacing:2.2px; }
.hub-heading h2 { margin:10px 0 0; font:700 clamp(25px,2.5vw,36px)/1.4 'Segoe UI','Microsoft YaHei',sans-serif; letter-spacing:1px; color:#f0f4fc; }
.hub-heading p { margin:0 0 5px; color:#92a1b5; font-size:13px; line-height:1.8; }
.creation-offers { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.creation-offer { position:relative; isolation:isolate; overflow:hidden; min-width:0; display:flex; flex-direction:column; min-height:370px; padding:27px 32px 32px; border:1px solid #9bbdff4d; border-radius:12px; text-decoration:none; color:#ebf2ff; background:radial-gradient(ellipse at 95% 45%,#527dc449,transparent 60%),linear-gradient(125deg,#18263d,#0d1524); transition:transform .25s,border-color .25s,box-shadow .25s; }
.creation-offer::after { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.12; background:repeating-linear-gradient(0deg,transparent 0 39px,#a6c7ff44 40px),repeating-linear-gradient(90deg,transparent 0 39px,#a6c7ff44 40px); mask-image:linear-gradient(90deg,transparent,#000); }
.creation-offer:hover { transform:translateY(-4px); border-color:#bcd0ff; box-shadow:0 18px 44px #0005,0 0 30px #769ef514; color:#fff; }
.offer-free { border-color:#64c7ac55; background:radial-gradient(ellipse at 100% 50%,#29896b44,transparent 65%),linear-gradient(120deg,#102c29,#0a1a1d); }
.offer-free:hover { border-color:#8df3ce; }
.offer-top { display:flex; align-items:center; justify-content:space-between; gap:12px; z-index:1; }
.offer-label { display:flex; align-items:center; gap:9px; color:#adc6ef; font:700 10px/1.5 'Segoe UI',sans-serif; letter-spacing:1.8px; }
.offer-label svg { width:19px; height:19px; }
.offer-tag { padding:5px 9px; border:1px solid #b2cfff40; border-radius:4px; color:#ccdcf8; font-size:10px; background:#101b2b70; white-space:nowrap; }
.offer-free .offer-label,.offer-free .offer-kicker { color:#8de5c4; }
.offer-free .offer-tag { color:#a0eacb; border-color:#8de5c444; background:#0c2725; }
.offer-content { position:relative; z-index:1; padding-top:35px; }
.offer-kicker { font-size:12px; color:#aabfdc; letter-spacing:1px; }
.offer-content h3 { font:800 clamp(30px,3vw,44px)/1.3 'Segoe UI','Microsoft YaHei',sans-serif; letter-spacing:2px; margin:9px 0 15px; color:#f1f5ff; }
.offer-content p { font-size:13px; line-height:1.9; color:#afbdd1; margin:0; max-width:360px; }
.offer-free .offer-content p { color:#a8c7bf; }
.offer-benefits { display:flex; flex-wrap:wrap; gap:8px 16px; font-size:11px; color:#b7c9e4; margin-top:17px; }
.offer-benefits span::before { content:'✓'; color:#94beff; margin-right:6px; }
.offer-free .offer-benefits span::before { color:#82e6bc; }
.offer-cta { display:inline-flex; align-items:center; justify-content:space-between; gap:32px; min-height:44px; padding:0 20px; margin-top:27px; border-radius:5px; font-size:13px; font-weight:750; background:linear-gradient(110deg,#e8efff,#adc9fc); color:#14233e; box-shadow:0 3px 16px #050b1b40; }
.offer-cta svg { width:18px; height:18px; }
.offer-free .offer-cta { color:#0a3429; background:linear-gradient(110deg,#b2f6d9,#70ddb5); }
.offer-art { position:absolute; width:205px; height:240px; right:0; top:96px; z-index:0; opacity:.8; pointer-events:none; }
.silver-art i { position:absolute; width:116px; height:152px; border:1px solid #b8d4ff88; border-radius:10px; transform:rotate(-24deg) skewY(6deg); background:linear-gradient(145deg,#adcfff22,#172a4566 45%,#91b8fc55); box-shadow:inset 0 1px 2px #d5e8ff99,12px 14px 24px #02091444; }
.silver-art i:nth-child(1) { left:5px; top:14px; opacity:.35; }
.silver-art i:nth-child(2) { left:33px; top:3px; opacity:.55; }
.silver-art i:nth-child(3) { left:61px; top:-8px; }
.offer-art>span { position:absolute; top:20px; left:79px; font:90px/1.3 Georgia,serif; color:#d7e9ff; text-shadow:0 0 32px #9ac3ff; }
.free-art { transform:rotate(-20deg); }
.free-art i { position:absolute; border:1px solid #88eac57a; width:170px; height:100px; top:22px; left:5px; border-radius:50%; transform:rotate(60deg); box-shadow:inset 0 0 22px #8cf0d514,0 0 14px #62dfb61a; }
.free-art i:nth-child(2) { transform:rotate(-60deg); }
.free-art i:nth-child(3) { transform:rotate(0); }
.free-art>span { left:57px; top:9px; color:#bbffe6; text-shadow:0 0 30px #6ee3bc; }
.hub-membership { display:flex; gap:20px; align-items:center; padding:27px 30px; margin-top:22px; border:1px solid #d6b57833; border-radius:9px; background:radial-gradient(ellipse at 0 0,#a07a3b14,transparent 70%),#12151b; }
.hub-member-icon { display:grid; place-items:center; width:48px; height:48px; flex:none; color:#e3c08b; border:1px solid #e3c08b33; border-radius:12px; background:#d9b16f0a; }
.hub-member-icon svg { width:24px; height:24px; }
.hub-membership .hub-eyebrow { color:#baa17c; font-size:9px; }
.hub-membership h3 { font-size:18px; color:#efdfc5; font-weight:600; margin:5px 0 6px; }
.hub-membership p { margin:0; font-size:12px; color:#9b9fa9; line-height:1.7; }
.member-discover { margin-left:auto; flex:none; display:flex; align-items:center; justify-content:center; gap:20px; border:1px solid #d6b57866; background:#ddbc8210; color:#e8c895; font-size:12px; min-height:40px; border-radius:5px; padding:0 17px; cursor:pointer; }
.member-discover svg { width:16px; height:16px; }
.member-discover:hover,.membership-entry:hover { background:#ddbc8225; border-color:#e8c895; }
.hub-tools-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:42px 0 18px; }
.hub-tools-head h3 { font-size:17px; color:#d2dce9; font-weight:600; margin:0; }
.hub-tools-head>span { font-size:10px; color:#8292a7; letter-spacing:1.5px; }
.hub-tools { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.hub-tools>a,.hub-tools>button { display:grid; grid-template-columns:24px 1fr 14px; align-items:center; text-align:left; gap:9px 12px; padding:21px 17px; background:#111923; color:#c9d6e7; border:1px solid #8aabc11f; border-radius:6px; text-decoration:none; cursor:pointer; }
.hub-tools svg { width:20px; height:20px; color:#8ca9c9; }
.hub-tools b { font:600 13px/1.5 'Segoe UI','Microsoft YaHei',sans-serif; }
.hub-tools span { grid-row:2; grid-column:1/-1; font-size:11px; color:#8d9db1; line-height:1.7; }
.hub-tools svg:last-child { width:14px; height:14px; }
.hub-tools>a:hover,.hub-tools>button:hover { background:#182434; border-color:#8aabc166; }
/* Plugin system intro — one editorial band (copy left, capability list right) so it reads as
   its own chapter between the creation hub and the community strip, not another card row. */
.plugin-hub { padding:34px clamp(24px,5vw,84px) 0; background:#080d15; font-family:'Segoe UI','Microsoft YaHei',sans-serif; }
.plugin-band { display:grid; grid-template-columns:minmax(300px,4fr) 6fr; gap:30px 56px; align-items:center; padding:44px 48px; border:1px solid #a48cff24; border-radius:16px; background:radial-gradient(ellipse at 6% 18%,#8f6bff12,transparent 52%),radial-gradient(ellipse at 96% 92%,#527dc41c,transparent 58%),#0c1322; }
.plugin-intro .hub-eyebrow { color:#a394c9; }
.plugin-intro h2 { margin:12px 0 14px; font:700 clamp(24px,2.2vw,32px)/1.5 'Segoe UI','Microsoft YaHei',sans-serif; letter-spacing:1px; color:#f0f4fc; }
.plugin-intro p { margin:0; font-size:12.5px; line-height:1.9; color:#93a2b8; }
.plugin-hub-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.plugin-enter { display:inline-flex; align-items:center; gap:8px; min-height:40px; padding:0 18px; border-radius:5px; border:1px solid #b7a4ff66; background:linear-gradient(110deg,#cabdfc,#9f8bf2); color:#241a44; font-size:12.5px; font-weight:700; cursor:pointer; }
.plugin-enter svg { width:15px; height:15px; }
.plugin-enter:hover { filter:brightness(1.08); }
.plugin-guide { display:inline-flex; align-items:center; min-height:40px; padding:0 16px; border-radius:5px; border:1px solid #a48cff44; background:#8f6bff0d; color:#cabdfc; font-size:12.5px; cursor:pointer; }
.plugin-guide:hover { border-color:#cabdfc; background:#8f6bff1c; }
.plugin-points { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:28px 32px; }
.plugin-points li { display:grid; grid-template-columns:38px 1fr; gap:13px; align-items:start; }
.plugin-point-icon { display:grid; place-items:center; width:38px; height:38px; color:#b9a8ff; border:1px solid #a48cff30; border-radius:10px; background:#8f6bff0d; }
.plugin-point-icon svg { width:18px; height:18px; }
.plugin-points b { display:block; margin:1px 0 6px; font:600 14px/1.4 'Segoe UI','Microsoft YaHei',sans-serif; color:#e2e8f4; }
.plugin-points li>div>span { display:block; font-size:11.5px; line-height:1.8; color:#8d9db1; }
.member-center { font-family:'Segoe UI','Microsoft YaHei',sans-serif; padding:16px 12px 10px; }
.member-eyebrow { font-size:10px; letter-spacing:2px; color:#c7ac80; margin-bottom:12px; }
.member-center .member-title { font-family:inherit; font-size:26px; line-height:1.4; }
.member-intro { color:#9eadc1; font-size:13px; margin:8px 0 24px; }
.member-center .member-status { padding:15px; background:#ffffff04; border:1px solid #ffffff12; border-radius:6px; margin-bottom:24px; font-size:12px; }
.member-center .plan-card { border-radius:8px; padding:24px 18px; gap:20px; background:linear-gradient(145deg,#172131,#0d131d); }
.member-center .plan-featured { border-color:#d0b47b88; background:linear-gradient(150deg,#332b20,#16181f 70%); box-shadow:none; }
.member-center .plan-current { outline:1px solid #7bb5a6; outline-offset:-1px; }
.member-center .plan-price { font:700 27px/1.3 'Segoe UI',sans-serif; }
.member-center .plan-feats { gap:12px; }
.member-center .plan-buy { font-family:inherit; min-height:42px; border-radius:5px; }
.member-center .plan-featured .plan-buy { color:#251d10; background:linear-gradient(100deg,#f1d9ac,#c9a269); border-color:#ddbf8d; box-shadow:none; }
.member-redeem-label { display:block; margin-top:26px; color:#c5d0df; font-size:13px; }
.member-center .redeem-row { margin-top:10px; }
.member-center .redeem-row input { border-radius:5px; min-height:44px; }
.creation-hub :focus-visible,.topbar :focus-visible,.member-center :focus-visible { outline:2px solid #bcd5ff; outline-offset:4px; }
@media(min-width:1600px) { .offer-art { right:28px; transform:scale(1.2); transform-origin:center right; } .offer-free .offer-art { transform:scale(1.2) rotate(-20deg); } }
@media(max-width:1150px) { body:not(.cv-editor-open) .topbar { gap:9px; padding-inline:16px; } .topbar .brand-caption,.topbar .crumb,.topbar .app-link small { display:none; } .offer-art { right:-48px; opacity:.4; } .hub-tools { grid-template-columns:repeat(2,minmax(0,1fr)); } .plugin-band { gap:24px 36px; padding:40px 34px; } }
@media(max-width:980px) { .plugin-band { grid-template-columns:1fr; gap:28px; align-items:start; } }
@media(max-width:760px) { .topbar .tier-pill { display:none; } .topbar .app-link { padding-inline:11px; font-size:12px; } .topbar .membership-entry { padding-inline:8px; } .topbar .membership-entry span { display:none; } .topbar .brand-caption { display:none; } .creation-hub { padding:36px 22px 15px; } .hub-heading { display:block; } .hub-heading p { margin-top:10px; } .creation-offers { gap:14px; } .creation-offer { padding:22px; } .offer-top { flex-wrap:wrap; gap:8px; } .offer-art { opacity:.25; } .offer-content { padding-top:24px; } .offer-content h3 { font-size:30px; } .offer-content p br { display:none; } .offer-content p { min-height:74px; } .offer-benefits { min-height:38px; } .offer-cta { gap:18px; padding-inline:14px; } .hub-membership { flex-wrap:wrap; padding:22px; gap:14px; } .hub-membership>div { flex:1; min-width:160px; } .member-discover { margin-left:62px; } .hub-tools-head>span { display:none; } .plugin-hub { padding:26px 22px 0; } .plugin-band { padding:30px 24px; border-radius:12px; } }
@media(max-width:520px) { body:not(.cv-editor-open) .topbar { padding-inline:10px; gap:7px; } .topbar .logo .name { font-size:16px; letter-spacing:0; } .topbar .logo>svg { display:none; } .topbar .app-link { height:34px; padding-inline:9px; gap:5px; font-size:11px; } .topbar .app-link svg { display:none; } .topbar .help-menu-wrap,.topbar .lang-toggle { display:none; } .topbar .spacer { min-width:0; } .membership-entry { min-height:34px; } .creation-offers { grid-template-columns:1fr; } .creation-offer { min-height:355px; padding:25px; } .offer-top { flex-wrap:nowrap; } .offer-content p { min-height:0; max-width:245px; } .offer-benefits { min-height:0; } .offer-art { right:-8px; opacity:.45; } .hub-tools { gap:10px; } .hub-tools>a,.hub-tools>button { padding:15px 12px; grid-template-columns:20px 1fr; gap:8px; } .hub-tools svg:last-child { display:none; } .hub-membership h3 { font-size:16px; } .hub-member-icon { width:36px; height:36px; } .member-discover { margin-left:50px; } .member-center { padding:6px 0; } .member-center .member-title { font-size:21px; } .member-center .plan-cards { grid-template-columns:1fr; } .plugin-band { padding:26px 20px; } .plugin-points { grid-template-columns:1fr; gap:20px; } }
@media(prefers-reduced-motion:reduce) { .creation-offer,.topbar .app-link { transition:none; } .creation-offer:hover { transform:none; } }
/* Membership actions use the same quiet metallic treatment as their cards. */
.modal:has(.member-center) { border-color:#c4aa764d; border-radius:12px; background:#0b131e; }
.modal:has(.member-center)::before,.modal:has(.member-center)::after { display:none; }
.member-center .member-status>span { display:inline-flex; align-items:center; gap:6px; }
.member-center .member-status svg { width:15px; height:15px; }
.member-center .member-purchase { color:#c9d9ed; border:1px solid #b8cdea66; background:#a7c4ee0c; box-shadow:none; }
.member-center .plan-featured .member-purchase,.member-center .member-redeem { color:#251d10; background:linear-gradient(100deg,#f1d9ac,#c9a269); border:1px solid #ddbf8d; box-shadow:none; border-radius:5px; }
.topbar .mobile-language { display:none; }
@media(max-width:520px) { .topbar .mobile-language { display:flex; } .offer-art { opacity:.25; } }