/* ============================================================
   放行云 · 组件层 (ui.comp.css)
   Cards / KPI / Tables / Badges / Buttons / Forms / Tabs /
   Empty / Alerts / Charts / Modal / Toast / Drawer
   ============================================================ */

/* ============ 卡片 ============ */
.card{
  background:var(--panel);border:1px solid var(--border);border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm);margin-bottom:20px;overflow:hidden;
}
.card-head{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:16px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap;
}
.card-head .ct{font-size:15px;font-weight:750;display:flex;align-items:center;gap:9px}
.card-head .ct .ico{color:var(--brand)}
.card-head .cs{font-size:12.5px;color:var(--muted);font-weight:500;margin-top:2px}
.card-body{padding:20px}
.card-body.tight{padding:0}
.card-foot{padding:14px 20px;border-top:1px solid var(--border);background:var(--panel-2)}
.section-title{font-size:15px;font-weight:750;display:flex;align-items:center;gap:9px;margin-bottom:4px}
.sect{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:4px 0 14px}

/* ============ 栅格 ============ */
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-split{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.span2{grid-column:span 2}
.kpis{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-bottom:20px}
/* 六张 KPI（概览页）：auto-fit 在 1440 宽会排成 5+1 落单一张，这里按 6→3→2→1 整行排 */
.kpis.cols6{grid-template-columns:repeat(6,minmax(0,1fr))}

/* ============ KPI ============ */
.kpi{
  position:relative;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:17px 19px;box-shadow:var(--shadow-sm);overflow:hidden;transition:.18s;
}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.kpi::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,var(--kc,var(--brand)) 0,transparent 52%);opacity:.07;
}
.kpi .kt{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1;gap:8px}
.kpi .kl{font-size:12.5px;color:var(--muted);font-weight:650}
.kpi .ki{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:#fff;flex-shrink:0;
  background:linear-gradient(135deg,var(--kc,var(--brand)),var(--kc2,var(--brand-2)));
  box-shadow:0 6px 16px color-mix(in srgb,var(--kc,var(--brand)) 40%,transparent);
}
.kpi .n{font-size:28px;font-weight:800;letter-spacing:-.6px;margin-top:12px;position:relative;z-index:1;line-height:1;font-variant-numeric:tabular-nums}
.kpi .l{font-size:12.5px;color:var(--text-2);margin-top:7px;position:relative;z-index:1;font-weight:500}
.kpi .delta{font-size:11.5px;font-weight:700;margin-top:8px;position:relative;z-index:1;display:inline-flex;align-items:center;gap:3px}
.kpi .delta.up{color:var(--ok)}
.kpi .delta.down{color:var(--bad)}
.kpi.k-brand,.kpi.k1{--kc:#5b5ef4;--kc2:#8a5cff}
.kpi.k-ok,.kpi.k4{--kc:#12a05a;--kc2:#38ef7d}
.kpi.k-warn,.kpi.k2{--kc:#dd8700;--kc2:#ffb02e}
.kpi.k-bad,.kpi.k3{--kc:#e0405a;--kc2:#ff6b8a}
.kpi.k-info{--kc:#2f7fd6;--kc2:#5aa2ff}
.kpi.k5{--kc:#0e9aa7;--kc2:#35d0c4}
.kpi.k6{--kc:#b6509e;--kc2:#f07ac6}
/* 实时数：一个缓慢呼吸的点，比在文案里写「此刻」诚实 */
.live{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--kc2);vertical-align:middle;
  box-shadow:0 0 0 0 color-mix(in srgb,var(--kc2) 55%,transparent);animation:livep 2.4s ease-out infinite}
@keyframes livep{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--kc2) 55%,transparent)}
  70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.live{animation:none}}

/* ============ 表格 ============ */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--border);font-size:13.5px;vertical-align:middle}
th{
  color:var(--muted);font-weight:650;font-size:12px;letter-spacing:.3px;
  background:var(--panel-2);white-space:nowrap;
}
tbody tr{transition:background .12s}
tbody tr:hover{background:var(--panel-2)}
tbody tr:last-child td{border-bottom:0}
td .rowact{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.num,.td-num{text-align:right;font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.tbl-title{font-weight:650;color:var(--text)}
.tbl-sub{font-size:11.5px;color:var(--muted);margin-top:2px}
/* 备注这类长文本在列表里只占一行，完整内容留在 title 与编辑弹层里，避免把列宽撑爆 */
.tbl-ell{display:block;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 值 / 表达式这类靠内容撑宽的列：手机上宁可让 .tbl-wrap 横向滚，也不能被挤成一字一行 */
.tbl-val{min-width:240px}
.tbl-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-break:anywhere}
/* 策略摘要：八个「是/否」列没人会读完，开着的亮、关着的淡，一眼扫得完 */
.polrow{display:flex;gap:5px;flex-wrap:wrap;max-width:230px}
.pol{font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:7px;background:var(--panel-3);color:var(--muted);white-space:nowrap}
.pol.on{background:var(--brand-soft);color:var(--brand-ink)}
/* 一行排开的勾选（卡密字符那三个）：比三个各占一行的方框省一半高度 */
.checks{display:flex;gap:16px;flex-wrap:wrap;align-items:center;padding-top:6px}

/* ============ 徽章 / pill ============ */
.badge{
  display:inline-flex;align-items:center;gap:5px;padding:3.5px 10px;border-radius:20px;
  font-size:12px;font-weight:650;white-space:nowrap;
}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8}
.badge.plain::before{display:none}
.b-ok{background:var(--ok-soft);color:var(--ok)}
.b-warn{background:var(--warn-soft);color:var(--warn)}
.b-bad{background:var(--bad-soft);color:var(--bad)}
.b-info{background:var(--info-soft);color:var(--info)}
.b-brand{background:var(--brand-soft);color:var(--brand-ink)}
.b-muted{background:var(--panel-3);color:var(--muted)}
.pill{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  background:var(--panel-3);border:1px solid var(--border);padding:2.5px 8px;border-radius:7px;
  font-size:12px;color:var(--text-2);display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;
}
.muted{color:var(--muted)}

/* 产品着色标签 */
.prod-chip{
  display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 9px;border-radius:999px;
  font-size:12.5px;font-weight:600;white-space:nowrap;
  color:hsl(var(--h,222) 55% 40%);background:hsl(var(--h,222) 62% 95%);border:1px solid hsl(var(--h,222) 55% 87%);
}
.prod-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:hsl(var(--h,222) 62% 52%);flex:none}
html[data-theme="dark"] .prod-chip{
  color:hsl(var(--h,222) 62% 76%);background:hsl(var(--h,222) 42% 17%);border-color:hsl(var(--h,222) 38% 30%);
}
html[data-theme="dark"] .prod-chip::before{background:hsl(var(--h,222) 62% 58%)}

/* ============ 按钮 ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:9px 15px;border-radius:10px;font-size:13.5px;font-weight:650;cursor:pointer;
  border:1px solid transparent;font-family:inherit;transition:.15s;white-space:nowrap;line-height:1.2;
}
.btn .ico{opacity:.92}
.btn:active{transform:translateY(1px)}
.btn-primary,.btn.b1{
  background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;
  box-shadow:0 4px 14px color-mix(in srgb,var(--brand) 34%,transparent);
}
.btn-primary:hover,.btn.b1:hover{filter:brightness(1.07);box-shadow:0 6px 20px color-mix(in srgb,var(--brand) 44%,transparent)}
.btn-ghost,.btn.b2{background:var(--panel);border-color:var(--border);color:var(--text-2)}
.btn-ghost:hover,.btn.b2:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.btn-danger{background:var(--bad-soft);color:var(--bad)}
.btn-danger:hover{background:var(--bad);color:#fff}
.btn-soft{background:var(--panel-3);color:var(--text-2)}
.btn-soft:hover{background:var(--border);color:var(--text)}
.btn-sm,.btn.bs{padding:6px 11px;font-size:12.5px;border-radius:8px}
.btn-icon{width:34px;height:34px;padding:0;border-radius:9px}
.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.btn-row{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.btn-block{width:100%}

/* ============ 表单 ============ */
label,.lbl{display:block;font-size:12.5px;color:var(--text-2);margin:0 0 6px;font-weight:650}
input,select,textarea{
  width:100%;padding:10px 13px;border:1px solid var(--border);border-radius:10px;
  font-size:13.5px;font-family:inherit;background:var(--panel);color:var(--text);transition:.15s;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
input::placeholder,textarea::placeholder{color:var(--muted)}
select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238b91ab' stroke-width='2.2' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 11px center;padding-right:34px;
}
textarea{resize:vertical;min-height:76px;line-height:1.55}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--brand);cursor:pointer}
input[type=date]{min-width:140px}
/* 灰底而不是只掉一点透明度：一眼看出这一栏被上面那个勾选项接管了 */
input:disabled,select:disabled,textarea:disabled{background:var(--panel-2);color:var(--muted);cursor:not-allowed}
.field{margin-bottom:15px}
.row{display:flex;gap:14px}
.row>div{flex:1;min-width:0}
.hint{font-size:11.5px;color:var(--muted);margin-top:5px;line-height:1.45}
.req{color:var(--bad)}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inline-form input,.inline-form select{width:auto}

