/* ==========================================================================
   飞大叔新媒体工具网 — 全站样式 v3.0（新媒体工具网风格改版）
   主色 #2E62F6 / 辅助绿 #21BF6C / 黄 #FFA800 / 背景 #F5F7FB
   ========================================================================== */
:root{
  --primary:#2E62F6; --primary-2:#5A8BFF; --primary-deep:#1E4FD6;
  --green:#21BF6C; --green-deep:#18A65B;
  --yellow:#FFA800; --orange:#FF7A45; --red:#F5455C;
  --vip:#FFB400; --vip-deep:#E89600; --svip:#2A2F45;
  --bg:#F5F7FB; --card:#FFFFFF; --line:#E8EDF5;
  --text:#22283A; --text-2:#5A6478; --muted:#98A2B8;
  --shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);
  --shadow-lg:0 4px 14px rgba(16,24,40,.09);
  --radius:10px; --radius-sm:8px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background:var(--bg); color:var(--text); font-size:14.5px; line-height:1.65;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
a{color:inherit;text-decoration:none;transition:color .2s}
img{max-width:100%;border:0}
ul,ol{list-style:none}
button{font-family:inherit}
::selection{background:rgba(46,98,246,.16)}
.wrap{max-width:1200px;margin:0 auto;padding:0 18px}
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}
.muted{color:var(--muted)}
.hide{display:none!important}

/* ---- 数字/英文使用更精致的字体栈 ---- */
.num,.stat-card .v,.hero-stats b,.ring .num{font-family:"DIN Alternate","Helvetica Neue",Arial,sans-serif}
/* ---- SVG 图标基础（icon() 输出的线性图标统一对齐） ---- */
svg{vertical-align:middle;flex:none}
.tool-card .ic svg,.core-card .ic svg,.conv-card .ic svg,.dropzone .ic svg,
.rec-item .ric svg,.sub-menu .si svg,.nav-user .uface svg{display:block}

/* ---------------- 顶部导航 ---------------- */
.site-nav{
  position:sticky;top:0;z-index:900;background:#fff;
  box-shadow:0 2px 12px rgba(30,50,90,.06);
}
.nav-inner{display:flex;align-items:center;height:62px;gap:8px}
.brand{display:flex;align-items:center;gap:8px;flex:none;margin-right:14px}
.brand svg{width:34px;height:34px;display:block}
/* 后台上传的 Logo 图片（高度固定，宽度自适应，不拉伸） */
.brand-logo{height:34px;width:auto;max-width:150px;object-fit:contain;display:block}
.brand-name{font-size:18px;font-weight:700;color:var(--text);letter-spacing:.2px}
.brand-name small{font-size:10.5px;font-weight:400;color:var(--muted);display:block;line-height:1;margin-top:2px;letter-spacing:.5px}
.nav-links{display:flex;align-items:center;gap:2px;flex:1}
.nav-item{position:relative}
.nav-item>a{
  display:flex;align-items:center;gap:3px;padding:0 15px;height:62px;font-size:15px;color:var(--text);
  cursor:pointer;position:relative;white-space:nowrap;
}
.nav-item>a .arr{font-size:10px;color:var(--muted);transform:translateY(1px);transition:transform .25s}
.nav-item:hover>a{color:var(--primary)}
.nav-item:hover>a .arr{transform:rotate(180deg) translateY(-1px)}
.nav-item>a.on{color:var(--primary);font-weight:600}
.nav-item>a.on::after,.nav-item:hover>a::after{
  content:"";position:absolute;left:15px;right:15px;bottom:0;height:2px;
  background:var(--primary);
}
.nav-badge{position:absolute;top:10px;right:-4px;background:var(--red);color:#fff;font-size:9px;
  padding:1px 4px;border-radius:6px 6px 6px 0;line-height:1.4;font-weight:600}
