/* =============================================================
   Coco 设计系统 v2  ·  coco.css
   在 opao.min.css / layui.css 之后加载，负责整体视觉覆盖
   ============================================================= */

/* ---------- 1. 设计令牌 ---------- */
:root{
  --coco-brand-1:#6366f1;
  --coco-brand-2:#22d3ee;
  --coco-brand-3:#a855f7;
  --coco-grad:linear-gradient(135deg,#6366f1 0%,#8b5cf6 45%,#22d3ee 100%);
  --coco-grad-soft:linear-gradient(135deg,rgba(99,102,241,.12),rgba(34,211,238,.12));

  --coco-ink:#0f172a;
  --coco-ink-2:#334155;
  --coco-ink-3:#64748b;
  --coco-ink-4:#94a3b8;

  --coco-line:#e8ecf4;
  --coco-line-2:#eef2f8;

  --coco-bg:#f5f7fc;
  --coco-card:#ffffff;

  --coco-success:#10b981;
  --coco-info:#0ea5e9;
  --coco-warning:#f59e0b;
  --coco-danger:#f43f5e;
  --coco-purple:#8b5cf6;

  --coco-side-1:#131a2e;
  --coco-side-2:#0c1122;

  --coco-r-sm:8px;
  --coco-r:12px;
  --coco-r-lg:16px;
  --coco-r-xl:22px;

  --coco-sh-1:0 1px 2px rgba(16,24,40,.05);
  --coco-sh-2:0 1px 2px rgba(16,24,40,.05),0 12px 28px -14px rgba(16,24,40,.22);
  --coco-sh-3:0 24px 60px -24px rgba(79,70,229,.28);

  --coco-font:"Inter","HarmonyOS Sans SC","PingFang SC","Microsoft YaHei UI","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --coco-mono:"JetBrains Mono","SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;
}

/* ---------- 2. 基础排版 ---------- */
html,body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
body{
  font-family:var(--coco-font);
  color:var(--coco-ink-2);
  background:var(--coco-bg);
  font-size:14px;
  letter-spacing:.1px;
}
body.bg-default{ background:var(--coco-bg) !important; }

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
  font-family:var(--coco-font);
  color:var(--coco-ink);
  letter-spacing:-.2px;
}
a{ color:var(--coco-brand-1); transition:color .18s ease; }
a:hover{ color:#4f46e5; text-decoration:none; }
.text-muted{ color:var(--coco-ink-3) !important; }
.text-success{ color:var(--coco-success) !important; }
.text-primary{ color:var(--coco-brand-1) !important; }
.text-info{ color:var(--coco-info) !important; }
.text-warning{ color:var(--coco-warning) !important; }
.text-danger{ color:var(--coco-danger) !important; }
.text-white{ color:#fff !important; }
code,kbd,pre,.kami-cell{ font-family:var(--coco-mono); }

::-webkit-scrollbar{ width:9px; height:9px; }
::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:8px; border:2px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:#94a3b8; background-clip:content-box; }
::-webkit-scrollbar-track{ background:transparent; }

::selection{ background:rgba(99,102,241,.18); color:var(--coco-ink); }

/* ---------- 3. 卡片 ---------- */
.card{
  background:var(--coco-card);
  border:1px solid var(--coco-line);
  border-radius:var(--coco-r-lg);
  box-shadow:var(--coco-sh-1);
  transition:box-shadow .22s ease,transform .22s ease,border-color .22s ease;
  overflow:hidden;
}
.card:not(.card-stats):hover{ box-shadow:var(--coco-sh-2); }
.card-body{ padding:1.35rem 1.5rem; }
.card-header{
  background:transparent;
  border-bottom:1px solid var(--coco-line-2);
  padding:1.05rem 1.5rem;
}
.card-header:first-child{ border-radius:var(--coco-r-lg) var(--coco-r-lg) 0 0; }
.card-footer{ background:transparent; border-top:1px solid var(--coco-line-2); padding:1rem 1.5rem; }
.card-stats{ position:relative; overflow:hidden; }
.card-stats::after{
  content:""; position:absolute; inset:auto -30% -70% auto; width:190px; height:190px;
  border-radius:50%; background:var(--coco-grad-soft); filter:blur(4px); pointer-events:none;
}
.card-stats .card-body{ padding:1.25rem 1.4rem; position:relative; z-index:2; }

/* 卡片上的渐变标题条 */
.card-headline{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:700; color:var(--coco-ink); margin:0; }
.card-headline .dot{ width:8px; height:8px; border-radius:50%; background:var(--coco-grad); box-shadow:0 0 0 4px rgba(99,102,241,.12); }

/* ---------- 4. 统计卡 / 数字 ---------- */
.stat-num{
  font-size:30px; font-weight:800; line-height:1.05; letter-spacing:-1px;
  background:var(--coco-grad); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; display:inline-block;
}
.stat-label{ font-size:11.5px !important; font-weight:600 !important; letter-spacing:.6px; color:var(--coco-ink-4) !important; }
.icon-shape{ width:48px; height:48px; display:inline-flex; align-items:center; justify-content:center; font-size:18px; }
.icon-shape.rounded-circle{ border-radius:14px !important; }
.icon-shape.bg-gradient-success{ background:linear-gradient(135deg,#10b981,#22d3ee) !important; }
.icon-shape.bg-gradient-primary{ background:linear-gradient(135deg,#6366f1,#8b5cf6) !important; }
.icon-shape.bg-gradient-info{ background:linear-gradient(135deg,#0ea5e9,#22d3ee) !important; }
.icon-shape.bg-gradient-warning{ background:linear-gradient(135deg,#f59e0b,#fbbf24) !important; }
.icon-shape.bg-gradient-danger{ background:linear-gradient(135deg,#f43f5e,#fb7185) !important; }
.shadow{ box-shadow:0 8px 20px -8px rgba(15,23,42,.35) !important; }

/* ---------- 5. 按钮 ---------- */
.btn{
  font-family:var(--coco-font);
  font-weight:600;
  border-radius:10px;
  border:1px solid transparent;
  transition:all .18s ease;
  letter-spacing:.1px;
  box-shadow:none;
}
.btn:focus,.btn:active{ box-shadow:0 0 0 4px rgba(99,102,241,.16) !important; }
.btn-sm{ padding:.36rem .82rem; font-size:12.5px; border-radius:9px; }
.btn-lg{ padding:.72rem 1.5rem; font-size:14.5px; border-radius:12px; }

.btn-success,
.btn-primary{
  background:var(--coco-grad) !important;
  border:none !important;
  color:#fff !important;
  box-shadow:0 6px 16px -8px rgba(99,102,241,.75) !important;
}
.btn-success:hover,.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 22px -10px rgba(99,102,241,.85) !important;
  color:#fff !important;
}
.btn-neutral{
  background:#fff !important; color:var(--coco-ink-2) !important;
  border:1px solid var(--coco-line) !important;
  box-shadow:var(--coco-sh-1) !important;
}
.btn-neutral:hover{ background:#f8fafc !important; color:var(--coco-ink) !important; border-color:#d7dEEA !important; }
.btn-default{ background:#fff !important; border:1px solid var(--coco-line) !important; color:var(--coco-ink-2) !important; }
.btn-outline-success{ color:#4f46e5 !important; border:1px solid #c7d2fe !important; background:#eef2ff !important; }
.btn-outline-success:hover{ background:#e0e7ff !important; color:#4338ca !important; }
.btn-danger{ background:linear-gradient(135deg,#f43f5e,#fb7185) !important; border:none !important; color:#fff !important; }
.btn-warning{ background:linear-gradient(135deg,#f59e0b,#fbbf24) !important; border:none !important; color:#fff !important; }
.btn-info{ background:linear-gradient(135deg,#0ea5e9,#22d3ee) !important; border:none !important; color:#fff !important; }
.btn-white{ background:#fff !important; color:var(--coco-ink) !important; border:none !important; }
.btn-icon .btn-inner--icon i{ font-size:14px; }
.btn-group .btn{ border-radius:0 !important; }
.btn-group .btn:first-child{ border-radius:10px 0 0 10px !important; }
.btn-group .btn:last-child{ border-radius:0 10px 10px 0 !important; }

/* ---------- 6. 表单 ---------- */
.form-control{
  font-family:var(--coco-font);
  border-radius:10px;
  border:1px solid var(--coco-line);
  background:#fbfcfe;
  color:var(--coco-ink);
  font-size:13.5px;
  transition:all .18s ease;
  padding:.55rem .85rem;
}
.form-control-sm{ padding:.35rem .68rem; font-size:12.5px; border-radius:9px; }
.form-control:focus{
  background:#fff;
  border-color:var(--coco-brand-1);
  box-shadow:0 0 0 4px rgba(99,102,241,.13) !important;
  color:var(--coco-ink);
}
.form-control::placeholder{ color:#a8b3c5; }
.form-label{ font-size:12px; font-weight:600; color:var(--coco-ink-3); margin-bottom:.4rem; letter-spacing:.2px; }
.form-group{ margin-bottom:1.05rem; }
.input-group-text{
  background:#f1f5fb; border:1px solid var(--coco-line);
  color:var(--coco-ink-3); border-radius:10px;
}
.input-group-merge .form-control{ border-radius:10px; }
.input-group-merge .input-group-prepend .input-group-text{ border-right:none; border-radius:10px 0 0 10px; }
.input-group-merge .form-control:not(:first-child){ border-radius:0 10px 10px 0; }
.input-group-alternative{ box-shadow:none !important; border:none !important; }
.input-group-alternative .form-control{ background:#f4f7fc; border:1px solid transparent; }
.input-group-alternative .form-control:focus{ background:#fff; border-color:var(--coco-brand-1); }

.custom-control-label::before{ border-color:#cbd5e1; background:#fff; }
.custom-control-input:checked ~ .custom-control-label::before{ background:var(--coco-brand-1); border-color:var(--coco-brand-1); }
.custom-control-input:checked ~ .custom-control-label::after{ background-image:none; }
select.form-control{ appearance:none; background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2364748b'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .6rem center; background-size:20px; padding-right:2rem; }

/* ---------- 7. 徽章 ---------- */
.badge{
  font-family:var(--coco-font);
  font-weight:600; font-size:11.5px; letter-spacing:.2px;
  padding:.32em .68em; border-radius:8px;
}
.badge-pill{ border-radius:999px; padding:.32em .8em; }
.badge-success{ background:#e7f8f1 !important; color:#0f9d6d !important; }
.badge-primary{ background:#eef0ff !important; color:#4f46e5 !important; }
.badge-info{ background:#e6f6fd !important; color:#0284c7 !important; }
.badge-warning{ background:#fef4e2 !important; color:#c2740a !important; }
.badge-danger{ background:#feecef !important; color:#e11d48 !important; }
.badge-secondary{ background:#f1f5f9 !important; color:#64748b !important; }
.badge-soft-success{ background:#e7f8f1; color:#0f9d6d; }
.badge-soft-danger{ background:#feecef; color:#e11d48; }
.badge-soft-warning{ background:#fef4e2; color:#c2740a; }
.badge-soft-info{ background:#e6f6fd; color:#0284c7; }
.badge-soft-primary{ background:#eef0ff; color:#4f46e5; }

/* ---------- 8. 表格 ---------- */
.table{ color:var(--coco-ink-2); margin-bottom:0; }
.table thead th{
  border:none; border-bottom:1px solid var(--coco-line);
  font-size:11.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
  color:var(--coco-ink-4); background:#fafbfe; padding:.85rem 1rem;
  white-space:nowrap;
}
.table tbody td{ border:none; border-bottom:1px solid var(--coco-line-2); padding:.85rem 1rem; vertical-align:middle; }
.table tbody tr{ transition:background .15s ease; }
.table tbody tr:hover{ background:#f8fafd; }
.table tbody tr:last-child td{ border-bottom:none; }
.table-sm thead th{ padding:.65rem .8rem; }
.table-sm tbody td{ padding:.6rem .8rem; font-size:13px; }
.kami-cell{ letter-spacing:.6px; font-size:12.5px; color:#4338ca; background:#f5f3ff; padding:3px 9px; border-radius:7px; display:inline-block; }
.table-responsive{ border-radius:var(--coco-r); }

/* ---------- 9. 后台骨架 ---------- */
body.coco-app{ background:var(--coco-bg); }

.sidenav{
  width:250px !important;
  background:linear-gradient(180deg,var(--coco-side-1) 0%,var(--coco-side-2) 100%) !important;
  border-right:none !important;
  box-shadow:4px 0 28px -18px rgba(2,6,23,.8);
}
.sidenav::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(600px 200px at 10% 0%,rgba(99,102,241,.28),transparent 70%);
}
.sidenav .scrollbar-inner{ position:relative; z-index:2; display:flex; flex-direction:column; height:100vh; }
.sidenav-header{ padding:1.25rem 1.25rem 1rem; }
.sidenav-header .navbar-brand{ display:flex; align-items:center; gap:10px; margin:0; }
.coco-logo{
  width:34px; height:34px; border-radius:10px;
  background:var(--coco-grad); display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; font-size:15px; letter-spacing:-.5px;
  box-shadow:0 8px 18px -8px rgba(99,102,241,.9);
  flex:0 0 34px;
}
.coco-logo-text{ display:flex; flex-direction:column; line-height:1.15; }
.coco-logo-text b{ color:#fff; font-size:15px; font-weight:700; letter-spacing:.2px; }
.coco-logo-text small{ color:rgba(255,255,255,.4); font-size:10.5px; letter-spacing:1.4px; text-transform:uppercase; }

.sidenav .navbar-inner{ padding:0 .75rem; flex:1; overflow-y:auto; }
.sidenav .navbar-nav{ padding-bottom:.5rem; }
.sidenav .nav-item{ margin:2px 0; }
.sidenav .nav-link{
  display:flex; align-items:center; gap:11px;
  padding:.62rem .8rem; border-radius:11px;
  color:rgba(226,232,240,.62) !important;
  font-size:13.5px; font-weight:500;
  transition:all .18s ease; position:relative;
  white-space:nowrap;
}
.sidenav .nav-link i{ font-size:15px; width:18px; text-align:center; opacity:.9; transition:transform .18s ease; }
.sidenav .nav-link:hover{ background:rgba(148,163,184,.1); color:#fff !important; }
.sidenav .nav-link:hover i{ transform:translateX(1px); }
.sidenav .nav-link.active{
  background:linear-gradient(135deg,rgba(99,102,241,.28),rgba(34,211,238,.16)) !important;
  color:#fff !important;
  box-shadow:inset 0 0 0 1px rgba(129,140,248,.28);
}
.sidenav .nav-link.active::before{
  content:""; position:absolute; left:-.75rem; top:50%; transform:translateY(-50%);
  width:3px; height:18px; border-radius:0 4px 4px 0; background:var(--coco-grad);
  box-shadow:0 0 12px rgba(99,102,241,.9);
}
.sidenav .nav-link-text{ font-size:13.5px; }
.sidenav hr{ border-color:rgba(148,163,184,.14); margin:.7rem .5rem; }
.sidenav .nav-section-title{
  padding:.85rem .8rem .35rem; font-size:10.5px; letter-spacing:1.5px;
  text-transform:uppercase; color:rgba(148,163,184,.5); font-weight:700;
}

.coco-app .main-content{ margin-left:250px !important; background:transparent; }
body:not(.coco-app) .main-content{ margin-left:0 !important; margin-right:0 !important; }

/* 顶部条 */
.navbar-top{
  background:rgba(255,255,255,.86) !important;
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--coco-line) !important;
  padding:.55rem 1.25rem;
  position:sticky; top:0; z-index:1030;
}
.navbar-top .nav-link{ color:var(--coco-ink-2) !important; }
.avatar{ box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(99,102,241,.25); background:var(--coco-grad) !important; color:#fff !important; }

/* 页头横幅 */
.header.pb-6{ padding-bottom:4.5rem !important; }
.header.coco-header{
  background:var(--coco-grad) !important;
  position:relative; overflow:hidden;
}
.header.coco-header h6,.header.coco-header .h2,.header.coco-header .text-white{ color:#fff !important; }
.header.coco-header::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(900px 300px at 85% -20%,rgba(255,255,255,.30),transparent 60%),
    radial-gradient(600px 240px at 0% 120%,rgba(255,255,255,.16),transparent 60%);
  pointer-events:none;
}
.header.coco-header::after{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);
  background-size:36px 36px; mask-image:radial-gradient(700px 220px at 30% 0%,#000,transparent 75%);
  -webkit-mask-image:radial-gradient(700px 220px at 30% 0%,#000,transparent 75%);
  pointer-events:none; opacity:.7;
}
.header.coco-header .header-body{ position:relative; z-index:2; }
.header.coco-header h6.h2{ font-weight:700; letter-spacing:-.3px; }
.mt--6{ margin-top:-4.2rem !important; }

/* 页脚 */
.footer{
  border-top:1px solid var(--coco-line);
  background:transparent;
  margin-top:2.5rem; padding:1.15rem 1.5rem 1.5rem;
}
.footer .copyright{ font-size:12.5px; color:var(--coco-ink-4); }
.footer .nav-link{ font-size:12.5px; color:var(--coco-ink-4) !important; }
.footer .nav-link:hover{ color:var(--coco-brand-1) !important; }

/* ---------- 10. 详情/小工具 ---------- */
.page-title{ font-size:20px; font-weight:700; letter-spacing:-.4px; color:var(--coco-ink); margin:0; }
.page-sub{ font-size:12.5px; color:var(--coco-ink-4); margin:3px 0 0; }
.heading-small{ font-size:12px; text-transform:uppercase; letter-spacing:.8px; color:var(--coco-ink-4); font-weight:700; }

.alert{ border:none; border-radius:var(--coco-r); font-size:13px; padding:.85rem 1.1rem; }
.alert-success{ background:#e7f8f1; color:#0f9d6d; }
.alert-info{ background:#e6f6fd; color:#0284c7; }
.alert-warning{ background:#fef4e2; color:#b45309; }
.alert-danger{ background:#feecef; color:#e11d48; }
.alert-text{ color:inherit; }

.dropdown-menu{
  border:1px solid var(--coco-line); border-radius:12px;
  box-shadow:0 18px 40px -18px rgba(15,23,42,.35);
  padding:.4rem; font-size:13px;
}
.dropdown-item{ border-radius:8px; padding:.5rem .7rem; font-size:13px; color:var(--coco-ink-2); }
.dropdown-item:hover{ background:#f4f6fc; color:var(--coco-ink); }
.dropdown-item i{ margin-right:.45rem; opacity:.7; }

.progress{ height:6px; border-radius:99px; background:#eef2f8; overflow:hidden; }
.progress-bar{ background:var(--coco-grad); border-radius:99px; }
.progress-xs{ height:5px; }
.progress-sm{ height:8px; }

.separator{ background:transparent; }
.separator-skew{ z-index:1; }

/* 开关（api.php 的 custom-toggle） */
.custom-toggle{
  display:inline-block; width:42px; height:23px; border-radius:99px;
  background:#dfe5ef; position:relative; cursor:pointer; transition:all .2s ease;
  vertical-align:middle; border:none; padding:0; flex:0 0 42px;
}
.custom-toggle input{ position:absolute; opacity:0; width:0; height:0; margin:0; }
.custom-toggle::after{
  content:""; position:absolute; top:3px; left:3px; width:17px; height:17px;
  border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(15,23,42,.28);
  transition:all .2s cubic-bezier(.4,0,.2,1);
}
.custom-toggle.on,
.custom-toggle:has(input:checked){ background:var(--coco-grad); }
.custom-toggle.on::after,
.custom-toggle:has(input:checked)::after{ left:22px; }
.custom-toggle-slider{ display:none; }

/* ---------- 11. 首页 ---------- */
.coco-nav{
  background:rgba(255,255,255,.86) !important;
  backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid rgba(232,236,244,.9);
  padding:.72rem 0;
  box-shadow:0 1px 0 rgba(15,23,42,.03);
}
.coco-nav.navbar-transparent{ background:rgba(255,255,255,.9) !important; }
.coco-nav .navbar-brand{ display:flex; align-items:center; gap:9px; font-weight:700; font-size:15.5px; color:var(--coco-ink) !important; }
.coco-nav .nav-link{
  color:var(--coco-ink-3) !important; font-size:13.5px; font-weight:500;
  padding:.45rem .78rem !important; border-radius:9px; transition:all .18s ease;
}
.coco-nav .nav-link:hover{ color:var(--coco-ink) !important; background:#f1f5fb; }
.coco-nav .nav-link.active{ color:#4f46e5 !important; background:#eef2ff; }

.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg,#0b1120 0%,#1e1b4b 42%,#0f172a 100%);
  color:#fff; padding:7.5rem 0 9rem;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(760px 380px at 78% 8%,rgba(99,102,241,.55),transparent 62%),
    radial-gradient(620px 300px at 12% 82%,rgba(34,211,238,.32),transparent 65%),
    radial-gradient(480px 260px at 52% 44%,rgba(168,85,247,.28),transparent 68%);
  pointer-events:none;
}
.hero::after{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(900px 520px at 50% 20%,#000 20%,transparent 78%);
  -webkit-mask-image:radial-gradient(900px 520px at 50% 20%,#000 20%,transparent 78%);
  pointer-events:none;
}
.hero .container{ position:relative; z-index:2; }
.hero-badge{
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:600; letter-spacing:.3px;
  padding:.4rem .85rem; border-radius:99px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.86); margin-bottom:1.35rem;
  backdrop-filter:blur(6px);
}
.hero-badge .dot{ width:6px; height:6px; border-radius:50%; background:#34d399; box-shadow:0 0 10px #34d399; animation:pulse 2.2s infinite; }
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.35} }
.hero h1.hero-title{
  font-size:clamp(30px,3.6vw,50px); font-weight:800; line-height:1.16;
  letter-spacing:-1.4px; color:#fff; margin:0 0 1.05rem;
}
.hero .grad-text{
  background:linear-gradient(120deg,#a5b4fc,#67e8f9 55%,#c4b5fd);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero p.hero-desc{
  font-size:14.5px; line-height:1.85; color:rgba(226,232,240,.72);
  max-width:640px; margin-bottom:1.9rem;
}
.hero .btn-hero-primary{
  background:#fff; color:#1e1b4b; font-weight:700; border:none;
  padding:.78rem 1.6rem; border-radius:12px; font-size:14px;
  box-shadow:0 16px 36px -16px rgba(255,255,255,.6);
}
.hero .btn-hero-primary:hover{ transform:translateY(-2px); color:#1e1b4b; box-shadow:0 22px 44px -18px rgba(255,255,255,.7); }
.hero .btn-hero-ghost{
  background:rgba(255,255,255,.07); color:#fff; border:1px solid rgba(255,255,255,.22);
  padding:.78rem 1.6rem; border-radius:12px; font-size:14px; font-weight:600;
  backdrop-filter:blur(6px);
}
.hero .btn-hero-ghost:hover{ background:rgba(255,255,255,.14); color:#fff; transform:translateY(-2px); }
.hero-stats{ display:flex; gap:2.6rem; margin-top:2.6rem; flex-wrap:wrap; }
.hero-stats .item b{ display:block; font-size:25px; font-weight:800; color:#fff; letter-spacing:-.6px; line-height:1.1; }
.hero-stats .item span{ font-size:11.5px; letter-spacing:1px; text-transform:uppercase; color:rgba(148,163,184,.85); }

.hero-cards{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.hero-card{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.13);
  border-radius:16px; padding:1.15rem 1.15rem 1.05rem;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  transition:transform .25s ease,background .25s ease,border-color .25s ease;
  position:relative; overflow:hidden;
}
.hero-card:hover{ transform:translateY(-4px); background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.24); }
.hero-card .ic{
  width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  font-size:16px; color:#fff; margin-bottom:.85rem;
  background:var(--coco-grad); box-shadow:0 10px 22px -12px rgba(99,102,241,.9);
}
.hero-card h5{ color:#fff; font-size:13.5px; font-weight:700; margin:0 0 .3rem; }
.hero-card p{ color:rgba(203,213,225,.72); font-size:11.5px; line-height:1.6; margin:0; }

.section-pad{ padding:5.5rem 0; }
.section-head{ text-align:center; max-width:720px; margin:0 auto 3.2rem; }
.section-head .eyebrow{
  display:inline-block; font-size:11.5px; font-weight:700; letter-spacing:2px;
  text-transform:uppercase; color:#6366f1; background:#eef2ff;
  padding:.32rem .8rem; border-radius:99px; margin-bottom:1rem;
}
.section-head h2{ font-size:clamp(23px,2.4vw,32px); font-weight:800; letter-spacing:-.9px; color:var(--coco-ink); margin:0 0 .85rem; }
.section-head p{ font-size:14px; color:var(--coco-ink-3); line-height:1.8; margin:0; }

.feature-section{ background:#0b1120 !important; position:relative; overflow:hidden; }
.feature-section::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(700px 340px at 82% 0%,rgba(99,102,241,.22),transparent 62%),
             radial-gradient(560px 280px at 8% 100%,rgba(34,211,238,.14),transparent 62%);
  pointer-events:none;
}
.feature-section .section-head h2{ color:#fff; }
.feature-section .section-head p{ color:rgba(203,213,225,.66); }
.feature-section .section-head .eyebrow{ background:rgba(255,255,255,.08); color:#a5b4fc; }
.feature-section .container{ position:relative; z-index:2; }
.feature-card{
  background:rgba(255,255,255,.045) !important;
  border:1px solid rgba(255,255,255,.1) !important;
  border-radius:18px !important; padding:1.75rem 1.5rem !important;
  height:100%; transition:all .26s ease;
  position:relative; overflow:hidden;
}
.feature-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(160deg,rgba(255,255,255,.08),transparent 55%);
  opacity:0; transition:opacity .26s ease; pointer-events:none;
}
.feature-card:hover{ transform:translateY(-6px); border-color:rgba(129,140,248,.45) !important; box-shadow:0 28px 50px -30px rgba(99,102,241,.9); }
.feature-card:hover::after{ opacity:1; }
.feature-card .icon-wrap{
  width:46px; height:46px; border-radius:13px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.05rem; font-size:18px; color:#fff;
  box-shadow:0 12px 24px -12px currentColor;
}
.feature-card h5{ color:#fff; font-size:15px; font-weight:700; margin:0 0 .55rem; letter-spacing:-.1px; }
.feature-card p{ color:rgba(203,213,225,.62); font-size:12.5px; line-height:1.75; margin:0 0 1rem; }
.feature-tag{
  display:inline-block; font-size:11px; padding:.24rem .6rem;
  border-radius:7px; margin:0 .22rem .3rem 0; font-weight:600;
  background:rgba(255,255,255,.08); color:rgba(226,232,240,.8);
  border:1px solid rgba(255,255,255,.08);
}

.flow-section{ background:#fff !important; }
.flow-wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; position:relative; }
.flow-step{ position:relative; text-align:center; padding:1.6rem 1rem; }
.flow-step .step-number{
  width:42px; height:42px; border-radius:13px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:800; color:#fff; margin-bottom:1rem;
  background:var(--coco-grad); box-shadow:0 12px 26px -12px rgba(99,102,241,.9);
}
.flow-step h6{ font-size:14px; font-weight:700; color:var(--coco-ink); margin:0 0 .4rem; }
.flow-step p{ font-size:12px; color:var(--coco-ink-3); margin:0; line-height:1.7; }
.flow-step:not(:last-child)::after{
  content:""; position:absolute; top:2.2rem; right:-.55rem; width:1.1rem; height:2px;
  background:linear-gradient(90deg,#c7d2fe,#a5f3fc); border-radius:2px;
}

.sdk-section{ background:var(--coco-bg) !important; }
.sdk-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; max-width:920px; margin:0 auto; }
.sdk-item{
  background:#fff; border:1px solid var(--coco-line); border-radius:12px;
  padding:.72rem 1rem; display:flex; align-items:center; gap:10px;
  box-shadow:var(--coco-sh-1); transition:all .2s ease;
  text-decoration:none; color:var(--coco-ink-2); min-width:auto;
}
.sdk-item:hover{ transform:translateY(-3px); box-shadow:var(--coco-sh-2); color:var(--coco-ink); text-decoration:none; border-color:#dbe3f0; }
.sdk-item img{ width:18px; height:18px; }
.sdk-dot{ width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.sdk-item strong{ font-size:13px; font-weight:600; display:block; line-height:1.2; }
.sdk-item small{ display:none; }

.stats-strip{ background:#fff; border-top:1px solid var(--coco-line); border-bottom:1px solid var(--coco-line); }
.stats-strip .wrap{ display:grid; grid-template-columns:repeat(3,1fr); }
.highlight-number{
  font-size:44px; font-weight:800; line-height:1; letter-spacing:-1.6px;
  background:var(--coco-grad); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.highlight-label{ font-size:13px; color:var(--coco-ink-3); margin-top:.45rem; font-weight:500; }

.cta-band{
  background:var(--coco-grad); border-radius:24px; padding:3.2rem 2.6rem;
  color:#fff; position:relative; overflow:hidden; text-align:center;
  box-shadow:var(--coco-sh-3);
}
.cta-band::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(600px 240px at 20% 0%,rgba(255,255,255,.3),transparent 60%),
             radial-gradient(500px 220px at 90% 100%,rgba(255,255,255,.22),transparent 60%);
}
.cta-band>*{ position:relative; z-index:2; }
.cta-band h3{ color:#fff; font-size:26px; font-weight:800; letter-spacing:-.8px; margin:0 0 .7rem; }
.cta-band p{ color:rgba(255,255,255,.85); font-size:13.5px; margin:0 0 1.7rem; }

.blur--hover{ position:relative; }
.blur--hover .blur-item{ transition:transform .25s ease,opacity .25s ease,filter .25s ease; }
.blur--hover .blur-hidden{ opacity:0; transform:translateY(12px); transition:all .25s ease; }
.blur--hover:hover .blur-item{ opacity:.35; filter:blur(2px); }
.blur--hover:hover .blur-hidden{ opacity:1; transform:translateY(0); filter:none; }

/* ---------- 12. 登录 / 注册 / 找回密码 ---------- */
.coco-auth{ min-height:calc(100vh - 64px); display:flex; flex-direction:column; align-items:center; padding:2.2rem 1rem 3.5rem; }
.coco-auth > .auth-card, .coco-auth > .text-center{ width:100%; margin-top:auto; margin-bottom:auto; }
.auth-card{
  max-width:430px; margin:0 auto; border-radius:20px;
  border:1px solid var(--coco-line); box-shadow:var(--coco-sh-2); overflow:hidden;
  background:#fff;
}
.auth-card .auth-head{
  padding:1.9rem 1.9rem 1.35rem; text-align:center;
  background:linear-gradient(180deg,#f8faff,#fff);
  border-bottom:1px solid var(--coco-line-2);
}
.auth-card .auth-head .coco-logo{ width:44px; height:44px; border-radius:13px; font-size:18px; margin:0 auto .85rem; }
.auth-card .auth-head h1,.auth-card .auth-head h3{ font-size:19px; font-weight:800; margin:0 0 .3rem; letter-spacing:-.4px; color:var(--coco-ink); }
.auth-card .auth-head p{ font-size:12.5px; color:var(--coco-ink-4); margin:0; }
.auth-card .auth-body{ padding:1.7rem 1.9rem 1.9rem; }
.auth-card .form-group{ margin-bottom:1rem; }
.auth-card .btn-wechat{
  display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600;
  padding:.42rem .9rem; border-radius:9px; border:1px solid #d7f0e0; background:#f1fbf6; color:#0f9d6d;
}
.auth-card .btn-wechat:hover{ background:#e4f8ee; color:#0b8a5f; }
.auth-card .auth-tip{ font-size:12px; line-height:1.7; color:var(--coco-ink-4); background:#f7f9fd; border:1px solid var(--coco-line-2); border-radius:9px; padding:.55rem .75rem; }
.auth-card .auth-tip a{ font-weight:600; }
.auth-card .auth-body .input-group-text{ background:#f6f8fc; border:1px solid var(--coco-line); border-right:0; color:var(--coco-ink-4); }
.auth-card .auth-body .input-group .form-control{ border:1px solid var(--coco-line); }
.auth-card .auth-body .input-group .form-control:focus{ border-color:#a5b4fc; }
.auth-card .auth-body .input-group-append .btn{ border:1px solid var(--coco-line); background:#fff; color:var(--coco-ink-2); font-size:13px; font-weight:600; border-radius:0 10px 10px 0; }
.auth-card .auth-body .input-group-append .btn:hover{ background:#f6f8fc; }
.auth-card .custom-control-label{ font-size:12.5px; }
.auth-back{ font-size:12.5px; color:var(--coco-ink-4); }
.auth-back:hover{ color:#6366f1; }
.auth-foot .dot{ margin:0 .5rem; color:var(--coco-line); }
.auth-foot{ text-align:center; margin-top:1.5rem; font-size:13px; color:var(--coco-ink-4); }
.auth-foot a{ font-weight:600; }

/* ---------- 13.5 内页通用头（SDK下载 / 文档 / 协议 / 异常页） ---------- */
.page-hero{
  padding:3.2rem 0 5.4rem; text-align:center; position:relative; overflow:hidden;
  background:linear-gradient(150deg,#0b1120 0%,#1e1b4b 52%,#0f172a 100%);
}
.page-hero::before{
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(circle at 50% 30%,#000,transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 72%);
}
.page-hero::after{
  content:''; position:absolute; width:520px; height:520px; border-radius:50%;
  left:50%; top:-300px; transform:translateX(-50%);
  background:radial-gradient(circle,rgba(139,92,246,.42),transparent 68%); filter:blur(30px);
}
.page-hero .container{ position:relative; z-index:2; }
.page-hero .eyebrow{
  display:inline-block; font-size:11px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase;
  color:#a5b4fc; background:rgba(99,102,241,.14); border:1px solid rgba(165,180,252,.24);
  padding:.28rem .78rem; border-radius:99px; margin-bottom:1rem;
}
.page-hero h1{ font-size:clamp(24px,2.6vw,34px); font-weight:800; color:#fff; margin:0 0 .55rem; letter-spacing:-.6px; }
.page-hero p{ font-size:13.5px; color:rgba(203,213,225,.72); margin:0; }

/* ---------- 13.6 SDK 下载页覆盖 ---------- */
.tip-banner{
  background:#fff; border:1px solid var(--coco-line); border-radius:14px; padding:.85rem 1.2rem;
  margin-bottom:1.2rem; display:flex; align-items:center; gap:.9rem;
  font-size:12.8px; color:var(--coco-ink-3); line-height:1.6; box-shadow:var(--coco-sh-1);
}
.tip-banner strong{ color:var(--coco-ink); }
.tip-banner .btn-tip{
  background-image:var(--coco-grad); color:#fff; padding:.42rem 1rem; border-radius:9px;
  font-size:12.5px; font-weight:600; text-decoration:none; white-space:nowrap; flex-shrink:0; margin-left:auto;
}
.tip-banner .btn-tip:hover{ color:#fff; opacity:.9; }
.sdk-dl-card{
  border:1px solid var(--coco-line) !important; border-radius:14px !important; background:#fff;
  padding:1rem 1.1rem !important; transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.sdk-dl-card:hover{ transform:translateY(-3px) !important; box-shadow:var(--coco-sh-2) !important; border-color:#c7d2fe !important; }
.sdk-dl-card.selected{ border-color:#a5b4fc !important; box-shadow:0 0 0 3px rgba(99,102,241,.13) !important; background:linear-gradient(135deg,rgba(99,102,241,.04),rgba(139,92,246,.04)) !important; }
.sdk-dl-name{ font-size:14px !important; font-weight:700 !important; color:var(--coco-ink) !important; }
.sdk-dl-desc{ font-size:11.5px !important; color:var(--coco-ink-4) !important; }
.btn-download{
  background-image:var(--coco-grad) !important; border:none; color:#fff;
  padding:.72rem 2rem !important; border-radius:11px !important; font-size:14.5px !important; font-weight:700;
  display:inline-flex; align-items:center; gap:.5rem; box-shadow:0 12px 24px -14px rgba(99,102,241,.95);
}
.btn-download:hover{ color:#fff; transform:translateY(-2px); }
@media (max-width:768px){ .tip-banner{ flex-direction:column; text-align:center; } .tip-banner .btn-tip{ margin-left:0; margin-top:.4rem; } }

/* ---------- 13.6 代理后台 ---------- */
.coco-nav{
  background:rgba(255,255,255,.9) !important; border-bottom:1px solid var(--coco-line);
  backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  padding:.55rem 0;
}
.coco-nav .navbar-brand{ display:flex; align-items:center; gap:.6rem; margin-right:1.5rem; }
.coco-nav .nav-link{ font-size:13.5px; font-weight:500; color:var(--coco-ink-2) !important; padding:.45rem .85rem !important; border-radius:9px; }
.coco-nav .nav-link:hover{ background:#f4f7fc; color:var(--coco-ink) !important; }
.coco-nav .nav-link.active{ background:#eef0ff; color:#4f46e5 !important; font-weight:700; }
.coco-subhead{
  background:linear-gradient(150deg,#0b1120 0%,#1e1b4b 55%,#0f172a 100%);
  padding:2.2rem 0 4.2rem; position:relative; overflow:hidden;
}
.coco-subhead::after{
  content:''; position:absolute; width:420px; height:420px; border-radius:50%;
  right:-80px; top:-220px; background:radial-gradient(circle,rgba(34,211,238,.32),transparent 68%); filter:blur(28px);
}
.coco-subhead .container{ position:relative; z-index:2; }
.coco-subhead .eyebrow{ font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; color:rgba(165,180,252,.8); font-weight:700; margin:0 0 .4rem; }
.coco-subhead h1{ font-size:clamp(21px,2.2vw,28px); font-weight:800; color:#fff; margin:0; letter-spacing:-.5px; }
.agent-wrap{ margin-top:-2.8rem; position:relative; z-index:5; }
.agent-wrap .panel{
  background:#fff; border:1px solid var(--coco-line); border-radius:var(--coco-r-lg);
  box-shadow:var(--coco-sh-1); overflow:hidden;
}
.agent-wrap .panel-hd{
  padding:1rem 1.35rem; border-bottom:1px solid var(--coco-line-2);
  font-weight:700; font-size:14.5px; color:var(--coco-ink);
}
.agent-wrap table.agent-table{ width:100%; font-size:13px; margin:0; }
.agent-wrap table.agent-table th{
  background:#f8fafd; color:var(--coco-ink-4); font-weight:600; padding:.68rem 1.1rem;
  text-align:left; font-size:11.5px; letter-spacing:.4px; text-transform:uppercase;
  border-bottom:1px solid var(--coco-line-2);
}
.agent-wrap table.agent-table td{ padding:.72rem 1.1rem; border-top:1px solid var(--coco-line-2); color:var(--coco-ink-2); }
.agent-wrap table.agent-table tr:hover td{ background:#fafbff; }
.agent-wrap .badge-ok{ background:#e7f8f1; color:#0f9d6d; padding:2px 9px; border-radius:20px; font-size:11.5px; font-weight:600; }
.agent-wrap .badge-off{ background:#feecef; color:#e11d48; padding:2px 9px; border-radius:20px; font-size:11.5px; font-weight:600; }
.agent-wrap .empty{ padding:2.6rem 1.2rem; text-align:center; color:var(--coco-ink-4); font-size:13px; }
.agent-wrap .stat-card{
  background:#fff; border:1px solid var(--coco-line); border-radius:var(--coco-r-lg);
  padding:1.15rem 1.3rem; box-shadow:var(--coco-sh-1); position:relative; overflow:hidden;
}
.agent-wrap .stat-card::after{
  content:''; position:absolute; right:-24px; top:-24px; width:90px; height:90px; border-radius:50%;
  background:radial-gradient(circle,rgba(99,102,241,.12),transparent 70%);
}
.agent-wrap .stat-card .num{ font-size:26px; font-weight:800; color:var(--coco-ink); line-height:1.15; letter-spacing:-.6px; }
.agent-wrap .stat-card .lbl{ font-size:12px; color:var(--coco-ink-4); margin-top:.3rem; }
.agent-wrap .btn-xs{
  font-size:12px; padding:.2rem .6rem; border-radius:7px; border:1px solid var(--coco-line);
  background:#fff; color:var(--coco-ink-2); cursor:pointer; font-weight:600;
}
.agent-wrap .btn-xs:hover{ background:#f6f9fc; }

/* ---------- 13. 文档站 ---------- */.doc-side{ background:#fff; border:1px solid var(--coco-line); border-radius:var(--coco-r-lg); padding:.6rem; position:sticky; top:80px; }
.doc-side .nav-link{ border-radius:9px; padding:.48rem .7rem; font-size:13px; color:var(--coco-ink-2) !important; }
.doc-side .nav-link:hover{ background:#f4f7fc; }
.doc-side .nav-link.active{ background:var(--coco-grad) !important; color:#fff !important; box-shadow:0 8px 18px -10px rgba(99,102,241,.9); }
.doc-body{ background:#fff; border:1px solid var(--coco-line); border-radius:var(--coco-r-lg); padding:2rem 2.2rem; }
.doc-lang{ display:inline-block; font-size:11px; font-weight:700; color:#4f46e5; background:#eef2ff; border:1px solid #e0e7ff; border-radius:6px; padding:1px 7px; margin:0 5px 4px 0; }

/* ---------- 14. 杂项 / 响应式 ---------- */
.shadow-sm{ box-shadow:var(--coco-sh-1) !important; }
.rounded-xl{ border-radius:var(--coco-r-lg) !important; }
.bg-white{ background:#fff !important; }
.bg-default{ background:var(--coco-bg) !important; }
.bg-gradient-success{ background-image:var(--coco-grad) !important; }
.bg-gradient-primary{ background-image:linear-gradient(135deg,#6366f1,#8b5cf6) !important; }
.bg-gradient-info{ background-image:linear-gradient(135deg,#0ea5e9,#22d3ee) !important; }
.bg-gradient-warning{ background-image:linear-gradient(135deg,#f59e0b,#fbbf24) !important; }
.bg-gradient-danger{ background-image:linear-gradient(135deg,#f43f5e,#fb7185) !important; }
.bg-success{ background-color:#6366f1 !important; }

.fade-up{ animation:fadeUp .5s cubic-bezier(.4,0,.2,1) both; }
@keyframes fadeUp{ from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }

@media (max-width:991.98px){
  .coco-app .main-content{ margin-left:0 !important; }
  .hero{ padding:5.5rem 0 6.5rem; }
  .hero-cards{ grid-template-columns:1fr 1fr; margin-top:2.4rem; }
  .flow-wrap{ grid-template-columns:repeat(2,1fr); gap:1.2rem; }
  .flow-step:not(:last-child)::after{ display:none; }
}
@media (max-width:767px){
  .section-pad{ padding:3.4rem 0; }
  .hero-stats{ gap:1.6rem; }
  .stats-strip .wrap{ grid-template-columns:1fr; gap:1.6rem; }
  .hero-cards{ grid-template-columns:1fr; }
  .doc-body{ padding:1.3rem 1.1rem; }
  .card-body{ padding:1.1rem 1.05rem; }
}

/* ---------- 15. 前端通用收尾 ---------- */
body.coco-site .navbar-horizontal .navbar-nav .nav-link{
  font-size:13.5px; font-weight:500; color:var(--coco-ink-2); padding:.45rem .85rem;
  border-radius:9px; margin:0 .1rem;
}
body.coco-site .navbar-horizontal .navbar-nav .nav-link:hover{ background:#f4f7fc; color:var(--coco-ink); }
body.coco-site .navbar-horizontal .navbar-nav .nav-link.active{ background:#eef0ff; color:#4f46e5; font-weight:700; }
body.coco-site .navbar-horizontal .navbar-nav .nav-link-inner--text{ color:inherit; font-size:inherit; letter-spacing:0; text-transform:none; }
body.coco-site .navbar-toggler{ border:none; padding:.35rem .5rem; }
body.coco-site .navbar-toggler-icon{
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%2364748b' stroke-width='2' stroke-linecap='round' d='M4 8h22M4 15h22M4 22h22'/%3E%3C/svg%3E");
  width:22px; height:22px;
}
body.coco-site .btn-sm{ font-size:13px; padding:.5rem .95rem; border-radius:9px; }
body.coco-site .page-hero{ padding:3.4rem 0 5.2rem; }
body.coco-site .page-hero .sub{ font-size:13.5px; color:rgba(203,213,225,.72); margin:.5rem 0 0; }
body.coco-site .card{ border:1px solid var(--coco-line); border-radius:var(--coco-r-lg); box-shadow:var(--coco-sh-1); }
body.coco-site .card-body{ padding:1.6rem 1.8rem; }
body.coco-site .text-muted{ color:var(--coco-ink-3) !important; }
body.coco-site .form-label{ font-size:12.5px; font-weight:600; color:var(--coco-ink-2); margin-bottom:.4rem; }

/* ---------- 16. layer 弹层统一皮肤 ---------- */
.layui-layer{
  border-radius:14px !important;
  box-shadow:0 20px 50px -12px rgba(15,23,42,.28), 0 0 0 1px rgba(15,23,42,.03) !important;
  border:none !important;
  overflow:hidden;
}
.layui-layer-title{
  height:46px !important; line-height:46px !important;
  padding:0 58px 0 20px !important;
  font-size:14px !important; font-weight:700 !important;
  color:var(--coco-ink) !important;
  background:#fff !important;
  border-bottom:1px solid var(--coco-line) !important;
  border-radius:14px 14px 0 0 !important;
}
.layui-layer-setwin{ top:16px !important; right:16px !important; }
.layui-layer-setwin .layui-layer-close{
  width:22px; height:22px;
  background-color:#f1f5f9 !important;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%2364748b' stroke-width='1.8' stroke-linecap='round' d='M4.5 4.5l7 7M11.5 4.5l-7 7'/%3E%3C/svg%3E") !important;
  background-position:50% 50% !important;
  background-size:15px 15px !important;
  background-repeat:no-repeat !important;
  border-radius:7px;
  transition:.15s;
}
.layui-layer-setwin .layui-layer-close:hover{ background-color:#e2e8f0 !important; }
.layui-layer-setwin .layui-layer-close2,
.layui-layer-setwin .layui-layer-close1{ text-indent:-9999px; overflow:hidden; }
.layui-layer-content{ color:var(--coco-ink-2); }
.layui-layer-page .layui-layer-content{ overflow:visible; }
.layui-layer-dialog .layui-layer-content{
  padding:20px 24px !important;
  font-size:13.5px !important;
  line-height:1.72 !important;
  color:var(--coco-ink-2) !important;
}
.layui-layer-dialog .layui-layer-padding{ padding-left:60px !important; }
.layui-layer-btn{
  padding:0 18px 16px !important;
  border-top:none !important;
  text-align:right;
}
.layui-layer-btn a{
  height:34px !important; line-height:34px !important;
  padding:0 18px !important;
  font-size:13px !important; font-weight:600 !important;
  border-radius:9px !important;
  border:none !important;
  margin-left:8px !important;
  transition:.16s;
}
.layui-layer-btn .layui-layer-btn0{
  background:var(--coco-grad) !important;
  color:#fff !important;
  box-shadow:0 4px 12px -4px rgba(99,102,241,.55);
}
.layui-layer-btn .layui-layer-btn0:hover{ transform:translateY(-1px); box-shadow:0 6px 16px -4px rgba(99,102,241,.62); }
.layui-layer-btn .layui-layer-btn1{
  background:#f1f5f9 !important;
  color:var(--coco-ink-2) !important;
  border:1px solid #e8ecf4 !important;
}
.layui-layer-btn .layui-layer-btn1:hover{ background:#e9eef6 !important; }
.layui-layer-ico{ border-radius:50%; }
.layui-layer-msg{
  border-radius:12px !important;
  border:none !important;
  box-shadow:0 12px 34px -10px rgba(15,23,42,.34) !important;
  background:rgba(15,23,42,.94) !important;
  color:#f8fafc !important;
  font-size:13px !important;
  padding:11px 20px !important;
  min-width:auto !important;
}
.layui-layer-shade{ background-color:rgba(15,23,42,.42) !important; }
.layui-layer-loading .layui-layer-content{ background-color:transparent !important; }
.layui-layer-hui{ background:rgba(15,23,42,.9) !important; border-radius:10px !important; }