/* ============ 标签页 / 工具条 / 筛选 ============ */
.tabs{display:flex;gap:5px;background:var(--panel-3);padding:4px;border-radius:12px;flex-wrap:wrap}
.tabs a,.tabs button{
  padding:7px 14px;border-radius:9px;font-size:13px;font-weight:600;color:var(--text-2);
  cursor:pointer;border:0;background:none;font-family:inherit;transition:.14s;white-space:nowrap;
}
.tabs a:hover,.tabs button:hover{color:var(--text)}
.tabs a.on,.tabs button.on{background:var(--panel);color:var(--brand-ink);box-shadow:var(--shadow-sm)}
.tabs .cnt{font-size:11px;opacity:.7;margin-left:5px}
.toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.filters{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.filters input,.filters select{width:auto;min-width:120px}
.bulkbar{
  display:none;gap:12px;align-items:center;flex-wrap:wrap;
  padding:11px 16px;border-radius:13px;margin-bottom:14px;
  background:var(--brand-soft);border:1px solid color-mix(in srgb,var(--brand) 30%,transparent);
}
.bulkbar .bc{font-size:13px;font-weight:650;color:var(--brand-ink)}
.bulkbar .sp{flex:1}

/* ============ 空状态 / 提示 ============ */
.empty{text-align:center;color:var(--muted);padding:52px 20px}
.empty .ei{width:56px;height:56px;border-radius:16px;background:var(--panel-3);display:grid;place-items:center;margin:0 auto 14px;color:var(--muted)}
.empty .et{font-size:14.5px;font-weight:650;color:var(--text-2);margin-bottom:5px}
.err,.alert-bad{background:var(--bad-soft);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 26%,transparent);padding:11px 15px;border-radius:11px;font-size:13px;font-weight:600}
.ok,.alert-ok{background:var(--ok-soft);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 26%,transparent);padding:11px 15px;border-radius:11px;font-size:13px;font-weight:600}
.alert{
  display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:13px;
  font-size:13.5px;border:1px solid var(--border);background:var(--panel-2);margin-bottom:16px;
}
.alert .ico{margin-top:1px;flex-shrink:0}
.alert b{font-weight:750}
.alert.a-warn{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 26%,transparent);color:var(--warn)}
.alert.a-bad{background:var(--bad-soft);border-color:color-mix(in srgb,var(--bad) 26%,transparent);color:var(--bad)}
.alert.a-info{background:var(--info-soft);border-color:color-mix(in srgb,var(--info) 26%,transparent);color:var(--info)}
.alert.a-ok{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 26%,transparent);color:var(--ok)}
.alert.a-brand{background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand) 26%,transparent);color:var(--brand-ink)}