/* 下拉大面板 */
.sub-menu{
  position:absolute;top:62px;left:50%;transform:translateX(-50%) translateY(8px);
  background:#fff;border-radius:0 0 16px 16px;box-shadow:0 1px 2px rgba(16,24,40,.04);
  padding:18px 20px;display:grid;gap:4px;min-width:230px;
  opacity:0;visibility:hidden;transition:all .22s ease;
}
.sub-menu.cols-2{grid-template-columns:1fr 1fr;min-width:420px}
.nav-item:hover .sub-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.sub-menu a{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:10px}
.sub-menu a:hover{background:#F0F5FF}
.sub-menu .si{
  width:32px;height:32px;flex:none;border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:#F1F6FF;color:var(--primary);
}
.sub-menu b{display:block;font-size:13.5px;color:var(--text);line-height:1.4}
.sub-menu span{display:block;font-size:11.5px;color:var(--muted);line-height:1.5}
/* 右侧 */
.nav-right{display:flex;align-items:center;gap:8px;flex:none}
.nav-pill{
  display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 12px;border-radius:8px;
  font-size:13px;font-weight:500;color:var(--text-2);white-space:nowrap;
  border:1px solid var(--line);background:#fff;transition:all .18s;
}
.nav-pill:hover{border-color:var(--primary);color:var(--primary)}
.nav-pill.gold{color:#C77700;border-color:#FFE2B0;background:#FFF9EE}
.nav-pill.gold:hover{border-color:#FFC53D;color:#B36A00}
.nav-pill.on{border-color:var(--primary);color:var(--primary);background:#F2F7FF}
.nav-pill.gold.on{border-color:#FFC53D;color:#B36A00;background:#FFF3DC}
.nav-user.on{color:var(--primary)}
.nav-user.on .uface{background:var(--primary);color:#fff}
.pill-green{color:var(--green-deep);border-color:#C9F0DC;background:#F3FCF7}
.pill-yellow{color:#C77700;border-color:#FFE2B0;background:#FFF9EE}
.nav-user{display:inline-flex;align-items:center;gap:6px;color:var(--text);font-weight:500;font-size:13.5px}
.nav-user:hover{color:var(--primary)}
.nav-user .uface{width:28px;height:28px;border-radius:50%;background:#EDF3FF;color:var(--primary);
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600}

/* ---------------- 按钮 ---------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;cursor:pointer;
  border-radius:10px;padding:0 22px;height:42px;font-size:14.5px;font-weight:500;
  transition:all .2s;white-space:nowrap;
}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-deep)}
.btn-green{background:var(--green);color:#fff}
.btn-green:hover{background:var(--green-deep)}
.btn-ghost{background:#fff;border:1px solid var(--line);color:var(--text-2)}
.btn-ghost:hover{border-color:var(--primary);color:var(--primary)}
.btn-yellow{background:#FF9D2E;color:#fff}
.btn-yellow:hover{background:#F08A16}
.btn-lg{height:46px;padding:0 28px;font-size:15px;border-radius:10px}
.btn-sm{height:32px;padding:0 14px;font-size:13px;border-radius:8px}
.block{display:flex;width:100%}
.link-btn{color:var(--primary);font-size:13px;cursor:pointer}

/* ---------------- Hero ---------------- */
.hero{
  background:#F0F5FE;
  padding:54px 0 46px;position:relative;border-bottom:1px solid #E4EDFB;
}
.hero-inner{max-width:800px;margin:0 auto;text-align:center;position:relative;z-index:1}
.hero h1{font-size:34px;font-weight:700;letter-spacing:.5px;line-height:1.4}
.hero h1 em{font-style:normal;color:var(--primary)}
.hero p.sub{color:var(--text-2);font-size:15px;margin-top:12px}
.hero-quick{
  margin:24px auto 0;max-width:680px;background:#fff;border:1px solid #DBE6F8;border-radius:12px;
  box-shadow:none;padding:10px 10px 10px 16px;display:flex;gap:10px;align-items:center;
}
.hero-quick textarea{
  flex:1;border:0;outline:0;resize:none;height:48px;font-size:14.5px;font-family:inherit;color:var(--text);line-height:1.6;
}
.hero-quick textarea::placeholder{color:#A9B4C7}
.hero-stats{display:flex;justify-content:center;gap:52px;margin-top:30px}
.hero-stats b{display:block;font-size:22px;color:var(--primary);font-weight:700}
.hero-stats span{font-size:12.5px;color:var(--muted)}
.fade-up{animation:fadeInUp .6s ease both}
.d1{animation-delay:.08s}.d2{animation-delay:.16s}.d3{animation-delay:.24s}.d4{animation-delay:.32s}
@keyframes fadeInUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* ---------------- 通用 section ---------------- */
.section{padding:48px 0 8px}
.sec-head{text-align:center;margin-bottom:30px}
.sec-head h2{font-size:26px;font-weight:600;letter-spacing:.3px}
.sec-head p{color:var(--muted);margin-top:8px;font-size:13.5px}
.sec-head .tag{
  display:inline-flex;align-items:center;gap:6px;color:var(--primary);font-weight:500;font-size:12.5px;
  margin-bottom:10px;background:#EDF3FF;padding:3px 12px;border-radius:6px;
}

/* 核心功能三卡 */
.core-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.core-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:28px 26px;
  transition:border-color .2s,box-shadow .2s;
}
.core-card:hover{border-color:#C8DBFF;box-shadow:0 2px 10px rgba(46,98,246,.07)}
.core-card .ic{
  width:48px;height:48px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:#EDF3FF;color:var(--primary);margin-bottom:16px;
}
.core-card.green .ic{background:#E7F8EF;color:var(--green-deep)}
.core-card.orange .ic{background:#FFF3E4;color:#F08A16}
.core-card h3{font-size:18px;font-weight:600}
.core-card p{color:var(--text-2);font-size:13.5px;margin-top:10px;line-height:1.9}
.core-card .go{margin-top:16px;display:inline-flex;align-items:center;gap:5px;color:var(--primary);font-weight:500;font-size:13.5px}
.core-card .go:hover{gap:8px}

/* 工具矩阵 */
.tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tool-card{
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px 16px;text-align:center;
  transition:border-color .18s,box-shadow .18s;position:relative;display:block;
}
.tool-card:hover{border-color:#C8DBFF;box-shadow:0 2px 10px rgba(46,98,246,.07)}
.tool-card .ic{
  width:46px;height:46px;margin:0 auto 12px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;background:#F1F6FF;color:var(--primary);
}
.tool-card b{font-size:14.5px;display:block;font-weight:600}
.tool-card span{font-size:12px;color:var(--muted);display:block;margin-top:5px;line-height:1.6}
.tool-card .hot-tag{position:absolute;top:8px;right:8px;background:#FFEDE0;color:#E8740C;font-size:10px;
  padding:1px 7px;border-radius:4px;font-weight:600}

/* 会员横幅 */
.vip-banner{
  margin:44px 0;border-radius:12px;padding:30px 34px;color:#fff;position:relative;overflow:hidden;
  background:#1F2A44;
}
.vip-banner h3{font-size:21px;font-weight:600}
.vip-banner p{opacity:.72;margin-top:8px;font-size:13.5px;line-height:1.8}
.vip-banner .btn{margin-top:16px}

/* 解说文案卡 */
.narr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.narr-card{
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px 22px;display:flex;gap:16px;
  transition:border-color .18s,box-shadow .18s;
}
.narr-card:hover{border-color:#C8DBFF;box-shadow:0 2px 10px rgba(46,98,246,.07)}
.narr-thumb{
  width:78px;height:78px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:26px;color:#fff;position:relative;overflow:hidden;
}
.narr-card h4{font-size:15.5px;font-weight:700;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.narr-card p{font-size:12.5px;color:var(--muted);margin-top:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.narr-cat{display:inline-block;background:#EDF3FF;color:var(--primary);font-size:11px;padding:2px 9px;border-radius:8px;margin-bottom:6px}
/* 分类标签压在缩略图下沿（对齐参考站「封面图 + 分类角标」结构） */
.narr-thumb .narr-cat{
  position:absolute;left:0;right:0;bottom:0;margin:0;border-radius:0;
  background:rgba(17,22,34,.5);color:#fff;font-size:10.5px;line-height:1.7;
  text-align:center;padding:0;letter-spacing:.3px;
}

/* ---------------- 页脚 ---------------- */
.site-footer{background:#1E2433;color:#9AA5BC;margin-top:64px}
.foot-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;padding:46px 0 34px}
.foot-cols h5{color:#E8EDF8;font-size:14.5px;margin-bottom:14px}
.foot-cols a{display:block;font-size:13px;padding:4px 0;color:#9AA5BC}
.foot-cols a:hover{color:#fff}
.foot-brandline{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.foot-brandline svg{width:30px;height:30px;flex:none;display:block}
.foot-brandline .brand-name{font-size:16px}
.foot-brandline .brand-name{color:#fff}
.foot-desc{font-size:12.5px;line-height:1.9;color:#7C87A0}
.foot-bar{border-top:1px solid rgba(255,255,255,.08);padding:18px 0;text-align:center;font-size:12.5px;color:#66718C}
.foot-bar a{color:#8A96B4}.foot-bar a:hover{color:#fff}

/* ---------------- 个人中心 ---------------- */
.uc-wrap{display:grid;grid-template-columns:220px 1fr;gap:20px;margin-top:22px}
.uc-side{background:#fff;border-radius:12px;box-shadow:none;padding:14px 12px;height:fit-content;position:sticky;top:80px}
.uc-side a{
  display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;font-size:14px;color:var(--text-2);
  margin-bottom:2px;transition:all .18s;
}
.uc-side a svg{width:17px;height:17px;flex:none}
.uc-side a:hover{background:#F3F7FF;color:var(--primary)}
.uc-side a.on{
  background:var(--primary);color:#fff;font-weight:600;
  ;
}
.uc-side .sep{height:1px;background:var(--line);margin:10px 6px}
.uc-main{min-width:0}
.uc-card{background:#fff;border-radius:12px;box-shadow:none;padding:26px 30px;margin-bottom:20px}
.uc-userline{display:flex;align-items:center;gap:16px}
.uc-avatar{width:64px;height:64px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:30px;color:#fff;background:var(--primary);}
.uc-uname{font-size:17px;font-weight:700;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.uc-utag{background:#EDF3FF;color:var(--primary);font-size:11px;padding:2px 10px;border-radius:9px;font-weight:500}
.uc-utag.gold{background:#FFF6E0;color:#C77700}
/* 额度圆环 */
.quota-row{display:flex;justify-content:flex-end;gap:34px;flex:1;flex-wrap:wrap}
.quota-item{text-align:center;min-width:86px}
.ring{width:76px;height:76px;margin:0 auto;position:relative}
.ring svg{width:76px;height:76px;transform:rotate(-90deg)}
.ring .bg{stroke:#EEF2F9}
.ring .val{stroke-linecap:round;transition:stroke-dashoffset 1s ease}
.ring .num{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-size:15px;font-weight:800;line-height:1.15;
}
.ring .num small{font-size:9.5px;font-weight:400;color:var(--muted)}
.quota-item .ql{font-size:13px;color:var(--text-2);margin-top:8px;font-weight:600}
.quota-item .qs{font-size:11px;color:var(--muted);margin-top:2px}
/* 会员特权 */
.priv-title{text-align:center;margin-bottom:26px}
.priv-title .ic{font-size:26px}
.priv-title h3{font-size:21px;font-weight:800;margin-top:4px}
.priv-title span{font-size:12px;color:var(--muted);letter-spacing:1px}
.priv-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:980px;margin:0 auto}
.priv-col{border-radius:12px;overflow:hidden}
.priv-head{padding:22px;text-align:center;color:#fff;position:relative}
.priv-col.svip .priv-head{background:#2A3040}
.priv-col.reg .priv-head{background:#5C6B88}
.priv-head h4{font-size:19px;font-weight:800}
.priv-head .btn{margin-top:12px}
.priv-rows{background:#fff}
.priv-row{display:flex;align-items:center;justify-content:space-between;padding:12.5px 18px;border-bottom:1px solid #F2F5FA;font-size:13.5px}
.priv-row:last-child{border-bottom:0}
.priv-row .k{color:var(--text-2);display:flex;align-items:center;gap:8px}
.priv-row .k::before{content:"";width:4px;height:4px;border-radius:50%;background:#C6CFDF}
.priv-row .v{display:flex;align-items:center;gap:6px;font-weight:600}
.priv-col.reg .priv-row.off .k{color:#B9C2D2}
.mark-yes{color:var(--green);font-size:15px}
.mark-no{color:#E23E52;font-size:15px}
.priv-col.reg .priv-row.off .v{color:#C3CBDB}
/* 温馨提示 */
.tips-card h4{font-size:16px;font-weight:700;margin-bottom:10px}
.tips-card ol{padding-left:18px;color:var(--text-2);font-size:13px;line-height:2}
.tips-card a{color:var(--primary)}
/* 用户中心通用表格 */
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{background:#F6F8FC;color:var(--text-2);font-weight:600;text-align:left;padding:11px 14px}
.table td{padding:12px 14px;border-bottom:1px solid #F2F5FA}
.table tr:last-child td{border-bottom:0}
.badge{display:inline-block;padding:3px 10px;border-radius:8px;font-size:12px}

/* ---------------- 工具工作台（写作等） ---------------- */
.work-wrap{display:grid;grid-template-columns:250px 1fr;gap:20px;margin-top:22px}
.tool-menu{background:#fff;border-radius:12px;box-shadow:none;padding:14px 12px;height:fit-content;position:sticky;top:80px}
.tool-menu .tmg{font-size:12px;color:var(--muted);padding:8px 14px 4px;letter-spacing:1px}
.tool-menu a{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:10px;font-size:13.5px;color:var(--text-2);margin:2px 0}
.tool-menu a .ti{width:30px;height:30px;border-radius:8px;background:#F1F5FE;display:flex;align-items:center;justify-content:center;font-size:15px;flex:none}
.tool-menu a:hover{background:#F3F7FF;color:var(--primary)}
.tool-menu a.on{background:var(--primary);color:#fff;font-weight:600}
.tool-menu a.on .ti{background:rgba(255,255,255,.2)}
.work-panel{background:#fff;border-radius:12px;box-shadow:none;padding:26px 30px;min-height:520px}
.work-panel h3{font-size:19px;font-weight:800;display:flex;align-items:center;gap:10px}
.work-panel .wdesc{color:var(--muted);font-size:13px;margin-top:6px;margin-bottom:20px}
.big-textarea{
  width:100%;min-height:210px;border:1.5px solid var(--line);border-radius:12px;padding:16px 18px;font-size:14.5px;
  font-family:inherit;resize:vertical;outline:0;transition:border .2s;line-height:1.9;
}
.big-textarea:focus{border-color:var(--primary-2);box-shadow:0 0 0 3px rgba(46,98,246,.10)}
.textarea-meta{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--muted)}
.opt-row{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 4px}
.chip{
  padding:7px 16px;border-radius:9px;border:1.5px solid var(--line);background:#fff;font-size:13px;color:var(--text-2);
  cursor:pointer;transition:all .18s;
}
.chip:hover{border-color:var(--primary-2);color:var(--primary)}
.chip.on{background:#EDF3FF;border-color:var(--primary);color:var(--primary);font-weight:600}
.result-box{
  margin-top:18px;background:#F8FAFF;border:1.5px dashed #D6E2FF;border-radius:12px;padding:18px 20px;
  font-size:14px;line-height:1.9;white-space:pre-wrap;color:var(--text);min-height:90px;
}
.result-box .placeholder{color:#B7C0D4}
.tag-kept{background:#E4F9EE;color:var(--green);border-radius:6px;padding:1px 8px;font-size:12px;margin-left:8px}
.tag-bad{background:#FDECEF;color:var(--red);border-radius:6px;padding:1px 8px;font-size:12px;margin:0 2px}

/* ---------------- 文案提取页 ---------------- */
.extract-hero{
  background:#F1F5FD;padding:40px 0 34px;text-align:center;margin-bottom:-66px;
}
.extract-hero h1{font-size:26px;font-weight:800}
.extract-hero p{color:var(--text-2);margin-top:8px;font-size:13.5px}
.ext-card{
  position:relative;z-index:1;background:#fff;border-radius:12px;box-shadow:0 1px 2px rgba(16,24,40,.04);
  max-width:980px;margin:0 auto;padding:26px 30px;
}
.ext-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:22px;flex-wrap:wrap}
.ext-tab{padding:11px 20px;font-size:14.5px;color:var(--text-2);cursor:pointer;border-radius:10px 10px 0 0;position:relative}
.ext-tab.on{color:var(--primary);font-weight:700}
.ext-tab.on::after{content:"";position:absolute;left:16px;right:16px;bottom:-1px;height:3px;border-radius:2px;background:var(--primary)}
.ext-input{display:flex;gap:10px}
.ext-input .input{flex:1}
.input{
  height:44px;border:1.5px solid var(--line);border-radius:10px;padding:0 14px;font-size:14px;outline:0;
  transition:border .2s;background:#fff;color:var(--text);width:100%;
}
.input:focus{border-color:var(--primary-2)}
.dropzone{
  border:1.8px dashed #CBDAFF;border-radius:12px;background:#FAFCFF;padding:38px 20px;text-align:center;color:var(--muted);
  cursor:pointer;transition:all .2s;
}
.dropzone:hover,.dropzone.drag{border-color:var(--primary);background:#F4F8FF}
.dropzone .ic{font-size:34px}
.dropzone b{color:var(--text-2);font-size:14px;display:block;margin-top:8px}
.dropzone span{font-size:12px}
.progress-line{height:8px;border-radius:4px;background:#EEF2F9;overflow:hidden;margin-top:16px}
.progress-line i{display:block;height:100%;width:0;border-radius:4px;background:var(--primary);transition:width .4s}
/* 记录列表 */
.rec-filter{display:flex;gap:8px;margin:22px 0 14px}
.rec-filter span{padding:7px 16px;border-radius:9px;font-size:13px;color:var(--text-2);cursor:pointer;background:#fff;border:1px solid var(--line)}
.rec-filter span.on{background:#EDF3FF;border-color:var(--primary);color:var(--primary);font-weight:600}
.rec-item{background:#fff;border-radius:12px;box-shadow:none;padding:16px 20px;margin-bottom:12px;display:flex;gap:14px;align-items:center}
.rec-item .ric{width:42px;height:42px;border-radius:10px;background:#F1F5FE;display:flex;align-items:center;justify-content:center;font-size:19px;flex:none}
.rec-item .rt{flex:1;min-width:0}
.rec-item .rt b{font-size:14px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rec-item .rt span{font-size:12px;color:var(--muted)}
.rec-status{font-size:12px;padding:3px 12px;border-radius:9px;font-weight:600;flex:none}
.rec-status.ok{background:#E4F9EE;color:var(--green)}
.rec-status.run{background:#FFF6E0;color:#C77700}
.rec-status.fail{background:#FDECEF;color:var(--red)}

/* ---------------- 音视频转换 ---------------- */
.conv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}
.conv-card{background:#fff;border-radius:12px;box-shadow:none;padding:26px 24px;text-align:center;transition:transform .25s}
.conv-card:hover{transform:translateY(-4px)}
.conv-card .ic{width:56px;height:56px;border-radius:12px;margin:0 auto 14px;font-size:25px;display:flex;align-items:center;justify-content:center;background:#EFF4FF}
.conv-card b{font-size:15.5px}
.conv-card p{font-size:12.5px;color:var(--muted);margin:8px 0 16px}

/* ---------------- 公告 / 文章 ---------------- */
.notice-item{display:flex;gap:16px;padding:20px 6px;border-bottom:1px solid #F2F5FA}
.notice-item .nd{flex:none;text-align:center;background:#F4F7FE;border-radius:10px;padding:8px 12px;min-width:64px}
.notice-item .nd b{display:block;font-size:18px;color:var(--primary)}
.notice-item .nd span{font-size:11px;color:var(--muted)}
.notice-item h4{font-size:15px;font-weight:700}
.notice-item p{font-size:12.5px;color:var(--muted);margin-top:5px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.prose{font-size:14.5px;line-height:2;color:var(--text)}
.prose h2{font-size:20px;margin:18px 0 10px}
.prose p{margin:10px 0}

/* ---------------- 登录页 ---------------- */
.auth-wrap{
  min-height:calc(100vh - 62px);display:flex;align-items:center;justify-content:center;
  background:var(--bg);
  padding:40px 16px;
}
.auth-card{
  width:420px;max-width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 1px 2px rgba(16,24,40,.04);padding:38px 36px;
  animation:fadeInUp .5s ease both;
}
.auth-tabs{display:flex;gap:26px;margin-bottom:24px}
.auth-tab{font-size:17px;font-weight:600;color:var(--muted);cursor:pointer;padding-bottom:8px;position:relative}
.auth-tab.on{color:var(--text)}
.auth-tab.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:2px;background:var(--primary)}
.field{margin-bottom:16px}
.label{display:block;font-size:13px;color:var(--text-2);margin-bottom:7px;font-weight:500}

/* ---------------- 配音工作台微调 ---------------- */
.studio-emotions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.studio-emotions .chip.on{background:var(--primary);border-color:var(--primary);color:#fff}

/* ---------------- APP 下载 ---------------- */
.app-hero{background:#232A3F;border-radius:12px;color:#fff;padding:52px 50px;
  display:flex;align-items:center;gap:50px;margin-top:24px;overflow:hidden;position:relative}
.app-hero::after{content:"APP";position:absolute;right:20px;bottom:-30px;font-size:130px;font-weight:900;opacity:.045}
.app-qr{width:170px;height:170px;background:#fff;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;font-size:80px;color:var(--primary)}

/* ---------------- 表单提示 ---------------- */
.flash{max-width:1200px;margin:16px auto 0;border-radius:12px;padding:12px 18px;font-size:13.5px}
.flash.ok{background:#E4F9EE;color:var(--green-deep)}
.flash.err{background:#FDECEF;color:var(--red)}

/* ---------------- 响应式 ---------------- */
@media (max-width:1000px){
  .nav-links{display:none}
  .core-grid,.tool-grid,.plan-grid{grid-template-columns:repeat(2,1fr)}
  .uc-wrap,.work-wrap{grid-template-columns:1fr}
  .uc-side,.tool-menu{position:static;display:flex;flex-wrap:wrap;gap:4px}
  .uc-side a,.tool-menu a{margin:0}
  .uc-side .sep,.tool-menu .tmg{display:none}
  .priv-grid{grid-template-columns:1fr}
  .foot-cols{grid-template-columns:1fr 1fr}
  .hero h1{font-size:28px}
  .quota-row{justify-content:flex-start}
}
@media (max-width:640px){
  .core-grid,.narr-grid,.conv-grid,.plan-grid{grid-template-columns:1fr}
  .tool-grid{grid-template-columns:repeat(2,1fr)}
  .uc-card{padding:20px 18px}
  .hero-quick{flex-direction:column;padding:12px}
  .hero h1{font-size:21px}
  .hero-stats{gap:28px;flex-wrap:wrap}
  .sec-head h2{font-size:20px}
}

/* ==========================================================================
   旧页面兼容层（studio / voices / multi / works / templates / schemes /
   referral / share 等历史页面的类名，按 v3 设计语言重新着色）
   ========================================================================== */
.page-head{padding:26px 0 4px}
.page-head h1{font-size:24px;font-weight:800}
.panel{background:#fff;border-radius:12px;box-shadow:none;padding:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.badge{display:inline-block;padding:3px 10px;border-radius:8px;font-size:12px;background:#EDF3FF;color:var(--primary)}
.badge.blue{background:#EDF3FF;color:var(--primary)}
.badge.purple{background:#EAF3FF;color:#1E4FD6}
.badge.green{background:#E4F9EE;color:var(--green-deep)}
.badge.orange{background:#FFF1E0;color:var(--orange)}
.badge.red,.badge.gray{background:#FDECEF;color:var(--red)}
.select,input[type="select"],select.input{height:44px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;background:#fff;outline:0;color:var(--text)}
.textarea,textarea.textarea{width:100%;min-height:150px;border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;font-family:inherit;font-size:14px;outline:0;resize:vertical;line-height:1.8}
.textarea:focus{border-color:var(--primary-2)}
.hint{font-size:12px;color:var(--muted)}
.msg{font-size:12.5px;color:var(--text-2)}
.ok2{color:var(--green)}
.danger{color:var(--red)}
.blue{color:var(--primary)}
.btn-line{background:#fff;border:1.5px solid var(--primary);color:var(--primary)}
.btn-line:hover{background:#F0F5FF}
.avatar,.av{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--primary);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;line-height:1}

/* 配音工作台 */
.studio-wrap{display:grid;grid-template-columns:400px 1fr;gap:20px;margin-top:22px;align-items:start}
.voice-panel{background:#fff;border-radius:12px;box-shadow:none;padding:20px}
.vp-head{font-size:16px;font-weight:800;margin-bottom:12px}
.vp-cats{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.cat-chip{padding:6px 14px;border-radius:8px;border:1.5px solid var(--line);font-size:12.5px;color:var(--text-2);cursor:pointer}
.cat-chip.on{background:#EDF3FF;border-color:var(--primary);color:var(--primary);font-weight:600}
.filter-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.filter-tab{padding:6px 14px;border-radius:8px;border:1.5px solid var(--line);font-size:12.5px;color:var(--text-2);cursor:pointer}
.filter-tab.on{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}
.voice-list-scroll{max-height:560px;overflow-y:auto;padding-right:4px}
.voice-list-scroll::-webkit-scrollbar{width:5px}
.voice-list-scroll::-webkit-scrollbar-thumb{background:#D9E2F2;border-radius:3px}
.vc-item{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;cursor:pointer;transition:background .15s}
.vc-item:hover{background:#F3F7FF}
.vc-item.on{background:#EAF1FF;outline:1.5px solid var(--primary)}
.vc-item .av{flex:none}
.vc-item .nm{font-size:14px;font-weight:600;line-height:1.3}
.vc-item .ds{font-size:11.5px;color:var(--muted);line-height:1.5}
.vc-play{width:32px;height:32px;border-radius:50%;border:0;background:#EDF3FF;color:var(--primary);cursor:pointer;flex:none;margin-left:auto;display:inline-flex;align-items:center;justify-content:center}
.vc-play:hover{background:var(--primary);color:#fff}
/* 播放 / 暂停图标用 CSS 绘制，不依赖字体符号（各系统渲染一致，圆钮内不再塞文字） */
.vc-play::before,.mx-vplay::before{content:"";display:block;width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent currentColor;margin-left:3px}
.vc-play.on::before,.mx-vplay.on::before{border:0;width:10px;height:11px;margin-left:0;border-left:3px solid currentColor;border-right:3px solid currentColor}
.vc-play.on,.mx-vplay.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.editor-box{background:#fff;border-radius:12px;box-shadow:none;padding:24px 26px}
.editor-bottom{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.ssml-toolbar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ssml-tool{padding:6px 12px;border-radius:8px;border:1.5px solid var(--line);background:#fff;font-size:12.5px;color:var(--text-2);cursor:pointer}
.ssml-tool:hover{border-color:var(--primary);color:var(--primary)}
.param-row{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:13px;color:var(--text-2)}
.param-row .track{flex:1;height:6px;border-radius:3px;background:#EEF2F9;position:relative}
.param-row .pn{min-width:52px;text-align:right;color:var(--primary);font-weight:700}
.param-row .pv{width:64px;text-align:left}
.side-box{background:#fff;border-radius:12px;box-shadow:none;padding:20px}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}

/* 音色库 / 模板 */
.voice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.voice-card{background:#fff;border-radius:12px;box-shadow:none;padding:18px;transition:transform .2s,box-shadow .2s}
.voice-card:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(16,24,40,.04)}
.vc-top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.vc-top .vc-avatar{width:46px;height:46px;border-radius:12px;flex:none;display:flex;align-items:center;
  justify-content:center;font-size:18px;font-weight:700;color:#fff;line-height:1;letter-spacing:0}
.vc-name{font-size:14.5px;font-weight:700}
.vc-tags{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}
.vc-tag{font-size:11px;background:#F1F5FE;color:var(--primary);padding:2px 9px;border-radius:7px}
.vc-tag.hot{background:#FFF1E0;color:var(--orange)}
.vc-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.vc-use{font-size:12.5px;color:var(--primary);cursor:pointer;font-weight:600}
.pagination{display:flex;gap:8px;justify-content:center;margin:26px 0;flex-wrap:wrap}
.pg-btn{min-width:36px;height:36px;border-radius:9px;border:1.5px solid var(--line);background:#fff;color:var(--text-2);font-size:13px;cursor:pointer;padding:0 10px}
.pg-btn.on{background:var(--primary);border-color:var(--primary);color:#fff}
.pg-btn:hover:not(.on){border-color:var(--primary);color:var(--primary)}
.pg-dots{padding:8px 2px;color:var(--muted)}

/* 弹窗（多角色） */
.modal-mask{position:fixed;inset:0;background:rgba(15,25,50,.45);z-index:950;display:none;align-items:center;justify-content:center}
.modal-mask.show{display:flex}
.modal{background:#fff;border-radius:12px;box-shadow:0 1px 2px rgba(16,24,40,.04);padding:26px 28px;width:520px;max-width:92vw;max-height:86vh;overflow:auto}

/* 旧推广页（referral.php）—— 独立类名 .hero-dark，避免覆盖前台浅色 hero */
.hero.hero-dark{background:#1F2A44;border-radius:12px;color:#fff;padding:38px 40px;margin-top:22px;position:relative;overflow:hidden}
.hero-badge{display:inline-block;background:#FFA000;color:#5C3A00;font-size:12px;font-weight:700;padding:3px 12px;border-radius:12px;margin-bottom:12px}
.hero-actions{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
.grad{color:#FFB400}
.sec{padding:36px 0 6px}
.sec-title{text-align:center;font-size:24px;font-weight:800;margin-bottom:8px}
.stat-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stat-card{background:#fff;border-radius:12px;box-shadow:none;padding:20px 22px;display:flex;align-items:center;gap:14px}
.stat-card .v{font-size:22px;font-weight:800;line-height:1.2}
.stat-card .l{font-size:12.5px;color:var(--muted)}
.stat-ico{width:44px;height:44px;border-radius:12px;background:#EDF3FF;display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.step-card{background:#fff;border-radius:12px;box-shadow:none;padding:22px;text-align:center;position:relative}
.step-num{width:34px;height:34px;border-radius:50%;background:var(--primary);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.quick-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:#F7FAFF;margin-bottom:10px}
.quick-item .qi{width:38px;height:38px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;flex:none;}
.bar-item{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:12.5px}
.bi-track{flex:1;height:8px;background:#EEF2F9;border-radius:4px;overflow:hidden}
.bi-fill{height:100%;border-radius:4px;background:var(--primary)}
.bi-top{font-size:11px;color:var(--muted);min-width:76px}
.lg-tab{padding:10px 22px;border-radius:10px 10px 0 0;font-size:14px;color:var(--text-2);cursor:pointer;border-bottom:3px solid transparent}
.lg-tab.on{color:var(--primary);font-weight:700;border-color:var(--primary)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.flash{max-width:1200px}

/* ==========================================================================
   响应式增强 v3.1 —— 平板 / 手机全覆盖（导航抽屉 · 表格滚动 · 栅格降列）
   ========================================================================== */
.nav-burger{display:none;width:38px;height:38px;border:1px solid var(--line);background:#fff;
  border-radius:10px;font-size:17px;cursor:pointer;align-items:center;justify-content:center;color:#22304a;flex:none}
.nav-burger:hover{border-color:var(--primary);color:var(--primary)}

@media (max-width:1080px){
  .nav-burger{display:inline-flex}
  .nav-links{display:block;position:fixed;top:62px;left:0;right:0;z-index:90;background:#fff;
    box-shadow:0 24px 48px rgba(20,35,70,.18);border-radius:0 0 12px 12px;padding:8px 16px 18px;
    max-height:calc(100vh - 62px);overflow:auto;transform:translateY(-14px);opacity:0;visibility:hidden;transition:.22s}
  body.nav-open .nav-links{transform:none;opacity:1;visibility:visible}
  .nav-item{width:100%}
  .nav-item>a{display:flex;align-items:center;justify-content:space-between;padding:12px 6px;
    border-bottom:1px solid #F1F4F9;font-size:14.5px}
  .nav-item>a .arr{transform:rotate(0)}
  .nav-item>a::after{display:none}
  .sub-menu{position:static !important;opacity:1 !important;visibility:visible !important;transform:none !important;
    box-shadow:none !important;border:0 !important;padding:6px 0 10px;display:grid;grid-template-columns:1fr;gap:2px;min-width:0}
  .sub-menu.cols-2{grid-template-columns:1fr}
  .sub-menu a{padding:8px 6px;border-radius:10px}
  .sub-menu a:hover{background:#F4F8FF}
  .wrap{padding:0 14px}
}
@media (max-width:720px){
  .nav-inner{height:58px;gap:6px}
  .nav-links{top:58px;max-height:calc(100vh - 58px)}
  .nav-right{gap:6px;margin-left:auto}
  .nav-pill{display:none}
  .nav-user{font-size:13px}
  .brand{margin-right:0;min-width:0}
  .brand svg{width:30px;height:30px}
  .brand-logo{height:30px;max-width:120px}
  .brand-name{font-size:16px;white-space:nowrap}
  .brand-name small{display:none}
  .hero{padding:30px 0 26px;border-radius:0}
  .hero h1{font-size:22px}
  .hero p.sub{font-size:13.5px}
  .hero-stats{gap:22px;flex-wrap:wrap;margin-top:22px}
  .hero-stats b{font-size:20px}
  .section{padding:34px 0 6px}
  .section h2{font-size:21px !important}
  .foot-cols{grid-template-columns:1fr;gap:8px;padding:30px 0 22px}
  .foot-bar{font-size:11.5px;padding:14px 10px}
  .page-head h1{font-size:20px}
  .table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table thead th{white-space:nowrap}
  .quota-row{gap:14px;flex-wrap:wrap;justify-content:center}
  .priv-head{padding:18px !important}
  .uc-userline{gap:12px}
  .uc-avatar{width:52px;height:52px;font-size:20px}
  .flash{margin:10px 12px 0;font-size:12.5px}
  .btn{padding:9px 18px;font-size:13.5px}
  .big-textarea{min-height:150px}
  .prose{font-size:14px}
}
@media (max-width:420px){
  .tool-grid,.core-grid,.plan-grid{gap:12px}
  .hero-quick textarea{min-height:90px}
}

/* ==========================================================================
   媒小三配音页特征样式 v3.2 —— 音色等级标签 / 情绪标签 / 主播卡
   （VIP/SVIP 徽章 · 特色/情绪标记 · 情绪胶囊 · 声线描述）
   ========================================================================== */
/* 音色等级徽章（媒小三「VIP 全能配音」「SVIP 超自然」） */
.vc-vip{
  display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 8px;border-radius:6px;
  font-size:10.5px;font-weight:800;letter-spacing:.5px;line-height:1;
}
.vc-vip.vip{background:#FFC53D;color:#8A5A00}
.vc-vip.svip{background:#2A3040;color:#FFD98A}
/* 声线特色 / 情绪标记 */
.vc-mark{display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 8px;border-radius:6px;
  font-size:10.5px;font-weight:600;background:#F1F5FE;color:#5A6478}
.vc-mark.hot{background:#FFF1E0;color:#E8820C}
.vc-mark.emo{background:#E6F7FB;color:#0E9CB8}
/* 情绪胶囊（叙述/犹豫/恐惧/愉快/抱怨/严肃/生气/悲伤/沮丧/轻松/热情/新闻） */
.emoji-row{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.emoji-chip{
  height:26px;padding:0 11px;border-radius:13px;border:1px solid var(--line);background:#fff;
  font-size:12px;color:var(--text-2);cursor:pointer;transition:all .16s;display:inline-flex;align-items:center;
}
.emoji-chip:hover{border-color:var(--primary-2);color:var(--primary)}
.emoji-chip.on{background:var(--primary);border-color:transparent;color:#fff;font-weight:600;}
/* 声线描述（卡片副标题） */
.vc-desc{font-size:12px;color:var(--muted);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* 音色卡标签行 */
.vc-flags{display:flex;gap:5px;flex-wrap:wrap;align-items:center;margin:6px 0}

/* ==========================================================================
   v4.0 设计收敛层 —— 去掉「模板感 / AI 味」
   统一圆角为 10–12px、卡片改细边框+轻阴影、hover 只做边框加深不做上浮发光、
   深色横幅统一实色。覆盖历史卡片样式，使全站贴近真实产品站的克制视觉。
   ========================================================================== */
/* ---- 统一圆角 ---- */
.panel,.uc-side,.uc-card,.tool-menu,.work-panel,.voice-panel,.editor-box,.side-box,
.voice-card,.conv-card,.stat-card,.step-card,.ext-card,.priv-col,.app-qr,.auth-card,
.modal,.sub-menu{border-radius:12px}
.dropzone,.result-box,.rec-item,.progress-line{border-radius:10px}
/* ---- 卡片：细边框 + 去掉重阴影 ---- */
.panel,.voice-card,.conv-card,.stat-card,.step-card,.uc-card,
.uc-side,.tool-menu,.work-panel,.voice-panel,.editor-box,.side-box{
  border:1px solid var(--line);box-shadow:none;
}
/* ---- hover：只加深边框，不上浮、不发光 ---- */
.voice-card:hover,.conv-card:hover,.step-card:hover{border-color:#C8DBFF}
.voice-card:hover,.conv-card:hover,.stat-card:hover,.step-card:hover{transform:none;box-shadow:none}
/* ---- 深色横幅统一实色 ---- */
.app-hero,.vip-banner{background:#1F2A44;border-radius:12px}
/* ---- 正文小字行高更舒展 ---- */
.core-card p,.tool-card span,.vc-desc,.narr-card p,.work-panel .wdesc{line-height:1.75}

/* ==========================================================================
   顶部导航 v4.2 —— 移动端抽屉（含遮罩 / 折叠子菜单）
   说明：折叠只在 body.nav-js（= site.js 已加载）时生效；
        脚本失效时子菜单保持全展开，链接依然全部可点，功能不缺失。
   ========================================================================== */
.nav-mask{position:fixed;inset:0;background:rgba(16,24,40,.42);z-index:80;display:none;
  opacity:0;visibility:hidden;transition:opacity .22s,visibility .22s}
@media (max-width:1080px){
  .nav-mask{display:block}
  body.nav-open .nav-mask{opacity:1;visibility:visible}
  body.nav-open{overflow:hidden}
  body.nav-open .nav-burger{border-color:var(--primary);color:var(--primary);background:#F2F7FF}
  /* 箭头变成可点开关，扩大触摸热区 */
  .nav-item.has-sub>a .arr{width:36px;height:36px;display:inline-flex;align-items:center;
    justify-content:center;margin:-8px -8px -8px 0;border-radius:8px;flex:none;font-size:11px}
  .nav-item.has-sub.open>a .arr{transform:rotate(180deg)}
  body.nav-js .nav-item.has-sub>.sub-menu{display:none}
  body.nav-js .nav-item.has-sub.open>.sub-menu{display:grid}
  .sub-menu a{padding:9px 8px}
}

/* ==========================================================================
   首页「媒体资讯」板块（对齐参考站：日期块 + 标题 + 摘要，纵向列表）
   ========================================================================== */
.news-list{background:#fff;border:1px solid var(--line);border-radius:12px;padding:4px 22px 18px}
.news-list .notice-item:last-of-type{border-bottom:0}
.news-list .notice-item{padding:18px 0}
.news-list .notice-item h4{font-size:15.5px;transition:color .18s}
.news-list .notice-item:hover h4{color:var(--primary)}
.news-more{text-align:center;padding-top:18px;border-top:1px solid #F2F5FA;margin-top:2px}
@media (max-width:720px){
  .news-list{padding:2px 14px 14px}
  .news-list .notice-item{gap:12px;padding:15px 0}
  .news-list .notice-item .nd{min-width:54px;padding:6px 9px}
  .news-list .notice-item .nd b{font-size:16px}
}

/* ---------------- 全局提示 toast ---------------- */
#toast{
  position:fixed;left:50%;top:76px;transform:translate(-50%,-8px);
  background:#1F2A44;color:#fff;font-size:13.5px;line-height:1.5;
  padding:10px 20px;border-radius:10px;z-index:990;max-width:80vw;
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
  box-shadow:0 6px 20px rgba(16,24,40,.16);text-align:center;
}
#toast.show{opacity:1;transform:translate(-50%,0)}
#toast.ok{background:#1A9C63}
#toast.err{background:#D9455F}

/* ==========================================================================
   个人中心 v4.3 —— 1:1 复刻控制台版式（浅底 + 白色侧栏 + 指标卡 + 趋势图）
   ⚠ 本区块刻意保留参考稿的渐进度条 / 图表填充，属「复刻稿例外」，
     与 v4.1「全站禁渐变」规则不冲突：改动本区块时不要一起扁平化。
   ========================================================================== */
.uc-wrap{
  grid-template-columns:214px minmax(0,1fr);
  font-family:"PingFang SC","HarmonyOS Sans SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  display:grid;gap:18px;margin-top:20px;align-items:start;
}
.uc-side{background:#fff;border:1px solid #EEF1F7;border-radius:14px;padding:12px 10px;height:fit-content;position:sticky;top:80px}
.uc-me{display:flex;align-items:center;gap:10px;padding:6px 6px 14px;border-bottom:1px solid #F2F5FA;margin-bottom:8px}
.uc-me-face{width:38px;height:38px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  background:#2E62F6;color:#fff;font-size:15px;font-weight:600}
.uc-me-txt{min-width:0}
.uc-me-txt b{display:block;font-size:13.5px;font-weight:700;color:#1F2430;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:126px}
.uc-me-chip{display:inline-block;margin-top:4px;background:#EDF3FF;color:#2E62F6;font-size:10.5px;padding:1px 8px;border-radius:6px}
.uc-me-chip.gold{background:#FFF6E0;color:#C77700}
.uc-nav{display:block}
.uc-nav a{display:flex;align-items:center;gap:10px;padding:0 10px;height:38px;border-radius:10px;
  font-size:13.5px;color:#5A6478;font-weight:500;transition:background .18s,color .18s}
.uc-nav a svg{width:16.5px;height:16.5px;flex:none}
.uc-nav a:hover{background:#F5F7FD;color:#2E62F6}
.uc-nav a.on{background:#EDF3FF;color:#2E62F6;font-weight:600}
.uc-nav .sep{height:1px;background:#F2F5FA;margin:8px 6px}
.uc-nav a.uc-out{color:#D9455F}
.uc-nav a.uc-out:hover{background:#FEF3F5;color:#D9455F}

/* ---- 问候语 + 主行动 ---- */
.pc-hello{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:2px 0 18px;flex-wrap:wrap}
.pc-hello h1{font-size:23px;font-weight:700;color:#1F2430;letter-spacing:-.2px}
.pc-hello p{font-size:12.5px;color:#98A2B8;margin-top:5px}
.pc-cta{display:inline-flex;align-items:center;gap:7px;background:#2E62F6;color:#fff;border-radius:10px;
  padding:10px 18px;font-size:14px;font-weight:600;box-shadow:0 2px 8px rgba(91,91,214,.22);transition:background .2s,transform .2s}
.pc-cta:hover{background:#1E4FD6;color:#fff;transform:translateY(-1px)}

/* ---- 指标卡 ×4 ---- */
.pc-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px}
.pc-stat{background:#fff;border:1px solid #EEF1F7;border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;min-height:136px}
.pc-stat-top{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.pc-stat-ico{width:28px;height:28px;border-radius:8px;flex:none;display:flex;align-items:center;justify-content:center}
.pc-stat-ico.c-blue{background:#EDF3FF;color:#2E62F6}
.pc-stat-ico.c-cyan{background:#E6F7FB;color:#0E9CB8}
.pc-stat-ico.c-green{background:#E8F7F0;color:#12A05C}
.pc-stat-ico.c-orange{background:#FFF3E8;color:#E1873A}
.pc-stat-label{font-size:12.5px;color:#7A8699;flex:1;white-space:nowrap}
.pc-delta{font-size:11px;padding:2px 7px;border-radius:6px;font-weight:600}
.pc-delta.up{background:#E6F6EE;color:#0E9F6E}
.pc-delta.down{background:#FDECEF;color:#D9455F}
.pc-stat-num{font-family:"DIN Alternate","SF Pro Display","Helvetica Neue",Arial,sans-serif;
  font-size:30px;font-weight:700;color:#1F2430;line-height:1.15;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.pc-stat-num small{font-size:13px;font-weight:500;color:#98A2B8;margin-left:4px;letter-spacing:0}
.pc-stat-num.pc-num-green{color:#12A05C}
.pc-stat-sub{font-size:11.5px;color:#A8B2C4;margin-top:4px;line-height:1.5}
.pc-spark{margin-top:auto;padding-top:10px}
.pc-spark svg{width:100%;height:34px;display:block}

/* ---- 进度条 ---- */
.pc-bar{height:6px;border-radius:99px;background:#F0F2F7;overflow:hidden;margin-top:auto}
.pc-stat .pc-bar{margin-top:12px}
.pc-bar>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2E62F6,#5A8BFF)}

/* ---- 趋势 + 套餐 ---- */
.pc-row{display:grid;grid-template-columns:minmax(0,1.95fr) minmax(0,1fr);gap:16px;margin-bottom:18px}
.pc-card{background:#fff;border:1px solid #EEF1F7;border-radius:14px;padding:20px 22px}
.pc-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.pc-card-head h3{font-size:14.5px;font-weight:700;color:#1F2430;display:flex;align-items:center;gap:6px}
.pc-info{width:14px;height:14px;border-radius:50%;border:1px solid #DDE3EE;color:#A8B2C4;font-size:10px;
  display:inline-flex;align-items:center;justify-content:center;font-weight:600;cursor:help;font-style:normal}
.pc-tabs{display:inline-flex;background:#F4F6FB;border-radius:9px;padding:3px}
.pc-tabs span{padding:5px 14px;font-size:12.5px;color:#7A8699;border-radius:7px;cursor:pointer;transition:all .2s;user-select:none}
.pc-tabs span.on{background:#fff;color:#2E62F6;font-weight:600;box-shadow:0 1px 3px rgba(16,24,40,.08)}
.pc-big{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.pc-big b{font-family:"DIN Alternate","SF Pro Display","Helvetica Neue",Arial,sans-serif;font-size:30px;font-weight:700;color:#1F2430;letter-spacing:-.5px}
.pc-big small{font-size:13px;color:#98A2B8}
.pc-big span{font-size:12px;color:#A8B2C4;margin-left:2px}
.pc-legend{display:flex;gap:18px;margin-top:12px;font-size:12px;color:#7A8699}
.pc-legend i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:middle}
.pc-chart{margin-top:8px;min-width:0}
.pc-chart svg{display:block;width:100%;height:auto}
.uc-main{min-width:0}
.pc-mini{font-size:11px;background:#EFF1F7;color:#7A8699;padding:1px 7px;border-radius:5px;font-weight:500}
.pc-chip-ok{font-size:11.5px;background:#E6F6EE;color:#0E9F6E;padding:3px 10px;border-radius:99px;font-weight:600;white-space:nowrap}
.pc-plan-line{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:#7A8699;margin-bottom:8px}
.pc-plan-line b{color:#2E62F6;font-weight:700}
.pc-note{font-size:12px;color:#98A2B8;margin-top:10px;line-height:1.7}
.pc-note b{color:#2E62F6;font-weight:700}
.pc-boxes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.pc-boxes>div{background:#F7F9FD;border-radius:10px;padding:10px 12px}
.pc-boxes span{display:block;font-size:11.5px;color:#98A2B8}
.pc-boxes b{display:block;font-size:13.5px;color:#1F2430;font-weight:700;margin-top:2px}
.pc-quota-mini{margin-top:14px;padding-top:12px;border-top:1px dashed #EDF0F6}
.pc-quota-mini>div{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;padding:3.5px 0}
.pc-quota-mini span{color:#98A2B8}
.pc-quota-mini b{color:#4A5468;font-weight:600}
.pc-btn-block{display:block;text-align:center;background:#2E62F6;color:#fff;border-radius:10px;padding:11px;
  font-size:14px;font-weight:600;margin-top:16px;transition:background .2s}
.pc-btn-block:hover{background:#1E4FD6;color:#fff}

/* ---- 底部三卡 ---- */
.pc-row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pc-more{font-size:12px;color:#2E62F6}
.pc-task{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #F5F7FB}
.pc-task:last-child{border-bottom:0}
.pc-task-ic{width:30px;height:30px;border-radius:8px;flex:none;background:#F3F5FA;color:#7A8699;display:flex;align-items:center;justify-content:center}
.pc-task-txt{min-width:0;flex:1}
.pc-task-txt b{display:block;font-size:13px;font-weight:600;color:#333A4A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-task:hover .pc-task-txt b{color:#2E62F6}
.pc-task-txt span{display:block;font-size:11.5px;color:#A8B2C4;margin-top:1px}
.pc-vface{width:30px;height:30px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:600}
.pc-empty{font-size:12.5px;color:#A8B2C4;padding:18px 0;text-align:center}
.pc-empty a{color:#2E62F6}
.pc-lv{font-size:12.5px;color:#7A8699;margin-bottom:10px}
.pc-lv b{color:#2E62F6;font-weight:700}
.pc-float{position:fixed;right:0;top:46%;writing-mode:vertical-rl;background:#2E62F6;color:#fff;
  font-size:12px;padding:10px 7px;border-radius:8px 0 0 8px;letter-spacing:2px;z-index:60;box-shadow:-2px 0 10px rgba(91,91,214,.2)}
.pc-float:hover{background:#1E4FD6;color:#fff}

@media(max-width:1080px){
  .pc-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc-row{grid-template-columns:minmax(0,1fr)}
  .pc-row3{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:720px){
  .uc-wrap{grid-template-columns:minmax(0,1fr)}
  .uc-side{position:static}
  .pc-stats{grid-template-columns:minmax(0,1fr)}
  .pc-float{display:none}
  .pc-hello h1{font-size:20px}
}

/* 窄屏：侧栏由竖列表改为「用户块 + 横向滑动胶囊菜单」，
   避免 8 个菜单项把手机首屏整屏占满，同时修掉旧规则把它变成并排 flex 行的问题 */
@media(max-width:1000px){
  .uc-side{display:block;position:static;padding:10px 10px 8px}
  .uc-me{padding:2px 4px 10px}
  .uc-me-txt b{max-width:none}
  .uc-nav{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .uc-nav::-webkit-scrollbar{display:none}
  .uc-nav a{flex:none;height:34px;padding:0 13px;border-radius:99px;background:#F5F7FD;font-size:13px;white-space:nowrap}
  .uc-nav a:hover{background:#EDF3FF}
  .uc-nav a.on{background:#EDF3FF;color:#2E62F6}
  .uc-nav .sep{display:none}
  .uc-nav a.uc-out{margin-left:auto;background:#FEF3F5}
}

/* ---------------- 首页套餐方案（灵活试用 / 基础版 / 专业版）---------------- */
.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.plan-card{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px 24px;
  display:flex;flex-direction:column;transition:border-color .2s,box-shadow .2s;
}
.plan-card:hover{border-color:#C8DBFF;box-shadow:0 2px 10px rgba(46,98,246,.07)}
.plan-card.hot{border-color:#9DBBFF}
.plan-badge{position:absolute;right:18px;top:18px;background:var(--primary);color:#fff;font-size:11px;
  font-weight:600;padding:3px 10px;border-radius:7px;line-height:1.6}
.plan-card h3{font-size:19px;font-weight:600}
.plan-sub{color:var(--muted);font-size:13px;margin-top:6px;line-height:1.7;min-height:44px}
.plan-price{display:flex;align-items:baseline;margin:14px 0 4px}
.plan-price em{font-size:16px;font-style:normal;font-weight:600;color:var(--text)}
.plan-price b{font-size:34px;font-weight:700;letter-spacing:-.5px;color:var(--text);font-variant-numeric:tabular-nums}
.plan-price span{color:var(--muted);font-size:12.5px;margin-left:5px}
.plan-price s{color:var(--muted);font-size:12.5px;margin-left:8px}
.plan-quota{font-size:12.5px;color:var(--text-2);padding-bottom:14px;border-bottom:1px dashed var(--line)}
.plan-feats{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:9px;flex:1}
.plan-feats li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--text-2);line-height:1.6}
.plan-feats li svg{flex:none;color:var(--green-deep);margin-top:2px}
.plan-card .btn{margin-top:20px}

@media (max-width:1000px){
  .plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .plan-grid{grid-template-columns:minmax(0,1fr)}
  .plan-card{padding:22px 20px}
  .plan-sub{min-height:0}
}
@media (max-width:420px){
  .plan-grid{gap:12px}
}
/* ---------------- 短剧配音（drama.php）---------------- */
.dr-wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;align-items:start}
.dr-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.dr-step{background:#F7F9FD;border-radius:10px;padding:11px 14px;display:flex;flex-direction:column;gap:1px}
.dr-step b{font-size:12px;font-weight:700;color:var(--primary);letter-spacing:.5px;
  font-family:"DIN Alternate","Helvetica Neue",Arial,sans-serif}
.dr-step span{font-size:14px;font-weight:700;color:#1F2430}
.dr-step i{font-style:normal;font-size:12px;color:#98A2B8}
.dr-meta{display:flex;justify-content:space-between;gap:12px;margin-top:8px;font-size:12px;color:#7A8699;flex-wrap:wrap}
.dr-pre{background:#F7F9FD;border-radius:8px;padding:12px 14px;font-size:12.5px;line-height:1.95;color:#4A5468;
  white-space:pre-wrap;word-break:break-word;margin-top:10px;font-family:inherit}
.dr-roles{display:flex;flex-direction:column;gap:10px;max-height:520px;overflow:auto}
.dr-role{border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:#fff}
.dr-role-top{display:flex;align-items:center;gap:7px;margin-bottom:8px}
.dr-dot{width:9px;height:9px;border-radius:50%;flex:none;display:inline-block}
.dr-name{height:32px!important;flex:1;min-width:0;font-weight:600}
.dr-stat{font-size:11.5px;white-space:nowrap}
.dr-x{width:22px;height:22px;border-radius:6px;border:1px solid var(--line);background:#fff;color:#98A2B8;
  cursor:pointer;flex:none;line-height:1;padding:0;font-size:14px}
.dr-x:hover{border-color:#F5455C;color:#F5455C}
.dr-role-row{display:flex;align-items:center;gap:8px;margin-top:8px}
.dr-voice{height:34px!important;flex:1;min-width:0;text-align:left;cursor:pointer;font-size:13px;width:auto;
  background:#fff;border:1.5px solid var(--line);border-radius:8px;padding:0 11px;color:#22283A;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-voice:hover{border-color:var(--primary);color:var(--primary)}
.dr-prem{font-style:normal;font-size:10px;font-weight:600;padding:1px 5px;border-radius:5px;background:#FFF1E0;color:#E8820C}
.dr-kv{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:4px 0}
.dr-kv span{color:#98A2B8}
.dr-kv b{color:#4A5468;font-weight:600}
.dr-timeline{margin-top:14px;border-top:1px dashed #EDF0F6;padding-top:12px;max-height:280px;overflow:auto}
.dr-tl{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:5px 0;color:#4A5468}
.dr-tl-r{flex:none;width:58px;font-weight:600;color:#1F2430;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-tl-t{flex:none;width:94px;color:#98A2B8;font-family:"DIN Alternate","Helvetica Neue",Arial,sans-serif}
.dr-tl-x{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:920px){
  .dr-wrap{grid-template-columns:minmax(0,1fr)}
  .dr-steps{grid-template-columns:minmax(0,1fr)}
}