/* 巨量势能咨询师工作台 · 视觉 v2（Claude 设计，2026-10-11）
   叠加在 styles.css 之后，只改外观，不改结构。 */
:root{
  --ink:#0f172a;--sub:#64748b;--bg:#f4f5f9;--card:#fff;--line:#eceef4;
  --blue:#4f46e5;--blue2:#7c3aed;--soft:#eef0ff;
  --teal:#0d9488;--orange:#f97316;--purple:#8b5cf6;--red:#e11d48;--amber:#f59e0b;--green:#059669;
  --brand-grad:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%);
  --shadow-sm:0 1px 2px rgba(15,23,42,.04),0 6px 20px rgba(15,23,42,.05);
}
html,body{background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;letter-spacing:.01em}
.page{background:radial-gradient(120% 60% at 100% 0%,rgba(124,58,237,.08),transparent 60%),radial-gradient(90% 40% at 0% 0%,rgba(79,70,229,.07),transparent 60%),var(--bg);padding-bottom:calc(104px + var(--safe))}
.topbar{background:rgba(244,245,249,.82);border-bottom:0;box-shadow:0 1px 0 rgba(15,23,42,.05)}
.page-title{font-weight:700;letter-spacing:0}

/* 首页 hero：深色网格渐变 + 玻璃数字卡 */
.hero{border-radius:26px;padding:22px 18px 18px;background:
  radial-gradient(60% 80% at 100% 0%,rgba(167,139,250,.55),transparent 60%),
  radial-gradient(50% 70% at 0% 100%,rgba(56,189,248,.35),transparent 60%),
  linear-gradient(150deg,#1e1b4b 0%,#312e81 55%,#4338ca 100%);
  box-shadow:0 18px 40px -12px rgba(49,46,129,.55)}
.hero:after{border:0;width:220px;height:220px;right:-70px;top:-90px;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 65%)}
.hero-orb{width:44px;height:44px;border-radius:14px;right:20px;top:20px;background:linear-gradient(145deg,rgba(255,255,255,.35),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(6px);transform:rotate(12deg)}
.hero-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.7}
.hero-title{font:700 26px/1.25 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;letter-spacing:.01em}
.hero-sub{opacity:.75}
.kpis{gap:10px;margin-top:18px}
.kpi{padding:12px 4px 10px;border-radius:16px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px)}
.kpi-num{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.kpi-label{font-size:12px;opacity:.78}

/* 卡片 */
.card{border-radius:22px;border:1px solid rgba(15,23,42,.05);box-shadow:var(--shadow-sm);padding:16px}
.title{font-size:17px;font-weight:700;letter-spacing:0}
.name{font-weight:650}
.item{border-bottom-color:#f1f2f6}

/* 常用入口：彩色渐变 squircle + 白色双色图标 */
.grid{gap:18px 6px}
.grid-item{font-size:13px;color:#334155;font-weight:500}
.grid-icon{width:52px;height:52px;border-radius:17px;color:#fff;background:var(--brand-grad);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(79,70,229,.55);position:relative;overflow:hidden}
.grid-icon:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 55%);pointer-events:none}
.grid-icon .icon{width:26px;height:26px;stroke-width:1.9;position:relative}
.grid-icon .icon .fl{fill:#fff;opacity:.28;stroke:none}
.tone-teal .grid-icon,.tone-orange .grid-icon,.tone-purple .grid-icon{color:#fff}
.grid-icon:has(.icon-add){background:linear-gradient(140deg,#6366f1,#8b5cf6);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(99,102,241,.6)}
.grid-icon:has(.icon-follow){background:linear-gradient(140deg,#06b6d4,#3b82f6);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(14,165,233,.55)}
.grid-icon:has(.icon-filing){background:linear-gradient(140deg,#fbbf24,#f97316);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(249,115,22,.5)}
.grid-icon:has(.icon-pool){background:linear-gradient(140deg,#fb7185,#e11d48);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(225,29,72,.45)}
.grid-icon:has(.icon-weekly){background:linear-gradient(140deg,#34d399,#0d9488);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(13,148,136,.5)}
.grid-icon:has(.icon-watermark){background:linear-gradient(140deg,#38bdf8,#6366f1);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(56,189,248,.55)}
.grid-icon:has(.icon-commission){background:linear-gradient(140deg,#facc15,#d97706);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 8px 18px -6px rgba(217,119,6,.5)}
.grid-icon:has(.icon-calendar){background:linear-gradient(140deg,#fb923c,#f43f5e);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(244,63,94,.45)}
.grid-icon:has(.icon-copy){background:linear-gradient(140deg,#c084fc,#db2777);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(219,39,119,.45)}
.grid-icon:has(.icon-report){background:linear-gradient(140deg,#60a5fa,#4f46e5);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(79,70,229,.5)}
.grid-icon:has(.icon-metro){background:linear-gradient(140deg,#2dd4bf,#0284c7);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(2,132,199,.5)}
.grid-icon:has(.icon-match){background:linear-gradient(140deg,#a78bfa,#c026d3);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -6px rgba(192,38,211,.45)}

/* 底部 Tab：悬浮玻璃胶囊 */
.tabbar{left:50%;bottom:calc(10px + var(--safe));width:calc(100% - 24px);max-width:696px;border-radius:26px;padding:8px 6px;
  background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);
  border:1px solid rgba(15,23,42,.06);box-shadow:0 12px 32px -8px rgba(15,23,42,.18)}
.tab{position:relative;gap:3px;padding:4px 0;color:#94a3b8;font-size:12.5px;font-weight:500;border-radius:18px;transition:color .2s}
.tab .icon{width:25px;height:25px;stroke-width:1.8}
.tab .icon .fl{fill:currentColor;opacity:0;stroke:none;transition:opacity .2s}
.tab.on{color:var(--blue);font-weight:650}
.tab.on .icon{fill:none;stroke-width:2}
.tab.on .icon .fl{opacity:.18}
.tab.on:after{content:"";position:absolute;bottom:-3px;width:5px;height:5px;border-radius:50%;background:var(--brand-grad)}

/* 通用图标的面层 */
.icon .fl{fill:currentColor;opacity:.16;stroke:none}

/* 标签、胶囊、分段 */
.tag{border-radius:999px;padding:3px 9px;font-weight:600;font-size:12px}
.tag.red{background:#fff1f2;color:#e11d48}.tag.amber{background:#fffbeb;color:#d97706}.tag.green{background:#ecfdf5;color:#059669}.tag.blue{background:#eef2ff;color:#4f46e5}.tag.gray{background:#f1f5f9;color:#64748b}
.reminder-dot{background:linear-gradient(135deg,#fb7185,#e11d48)}
.chip{border-color:#e2e8f0;padding:8px 14px;font-size:13.5px}
.chip.on{border-color:transparent;background:var(--soft);color:var(--blue);box-shadow:inset 0 0 0 1.5px rgba(79,70,229,.45)}
.segment{background:#fff;box-shadow:inset 0 0 0 1px #e8ebf2;padding:8px 13px}
.segment.on{background:var(--ink);color:#fff;box-shadow:none}
.stepper span{background:#eef0f5}.stepper span.on{background:var(--soft);color:var(--blue)}

/* 按钮 */
.btn{border-radius:14px;background:var(--brand-grad);box-shadow:0 8px 18px -8px rgba(79,70,229,.7);letter-spacing:.02em}
.btn.outline{background:#fff;color:var(--blue);border:1px solid rgba(79,70,229,.35)}
.btn.gray{background:#f1f5f9;color:#475569}
.btn.amber{background:linear-gradient(135deg,#fbbf24,#f97316);box-shadow:0 8px 18px -8px rgba(249,115,22,.7)}
.fab{bottom:calc(96px + var(--safe));background:linear-gradient(135deg,#fb923c,#f43f5e);box-shadow:0 12px 24px -8px rgba(244,63,94,.6)}
.bottom-actions{background:rgba(255,255,255,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* 输入 */
.input,.textarea,.search{border-color:#e2e8f0;border-radius:14px;background:#fff}
.input:focus,.textarea:focus,.search:focus{border-color:#a5b4fc;box-shadow:0 0 0 4px rgba(99,102,241,.12)}
.search{box-shadow:var(--shadow-sm);border-color:transparent}

/* AI 卡片 */
.ai{border:0;background:linear-gradient(135deg,#eef2ff,#faf5ff);box-shadow:inset 0 0 0 1px rgba(124,58,237,.18);border-radius:20px}
.ai-title{background:var(--brand-grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* 阶段条、日历 */
.stage-item.done{color:var(--blue)}.stage-item.done .stage-dot{background:var(--brand-grad)}
.stage-item.current .stage-dot{background:#f59e0b;box-shadow:0 0 0 4px #fef3c7}
.timeline-item:before{background:var(--brand-grad)}
.calendar-day{border-radius:16px}.calendar-day.on{background:var(--brand-grad);box-shadow:0 8px 16px -8px rgba(79,70,229,.7)}

/* 文案目的卡、配盘卡 */
.purpose-card{border-radius:18px;background:#fff;box-shadow:var(--shadow-sm);border-color:transparent}
.purpose-card>span{border-radius:12px;color:#fff;background:linear-gradient(140deg,#c084fc,#7c3aed)}
.purpose-card>span .icon .fl{fill:#fff;opacity:.3}
.purpose-card.on{box-shadow:inset 0 0 0 1.5px rgba(124,58,237,.55),var(--shadow-sm);background:#faf7ff}
.match-card{border-radius:22px;border-color:rgba(15,23,42,.05);box-shadow:var(--shadow-sm)}
.compare-dock{background:var(--ink);border-radius:18px}
.paper-cover{background:radial-gradient(70% 90% at 100% 0%,rgba(167,139,250,.5),transparent 60%),linear-gradient(150deg,#1e1b4b,#4338ca)}

/* 登录页 */
.login-screen{background:radial-gradient(60% 50% at 85% 10%,rgba(167,139,250,.55),transparent 60%),radial-gradient(50% 40% at 10% 90%,rgba(56,189,248,.35),transparent 60%),linear-gradient(160deg,#1e1b4b,#3730a3)}
.login-card{border-radius:28px;box-shadow:0 30px 80px -20px rgba(15,23,42,.5)}
.login-brand{background:var(--brand-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.login-card h1{font:700 26px -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}
.embed-note{background:linear-gradient(135deg,#ecfeff,#f0fdfa);border-color:#ccfbf1}
.toast{background:rgba(15,23,42,.92);backdrop-filter:blur(8px);border-radius:14px}
@media(max-width:380px){.grid-icon{width:48px;height:48px;border-radius:15px}}
.purpose-card>span:has(.icon-report){background:linear-gradient(140deg,#fbbf24,#f97316)}
.purpose-card>span:has(.icon-customers){background:linear-gradient(140deg,#06b6d4,#3b82f6)}
.purpose-card>span:has(.icon-calendar){background:linear-gradient(140deg,#fb923c,#f43f5e)}
.purpose-card>span:has(.icon-follow){background:linear-gradient(140deg,#34d399,#0d9488)}