/* ============ 进度 / 分布 / 图表 ============ */
.bar{height:10px;border-radius:20px;background:var(--panel-3);overflow:hidden;display:flex}
.bar span{height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--text-2);margin-top:12px}
.legend i{width:9px;height:9px;border-radius:3px;display:inline-block;margin-right:6px;vertical-align:middle}
.legend b{color:var(--text);font-weight:750}
.prog{height:7px;border-radius:20px;background:var(--panel-3);overflow:hidden}
.prog>span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,var(--brand),var(--brand-2))}
.chart{display:flex;align-items:flex-end;gap:12px;height:180px;padding:0 2px;margin-top:20px}
.chart .col{flex:1;display:flex;flex-direction:column;align-items:center;gap:7px;height:100%;justify-content:flex-end;min-width:0}
.chart .bars{display:flex;align-items:flex-end;gap:4px;height:138px;width:100%;justify-content:center}
.chart .bars i{width:15px;border-radius:4px 4px 0 0;min-height:3px;transition:.4s}
.chart .cl{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
/* 密排（30/90 天）：柱宽吃满列宽，日期靠 PHP 抽稀，不靠浏览器截断 */
.chart.dense{gap:2px;height:150px;padding:0 12px}
.chart.dense .bars{gap:1px;height:112px}
.chart.dense .bars i{width:auto;flex:1;min-width:2px;border-radius:2px 2px 0 0}
.chart.dense .cl{font-size:10px}
/* 没有数据的天贴地画一段灰，别用 min-height 撑出「有一点」的错觉 */
.chart .bars i.z{height:2px;min-height:0;background:var(--panel-3)}
.cempty{display:flex;flex-direction:column;align-items:center;gap:8px;height:150px;justify-content:center;
  color:var(--muted);font-size:12.5px;border-bottom:1px solid var(--border)}
.cempty .ico{opacity:.5}
.b-new{background:linear-gradient(180deg,var(--brand),var(--brand-2))}
.b-pay{background:linear-gradient(180deg,var(--ok),#38ef7d)}

/* ============ 键值 / 时间线 / 气泡 ============ */
.kv{display:grid;grid-template-columns:auto 1fr;gap:11px 18px;font-size:13.5px}
.kv dt{color:var(--muted);font-weight:600}
.kv dd{color:var(--text);font-weight:550;text-align:right;word-break:break-all}
.dl-row{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--border);font-size:13.5px}
.dl-row:last-child{border-bottom:0}
.dl-row .k{color:var(--muted);font-weight:600}
.dl-row .v{font-weight:650;text-align:right;word-break:break-all}
.tl{position:relative;padding-left:26px}
.tl::before{content:"";position:absolute;left:8px;top:5px;bottom:5px;width:2px;background:var(--border)}
.tl .ti{position:relative;padding-bottom:16px}
.tl .ti:last-child{padding-bottom:0}
.tl .ti::before{content:"";position:absolute;left:-22px;top:4px;width:11px;height:11px;border-radius:50%;background:var(--panel);border:2.5px solid var(--brand)}
.tl .tt{font-size:12px;color:var(--muted)}
.bubble{max-width:84%;padding:11px 14px;border-radius:15px;font-size:13.5px;line-height:1.55;margin-bottom:12px;word-break:break-word}
.bubble.in{background:var(--panel-3);border-bottom-left-radius:5px}
.bubble.out{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;margin-left:auto;border-bottom-right-radius:5px}
.bubble .bt{font-size:11px;opacity:.7;margin-top:6px}

/* ============ 模态框 ============ */
.modal-mask{
  position:fixed;inset:0;background:rgba(12,15,32,.5);backdrop-filter:blur(3px);
  display:grid;place-items:center;z-index:200;opacity:0;visibility:hidden;transition:.18s;padding:18px;
}
.modal-mask.open{opacity:1;visibility:visible}
.modal{
  width:min(580px,100%);max-height:88vh;overflow:auto;background:var(--panel);
  border-radius:var(--r-xl);box-shadow:var(--shadow-lg);border:1px solid var(--border);
  transform:translateY(12px) scale(.98);transition:.2s;
}
.modal-mask.open .modal{transform:none}
.modal-lg{width:min(860px,100%)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 22px 12px}
.modal-head h3{font-size:17px;font-weight:750}
.modal-body{padding:6px 22px 18px}
.modal-foot{display:flex;gap:10px;justify-content:flex-end;padding:16px 22px;border-top:1px solid var(--border);background:var(--panel-2);flex-wrap:wrap}
.x{background:none;border:0;color:var(--muted);cursor:pointer;padding:5px;border-radius:8px;display:grid;place-items:center;flex-shrink:0}
.x:hover{background:var(--panel-3);color:var(--text)}

/* ============ 吐司 ============ */
#toasts{position:fixed;top:18px;right:18px;z-index:300;display:flex;flex-direction:column;gap:10px;max-width:calc(100vw - 36px)}
.toast{
  display:flex;align-items:center;gap:11px;min-width:230px;max-width:370px;padding:13px 16px;border-radius:13px;
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-lg);font-size:13.5px;font-weight:600;
  color:var(--text);animation:tin .28s cubic-bezier(.2,.8,.2,1);
}
.toast .ti{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex-shrink:0;color:#fff;font-size:14px}
.toast.t-ok .ti{background:var(--ok)}
.toast.t-bad .ti{background:var(--bad)}
.toast.t-info .ti{background:var(--info)}
.toast.out{animation:tout .25s forwards}
@keyframes tin{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}
@keyframes tout{to{opacity:0;transform:translateX(30px)}}

/* ============ 抽屉 ============ */
.drawer-mask{position:fixed;inset:0;background:rgba(12,15,32,.42);z-index:150;opacity:0;visibility:hidden;transition:.2s}
.drawer-mask.open{opacity:1;visibility:visible}
.drawer{
  position:fixed;top:0;right:0;height:100vh;width:min(470px,100%);background:var(--panel);
  box-shadow:var(--shadow-lg);z-index:160;transform:translateX(100%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;border-left:1px solid var(--border);
}
.drawer.open{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px 22px;border-bottom:1px solid var(--border)}
.drawer-head h3{font-size:16.5px;font-weight:750}
.drawer-body{flex:1;overflow:auto;padding:22px}
.drawer-foot{padding:15px 22px;border-top:1px solid var(--border);background:var(--panel-2)}

/* ============ 组件级响应式 ============ */
@media(max-width:1400px){
  .kpis.cols6{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1180px){
  .kpis,.g4{grid-template-columns:repeat(2,1fr)}
  .kpis.cols6{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .g2,.g3,.g4,.kpis,.g-split{grid-template-columns:minmax(0,1fr)}
  .kpis.cols6{grid-template-columns:minmax(0,1fr)}
  .span2{grid-column:auto}
  .card-head{padding:14px 16px}
  .card-body{padding:16px}
  th,td{padding:11px 12px;font-size:13px}
}
@media(max-width:620px){
  .row{flex-direction:column;gap:0}
  .toolbar{align-items:stretch}
  .filters{width:100%}
  .filters input,.filters select{flex:1;min-width:0;width:auto}
  .chart{gap:7px;height:150px}
  .chart .bars i{width:9px}
  .chart.dense .cl{font-size:9.5px}
  .chart.dense .cl.alt{visibility:hidden}
  .kpi .n{font-size:24px}
  .btn-row{gap:7px}
  #toasts{top:12px;right:12px;left:12px;max-width:none}
  .toast{max-width:none}
  .modal-foot{flex-direction:column-reverse}
  .modal-foot .btn{width:100%}
}

/* ============ 发送通知 ============ */
.scope{display:flex;flex-wrap:wrap;gap:8px}
.sc-opt{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid var(--border);border-radius:999px;cursor:pointer;font-size:13px;color:var(--text-2);background:var(--panel);margin:0;user-select:none;transition:.15s}
.sc-opt:hover{border-color:var(--brand);color:var(--brand-ink)}
.sc-opt input{accent-color:var(--brand);width:15px;height:15px;margin:0}
.sc-opt:has(input:checked){border-color:var(--brand);background:var(--brand-soft);color:var(--brand-ink);font-weight:600}
.sc-opt.locked{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-ink);font-weight:600;cursor:default}
.linkbtn{background:none;border:none;color:var(--brand-ink);cursor:pointer;font-size:12px;padding:0;margin-left:8px;text-decoration:underline}
.sendbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:16px;border-top:1px dashed var(--border)}
.sendbar .rc{font-size:13px;color:var(--muted)}
.sendbar .rc b{color:var(--brand-ink);font-size:16px}

.sitepick{max-height:280px;overflow:auto;border:1px solid var(--border);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:2px;background:var(--panel-2)}
.sp-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;margin:0;font-size:13px;transition:.12s}
.sp-item:hover{background:var(--panel-3)}
.sp-item input{accent-color:var(--brand);width:16px;height:16px;margin:0;flex:none}
.sp-d{flex:1;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.noticelist{display:flex;flex-direction:column}
.nt-item{border-bottom:1px solid var(--border)}
.nt-item:last-child{border-bottom:none}
.nt-item>summary{list-style:none;cursor:pointer;padding:14px 4px}
.nt-item>summary::-webkit-details-marker{display:none}
.nt-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.nt-top b{font-size:14px}
.nt-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;font-size:12px}
.nt-bar{display:inline-block;width:80px;height:5px;border-radius:999px;background:var(--panel-3);overflow:hidden;vertical-align:middle}
.nt-bar i{display:block;height:100%;background:var(--info);border-radius:999px}
.nt-body{padding:2px 4px 16px}
.nt-text{background:var(--panel-2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:13px;color:var(--text-2);white-space:pre-wrap;line-height:1.7;margin-bottom:10px}
.nt-sites{display:flex;flex-wrap:wrap;gap:6px}
.nt-site{font-size:12px;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--muted);background:var(--panel-3);border-radius:6px;padding:2px 8px}

@media(max-width:620px){
  .sendbar{flex-direction:column;align-items:stretch}
  .sendbar .btn{width:100%}
}

/* ============ 插件商场 ============ */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.pcard{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:12px;transition:.16s;position:relative}
.pcard:hover{border-color:var(--border-strong);box-shadow:0 8px 28px rgba(30,35,80,.08);transform:translateY(-2px)}
.pcard.off{opacity:.62}
.pcard-top{display:flex;align-items:flex-start;gap:12px}
.pcard-icon{width:48px;height:48px;flex:none;border-radius:13px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1}
.pcard-h{flex:1;min-width:0}
.pcard-name{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pver{font-size:11px;font-weight:600;color:var(--muted);background:var(--panel-3);border-radius:6px;padding:1px 6px}
.pcard-tags{display:flex;align-items:center;gap:6px;margin-top:6px;flex-wrap:wrap}
.cat-chip{font-size:11.5px;color:var(--text-2);background:var(--panel-3);border-radius:999px;padding:2px 9px}
.pcard-price{text-align:right;flex:none;font-weight:800;font-size:18px;color:var(--brand-ink);line-height:1.2}
.pcard-price .free{color:var(--ok)}
.pcard-price .amt{white-space:nowrap}
.pcard-price .pu{font-size:12px;font-weight:600;color:var(--muted)}
.off-tag{font-size:11px;font-weight:600;color:var(--muted);margin-top:2px}
.pcard-sum{font-size:13px;color:var(--text-2);line-height:1.6;min-height:34px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard-meta{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pcard-meta b{color:var(--text-2)}
.pcard-meta .dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.pcard-meta .dot.g{background:var(--ok)}
.pcard-meta .mm-sep{opacity:.5}
.pcard-meta .trial{color:var(--warn);font-weight:600}
.pcard-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:12px;border-top:1px dashed var(--border)}
.pcard-acts{display:flex;align-items:center;gap:4px}

.grantlist{display:flex;flex-direction:column;gap:8px}
.gr-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;border:1px solid var(--border);border-radius:11px;background:var(--panel-2)}
.gr-row.on{background:var(--ok-soft);border-color:transparent}
.gr-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.gr-d{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:13px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gr-p{font-size:11px;color:var(--muted)}
.gr-act{display:flex;align-items:center;gap:8px;flex:none}
.gr-state{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.gr-exp{font-size:11px;color:var(--muted)}
.gr-form{display:flex;align-items:center;gap:6px}
.gr-date{width:130px;display:inline-block;padding:5px 7px;font-size:12px}

@media(max-width:620px){
  .pcard-price{font-size:16px}
  .gr-row{flex-direction:column;align-items:stretch}
  .gr-act{justify-content:space-between}
}

/* ============ 哨卡补充组件 ============ */
.licbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;border-radius:13px;padding:12px 18px;margin-bottom:18px;font-size:13px;border:1px solid;line-height:1.6}
.licbar a{font-weight:700;text-decoration:none;white-space:nowrap}
.lb-warn{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}
.lb-warn a{color:var(--warn)}
.lb-bad{background:var(--bad-soft);border-color:var(--bad);color:var(--bad)}
.lb-bad a{color:var(--bad)}

.pager{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:14px 2px 2px}
.pager .pinfo{color:var(--muted);font-size:12.5px;margin-right:6px}
.pager .pg{display:inline-grid;place-items:center;min-width:31px;height:31px;padding:0 9px;border-radius:9px;border:1px solid var(--border);color:var(--text-2);font-size:12.5px;font-weight:600;text-decoration:none;background:var(--panel)}
.pager .pg:hover{border-color:var(--brand);color:var(--brand)}
.pager .pg.on{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent}

.mono,code.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:.3px}
.cardcode{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:.4px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:3px 8px;cursor:pointer;display:inline-block}
.cardcode:hover{border-color:var(--brand);color:var(--brand)}
.hintbox{background:var(--panel-2);border:1px dashed var(--border-strong);border-radius:12px;padding:14px 16px;font-size:12.8px;color:var(--muted);line-height:1.85}
/* 在线收银台：说明 + 付款按钮 + 可复制链接 */
.paybox{display:grid;gap:10px}
.paybox .payline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.paybox .payurl{flex:1 1 240px;min-width:0;color:var(--muted);word-break:break-all;font-size:11.8px;line-height:1.7}
@media (max-width:620px){.paybox .payline .btn{width:100%}}
.seg{display:inline-flex;background:var(--panel-2);border:1px solid var(--border);border-radius:11px;padding:3px;gap:3px;flex-wrap:wrap}
.seg a{padding:6px 13px;border-radius:8px;font-size:12.8px;font-weight:650;color:var(--text-2);text-decoration:none;white-space:nowrap}
.seg a.on{background:var(--panel);color:var(--brand);box-shadow:var(--shadow-sm)}
.stat-row{display:flex;align-items:baseline;gap:8px}
.stat-row .v{font-size:21px;font-weight:800;letter-spacing:-.4px}
.stat-row .u{font-size:12px;color:var(--muted);font-weight:600}
.meter{height:6px;border-radius:99px;background:var(--panel-2);overflow:hidden}
.meter i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),var(--brand-2))}
.kv.tight{gap:8px 16px}
.rowact form{display:inline}
.bubble-list{display:flex;flex-direction:column;gap:12px}
.check{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--text-2);cursor:pointer}
.check input{width:16px;height:16px;accent-color:var(--brand)}

