/* =========================================================
   AI梦工厂 · 商家端统一样式（现代简洁 · 移动优先）
   配色：暖橙→玫红渐变（贴合"商家发短视频营销"调性）
   ========================================================= */
:root{
  --brand-from:#FF8A3D;
  --brand-to:#FF4D6D;
  --brand-grad:linear-gradient(135deg,#FF8A3D 0%,#FF5C7A 55%,#FF4D6D 100%);
  --brand-soft:rgba(255,92,122,.12);
  --bg:#FBFAF8;
  --bg-tint:#FFF6F1;
  --card:#FFFFFF;
  --text:#1F1D1B;
  --muted:#8A857F;
  --line:#F0ECE7;
  --ok:#22C55E;
  --r:18px;
  --r-lg:26px;
  --shadow:0 12px 34px rgba(255,92,122,.12);
  --shadow-sm:0 6px 18px rgba(31,29,27,.06);
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",Roboto,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

/* ---------- 布局容器 ---------- */
.wrap{max-width:920px;margin:0 auto;padding:0 18px;}
.wrap-narrow{max-width:560px;margin:0 auto;padding:0 18px;}

/* ---------- 顶部导航 ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(251,250,248,.82);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:66px;}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:19px;letter-spacing:.3px;}
.logo .mark{
  width:32px;height:32px;border-radius:10px;background:var(--brand-grad);
  display:grid;place-items:center;color:#fff;font-size:17px;box-shadow:var(--shadow);
}
.nav-links{display:flex;align-items:center;gap:8px;}
.nav-links a{padding:8px 14px;border-radius:999px;font-size:14px;color:var(--muted);font-weight:600;}
.nav-links a:hover{color:var(--text);background:var(--bg-tint);}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:none;cursor:pointer;font-family:inherit;font-weight:700;
  border-radius:999px;padding:14px 26px;font-size:16px;
  transition:transform .15s ease,box-shadow .2s ease,opacity .2s ease;
}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--brand-grad);color:#fff;box-shadow:var(--shadow);}
.btn-primary:hover{box-shadow:0 16px 40px rgba(255,77,109,.28);}
.btn-block{display:flex;width:100%;}
.btn-lg{padding:17px 34px;font-size:18px;}
.btn-ghost{background:var(--bg-tint);color:var(--text);}
.btn-ghost:hover{background:#ffece3;}
.btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none;}

/* ---------- 首页 Hero ---------- */
.hero{position:relative;padding:54px 0 24px;text-align:center;overflow:hidden;}
.hero::before,.hero::after{
  content:"";position:absolute;border-radius:50%;filter:blur(60px);opacity:.5;z-index:0;
}
.hero::before{width:340px;height:340px;background:#FFD9B0;top:-120px;left:-80px;}
.hero::after{width:300px;height:300px;background:#FFC2D2;top:-60px;right:-90px;}
.hero-inner{position:relative;z-index:1;}
.badge{
  display:inline-flex;align-items:center;gap:7px;padding:7px 15px;border-radius:999px;
  background:#fff;border:1px solid var(--line);font-size:13px;color:var(--muted);font-weight:600;
  box-shadow:var(--shadow-sm);margin-bottom:20px;
}
.badge .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);}
.hero h1{
  font-size:40px;line-height:1.22;font-weight:850;letter-spacing:-.5px;margin-bottom:16px;
}
.hero h1 .hl{
  background:var(--brand-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero p.sub{font-size:17px;color:var(--muted);max-width:540px;margin:0 auto 30px;}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

/* ---------- 三步流程 ---------- */
.section{padding:40px 0;}
.section-title{text-align:center;font-size:26px;font-weight:800;margin-bottom:6px;}
.section-desc{text-align:center;color:var(--muted);margin-bottom:30px;font-size:15px;}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.step{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 20px;text-align:center;box-shadow:var(--shadow-sm);
}
.step .num{
  width:46px;height:46px;margin:0 auto 14px;border-radius:14px;background:var(--brand-soft);
  color:var(--brand-to);display:grid;place-items:center;font-size:22px;font-weight:800;
}
.step h3{font-size:17px;margin-bottom:6px;}
.step p{font-size:14px;color:var(--muted);}

/* ---------- 风格展示 ---------- */
.styles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.style-card{
  position:relative;border-radius:var(--r);overflow:hidden;background:var(--card);
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .2s ease,box-shadow .2s ease;
}
.style-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.style-cover{height:128px;display:grid;place-items:center;font-size:44px;color:#fff;}
.style-meta{padding:14px 16px;}
.style-meta h4{font-size:16px;margin-bottom:3px;}
.style-meta p{font-size:13px;color:var(--muted);}

/* ---------- 卖点 ---------- */
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.feat{
  display:flex;gap:13px;align-items:flex-start;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:var(--shadow-sm);
}
.feat .ic{font-size:26px;flex:0 0 auto;}
.feat h4{font-size:15px;margin-bottom:3px;}
.feat p{font-size:13px;color:var(--muted);}

/* ---------- 页脚 ---------- */
.foot{padding:40px 0 30px;text-align:center;color:var(--muted);font-size:13px;border-top:1px solid var(--line);margin-top:30px;}

/* ---------- 制作页 ---------- */
.make-head{display:flex;align-items:center;justify-content:space-between;padding:18px 0;}
.make-head .back{color:var(--muted);font-size:15px;font-weight:600;display:flex;align-items:center;gap:6px;}
.make-title{font-size:24px;font-weight:800;margin:6px 0 4px;}
.make-sub{color:var(--muted);font-size:14px;margin-bottom:22px;}

.uploader{
  position:relative;border:2px dashed #FFC9B6;border-radius:var(--r-lg);
  background:linear-gradient(180deg,#FFF7F2,#FFFDFB);
  min-height:230px;display:grid;place-items:center;text-align:center;cursor:pointer;
  transition:border-color .2s,background .2s;overflow:hidden;
}
.uploader:hover{border-color:var(--brand-from);}
.uploader.has-img{border-style:solid;border-color:var(--line);}
.uploader input{position:absolute;inset:0;opacity:0;cursor:pointer;}
.up-placeholder{padding:24px;pointer-events:none;}
.up-placeholder .cam{font-size:50px;margin-bottom:12px;}
.up-placeholder .t{font-size:17px;font-weight:700;}
.up-placeholder .s{font-size:13px;color:var(--muted);margin-top:6px;}
.up-preview{width:100%;height:100%;}
.up-preview img{width:100%;height:230px;object-fit:cover;}
.up-preview .change{
  position:absolute;left:50%;bottom:12px;transform:translateX(-50%);
  background:rgba(0,0,0,.55);color:#fff;font-size:13px;padding:7px 16px;border-radius:999px;
}

/* 风格选择（横向卡片单选） */
.field-label{font-size:15px;font-weight:700;margin:24px 0 12px;display:flex;align-items:center;gap:8px;}
.field-label .tag{font-size:12px;color:var(--brand-to);background:var(--brand-soft);padding:2px 9px;border-radius:999px;font-weight:700;}
.chips{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;}
.chips::-webkit-scrollbar{display:none;}
.chip{
  flex:0 0 auto;min-width:104px;border:1.5px solid var(--line);border-radius:16px;
  padding:14px 12px;text-align:center;background:var(--card);cursor:pointer;
  transition:border-color .15s,transform .15s,box-shadow .15s;
}
.chip .emo{font-size:30px;}
.chip .nm{font-size:14px;font-weight:700;margin-top:6px;}
.chip.active{border-color:var(--brand-from);box-shadow:0 8px 22px rgba(255,92,122,.18);transform:translateY(-2px);}
.chip.active .nm{color:var(--brand-to);}

/* 表单 */
.field textarea,.field input[type=text]{
  width:100%;border:1.5px solid var(--line);border-radius:var(--r);
  padding:14px 16px;font-family:inherit;font-size:15px;background:var(--card);resize:vertical;
  transition:border-color .15s,box-shadow .15s;
}
.field textarea{min-height:96px;}
.field textarea:focus,.field input:focus{outline:none;border-color:var(--brand-from);box-shadow:0 0 0 4px var(--brand-soft);}
.field .hint{font-size:12px;color:var(--muted);margin-top:7px;display:flex;justify-content:space-between;align-items:center;}
.field .aiwrite{
  font-size:12px;color:var(--brand-to);background:var(--brand-soft);border:none;
  padding:5px 12px;border-radius:999px;font-weight:700;cursor:pointer;
}

/* 时长分段 */
.seg{display:flex;gap:10px;}
.seg button{
  flex:1;border:1.5px solid var(--line);background:var(--card);border-radius:14px;
  padding:13px;font-size:15px;font-weight:700;cursor:pointer;color:var(--muted);
  transition:all .15s;
}
.seg button.active{border-color:var(--brand-from);color:var(--brand-to);background:var(--bg-tint);}

.make-actions{margin:28px 0 10px;}

/* ---------- 进度 ---------- */
.progress-box{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:40px 24px;text-align:center;box-shadow:var(--shadow-sm);
}
.ring{
  width:120px;height:120px;margin:0 auto 22px;border-radius:50%;
  background:conic-gradient(var(--brand-from) calc(var(--p)*1%),#F0ECE7 0);
  display:grid;place-items:center;position:relative;
}
.ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--card);}
.ring span{position:relative;font-size:26px;font-weight:800;color:var(--brand-to);}
.progress-box h3{font-size:19px;margin-bottom:8px;}
.progress-box p{color:var(--muted);font-size:14px;}
.dots{display:inline-flex;gap:5px;margin-top:14px;}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--brand-from);opacity:.4;animation:blink 1.2s infinite;}
.dots i:nth-child(2){animation-delay:.2s;}
.dots i:nth-child(3){animation-delay:.4s;}
@keyframes blink{0%,100%{opacity:.3;}50%{opacity:1;}}

/* ---------- 结果页 ---------- */
.result-wrap{padding:24px 0 40px;}
.player{
  border-radius:var(--r-lg);overflow:hidden;background:#000;box-shadow:var(--shadow);
  aspect-ratio:9/16;max-height:62vh;display:grid;place-items:center;
}
.player video{width:100%;height:100%;object-fit:contain;background:#000;}
.result-title{font-size:22px;font-weight:800;margin:20px 0 4px;}
.result-sub{color:var(--muted);font-size:14px;margin-bottom:18px;}
.result-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px;}
.share-tip{
  background:var(--bg-tint);border:1px solid var(--line);border-radius:var(--r);
  padding:16px 18px;font-size:14px;color:var(--muted);
}
.share-tip b{color:var(--text);}
.share-tip .row{display:flex;gap:9px;margin-top:10px;flex-wrap:wrap;}
.share-tip .row span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-weight:600;color:var(--text);}
.fail-box{background:#fff5f5;border:1px solid #ffd6d6;border-radius:var(--r-lg);padding:28px 22px;text-align:center;color:#c0392b;}

/* ---------- 登录浮层 ---------- */
.mask{
  position:fixed;inset:0;background:rgba(20,12,10,.45);backdrop-filter:blur(3px);
  display:none;align-items:center;justify-content:center;z-index:200;padding:18px;
}
.mask.show{display:flex;animation:fade .2s ease;}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal{
  width:100%;max-width:380px;background:var(--card);border-radius:var(--r-lg);
  padding:28px 24px;box-shadow:0 30px 70px rgba(0,0,0,.25);animation:pop .25s ease;
}
@keyframes pop{from{transform:translateY(14px) scale(.98);opacity:0}to{transform:none;opacity:1}}
.modal h3{font-size:21px;font-weight:800;margin-bottom:4px;}
.modal p.m{color:var(--muted);font-size:14px;margin-bottom:20px;}
.modal .field{margin-bottom:14px;}
.modal .field input{
  width:100%;border:1.5px solid var(--line);border-radius:14px;padding:13px 15px;
  font-size:15px;font-family:inherit;background:var(--card);
}
.modal .field input:focus{outline:none;border-color:var(--brand-from);box-shadow:0 0 0 4px var(--brand-soft);}
.modal .switch{text-align:center;font-size:14px;color:var(--muted);margin-top:14px;}
.modal .switch a{color:var(--brand-to);font-weight:700;}

/* ---------- Toast ---------- */
.toast{
  position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(20px);
  background:#1F1D1B;color:#fff;padding:13px 22px;border-radius:999px;font-size:14px;font-weight:600;
  box-shadow:0 10px 30px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:all .3s;z-index:300;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.err{background:#E5484D;}
.toast.ok{background:#16A34A;}

/* ---------- 响应式 ---------- */
@media (max-width:680px){
  .hero h1{font-size:30px;}
  .steps{grid-template-columns:1fr;}
  .styles{grid-template-columns:repeat(2,1fr);}
  .feats{grid-template-columns:1fr;}
  .hero{padding:38px 0 18px;}
}

/* =========================================================
   v2 · 图标系统 / 登录态导航 / 会员中心 / 代理页
   视觉：暖橙→玫红渐变 + 圆角卡片 + 细腻阴影（保持商家端简洁）
   ========================================================= */

/* ---------- SVG 图标通用 ---------- */
.ic{width:18px;height:18px;flex:0 0 auto;}
.ic-lg{width:24px;height:24px;}
.ic-xl{width:30px;height:30px;}
.ic-btn{width:16px;height:16px;}
.ic-box{
  width:40px;height:40px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(135deg,rgba(255,138,61,.16),rgba(255,77,109,.16));color:var(--brand-to);
}
.ic-box.gold{background:linear-gradient(135deg,rgba(255,176,59,.18),rgba(255,138,61,.16));color:#F59E0B;}
.ic-box.purple{background:linear-gradient(135deg,rgba(124,92,255,.15),rgba(91,141,239,.15));color:#6D5CE8;}
.ic-box.green{background:linear-gradient(135deg,rgba(34,197,94,.14),rgba(16,185,129,.14));color:#16A34A;}
.ic-box.ink{background:#FFF3EE;color:var(--brand-to);}

/* ---------- 顶部导航 v2 ---------- */
.nav{background:rgba(251,250,248,.86);}
.logo{display:flex;align-items:center;gap:10px;}
.logo .logo-ic{
  width:34px;height:34px;border-radius:11px;background:var(--brand-grad);color:#fff;
  display:grid;place-items:center;box-shadow:0 6px 16px rgba(255,92,122,.35);
}
.logo b{font-size:18px;font-weight:850;letter-spacing:.3px;background:linear-gradient(135deg,#3A332E,#6E5A4A);-webkit-background-clip:text;background-clip:text;color:transparent;}
.nav-inner{gap:12px;}
.nav-right{display:flex;align-items:center;gap:10px;margin-left:auto;}
.nav-links{margin-left:auto;}
.nav-links a{display:inline-flex;align-items:center;gap:6px;}
.nav-links a .ic{width:15px;height:15px;}
.nav-links a:hover{color:var(--brand-to);}

/* 登录按钮 */
.btn-login{
  display:inline-flex;align-items:center;gap:7px;border:none;cursor:pointer;font-family:inherit;
  background:var(--brand-grad);color:#fff;font-weight:700;font-size:14px;padding:9px 18px;border-radius:999px;
  box-shadow:0 6px 16px rgba(255,92,122,.32);transition:transform .15s ease,box-shadow .2s ease;
}
.btn-login:active{transform:scale(.96);}
.btn-login .ic{width:15px;height:15px;}

/* 已登录用户区 */
.nav-user{position:relative;}
.u-btn{
  display:flex;align-items:center;gap:8px;cursor:pointer;padding:5px 8px 5px 5px;border-radius:999px;
  border:1px solid transparent;transition:border-color .15s,background .15s;user-select:none;
}
.u-btn:hover{border-color:var(--line);background:#fff;}
.u-btn .avatar{
  width:32px;height:32px;border-radius:50%;background:var(--brand-grad);color:#fff;
  display:grid;place-items:center;font-size:14px;font-weight:800;box-shadow:0 3px 8px rgba(255,92,122,.3);
}
.u-btn .uname{font-size:14px;font-weight:700;max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.u-btn .caret{width:14px;height:14px;color:var(--muted);transition:transform .2s;}
.u-btn.open .caret{transform:rotate(180deg);}
.udrop{
  position:absolute;top:calc(100% + 8px);right:0;min-width:190px;background:#fff;
  border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 44px rgba(31,29,27,.14);
  padding:8px;display:none;z-index:90;animation:pop .18s ease;
}
.udrop.open{display:block;}
.udrop .ud-head{padding:10px 12px 8px;border-bottom:1px solid var(--line);margin-bottom:6px;}
.udrop .ud-head b{font-size:14px;display:block;}
.udrop .ud-head span{font-size:12px;color:var(--muted);}
.udrop a,.udrop button{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 12px;border-radius:11px;
  font-size:14px;font-weight:600;color:var(--text);cursor:pointer;background:none;border:none;font-family:inherit;
  transition:background .12s;
}
.udrop a:hover,.udrop button:hover{background:var(--bg-tint);}
.udrop a .ic,.udrop button .ic{width:17px;height:17px;color:var(--muted);}
.udrop a.hot .ic{color:var(--brand-to);}
.udrop a.danger .ic,.udrop button.danger{color:#E5484D;}
.udrop .divider{height:1px;background:var(--line);margin:6px 4px;}

/* 移动端汉堡 */
.burger{display:none;flex-direction:column;justify-content:center;gap:4.5px;width:40px;height:40px;
  border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;padding:0 10px;}
.burger span{height:2px;border-radius:2px;background:#4A4038;transition:all .22s;}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

/* ---------- 页面通用小标题装饰 ---------- */
.t-ic{
  display:inline-flex;align-items:center;gap:9px;font-size:25px;font-weight:850;letter-spacing:-.2px;
}
.t-ic .ic{width:24px;height:24px;color:var(--brand-to);}
.panel{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm);padding:22px;
}
.panel + .panel{margin-top:16px;}
.panel-t{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.panel-t h3{font-size:17px;font-weight:800;display:flex;align-items:center;gap:9px;}
.panel-t h3 .ic{width:19px;height:19px;color:var(--brand-to);}
.panel-t a{font-size:13px;color:var(--brand-to);font-weight:700;display:inline-flex;align-items:center;gap:4px;}

/* ---------- 会员中心 ---------- */
.member-wrap{padding:20px 0 44px;}
.mhero{
  position:relative;overflow:hidden;border-radius:24px;padding:26px 22px;color:#fff;
  background:linear-gradient(135deg,#FF8A3D 0%,#FF5C7A 58%,#FF4D6D 100%);
  box-shadow:0 16px 38px rgba(255,92,122,.32);display:flex;align-items:center;gap:16px;
}
.mhero::after{content:"";position:absolute;right:-46px;top:-56px;width:180px;height:180px;border-radius:50%;
  background:rgba(255,255,255,.14);}
.mhero::before{content:"";position:absolute;right:52px;bottom:-70px;width:120px;height:120px;border-radius:50%;
  background:rgba(255,255,255,.1);}
.mhero .avatar-lg{
  width:66px;height:66px;border-radius:50%;background:rgba(255,255,255,.94);color:var(--brand-to);
  display:grid;place-items:center;font-size:28px;font-weight:850;box-shadow:0 6px 14px rgba(0,0,0,.18);
  position:relative;z-index:1;flex:0 0 auto;
}
.mhero .hi{position:relative;z-index:1;min-width:0;}
.mhero .hi .name{font-size:21px;font-weight:850;display:flex;align-items:center;gap:9px;}
.mhero .hi .acc{font-size:13px;opacity:.9;margin:2px 0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mbadge{
  display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.5);padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:800;
  backdrop-filter:blur(4px);margin-right:6px;
}
.mbadge.guest{background:rgba(255,255,255,.14);}
.mexp{display:inline-flex;align-items:center;font-size:12.5px;opacity:.95;font-weight:600;}
.mhero .m-actions{position:relative;z-index:1;margin-left:auto;display:flex;flex-direction:column;gap:9px;}
.mhero .m-actions a{
  display:inline-flex;align-items:center;gap:7px;justify-content:center;background:#fff;color:var(--brand-to);
  font-size:13.5px;font-weight:800;padding:9px 16px;border-radius:999px;box-shadow:0 6px 16px rgba(0,0,0,.14);
  transition:transform .15s;white-space:nowrap;
}
.mhero .m-actions a.ghost{background:rgba(255,255,255,.2);color:#fff;border:1px solid rgba(255,255,255,.55);}
.mhero .m-actions a:active{transform:scale(.96);}

/* 数据宫格 */
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px;}
.stat{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 10px;text-align:center;
  box-shadow:var(--shadow-sm);
}
.stat .n{font-size:24px;font-weight:850;color:var(--text);line-height:1.1;}
.stat .n small{font-size:13px;font-weight:700;color:var(--muted);}
.stat .l{font-size:12.5px;color:var(--muted);margin-top:4px;display:flex;align-items:center;justify-content:center;gap:5px;}
.stat .l .ic{width:14px;height:14px;color:var(--brand-to);}

/* 快捷菜单宫格 */
.mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px;}
.mgrid a{
  display:flex;flex-direction:column;align-items:center;gap:9px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:17px 8px;box-shadow:var(--shadow-sm);
  transition:transform .15s,box-shadow .15s;
}
.mgrid a:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.mgrid a .ic{width:22px;height:22px;color:var(--brand-to);}
.mgrid a .l2{font-size:13px;font-weight:700;}

/* 我的作品列表 */
.vlist{display:flex;flex-direction:column;gap:10px;}
.vitem{
  display:flex;align-items:center;gap:13px;background:var(--card);border:1px solid var(--line);
  border-radius:16px;padding:11px 13px;box-shadow:var(--shadow-sm);
}
.vitem .vthumb{
  width:52px;height:60px;border-radius:11px;flex:0 0 auto;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(135deg,#FFE3D3,#FFD9E2);color:var(--brand-to);
}
.vitem .vthumb img{width:100%;height:100%;object-fit:cover;}
.vitem .vthumb .ic{width:20px;height:20px;}
.vitem .vinfo{flex:1;min-width:0;}
.vitem .vinfo .vt{font-size:14.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.vitem .vinfo .vs{font-size:12px;color:var(--muted);margin-top:2px;display:flex;align-items:center;gap:7px;}
.vst{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:800;padding:2px 9px;border-radius:999px;}
.vst .ic{width:12px;height:12px;}
.vst.done{background:#E8F9EF;color:#16A34A;}
.vst.run{background:#FFF4E0;color:#D97706;}
.vst.wait{background:#FFF0F2;color:var(--brand-to);}
.vst.fail{background:#FDEBEC;color:#E5484D;}
.vitem .vgo{
  display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;flex:0 0 auto;
  background:var(--brand-soft);color:var(--brand-to);transition:background .15s;
}
.vitem .vgo:hover{background:linear-gradient(135deg,#FF8A3D,#FF4D6D);color:#fff;}
.vitem .vgo .ic{width:17px;height:17px;}
.empty{
  text-align:center;padding:34px 16px;color:var(--muted);
}
.empty .emo{font-size:40px;margin-bottom:8px;}
.empty a{color:var(--brand-to);font-weight:700;}

/* 激活码兑换 */
.codebox{
  display:flex;gap:10px;align-items:stretch;margin:14px 0 6px;
}
.codebox input{
  flex:1;border:1.5px solid var(--line);border-radius:14px;padding:13px 15px;font-size:15px;font-family:inherit;
  background:var(--card);letter-spacing:1.5px;text-transform:uppercase;
}
.codebox input:focus{outline:none;border-color:var(--brand-from);box-shadow:0 0 0 4px var(--brand-soft);}
.codebox button{white-space:nowrap;}
.code-ok{
  display:none;align-items:center;gap:9px;margin-top:12px;background:#E8F9EF;border:1px solid #BBE9CE;
  color:#15803D;font-size:13.5px;font-weight:700;padding:11px 14px;border-radius:13px;
}
.code-ok.show{display:flex;}
.code-ok .ic{width:18px;height:18px;}
.code-err{
  display:none;align-items:center;gap:9px;margin-top:12px;background:#FDEBEC;border:1px solid #F5C2C6;
  color:#C0392B;font-size:13.5px;font-weight:700;padding:11px 14px;border-radius:13px;
}
.code-err.show{display:flex;}
.tip-line{font-size:13px;color:var(--muted);margin-top:12px;display:flex;align-items:flex-start;gap:6px;line-height:1.7;}
.tip-line .ic{width:15px;height:15px;margin-top:3px;color:var(--brand-from);}

/* ---------- 代理页 ---------- */
.agent-wrap{padding:22px 0 46px;}
.ahero{
  text-align:center;padding:44px 22px 34px;border-radius:26px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#FF7A3D 0%,#F4486B 55%,#E93A7D 100%);
  box-shadow:0 18px 44px rgba(243,72,107,.3);
}
.ahero::before,.ahero::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.13);}
.ahero::before{width:210px;height:210px;left:-70px;top:-90px;}
.ahero::after{width:150px;height:150px;right:-40px;bottom:-60px;}
.ahero .a-ic{
  width:74px;height:74px;margin:0 auto 16px;border-radius:22px;background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.4);display:grid;place-items:center;color:#fff;position:relative;z-index:1;
  backdrop-filter:blur(6px);
}
.ahero .a-ic .ic{width:36px;height:36px;}
.ahero h1{font-size:27px;font-weight:850;position:relative;z-index:1;margin-bottom:8px;letter-spacing:-.3px;}
.ahero p{position:relative;z-index:1;font-size:15px;opacity:.94;max-width:420px;margin:0 auto;}
.ahero .btn-white{
  display:inline-flex;align-items:center;gap:8px;margin-top:20px;background:#fff;color:#E93A7D;
  font-weight:800;font-size:15px;padding:12px 24px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.16);
  transition:transform .15s;
}
.ahero .btn-white:active{transform:scale(.96);}

.asteps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px;}
.astep{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px 16px;text-align:center;box-shadow:var(--shadow-sm);}
.astep .n{
  width:44px;height:44px;margin:0 auto 12px;border-radius:50%;color:#fff;display:grid;place-items:center;
  font-size:18px;font-weight:850;background:var(--brand-grad);box-shadow:0 6px 14px rgba(255,92,122,.3);
}
.astep h4{font-size:15.5px;margin-bottom:5px;}
.astep p{font-size:13px;color:var(--muted);line-height:1.6;}

.alevels{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px;}
.alevel{
  position:relative;background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:20px 16px 16px;
  text-align:center;box-shadow:var(--shadow-sm);transition:transform .15s,border-color .15s;
}
.alevel:hover{transform:translateY(-3px);}
.alevel.hot{border-color:var(--brand-from);background:linear-gradient(180deg,#FFF7F2,#fff);}
.alevel .tag-hot{
  position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--brand-grad);color:#fff;
  font-size:11px;font-weight:800;padding:3px 12px;border-radius:999px;white-space:nowrap;box-shadow:0 4px 10px rgba(255,92,122,.35);
}
.alevel .lv-ic{margin:0 auto 10px;}
.alevel .lv-ic .ic{width:30px;height:30px;}
.alevel h4{font-size:17px;font-weight:850;}
.alevel .rate{font-size:25px;font-weight:900;color:var(--brand-to);margin:3px 0 1px;line-height:1.2;}
.alevel .rate small{font-size:13px;font-weight:700;color:var(--muted);}
.alevel p{font-size:12.5px;color:var(--muted);margin-top:6px;}

/* 复制邀请码 */
.invite-line{
  display:flex;align-items:center;gap:10px;background:#FFF7F2;border:1px dashed #FFBFA6;border-radius:14px;
  padding:12px 14px;margin-top:14px;
}
.invite-line code{font-size:17px;font-weight:850;letter-spacing:2.5px;color:var(--brand-to);flex:1;text-align:center;}
.copy-btn{
  display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);color:var(--text);
  font-size:13px;font-weight:700;padding:7px 14px;border-radius:999px;cursor:pointer;transition:all .15s;
}
.copy-btn:hover{border-color:var(--brand-from);color:var(--brand-to);}
.copy-btn .ic{width:14px;height:14px;}

/* ---------- 通用动画 ---------- */
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ---------- 响应式 v2 ---------- */
@media (max-width:820px){
  .nav-links{
    display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;
    background:rgba(251,250,248,.98);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);
    padding:10px 14px 14px;box-shadow:0 22px 40px rgba(31,29,27,.08);
  }
  .nav-links.open{display:flex;}
  .nav-links a{padding:13px 14px;border-radius:13px;font-size:15px;}
  .burger{display:flex;}
}
@media (max-width:680px){
  .t-ic{font-size:21px;}
  .mhero{flex-wrap:wrap;padding:22px 18px;}
  .mhero .m-actions{width:100%;flex-direction:row;margin:6px 0 0;}
  .mhero .m-actions a{flex:1;}
  .stat-grid{gap:9px;}
  .stat .n{font-size:20px;}
  .mgrid{grid-template-columns:repeat(4,1fr);gap:9px;}
  .mgrid a{padding:13px 4px;}
  .mgrid a .l2{font-size:12px;}
  .asteps{grid-template-columns:1fr;}
  .alevels{grid-template-columns:1fr;}
  .codebox{flex-direction:column;}
  .codebox button{width:100%;}
  .panel{padding:18px;}
}

/* =========================================================
   v3 · 首页大气化（大屏视觉）
   策略：加宽版面 / 放大导航与标题层级 / Hero 双栏配手机演示
   ========================================================= */

/* ---- 顶部导航加高、更精致 ---- */
.logo .logo-ic{width:40px;height:40px;border-radius:13px;}
.logo b{font-size:21px;}
.nav-links a{padding:9px 18px;font-size:15px;border-radius:12px;}
.btn-login{padding:10px 22px;font-size:14.5px;border-radius:12px;}

/* ---- 首页专用宽版容器 ---- */
#home .wrap{max-width:1140px;}

/* ---- Hero 背景光晕放大 ---- */
#home .hero{padding:26px 0 6px;}
#home .hero::before{
  width:640px;height:640px;top:-300px;left:-200px;opacity:.5;
  background:radial-gradient(circle,#FFD9B0 0%,transparent 62%);
}
#home .hero::after{
  width:600px;height:600px;top:-260px;right:-240px;opacity:.46;
  background:radial-gradient(circle,#FFC2D2 0%,transparent 62%);
}

/* ---- Hero 双栏 ---- */
#home .hero-inner{
  display:grid;grid-template-columns:1.06fr .94fr;gap:46px;align-items:center;
  text-align:left;padding:34px 18px 58px;
}
#home .hero-copy{max-width:600px;}
#home .hero .badge{margin-bottom:26px;padding:9px 18px;font-size:13.5px;}
#home .hero h1{font-size:clamp(40px,4.7vw,64px);line-height:1.16;letter-spacing:-1px;margin-bottom:22px;font-weight:900;}
#home .hero p.sub{
  font-size:17.5px;color:#6E6861;line-height:1.9;
  margin:0 0 36px;max-width:520px;
}
#home .hero-cta{justify-content:flex-start;gap:14px;}
#home .hero-cta .btn-lg{padding:18px 38px;font-size:18px;border-radius:16px;}

/* 信任点 */
.trust{list-style:none;display:flex;flex-wrap:wrap;gap:12px 26px;margin:34px 0 0;padding:0;}
.trust li{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#5F5852;font-weight:600;}
.trust .ic{width:17px;height:17px;color:var(--brand-to);}

/* ---- 右侧手机演示 ---- */
.hero-demo{position:relative;justify-self:center;width:100%;max-width:420px;}
.phone{
  position:relative;width:min(330px,88%);margin:0 auto;background:#16110D;
  border-radius:44px;padding:10px;
  box-shadow:0 50px 100px rgba(31,29,27,.24),0 18px 40px rgba(255,92,122,.18);
}
.ph-stage{
  position:relative;border-radius:34px;overflow:hidden;aspect-ratio:9/16;
  background:linear-gradient(168deg,#FF9A4D 0%,#FF6B7D 52%,#F43F7E 100%);
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;color:#fff;
}
.ph-stage::before{
  content:"";position:absolute;width:230px;height:230px;border-radius:50%;top:-80px;right:-70px;
  background:radial-gradient(circle,rgba(255,255,255,.38),transparent 62%);
}
.ph-stage::after{
  content:"";position:absolute;width:200px;height:200px;border-radius:50%;left:-70px;bottom:-80px;
  background:radial-gradient(circle,rgba(255,255,255,.2),transparent 60%);
}
/* 顶部状态 */
.ph-top{
  position:absolute;top:0;left:0;right:0;z-index:3;display:flex;align-items:center;gap:8px;
  padding:16px 16px 10px;font-size:11.5px;font-weight:700;letter-spacing:.3px;
  background:linear-gradient(180deg,rgba(0,0,0,.22),transparent);
}
.ph-live{width:8px;height:8px;border-radius:50%;background:#4ADE80;box-shadow:0 0 0 3px rgba(74,222,128,.3);flex:0 0 auto;}
.ph-top em{flex:1;text-align:left;font-style:normal;}
.ph-top b{background:rgba(255,255,255,.2);padding:2px 9px;border-radius:6px;font-size:10px;}
/* 新品标签 */
.ph-badge{
  position:absolute;top:56px;left:14px;z-index:3;display:inline-flex;align-items:center;gap:5px;
  background:rgba(255,255,255,.94);color:#E33B6B;font-size:11px;font-weight:800;
  padding:5px 12px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.16);
}
.ph-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:#22C55E;}
/* 中部输入照 */
.ph-shot{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:26px;}
.ph-shoot{
  width:92px;height:92px;border-radius:50%;background:rgba(255,255,255,.95);color:#FF5C7A;
  display:grid;place-items:center;box-shadow:0 20px 46px rgba(0,0,0,.24);
}
.ph-shoot .ic{width:40px;height:40px;}
.ph-shot i{font-style:normal;font-size:13.5px;font-weight:700;letter-spacing:3px;text-shadow:0 2px 10px rgba(0,0,0,.22);}
.ph-shoot{position:relative;}
.ph-shoot::after{
  content:"";position:absolute;inset:-15px;border-radius:50%;
  border:1.5px dashed rgba(255,255,255,.6);animation:spin 16s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
/* 底部成片文案 */
.ph-foot{position:relative;z-index:2;padding:26px 18px 30px;margin-top:8px;}
.ph-foot b{display:block;font-size:18px;font-weight:850;letter-spacing:.6px;}
.ph-foot em{display:block;font-style:normal;font-size:11.5px;opacity:.92;margin-top:5px;letter-spacing:1px;}
.ph-buy{
  display:block;margin:16px auto 0;max-width:220px;background:#fff;color:#E93A7D;
  font-weight:850;font-size:15px;letter-spacing:2px;padding:11px;border-radius:999px;
  box-shadow:0 12px 30px rgba(0,0,0,.2);
}

/* 悬浮信息卡 */
.d-chip{
  position:absolute;z-index:4;display:inline-flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid #F4E9E0;
  box-shadow:0 20px 48px rgba(31,29,27,.18);border-radius:999px;
  padding:11px 18px;font-size:13px;font-weight:750;color:#3A332E;white-space:nowrap;
  animation:floaty 5.6s ease-in-out infinite;
}
.d-chip .ic{width:16px;height:16px;color:#FF5C7A;}
.d-chip.c-top{top:20%;left:2px;}
.d-chip.c-bot{bottom:22%;right:0;animation-delay:1.8s;}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ---- 首页内容区大气化 ---- */
#home .section{padding:56px 0;}
#home .section-title{font-size:clamp(27px,3vw,37px);margin-bottom:10px;letter-spacing:-.3px;}
#home .section-desc{font-size:16px;margin-bottom:40px;}
#home .steps{gap:22px;}
#home .step{border-radius:24px;padding:36px 24px;box-shadow:0 16px 40px rgba(31,29,27,.05);}
#home .step .num{width:58px;height:58px;border-radius:18px;font-size:26px;margin-bottom:20px;}
#home .step h3{font-size:19px;margin-bottom:8px;}
#home .step p{font-size:14.5px;line-height:1.75;}
#home .styles{gap:22px;}
#home .style-card{border-radius:24px;}
#home .style-cover{height:176px;font-size:64px;}
#home .style-card:hover .style-cover{transform:scale(1.04);}
#home .style-cover{transition:transform .3s ease;}
#home .style-meta{padding:18px 20px 20px;}
#home .style-meta h4{font-size:18px;}
#home .style-meta p{font-size:14px;margin-top:4px;}
#home .feats{grid-template-columns:repeat(4,1fr);gap:18px;margin-top:4px;}
#home .feat{flex-direction:column;align-items:flex-start;border-radius:24px;padding:26px 22px;box-shadow:0 16px 40px rgba(31,29,27,.05);}
#home .feat .ic-box{width:54px;height:54px;border-radius:17px;margin-bottom:16px;}
#home .feat .ic-box .ic{width:27px;height:27px;}
#home .feat h4{font-size:17px;margin-bottom:7px;}
#home .feat p{font-size:13.5px;line-height:1.75;}

/* 页脚 */
#home .foot{margin-top:70px;padding:44px 0 38px;font-size:14px;line-height:2;}

/* ---- 响应式 v3 ---- */
@media (max-width:1120px){
  #home .hero-inner{gap:26px;}
  .d-chip.c-top{left:-6px;}
  .d-chip.c-bot{right:-8px;}
}
@media (max-width:960px){
  .d-chip{display:none;}
  #home .hero{padding:30px 0 8px;}
  #home .hero-inner{grid-template-columns:1fr;gap:8px;text-align:center;padding:22px 18px 20px;}
  #home .hero-copy{max-width:none;margin:0 auto;}
  #home .hero p.sub{margin:0 auto 34px;}
  #home .hero-cta{justify-content:center;}
  .trust{justify-content:center;}
  #home .hero-demo{margin-top:44px;}
  #home .feats{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:680px){
  #home .hero h1{font-size:35px;line-height:1.22;}
  #home .hero p.sub{font-size:15.5px;line-height:1.85;margin-bottom:28px;}
  #home .hero-cta .btn-lg{width:100%;max-width:340px;font-size:16.5px;}
  #home .hero-cta .btn-ghost{width:100%;max-width:340px;}
  .phone{width:min(290px,80%);}
  #home .style-cover{height:120px;font-size:50px;}
  #home .feats{grid-template-columns:1fr;}
  #home .section{padding:42px 0;}
}