/* 开关：配置页要一眼扫完八九个布尔项，方框勾选排在长表单里根本分不清哪个是哪个。
   开/两个字由 CSS 换，不用 JS，也不会出现「勾了但不知道勾的是什么」 */
.sw{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--text-2);cursor:pointer;position:relative}
.sw input{position:absolute;opacity:0;width:1px;height:1px}
.sw i{width:40px;height:23px;border-radius:999px;background:var(--panel-3);border:1px solid var(--border-strong);position:relative;transition:.16s;flex:none}
.sw i::after{content:'';position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:var(--muted);transition:.16s}
.sw em{font-style:normal;font-size:12px;font-weight:600;color:var(--muted);min-width:24px}
.sw em::after{content:'关闭'}
.sw input:checked+i{background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand) 45%,transparent)}
.sw input:checked+i::after{left:20px;background:var(--brand)}
.sw input:checked~em{color:var(--brand-ink)}
.sw input:checked~em::after{content:'开启'}
.sw input:focus-visible+i{outline:2px solid var(--brand);outline-offset:2px}
/* 「更多设置」：建档时不想被二十个字段淹没，但每个字段都得能当场改 */
.more{border:1px solid var(--border);border-radius:13px;background:var(--panel-2);margin-bottom:15px;overflow:hidden}
.more>summary{padding:13px 16px;font-size:13px;font-weight:650;color:var(--text-2);cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px}
.more>summary::-webkit-details-marker{display:none}
.more>summary::after{content:'展开';margin-left:auto;font-size:11.5px;font-weight:600;color:var(--muted)}
.more>summary:hover{color:var(--brand-ink)}
.more[open]>summary{border-bottom:1px solid var(--border)}
.more[open]>summary::after{content:'收起'}
.more>.mb{padding:16px 16px 4px}
.fh{display:block;font-size:11.5px;color:var(--muted);margin-top:5px}
/* 长表单的分组：一条分隔线 + 标题 + 这个分组影响哪个接口，扫起来比八个平铺字段省力 */
.fsec{margin:26px 0 16px;padding-top:20px;border-top:1px solid var(--border)}
.fsec:first-child{margin-top:0;padding-top:0;border-top:0}
.fsec .ft{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.fsec .ft b{font-size:13.5px;font-weight:750;display:flex;align-items:center;gap:7px}
.fsec .ft span{font-size:11.5px;color:var(--muted)}
.copybtn{padding:2px 9px!important;font-size:11.5px!important}
.rowchk{width:16px;height:16px;accent-color:var(--brand)}
.filters select,.filters input[type=text]{min-width:130px}
/* 搜索框的提示语就是这页能搜什么的清单，被截断等于把可搜字段藏起来了 */
.filters input[type=search]{min-width:200px}
.col-chk{width:38px;text-align:center}
.col-chk .rowchk{margin:0}
.tbl-title .copybtn{margin-left:7px;vertical-align:2px;opacity:.55}
tr:hover .tbl-title .copybtn{opacity:1}
/* 密钥单元格：值与复制按钮锁在同一行，窄列表里按钮不会掉到下一行 */
.keyline{display:flex;align-items:center;gap:7px;white-space:nowrap}
.keyline+.keyline{margin-top:6px}
.keyline .pill{min-width:0}
.keyline .copybtn{flex:none;opacity:.6}
.keyline:hover .copybtn{opacity:1}
.kpis{margin-bottom:16px}

/* ============ 接入文档 ============ */
.doc{display:grid;grid-template-columns:196px minmax(0,1fr);gap:24px;align-items:start}
.doc-toc{position:sticky;top:16px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-lg);padding:9px;display:flex;flex-direction:column;gap:1px}
.doc-toc .grp{font-size:10.5px;letter-spacing:.6px;color:var(--muted);font-weight:750;padding:9px 10px 3px}
.doc-toc a{padding:7px 10px;border-radius:9px;font-size:12.8px;font-weight:600;color:var(--text-2);text-decoration:none;transition:.12s}
.doc-toc a:hover{background:var(--panel-2);color:var(--brand)}
.doc-toc a.on{background:var(--brand-soft);color:var(--brand-ink)}
.sec{scroll-margin-top:84px}
.doc-h{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:750;margin:24px 0 10px}
.doc-h:first-child{margin-top:0}
.doc-h .n{
  width:23px;height:23px;border-radius:7px;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-size:11.5px;font-weight:800;
}
.lead{font-size:13.2px;color:var(--text-2);line-height:1.8;margin:0 0 12px}
.keygrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin-bottom:14px}
.keybox{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r);padding:12px 14px}
.keybox .kl{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted);font-weight:750;letter-spacing:.4px;margin-bottom:6px}
.keybox .kvv{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.8px;color:var(--text);font-weight:600;word-break:break-all;line-height:1.5}
.code{position:relative;background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r);margin:10px 0 16px;overflow:hidden}
.code .ch{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px 7px 14px;border-bottom:1px solid var(--border)}
.code .ch b{font-size:11px;font-weight:750;letter-spacing:.4px;color:var(--muted)}
.code pre{margin:0;padding:13px 15px;overflow:auto;max-height:420px}
.code code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.4px;line-height:1.72;color:var(--text);white-space:pre}
.param td:first-child{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.4px;color:var(--brand-ink);font-weight:650;white-space:nowrap}
.param td{vertical-align:top;line-height:1.6}
.note{display:flex;gap:10px;background:var(--brand-soft);border:1px solid color-mix(in srgb,var(--brand) 22%,transparent);border-radius:var(--r);padding:12px 14px;font-size:12.8px;line-height:1.75;color:var(--text-2);margin:12px 0}
.note .ico{color:var(--brand);flex:none;margin-top:1px}
.note.warn{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 28%,transparent)}
.note.warn .ico{color:var(--warn)}
@media(max-width:1080px){
  .doc{grid-template-columns:minmax(0,1fr)}
  .doc-toc{position:static;flex-direction:row;flex-wrap:wrap;gap:4px}
  .doc-toc .grp{display:none}
}

/* ============ 授权中心：状态卡 / 套餐 / 插件 / 时间线 ============ */
.lic-hero{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:22px 24px;background:linear-gradient(135deg,var(--panel),var(--panel-2));border:1px solid var(--panel-3)}
.lic-hero::after{content:"";position:absolute;right:-40px;top:-50px;width:190px;height:190px;border-radius:50%;background:var(--brand-soft);pointer-events:none}
.lic-hero .row{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;position:relative;z-index:1}
.lic-hero .lab{font-size:12.3px;color:var(--muted);font-weight:650;margin-bottom:7px}
.lic-hero .big{display:inline-flex;align-items:center;gap:8px;font-size:20px;font-weight:820;letter-spacing:-.3px;padding:7px 16px;border-radius:11px}
.lic-hero .right{text-align:right}
.lic-hero .meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px dashed var(--border-strong);font-size:12.6px;color:var(--muted);position:relative;z-index:1}
.lic-hero .meta b{color:var(--text);font-weight:700}
.big.ok{background:var(--ok-soft);color:var(--ok)}
.big.warn{background:var(--warn-soft);color:var(--warn)}
.big.bad{background:var(--bad-soft);color:var(--bad)}
.big.mute{background:var(--panel-3);color:var(--muted)}
.pkg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:14px}
.pkg{border:1px solid var(--border);border-radius:var(--r);padding:17px 16px;display:flex;flex-direction:column;gap:4px;background:var(--panel);transition:.15s}
.pkg:hover{border-color:var(--brand);box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.pkg .pn{font-size:13.2px;font-weight:700;color:var(--text-2)}
.pkg .pr{font-size:24px;font-weight:830;letter-spacing:-.6px;margin:4px 0 2px}
.pkg .pm{font-size:11.8px;color:var(--muted)}
.pkg form{margin:12px 0 0}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.pcard{border:1px solid var(--border);border-radius:var(--r);padding:16px;background:var(--panel);display:flex;flex-direction:column;gap:9px}
.pcard.owned{background:var(--panel-2);border-color:color-mix(in srgb,var(--ok) 32%,transparent)}
.pcard .ph{display:flex;align-items:center;gap:11px}
.pcard .pi{width:38px;height:38px;flex:none;border-radius:10px;background:var(--brand-soft);display:grid;place-items:center;font-size:19px}
.pcard .pt{font-size:13.6px;font-weight:730}
.pcard .ps{font-size:11.5px;color:var(--muted);margin-top:2px}
.pcard .pd{font-size:12.6px;color:var(--text-2);line-height:1.65;min-height:34px}
.pcard .pf{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto}
.pcard .pp{font-size:16px;font-weight:800}
.pcard .pp small{font-size:11px;color:var(--muted);font-weight:600}
.own-chips{display:flex;flex-wrap:wrap;gap:8px}
.own-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.4px;font-weight:650;color:var(--ok);background:var(--ok-soft);border:1px solid color-mix(in srgb,var(--ok) 30%,transparent);border-radius:99px;padding:5px 12px}
.own-chip small{color:var(--muted);font-weight:600}
.tl .it{display:flex;gap:13px;padding:11px 0;border-bottom:1px dashed var(--border)}
.tl .it:last-child{border-bottom:0}
.tl .dot{flex:none;width:9px;height:9px;border-radius:50%;margin-top:6px;background:var(--brand)}
.tl .ver{font-size:13.6px;font-weight:760;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tl .li{font-size:12.6px;color:var(--text-2);line-height:1.75;margin-top:3px}
.order-card{border:1px solid color-mix(in srgb,var(--brand) 32%,transparent);background:var(--brand-soft);border-radius:var(--r);padding:16px 18px;margin-bottom:18px}
.order-card .oh{font-size:14px;font-weight:770;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.order-card .or{display:flex;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--text-2)}
.order-card .or b{font-weight:760}
@media(max-width:680px){.lic-hero{padding:18px}.lic-hero .right{text-align:left}}

/* ============ 收款配置页：分组标签 / 渠道选项卡 / 只读对接身份 / 高级折叠 ============ */
.grp-label{display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:750;letter-spacing:.7px;color:var(--muted);margin:24px 0 11px}
.grp-label:first-child{margin-top:0}
.grp-label::after{content:"";flex:1;height:1px;background:var(--border)}
.opt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(224px,1fr));gap:10px}
.opt{position:relative;display:flex;gap:11px;align-items:flex-start;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r);background:var(--panel);cursor:pointer;transition:.15s;user-select:none;margin:0}
.opt:hover{border-color:var(--brand);background:var(--panel-2)}
.opt input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.opt .on{width:17px;height:17px;border-radius:5px;border:1.5px solid var(--border-strong);flex:none;margin-top:1px;display:grid;place-items:center;transition:.15s;background:var(--panel)}
.opt .tx{flex:1;min-width:0}
.opt .tn{font-size:13.5px;font-weight:650;color:var(--text);display:flex;align-items:center;gap:7px}
.opt .tn .mono{font-weight:500}
.opt .td{display:block;font-size:11.5px;color:var(--muted);line-height:1.55;margin-top:4px}
.opt:has(input:checked){border-color:var(--brand);background:var(--brand-soft)}
.opt:has(input:checked) .on{border-color:var(--brand);background:var(--brand)}
.opt:has(input:checked) .on::after{content:"";width:8px;height:4.5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-2px)}
.opt:has(input:checked) .tn{color:var(--brand-ink)}
.ident{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r);padding:13px 15px;font-size:12.8px;color:var(--text-2)}
.ident .k{font-size:11px;font-weight:750;letter-spacing:.4px;color:var(--muted);margin-right:6px}
.ident b{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.ident .mono{font-family:var(--mono)}
details.adv{border:1px solid var(--border);border-radius:var(--r);background:var(--panel-2);padding:0 15px}
details.adv>summary{cursor:pointer;font-size:13px;font-weight:650;color:var(--text-2);padding:12px 0;list-style:none;display:flex;align-items:center;gap:8px;outline:none}
details.adv>summary::-webkit-details-marker{display:none}
details.adv>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-left:auto;transition:.18s;flex:none}
details.adv[open]>summary::after{transform:rotate(-135deg)}
details.adv>.adv-body{padding-bottom:16px}
.check-list{display:flex;flex-direction:column}
.check-list .ci{display:flex;gap:14px;align-items:flex-start;padding:13px 20px}
.check-list .ci+.ci{border-top:1px solid var(--border)}
.check-list .ci .tx{flex:1;min-width:0}
.check-list .ci .tt{font-size:13.5px;font-weight:650}
.check-list .ci .tds{font-size:11.5px;color:var(--muted);line-height:1.6;margin-top:3px}

/* ============ 页内子标签 / 编号步骤 / 状态行 ============ */
.subtabs{display:flex;gap:5px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--border);border-radius:var(--r);padding:5px;margin-bottom:16px}
.subtabs .st{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:calc(var(--r) - 4px);font-size:13px;font-weight:600;color:var(--text-2);text-decoration:none;transition:.15s}
.subtabs .st:hover{background:var(--panel-2);color:var(--text)}
.subtabs .st.on{background:var(--brand);color:#fff;box-shadow:0 2px 9px color-mix(in srgb,var(--brand) 32%,transparent)}
.subtabs .st.on:hover{color:#fff}
.steps{display:flex;flex-direction:column;gap:15px}
.steps .stp{display:flex;gap:12px;align-items:flex-start}
.steps .stp .no{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand-ink);font-size:12.5px;font-weight:750;line-height:1}
.steps .stp>div b{display:block;font-size:13.4px;font-weight:680;color:var(--text)}
.steps .stp>div span{display:block;font-size:12.3px;color:var(--muted);line-height:1.7;margin-top:3px}
.stat-rows{display:flex;flex-wrap:wrap;border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.stat-rows .sr{flex:1 1 268px;min-width:0;display:flex;flex-direction:column;gap:6px;padding:13px 18px;background:var(--panel-2);box-shadow:1px 0 0 var(--border),0 1px 0 var(--border)}
.stat-rows .sr .k{font-size:11px;font-weight:750;letter-spacing:.5px;color:var(--muted)}
.stat-rows .sr .v{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13.2px;color:var(--text);font-weight:600}
.stat-rows .sr .v em{font-style:normal;font-size:11.6px;font-weight:500;color:var(--muted)}
.stat-rows .sr .v .mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ============ SDK 下载页：运行时卡片网格 / 包内文件chip / 提醒列表 ============ */
/* 两列是算过的：包数会随运行时增加，三列在 10 套时最后一行只剩一张卡孤零零。
   两列在 1180 的正文宽下正好 5+5，说明文字也不用被挤成六行 */
.sdk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:14px}
.sdkcard{display:flex;flex-direction:column;gap:9px;border:1px solid var(--border);border-radius:var(--r);background:var(--panel);padding:16px 17px;transition:.15s}
.sdkcard:hover{border-color:var(--brand);box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.sdkcard.pending{background:var(--panel-2)}
.sdkcard .h{display:flex;align-items:flex-start;gap:11px}
.sdkcard .ic{flex:none;width:34px;height:34px;border-radius:9px;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center}
.sdkcard .nm{flex:1;min-width:0}
.sdkcard .nm b{display:block;font-size:14px;font-weight:740;color:var(--text);line-height:1.35}
.sdkcard .nm em{display:block;font-style:normal;font-size:11.5px;color:var(--muted);margin-top:2px;font-family:var(--mono)}
.sdkcard .rt{font-size:11.5px;color:var(--muted);letter-spacing:.2px}
.sdkcard .nt{font-size:12.5px;color:var(--text-2);line-height:1.68}
.sdkcard .nt code{font-family:var(--mono);font-size:11.6px;background:var(--panel-3);border-radius:5px;padding:1px 5px}
.sdkcard .mt{font-size:11.5px;color:var(--muted);margin-top:auto;padding-top:2px}
.sdkcard .ac{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sdk-files{display:flex;flex-wrap:wrap;gap:5px}
.sdk-files .f{font-family:var(--mono);font-size:11.4px;color:var(--text-2);background:var(--panel-3);border:1px solid var(--border);border-radius:6px;padding:2px 7px}
.hint-list{display:flex;flex-direction:column;gap:11px;margin:0;padding:0 0 0 16px;font-size:12.8px;color:var(--text-2);line-height:1.72}
.hint-list li::marker{color:var(--brand)}
.hint-list b{color:var(--text);font-weight:700}
.hint-list code{font-family:var(--mono);font-size:11.8px;background:var(--panel-3);border-radius:5px;padding:1px 5px}
@media(max-width:680px){.sdk-grid{grid-template-columns:1fr}}

/* ============ 移动端适配（iOS Safari 焦点缩放 + 横向溢出 + 抽屉/弹层全屏化） ============ */
@media(max-width:760px){
  /* :not() 链是为了压过各页自己写的小字号输入规则 */
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  select:not([multiple]):not([size]),
  body textarea:not([disabled]){font-size:16px;padding:11px 13px}
  textarea{min-height:88px}
  input[type=date],input[type=time],input[type=datetime-local]{min-width:0}
  /* 侧栏搜索框：保留左侧图标留白（选择器加权是为了压过上面那条通吃规则） */
  body .side .navfilt input:not([disabled]){padding:10px 12px 10px 34px}
  /* product_key / 卡密 / 文件哈希这类超长无空格串：手机上必须能拆开，否则整页横向溢出 */
  .mono,code,.pill{overflow-wrap:anywhere}
  .btn{min-height:40px}
  .btn-sm{min-height:34px;padding:8px 12px}
  .drawer{width:100%;height:100dvh}
  .drawer-head,.drawer-body,.drawer-foot{
    padding-left:calc(18px + env(safe-area-inset-left));
    padding-right:calc(18px + env(safe-area-inset-right));
  }
  .drawer-foot{padding-bottom:calc(15px + env(safe-area-inset-bottom))}
  .modal-mask{padding:0;align-items:end}
  .modal{width:100%;max-width:100%;max-height:92dvh;border-radius:20px 20px 0 0}
}