/**
 * 枢序DNS · DNS域名分发系统
 * 版权所有 (C) 2026 沈阳行水科技有限公司，保留所有权利
 */






:root{--nav-h:65px;

  
  --shuxu-deep:#0034B5;   
  --shuxu-2:#0034B5;      
  --shuxu-1:#0052D9;      
  --shuxu-3:#266FE8;      
  --shuxu-4:#E6F1FF;      
  --shuxu-5:#F5F9FF;      
  --ink:#0A1C3D;        
  --sub:#4E6C9B;        
  --muted:#8AA6CE;      
  --line:#D7E7FF;       
  --ok:#12B76A; --warn:#F79009; --bad:#F04438;
  



  --amt-in:#0A6B3C;  --amt-out:#C4271B;
  --amt-in-soft:#EAF7F0; --amt-out-soft:#FFF1EF;
  --amt-in-e:#075C33; --amt-out-e:#A81E12;
  --amt-in-soft-e:#E7F4EC; --amt-out-soft-e:#FCEDEA;
  --r-card:20px; --r-pill:999px;
  --grad-main:linear-gradient(135deg,var(--shuxu-3) 0%,var(--shuxu-1) 100%);
  --grad-deep:linear-gradient(135deg,var(--shuxu-deep) 0%,var(--shuxu-1) 55%,var(--shuxu-3) 100%);
  --shadow-1:0 2px 10px rgba(0,82,217,.07);
  --shadow-2:0 10px 30px rgba(0,82,217,.13);
  --shadow-3:0 18px 48px rgba(0,82,217,.18);
  --shadow-blue:0 8px 22px rgba(0,82,217,.28);
  --max:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{
  -webkit-text-size-adjust:100%;
  overscroll-behavior:none;          
  overscroll-behavior-y:none;
}
body{
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);background:var(--shuxu-5);
  font-size:14px;line-height:1.6;
  overscroll-behavior:none;
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
  touch-action:pan-y;                
  user-select:text;                  
  -webkit-user-select:text;
}
img{max-width:100%;display:block;border:0}
a{color:var(--shuxu-1);text-decoration:none}
a:hover{color:var(--shuxu-2)}
h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-.02em;line-height:1.3}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
button,input,select,textarea{font-family:inherit;font-size:14px;outline:none}
::selection{background:var(--shuxu-3);color:#fff}


.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 20px}
.center{display:flex;align-items:center;justify-content:center}
.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))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.row{display:flex;align-items:center;gap:12px}
.row.between{justify-content:space-between}
.row.wrap{flex-wrap:wrap}
.col{display:flex;flex-direction:column;gap:14px}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}
.mb12{margin-bottom:12px}.mb16{margin-bottom:16px}.mb24{margin-bottom:24px}
.tc{text-align:center}
.muted{color:var(--muted)}
.sub{color:var(--sub)}
.shuxu-copyright{text-align:center;font-size:12px;color:var(--sub);line-height:1.9}
.hide{display:none !important}


.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  height:42px;padding:0 22px;border:0;border-radius:var(--r-pill);
  background:var(--grad-main);
  color:#fff;font-weight:600;font-size:14px;cursor:pointer;
  box-shadow:var(--shadow-blue);
  transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(0,82,217,.36);color:#fff}
.btn:active{transform:translateY(0) scale(.985)}
.btn:focus-visible{outline:0;box-shadow:0 0 0 4px rgba(0,82,217,.28),var(--shadow-blue)}
.btn[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none}

.btn.ghost{background:#fff;color:var(--shuxu-1);border:1px solid #BCD8FF;box-shadow:var(--shadow-1)}
.btn.ghost:hover{background:linear-gradient(135deg,#F4F9FF,#E8F2FF);color:var(--shuxu-1);border-color:#9CC4FB;box-shadow:0 8px 18px rgba(0,82,217,.14)}
.btn.gray{background:#F1F5FD;color:var(--sub);box-shadow:none;border:1px solid var(--line)}
.btn.gray:hover{background:#E7EEFA;color:var(--ink);border-color:#D2DEF0}
.btn.sm{height:34px;padding:0 16px;font-size:13px}
.btn.xs{height:29px;padding:0 13px;font-size:12.5px;border-radius:var(--r-pill)}
.btn.block{width:100%}
.btn.danger{background:linear-gradient(135deg,#FF6A5E,#F04438);box-shadow:0 6px 16px rgba(240,68,56,.24)}
.btn.danger:hover{box-shadow:0 12px 26px rgba(240,68,56,.32)}

.btn.ok{background:linear-gradient(135deg,#28C08A,#12A06E);box-shadow:0 6px 16px rgba(18,160,110,.24)}
.btn.ok:hover{box-shadow:0 12px 26px rgba(18,160,110,.32)}

.btn > svg,.btn > .ico{width:16px;height:16px;flex:0 0 16px}

@media (max-width:860px){
  .btn{height:44px;padding:0 18px;font-size:14.5px;white-space:normal;line-height:1.35}
  .btn.sm{height:38px;padding:0 15px;font-size:13.5px}
  .btn.xs{height:32px;padding:0 12px;font-size:12.5px}
  
  .row .btn + .btn{margin-left:0}
  .page-head .right{display:flex;gap:8px;flex-wrap:wrap}
  .page-head .right .btn{flex:1 1 auto}
}



.back-home{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.back-home .bh-ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.back-home .bh-ico svg{width:16px;height:16px;display:block}
@media (max-width:640px){ .back-home .bh-txt{display:none} .back-home{padding:0 12px} }


.rc-quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.rc-item{height:56px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;
  font-size:16px;font-weight:800;color:var(--ink);transition:all .18s var(--ease)}
.rc-item:hover{border-color:var(--shuxu-2);color:var(--shuxu-1);transform:translateY(-1px)}
.rc-item.on{border-color:var(--shuxu-1);background:linear-gradient(135deg,var(--shuxu-4),#fff);
  color:var(--shuxu-1);box-shadow:inset 0 0 0 1px var(--shuxu-1)}
@media (max-width:640px){ .rc-quick{grid-template-columns:repeat(2,minmax(0,1fr))} }


.rc-bal{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:14px 16px;border-radius:12px;background:linear-gradient(135deg,var(--shuxu-4),#fff);border:1px solid var(--line)}
.rc-bal span{font-size:13px;color:var(--sub);font-weight:600}
.rc-bal b{font-size:24px;font-weight:800;color:var(--shuxu-1);letter-spacing:-.3px}
.rc-bal.big b{font-size:32px}
@media (max-width:640px){ .rc-bal b{font-size:20px} .rc-bal.big b{font-size:26px} }


.ap-doc{display:flex;flex-direction:column;gap:10px}
.ap-row{display:flex;flex-direction:column;gap:4px}
.ap-row .ap-k{font-size:12.5px;font-weight:700;color:var(--sub)}
.ap-row code{display:block;word-break:break-all;padding:8px 10px;border-radius:8px;
  background:var(--shuxu-4);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;line-height:1.5;color:var(--ink)}
.ap-code{margin:12px 0 0;padding:12px 14px;border-radius:10px;background:#0F1B2E;color:#8FE3B8;
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;line-height:1.65;
  overflow-x:auto;white-space:pre;-webkit-overflow-scrolling:touch}


.rn-done{display:flex;align-items:center;gap:14px;padding:16px;border-radius:12px;
  background:linear-gradient(135deg,#E6F8F0,#fff);border:1px solid rgba(0,168,107,.25)}
.rn-ico{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:var(--ok);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:19px;font-weight:800}


@media (max-width:640px){
  .set-grp{margin:18px 0 10px;font-size:13px}
  .hd-ico{width:24px;height:24px;flex:0 0 24px;border-radius:7px}
  .hd-ico svg{width:15px;height:15px}
  .sw-item{align-items:flex-start;flex-direction:column;gap:9px;padding:13px 0}
  .sw-item>div:first-child{width:100%}
}

.pill{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 12px;border-radius:var(--r-pill);
  font-size:12.5px;font-weight:600;background:var(--shuxu-4);color:var(--shuxu-1)}


.pill.ok{background:#E6F8F0;color:#0B7A46}
.dot-new{display:inline-block;width:8px;height:8px;border-radius:50%;background:#E5484D;margin-left:7px;vertical-align:middle;box-shadow:0 0 0 3px rgba(229,72,77,.16)}
.side-mini .dot-new{margin-left:0}

html[data-eye-site="1"] .pill.ok,html[data-eye-admin="1"] .pill.ok{
  background:#16351F !important;color:#7FD9A0 !important}
.pill.warn{background:#FEF3E4;color:var(--warn)}
.pill.bad{background:#FDECEA;color:var(--bad)}
.pill.gray{background:#F1F4FA;color:var(--sub)}
.pill.out{background:#fff;border:1px solid var(--line);color:var(--sub)}





/* v1.9.144 金额配色不再随语言切换：正数绿、负数红，中英文一致 */
.amt-in{color:var(--amt-in) !important}
.amt-out{color:var(--amt-out) !important}
.pill.amt-in{background:var(--amt-in-soft);color:var(--amt-in)}
.pill.amt-out{background:var(--amt-out-soft);color:var(--amt-out)}

html[data-eye-admin="1"] .amt-in,html[data-eye-site="1"] .amt-in{color:var(--amt-in-e) !important}
html[data-eye-admin="1"] .amt-out,html[data-eye-site="1"] .amt-out{color:var(--amt-out-e) !important}
html[data-eye-admin="1"] .pill.amt-in,html[data-eye-site="1"] .pill.amt-in{background:var(--amt-in-soft-e);color:var(--amt-in-e) !important}
html[data-eye-admin="1"] .pill.amt-out,html[data-eye-site="1"] .pill.amt-out{background:var(--amt-out-soft-e);color:var(--amt-out-e) !important}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--shadow-1)}
.card .hd{display:flex;align-items:center;gap:9px;padding:14px 18px;border-bottom:1px solid var(--line);font-weight:700;font-size:14.5px}
.card .hd .more{margin-left:auto;font-size:12.5px;font-weight:500;color:var(--shuxu-2)}
.card .bd{padding:18px}
.card.bd{padding:18px}

.hd-ico{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  border-radius:8px;background:linear-gradient(135deg,var(--shuxu-4),#fff);color:var(--shuxu-1);flex:0 0 26px}
.hd-ico svg{width:16px;height:16px;display:block}

.set-grp{display:flex;align-items:center;gap:9px;margin:24px 0 12px;font-size:13.5px;font-weight:800;color:var(--ink);letter-spacing:.2px}
.set-grp:first-of-type{margin-top:4px}
.set-grp::before{content:"";width:4px;height:15px;border-radius:3px;flex:0 0 4px;
  background:linear-gradient(180deg,var(--shuxu-1),var(--shuxu-2))}

.set-sub{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--sub);margin-bottom:12px}
.set-sub::after{content:"";flex:1;height:1px;background:var(--line)}

.set-note{margin-top:14px;padding:9px 12px;border-radius:10px;background:var(--shuxu-4);
  font-size:12.5px;line-height:1.7;color:var(--sub)}

.sw-item{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:11px 0;border-bottom:1px dashed var(--line)}
.sw-item:first-child{padding-top:0}
.sw-item:last-child{border-bottom:0;padding-bottom:0}
.sw-item>div:first-child{min-width:0}
.sw-item b{display:block;font-size:13.5px;font-weight:700;color:var(--ink)}
.sw-item .sub{font-size:12.5px;margin-top:3px;line-height:1.5}

.sw-item .switch{flex:0 0 auto}
.card.hover{transition:transform .2s ease,box-shadow .2s ease}
.card.hover:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}

.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:13px;color:var(--sub);font-weight:600}
.input{
  height:44px;padding:0 16px;border:1px solid var(--line);border-radius:var(--r-pill);
  background:#FCFDFF;color:var(--ink);width:100%;transition:border-color .18s,box-shadow .18s;
}
.input:focus{border-color:var(--shuxu-2);box-shadow:0 0 0 4px rgba(46,139,255,.13)}
.input::placeholder{color:#B6C7E0}

.input.bad{border-color:#C4271B;background:#FFF7F6}
.input.bad:focus{border-color:#C4271B;box-shadow:0 0 0 4px rgba(196,39,27,.13)}
textarea.input{height:auto;padding:12px 16px;border-radius:18px;resize:vertical;min-height:96px}
select.input{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--sub) 50%),linear-gradient(135deg,var(--sub) 50%,transparent 50%);
  background-position:calc(100% - 18px) 19px,calc(100% - 13px) 19px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:38px}
.input-group{display:flex;gap:8px;align-items:center}
.input-group .input{flex:1}


.pwd-wrap{position:relative}
.pwd-wrap .input{padding-right:46px}
.pwd-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;padding:0;border:0;border-radius:50%;background:transparent;
  color:#9AAECB;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  transition:color .18s,background .18s;-webkit-tap-highlight-color:transparent}
.pwd-eye:hover{color:var(--shuxu-1);background:var(--shuxu-5)}
.pwd-eye:active{background:#E2EEFF}
.pwd-eye.on{color:var(--shuxu-1)}
.pwd-eye svg{width:17px;height:17px;display:block}
.pwd-eye:focus-visible{outline:2px solid var(--shuxu-1);outline-offset:1px}

.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{background:var(--shuxu-5);color:var(--sub);font-weight:600;text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.table td{padding:11px 14px;border-bottom:1px solid #F2F6FD;vertical-align:middle}
.table tr:hover td{background:#FAFCFF}

.table .op{color:var(--shuxu-1);cursor:pointer;font-weight:600;
  display:inline-flex;align-items:center;white-space:nowrap;vertical-align:middle}
.table .op + .op{margin-left:10px}
.table .op.danger{color:var(--bad)}

.table .op.warn{color:#B45309}

.table td.col-op,.table th.col-op{white-space:nowrap;min-width:180px;text-align:right;line-height:2.2}
.table td.col-op .op:first-child{margin-left:0}

.table .pill,.table .rtype,.table .icp-tag,.table .tag,.table .status,.table .badge{
  display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;
  padding:2px 10px;border-radius:10px;font-size:12px;min-width:48px}

.table td.col-date,.table th.col-date,.table .nowrap{white-space:nowrap}
.table th.col-status,.table td.col-status{min-width:80px}
.table th.col-dns,.table td.col-dns{min-width:90px}
.table th.col-date,.table th.col-date{min-width:110px}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

@media (max-width:860px){
  .table td.col-op,.table th.col-op{min-width:140px}
  .table td.col-op .op{margin-left:6px;font-size:12.5px}
}

.kpi{background:linear-gradient(135deg,#fff,var(--shuxu-5));border:1px solid var(--line);border-radius:var(--r-card);padding:16px 18px}
.kpi .k{font-size:12.5px;color:var(--sub)}
.kpi .v{font-size:26px;font-weight:800;letter-spacing:-.02em;
  background:linear-gradient(135deg,var(--shuxu-deep),var(--shuxu-1) 60%,var(--shuxu-3));-webkit-background-clip:text;background-clip:text;color:transparent}
.kpi .d{font-size:12px;color:var(--ok)}

.qbar{height:4px;border-radius:99px;background:var(--line);margin-top:9px;overflow:hidden}
.qbar i{display:block;height:100%;border-radius:99px;transition:width .35s ease}


.kpi .qs{font-size:14px;font-weight:700;color:var(--muted);background:none;
  -webkit-background-clip:border-box;background-clip:border-box;margin-left:3px}

.empty{padding:44px 20px;text-align:center;color:var(--muted);font-size:13.5px}
.empty svg{opacity:.5;margin-bottom:8px}

.pager{display:flex;gap:6px;justify-content:flex-end;align-items:center;padding:14px 18px;flex-wrap:wrap}
.pager .p{min-width:32px;height:32px;padding:0 10px;border-radius:var(--r-pill);border:1px solid var(--line);
  background:#fff;color:var(--sub);font-size:13px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.pager .p.on{background:var(--grad-main);color:#fff;border-color:transparent}

.switch{width:42px;height:23px;border-radius:var(--r-pill);background:var(--grad-main);position:relative;cursor:pointer;transition:background .2s;display:inline-block;vertical-align:middle}
.switch::after{content:"";position:absolute;top:2px;right:2px;width:19px;height:19px;border-radius:50%;background:#fff;transition:all .2s}
.switch.off{background:#D7E1F2}
.switch.off::after{right:auto;left:2px}


.switch.on{background:var(--grad-main)}
.switch.on::after{right:2px;left:auto}


.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;height:64px;gap:10px}
.shuxu-logo{image-rendering:auto;filter:drop-shadow(0 2px 6px rgba(0,82,217,.18))}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:800;font-size:16.5px;letter-spacing:-.02em}
.brand .tagline{font-size:11.5px;font-weight:600;color:#fff;background:var(--grad-main);padding:3px 10px;border-radius:var(--r-pill)}
.nav .menu{display:flex;align-items:center;gap:4px;margin-left:18px}
.nav .menu a{padding:8px 14px;border-radius:var(--r-pill);color:var(--sub);font-weight:600;font-size:14px}
.nav .menu a:hover{background:var(--shuxu-4);color:var(--shuxu-1)}
.nav .menu a.on{background:var(--shuxu-4);color:var(--shuxu-1)}
.nav .right{margin-left:auto;display:flex;align-items:center;gap:8px}
.lang-switch{display:inline-flex;background:var(--shuxu-4);border-radius:var(--r-pill);padding:3px}
.lang-switch button{border:0;background:transparent;color:var(--sub);font-size:12.5px;font-weight:700;
  padding:5px 13px;border-radius:var(--r-pill);cursor:pointer}
.lang-switch button.on{background:var(--grad-main);color:#fff;box-shadow:var(--shadow-blue)}
.burger{display:none;width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:#fff;
  align-items:center;justify-content:center;cursor:pointer}
.burger span{display:block;width:17px;height:2px;background:var(--shuxu-1);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:17px;height:2px;background:var(--shuxu-1)}
.burger span::before{top:-6px}.burger span::after{top:6px}


.hero{position:relative;padding:64px 0 54px;background:
  radial-gradient(1200px 460px at 50% -12%, #E8F1FF 0%, rgba(232,241,255,0) 62%),
  linear-gradient(180deg,#F4F9FF 0%, var(--shuxu-5) 100%);overflow:hidden}
.hero::before{content:"";position:absolute;left:50%;top:-160px;width:900px;height:420px;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(46,139,255,.18),transparent);pointer-events:none}
.hero h1{font-size:40px;line-height:1.22}
.hero h1 em{font-style:normal;background:linear-gradient(135deg,var(--shuxu-deep),var(--shuxu-1) 55%,var(--shuxu-3));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .desc{margin-top:14px;color:var(--sub);font-size:15.5px;max-width:660px}

.searchbar{margin:28px auto 0;max-width:720px;background:#fff;border:1px solid var(--line);border-radius:var(--r-pill);
  padding:8px;display:flex;gap:8px;box-shadow:var(--shadow-3)}
.searchbar .in{flex:1;display:flex;align-items:center;gap:6px;padding:0 14px}
.searchbar .in .fix{color:var(--shuxu-1);font-weight:700}
.searchbar .in input{flex:1;height:40px;border:0;background:transparent;font-size:15px;color:var(--ink)}
.searchbar .in input::placeholder{color:#B6C7E0}
.searchbar .btn{height:44px}

.stats{display:flex;gap:26px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.stats .s{text-align:center}
.stats .s b{display:block;font-size:24px;font-weight:800;background:linear-gradient(135deg,var(--shuxu-deep),var(--shuxu-1) 60%,var(--shuxu-3));-webkit-background-clip:text;background-clip:text;color:transparent}
.stats .s span{font-size:12.5px;color:var(--sub)}


.section{padding:44px 0}
.section .title{text-align:center;margin-bottom:8px}
.section .title h2{font-size:28px}
.section .title p{color:var(--sub);margin-top:8px;font-size:14.5px}
.feature{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:22px;transition:all .2s ease}
.feature:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:#C9DEFF}
.feature .ico{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:var(--grad-main);color:#fff;font-size:21px;font-weight:800;margin-bottom:14px;box-shadow:var(--shadow-blue)}
.feature h3{font-size:16px;margin-bottom:7px}
.feature p{color:var(--sub);font-size:13.5px;line-height:1.75}

.price{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:24px;position:relative;transition:all .2s}
.price:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.price.rec{border:2px solid var(--shuxu-1);box-shadow:var(--shadow-2)}
.price.rec .flag{position:absolute;top:-13px;left:24px;background:var(--grad-main);
  color:#fff;font-size:12px;font-weight:700;padding:4px 14px;border-radius:var(--r-pill)}
.price h3{font-size:18px}

.price .plan-hd{display:flex;align-items:center;gap:10px}
.price .plan-ico{display:inline-flex;flex:0 0 auto;line-height:0}
.price .plan-hd h3{font-size:17px}
.price .num{font-size:32px;font-weight:800;color:var(--shuxu-1);margin:10px 0 4px}
.price .num small{font-size:13px;color:var(--muted);font-weight:500}
.price ul{margin:14px 0 18px}
.price ul li{padding:6px 0;font-size:13.5px;color:var(--sub);display:flex;gap:8px;align-items:flex-start}
.price ul li::before{content:"✓";color:var(--ok);font-weight:800}

.faq .item{border-bottom:1px solid var(--line);padding:16px 4px}
.faq .item:last-child{border-bottom:0}
.faq .q{font-weight:700;font-size:15px;display:flex;align-items:center;gap:10px;cursor:pointer}
.faq .a{color:var(--sub);font-size:13.5px;margin-top:8px;line-height:1.8;padding-left:26px}


.footer{background:#fff;border-top:1px solid var(--line);padding:30px 0;margin-top:20px}
.footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.footer .links{display:flex;gap:16px;flex-wrap:wrap}
.footer .links a{color:var(--sub);font-size:13.5px}
.footer .links a:hover{color:var(--shuxu-1)}


.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:34px 18px;
  background:radial-gradient(900px 420px at 50% 0%,#E9F2FF 0%,rgba(233,242,255,0) 60%),linear-gradient(180deg,#F4F9FF,#EEF5FF)}
.auth-box{width:100%;max-width:440px;background:#fff;border:1px solid var(--line);border-radius:26px;
  box-shadow:var(--shadow-3);padding:34px 32px 28px}
.auth-box .logo{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:8px}
.auth-box h1{font-size:24px;text-align:center}
.auth-box .desc{text-align:center;color:var(--sub);font-size:13.5px;margin:8px 0 22px}
.auth-box .oauth{display:flex;gap:10px;justify-content:center;margin-top:18px}
.auth-box .oauth button{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;
  color:var(--sub);font-size:15px;font-weight:700;cursor:pointer;transition:all .18s}
.auth-box .oauth button:hover{border-color:var(--shuxu-2);color:var(--shuxu-1);transform:translateY(-2px)}
.auth-box .foot{margin-top:18px;text-align:center;font-size:13.5px;color:var(--sub)}
.auth-box .captcha-img{height:44px;border-radius:var(--r-pill);border:1px solid var(--line);cursor:pointer;background:var(--shuxu-5)}


.layout{display:flex;min-height:100vh;background:var(--shuxu-5)}
.sidebar{width:220px;flex:0 0 220px;background:#fff;border-right:1px solid var(--line);padding:16px 12px;position:sticky;top:0;
  
  height:100vh;height:100dvh;
  overflow-y:auto;overflow-x:hidden;
  
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:#CBD8EE transparent}

.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-track{background:transparent}
.sidebar::-webkit-scrollbar-thumb{background:#D6E2F5;border-radius:3px}
.sidebar::-webkit-scrollbar-thumb:hover{background:#B9CCEA}

.sidebar::after{content:"";display:block;height:14px;flex:0 0 14px}
.side-brand{display:flex;align-items:center;gap:10px;padding:10px 12px 16px;margin-bottom:6px;
  border-radius:16px;background:linear-gradient(135deg,var(--shuxu-4),#fff);border:1px solid var(--line)}



.side-brand .logo-holder{width:56px;height:56px;flex:0 0 56px;border-radius:13px;background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;padding:3px;box-shadow:var(--shadow-1);overflow:hidden}

.side-brand .logo-holder img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.side-brand .txt{display:flex;flex-direction:column;min-width:0}
.side-brand .txt b{font-size:15px;font-weight:800;line-height:1.3;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

.side-brand .txt span{font-size:13px;font-weight:700;color:var(--sub);margin-top:3px;letter-spacing:.2px}
.sidebar a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;color:var(--sub);font-size:14px;font-weight:600;margin-bottom:2px;
  
  -webkit-user-drag:none;user-select:text;-webkit-user-select:text;cursor:pointer}
.sidebar a .ico,.sidebar a .i,.sidebar a .pill{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
.sidebar .side-brand{user-select:text;-webkit-user-select:text}

.layout .sidebar a{user-select:text;-webkit-user-select:text;-webkit-user-drag:none}
.sidebar a:hover{background:var(--shuxu-5);color:var(--shuxu-1)}
.sidebar a.on{background:linear-gradient(135deg,var(--shuxu-4),#fff);color:var(--shuxu-1);box-shadow:inset 3px 0 0 var(--shuxu-1);font-weight:700}
.sidebar a .i{width:20px;height:20px;border-radius:6px;flex:0 0 20px;background:var(--grad-main);opacity:.9}
.content{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:62px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:12px;padding:0 22px;position:sticky;top:0;z-index:50}
.topbar .crumb{font-size:13.5px;color:var(--muted)}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--grad-main);
  color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}
.page{padding:22px;flex:1}
/* 授权异常横幅（后台顶栏下方） */
.lic-warn{margin:12px 22px 0;padding:10px 14px;border-radius:10px;display:flex;align-items:center;gap:8px;
  font-size:13px;font-weight:600;color:#b42318;background:#fEE4E2;border:1px solid #fda29b}
html[data-theme='dark'] .lic-warn{color:#fda29b;background:rgba(180,35,24,.16);border-color:rgba(253,162,155,.4)}





.save-bar{position:sticky;bottom:0;z-index:30;margin-top:18px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 16px;border:1px solid var(--line);border-radius:12px;
  background:rgba(255,255,255,.94);backdrop-filter:blur(8px);
  box-shadow:0 -4px 18px rgba(16,48,96,.10)}
.save-bar .sb-tip{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:7px;min-width:0}
.save-bar .sb-tip i{width:6px;height:6px;border-radius:50%;background:var(--warn,#F79009);flex:0 0 auto}
.save-bar .sb-act{display:flex;align-items:center;gap:10px;margin-left:auto}
@media (max-width:640px){
  .save-bar{padding:10px 12px;border-radius:10px}
  .save-bar .sb-tip{font-size:12px}
}
.page-head{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.page-head h2{font-size:21px}
.page-head .right{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

.modal-mask{position:fixed;inset:0;background:rgba(16,42,84,.42);backdrop-filter:blur(3px);display:flex;
  align-items:center;justify-content:center;padding:20px;z-index:200}
.modal{width:100%;max-width:520px;background:#fff;border-radius:22px;box-shadow:var(--shadow-3);overflow:hidden;max-height:88vh;display:flex;flex-direction:column}
.modal .hd{padding:16px 20px;border-bottom:1px solid var(--line);font-weight:700;display:flex;align-items:center}
.modal .hd .x{margin-left:auto;cursor:pointer;color:var(--muted);font-size:20px;line-height:1}
.modal .bd{padding:20px;overflow-y:auto}
.modal .ft{padding:14px 20px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end}

.toast-wrap{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:999;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-2);border-radius:var(--r-pill);
  padding:10px 20px;font-size:13.5px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:8px;
  animation:toastIn .24s ease}
.toast.ok{border-color:#A9E7C8;color:var(--ok)}
.toast.err{border-color:#FBC7C2;color:var(--bad)}
@keyframes toastIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

.loading{padding:40px;text-align:center;color:var(--muted);font-size:13.5px}
.spinner{width:26px;height:26px;border:3px solid var(--shuxu-4);border-top-color:var(--shuxu-1);border-radius:50%;
  animation:spin .8s linear infinite;margin:0 auto 10px}
@keyframes spin{to{transform:rotate(360deg)}}


.admin-login{min-height:100vh;min-height:100dvh;display:flex;padding:34px 18px;
  background:
    radial-gradient(1000px 520px at 12% 8%, rgba(52,171,252,.55) 0%, rgba(52,171,252,0) 58%),
    radial-gradient(900px 520px at 88% 92%, rgba(0,75,215,.65) 0%, rgba(0,75,215,0) 60%),
    linear-gradient(135deg,#0034B5 0%,#0034B5 38%,#0052D9 68%,#266FE8 100%);
  position:relative;
  
  overflow-x:hidden;overflow-y:auto;
  -webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
.admin-login::before{content:"";position:fixed;width:620px;height:620px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,255,255,.20),rgba(255,255,255,0));top:-190px;right:-150px;animation:floatY 9s ease-in-out infinite;pointer-events:none;z-index:0}
.admin-login::after{content:"";position:fixed;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,255,255,.13),rgba(255,255,255,0));bottom:-210px;left:-160px;animation:floatY 11s ease-in-out infinite reverse;pointer-events:none;z-index:0}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(26px)}}
.admin-login .panel{position:relative;z-index:2;width:100%;max-width:980px;display:grid;grid-template-columns:1.02fr .98fr;
  background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 34px 80px rgba(0,20,80,.36);
  
  margin:auto}
.admin-login .left{position:relative;background:var(--grad-deep);color:#fff;padding:44px 40px;
  display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.admin-login .left::after{content:"";position:absolute;inset:0;
  background:radial-gradient(420px 420px at 78% 16%,rgba(255,255,255,.22),rgba(255,255,255,0) 62%)}
.admin-login .left > *{position:relative;z-index:2}
.admin-login .left .logo-box{margin-bottom:18px}
.admin-login .left h2{font-size:28px;margin:0 0 10px;letter-spacing:-.02em}
.admin-login .left .ver{display:inline-flex;align-items:center;height:26px;padding:0 13px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);font-size:12.5px;font-weight:700;margin-bottom:14px}
.admin-login .left p{opacity:.92;font-size:14px;line-height:1.95;margin:0}
.admin-login .left .points{margin-top:24px;display:flex;flex-direction:column;gap:12px}
.admin-login .left .points div{display:flex;gap:10px;align-items:center;font-size:13.5px;opacity:.96}
.admin-login .left .points i{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.3);display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:12px;font-weight:800}
.admin-login .right{padding:42px 38px;background:#fff}
.admin-login .right .head{text-align:center;margin-bottom:22px}
.admin-login .right .head img{margin:0 auto 10px}
.admin-login .right h1{font-size:23px;background:linear-gradient(135deg,var(--shuxu-deep),var(--shuxu-1));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.admin-login .right .desc{color:var(--sub);font-size:13.5px;margin-top:8px}
.admin-login .right .input{background:#F7FAFF}
.admin-login .right .input:focus{box-shadow:0 0 0 4px rgba(0,82,217,.14)}
.admin-login .right .btn.block{height:46px;font-size:15px;margin-top:4px}
.admin-login .right .captcha-img{height:44px;border-radius:var(--r-pill);border:1px solid var(--line);cursor:pointer;background:var(--shuxu-5)}
.admin-login .shield{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:20px;
  font-size:12px;color:var(--muted)}
.admin-login .shield b{color:var(--shuxu-1);font-weight:700}


.layout .sidebar{background:linear-gradient(180deg,#fff 0%,#FBFCFF 100%)}
.sidebar .grp::after{content:"";display:block;height:1px;background:var(--line);margin-top:7px;opacity:.7}
.topbar{background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(246,250,255,.96))}
.topbar .crumb{font-weight:600;color:var(--sub)}
.card .hd{background:transparent}
.card .hd::before{content:"";width:4px;height:15px;border-radius:3px;background:var(--grad-main);display:inline-block}
.table th{background:linear-gradient(180deg,#F7FAFF,#F2F7FF)}
.pill{background:var(--shuxu-4)}
.pill.out{background:#fff}


@media (max-width:1024px){
  .g4,.g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero h1{font-size:32px}
}
@media (max-width:860px){
  .admin-login{padding:30px 14px;align-items:flex-start;overflow-y:auto}
  .admin-login .panel{grid-template-columns:1fr;max-width:520px;border-radius:24px}
  .admin-login .left{display:none}
  .admin-login .right{padding:30px 22px}
  
  .sidebar{position:fixed;left:0;top:0;bottom:0;height:100vh;height:100dvh;z-index:100;
    width:250px;flex:0 0 250px;
    transform:translateX(-100%);
    transition:transform .28s cubic-bezier(.22,.61,.36,1);
    box-shadow:var(--shadow-3);
    
    overflow-y:auto;overflow-x:hidden;
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    
    padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  .sidebar.open{transform:translateX(0)}
  
  .sidebar a{padding:12px 13px;font-size:14.5px;min-height:44px}
  .sidebar .side-brand{padding:12px 12px 14px}
  



  .layout{overflow-x:clip}
  @supports not (overflow-x: clip) { .layout{overflow-x:hidden} }
  .sidebar.open{transform:none}
  .sidebar-mask{position:fixed;inset:0;background:rgba(16,42,84,.4);z-index:99}
  .nav .menu{position:fixed;left:0;right:0;top:64px;background:#fff;border-bottom:1px solid var(--line);
    flex-direction:column;align-items:stretch;padding:10px 16px;gap:2px;transform:translateY(-12px);
    opacity:0;pointer-events:none;transition:all .2s ease;margin:0}
  .nav .menu.open{transform:none;opacity:1;pointer-events:auto}
  .burger{display:flex}

  
  .page{padding:16px 14px}
  .page-head{gap:10px;margin-bottom:14px}
  .page-head h2{font-size:19px}
  .page-head .right{width:100%;margin-left:0}
  .topbar{padding:0 14px;gap:8px}
  .topbar .crumb{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .topbar .right{gap:7px}
  
  .card .hd{padding:12px 14px;font-size:14px}
  .card .bd{padding:14px}
  
  

  .table-wrap{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
    max-width:100%;width:100%;min-width:0}
  .table{min-width:600px}
  .card{min-width:0;overflow:hidden}
  
  .table-wrap{position:relative}
  
  .grid.g2,.grid.g3,.grid.g4,.grid.g5{grid-template-columns:repeat(2,1fr);gap:12px}
  
  .kpi .v{font-size:21px}
}
@media (max-width:640px){
  .wrap{padding:0 14px}
  .g2,.g3,.g4,.g5{grid-template-columns:1fr}
  .hero{padding:40px 0 34px}
  .hero h1{font-size:26px}
  .hero .desc{font-size:14px}
  .searchbar{flex-direction:column;border-radius:22px;padding:12px}
  .searchbar .btn{width:100%}
  .section{padding:32px 0}
  .section .title h2{font-size:22px}
  .stats{gap:16px}
  .auth-box{padding:26px 20px 22px;border-radius:22px}
  .page{padding:14px}
  .page-head h2{font-size:18px}
  .table th,.table td{padding:9px 10px;font-size:12.8px}
  .kpi .v{font-size:22px}

  
  .page{padding:12px 10px}
  .grid.g2,.grid.g3,.grid.g4,.grid.g5{grid-template-columns:1fr}
  .card .hd{padding:11px 12px}
  .card .bd{padding:12px}
  .page-head h2{font-size:18px}
  .topbar{height:56px;padding:0 12px}
  
  .page-head .right .btn,.card .bd .row .btn{flex:1 1 auto;min-width:0}
  
  .modal{max-width:calc(100vw - 24px);max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
}
@media print{.nav,.sidebar,.topbar{display:none}}


.sidebar a .ico{width:20px;height:20px;flex:0 0 20px;display:inline-flex;align-items:center;justify-content:center;
  color:var(--shuxu-1);opacity:.85}
.sidebar a.on .ico{color:var(--shuxu-1);opacity:1}
.sidebar a:hover .ico{opacity:1}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px;vertical-align:-1px;
  border:1px solid rgba(0,0,0,.08)}


[data-scope="admin"][data-scheme="green"]{
  --shuxu-deep:#075E3A; --shuxu-2:#0A8A55; --shuxu-1:#12B76A; --shuxu-3:#5FE19F;
  --shuxu-4:#E4F8EE; --shuxu-5:#F3FCF7; --line:#CDEEDD;
  --grad-main:linear-gradient(135deg,var(--shuxu-3) 0%,var(--shuxu-1) 100%);
  --grad-deep:linear-gradient(135deg,var(--shuxu-deep) 0%,var(--shuxu-1) 55%,var(--shuxu-3) 100%);
}
[data-scope="admin"][data-scheme="purple"]{
  --shuxu-deep:#3A1F9E; --shuxu-2:#5B37D6; --shuxu-1:#7A5AF8; --shuxu-3:#B79DFF;
  --shuxu-4:#EFE9FF; --shuxu-5:#F8F6FF; --line:#DFD4FF;
  --grad-main:linear-gradient(135deg,var(--shuxu-3) 0%,var(--shuxu-1) 100%);
  --grad-deep:linear-gradient(135deg,var(--shuxu-deep) 0%,var(--shuxu-1) 55%,var(--shuxu-3) 100%);
}
[data-scope="admin"][data-scheme="orange"]{
  --shuxu-deep:#9A4A00; --shuxu-2:#D96B06; --shuxu-1:#F79009; --shuxu-3:#FFC46B;
  --shuxu-4:#FFF2DF; --shuxu-5:#FFFAF3; --line:#FFE0B8;
  --grad-main:linear-gradient(135deg,var(--shuxu-3) 0%,var(--shuxu-1) 100%);
  --grad-deep:linear-gradient(135deg,var(--shuxu-deep) 0%,var(--shuxu-1) 55%,var(--shuxu-3) 100%);
}
[data-scope="admin"][data-scheme="dark"]{
  --shuxu-deep:#0F1B33; --shuxu-2:#1F2A44; --shuxu-1:#2B4472; --shuxu-3:#5B7BB0;
  --shuxu-4:#E7ECF5; --shuxu-5:#F4F6FA; --line:#CBD6E8;
  --grad-main:linear-gradient(135deg,var(--shuxu-3) 0%,var(--shuxu-1) 100%);
  --grad-deep:linear-gradient(135deg,var(--shuxu-deep) 0%,var(--shuxu-1) 55%,var(--shuxu-3) 100%);
}


.beian a{display:inline-flex;align-items:center;color:var(--muted);text-decoration:none}
.beian a:hover{color:var(--shuxu-1)}


[data-scope="front"]{
  --shuxu-1:var(--theme);
  --shuxu-deep:var(--theme-deep);
  --shuxu-3:var(--theme-soft);
}
[data-scope="front"] .btn:hover,[data-scope="front"] .nav a:hover{color:var(--theme-deep)}
[data-scope="front"] .searchbar .btn,[data-scope="front"] .price.rec .flag{background:var(--theme)}
[data-scope="front"] .pill.ok{background:var(--theme-soft);color:var(--theme-deep)}














[data-scope="front"] .pill.ok{background:var(--theme);color:#fff}

html[data-eye-site="1"] .pill.ok{background:#16325C !important;color:#9CC4FB !important}









.pill.paid{background:#E6F8F0;color:#15803D}
.pill.unpaid{background:#FEF3E4;color:#93370D}
[data-scope="front"] .pill.paid{background:#E6F8F0;color:#15803D}
[data-scope="front"] .pill.unpaid{background:#FEF3E4;color:#93370D}

html[data-eye-site="1"] .pill.paid,html[data-eye-admin="1"] .pill.paid{background:#16351F !important;color:#7FD9A0 !important}
html[data-eye-site="1"] .pill.unpaid,html[data-eye-admin="1"] .pill.unpaid{background:#3A2A12 !important;color:#F3C878 !important}






:root{--eye-bg:#F2EFE4;--eye-card:#FBF8EE;--eye-ink:#4A4436;--eye-line:#DED6C0;--eye-soft:#EAE3D0}

html[data-eye-site="1"] body,
html[data-eye-admin="1"] body,html[data-eye-site="1"] body{background:var(--eye-bg) !important;color:var(--eye-ink) !important}

html[data-eye-site="1"] .card,
html[data-eye-site="1"] .price,
html[data-eye-site="1"] .footer,
html[data-eye-site="1"] .searchbar,
html[data-eye-site="1"] .searchbar .in,
html[data-eye-admin="1"] .card,html[data-eye-site="1"] .card,
html[data-eye-admin="1"] .topbar,html[data-eye-site="1"] .topbar,
html[data-eye-admin="1"] .sidebar,html[data-eye-site="1"] .sidebar,
html[data-eye-admin="1"] .table th,html[data-eye-site="1"] .table th,
html[data-eye-admin="1"] .table td,html[data-eye-site="1"] .table td,
html[data-eye-admin="1"] .input,html[data-eye-site="1"] .input,
html[data-eye-admin="1"] .kpi,html[data-eye-site="1"] .kpi,
html[data-eye-admin="1"] .page-head,html[data-eye-site="1"] .page-head,
html[data-eye-admin="1"] .panel,html[data-eye-site="1"] .panel,
html[data-eye-admin="1"] .admin-login .right,html[data-eye-site="1"] .admin-login .right{
  background:var(--eye-card) !important;color:var(--eye-ink) !important;border-color:var(--eye-line) !important}

html[data-eye-site="1"] .hero,
html[data-eye-site="1"] .section:nth-child(even),
html[data-eye-admin="1"] .sidebar,html[data-eye-site="1"] .sidebar{background:var(--eye-soft) !important}

html[data-eye-site="1"] h1,html[data-eye-site="1"] h2,html[data-eye-site="1"] h3,
html[data-eye-site="1"] p,html[data-eye-site="1"] span,html[data-eye-site="1"] a,
html[data-eye-site="1"] li,html[data-eye-site="1"] td,html[data-eye-site="1"] th,
html[data-eye-site="1"] b,html[data-eye-site="1"] label,html[data-eye-site="1"] .muted,
html[data-eye-site="1"] .sub,
html[data-eye-admin="1"] h1,html[data-eye-site="1"] h1,html[data-eye-admin="1"] h2,html[data-eye-site="1"] h2,html[data-eye-admin="1"] h3,html[data-eye-site="1"] h3,
html[data-eye-admin="1"] p,html[data-eye-site="1"] p,html[data-eye-admin="1"] span,html[data-eye-site="1"] span,html[data-eye-admin="1"] a,html[data-eye-site="1"] a,
html[data-eye-admin="1"] td,html[data-eye-site="1"] td,html[data-eye-admin="1"] th,html[data-eye-site="1"] th,html[data-eye-admin="1"] b,html[data-eye-site="1"] b,
html[data-eye-admin="1"] label,html[data-eye-site="1"] label,html[data-eye-admin="1"] .muted,html[data-eye-site="1"] .muted,html[data-eye-admin="1"] .sub,html[data-eye-site="1"] .sub,
html[data-eye-admin="1"] .crumb,html[data-eye-site="1"] .crumb{color:var(--eye-ink) !important}

html[data-eye-site="1"] .btn,html[data-eye-admin="1"] .btn,html[data-eye-site="1"] .btn{
  background:var(--eye-soft) !important;color:var(--eye-ink) !important;border-color:var(--eye-line) !important}
html[data-eye-site="1"] .btn:hover,html[data-eye-admin="1"] .btn:hover,html[data-eye-site="1"] .btn:hover{filter:brightness(.96)}
html[data-eye-site="1"] .nav,html[data-eye-site="1"] .footer{border-color:var(--eye-line) !important}
html[data-eye-admin="1"] .sidebar a.on,html[data-eye-site="1"] .sidebar a.on{background:var(--eye-soft) !important}


.eye-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);
  background:#fff;border-radius:999px;padding:6px 13px;font-size:12.5px;cursor:pointer;
  color:var(--sub);line-height:1.4;transition:all .18s ease;font-family:inherit}
.eye-btn:hover{border-color:var(--shuxu-1);color:var(--shuxu-1)}
.eye-btn svg{width:15px;height:15px;flex:0 0 15px;display:block}
.eye-btn.on{background:linear-gradient(135deg,#FFE9B8,#FFD980);border-color:#E8B84B;color:#6B4E00;font-weight:600;
  box-shadow:0 2px 8px rgba(232,184,75,.28)}
.eye-btn .sun{display:none}
.eye-btn.on .sun{display:block}
.eye-btn.on .moon{display:none}


.pay-list{display:flex;flex-direction:column;gap:10px}
.pay-item{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.pay-head{display:flex;align-items:center;gap:8px;padding:11px 14px;cursor:pointer;user-select:none}
.pay-head:hover{background:var(--shuxu-4,#F5F9FF)}
.pay-head .rank{min-width:22px;height:22px;border-radius:7px;background:var(--shuxu-1);color:#fff;
  font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:700}
.pay-head .nm{font-size:14px}
.pay-head .code{font-size:12px;color:var(--muted);margin-left:4px}
.pay-head .grow{flex:1}
.pay-head .caret{color:var(--muted);font-size:13px;transition:transform .18s}
.pay-head .caret.up{transform:rotate(180deg)}
.pay-body{padding:4px 14px 14px;border-top:1px dashed var(--line)}
.lb{font-size:12.5px;color:var(--sub);min-width:52px}
.input.sm{padding:7px 10px;font-size:13px;height:auto;border-radius:9px}
select.input.sm{height:auto}
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.cfg label{display:block;font-size:12.5px;color:var(--sub);margin-bottom:4px}
@media (max-width:640px){.cfg-grid{grid-template-columns:1fr}.pay-head{padding:10px 12px}}

.pay-ico{width:22px;height:22px;flex:0 0 22px;align-self:center;display:inline-flex;align-items:center;justify-content:center;
  border-radius:7px;overflow:hidden;box-shadow:0 1px 3px rgba(10,40,90,.16)}
.pay-ico svg{width:100%;height:100%;display:block}
.pay-ico.lg{width:34px;height:34px;flex:0 0 34px;border-radius:10px;box-shadow:0 3px 9px rgba(10,40,90,.18)}


.pill.gray{background:#EEF2F7;color:#475467}


.pay-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:9px}
.pay-opt{display:flex;flex-direction:column;align-items:center;gap:7px;padding:13px 8px;
  border:1.5px solid var(--line);border-radius:13px;cursor:pointer;background:#fff;
  transition:all .18s ease;position:relative;user-select:none}
.pay-opt{position:relative}
.pay-opt .nm{font-size:12.5px;color:var(--ink);font-weight:500}
.pay-opt .tick{position:absolute;top:5px;right:6px;width:15px;height:15px;border-radius:50%;
  background:var(--shuxu-1);color:#fff;font-size:10px;font-style:normal;display:flex;
  align-items:center;justify-content:center;font-weight:700}
.pay-opt.on .pay-ico{transform:scale(1.06)}
.pay-opt:hover{border-color:var(--shuxu-1)}
.pay-opt.on{border-color:var(--shuxu-1);background:var(--shuxu-4,#F5F9FF);box-shadow:0 3px 10px rgba(0,82,217,.12)}
.pay-opt.off{opacity:.45;cursor:not-allowed}
.pay-opt.off:hover{border-color:var(--line)}
.pay-opt em{font-size:11px;font-style:normal;color:#B03030}

.req{color:#D93025;font-style:normal;margin-left:2px}


.card-ico{width:30px;height:30px;flex:0 0 30px;align-self:center;display:inline-flex;align-items:center;justify-content:center;
  border-radius:9px;overflow:hidden;box-shadow:0 2px 6px rgba(10,40,90,.16)}
.card-ico svg{width:100%;height:100%;display:block}
.card-ico.sm{width:26px;height:26px;flex:0 0 26px;border-radius:8px}
.card-ico.xs{width:24px;height:24px;flex:0 0 24px;border-radius:7px;box-shadow:0 1px 4px rgba(10,40,90,.14)}



.page-head h1,.page-head h2{display:inline-flex;align-items:center;font-size:22px;margin:0;line-height:1.35}
.ph-ico{display:inline-flex;align-items:center;justify-content:center;width:29px;height:29px;
  flex:0 0 29px;align-self:center;border-radius:9px;background:linear-gradient(135deg,var(--shuxu-1),var(--shuxu-2,#4A9BFF));
  color:#fff;margin-right:9px;box-shadow:0 2px 6px rgba(0,82,217,.22)}
.ph-ico svg{width:17px;height:17px}
.hd-ico{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;
  flex:0 0 24px;border-radius:7px;background:var(--shuxu-4,#EAF3FF);color:var(--shuxu-1)}
.hd-ico svg{width:15px;height:15px}


.dash-hero{display:grid;grid-template-columns:1fr 300px;gap:14px;
  border-radius:16px;overflow:hidden;box-shadow:0 6px 20px rgba(0,42,120,.16)}
.hero-main{padding:20px 22px;color:#fff;background:linear-gradient(120deg,#0034B5 0%,#0052D9 55%,#266FE8 100%);position:relative}
.hero-main::after{content:"";position:absolute;right:-30px;top:-40px;width:170px;height:170px;
  border-radius:50%;background:rgba(255,255,255,.10)}
.hero-main::before{content:"";position:absolute;right:60px;bottom:-60px;width:130px;height:130px;
  border-radius:50%;background:rgba(255,255,255,.07)}
.hero-ico{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:9px;background:rgba(255,255,255,.18);backdrop-filter:blur(2px)}
.hero-main>div:first-child{font-size:13.5px;opacity:.92;position:relative;z-index:1}
.hero-num{font-size:34px;font-weight:800;letter-spacing:-.5px;margin:8px 0 12px;
  position:relative;z-index:1;text-shadow:0 2px 8px rgba(0,20,80,.25)}
.hero-sub{display:flex;flex-wrap:wrap;gap:8px;position:relative;z-index:1}
.hero-sub .chip{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;
  background:rgba(255,255,255,.15);font-size:12.5px;backdrop-filter:blur(2px)}
.hero-sub .chip i{display:inline-flex}
.hero-sub .chip b{font-weight:700;margin-left:2px}
.hero-side{background:#fff;padding:14px 16px;display:flex;flex-direction:column;justify-content:center;gap:9px}
.hero-side .hs{display:flex;align-items:center;justify-content:space-between;font-size:13px;
  padding-bottom:8px;border-bottom:1px dashed var(--line)}
.hero-side .hs:last-child{border-bottom:none;padding-bottom:0}
.hs-k{color:var(--sub)}
.hs-v{font-weight:700;font-size:15px;color:var(--ink)}
.hs-v.warn{color:#D97706}


.kpi{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:center;padding:15px 16px}
.kpi .kpi-ico{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 3px 8px rgba(10,40,90,.14)}
.kpi .kpi-ico svg{width:19px;height:19px}
.kpi-ico.blue{background:linear-gradient(135deg,var(--shuxu-2,#4A9BFF),var(--shuxu-1,#0062E6))}
.kpi-ico.green{background:linear-gradient(135deg,#5BD6A8,var(--ok,#0E9F6E))}
.kpi-ico.orange{background:linear-gradient(135deg,#FFC24D,#F79009)}
.kpi-ico.purple{background:linear-gradient(135deg,#B39BFF,#7A5AF8)}
.kpi .kpi-txt{min-width:0}
.kpi .d{grid-column:1/-1;font-size:12px;color:var(--muted);margin-top:2px}

.kpi.mini{display:block;padding:14px 16px}
.kpi.mini .k{margin-bottom:6px}
.kpi.mini .v{font-size:16px;line-height:1.45;word-break:break-all;overflow-wrap:anywhere}
.kpi.mini .v.sm{font-size:14px}
@media (max-width:900px){.dash-hero{grid-template-columns:1fr}.hero-num{font-size:28px}}


[data-eye-admin="1"] .kpi-ico,[data-eye-site="1"] .kpi-ico,
[data-eye-site="1"] .kpi-ico{filter:saturate(.55) brightness(1.06);box-shadow:0 2px 5px rgba(0,0,0,.10)}
[data-eye-admin="1"] .ph-ico,[data-eye-site="1"] .ph-ico{filter:saturate(.5) brightness(1.08);box-shadow:0 1px 4px rgba(0,0,0,.10)}
[data-eye-admin="1"] .card-ico,[data-eye-site="1"] .card-ico,
[data-eye-site="1"] .card-ico{filter:saturate(.6) brightness(1.05)}
[data-eye-admin="1"] .hero-main,[data-eye-site="1"] .hero-main{background:linear-gradient(120deg,#3A4A5C 0%,#4C6076 55%,#5F7488 100%)}
[data-eye-admin="1"] .dash-hero,[data-eye-site="1"] .dash-hero{box-shadow:0 4px 14px rgba(0,0,0,.12)}


.cron-box{margin-top:14px;border:1px solid var(--line);border-radius:14px;
  background:linear-gradient(180deg,var(--shuxu-5),#fff);padding:14px 16px}
.cron-box .cron-hd{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px}
.cron-box .cron-ico{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:inline-flex;
  align-items:center;justify-content:center;background:var(--shuxu-1);color:#fff;
  box-shadow:0 4px 10px rgba(0,82,217,.25);align-self:center}
.cron-box .cron-ico svg{width:16px;height:16px;display:block}
.cron-box .cron-title{font-size:13.5px;font-weight:700;color:var(--shuxu-deep);line-height:1.4}
.cron-box .cron-sub{font-size:12px;color:var(--muted);margin-top:2px;line-height:1.5}
.cron-box .cron-row{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap}
.cron-box .cron-url{flex:1 1 260px;min-width:0;display:block;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12.5px;line-height:1.6;color:var(--shuxu-deep);background:#fff;border:1px dashed var(--line);
  border-radius:10px;padding:8px 10px;word-break:break-all}
.cron-box .cron-url.sm{flex:1 1 200px;font-size:12px;padding:6px 9px}
.cron-box .btn{flex:0 0 auto;align-self:stretch;display:inline-flex;align-items:center}
.cron-box .cron-tips{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}
.cron-box .tip-tag{flex:0 0 auto;font-size:11.5px;font-weight:600;color:var(--shuxu-1);
  background:var(--shuxu-5);border:1px solid var(--line);border-radius:999px;padding:3px 10px}
.cron-box .cron-note{margin-top:10px;font-size:12px;line-height:1.7;color:var(--sub);
  border-top:1px dashed var(--line);padding-top:9px}
.cron-box .cron-note b{color:var(--shuxu-deep)}

.steps{margin:0;padding-left:20px;font-size:13px;line-height:2;color:var(--sub)}
.steps li{margin-bottom:2px}
.steps li::marker{color:var(--shuxu-1);font-weight:700}
@media(max-width:640px){
  .cron-box{padding:12px}
  .cron-box .cron-row{flex-direction:column}
  .cron-box .btn{width:100%;justify-content:center}
}




.hico{display:inline-block;vertical-align:middle;flex:0 0 auto}
.feature .ico svg{width:24px;height:24px}


.hero-tag{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 14px;margin-bottom:18px;
  border-radius:var(--r-pill);background:rgba(255,255,255,.92);border:1px solid #C9DEFF;
  color:var(--shuxu-1);font-size:13px;font-weight:700;box-shadow:var(--shadow-1)}
.hero-tag .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(18,160,110,.18)}


.intro{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;align-items:start}
.intro-main{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:24px;display:flex;gap:16px;min-width:0}
.intro-ico{width:48px;height:48px;flex:0 0 48px;border-radius:14px;background:var(--grad-main);color:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-blue)}
.intro-main h3{font-size:17px;margin-bottom:8px}
.intro-main p{color:var(--sub);font-size:13.8px;line-height:1.9}
.intro-main p + p{margin-top:8px}
.intro-demo{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px;padding:12px 14px;
  background:var(--shuxu-5);border:1px dashed #C9DEFF;border-radius:12px}
.intro-demo code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.8px;
  background:#fff;border:1px solid var(--line);border-radius:8px;padding:4px 9px;color:var(--shuxu-deep);font-weight:600}
.intro-arrow{color:var(--shuxu-2);display:inline-flex}

.intro-vs{display:flex;flex-direction:column;gap:12px;min-width:0}
.vs-col{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:18px}
.vs-col.bad{border-color:#F5D3D0}
.vs-col.good{border-color:#BFE6D5}
.vs-hd{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14.5px;margin-bottom:10px}
.vs-ico{width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;flex:0 0 24px}
.vs-ico.bad{background:linear-gradient(135deg,#FF6A5E,#F04438)}
.vs-ico.good{background:linear-gradient(135deg,#28C08A,#12A06E)}
.vs-col ul{display:flex;flex-direction:column;gap:8px}
.vs-col li{font-size:13px;color:var(--sub);line-height:1.6;padding-left:14px;position:relative}
.vs-col li::before{content:"";position:absolute;left:2px;top:8px;width:5px;height:5px;border-radius:50%}
.vs-col.bad li::before{background:#F04438}
.vs-col.good li::before{background:var(--ok)}


.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:0}
.step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:20px 18px;transition:all .2s ease}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:#C9DEFF}
.step-no{position:absolute;top:14px;right:16px;font-size:26px;font-weight:800;color:var(--shuxu-4);line-height:1}
.step-ico{width:44px;height:44px;border-radius:13px;background:var(--grad-main);color:#fff;
  display:flex;align-items:center;justify-content:center;margin-bottom:12px;box-shadow:var(--shadow-blue)}
.step h3{font-size:15.5px;margin-bottom:6px}
.step p{font-size:13px;color:var(--sub);line-height:1.75}

.step:not(:last-child)::after{content:"";position:absolute;top:40px;right:-11px;width:8px;height:8px;
  border-top:2px solid var(--shuxu-2);border-right:2px solid var(--shuxu-2);transform:rotate(45deg);opacity:.55}


.scene{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:20px;transition:all .2s ease}
.scene:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:#C9DEFF}
.scene-ico{width:46px;height:46px;border-radius:14px;background:var(--shuxu-4);color:var(--shuxu-1);
  display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.scene h3{font-size:15.5px;margin-bottom:6px}
.scene p{font-size:13px;color:var(--sub);line-height:1.75}


@media (max-width:860px){
  .intro{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(2,1fr)}
  .step:not(:last-child)::after{display:none}
  .intro-main{padding:20px}

  
  .nav .wrap{padding:0 12px;gap:8px}
  .nav .right{gap:6px;min-width:0}
  .nav .right .btn{padding:0 12px}
  .burger{width:38px;height:38px;flex:0 0 38px}
  .lang-switch button{padding:5px 10px;font-size:12px}
}
@media (max-width:640px){
  .steps{grid-template-columns:1fr}
  .intro-main{flex-direction:column;padding:18px;gap:12px}
  .intro-demo{gap:6px;padding:10px 12px}
  .intro-demo code{font-size:12px;padding:3px 7px}
  .scene,.step{padding:17px 16px}
  .hero-tag{font-size:12.5px;height:28px;padding:0 12px}

  
  .nav .wrap{height:58px;padding:0 10px;gap:6px}
  .nav .right{gap:5px}
  .nav .right .btn{padding:0 10px;font-size:12.5px}
  .lang-switch button{padding:4px 8px;font-size:11.5px}
  .burger{width:34px;height:34px;flex:0 0 34px}
  
  .nav .brand span{display:none}
  .nav .right{gap:4px}
  .nav .right .btn{padding:0 9px;font-size:12px}
  .lang-switch button{padding:4px 7px;font-size:11px}
  .eye-btn .eye-txt{display:none}
  .eye-btn{padding:0 9px}
}


#features .grid,#scenes .grid,.steps{grid-auto-rows:1fr}




.legal .bd{padding:26px 28px}
.legal-lead{font-size:13.8px;color:var(--sub);line-height:1.9;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.legal-toc{list-style:none;margin:0 0 22px;padding:16px 18px;background:var(--shuxu-5);border:1px solid var(--line);border-radius:12px;
  display:grid;grid-template-columns:repeat(2,1fr);gap:7px 18px}
.legal-toc li{font-size:13px}
.legal-toc a{color:var(--sub);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.legal-toc a:hover{color:var(--shuxu-1)}
.legal-toc li::before{content:"—";color:var(--shuxu-2);margin-right:6px}
.legal-sec{margin-bottom:22px;scroll-margin-top:80px}
.legal-sec h3{font-size:15.5px;margin-bottom:8px;color:var(--ink)}
.legal-sec p{font-size:13.8px;color:var(--sub);line-height:2}
.legal-foot{margin-top:26px;padding-top:16px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--muted);line-height:1.9}


.logo-up{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.logo-prev{width:132px;height:76px;flex:0 0 132px;border:1px solid var(--line);border-radius:12px;background:var(--shuxu-5);
  display:flex;align-items:center;justify-content:center;overflow:hidden;padding:8px}
.logo-prev img{max-width:100%;max-height:60px;width:auto;object-fit:contain}
.logo-act{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;gap:9px}
.logo-act .err{color:var(--bad,#F04438)}
.logo-act .ok{color:var(--ok)}


.notice-item{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px;background:#fff;transition:all .18s ease}
.notice-item:hover{border-color:#C9DEFF;box-shadow:var(--shadow-1)}
.notice-item .ni-hd{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.notice-item .ni-hd b{font-size:14.5px}
.notice-item .ni-date{margin-left:auto;font-size:12.5px;color:var(--muted)}
.notice-item .ni-bd{margin-top:9px;font-size:13.5px;color:var(--sub);line-height:1.9;white-space:pre-wrap}
.notice-item .ni-tag{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:var(--r-pill);
  background:var(--shuxu-4);color:var(--shuxu-1);font-size:11.5px;font-weight:700}
.notice-unread{position:relative}
.notice-unread::after{content:"";position:absolute;left:-6px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:var(--warn)}


@media (max-width:860px){
  .legal .bd{padding:20px 18px}
  .legal-toc{grid-template-columns:1fr}
}
@media (max-width:640px){
  .legal .bd{padding:16px 14px}
  .legal-sec p{font-size:13.2px;line-height:1.9}
  .logo-up{gap:12px}
  .logo-prev{width:100%;flex:0 0 auto;height:70px}
}




.kw-cloud{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:18px auto 0;max-width:620px}
.kw{display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:var(--r-pill);
  background:#fff;border:1px solid var(--line);color:var(--sub);font-size:13px;font-weight:600;transition:all .18s ease}
.kw:hover{border-color:var(--shuxu-2);color:var(--shuxu-1);background:var(--shuxu-5);transform:translateY(-2px)}

.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lead{font-size:14px;color:var(--ink);line-height:1.95}
.prefix-demo{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 16px;background:var(--shuxu-5);
  border:1px dashed var(--shuxu-2);border-radius:12px}
.prefix-demo code{font-size:13px;color:var(--sub);font-family:ui-monospace,Menlo,Consolas,monospace}
.prefix-demo code.hl{color:var(--shuxu-1);font-weight:700;background:#fff;padding:3px 9px;border-radius:7px;border:1px solid var(--line)}
.prefix-demo .arw{color:var(--shuxu-2);font-weight:700}

.vs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vs-col{border:1px solid var(--line);border-radius:var(--r-card);padding:16px}
.vs-col.bad{background:#FFF6F6;border-color:#FFD9D9}
.vs-col.ok{background:#F3FBF7;border-color:#CDEEDF}
.vs-hd{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;margin-bottom:10px}
.vs-col.bad .vs-ico{background:#F04438}
.vs-col.ok .vs-ico{background:#12B76A}
.vs-col ul{margin:0;padding:0;list-style:none}
.vs-col li{position:relative;padding-left:16px;font-size:13px;color:var(--sub);line-height:1.9}

.feat{display:flex;gap:13px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);transition:all .2s ease}
.feat:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:#C9DEFF}
.feat-ico{flex:0 0 44px;width:44px;height:44px;border-radius:13px;background:var(--grad-main);color:#fff;
  display:inline-flex;align-items:center;justify-content:center}
.feat b{display:block;font-size:15px;margin-bottom:5px}
.feat p{font-size:13px;color:var(--sub);line-height:1.8}

.suffix{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 16px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-card);transition:all .18s ease}
.suffix:hover{border-color:#C9DEFF;box-shadow:var(--shadow-1);transform:translateY(-2px)}
.sf-name{font-weight:800;font-size:15px;color:var(--ink)}
.sf-price{margin-left:auto;font-weight:800;color:var(--shuxu-1);font-size:15px}
.sf-vendor{font-size:12px;color:var(--muted);width:100%;order:3}
.sf-go{order:4;font-size:13px;font-weight:600;color:var(--shuxu-1)}


.to-top{position:fixed;right:22px;bottom:26px;z-index:80;width:46px;height:46px;border:0;border-radius:50%;
  background:var(--grad-main);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 8px 22px rgba(0,82,217,.32);opacity:0;visibility:hidden;transform:translateY(12px) scale(.9);
  transition:all .25s cubic-bezier(.4,0,.2,1)}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,82,217,.42)}
.to-top:active{transform:translateY(0) scale(.94)}
.to-top::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--shuxu-2);opacity:0;transition:opacity .2s}
.to-top:focus-visible::after{opacity:.5}


.back-home{display:inline-flex;align-items:center;gap:6px;font-size:12.8px;color:var(--sub);
  padding:6px 12px;border-radius:var(--r-pill);transition:all .18s ease}
.back-home:hover{background:var(--shuxu-5);color:var(--shuxu-1)}
.back-home .bh-ico{display:inline-flex;color:var(--shuxu-1)}


.beian-link{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:12.5px;transition:color .18s}
.beian-link:hover{color:var(--shuxu-1)}
.beian-link svg{flex:0 0 auto;color:var(--shuxu-2)}


.faq-page .bd{padding:8px 22px}
.qa{border-bottom:1px dashed var(--line)}
.qa:last-child{border-bottom:0}
.qa summary{display:flex;align-items:center;gap:10px;padding:16px 0;cursor:pointer;list-style:none;
  font-size:14.5px;transition:color .18s}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--shuxu-1)}
.qa .qa-ico{flex:0 0 26px;width:26px;height:26px;border-radius:8px;background:var(--shuxu-4);color:var(--shuxu-1);
  display:inline-flex;align-items:center;justify-content:center}
.qa summary b{flex:1;min-width:0;font-weight:700}
.qa-arrow{flex:0 0 auto;width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
  transform:rotate(45deg) translateY(-2px);transition:transform .22s ease}
.qa[open] .qa-arrow{transform:rotate(-135deg) translateY(-2px)}
.qa[open] .qa-ico{background:var(--grad-main);color:#fff}
.qa-body{padding:0 0 18px 36px;font-size:13.6px;color:var(--sub);line-height:2;animation:qaIn .22s ease}
@keyframes qaIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}


@media (max-width:860px){
  .split,.vs{grid-template-columns:1fr}
  .faq-page .bd{padding:6px 16px}
}
@media (max-width:640px){
  .kw-cloud{gap:6px}
  .kw{height:28px;padding:0 11px;font-size:12px}
  .to-top{right:14px;bottom:16px;width:42px;height:42px}
  .qa-body{padding-left:0}
  .suffix{padding:12px 14px}
}


.hero{overflow:hidden}
.qa{overflow:hidden}
.qa summary b{overflow-wrap:anywhere;word-break:break-word}
.qa-body{overflow-wrap:anywhere;word-break:break-word}
@media (max-width:640px){
  .stats{gap:16px}
  .stats .s b{font-size:21px}
  .hero{padding:48px 0 42px}
  .hero h1{font-size:28px}
}




.sidebar .grp{display:flex;align-items:center;gap:9px;padding:0 10px;height:46px;margin-top:12px;
  color:var(--txt);font-size:14.5px;font-weight:800;letter-spacing:.01em;
  user-select:none;cursor:pointer;border-radius:10px;
  transition:background .18s,color .18s}
.sidebar .grp:hover{background:var(--shuxu-5)}
.sidebar .grp .grp-ico{flex:0 0 auto;width:28px;height:28px;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 2px 6px rgba(16,48,96,.16)}
.sidebar .grp .grp-ico svg{width:15px;height:15px}
.sidebar .grp .grp-ico.blue{background:linear-gradient(135deg,#3E9CFF,#0A68F0)}
.sidebar .grp .grp-ico.cyan{background:linear-gradient(135deg,#22D3EE,#0891B2)}
.sidebar .grp .grp-ico.orange{background:linear-gradient(135deg,#FDB022,#F79009)}
.sidebar .grp .grp-ico.purple{background:linear-gradient(135deg,#9B8AFB,#6E5BF0)}
.sidebar .grp .grp-ico.green{background:linear-gradient(135deg,#32D583,#12B76A)}
.sidebar .grp .grp-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar .grp .grp-tag{min-width:19px;height:19px;padding:0 6px;border-radius:10px;background:#D92D20;color:#fff;
  font-size:11.5px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.sidebar .grp .grp-ar{flex:0 0 auto;width:18px;height:18px;border-radius:6px;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--muted);transition:transform .22s ease,color .18s,background .18s}
.sidebar .grp:hover .grp-ar{background:rgba(16,48,96,.07);color:var(--shuxu-1)}
.sidebar .grp .grp-ar.open{transform:rotate(180deg)}
.sidebar .grp-body{display:flex;flex-direction:column;gap:1px;
  padding-left:8px;margin-left:12px;border-left:1px dashed var(--line)}
.sidebar .grp-body>a{margin-bottom:1px}
[data-theme="eye"] .sidebar .grp .grp-ico{filter:saturate(.55)}
@media (max-width:860px){ .sidebar .grp{height:48px;font-size:14.5px} }


@media (max-height:820px) and (min-width:861px){
  .admin-login{padding:20px 18px}
  .admin-login .panel .right{padding-top:32px;padding-bottom:32px}
}





.admin-login .shield{display:flex;align-items:center;gap:8px;margin-top:2px;
  padding:8px 11px;border-radius:10px;
  background:linear-gradient(135deg,rgba(0,82,217,.07),rgba(0,52,181,.05));
  border:1px solid rgba(0,82,217,.16)}
.admin-login .shield .sh-ico{flex:0 0 auto;width:24px;height:24px;border-radius:7px;
  display:inline-flex;align-items:center;justify-content:center;align-self:center;
  background:var(--shuxu-1);color:#fff;box-shadow:0 2px 6px rgba(0,82,217,.28)}
.admin-login .shield .sh-ico svg{width:14px;height:14px}

.admin-login .shield .sh-txt{flex:1;min-width:0;display:flex;align-items:center;
  gap:4px 10px;flex-wrap:wrap}
.admin-login .shield .sh-txt b{font-size:12.5px;color:var(--txt);font-weight:700;white-space:nowrap}
.admin-login .shield .sh-items{display:flex;flex-wrap:wrap;gap:4px 10px}
.admin-login .shield .sh-items span{display:inline-flex;align-items:center;gap:5px;
  font-size:11.5px;color:var(--sub);white-space:nowrap}
.admin-login .shield .dot{width:6px;height:6px;border-radius:50%;background:#12B76A;flex:0 0 auto}
.admin-login .shield .dot.ok{box-shadow:0 0 0 3px rgba(18,183,106,.16)}

.admin-login .back-front{display:inline-flex;align-items:center;gap:6px;margin-top:10px;
  padding:6px 14px;border-radius:999px;font-size:12.5px;font-weight:600;
  color:var(--shuxu-1);text-decoration:none;
  background:#fff;border:1px solid rgba(0,82,217,.22);
  transition:all .18s}
.admin-login .back-front:hover{background:var(--shuxu-1);color:#fff;border-color:var(--shuxu-1);
  transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,82,217,.25)}
.admin-login .back-front .bf-ico{display:inline-flex;align-items:center}
.admin-login .back-front .bf-ico svg{width:15px;height:15px}
[data-theme="eye"] .admin-login .shield{background:rgba(120,130,140,.1);border-color:rgba(120,130,140,.2)}
[data-theme="eye"] .admin-login .shield .sh-ico{background:#6B7280;box-shadow:none}


.rs-box{display:flex;align-items:center;gap:10px;padding:12px;border-radius:10px;
  background:var(--shuxu-6);border:1px solid var(--line)}
.rs-box .rs-ico{flex:0 0 auto;width:32px;height:32px;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center}
.rs-box .rs-ico.cyan{background:linear-gradient(135deg,#22D3EE,#0891B2)}
.rs-box .rs-ico.blue{background:linear-gradient(135deg,#3E9CFF,#0A68F0)}

.rs-box .rs-ico.green{background:linear-gradient(135deg,#34D399,#059669)}
.rs-box .rs-ico.grey{background:linear-gradient(135deg,#98A2B3,#667085)}
.rs-box .rs-ico svg{width:16px;height:16px}
.rs-box .rs-txt{min-width:0}
.rs-box .rs-k{font-size:12px;color:var(--sub)}
.rs-box .rs-v{font-size:22px;font-weight:800;line-height:1.2;color:var(--txt);
  font-variant-numeric:tabular-nums}




.gl{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px;
  border-radius:14px;background:#fff;border:1px solid var(--line);
  box-shadow:0 2px 10px rgba(16,48,96,.05);transition:transform .2s,box-shadow .2s}
.gl:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(16,48,96,.11)}
.gl .gl-ico{display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:12px;margin-bottom:4px;
  background:linear-gradient(135deg,#EAF3FF,#D6E8FF);color:var(--shuxu-1)}
.gl b{font-size:15px;color:var(--txt);font-weight:700}
.gl span:last-child{font-size:13px;color:var(--sub);line-height:1.7}

.ct-card{display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:22px 16px;border-radius:14px;text-decoration:none;
  background:#fff;border:1px solid var(--line);
  box-shadow:0 2px 10px rgba(16,48,96,.05);transition:transform .2s,box-shadow .2s}
.ct-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(16,48,96,.11)}
.ct-card .ct-ico{display:inline-flex;align-items:center;justify-content:center;
  width:46px;height:46px;border-radius:50%;color:#fff;
  box-shadow:0 3px 10px rgba(16,48,96,.18)}
.ct-card .ct-ico svg{width:22px;height:22px}
.ct-card b{font-size:14px;color:var(--txt);font-weight:700}
.ct-card span:last-child{font-size:13px;color:var(--sub);word-break:break-all;text-align:center}

@media (max-width:860px){
  .gl{padding:15px}
  .ct-card{padding:18px 12px}
}




.sidebar a.side-logout{display:flex;align-items:center;gap:10px;margin-top:14px;padding:12px 12px;
  border-radius:12px;font-size:15.5px;font-weight:800;color:#D92D20;letter-spacing:.01em;
  background:linear-gradient(135deg,rgba(217,45,32,.08),rgba(217,45,32,.03));
  border:1px solid rgba(217,45,32,.16);
  transition:background .18s,color .18s,transform .18s,box-shadow .18s}
.sidebar a.side-logout:hover{background:linear-gradient(135deg,#F04438,#D92D20);color:#fff;
  border-color:transparent;transform:translateY(-1px);box-shadow:0 6px 16px rgba(217,45,32,.28)}
.sidebar a.side-logout .ico.lo{flex:0 0 auto;width:30px;height:30px;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#F04438;color:#fff;box-shadow:0 2px 7px rgba(217,45,32,.32);
  transition:background .18s,box-shadow .18s}
.sidebar a.side-logout .ico.lo svg{width:16px;height:16px}
.sidebar a.side-logout:hover .ico.lo{background:rgba(255,255,255,.22);box-shadow:none}
.sidebar a.side-logout .lo-t{flex:1;min-width:0}
[data-theme="eye"] .sidebar a.side-logout{color:#B42318;background:rgba(180,35,24,.07);border-color:rgba(180,35,24,.16)}
[data-theme="eye"] .sidebar a.side-logout .ico.lo{background:#B42318;box-shadow:none}




.pay-item .pay-head .gw-ico{flex:0 0 auto;width:30px;height:30px;border-radius:9px;
  overflow:hidden;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 2px 7px rgba(16,48,96,.18)}
.pay-item .pay-head .gw-ico svg{width:30px;height:30px;display:block}
.pay-item .pay-head .rank{display:none}  


.acc-enter-active,.acc-leave-active{transition:max-height .28s cubic-bezier(.4,0,.2,1),
  opacity .22s ease,padding .28s cubic-bezier(.4,0,.2,1);overflow:hidden}
.acc-enter-from,.acc-leave-to{max-height:0;opacity:0;padding-top:0;padding-bottom:0}
.acc-enter-to,.acc-leave-from{max-height:1200px;opacity:1}


.pay-item{border-radius:12px;transition:box-shadow .2s,border-color .2s}
.pay-item:hover{box-shadow:0 4px 16px rgba(16,48,96,.10)}
.pay-item .pay-head{cursor:pointer;transition:background .18s}
.pay-item .pay-head:hover{background:var(--shuxu-5)}
.pay-item .pay-head .caret{display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:6px;color:var(--muted);
  transition:transform .26s cubic-bezier(.4,0,.2,1),color .18s,background .18s}
.pay-item .pay-head:hover .caret{background:rgba(16,48,96,.07);color:var(--shuxu-1)}
.pay-item .pay-head .caret.up{transform:rotate(180deg)}






.title h2{position:relative;letter-spacing:.01em}

.title.tc h2{padding-bottom:14px}
.title.tc h2::after{content:"";position:absolute;left:50%;transform:translateX(-50%);
  bottom:0;width:44px;height:3px;border-radius:2px;
  background:linear-gradient(90deg,#0052D9,#266FE8)}

.title:not(.tc) h2{padding-left:14px}
.title:not(.tc) h2::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:4px;height:22px;border-radius:2px;
  background:linear-gradient(180deg,#266FE8,#0052D9)}

.title p{margin-top:12px;color:var(--sub);font-size:14px;line-height:1.8}


.cta-title{font-size:24px;font-weight:800;color:var(--txt);line-height:1.4;letter-spacing:.01em}
@media (max-width:640px){ .cta-title{font-size:20px} }








html{scroll-behavior:smooth}

@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }


section[id],.legal-sec{scroll-margin-top:calc(var(--nav-h) + 14px)}

#vendors,#global,#flow,#features,#contact,#mall,#packages{scroll-margin-top:calc(var(--nav-h) + 20px)}


@media (max-width:860px){ :root{--nav-h:58px} }








.sidebar .ugrp{display:flex;align-items:center;gap:10px;padding:0 11px;height:46px;margin-top:10px;
  border-radius:11px;cursor:pointer;user-select:none;
  font-size:14.5px;font-weight:800;letter-spacing:.01em;color:var(--muted);
  transition:background .18s,color .18s}
.sidebar .ugrp:hover{background:var(--shuxu-5);color:var(--txt)}
.sidebar .ugrp.open{color:var(--shuxu-1)}
.sidebar .ugrp .ugrp-ico{flex:0 0 auto;width:26px;height:26px;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--shuxu-4);color:var(--muted);transition:background .18s,color .18s}
.sidebar .ugrp .ugrp-ico svg{width:15px;height:15px;display:block}
.sidebar .ugrp:hover .ugrp-ico{background:#fff;color:var(--shuxu-1)}
.sidebar .ugrp.open .ugrp-ico{background:rgba(0,82,217,.1);color:var(--shuxu-1)}
.sidebar .ugrp .ugrp-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar .ugrp .ugrp-ar{flex:0 0 auto;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;
  color:var(--muted);transition:transform .22s ease,color .18s}
.sidebar .ugrp .ugrp-ar svg{width:15px;height:15px;display:block}
.sidebar .ugrp .ugrp-ar.open{transform:rotate(180deg)}
.sidebar .ugrp.open .ugrp-ar{color:var(--shuxu-1)}
.sidebar .ugrp-body{display:flex;flex-direction:column;gap:1px;padding:3px 0 6px 14px}
.sidebar .ugrp-body>a{margin-bottom:1px}


.bell-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;padding:0;border:1px solid var(--line);border-radius:10px;
  background:var(--shuxu-4);color:var(--muted);cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.bell-btn:hover{background:var(--shuxu-5);color:var(--shuxu-1);border-color:rgba(0,82,217,.28)}
.bell-btn.on{color:var(--shuxu-1);background:rgba(0,82,217,.09);border-color:rgba(0,82,217,.3)}
.bell-btn .bell-ico{display:inline-flex;flex:0 0 auto}
.bell-btn .bell-ico svg{width:17px;height:17px;display:block}

.np-hd{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px}
.np-hd .np-title{font-size:16px;font-weight:800;letter-spacing:.3px}
.np-hd .x{position:absolute;right:14px;top:50%;transform:translateY(-50%)}

.notice-item .ni-top{height:20px;padding:0 8px;font-size:11px;font-weight:700;flex:0 0 auto}


.bell-btn .bell-dot{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 5px;
  border-radius:9px;background:#F04438;color:#fff;border:2px solid #fff;
  font-size:11px;font-weight:700;line-height:14px;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 1px 3px rgba(240,68,56,.45)}

.notice-item{border:1px solid var(--line);border-radius:10px;margin-bottom:8px;overflow:hidden;background:#fff}
.notice-item.open{border-color:rgba(0,82,217,.35)}
.notice-item .ni-hd{display:flex;align-items:center;gap:8px;padding:11px 13px;cursor:pointer;user-select:none}
.notice-item .ni-hd:hover{background:var(--shuxu-5)}
.notice-item .ni-hd b{flex:1;min-width:0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.notice-item .ni-date{flex:0 0 auto;font-size:12px;color:var(--muted)}
.notice-item .ni-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:#F04438}
.notice-item .ni-bd{padding:0 13px 13px;font-size:13.4px;line-height:1.75;color:var(--sub);
  white-space:pre-wrap;word-break:break-word;border-top:1px dashed var(--line);padding-top:11px}


.side-toggle{display:flex;align-items:center;gap:8px;margin:12px 10px 0;padding:0 10px;height:36px;
  border-radius:10px;background:var(--shuxu-4);color:var(--muted);
  font-size:12.5px;font-weight:600;cursor:pointer;user-select:none;
  transition:background .18s,color .18s}
.side-toggle:hover{background:var(--shuxu-5);color:var(--shuxu-1)}
.side-toggle.on{color:var(--shuxu-1);background:rgba(0,82,217,.09)}
.side-toggle .ico{display:inline-flex;flex:0 0 auto}
.side-toggle .ico svg{width:15px;height:15px;display:block}
.side-toggle .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-level{display:flex;align-items:center;gap:8px;margin:8px 10px 0;padding:8px 10px;border-radius:10px;background:var(--shuxu-4);font-size:12.5px}
.side-level .lv-ico{width:26px;height:26px;border-radius:8px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:#fff}
.side-level .lv-ico svg{width:16px;height:16px;display:block}



.plat-tip{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;margin-bottom:14px;
  border:1px solid #BCD8FF;border-radius:14px;background:linear-gradient(90deg,#EAF3FF,#fff)}
.plat-tip .pt-ico{flex:0 0 auto;margin-top:1px;color:var(--main);display:inline-flex}
.plat-tip .pt-txt{font-size:13px;line-height:1.85;color:var(--sub)}

.plat-card{display:flex;flex-direction:column}
.plat-card .bd{flex:1 1 auto}
.plat-card .hd .plat-name{font-weight:700;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.plat-card .hd .plat-state{margin-left:auto;flex:0 0 auto}
.plat-state{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:11px;
  font-size:11.5px;font-weight:700;background:#E6F8F0;color:var(--ok)}
.plat-state.off{background:#F1F4FA;color:var(--sub)}

.plat-card .ft{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:12px 18px;border-top:1px solid var(--line);background:#FCFDFF;border-radius:0 0 var(--r-card) var(--r-card)}
.plat-card .ft-l{display:flex;align-items:center;gap:8px;min-width:0}
.plat-card .ft-r{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.plat-card .ft-txt{font-size:12.5px;font-weight:600;color:var(--sub)}
.plat-card .ft-sync{font-size:12px;color:var(--shuxu-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


.mall-ft{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:12px 18px;border-top:1px solid var(--line);background:#FCFDFF;
  border-radius:0 0 var(--r-card) var(--r-card)}
.mall-ft-l{display:flex;align-items:center;gap:8px;min-width:0}
.mall-ft-r{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mall-ft-txt{font-size:12.5px;font-weight:600;color:var(--sub)}
@media (max-width:640px){
  .mall-ft{flex-direction:column;align-items:stretch}
  .mall-ft-r{margin-left:0;justify-content:flex-end}
}

.plat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:40px 20px;text-align:center}
.plat-empty .pe-ico{color:var(--shuxu-2);display:inline-flex;opacity:.75}
.plat-empty .pe-txt{font-size:13.5px;color:var(--sub)}
@media (max-width:640px){
  .plat-card .ft{flex-direction:column;align-items:stretch}
  .plat-card .ft-r{margin-left:0;justify-content:flex-end}
  .plat-card .ft-sync{display:none}
}


.plat-test{margin:0 18px 14px;padding:11px 13px;border:1px solid var(--line);
  border-radius:10px;background:#FAFBFE}
.plat-test .ptt-hd{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--ink)}
.plat-test .ptt-dot{width:8px;height:8px;border-radius:50%;background:#B9C4D8;flex:0 0 auto}
.plat-test .ptt-hd.ok .ptt-dot{background:#15803D}
.plat-test .ptt-hd.bad .ptt-dot{background:#C4271B}
.plat-test .ptt-msg{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.plat-test .ptt-steps{margin-top:9px;display:flex;flex-direction:column;gap:5px}
.plat-test .ptt-step{display:flex;align-items:flex-start;gap:7px;font-size:12.5px;line-height:1.6}
.plat-test .ptt-ic{width:16px;height:16px;border-radius:50%;flex:0 0 auto;margin-top:2px;
  display:inline-flex;align-items:center;justify-content:center;font-size:10px;color:#fff}
.plat-test .ptt-ic.ok{background:#15803D}
.plat-test .ptt-ic.bad{background:#C4271B}
.plat-test .ptt-nm{flex:0 0 auto;color:var(--sub);font-weight:600}
.plat-test .ptt-dt{color:var(--shuxu-2);word-break:break-all}



.modal.sm{max-width:400px}
.lo-ask{display:flex;gap:14px;align-items:flex-start;padding:4px 2px 2px}

.lo-ico{flex:0 0 auto;width:44px;height:44px;border-radius:14px;display:inline-flex;
  align-items:center;justify-content:center;background:#FDECEA;color:#D92D20}
.lo-ico svg{width:24px;height:24px;display:block}
.lo-txt{flex:1;min-width:0;padding-top:2px}
.lo-txt .lo-t1{font-size:15.5px;font-weight:800;color:var(--txt);line-height:1.5}
.lo-txt .lo-t2{margin-top:6px;font-size:13px;color:var(--sub);line-height:1.75}

.modal .ft.lo-ft{justify-content:flex-end;gap:10px}
.lo-ft .btn{min-width:88px;justify-content:center}

.bg-ask{padding:2px 2px 0}
.bg-ico{background:linear-gradient(135deg,rgba(15,98,224,.12),rgba(20,200,242,.16));color:var(--shuxu-2)}
.bg-num{margin-top:12px;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;
  border-radius:12px;font-size:19px;font-weight:800;letter-spacing:.6px;color:var(--shuxu-2);
  background:linear-gradient(135deg,rgba(15,98,224,.08),rgba(20,200,242,.1));
  border:1px dashed rgba(15,98,224,.32)}
@media (max-width:640px){
  .bg-num{font-size:17px;padding:8px 13px}
  .lo-ft .btn{min-width:0;flex:1}
}

.btn.danger{background:linear-gradient(135deg,#F97066,#D92D20);color:#fff;
  border:none;box-shadow:0 2px 8px rgba(217,45,32,.24)}
.btn.danger:hover{filter:brightness(1.05)}
@media (max-width:640px){
  .modal.sm{max-width:calc(100vw - 24px)}
  .lo-ask{gap:11px}
  .lo-ico{width:38px;height:38px;border-radius:12px}
  .lo-ico svg{width:21px;height:21px}
}











.sidebar.mini{width:64px;flex:0 0 64px;padding:16px 8px;
  overflow-x:hidden;overflow-y:auto;
  transition:width .22s ease,flex-basis .22s ease}
.sidebar{transition:width .22s ease,flex-basis .22s ease}


.sidebar.mini .side-brand{display:none}

.sidebar.mini a,
.sidebar.mini .grp,
.sidebar.mini .ugrp,
.sidebar.mini .side-toggle,
.sidebar.mini .side-collapse,
.sidebar.mini .side-logout,
.sidebar.mini .side-level{justify-content:center;gap:0;
  padding-left:0;padding-right:0;font-size:0}

.sidebar.mini .grp-t,
.sidebar.mini .ugrp-t,
.sidebar.mini .grp-ar,
.sidebar.mini .ugrp-ar,
.sidebar.mini .lo-t,
.sidebar.mini .side-toggle .t,
.sidebar.mini .side-collapse .t,


.sidebar.mini .grp-t,
.sidebar.mini .ugrp-t,
.sidebar.mini .grp-ar,
.sidebar.mini .ugrp-ar,
.sidebar.mini .lo-t,
.sidebar.mini .side-toggle .t,
.sidebar.mini .side-collapse .t,
.sidebar.mini .side-level b,
.sidebar.mini .side-level .sub{display:none}

.sidebar.mini .side-level .lv-ico{width:34px;height:34px;flex:0 0 34px;border-radius:11px;margin:0}

.sidebar.mini a .ico{width:22px;height:22px;flex:0 0 22px;opacity:1}
.sidebar.mini .grp .grp-ico,
.sidebar.mini .ugrp .ugrp-ico{width:30px;height:30px;border-radius:10px}
.sidebar.mini .grp .grp-ico svg,
.sidebar.mini .ugrp .ugrp-ico svg{width:17px;height:17px}




.sidebar.mini .grp-body,
.sidebar.mini .ugrp-body{padding:3px 0 6px;margin-left:0;border-left:none;align-items:stretch}

.sidebar.mini a.on{box-shadow:none;background:var(--shuxu-4)}

.side-collapse{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-top:6px;
  border-radius:14px;cursor:pointer;user-select:none;color:var(--sub);
  font-size:14px;font-weight:600;transition:background .18s,color .18s}
.side-collapse:hover{background:var(--shuxu-5);color:var(--shuxu-1)}
.side-collapse .ico{width:20px;height:20px;flex:0 0 20px;display:inline-flex;
  align-items:center;justify-content:center;color:var(--shuxu-1);opacity:.85}
.side-collapse .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-collapse.on .ico{opacity:1}
@media (max-width:860px){
  
  .sidebar.mini{width:220px;flex:0 0 220px;padding:16px 12px;font-size:14px}
  .side-collapse{display:none}
}



@media (min-width:861px){
  .sidebar{position:sticky;top:0;max-height:100vh;overflow-y:auto;overflow-x:hidden;
    scrollbar-width:thin;scrollbar-color:var(--line) transparent}
  .sidebar::-webkit-scrollbar{width:6px}
  .sidebar::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
  .sidebar::-webkit-scrollbar-track{background:transparent}
}



@media (min-width:861px){
  .sidebar .side-foot{position:sticky;bottom:0;z-index:3;background:#fff;
    box-shadow:0 -6px 14px rgba(16,42,84,.07)}
}







.side-foot{display:flex;gap:6px;padding:6px 0 0;margin-top:8px}
.side-foot>.side-toggle,.side-foot>.side-collapse{flex:1;min-width:0;height:52px;margin:0;
  flex-direction:column;gap:4px;padding:8px 4px;border-radius:12px;text-align:center}

.side-foot .t{flex:0 0 auto;font-size:11.5px;font-weight:600;line-height:1.25;letter-spacing:0;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  opacity:.85}
.side-foot .ico{opacity:1}
.side-foot .side-toggle:hover .t,.side-foot .side-collapse:hover .t{opacity:1}

.sidebar.mini .side-foot{flex-direction:column;gap:4px;padding:6px 0 0}
.sidebar.mini .side-foot>.side-toggle,
.sidebar.mini .side-foot>.side-collapse{padding:9px 0}

.sidebar.mini .side-level{justify-content:center;gap:0;padding:8px 0 12px;margin-bottom:2px}
.sidebar.mini .side-level b,.sidebar.mini .side-level .sub{display:none}
.sidebar.mini .side-level .lv-ico svg{width:19px;height:19px}


.side-foot{align-items:stretch}
.sidebar.mini .side-foot>.side-toggle,
.sidebar.mini .side-foot>.side-collapse{width:100%;height:44px;padding:0}








.sidebar.mini .grp,.sidebar.mini .ugrp,.sidebar.mini .grp-body a,.sidebar.mini .ugrp-body a{position:relative}
.sidebar.mini .grp-tag,
.sidebar.mini .grp-body a .pill{
  position:absolute;top:2px;right:5px;margin:0;z-index:2;
  min-width:15px;height:15px;padding:0 3px;border-radius:8px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:9.5px;font-weight:800;line-height:1;letter-spacing:0;
  box-shadow:0 0 0 2px #fff;                 
  text-overflow:clip;overflow:hidden;
}

.sidebar.mini .grp-body a .pill{max-width:26px}
.sidebar.mini .grp-tag{background:#D92D20;color:#fff}


.sidebar.mini .ugrp-tag,
.sidebar.mini .ugrp-body a .pill{display:none}

.sidebar.mini .grp:hover .grp-tag{box-shadow:0 0 0 2px var(--shuxu-5)}


.sidebar a .pill.end{margin-left:auto}
.sidebar.mini a .pill.end{margin:0}








.sidebar a .pill.ok{background:#E6F8F0;color:#0B7A46}
.sidebar a .pill.bad{background:#FDECEA;color:#B42318}
.sidebar a .pill.warn{background:#FEF3E4;color:#93370D}
.sidebar a .pill.gray{background:#F1F4FA;color:#475467}
.sidebar a .pill{background:#F1F4FA;color:#475467}




html[data-eye-site="1"] .sidebar a .pill.ok,
html[data-eye-admin="1"] .sidebar a .pill.ok{background:#E6F8F0 !important;color:#0B7A46 !important}
html[data-eye-site="1"] .sidebar a .pill.bad,
html[data-eye-admin="1"] .sidebar a .pill.bad{background:#FDECEA !important;color:#B42318 !important}
html[data-eye-site="1"] .sidebar a .pill.warn,
html[data-eye-admin="1"] .sidebar a .pill.warn{background:#FEF3E4 !important;color:#93370D !important}
html[data-eye-site="1"] .sidebar a .pill.gray,
html[data-eye-admin="1"] .sidebar a .pill.gray{background:#F1F4FA !important;color:#475467 !important}
html[data-eye-site="1"] .sidebar a .pill,
html[data-eye-admin="1"] .sidebar a .pill{background:#F1F4FA !important;color:#475467 !important}
html[data-eye-site="1"] .sidebar .grp-tag,
html[data-eye-admin="1"] .sidebar .grp-tag,
html[data-eye-site="1"] .sidebar .ugrp-tag,
html[data-eye-admin="1"] .sidebar .ugrp-tag{background:#D92D20 !important;color:#fff !important}


.tk-imgs { display:flex; flex-wrap:wrap; gap:8px; }
.tk-thumb { position:relative; width:76px; height:76px; border-radius:8px; overflow:hidden;
  border:1px solid var(--shuxu-line, #D7E1F2); background:var(--shuxu-5, #F5F8FF); cursor:zoom-in; }
.tk-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.tk-thumb .del { position:absolute; top:0; right:0; width:20px; height:20px; line-height:20px;
  text-align:center; font-size:14px; color:#fff; background:rgba(0,0,0,.55);
  border-radius:0 0 0 8px; cursor:pointer; }
.tk-thumb .del:hover { background:var(--danger-color, #C4271B); }
.tk-add { width:76px; height:76px; border:1px dashed var(--shuxu-line, #D7E1F2); border-radius:8px;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  color:var(--shuxu-muted, #8AA0C4); font-size:26px; background:var(--shuxu-5, #F5F8FF);
  transition:border-color .15s, color .15s; }
.tk-add:hover { border-color:var(--theme, #0052D9); color:var(--theme, #0052D9); }
.tk-preview { max-width:92vw; max-height:88vh; display:flex; align-items:center; justify-content:center; }
.tk-preview img { max-width:92vw; max-height:88vh; border-radius:10px; box-shadow:0 12px 40px rgba(0,0,0,.35); }
.captcha-img { height:38px; border-radius:8px; border:1px solid var(--shuxu-line, #D7E1F2); cursor:pointer; }

.tk-prio { display:inline-flex; align-items:center; gap:6px; margin-left:12px; }
.tk-prio .pill { margin:0; }

[data-eye-site] .tk-thumb, [data-eye-site] .tk-add { background:var(--eye-card, #22303F); border-color:var(--eye-line, #3A4A5C); }

[data-eye-admin] .tk-thumb, [data-eye-admin] .tk-add { background:var(--eye-card, #22303F); border-color:var(--eye-line, #3A4A5C); }


.mall-bar{background:var(--card,#fff);border:1px solid var(--line,#e6ebf2);border-radius:14px;padding:14px 16px}
.mb-line{display:flex;align-items:flex-start;gap:12px;padding:6px 0}
.mb-line+.mb-line{border-top:1px dashed var(--line,#e6ebf2)}
.mb-label{flex:0 0 52px;font-size:12.5px;color:var(--sub,#6b7a90);line-height:30px;font-weight:600}
.mb-tabs{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.mb-tab{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 13px;border-radius:15px;border:1px solid var(--line,#e6ebf2);
  background:var(--bg,#f7f9fc);color:var(--ink,#1b2a42);font-size:13px;cursor:pointer;transition:.18s;white-space:nowrap}
.mb-tab:hover{border-color:var(--theme,#0052D9);color:var(--theme,#0052D9)}
.mb-tab.on{background:var(--theme,#0052D9);border-color:var(--theme,#0052D9);color:#fff;font-weight:600}
.mb-tab.on .ico{color:#fff}
.mb-tab.t-icp.on{background:#0284C7;border-color:#0284C7}
.mb-tab.t-noicp.on{background:#64748B;border-color:#64748B}
.mb-logo-txt{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:5px;
  background:rgba(0,82,217,.12);color:var(--theme,#0052D9);font-size:11px;font-weight:700}
.mb-tab.on .mb-logo-txt{background:rgba(255,255,255,.22);color:#fff}
.mb-sum{margin-top:8px;font-size:12.5px;color:var(--sub,#6b7a90)}

.mall-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.mcard{position:relative;background:var(--card,#fff);border:1px solid var(--line,#e6ebf2);border-radius:14px;
  overflow:hidden;transition:.2s;display:flex;flex-direction:column}
.mcard:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(16,42,80,.10);border-color:var(--theme,#0052D9)}
.mcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px}
.mcard.is-icp::before{background:linear-gradient(180deg,#266FE8,#0284C7)}
.mcard.no-icp::before{background:linear-gradient(180deg,#CBD5E1,#94A3B8)}
.mc-head{display:flex;align-items:center;gap:11px;padding:14px 16px 10px 18px}
.mc-mark{flex:0 0 40px;border-radius:50%;overflow:hidden;box-shadow:0 2px 6px rgba(16,42,80,.12)}
.mc-title{flex:1;min-width:0}
.mc-title b{display:block;font-size:16px;letter-spacing:.2px;word-break:break-all}
.mc-vendor{font-size:12px;color:var(--sub,#6b7a90)}
.mc-icp{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 9px;border-radius:12px;font-size:11.5px;font-weight:600;white-space:nowrap}
.mc-icp.ok{background:#E0F2FE;color:#075985}
.mc-icp.gray{background:#F1F5F9;color:#64748B}
.mc-icp .ico{width:13px;height:13px}
.mc-body{padding:0 16px 12px 18px;flex:1}
.mc-price{display:flex;align-items:baseline;gap:3px;flex-wrap:wrap}
.mc-price .cur{font-size:14px;color:#D92D20;font-weight:600}
.mc-price b{font-size:26px;color:#D92D20;font-weight:800;line-height:1.1}
.mc-price .per{font-size:12.5px;color:var(--sub,#6b7a90);margin-left:2px}
.mc-off{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:9px;background:#FEF3C7;color:#92400E;font-size:11px;font-weight:700}
.mc-meta{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--sub,#6b7a90)}
.mc-foot{padding:10px 16px 14px 18px;border-top:1px dashed var(--line,#e6ebf2);display:flex;gap:8px}
.mc-foot .btn{flex:1;justify-content:center}



.mc-brand{flex:0 0 34px;border-radius:10px;overflow:hidden;box-shadow:0 2px 7px rgba(16,42,80,.14)}
.mb-ico{display:inline-flex;width:16px;height:16px;margin-right:5px;vertical-align:-3px;border-radius:4px;overflow:hidden}
.mb-tab.on .mb-ico{box-shadow:0 0 0 1.5px rgba(255,255,255,.55)}

.mc-remark{margin:0 16px 10px 18px;display:flex;align-items:flex-start;gap:6px;
  padding:7px 10px;border-radius:8px;background:var(--bg,#f7f9fc);border-left:3px solid var(--theme,#0052D9);
  font-size:12.5px;color:var(--sub,#5a6b85);line-height:1.5;word-break:break-word}
.mc-remark .ico{width:14px;height:14px;flex:0 0 14px;margin-top:2px;opacity:.75}
.buy-remark{margin-top:8px;display:flex;align-items:flex-start;gap:6px;padding:8px 11px;border-radius:9px;
  background:#FFFBEB;border-left:3px solid #F59E0B;font-size:12.5px;color:#92400E;line-height:1.5}
.buy-remark .ico{width:14px;height:14px;flex:0 0 14px;margin-top:2px}

.mall-pager{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.mp-info{font-size:12.5px;color:var(--sub,#6b7a90)}
.mp-btns{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.mp-btn{min-width:32px;height:32px;padding:0 9px;border-radius:8px;border:1px solid var(--line,#e6ebf2);
  background:var(--card,#fff);color:var(--ink,#1f2d3d);font-size:12.5px;cursor:pointer;transition:.15s}
.mp-btn:hover:not(:disabled){border-color:var(--theme,#0052D9);color:var(--theme,#0052D9)}
.mp-btn.on{background:var(--theme,#0052D9);border-color:var(--theme,#0052D9);color:#fff;font-weight:700}
.mp-btn:disabled{opacity:.45;cursor:not-allowed}


.buy-modal{max-width:520px}
.buy-top{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--bg,#f7f9fc);border:1px solid var(--line,#e6ebf2)}
.bt-mark{flex:0 0 46px;border-radius:50%;overflow:hidden;box-shadow:0 2px 6px rgba(16,42,80,.12)}
.bt-mid{flex:1;min-width:0}
.bt-name{font-size:18px;word-break:break-all}
.bt-badge{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 10px;border-radius:13px;font-size:12px;font-weight:600}
.bt-badge.ok{background:#E0F2FE;color:#075985}
.bt-badge.gray{background:#F1F5F9;color:#64748B}
.buy-info{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.bi{background:var(--bg,#f7f9fc);border:1px solid var(--line,#e6ebf2);border-radius:10px;padding:9px 10px;text-align:center}
.bi span{display:block;font-size:11.5px;color:var(--sub,#6b7a90);margin-bottom:3px}
.bi b{font-size:14px}
.buy-qty{display:flex;align-items:center;gap:14px;margin-top:16px;flex-wrap:wrap}
.bq-label{font-size:13px;font-weight:600}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line,#e6ebf2);border-radius:9px;overflow:hidden;background:var(--card,#fff)}
.stepper button{width:34px;height:32px;border:0;background:transparent;font-size:17px;cursor:pointer;color:var(--ink,#1b2a42)}
.stepper button:hover{background:var(--bg,#f7f9fc);color:var(--theme,#0052D9)}
.stepper b{min-width:42px;text-align:center;font-size:15px}
.bq-hint{font-size:12.5px;color:var(--sub,#6b7a90)}
.buy-note{display:flex;gap:7px;align-items:flex-start;margin-top:14px;padding:10px 12px;border-radius:10px;
  background:#FFFBEB;border:1px solid #FDE68A;color:#92400E;font-size:12.5px;line-height:1.7}
.buy-note .ico{flex:0 0 15px;margin-top:2px}
.buy-amount{margin-right:auto;font-size:13px}
.buy-amount b{font-size:19px;color:#D92D20;font-weight:800}


.buy-rent{margin-top:14px;border:1px solid var(--line,#e6ebf2);border-radius:12px;padding:12px 14px;background:var(--card,#fff)}
.br-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.br-label{font-size:13px;font-weight:600}
.br-tabs{display:inline-flex;border:1px solid var(--line,#e6ebf2);border-radius:9px;overflow:hidden}
.br-tabs button{border:0;background:transparent;padding:6px 14px;font-size:12.5px;cursor:pointer;color:var(--sub,#6b7a90)}
.br-tabs button.on{background:var(--theme,#0052D9);color:#fff;font-weight:600}
.br-body{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.br-unit{font-size:13px}
.br-eq{font-size:12.5px;color:var(--sub,#6b7a90)}
.br-exp{margin-left:auto;font-size:12.5px;color:var(--sub,#6b7a90)}
.br-quick{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.br-quick button{border:1px solid var(--line,#e6ebf2);background:var(--card,#fff);border-radius:8px;
  padding:5px 12px;font-size:12.5px;cursor:pointer;color:var(--ink,#1b2a42)}
.br-quick button.on{border-color:var(--theme,#0052D9);color:var(--theme,#0052D9);font-weight:600}
@media (max-width:520px){.br-exp{margin-left:0;width:100%}}


.rec-panel{background:var(--card,#fff);border:1px solid var(--line,#e6ebf2);border-radius:14px;overflow:hidden}
.rp-head{display:flex;align-items:center;gap:12px;padding:14px 16px;
  background:linear-gradient(120deg,rgba(0,82,217,.07),rgba(0,82,217,.01));border-bottom:1px solid var(--line,#e6ebf2)}
.rp-mark{flex:0 0 44px;border-radius:50%;overflow:hidden;box-shadow:0 2px 6px rgba(16,42,80,.12)}
.rp-mid{flex:1;min-width:0}
.rp-name{display:block;font-size:18px;word-break:break-all}
.rp-sub{font-size:12.5px;color:var(--sub,#6b7a90);margin-top:3px}
.rp-badge{height:26px;padding:0 11px;border-radius:13px;font-size:12px;font-weight:600;display:inline-flex;align-items:center}
.rp-badge.ok{background:#DCFCE7;color:#15803D}
.rp-badge.gray{background:#F1F5F9;color:#64748B}
.rp-body{display:flex;gap:22px;padding:14px 16px;flex-wrap:wrap;align-items:flex-start}
.rp-quota{flex:0 0 230px;min-width:200px}
.rq-top{display:flex;justify-content:space-between;font-size:12.5px;color:var(--sub,#6b7a90);margin-bottom:6px}
.rq-top b{color:var(--ink,#1b2a42);font-size:13.5px}
.rq-bar{height:8px;border-radius:4px;background:#EEF2F7;overflow:hidden}
.rq-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#266FE8,#0052D9);transition:width .3s}
.rp-types{flex:1;min-width:220px}
.rp-label{font-size:12.5px;color:var(--sub,#6b7a90);margin-bottom:7px}
.rtype{display:inline-block;margin:0 6px 6px 0;padding:3px 10px;border-radius:8px;font-size:12px;font-weight:700;
  background:#F1F5F9;color:#475569;border:1px solid #E2E8F0}
.rtype.sm{font-size:11.5px;padding:2px 8px;margin:0}
.rtype.t-a{background:#E0F2FE;color:#075985;border-color:#BAE6FD}
.rtype.t-cname{background:#CCFBF1;color:#115E59;border-color:#99F6E4}
.rtype.t-mx{background:#EDE9FE;color:#5B21B6;border-color:#DDD6FE}
.rtype.t-txt{background:#FEF3C7;color:#92400E;border-color:#FDE68A}
.rtype.t-aaaa{background:#DCFCE7;color:#15803D;border-color:#BBF7D0}
.rp-tip{display:flex;gap:7px;align-items:flex-start;padding:10px 16px;border-top:1px dashed var(--line,#e6ebf2);
  font-size:12px;color:var(--sub,#6b7a90);line-height:1.7}
.rp-tip .ico{flex:0 0 15px;margin-top:2px}
.rec-filter{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rf-count{font-size:12.5px;color:var(--sub,#6b7a90)}
.rv{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;
  background:var(--bg,#f7f9fc);padding:2px 6px;border-radius:5px;word-break:break-all}


.rec-modal{max-width:460px}
.rm-domain{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;
  background:var(--bg,#f7f9fc);border:1px solid var(--line,#e6ebf2);margin-bottom:14px}
.rm-mark{flex:0 0 34px;border-radius:50%;overflow:hidden}
.rm-domain b{font-size:15px;word-break:break-all}
.rm-preview{margin-top:6px;font-size:12px;color:var(--sub,#6b7a90)}
.rm-preview b{color:var(--theme,#0052D9);font-family:ui-monospace,Menlo,Consolas,monospace}

.rm-resv{display:flex;gap:6px;align-items:center;margin-top:6px;font-size:12px;color:var(--sub,#6b7a90)}
.rm-resv .ico{flex:0 0 14px;opacity:.85}
.rm-tip{display:flex;gap:7px;align-items:flex-start;margin-top:14px;padding:10px 12px;border-radius:10px;
  background:#FFFBEB;border:1px solid #FDE68A;color:#92400E;font-size:12.5px;line-height:1.7}
.rm-tip .ico{flex:0 0 15px;margin-top:2px}


.rm-warn{display:flex;gap:6px;align-items:flex-start;margin-top:8px;padding:7px 10px;border-radius:8px;
  background:#FEF2F2;border:1px solid #FECACA;color:#B42318;font-size:12px;line-height:1.6}
.rm-warn .ico{flex:0 0 14px;margin-top:1px}
.rm-soon{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.soon-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;
  background:var(--bg,#f7f9fc);border:1px solid var(--line,#e6ebf2);color:var(--sub,#6b7a90);font-size:11.5px;line-height:1.5}
.soon-chip .ico{flex:0 0 12px;opacity:.85}
.soon-chip.gray{background:#F1F5F9}
.rp-guard{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 14px}
.guard-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;
  background:#ECFDF3;border:1px solid #ABEFC6;color:#0B7A46;font-size:12px;font-weight:600;line-height:1.5}
.guard-chip .ico{flex:0 0 13px}
[data-eye-site] .rm-warn,[data-eye-site] .rm-tip{color:#3B2F14}
[data-eye-site] .guard-chip{background:#123018;color:#7FD9A0;border-color:#2A5C3A}

@media (max-width:640px){
  .mall-grid{grid-template-columns:1fr}
  .buy-info{grid-template-columns:repeat(2,1fr)}
  .mb-label{flex:0 0 44px}
  .rp-quota{flex:1 1 100%}
}


.icp-tag{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:11px;font-size:11.5px;font-weight:600;white-space:nowrap}
.icp-tag.ok{background:#E0F2FE;color:#075985}
.icp-tag.gray{background:#F1F5F9;color:#64748B}



.buy-tipbox{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--soft,#f7f9fc);margin-top:12px}
.btp-row{display:flex;align-items:flex-start;gap:8px;font-size:13px;line-height:1.65;color:var(--ink)}
.btp-row .ico{width:16px;height:16px;flex:0 0 16px;margin-top:1px;color:var(--brand,#006af3)}
.btp-sub{color:var(--muted,#8a94a6);font-size:12.5px}


.buy-calc{margin-top:12px;border:1px dashed var(--brand,#006af3);border-radius:10px;padding:12px 14px;
  background:var(--brand-soft,#eaf3ff)}
.bc-line{display:flex;align-items:flex-start;gap:8px;font-size:12.8px;line-height:1.75;color:var(--ink)}
.bc-line .ico{width:15px;height:15px;flex:0 0 15px;margin-top:3px;color:var(--brand,#006af3)}

.bc-hd{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--brand,#006af3);margin-bottom:8px}
.bc-hd .ico{width:15px;height:15px;flex:0 0 15px}
.bc-row{display:flex;align-items:baseline;gap:10px;font-size:12.8px;line-height:1.7;padding:3px 0}
.bc-row .bc-k{flex:0 0 68px;color:var(--muted,#8a94a6);font-size:12.3px}
.bc-row .bc-v{flex:1;color:var(--ink);word-break:break-all}
.bc-row .bc-v b{color:var(--brand,#006af3);font-size:14px}
.bc-sum{margin-top:8px;padding-top:8px;border-top:1px dashed rgba(0,82,217,.28);
  font-size:13px;font-weight:700;color:var(--brand,#006af3);letter-spacing:.2px}

.rm-quota{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;
  color:var(--brand,#006af3);background:var(--brand-soft,#eaf3ff);border-radius:999px;padding:4px 10px;white-space:nowrap}
.rm-quota .ico{width:14px;height:14px;flex:0 0 14px}

.rq-left{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--ok,#15803d)}


.vd-list{max-height:320px;overflow-y:auto;border:1px solid var(--line);border-radius:10px;padding:6px}
.vd-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;
  transition:background .15s}
.vd-item:hover{background:var(--soft,#f7f9fc)}
.vd-item.is-exists{opacity:.55;cursor:not-allowed}
.vd-item input[type=checkbox]{width:15px;height:15px;flex:0 0 15px;cursor:inherit}
.vd-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.vd-tag{flex:0 0 auto;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;
  background:#F1F5F9;color:#64748B}




.mc-tags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;padding:9px 14px 0 18px}
.mtag{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:11px;
  font-size:11px;font-weight:700;line-height:1;white-space:nowrap;box-shadow:0 2px 6px rgba(16,42,80,.12)}
.mtag .ico{width:11px;height:11px;flex:0 0 11px}
.mtag.hot{background:linear-gradient(135deg,#FF7A45,#E02D1B);color:#fff}
.mtag.sell{background:#FFF1E6;color:#C2410C;border:1px solid #FED7AA}
.mtag.new{background:linear-gradient(135deg,#4ADE80,#16A34A);color:#fff}
.mtag.limit{background:#FEF3C7;color:#92400E;border:1px solid #FDE68A}
.mtag.own{background:#E0F2FE;color:#075985;border:1px solid #BAE6FD}

.mall-grid{padding-top:10px}

.mc-sold{margin-top:9px;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--sub,#6b7a90)}
.mc-sold .ico{width:13px;height:13px;flex:0 0 13px;color:#F97316}
.mc-sold .dot{opacity:.5}


.buy-hero{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:13px;color:#fff;
  background:linear-gradient(120deg,#0284C7,#0EA5E9)}
.buy-hero.no-icp{background:linear-gradient(120deg,#475569,#94A3B8)}
.bh-mark{flex:0 0 44px;border-radius:11px;overflow:hidden;background:rgba(255,255,255,.22)}
.bh-mid{flex:1;min-width:0}
.bh-name{display:block;font-size:19px;font-weight:800;letter-spacing:.2px;word-break:break-all}
.bh-sub{font-size:12.5px;opacity:.9;margin-top:2px}
.bh-right{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.bh-icp{display:inline-flex;align-items:center;gap:4px;height:23px;padding:0 9px;border-radius:12px;
  font-size:11.5px;font-weight:700;background:rgba(255,255,255,.92)}
.bh-icp.ok{color:#075985}
.bh-icp.gray{color:#475569}
.bh-tag{display:inline-flex;align-items:center;gap:4px;height:21px;padding:0 8px;border-radius:11px;
  font-size:11px;font-weight:700;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.45)}
.bh-tag .ico{width:11px;height:11px}

.buy-qty{display:block;margin-top:14px;padding:12px 14px;border:1px solid var(--line,#e6ebf2);border-radius:12px;background:var(--card,#fff)}
.bq-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.bq-label{font-size:13px;font-weight:700}
.bq-body{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bq-quick{display:flex;gap:7px;flex-wrap:wrap}
.bq-quick button{border:1px solid var(--line,#e6ebf2);background:var(--card,#fff);border-radius:8px;
  padding:5px 12px;font-size:12.5px;cursor:pointer;color:var(--ink,#1b2a42)}
.bq-quick button.on{border-color:var(--theme,#0052D9);color:var(--theme,#0052D9);font-weight:700}
.bq-quick button:disabled{opacity:.4;cursor:not-allowed}
.bq-eq{margin-left:auto;font-size:12.5px;color:var(--sub,#6b7a90)}
@media (max-width:520px){.bq-eq{margin-left:0;width:100%}}


.mini-bar{margin-top:4px;width:72px;height:5px;border-radius:3px;background:#EEF2F7;overflow:hidden}
.mini-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#266FE8,#0052D9)}


.rm-hero{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:12px;margin-bottom:14px;
  background:linear-gradient(120deg,rgba(0,82,217,.09),rgba(0,82,217,.02));border:1px solid rgba(0,82,217,.18)}
.rm-mark{flex:0 0 38px;border-radius:50%;overflow:hidden;box-shadow:0 2px 6px rgba(16,42,80,.12)}
.rm-hmid{flex:1;min-width:0}
.rm-hname{display:block;font-size:17px;font-weight:800;word-break:break-all}
.rm-hsub{font-size:12px;color:var(--sub,#6b7a90);margin-top:2px}
.host-wrap{display:flex;align-items:stretch;border:1px solid var(--line,#e6ebf2);border-radius:9px;overflow:hidden;background:var(--card,#fff)}
.host-wrap .hw-in{flex:1;min-width:0;border:0;border-radius:0;background:transparent}
.hw-sfx{display:flex;align-items:center;padding:0 12px;font-size:13px;font-weight:700;color:var(--sub,#6b7a90);
  background:var(--bg,#f7f9fc);border-left:1px solid var(--line,#e6ebf2);white-space:nowrap;max-width:46%;overflow:hidden;text-overflow:ellipsis}

.type-chips{display:flex;gap:7px;flex-wrap:wrap}
.tchip{border:1px solid var(--line,#e6ebf2);background:var(--card,#fff);border-radius:9px;
  padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink,#1b2a42)}
.tchip:hover{border-color:var(--theme,#0052D9);color:var(--theme,#0052D9)}
.tchip.on{background:var(--theme,#0052D9);border-color:var(--theme,#0052D9);color:#fff}
.rm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
@media (max-width:460px){.rm-grid{grid-template-columns:1fr}}

.rp-tip.ok{color:#15803D}
[data-eye-site] .rp-tip.ok{color:#86EFAC}



.dm-tabs{display:flex;gap:8px;flex-wrap:wrap}
.dm-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:10px;
  border:1px solid var(--line,#E6EDF7);background:#fff;color:var(--sub,#6B7A90);font-size:13.5px;font-weight:700;cursor:pointer;transition:.16s}
.dm-tab .ico{width:15px;height:15px;display:inline-flex}
.dm-tab:hover{border-color:var(--shuxu-1,#0052D9);color:var(--shuxu-1,#0052D9)}
.dm-tab.on{background:linear-gradient(135deg,var(--shuxu-1,#0052D9),var(--shuxu-2,#266FE8));color:#fff;border-color:transparent;
  box-shadow:0 4px 12px rgba(0,82,217,.22)}
.dm-tab.on .ico{color:#fff}
.dt-n{margin-left:2px;padding:1px 7px;border-radius:9px;background:rgba(0,0,0,.07);font-size:11.5px;font-weight:800}
.dm-tab.on .dt-n{background:rgba(255,255,255,.28);color:#fff}
.dm-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:8px;cursor:pointer;
  background:var(--shuxu-soft,#EAF3FF);color:var(--shuxu-1,#0052D9);font-size:12.5px;font-weight:700}

.pkg-card{position:relative;background:#fff;border:1px solid var(--line,#E6EDF7);border-radius:14px;padding:16px;
  display:flex;flex-direction:column;transition:.18s;overflow:hidden}
.pkg-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,42,74,.10)}
.pkg-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:#F59E0B}
.pkg-card.pc-month::before{background:linear-gradient(180deg,#D97706,#F59E0B)}
.pkg-card.pc-year::before{background:linear-gradient(180deg,#A16207,#FACC15)}
.pkg-card.pc-custom::before{background:linear-gradient(180deg,#9D174D,#EC4899)}
.pkg-card.pc-rec{border-color:#F59E0B}
.pc-top{display:flex;align-items:center;gap:8px}
.pc-ico{width:34px;height:34px;display:inline-flex;flex:0 0 34px}
.pc-name{font-size:15.5px;font-weight:800;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-tag{padding:2px 8px;border-radius:8px;font-size:11px;font-weight:800;background:#FFF3D6;color:#B45309}
.pc-disc{display:flex;align-items:baseline;gap:5px;margin:10px 0 2px}
.pc-disc b{font-size:34px;font-weight:900;line-height:1;color:#D97706}
.pc-disc b:first-child{color:#D97706}
.pc-unit{font-size:14px;font-weight:800;color:#D97706}
.pc-off.none{background:#EEF2F7;color:#6B7A90}

.pc-dis{opacity:.62;filter:grayscale(.55)}
.pc-tag.gray{background:#EEF2F7;color:#6B7A90}
.pc-meta .pc-mk{color:var(--sub,#6B7A90);margin-right:4px}
.pc-off{margin-left:6px;padding:2px 8px;border-radius:8px;background:#FEF3C7;color:#B45309;font-size:11.5px;font-weight:800}
.pc-none{margin-left:6px;font-size:12px;color:var(--sub,#6B7A90)}
.pc-price{font-size:13px;color:var(--sub,#6B7A90)}
.pc-price b{font-size:19px;font-weight:800;color:var(--ink,#0F2B4C)}
.pc-period{font-size:12px;margin-left:3px}
.pc-desc{margin-top:6px;font-size:12.5px;color:var(--sub,#6B7A90);line-height:1.6;min-height:34px}
.pc-meta{margin-top:8px;font-size:12px;color:var(--sub,#6B7A90);display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.pc-foot{margin-top:auto;padding-top:12px;display:flex;align-items:center;gap:8px}

.cur-plan{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;
  background:linear-gradient(135deg,#EAF3FF,#F5FAFF);border:1px solid #D6E8FF}
.cp-ico{width:26px;height:26px;display:inline-flex;color:var(--shuxu-1,#0052D9);flex:0 0 26px}
.cp-mid{flex:1;min-width:0}
.cp-mid b{font-size:15.5px;font-weight:800;display:block}
.cp-sub{font-size:12.5px;color:var(--sub,#6B7A90);margin-top:3px}
.cp-d{color:#D97706;font-weight:800}

.plan-v2{position:relative;padding-top:20px}
.plan-v2.cur{border-color:#F59E0B;box-shadow:0 0 0 2px rgba(245,158,11,.18)}
.cur-flag{right:auto;left:12px;background:#F59E0B;color:#fff}
.pv-disc{display:flex;align-items:baseline;gap:5px;margin:8px 0 4px}
.pv-disc b{font-size:32px;font-weight:900;line-height:1;color:#D97706}
.pv-u{font-size:13.5px;font-weight:800;color:#D97706}
.pv-off{margin-left:6px;padding:2px 8px;border-radius:8px;background:#FEF3C7;color:#B45309;font-size:11.5px;font-weight:800}
.pv-none{margin-left:6px;font-size:12px;color:var(--sub,#6B7A90)}

.pv-save{display:flex;align-items:flex-start;gap:6px;margin:8px 0 2px;padding:7px 9px;
  border-radius:8px;background:#FFF7ED;color:#B45309;font-size:12.3px;line-height:1.55}
.pv-save .ico{width:14px;height:14px;flex:0 0 14px;margin-top:2px}
.pv-poor{margin:8px 0;padding:7px 10px;border-radius:9px;background:#FFF4E5;color:#B45309;font-size:12.5px;
  display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pv-poor .ico{width:14px;height:14px;display:inline-flex}

.dm-row{cursor:pointer}
.dm-row:hover{background:var(--shuxu-soft,#F5F9FF)}
.dm-row.on{background:var(--shuxu-soft,#EAF3FF);box-shadow:inset 3px 0 0 var(--shuxu-1,#0052D9)}
.dm-recs{border:1px solid var(--line,#E6EDF7);border-radius:14px;background:#fff;overflow:hidden}
.dmr-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;
  border-bottom:1px solid var(--line,#E6EDF7);background:linear-gradient(180deg,#FBFCFF,#F4F8FF)}
.dmr-head h3{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:800;margin:0}
.dmr-head .ico{width:16px;height:16px;display:inline-flex;color:var(--shuxu-1,#0052D9)}
.dmr-head .right{display:flex;align-items:center;gap:8px}
@media (max-width:640px){
  .dmr-head{flex-direction:column;align-items:flex-start}
  .pc-disc b{font-size:28px}
  .pv-disc b{font-size:26px}
}



.dm-row{cursor:pointer;transition:.14s}
.dm-row:hover{background:var(--shuxu-5,#F4F9FF)}
.dm-row.dm-open{background:var(--shuxu-soft,#EAF3FF)}
.dm-caret{display:inline-block;width:14px;color:var(--sub,#6B7A90);font-size:11px}
.dm-row.dm-open .dm-caret{color:var(--shuxu-1,#0052D9)}
.dm-sub>td{padding:0 !important;background:#fff}
.dm-subbox{padding:12px 16px;border-top:1px solid var(--line,#E6EDF7);
  border-bottom:2px solid var(--shuxu-soft,#EAF3FF);background:var(--shuxu-5,#F4F9FF)}
.dm-subhd{font-size:13px;color:var(--txt,#1B2A42);margin-bottom:10px;
  display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.dm-subhd b{font-size:13.5px}
.table.sm th,.table.sm td{padding:7px 10px;font-size:12.5px}
[data-eye-site] .dm-subbox,[data-eye-admin] .dm-subbox{background:#12203A}
[data-eye-site] .dm-row.dm-open,[data-eye-admin] .dm-row.dm-open{background:#1B2F52}







.ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;vertical-align:middle;line-height:0}
.ico>svg,.ico svg{display:block;max-width:100%;max-height:100%}

.mc-brand,.bt-mark,.mc-mark{display:block;flex:0 0 auto}
.mc-brand>svg,.bt-mark>svg,.mc-mark>svg{display:block;width:100%;height:auto}

.mtag .ico,.bh-tag .ico{display:inline-flex}


.stat4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.stat4 .s4{background:var(--card,#fff);border:1px solid var(--line,#E6EDF7);border-radius:12px;
  padding:11px 14px;display:flex;flex-direction:column;gap:3px;min-width:0}
.stat4 .s4 span{font-size:12px;color:var(--sub,#7A8AA3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat4 .s4 b{font-size:20px;font-weight:800;line-height:1.15;color:var(--txt,#1B2A42);font-variant-numeric:tabular-nums}
.stat4 .s4 b.ok{color:#15803D}
.stat4 .s4 b.warn{color:#B45309}
.stat4 .s4 b.danger{color:#DC2626}
.stat4 .s4 b.c1{color:var(--shuxu-1,#0052D9)}
.stat4 .s4 b.gray{color:#64748B}
.stat4 .s4-risk{border-color:#FCA5A5;background:#FEF2F2}
@media(max-width:820px){.stat4{grid-template-columns:repeat(2,minmax(0,1fr))}}


.qt{min-width:96px}
.qt-t{display:flex;align-items:baseline;gap:2px;font-size:13px}
.qt-t b{font-size:14px;font-weight:800;color:var(--txt,#1B2A42)}
.qt-t .qs{font-size:12px;color:var(--sub,#7A8AA3)}
.qt .mini-bar{width:100%;max-width:110px;margin-top:5px}


.ar-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  background:var(--card,#fff);border:1px solid var(--line,#E6EDF7);border-radius:12px;padding:9px 14px}
.ar-bar-l{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ar-bar .ar-sel{font-size:12.5px;color:var(--sub,#7A8AA3)}
.ar-bar .ar-sel b{color:var(--shuxu-1,#0052D9);font-size:14px}
.ar-bar .btn:disabled{opacity:.45;cursor:not-allowed}
.ar-bar-r{font-size:12.5px;color:var(--sub,#7A8AA3);display:flex;align-items:center;gap:6px}
.ar-bar-r b{color:var(--txt,#1B2A42)}
.ar-dom{color:var(--shuxu-1,#0052D9);cursor:pointer;font-weight:600}
.ar-dom:hover{text-decoration:underline}
@media(max-width:640px){.ar-bar{flex-direction:column;align-items:flex-start}}




.dmp-hd .ttl{font-weight:600;transition:transform .18s ease,color .18s ease}


.dmp-hd .desc{font-size:12px;color:var(--txt,#1B2A42);margin-bottom:10px}
.dmp-hd .ico{display:inline-flex;color:var(--shuxu-1,#0052D9)}
.dmp-hd .ico svg{width:15px;height:15px}
.dmp-hd b{font-weight:800}
.dmp-hd .right{margin-left:auto}
.dmp .table-wrap{border:1px solid var(--line,#E6EDF7);border-radius:10px;overflow:hidden;background:var(--card,#fff)}
.dmp .table{margin:0}
.dmp .table th{background:#EEF4FD;font-size:12px}
@media(max-width:640px){.dmp{padding:10px!important}.dmp-hd{font-size:12.5px}}





.kpi.k2{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr;gap:12px;
  align-items:center;padding:15px 16px;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.kpi.k2:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(16,42,90,.10);border-color:transparent}
.kpi.k2:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}
.k-c-blue:before{background:#0052D9}
.k-c-cyan:before{background:#0E9AA7}
.k-c-amber:before{background:#F97316}
.k-c-green:before{background:#16A34A}
.kpi.k2 .k2-bd{min-width:0}
.kpi.k2 .k2-ico{width:42px;height:42px;border-radius:13px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;color:#fff}
.kpi.k2 .k2-ico svg{display:block}
.k-c-blue  .k2-ico{background:linear-gradient(135deg,#266FE8,#0052D9);box-shadow:0 4px 10px rgba(0,82,217,.25)}
.k-c-cyan  .k2-ico{background:linear-gradient(135deg,#38D6C8,#0E9AA7);box-shadow:0 4px 10px rgba(14,154,167,.25)}
.k-c-amber .k2-ico{background:linear-gradient(135deg,#FFB01F,#F97316);box-shadow:0 4px 10px rgba(249,115,22,.25)}
.k-c-green .k2-ico{background:linear-gradient(135deg,#4ADE80,#16A34A);box-shadow:0 4px 10px rgba(22,163,74,.25)}

.kpi.k2 .qbar{grid-column:1 / -1;margin-top:2px}
@media(max-width:640px){.kpi.k2 .k2-ico{width:36px;height:36px;border-radius:11px}}


.vip-badge svg{display:block}


.pv-exp{display:flex;align-items:flex-start;gap:6px;margin-top:10px;padding:7px 10px;
  border-radius:9px;background:var(--shuxu-5,#F5F8FD);border:1px dashed var(--line,#E6EDF7);
  font-size:12.5px;color:var(--sub,#6B7C99);line-height:1.5}
.pv-exp .ico{flex:0 0 14px;color:var(--shuxu-1,#0052D9);margin-top:1px}
.pv-exp .ico svg{width:14px;height:14px}




.bal-tabs{display:flex;flex-wrap:wrap;gap:7px;padding:12px 16px 0}
.bal-tabs .bt{height:28px;padding:0 11px;border-radius:var(--r-pill,99px);border:1px solid var(--line,#E6EDF7);
  background:#fff;color:var(--sub,#6B7C99);font-size:12.5px;font-weight:600;cursor:pointer;
  display:inline-flex;align-items:center;gap:5px;transition:all .16s ease}
.bal-tabs .bt:hover{border-color:var(--shuxu-3,#266FE8);color:var(--shuxu-1,#0052D9)}
.bal-tabs .bt.on{background:var(--shuxu-1,#0052D9);border-color:var(--shuxu-1,#0052D9);color:#fff}
.bal-tabs .bt .bt-n{font-size:11px;opacity:.7}
.btag{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--r-pill,99px);
  font-size:12px;font-weight:600;background:#F1F4FA;color:var(--sub,#6B7C99);white-space:nowrap}
.btag.bt-in{background:#E6F8F0;color:#0B7A46}
.btag.bt-out{background:#FDECEA;color:#C0392B}
.btag.bt-mall{background:#E7F1FF;color:#0052D9}
.btag.bt-plan{background:#F1E9FF;color:#7C3AED}
.btag.bt-renew{background:#E0F7F6;color:#0E7C88}
.btag.bt-admin{background:#F1F4FA;color:var(--sub,#6B7C99)}
.btag.bt-other{background:#F1F4FA;color:var(--muted,#94A3B8)}

html[data-eye-site="1"] .btag.bt-in,html[data-eye-admin="1"] .btag.bt-in{background:#16351F;color:#7FD9A0}
html[data-eye-site="1"] .btag.bt-out,html[data-eye-admin="1"] .btag.bt-out{background:#3A1A16;color:#F5A99F}








.btn, .tag, .status, .badge, .card, .mcard, .panel,
input, select, textarea, .op, .mb-tab, .br-tabs button {
  transition: background-color .22s cubic-bezier(.4,0,.2,1),
              border-color .22s cubic-bezier(.4,0,.2,1),
              color .22s cubic-bezier(.4,0,.2,1),
              box-shadow .22s cubic-bezier(.4,0,.2,1),
              transform .22s cubic-bezier(.4,0,.2,1);
}


@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--shuxu-1, #0052D9);
  outline-offset: 2px;
  border-radius: 6px;
}


.card, .panel, .mcard {
  border-radius: var(--r-card, 20px);
  box-shadow: var(--shadow-1, 0 2px 10px rgba(0,82,217,.07));
}
.card:hover, .panel:hover {
  box-shadow: var(--shadow-2, 0 10px 30px rgba(0,82,217,.13));
}


.sk, .skeleton {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg,#EEF3FA 25%,#F7FAFD 37%,#EEF3FA 63%);
  background-size: 400% 100%;
  animation: sk-flow 1.4s ease-in-out infinite;
  border-radius: 6px;
  color: transparent !important;
  user-select: none;
}
@keyframes sk-flow {
  0%   { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}
.sk-line  { height: 12px; margin: 6px 0; }
.sk-title { height: 18px; width: 40%; margin-bottom: 10px; }
.sk-avatar, .sk-dot { width: 36px; height: 36px; border-radius: 50%; }


.empty, .no-data {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 48px 20px; text-align: center;
  color: var(--muted, #8AA6CE);
}
.empty .empty-ico, .no-data .empty-ico {
  width: 72px; height: 72px; margin-bottom: 14px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: var(--shuxu-4, #E6F1FF);
  color: var(--shuxu-1, #0052D9);
}
.empty .empty-t, .no-data .empty-t {
  font-size: 15px; font-weight: 600; color: var(--sub, #4E6C9B);
  margin-bottom: 6px;
}
.empty .empty-d, .no-data .empty-d { font-size: 13px; line-height: 1.7; }


table.list tbody tr:nth-child(even), .table tbody tr:nth-child(even) {
  background: rgba(0,82,217,.018);
}
table.list tbody tr:hover, .table tbody tr:hover {
  background: var(--shuxu-4, #E6F1FF);
}
table.list td, table.list th, .table td, .table th { padding: 10px 12px; }


.tag, .status, .badge {
  display: inline-flex; align-items: center; justify-content: center;
  white-space: nowrap; padding: 2px 10px;
  border-radius: var(--r-pill, 999px);
  font-size: 12px; line-height: 1.7; min-width: 48px;
}


::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(0,82,217,.22); border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover { background: rgba(0,82,217,.38); }



table th.col-status, table td.col-status { min-width: 80px; }
table th.col-dns, table td.col-dns { min-width: 90px; }
table th.col-date, table td.col-date { min-width: 110px; }
table th.col-op, table td.col-op { min-width: 190px; text-align: right; }
table th.col-id, table td.col-id { width: 56px; color: var(--sub); font-size: 12.5px; }
table th.col-ttl, table td.col-ttl { width: 62px; text-align: center; }
table th.col-key, table td.col-key { min-width: 130px; }

.pill, .icp-tag, .rtype, .tag, .badge {
  display: inline-flex; align-items: center; justify-content: center;
  white-space: nowrap; min-width: 48px;
}

table td.op, td.col-op { white-space: nowrap; line-height: 2.2; }
.op + .op { margin-left: 10px; }
@media (max-width: 860px) {
  table th.col-op, table td.col-op { min-width: 150px; }
  .op + .op { margin-left: 6px; }
}

.key-mask { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: var(--sub); }

.dm-copy { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.dm-copy .ico { opacity: .45; transition: opacity .18s; }
.dm-copy:hover .ico { opacity: 1; }

.rsync { margin-top: 4px; font-size: 12px; color: var(--warn); cursor: pointer; text-decoration: underline; }

.del-warn { padding: 10px 12px; border-radius: 8px; background: #fff2f0; border: 1px solid #ffccc7;
  color: #cf1322; font-size: 13px; line-height: 1.7; }

.mall-card .mall-dn { font-weight: 600; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mall-card.is-off { opacity: .78; }
.mall-card .mall-suffix { display: inline-block; padding: 1px 8px; border-radius: 6px;
  background: var(--brand-weak, #e6f0ff); color: var(--brand, #0052D9); font-size: 12px; font-weight: 600; }
.mall-card .mall-price .cur { font-size: 12px; color: var(--sub); }
.mall-card .mall-price b { font-size: 20px; color: #ff4d4f; margin: 0 2px; }
.mall-card .mall-price .per { font-size: 12px; color: var(--sub); }

.mc-origin { margin-right: 6px; font-size: 12.5px; color: var(--sub); text-decoration: line-through; }
.mc-pkg { margin-top: 4px; font-size: 12px; color: #52c41a; }
.mc-pkg.off { color: var(--sub); }

.exp-banner { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 8px;
  margin-bottom: 12px; border: 1px solid transparent; font-size: 13px; }
.exp-banner.warn { background: #fffbe6; border-color: #ffe58f; color: #ad6800; }
.exp-banner.bad { background: #fff2f0; border-color: #ffccc7; color: #cf1322; }
.exp-banner .eb-txt { display: flex; flex-direction: column; line-height: 1.5; }
.exp-banner .eb-txt span { opacity: .8; font-size: 12px; }
.exp-banner .btn { margin-left: auto; }
@media (max-width: 860px) { .exp-banner { flex-wrap: wrap; } .exp-banner .btn { margin-left: 0; } }


.shuxu-confirm-mask{position:fixed;inset:0;z-index:9999;background:rgba(15,23,42,.45);backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;padding:20px;animation:shuxuFadeIn .16s ease}
.shuxu-confirm{width:100%;max-width:380px;background:var(--card,#fff);border-radius:12px;
  box-shadow:0 12px 40px rgba(15,23,42,.22);overflow:hidden;animation:shuxuPopIn .18s cubic-bezier(.4,0,.2,1)}
.shuxu-confirm-bd{padding:22px 20px;font-size:14px;line-height:1.7;color:var(--text,#1f1f1f);word-break:break-word}
.shuxu-confirm-hd{padding:18px 20px 0;font-size:15px;font-weight:600;color:var(--text,#1f1f1f)}
.shuxu-confirm-hd + .shuxu-confirm-bd{padding-top:8px}
.shuxu-confirm-ft{display:flex;justify-content:flex-end;gap:10px;padding:0 20px 20px}
.shuxu-confirm-ft .btn{min-width:76px;justify-content:center}
@keyframes shuxuFadeIn{from{opacity:0}to{opacity:1}}
@keyframes shuxuPopIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .shuxu-confirm-mask,.shuxu-confirm{animation:none}
}




td.empty, td.no-data { display: table-cell; vertical-align: middle; padding: 0; }
td.empty > .empty-in, td.no-data > .empty-in { padding: 40px 20px; }
.empty-in {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; color: var(--muted, #8AA6CE);
}
.empty-in .empty-ico {
  width: 64px; height: 64px; margin-bottom: 12px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--shuxu-4, #E6F1FF);
  color: var(--shuxu-1, #0052D9);
}
.empty-in .empty-t { font-size: 14.5px; font-weight: 600; color: var(--sub, #4E6C9B); margin-bottom: 5px; }
.empty-in .empty-d { font-size: 12.5px; line-height: 1.7; max-width: 420px; }









.pg { max-width: 1440px; margin: 0 auto; }


.pg-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.pg-hd-l { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pg-ico { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 13px; display: inline-flex;
  align-items: center; justify-content: center; background: var(--grad-main); color: #fff; box-shadow: var(--shadow-blue); }
.pg-ico svg { width: 22px; height: 22px; display: block; }
.pg-t { font-size: 19px; font-weight: 800; color: var(--ink); line-height: 1.3; letter-spacing: .2px; }
.pg-d { font-size: 12.5px; color: var(--sub); margin-top: 2px; line-height: 1.6; }
.pg-hd-r { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }


.statband { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.sb { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: #fff;
  border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-1); overflow: hidden; }
.sb::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--shuxu-1); }
.sb.g::before { background: var(--ok); }
.sb.o::before { background: var(--warn); }
.sb.r::before { background: var(--bad); }
.sb.s::before { background: var(--muted); }
.sb-ic { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; display: inline-flex;
  align-items: center; justify-content: center; background: var(--shuxu-4); color: var(--shuxu-1); }
.sb-ic svg { width: 20px; height: 20px; display: block; }
.sb.g .sb-ic { background: #E6F8F0; color: #0B7A46; }
.sb.o .sb-ic { background: #FEF3E4; color: #B45309; }
.sb.r .sb-ic { background: #FDECEA; color: #C4271B; }
.sb.s .sb-ic { background: #F1F4FA; color: #64748B; }
.sb-b { min-width: 0; }
.sb-v { font-size: 21px; font-weight: 800; line-height: 1.15; color: var(--ink); font-variant-numeric: tabular-nums; }
.sb-l { font-size: 12.5px; color: var(--sub); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }


.fbar { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; padding: 12px 14px; }
.fld { display: inline-flex; align-items: center; gap: 6px; }
.fld > .fl { font-size: 12.5px; color: var(--sub); white-space: nowrap; }
.fbar .input { height: 34px; }
.fbar .btn { height: 34px; }
.fbar-end { margin-left: auto; display: inline-flex; gap: 8px; }


.table th { white-space: nowrap; }
.table td { vertical-align: middle; }
.table tbody tr { transition: background .16s ease; }
.table tbody tr:hover { background: var(--shuxu-5); }


.msk { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px;
  background: var(--shuxu-5); border: 1px solid var(--line); font-size: 12px; color: var(--sub);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }


.mallgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.mcard { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line);
  border-radius: 16px; box-shadow: var(--shadow-1); overflow: hidden; transition: box-shadow .18s ease, transform .18s ease; }
.mcard:hover { box-shadow: var(--shadow-2); transform: translateY(-2px); }
.mcard.off { opacity: .84; }
.mc-top { display: flex; align-items: center; gap: 8px; padding: 14px 14px 10px; }
.mc-name { flex: 1; min-width: 0; font-size: 16px; font-weight: 800; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-body { padding: 0 14px 12px; }
.mc-price { display: flex; align-items: baseline; gap: 4px; margin-top: 10px; }
.mc-price .cur { font-size: 13px; font-weight: 700; color: var(--bad); }
.mc-price b { font-size: 22px; font-weight: 800; color: var(--bad); line-height: 1; font-variant-numeric: tabular-nums; }
.mc-price .per { font-size: 12px; color: var(--sub); }
.mc-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 10px; font-size: 12px; color: var(--sub); align-items: center; }
.mc-ft { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px;
  border-top: 1px solid var(--line); background: var(--shuxu-5); }
.mc-ft-r { display: inline-flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }


.ptt-ic.sk { background: #F1F4FA; color: #64748B; }
.ptt-step .ptt-dt { color: var(--sub); font-size: 12px; word-break: break-all; }


@media (max-width: 1400px) { .mallgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1000px) {
  .statband { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mallgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .pg-ico { width: 38px; height: 38px; flex-basis: 38px; border-radius: 11px; }
  .pg-t { font-size: 17px; }
  .statband { gap: 10px; }
  .mallgrid { grid-template-columns: 1fr; }
  .sb { padding: 12px 12px; gap: 10px; }
  .sb-v { font-size: 19px; }
}













@media (min-width: 1401px) {
  .table td.col-op, .table th.col-op { min-width: 148px; }
  .table th.col-status, .table td.col-status { min-width: 64px; }
  .table th.col-date, .table td.col-date { min-width: 92px; }
  .table th.col-key, .table td.col-key { min-width: 116px; }
  .table th, .table td { padding: 10px 9px; }
  .table td .rv { max-width: 190px; }
}


@media (max-width: 1400px) {
  .table-wrap { overflow-x: visible; overflow-y: visible; }
  .table { min-width: 0 !important; width: 100%; table-layout: auto; }

  .table thead { display: none; }
  
  .table > tr:first-child, .table > tbody > tr:first-child { display: none; }

  .table > tr, .table > tbody > tr {
    display: block;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    padding: 10px 13px;
    margin: 0 0 10px;
  }
  .table > tr:last-child, .table > tbody > tr:last-child { margin-bottom: 0; }
  .table > tr > td, .table > tbody > tr > td {
    display: block;
    width: auto;
    border: 0;
    padding: 5px 0;
    text-align: left !important;
    white-space: normal;
  }
  
  .table > tr > td[data-lb], .table > tbody > tr > td[data-lb] {
    display: flex; gap: 10px; align-items: flex-start;
  }
  .table > tr > td[data-lb]::before, .table > tbody > tr > td[data-lb]::before {
    content: attr(data-lb);
    flex: 0 0 78px;
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.6;
  }

  
  .table td.col-op { min-width: 0; white-space: normal; line-height: 1.9; }
  .table td.col-op .op { margin-left: 0; margin-right: 14px; }
  .table td.col-op .op:last-child { margin-right: 0; }

  
  .table tr.empty-row { border: 0; background: none; padding: 0; margin: 0; }
  .table tr.empty-row > td { padding: 0; }
  .table td.empty { padding: 30px 12px !important; text-align: center; }

  
  .table th.col-id, .table td.col-id,
  .table th.col-ttl, .table td.col-ttl,
  .table th.col-key, .table td.col-key,
  .table th.col-status, .table td.col-status,
  .table th.col-date, .table td.col-date,
  .table th.col-dns, .table td.col-dns,
  .table th.col-op, .table td.col-op { width: auto; min-width: 0; text-align: left; }
}








.table-wrap.tbl-card { overflow-x: visible !important; overflow-y: visible; }
.table-wrap.tbl-card > .table { min-width: 0 !important; width: 100%; table-layout: auto; }

.table-wrap.tbl-card > .table > thead { display: none; }
.table-wrap.tbl-card > .table > tr:first-child,
.table-wrap.tbl-card > .table > tbody > tr:first-child { display: none; }

.table-wrap.tbl-card > .table > tr,
.table-wrap.tbl-card > .table > tbody > tr {
  display: block;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: 10px 13px;
  margin: 0 0 10px;
}
.table-wrap.tbl-card > .table > tr:last-child,
.table-wrap.tbl-card > .table > tbody > tr:last-child { margin-bottom: 0; }
.table-wrap.tbl-card > .table > tr > td,
.table-wrap.tbl-card > .table > tbody > tr > td {
  display: block;
  width: auto;
  border: 0;
  padding: 5px 0;
  text-align: left !important;
  white-space: normal;
}
.table-wrap.tbl-card > .table > tr > td[data-lb],
.table-wrap.tbl-card > .table > tbody > tr > td[data-lb] {
  display: flex; gap: 10px; align-items: flex-start;
}
.table-wrap.tbl-card > .table > tr > td[data-lb]::before,
.table-wrap.tbl-card > .table > tbody > tr > td[data-lb]::before {
  content: attr(data-lb);
  flex: 0 0 78px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.6;
}
.table-wrap.tbl-card .table td.col-op { min-width: 0; white-space: normal; line-height: 1.9; }
.table-wrap.tbl-card .table td.col-op .op { margin-left: 0; margin-right: 14px; }
.table-wrap.tbl-card .table td.col-op .op:last-child { margin-right: 0; }
.table-wrap.tbl-card .table td.col-op .btn { margin-left: 0; margin-right: 8px; }
.table-wrap.tbl-card .table td.col-op .btn:last-child { margin-right: 0; }
.table-wrap.tbl-card .table tr.empty-row { border: 0; background: none; padding: 0; margin: 0; }
.table-wrap.tbl-card .table tr.empty-row > td { padding: 0; }
.table-wrap.tbl-card .table td.empty { padding: 30px 12px !important; text-align: center; }
.table-wrap.tbl-card .table th.col-id, .table-wrap.tbl-card .table td.col-id,
.table-wrap.tbl-card .table th.col-ttl, .table-wrap.tbl-card .table td.col-ttl,
.table-wrap.tbl-card .table th.col-key, .table-wrap.tbl-card .table td.col-key,
.table-wrap.tbl-card .table th.col-status, .table-wrap.tbl-card .table td.col-status,
.table-wrap.tbl-card .table th.col-date, .table-wrap.tbl-card .table td.col-date,
.table-wrap.tbl-card .table th.col-dns, .table-wrap.tbl-card .table td.col-dns,
.table-wrap.tbl-card .table th.col-op, .table-wrap.tbl-card .table td.col-op {
  width: auto; min-width: 0; text-align: left;
}






.rn-modal { border-radius: 16px; overflow: hidden; }
.rn-hd { display: flex; align-items: center; gap: 10px; padding: 14px 16px;
  background: linear-gradient(135deg, #0052D9, #266FE8); color: #fff; }
.rn-hd .rn-ico { display: inline-flex; width: 30px; height: 30px; border-radius: 9px;
  background: rgba(255,255,255,.22); align-items: center; justify-content: center; flex: 0 0 30px; }
.rn-hd .rn-ico svg { width: 17px; height: 17px; }
.rn-hd-t { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.rn-hd-t b { font-size: 15px; font-weight: 700; }
.rn-hd-t span { font-size: 12.5px; opacity: .88; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rn-x { font-size: 22px; line-height: 1; cursor: pointer; opacity: .85; padding: 0 4px; }
.rn-x:hover { opacity: 1; }
.rn-row { display: flex; align-items: center; justify-content: space-between;
  font-size: 13.5px; padding: 9px 12px; border-radius: 10px; background: #F5F8FF; }
.rn-row b { font-size: 14px; }
.rn-lb { font-size: 13px; color: #6B7A90; font-weight: 600; }
.rn-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.rn-chip { border: 1px solid #D9E4F5; background: #fff; color: #45566E;
  border-radius: 99px; padding: 7px 15px; font-size: 13px; cursor: pointer;
  transition: all .18s cubic-bezier(.4,0,.2,1); }
.rn-chip:hover { border-color: #0052D9; color: #0052D9; }
.rn-chip.on { background: linear-gradient(135deg, #0052D9, #266FE8); border-color: #0052D9; color: #fff; font-weight: 600;
  box-shadow: 0 4px 12px rgba(0,82,217,.25); }
.rn-sum { padding: 12px; border-radius: 12px; background: #F5F8FF; border: 1px solid #E6EDF7; }
.rn-line { display: flex; align-items: center; justify-content: space-between; font-size: 13.5px; color: #45566E; padding: 3px 0; }
.rn-total { display: flex; align-items: center; justify-content: space-between; margin-top: 8px;
  padding-top: 10px; border-top: 1px dashed #D9E4F5; font-size: 14px; font-weight: 700; }
.rn-total b { font-size: 20px; color: #0052D9; }
.rn-new { display: flex; align-items: center; gap: 6px; font-size: 12.8px; color: #0052D9; margin-top: 6px; }
.rn-new .ico svg { width: 14px; height: 14px; }
.rn-note { font-size: 12.2px; color: #8C9AB0; margin-top: 6px; line-height: 1.6; }



.table-wrap:has(> table.keep-row),
.table-wrap.keep-row { overflow-x: auto !important; overflow-y: visible !important; }
table.table.keep-row { min-width: 1080px; }
table.table.keep-row th, table.table.keep-row td { vertical-align: middle; }
@media (max-width: 640px) { table.table.keep-row { min-width: 940px; } }


.vipcard{position:relative;overflow:hidden;border-radius:16px;padding:18px 20px;color:#fff;
  background:linear-gradient(135deg,#0052D9 0%,#266FE8 55%,#266FE8 100%);
  box-shadow:0 10px 26px rgba(0,82,217,.22);transition:transform .18s ease,box-shadow .18s ease}
.vipcard:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,82,217,.28)}
.vipcard::after{content:"";position:absolute;right:-40px;top:-60px;width:190px;height:190px;border-radius:50%;
  background:rgba(255,255,255,.13);pointer-events:none}
.vipcard::before{content:"";position:absolute;right:40px;bottom:-70px;width:130px;height:130px;border-radius:50%;
  background:rgba(255,255,255,.08);pointer-events:none}
.vipcard.off{background:linear-gradient(135deg,#8C8C8C 0%,#BFBFBF 100%);box-shadow:0 8px 20px rgba(0,0,0,.10)}
.vipcard.none{background:#fff;border:1px dashed var(--shuxu-4,#E5E7EB);color:var(--txt,#1F2937);box-shadow:none}
.vipcard.none::after,.vipcard.none::before{display:none}
.vc-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px}
.vc-brand{display:flex;align-items:center;gap:8px;min-width:0}
.vc-logo{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.22);color:#fff}
.vipcard.none .vc-logo{background:linear-gradient(135deg,#266FE8,#0052D9);color:#fff}
.vc-sys{font-size:13px;font-weight:700;letter-spacing:.4px;opacity:.92}
.vipcard.none .vc-sys{opacity:.6}
.vc-state{font-size:12px;padding:3px 10px;border-radius:99px;background:rgba(255,255,255,.22);white-space:nowrap}
.vc-state.ok{background:rgba(82,196,26,.92)}
.vc-state.warn{background:rgba(255,77,79,.92)}
.vipcard.none .vc-state{background:var(--shuxu-4,#F1F3F5);color:#6B7280}
.vc-mid{position:relative;z-index:1;margin-top:16px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.vc-name{font-size:19px;font-weight:800;letter-spacing:.3px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vipcard.none .vc-name{font-size:15px;font-weight:600;color:#6B7280}
.vc-disc{display:flex;align-items:baseline;gap:6px}
.vc-disc b{font-size:34px;font-weight:800;line-height:1}
.vc-disc span{font-size:13px;opacity:.85}
.vc-disc em{font-style:normal;font-size:12px;padding:2px 8px;border-radius:99px;background:rgba(255,255,255,.24)}
.vipcard.none .vc-disc b{font-size:26px;color:#BFBFBF}
.vc-foot{position:relative;z-index:1;margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.22);
  display:flex;gap:10px;flex-wrap:wrap}
.vipcard.none .vc-foot{border-top-color:var(--shuxu-4,#E5E7EB)}
.vc-cell{flex:1 1 120px;min-width:110px}
.vc-cell i{display:block;font-style:normal;font-size:11.5px;opacity:.8;margin-bottom:3px}
.vc-cell b{display:block;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vc-cell b.mono{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.5px}
@media (max-width:640px){
  .vipcard{padding:14px 16px}
  .vc-disc b{font-size:28px}
  .vc-cell{flex:1 1 100%}
}




.op-tab{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:99px;
  font-size:13px;line-height:1;cursor:pointer;user-select:none;
  border:1px solid var(--shuxu-4,#E5E7EB);color:#4A5568;background:#fff;
  transition:color .18s cubic-bezier(.4,0,.2,1),background .18s cubic-bezier(.4,0,.2,1),
             border-color .18s cubic-bezier(.4,0,.2,1)}
.op-tab:hover{border-color:#BCD8FF;color:#0052D9;background:#F5F9FF}
.op-tab.on{background:#0052D9;border-color:#0052D9;color:#fff;font-weight:600}
.op-tab em{font-style:normal;font-size:11px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;
  background:var(--shuxu-4,#F1F3F5);color:#6B7280;
  display:inline-flex;align-items:center;justify-content:center}
.op-tab.on em{background:rgba(255,255,255,.26);color:#fff}





.vc-logo{width:36px;height:36px;flex:0 0 36px;border-radius:11px;position:relative;
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#266FE8 0%,#0052D9 100%);
  box-shadow:0 3px 10px rgba(0,60,160,.32),inset 0 1px 0 rgba(255,255,255,.45);
  color:#fff;overflow:hidden}

.vc-logo::after{content:"";position:absolute;left:-30%;top:-60%;width:160%;height:120%;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.42) 0%,rgba(255,255,255,0) 62%);
  pointer-events:none}
.vc-logo svg{position:relative;z-index:1;filter:drop-shadow(0 1px 1px rgba(0,40,120,.35))}
.vipcard.none .vc-logo{background:linear-gradient(135deg,#D8DEE7 0%,#AEB8C6 100%);
  box-shadow:0 2px 6px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.5)}
.vipcard.none .vc-logo::after{opacity:.5}
.vc-sys{font-size:13.5px;font-weight:800;letter-spacing:.6px;opacity:.95}
@media (max-width:640px){
  .vc-logo{width:32px;height:32px;flex:0 0 32px;border-radius:10px}
}





.autotip{display:flex;align-items:center;gap:6px;margin:0 0 12px;
  font-size:12.5px;line-height:1.6;color:#8A94A6}
.autotip .ico{display:inline-flex;align-items:center;color:#A9B2C1;flex:0 0 auto}
.autotip .ico svg{display:block}
@media (max-width:640px){ .autotip{font-size:12px;margin-bottom:10px} }


.pf-grp{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:0 2px}
.pf-grp-t{font-size:14px;font-weight:700;color:var(--txt,#1F2A3D)}
.pf-plan{display:inline-flex;align-items:center;padding:3px 9px;border-radius:6px;
  font-size:12px;color:#9A6B00;background:#FFF6E5;border:1px solid #F3DFB8}
.dm-sum{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;
  border-radius:10px;background:linear-gradient(90deg,#F4F8FF,#fff);border:1px solid #E2EAF6}
.dm-sum-n{font-size:14px;font-weight:800;letter-spacing:.2px}
.dm-sum-q{margin-left:auto;font-size:12.5px;color:#8A94A6;font-variant-numeric:tabular-nums}




.pf-card{transition:box-shadow .16s ease,border-color .16s ease}
/* 应用市场骨架屏（shimmer 过渡动画） */
.sk{background:#eef1f6;border-radius:4px;position:relative;overflow:hidden}
.sk::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);transform:translateX(-100%);animation:skShimmer 1.15s ease-in-out infinite}
@keyframes skShimmer{100%{transform:translateX(100%)}}
.sk-ico{width:34px;height:34px;border-radius:8px;flex:none}
.sk-line{height:12px;border-radius:3px}
.sk-btn{width:64px;height:26px;border-radius:4px}
.sk-card{pointer-events:none}
@media (prefers-reduced-motion: reduce){.sk::after{animation:none}}
.pf-card:hover{box-shadow:0 6px 18px rgba(16,24,40,.10)}
.pf-card.pf-on{border-color:#BCD8FF;background:linear-gradient(180deg,#F7FAFF,#fff)}
.pf-card.pf-on:hover{border-color:#8FB6F5}
.pf-ico{display:inline-flex;align-items:center;justify-content:center;line-height:0}
.pf-ico svg{display:block;border-radius:9px;box-shadow:0 3px 8px rgba(16,24,40,.16)}
.pf-card.pf-off .pf-ico svg{box-shadow:0 2px 5px rgba(16,24,40,.10);opacity:.94}
@media (max-width:640px){
  .dm-sum{gap:6px;padding:9px 10px}
  .dm-sum-n{font-size:13px}
  .dm-sum-q{margin-left:0;width:100%}
}













@media (max-width: 860px) {
  


  .sidebar.mini { width: 260px; flex: 0 0 260px; padding: 16px 12px; }
  .sidebar.mini a, .sidebar.mini .grp, .sidebar.mini .ugrp,
  .sidebar.mini .side-toggle, .sidebar.mini .side-collapse,
  .sidebar.mini .side-logout, .sidebar.mini .side-level {
    justify-content: flex-start; gap: 10px;
  }
  .sidebar.mini .grp-t, .sidebar.mini .ugrp-t, .sidebar.mini .lo-t,
  .sidebar.mini .side-toggle .t, .sidebar.mini .side-collapse .t,
  .sidebar.mini .txt { display: inline; }
  .sidebar.mini .side-brand { display: flex; }
  
  .sidebar .side-collapse { display: none; }
  
  .sidebar { height: 100dvh; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }
}



@media (max-width: 400px) {
  .wrap, .page { padding-left: 10px !important; padding-right: 10px !important; }
  .page-head h1, .page-head h2 { font-size: 17px !important; }
  .topbar { padding: 0 10px; }
  .topbar .crumb { font-size: 12px; }
  .kpi .v, .kpi-v { font-size: 19px !important; }
  .card .hd { padding: 11px 12px !important; font-size: 13.5px; }
  .card .bd { padding: 12px !important; }
  .modal { max-width: calc(100vw - 16px); border-radius: 18px; }
  .modal .bd { padding: 14px; }
  .btn { height: 42px; padding: 0 14px; font-size: 14px; }
  .table th, .table td { padding: 8px 8px !important; font-size: 12.2px; }
}

@media (min-width: 861px) and (max-width: 1024px) {
  .page, .wrap { padding-left: 16px; padding-right: 16px; }
  .grid.g4, .grid.g5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1600px) {
  .wrap, .container { max-width: 1440px; margin-left: auto; margin-right: auto; }
}



html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

.card, .kpi, .pf-card, .mall-card, .vipcard { transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease; }

img, svg, video, canvas { max-width: 100%; }

body { overflow-wrap: break-word; word-break: break-word; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #CFDCEF; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #AFC5E6; }

.intg-banner{display:flex;align-items:center;gap:10px;margin:12px 14px 0;padding:10px 12px;border-radius:10px;border:1px solid #f0b357;background:linear-gradient(180deg,#fff8ec,#fff3df);color:#8a5a00;font-size:12.5px;line-height:1.6}
.intg-banner .ib-ico{flex:0 0 auto;display:flex;color:#d98b0b}
.intg-banner .ib-txt{flex:1 1 auto;min-width:0}
.intg-banner .ib-txt b{display:block;font-weight:700}
.intg-banner .ib-txt span{display:block;color:#9a6a10}
.intg-banner .ib-bad{flex:0 0 auto;min-width:22px;height:22px;padding:0 7px;border-radius:11px;background:#d98b0b;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.intg-tag{margin:0 6px;padding:1px 8px;border-radius:10px;font-size:11.5px;font-weight:600;border:1px solid transparent}
.intg-tag.ok{color:#1a8a4c;background:#eaf7ef;border-color:#bde5cb}
.intg-tag.warn,.intg-tag.modified{color:#b3350f;background:#fdeee9;border-color:#f5c6b6}
.intg-tag.unknown{color:#6b7280;background:#f1f3f5;border-color:#dfe3e8}

/* v1.9.144 表格横向滚动：宽表出滚动条而不是被挤扁 */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.table-wrap::-webkit-scrollbar{height:8px}
.table-wrap::-webkit-scrollbar-track{background:#F1F4FA;border-radius:4px}
.table-wrap::-webkit-scrollbar-thumb{background:#C7D5EC;border-radius:4px}
.table-wrap::-webkit-scrollbar-thumb:hover{background:#A9BEDA}
@media (min-width:1401px){ .table{min-width:760px} }
.modal .table-wrap{max-width:100%}

/* v1.9.150 用户中心侧栏「签到 / 余额」小标签：中文（默认）红色，英文模式绿色 */
.sidebar a .pill.ok,
html[data-lang="zh"] .sidebar a .pill.ok,
html[data-eye-site="1"] .sidebar a .pill.ok,
html[data-eye-admin="1"] .sidebar a .pill.ok{background:#FDECEA !important;color:#B42318 !important}
html[data-lang="en"] .sidebar a .pill.ok,
html[data-eye-site="1"][data-lang="en"] .sidebar a .pill.ok,
html[data-eye-admin="1"][data-lang="en"] .sidebar a .pill.ok{background:#E6F8F0 !important;color:#0B7A46 !important}



/* ============================================================
   管理后台侧边栏 · RuoYi 风格（一比一还原）
   主底 #304156 · 子菜单 #1f2d3d · 悬浮 #263445 · 激活文字 #409EFF
   ============================================================ */
.layout .sidebar,.sidebar{
  width:240px;flex:0 0 240px;
  background:#304156;border-right:none;
  padding:0;border-radius:0}
.sidebar{scrollbar-width:thin;scrollbar-color:#63676D transparent}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-track{background:transparent}
.sidebar::-webkit-scrollbar-thumb{background:#63676D;border-radius:3px}
.sidebar::after{display:none}

/* 顶部 Logo 栏：50px 高，与侧边栏同色 #304156 */
.side-brand{
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;height:50px;padding:0 10px;margin:0;
  background:#304156;border:none;border-radius:0}
.side-brand .logo-holder{width:32px;height:32px;flex:0 0 32px;border-radius:4px;
  background:transparent;border:none;padding:0;box-shadow:none;overflow:hidden}
.side-brand .txt{display:flex;flex-direction:column;justify-content:center;min-width:0}
.side-brand .txt b{font-size:14px;font-weight:600;line-height:1.25;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;-webkit-line-clamp:unset;-webkit-box-orient:unset}
.side-brand .txt span{font-size:11px;font-weight:400;color:#8a9bb8;margin-top:1px;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 一级分组标题：56px 高，通栏，无圆角 */
.sidebar .grp{
  display:flex;align-items:center;gap:10px;
  width:100%;height:56px;margin:0;padding:0 20px;
  background:transparent;border-radius:0;
  color:#bfcbd9;font-size:14px;font-weight:400;text-align:left}
.sidebar .grp::after{display:none}
.sidebar .grp:hover{background:#263445;color:#fff}
.sidebar .grp .grp-ico{width:18px;height:18px;flex:0 0 18px;border-radius:0;
  background:transparent!important;box-shadow:none;display:inline-flex;align-items:center;justify-content:center}
.sidebar .grp .grp-ico svg{width:16px;height:16px;opacity:1}
.sidebar .grp .grp-ico.blue,.sidebar .grp .grp-ico.cyan,.sidebar .grp .grp-ico.orange,
.sidebar .grp .grp-ico.purple,.sidebar .grp .grp-ico.green{color:#bfcbd9}
.sidebar .grp:hover .grp-ico.blue,.sidebar .grp:hover .grp-ico.cyan,
.sidebar .grp:hover .grp-ico.orange,.sidebar .grp:hover .grp-ico.purple,
.sidebar .grp:hover .grp-ico.green{color:#fff}
.sidebar .grp .grp-tag{background:#F56C6C;color:#fff;border-radius:10px;box-shadow:none}
.sidebar .grp .grp-ar{color:#8a9bb8;background:transparent}
.sidebar .grp:hover .grp-ar{background:transparent;color:#fff}

/* 二级菜单容器：#1f2d3d */
.sidebar .grp-body{background:#1f2d3d;margin:0;padding:0;position:relative}
.sidebar .grp-body::before{display:none}
.sidebar .grp-body>a{
  display:flex;align-items:center;gap:10px;
  width:100%;min-height:50px;margin:0;padding:0 45px;
  background:transparent;border-radius:0;
  color:#bfcbd9;font-size:14px;font-weight:400;text-align:left}
.sidebar .grp-body>a:hover{background:#001528;color:#409EFF}
.sidebar .grp-body>a.on{background:#001528;color:#409EFF;font-weight:400;box-shadow:none}
.sidebar .grp-body>a.on::before{display:none}
.sidebar .grp-body>a .ico{color:inherit;opacity:1}

/* 一级直链（无分组时） */
.sidebar>a{border-radius:0;background:transparent;color:#bfcbd9}
.sidebar>a:hover{background:#263445;color:#fff}

/* 徽标 */
.sidebar .pill{border:none;font-weight:600}
.sidebar a .pill.ok{background:transparent !important;color:#409EFF !important}
.sidebar a .pill.bad{background:#F56C6C !important;color:#fff !important}
.sidebar .dot-new{background:#F56C6C;box-shadow:none}
html[data-eye-admin="1"] .sidebar a .pill.ok,
html[data-eye-site="1"] .sidebar a .pill.ok{background:transparent !important;color:#409EFF !important}
html[data-lang="en"] .sidebar a .pill.ok,
html[data-eye-site="1"][data-lang="en"] .sidebar a .pill.ok,
html[data-eye-admin="1"][data-lang="en"] .sidebar a .pill.ok{background:transparent !important;color:#409EFF !important}

/* 退出登录：按普通菜单项处理 */
.sidebar a.side-logout{
  display:flex;align-items:center;gap:10px;
  width:100%;min-height:50px;margin:0;padding:0 20px;
  background:transparent;border:none;border-radius:0;
  color:#bfcbd9;font-size:14px;font-weight:400;box-shadow:none}
.sidebar a.side-logout .ico.lo{width:18px;height:18px;flex:0 0 18px;border-radius:0;
  background:transparent!important;box-shadow:none;color:inherit;display:inline-flex;align-items:center;justify-content:center}
.sidebar a.side-logout .ico.lo svg{width:16px;height:16px}
.sidebar a.side-logout:hover{background:#263445;color:#fff}
.sidebar a.side-logout:hover .ico.lo{background:transparent!important;color:#fff;box-shadow:none}

/* 底部工具区 */
.side-foot{display:flex;gap:0;padding:0;margin:0;background:transparent;border:none}
.side-foot>.side-toggle,.side-foot>.side-collapse{
  flex:1;min-width:0;height:44px;margin:0;padding:0;
  flex-direction:row;gap:8px;border-radius:0;
  background:transparent;color:#bfcbd9;font-size:12px;font-weight:400;text-align:center;justify-content:center}
.side-foot>.side-toggle:hover,.side-foot>.side-collapse:hover{background:#263445;color:#fff}
.side-toggle.on{background:#263445;color:#409EFF}
.side-toggle .ico,.side-collapse .ico{color:inherit;opacity:1}
.side-foot .t{opacity:1}
@media (min-width:861px){
  .sidebar .side-foot{background:#2b2f3a;box-shadow:none;border-top:1px solid rgba(255,255,255,.08)}
}

/* 迷你模式（54px，仅图标） */
.sidebar.mini{width:64px;flex:0 0 64px;padding:0}
.sidebar.mini .side-brand{padding:0 6px;justify-content:center;gap:0}
.sidebar.mini .side-brand .logo-holder{width:30px;height:30px;flex:0 0 30px}
.sidebar.mini .side-brand .txt{display:none}
.sidebar.mini a,.sidebar.mini .grp,.sidebar.mini .ugrp,
.sidebar.mini .side-toggle,.sidebar.mini .side-collapse,
.sidebar.mini .side-logout{justify-content:center;gap:0;padding-left:0;padding-right:0;font-size:0}
.sidebar.mini .grp-t,.sidebar.mini .ugrp-t,.sidebar.mini .grp-ar,
.sidebar.mini .ugrp-ar,.sidebar.mini .lo-t,
.sidebar.mini .side-toggle .t,.sidebar.mini .side-collapse .t{display:none}
.sidebar.mini .grp-body>a{padding:0 20px}
.sidebar.mini .grp .grp-ico,.sidebar.mini .ugrp .ugrp-ico{width:20px;height:20px}
.sidebar.mini a.on{background:#001528;box-shadow:none;color:#409EFF}

/* 移动端抽屉 */
@media (max-width:860px){
  .sidebar{width:240px;flex:0 0 240px;background:#304156}
  .sidebar a{padding:0 20px}
  .sidebar .grp-body>a{padding:0 45px}
}


/* ============================================================
   管理后台整体UI · RuoYi-Vue / Element UI 企业风格
   作用域：html[data-scope="admin"]，不影响前台
   ============================================================ */
html[data-scope="admin"]{
  --r-card:4px;
  --r-pill:4px;
  --ink:#303133;
  --sub:#606266;
  --muted:#909399;
  --line:#EBEEF5;
  --shuxu-1:#409EFF;
  --shuxu-2:#337ecc;
  --shuxu-3:#66b1ff;
  --shuxu-4:#ecf5ff;
  --shuxu-5:#f5f7fa;
  --ok:#67C23A; --warn:#E6A23C; --bad:#F56C6C;
  --amt-in:#67C23A; --amt-out:#F56C6C;
  --amt-in-soft:#f0f9eb; --amt-out-soft:#fef0f0;
  --grad-main:linear-gradient(135deg,#66b1ff 0%,#409EFF 100%);
  --grad-deep:linear-gradient(135deg,#337ecc 0%,#409EFF 55%,#66b1ff 100%);
  --shadow-1:0 1px 4px rgba(0,21,41,.08);
  --shadow-2:0 2px 12px rgba(0,21,41,.10);
  --shadow-3:0 4px 24px rgba(0,21,41,.14);
  --shadow-blue:0 2px 8px rgba(64,158,255,.22);
  --el-border:#DCDFE6; --el-border-light:#E4E7ED;
  --el-fill:#F5F7FA; --el-fill-dark:#f8f8f9;
}
html[data-scope="admin"] body{background:#f0f2f5}

/* ---- 布局 ---- */
html[data-scope="admin"] .layout{background:#f0f2f5}
html[data-scope="admin"] .page{padding:20px}
html[data-scope="admin"] .topbar{
  height:56px;background:#fff;backdrop-filter:none;
  border-bottom:none;box-shadow:0 1px 4px rgba(0,21,41,.08);
  padding:0 16px;gap:10px}
html[data-scope="admin"] .topbar .crumb{font-size:14px;color:#606266}
html[data-scope="admin"] .topbar .crumb b,
html[data-scope="admin"] .topbar .crumb strong{color:#303133;font-weight:600}
html[data-scope="admin"] .avatar{background:#409EFF;box-shadow:none;width:32px;height:32px;font-size:13px}
html[data-scope="admin"] .lang-switch{background:#f5f7fa;border-radius:4px;padding:2px}
html[data-scope="admin"] .lang-switch button{border-radius:3px;color:#606266}
html[data-scope="admin"] .lang-switch button.on{background:#fff;color:#409EFF;box-shadow:0 1px 3px rgba(0,21,41,.08)}
html[data-scope="admin"] .burger{border-radius:4px;border-color:#DCDFE6}

/* ---- 页头 ---- */
html[data-scope="admin"] .page-head{margin-bottom:16px}
html[data-scope="admin"] .page-head h2{font-size:18px;font-weight:600;color:#303133;letter-spacing:0}
html[data-scope="admin"] .page-head .right{gap:8px}

/* ---- 按钮：Element 平面化 ---- */
html[data-scope="admin"] .btn{
  height:34px;padding:0 15px;border-radius:4px;border:1px solid transparent;
  background:#409EFF;color:#fff;font-weight:500;font-size:13px;
  box-shadow:none;transition:background .15s,border-color .15s,color .15s}
html[data-scope="admin"] .btn:hover{background:#66b1ff;box-shadow:none;transform:none;color:#fff}
html[data-scope="admin"] .btn:active{background:#3a8ee6;transform:none}
html[data-scope="admin"] .btn:focus-visible{outline:0;box-shadow:0 0 0 2px rgba(64,158,255,.25)}
html[data-scope="admin"] .btn[disabled]{opacity:.5}
html[data-scope="admin"] .btn.ghost{
  background:#fff;color:#606266;border-color:#DCDFE6;box-shadow:none}
html[data-scope="admin"] .btn.ghost:hover{
  background:#ecf5ff;color:#409EFF;border-color:#c6e2ff;box-shadow:none}
html[data-scope="admin"] .btn.gray{
  background:#fff;color:#606266;border-color:#DCDFE6;box-shadow:none}
html[data-scope="admin"] .btn.gray:hover{background:#ecf5ff;color:#409EFF;border-color:#c6e2ff}
html[data-scope="admin"] .btn.danger{background:#F56C6C;box-shadow:none}
html[data-scope="admin"] .btn.danger:hover{background:#f78989;box-shadow:none}
html[data-scope="admin"] .btn.ok{background:#67C23A;box-shadow:none}
html[data-scope="admin"] .btn.ok:hover{background:#85cf60;box-shadow:none}
html[data-scope="admin"] .btn.sm{height:30px;padding:0 13px;font-size:12.5px}
html[data-scope="admin"] .btn.xs{height:26px;padding:0 10px;font-size:12px}

/* ---- 标签/徽标：Element Tag ---- */
html[data-scope="admin"] .pill{
  height:24px;padding:0 9px;border-radius:3px;font-size:12px;font-weight:400;
  background:#ecf5ff;color:#409EFF;border:1px solid #d9ecff}
html[data-scope="admin"] .pill.ok{background:#f0f9eb;color:#67C23A;border-color:#e1f3d8}
html[data-scope="admin"] .pill.warn{background:#fdf6ec;color:#E6A23C;border-color:#faecd8}
html[data-scope="admin"] .pill.bad{background:#fef0f0;color:#F56C6C;border-color:#fde2e2}
html[data-scope="admin"] .pill.gray{background:#f4f4f5;color:#909399;border-color:#e9e9eb}
html[data-scope="admin"] .pill.out{background:#fff;color:#606266;border-color:#DCDFE6}
html[data-scope="admin"] .pill.amt-in{background:#f0f9eb;color:#67C23A;border-color:#e1f3d8}
html[data-scope="admin"] .pill.amt-out{background:#fef0f0;color:#F56C6C;border-color:#fde2e2}
html[data-scope="admin"] .dot-new{background:#F56C6C;box-shadow:none}

/* ---- 卡片 ---- */
html[data-scope="admin"] .card{border-radius:4px;border-color:#EBEEF5;box-shadow:0 1px 4px rgba(0,21,41,.08)}
html[data-scope="admin"] .card .hd{padding:13px 18px;font-size:14px;font-weight:600;color:#303133}
html[data-scope="admin"] .card .bd{padding:16px 18px}
html[data-scope="admin"] .card .hd .more{font-size:12.5px;font-weight:400;color:#409EFF}
html[data-scope="admin"] .card.hover:hover{transform:none;box-shadow:0 2px 12px rgba(0,21,41,.12)}
html[data-scope="admin"] .hd-ico{border-radius:4px;background:#ecf5ff;color:#409EFF}
html[data-scope="admin"] .set-grp{font-size:14px;font-weight:600;color:#303133}
html[data-scope="admin"] .set-grp::before{border-radius:2px;background:#409EFF}
html[data-scope="admin"] .set-note{background:#f4f4f5;color:#909399;border-radius:4px}

/* ---- 表单 ---- */
html[data-scope="admin"] .field label{font-weight:400;color:#606266;font-size:13px}
html[data-scope="admin"] .input{
  height:34px;padding:0 12px;border-radius:4px;border-color:#DCDFE6;background:#fff;
  color:#303133;font-size:13px}
html[data-scope="admin"] .input::placeholder{color:#A8ABB2}
html[data-scope="admin"] .input:focus{border-color:#409EFF;box-shadow:none}
html[data-scope="admin"] .input:hover{border-color:#c0c4cc}
html[data-scope="admin"] .input.bad{border-color:#F56C6C;background:#fff}
html[data-scope="admin"] .input.bad:focus{border-color:#F56C6C;box-shadow:none}
html[data-scope="admin"] textarea.input{padding:8px 12px;border-radius:4px}
html[data-scope="admin"] select.input{
  background-position:calc(100% - 15px) 15px,calc(100% - 10px) 15px}
html[data-scope="admin"] .req{color:#F56C6C}
html[data-scope="admin"] .captcha-img{border-radius:4px;height:34px}

/* ---- 表格 ---- */
html[data-scope="admin"] .table{font-size:13px;color:#606266}
html[data-scope="admin"] .table th{
  background:#f8f8f9;color:#515a6e;font-weight:600;font-size:12.5px;
  padding:10px 12px;border-bottom:1px solid #e8eaec}
html[data-scope="admin"] .table td{padding:10px 12px;border-bottom:1px solid #f0f0f0;color:#606266}
html[data-scope="admin"] .table tr:hover td{background:#f5f7fa}
html[data-scope="admin"] .table .op{color:#409EFF;font-weight:400;font-size:13px}
html[data-scope="admin"] .table .op:hover{color:#66b1ff}
html[data-scope="admin"] .table .op.danger{color:#F56C6C}
html[data-scope="admin"] .table .op.danger:hover{color:#f78989}
html[data-scope="admin"] .table .op.warn{color:#E6A23C}
html[data-scope="admin"] .table .pill,.table .rtype,.table .icp-tag,.table .tag,
html[data-scope="admin"] .table .status,.table .badge{border-radius:3px}
html[data-scope="admin"] .empty{color:#909399}

/* ---- 分页 ---- */
html[data-scope="admin"] .pager .p{border-radius:4px;border-color:#DCDFE6;color:#606266;min-width:30px;height:30px;font-size:13px}
html[data-scope="admin"] .pager .p:hover{color:#409EFF;border-color:#c6e2ff;background:#ecf5ff}
html[data-scope="admin"] .pager .p.on{background:#409EFF;color:#fff;border-color:#409EFF}

/* ---- 开关 ---- */
html[data-scope="admin"] .switch{width:40px;height:20px}
html[data-scope="admin"] .switch::after{width:16px;height:16px}
html[data-scope="admin"] .switch.off{background:#DCDFE6}
html[data-scope="admin"] .switch.on{background:#409EFF}

/* ---- 弹窗 / 提示 ---- */
html[data-scope="admin"] .modal-mask{background:rgba(0,0,0,.5);backdrop-filter:none}
html[data-scope="admin"] .modal{border-radius:4px;box-shadow:0 3px 6px -4px rgba(0,0,0,.12),0 9px 28px 8px rgba(0,0,0,.05),0 18px 56px 16px rgba(0,0,0,.08)}
html[data-scope="admin"] .modal .hd{padding:14px 18px;font-size:15px;font-weight:600;color:#303133}
html[data-scope="admin"] .modal .bd{padding:18px}
html[data-scope="admin"] .modal .ft{padding:12px 18px}
html[data-scope="admin"] .modal .hd .x{color:#909399;font-size:18px}
html[data-scope="admin"] .modal .hd .x:hover{color:#409EFF}
html[data-scope="admin"] .toast{border-radius:4px;font-weight:400;box-shadow:0 2px 12px rgba(0,21,41,.12)}
html[data-scope="admin"] .toast.ok{background:#f0f9eb;border-color:#e1f3d8;color:#67C23A}
html[data-scope="admin"] .toast.err{background:#fef0f0;border-color:#fde2e2;color:#F56C6C}
html[data-scope="admin"] .toast.plain,.toast{color:#606266}
html[data-scope="admin"] .spinner{border-color:#ecf5ff;border-top-color:#409EFF}

/* ---- 保存条 ---- */
html[data-scope="admin"] .save-bar{
  border-radius:4px;background:#fff;backdrop-filter:none;
  border-color:#EBEEF5;box-shadow:0 1px 4px rgba(0,21,41,.08)}
html[data-scope="admin"] .save-bar .sb-tip i{background:#E6A23C}

/* ---- 仪表盘 ---- */
html[data-scope="admin"] .kpi{background:#fff;border-radius:4px;border-color:#EBEEF5}
html[data-scope="admin"] .kpi .v{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:#303133;font-size:24px;font-weight:700;letter-spacing:0}
html[data-scope="admin"] .kpi .k{color:#909399;font-size:12.5px}
html[data-scope="admin"] .qbar{background:#f0f0f0;border-radius:2px}
html[data-scope="admin"] .dash-hero{grid-template-columns:1fr 300px}
html[data-scope="admin"] .hero-main{
  border-radius:4px;background:linear-gradient(120deg,#2b6de8 0%,#409EFF 100%)}
html[data-scope="admin"] .hero-main::after,html[data-scope="admin"] .hero-main::before{display:none}
html[data-scope="admin"] .hero-num{letter-spacing:0}
html[data-scope="admin"] .hero-side{border-radius:4px;border:1px solid #EBEEF5}
html[data-scope="admin"] .hero-sub .chip{background:rgba(255,255,255,.14)}
html[data-scope="admin"] .hs-v{color:#303133}
html[data-scope="admin"] .hs-v.warn{color:#E6A23C}
html[data-scope="admin"] .intg-banner{border-radius:0}

/* ---- 应用市场/插件卡片等次要组件 ---- */
html[data-scope="admin"] .pay-item{border-radius:4px}
html[data-scope="admin"] .pay-opt{border-radius:4px}
html[data-scope="admin"] .cron-box{border-radius:4px}
html[data-scope="admin"] .rc-item{border-radius:4px}
html[data-scope="admin"] .rc-bal{border-radius:4px;background:#f5f7fa;border-color:#EBEEF5}
html[data-scope="admin"] .ap-code{border-radius:4px}
html[data-scope="admin"] .pwd-eye{border-radius:4px;color:#A8ABB2}
html[data-scope="admin"] .pwd-eye:hover{color:#409EFF;background:#f5f7fa}

/* ---- 护眼模式徽标维持可读 ---- */
html[data-eye-admin="1"] .pill.ok,html[data-eye-site="1"] .pill.ok{
  background:#16351F !important;color:#7FD9A0 !important;border-color:transparent}

/* ============================================================
   RuoYi 风格细节深化（第二轮）
   ============================================================ */
html[data-scope="admin"] .topbar{height:50px;padding:0 15px;box-shadow:0 1px 4px rgba(0,21,41,.08)}
html[data-scope="admin"] .topbar .crumb{font-size:13px;color:#909399;letter-spacing:0;font-weight:400}
html[data-scope="admin"] .topbar .right{gap:12px}
html[data-scope="admin"] .burger{width:34px;height:34px;border-radius:4px;box-shadow:none}

/* 视图切换淡入过渡（RuoYi 页面过渡） */
@keyframes shuxuAdminFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
html[data-scope="admin"] .page>section{animation:shuxuAdminFade .28s ease}
@media (prefers-reduced-motion:reduce){html[data-scope="admin"] .page>section{animation:none}}

/* 表格操作列：Element 链接 + 竖分隔线 */
html[data-scope="admin"] .table .op+.op{margin-left:0;padding-left:10px;border-left:1px solid #e8eaec}
html[data-scope="admin"] .table td.col-op{line-height:1.6}

/* 分页：Element 带背景样式 */
html[data-scope="admin"] .pager{padding:12px 18px;gap:6px}
html[data-scope="admin"] .pager .p{background:#f4f4f5;border-color:transparent;border-radius:3px;color:#606266;font-weight:400}
html[data-scope="admin"] .pager .p:hover{color:#409EFF;background:#ecf5ff}
html[data-scope="admin"] .pager .p.on{background:#409EFF;color:#fff}

/* 卡片头与弹窗头浅化 */
html[data-scope="admin"] .card .hd{background:transparent;border-bottom-color:#EBEEF5}
html[data-scope="admin"] .modal .hd{border-bottom:1px solid #EBEEF5}
html[data-scope="admin"] .modal .ft{border-top:1px solid #EBEEF5}

/* 表单细节 */
html[data-scope="admin"] .input-group{gap:8px}
html[data-scope="admin"] .sw-item{border-bottom:1px solid #EBEEF5;border-bottom-style:solid}
html[data-scope="admin"] .set-sub::after{background:#EBEEF5}
html[data-scope="admin"] .empty{padding:50px 20px;font-size:13px}

/* 链接色 */
html[data-scope="admin"] a{color:#409EFF}
html[data-scope="admin"] a:hover{color:#66b1ff}

/* 滚动条 Element 灰 */
html[data-scope="admin"] .content ::-webkit-scrollbar{width:8px;height:8px}
html[data-scope="admin"] .content ::-webkit-scrollbar-thumb{background:#d4d7de;border-radius:4px}
html[data-scope="admin"] .content ::-webkit-scrollbar-thumb:hover{background:#c0c4cc}
html[data-scope="admin"] .content ::-webkit-scrollbar-track{background:transparent}

/* ============================================================
   RuoYi 风格第三轮：全面拍平圆角与渐变（对齐 Element UI）
   ============================================================ */
/* 容器/面板圆角统一 4px */
html[data-scope="admin"] .kpi,
html[data-scope="admin"] .kpi .kpi-ico,
html[data-scope="admin"] .kpi .k2-ico,
html[data-scope="admin"] .rn-done,
html[data-scope="admin"] .rs-box,
html[data-scope="admin"] .notice-item,
html[data-scope="admin"] .logo-prev,
html[data-scope="admin"] .mall-bar,
html[data-scope="admin"] .mcard,
html[data-scope="admin"] .bi,
html[data-scope="admin"] .buy-top,
html[data-scope="admin"] .buy-note,
html[data-scope="admin"] .buy-rent,
html[data-scope="admin"] .buy-calc,
html[data-scope="admin"] .buy-tipbox,
html[data-scope="admin"] .buy-qty,
html[data-scope="admin"] .buy-hero,
html[data-scope="admin"] .rm-hero,
html[data-scope="admin"] .rm-domain,
html[data-scope="admin"] .rm-tip,
html[data-scope="admin"] .rec-panel,
html[data-scope="admin"] .pkg-card,
html[data-scope="admin"] .cur-plan,
html[data-scope="admin"] .dm-recs,
html[data-scope="admin"] .stat4 .s4,
html[data-scope="admin"] .dmp .table-wrap,
html[data-scope="admin"] .vd-list,
html[data-scope="admin"] .cron-box,
html[data-scope="admin"] .rc-item,
html[data-scope="admin"] .rc-bal,
html[data-scope="admin"] .pay-item,
html[data-scope="admin"] .pay-opt,
html[data-scope="admin"] .shuxu-confirm,
html[data-scope="admin"] .vipcard,
html[data-scope="admin"] .eye-btn,
html[data-scope="admin"] .ap-code,
html[data-scope="admin"] .set-note,
html[data-scope="admin"] .tk-preview img,
html[data-scope="admin"] .dm-tab,
html[data-scope="admin"] .mb-tab{border-radius:4px}

/* 徽标/标签类统一 3px */
html[data-scope="admin"] .mc-icp,
html[data-scope="admin"] .bt-badge,
html[data-scope="admin"] .rp-badge,
html[data-scope="admin"] .icp-tag,
html[data-scope="admin"] .mtag,
html[data-scope="admin"] .vd-tag,
html[data-scope="admin"] .soon-chip,
html[data-scope="admin"] .guard-chip,
html[data-scope="admin"] .bh-icp,
html[data-scope="admin"] .bh-tag,
html[data-scope="admin"] .op-tab,
html[data-scope="admin"] .op-tab em,
html[data-scope="admin"] .intg-tag,
html[data-scope="admin"] .intg-banner,
html[data-scope="admin"] .intg-banner .ib-bad,
html[data-scope="admin"] .plat-state,
html[data-scope="admin"] .vc-state,
html[data-scope="admin"] .vc-disc em,
html[data-scope="admin"] .hero-sub .chip{border-radius:3px}

/* 渐变图标块 → Element 纯色 */
html[data-scope="admin"] .kpi-ico.blue,
html[data-scope="admin"] .k-c-blue .k2-ico{background:#409EFF;box-shadow:none}
html[data-scope="admin"] .kpi-ico.green,
html[data-scope="admin"] .k-c-green .k2-ico{background:#67C23A;box-shadow:none}
html[data-scope="admin"] .kpi-ico.orange,
html[data-scope="admin"] .k-c-amber .k2-ico{background:#E6A23C;box-shadow:none}
html[data-scope="admin"] .kpi-ico.purple,
html[data-scope="admin"] .k-c-cyan .k2-ico{background:#909399;box-shadow:none}
html[data-scope="admin"] .rs-box .rs-ico.cyan{background:#409EFF}
html[data-scope="admin"] .rs-box .rs-ico.blue{background:#409EFF}
html[data-scope="admin"] .rs-box .rs-ico.green{background:#67C23A}
html[data-scope="admin"] .rs-box .rs-ico.grey{background:#909399}

/* 渐变横幅/标签 → 纯色 */
html[data-scope="admin"] .rn-done{background:#f0f9eb;border:1px solid #e1f3d8}
html[data-scope="admin"] .rn-ico{background:#67C23A}
html[data-scope="admin"] .mtag.hot{background:#F56C6C}
html[data-scope="admin"] .mtag.new{background:#67C23A}
html[data-scope="admin"] .dm-tab.on{background:#409EFF;border-color:#409EFF;color:#fff}
html[data-scope="admin"] .rn-chip.on{background:#409EFF;border-color:#409EFF}
html[data-scope="admin"] .rq-bar i,
html[data-scope="admin"] .mini-bar i{background:#409EFF;border-radius:2px}
html[data-scope="admin"] .pf-card.pf-on{border-color:#c6e2ff;background:#ecf5ff}
html[data-scope="admin"] .eye-btn.on{background:#fdf6ec;border-color:#faecd8;color:#B88230;font-weight:500}
html[data-scope="admin"] .buy-calc{border:1px solid #c6e2ff;background:#ecf5ff}
html[data-scope="admin"] .sb,
html[data-scope="admin"] .sb-ic,
html[data-scope="admin"] .hd-ico,
html[data-scope="admin"] .scene-ico,
html[data-scope="admin"] .card-ico,
html[data-scope="admin"] .ph-ico{border-radius:4px;background:#ecf5ff;color:#409EFF}
html[data-scope="admin"] .sb-ic{width:36px;height:36px;flex:0 0 36px}
/* 统计卡：RuoYi 仪表盘风格 —— 白卡+纯色图标方块，去左侧彩条 */
html[data-scope="admin"] .sb{background:#fff;border:1px solid #EBEEF5;box-shadow:none;overflow:visible}
html[data-scope="admin"] .sb::before{display:none}
html[data-scope="admin"] .sb-ic{border-radius:4px;background:#409EFF;color:#fff}
html[data-scope="admin"] .sb.g .sb-ic{background:#67C23A;color:#fff}
html[data-scope="admin"] .sb.o .sb-ic{background:#E6A23C;color:#fff}
html[data-scope="admin"] .sb.r .sb-ic{background:#F56C6C;color:#fff}
html[data-scope="admin"] .sb.s .sb-ic{background:#909399;color:#fff}
html[data-scope="admin"] .sb-v{font-size:22px;font-weight:600;color:#303133}
html[data-scope="admin"] .sb-l{color:#909399;font-size:12.5px}

/* 商城/套餐卡片去彩条 */
html[data-scope="admin"] .mcard::before,
html[data-scope="admin"] .pkg-card::before{display:none}
html[data-scope="admin"] .mc-brand,
html[data-scope="admin"] .bh-mark,
html[data-scope="admin"] .vc-logo{border-radius:4px;box-shadow:none}
html[data-scope="admin"] .mb-tab.on,
html[data-scope="admin"] .mb-tab[class*="on"]{border-radius:3px}

/* 表格内标签与状态类 */
html[data-scope="admin"] .table .rtype,
html[data-scope="admin"] .table .icp-tag,
html[data-scope="admin"] .table .tag,
html[data-scope="admin"] .table .status,
html[data-scope="admin"] .table .badge{border-radius:3px}

/* 输入组与图标胶囊 */
html[data-scope="admin"] .pwd-eye,
html[data-scope="admin"] .captcha-img{border-radius:4px}
html[data-scope="admin"] .lo-ico,
html[data-scope="admin"] .bg-ico{border-radius:4px;background:#ecf5ff;color:#409EFF}

/* ============================================================
   第四轮：仪表盘英雄卡 → Vite Admin 风格白卡
   ============================================================ */
html[data-scope="admin"] .dash-hero{background:#fff;border:1px solid #EBEEF5;border-radius:4px;box-shadow:none;padding:0;overflow:hidden}
html[data-scope="admin"] .dash-hero .hero-main{background:transparent;box-shadow:none;padding:20px;color:#303133}
html[data-scope="admin"] .dash-hero .hero-main>div:first-child{font-size:14px;color:#606266;font-weight:500}
html[data-scope="admin"] .hero-ico{width:40px;height:40px;flex:0 0 40px;border-radius:6px;background:#409EFF;box-shadow:none}
html[data-scope="admin"] .hero-num{font-size:28px;font-weight:700;color:#303133;margin:10px 0 12px;letter-spacing:0}
html[data-scope="admin"] .hero-sub .chip{background:#ecf5ff;border:1px solid #d9ecff;border-radius:3px;color:#409EFF;font-weight:400}
html[data-scope="admin"] .hero-sub .chip b{color:#409EFF;font-weight:600}
html[data-scope="admin"] .hero-side{background:#fff;border-left:1px solid #EBEEF5;border-radius:0}
html[data-scope="admin"] .hs{border-bottom:1px solid #f2f4f7;padding:10px 18px}
html[data-scope="admin"] .hs:last-child{border-bottom:none}
html[data-scope="admin"] .hs-k{color:#909399;font-size:13px;font-weight:400}
html[data-scope="admin"] .hs-v{color:#303133;font-size:15px;font-weight:600}
html[data-scope="admin"] .hs-v.warn{color:#E6A23C}

/* 表格空状态占位行 */
html[data-scope="admin"] .table td.empty{text-align:center;color:#909399;font-size:13px;padding:32px 12px}

/* ============================================================
   第五轮：后台表格在窄视口保持正常表格（不转为竖排卡片）
   ============================================================ */
@media (max-width: 1400px) {
  html[data-scope="admin"] .table-wrap{overflow-x:auto;overflow-y:hidden}
  html[data-scope="admin"] .table{min-width:600px !important;width:100%;table-layout:auto}
  html[data-scope="admin"] .table thead{display:table-header-group}
  html[data-scope="admin"] .table > tr:first-child,
  html[data-scope="admin"] .table > tbody > tr:first-child{display:table-row}
  html[data-scope="admin"] .table > tr,
  html[data-scope="admin"] .table > tbody > tr{display:table-row;border:0;border-radius:0;background:transparent;padding:0;margin:0}
  html[data-scope="admin"] .table > tr > td,
  html[data-scope="admin"] .table > tbody > tr > td{display:table-cell;width:auto;border:0;border-bottom:1px solid #EBEEF5;padding:11px 14px;text-align:left;white-space:nowrap}
  html[data-scope="admin"] .table > tr > td[data-lb]::before,
  html[data-scope="admin"] .table > tbody > tr > td[data-lb]::before{content:none}
  html[data-scope="admin"] .table > tr > td[data-lb],
  html[data-scope="admin"] .table > tbody > tr > td[data-lb]{display:table-cell}
}

/* 后台：抵消 JS 注入的 tbl-card 竖排卡片化，始终保持 Element 表格 */
html[data-scope="admin"] .table-wrap.tbl-card{overflow-x:auto !important;overflow-y:hidden}
html[data-scope="admin"] .table-wrap.tbl-card > .table{min-width:600px !important;width:100%;table-layout:auto}
html[data-scope="admin"] .table-wrap.tbl-card > .table > thead{display:table-header-group}
html[data-scope="admin"] .table-wrap.tbl-card > .table > tr:first-child,
html[data-scope="admin"] .table-wrap.tbl-card > .table > tbody > tr:first-child{display:table-row}
html[data-scope="admin"] .table-wrap.tbl-card > .table > tr,
html[data-scope="admin"] .table-wrap.tbl-card > .table > tbody > tr{display:table-row;border:0;border-radius:0;background:transparent;padding:0;margin:0}
html[data-scope="admin"] .table-wrap.tbl-card > .table > tr:last-child,
html[data-scope="admin"] .table-wrap.tbl-card > .table > tbody > tr:last-child{margin-bottom:0}
html[data-scope="admin"] .table-wrap.tbl-card > .table > tr > td,
html[data-scope="admin"] .table-wrap.tbl-card > .table > tbody > tr > td{display:table-cell;width:auto;border:0;border-bottom:1px solid #EBEEF5;padding:11px 14px;text-align:left;white-space:nowrap}
html[data-scope="admin"] .table-wrap.tbl-card > .table > tr > td[data-lb],
html[data-scope="admin"] .table-wrap.tbl-card > .table > tbody > tr > td[data-lb]{display:table-cell;gap:0}
html[data-scope="admin"] .table-wrap.tbl-card > .table > tr > td[data-lb]::before,
html[data-scope="admin"] .table-wrap.tbl-card > .table > tbody > tr > td[data-lb]::before{content:none}
html[data-scope="admin"] .table-wrap.tbl-card .table td.col-op{white-space:nowrap;line-height:2.2;min-width:180px;text-align:right}
html[data-scope="admin"] .table-wrap.tbl-card .table td.col-op .op{margin-left:0;margin-right:0}
html[data-scope="admin"] .table-wrap.tbl-card .table td.col-op .op+.op{margin-left:0;padding-left:10px;border-left:1px solid #e8eaec}

/* ============================================================
   第六轮：卡片 → Vue Shop Vite 风格（白底/8px圆角/柔和阴影）
   ============================================================ */
html[data-scope="admin"] .card{background:#fff;border:1px solid transparent;border-radius:8px;
  box-shadow:0 1px 2px rgba(31,35,41,.04),0 2px 12px rgba(31,35,41,.06)}
html[data-scope="admin"] .card:hover{box-shadow:0 1px 2px rgba(31,35,41,.06),0 4px 16px rgba(31,35,41,.09)}
html[data-scope="admin"] .card .hd{border-bottom:1px solid #f0f1f5;background:transparent;
  font-size:15px;font-weight:600;color:#1d2129}
html[data-scope="admin"] .card .bd{padding:20px}
html[data-scope="admin"] .card.bd{padding:20px}
html[data-scope="admin"] .kpi{background:#fff;border:1px solid transparent;border-radius:8px;
  box-shadow:0 1px 2px rgba(31,35,41,.04),0 2px 12px rgba(31,35,41,.06)}
html[data-scope="admin"] .sb{background:#fff;border:1px solid transparent;border-radius:8px;
  box-shadow:0 1px 2px rgba(31,35,41,.04),0 2px 12px rgba(31,35,41,.06)}
html[data-scope="admin"] .rs-box{background:#f7f8fa;border:1px solid transparent;border-radius:8px;box-shadow:none}
html[data-scope="admin"] .modal{border-radius:8px;box-shadow:0 6px 30px rgba(31,35,41,.14)}
html[data-scope="admin"] .save-bar{border-radius:8px;box-shadow:0 1px 2px rgba(31,35,41,.04),0 2px 12px rgba(31,35,41,.06)}

/* ============================================================
   第七轮：侧边栏滚动条隐藏 / 英雄卡重设计 / 趋势图重设计
   ============================================================ */
html[data-scope="admin"] .sidebar::-webkit-scrollbar{display:none}
html[data-scope="admin"] .sidebar{scrollbar-width:none;-ms-overflow-style:none}

/* 英雄卡：横向布局 + 迷你统计块 */
html[data-scope="admin"] .dash-hero .hero-main{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:22px 24px}
html[data-scope="admin"] .dash-hero .hm-top{display:flex;align-items:center;gap:14px}
html[data-scope="admin"] .dash-hero .hm-info{display:flex;flex-direction:column;gap:2px}
html[data-scope="admin"] .dash-hero .hm-l{font-size:13px;color:#909399}
html[data-scope="admin"] .dash-hero .hero-num{margin:0;font-size:30px;line-height:1.15}
html[data-scope="admin"] .dash-hero .hero-sub{display:flex;gap:12px;flex-wrap:wrap}
html[data-scope="admin"] .dash-hero .hero-sub .chip{display:flex;align-items:center;gap:8px;min-width:130px;
  background:#f7f8fa;border:1px solid transparent;border-radius:6px;padding:9px 14px}
html[data-scope="admin"] .dash-hero .hero-sub .chip i{display:inline-flex}
html[data-scope="admin"] .dash-hero .hero-sub .chip span{font-size:12.5px;color:#909399;white-space:nowrap}
html[data-scope="admin"] .dash-hero .hero-sub .chip b{font-size:15px;font-weight:600;color:#303133;margin-left:auto}

/* 趋势图 */
html[data-scope="admin"] .tc-range{margin-left:auto;font-size:12px;color:#909399;font-weight:400;
  background:#f4f4f5;border-radius:3px;padding:2px 8px}
html[data-scope="admin"] .tc-legend{display:flex;gap:18px;align-items:center;margin-bottom:10px}
html[data-scope="admin"] .tc-lg{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:#606266}
html[data-scope="admin"] .tc-lg i{width:10px;height:10px;border-radius:2px;display:inline-block}
html[data-scope="admin"] .tc-lg b{color:#303133;font-weight:600}
html[data-scope="admin"] .tc-svg{width:100%;height:auto;display:block}
html[data-scope="admin"] .tc-svg circle{transition:r .15s}
html[data-scope="admin"] .tc-svg circle:hover{r:4}
html[data-scope="admin"] .tc-x{display:flex;justify-content:space-between;margin-top:6px;padding:0 2px;
  font-size:11.5px;color:#909399}

/* ============================================================
   第八轮：头像QQ化 + 悬浮账号菜单（Element Dropdown 风格）
   ============================================================ */
html[data-scope="admin"] .avatar-wrap{position:relative;display:flex;align-items:center}
html[data-scope="admin"] .avatar-wrap .avatar{cursor:pointer;overflow:hidden}
html[data-scope="admin"] .avatar-wrap .avatar img{width:100%;height:100%;object-fit:cover;display:block}
html[data-scope="admin"] .user-pop{position:absolute;top:calc(100% + 8px);right:0;z-index:1200;min-width:180px;
  background:#fff;border:1px solid #e4e7ed;border-radius:6px;padding:6px 0;
  box-shadow:0 6px 16px rgba(31,35,41,.12),0 3px 6px rgba(31,35,41,.08)}
html[data-scope="admin"] .user-pop::before{content:"";position:absolute;top:-5px;right:16px;width:10px;height:10px;
  background:#fff;border-left:1px solid #e4e7ed;border-top:1px solid #e4e7ed;transform:rotate(45deg)}
html[data-scope="admin"] .up-hd{padding:9px 14px 8px;border-bottom:1px solid #EBEEF5;margin-bottom:4px}
html[data-scope="admin"] .up-hd b{display:block;font-size:14px;color:#303133;font-weight:600}
html[data-scope="admin"] .up-hd span{font-size:12px;color:#909399}
html[data-scope="admin"] .up-item{display:flex;align-items:center;gap:9px;padding:9px 14px;font-size:13.5px;
  color:#606266;cursor:pointer;text-decoration:none}
html[data-scope="admin"] .up-item:hover{background:#f5f7fa;color:#409EFF}
html[data-scope="admin"] .up-item .ico{display:inline-flex;color:inherit}
html[data-scope="admin"] .up-item.danger{color:#F56C6C}
html[data-scope="admin"] .up-item.danger:hover{background:#fef0f0;color:#F56C6C}
html[data-scope="admin"] .popfade-enter-active,.popfade-leave-active{transition:opacity .15s ease,transform .15s ease}
html[data-scope="admin"] .popfade-enter,.popfade-leave-to{opacity:0;transform:translateY(-4px)}
html[data-scope="admin"] .fld-tip{font-style:normal;font-size:11.5px;color:#909399;font-weight:400;margin-left:6px}

/* ============================================================
   第九轮：在线客服工作台（后台） + 用户端悬浮客服（前台）
   ============================================================ */
html[data-scope="admin"] .cs-wrap{display:flex;gap:16px;height:calc(100vh - 190px);min-height:480px}
html[data-scope="admin"] .cs-side{width:300px;flex:0 0 300px;display:flex;flex-direction:column;overflow:hidden;padding:0}
html[data-scope="admin"] .cs-side-hd{padding:14px 16px;font-size:14px;font-weight:600;color:#303133;border-bottom:1px solid #EBEEF5}
html[data-scope="admin"] .cs-thlist{flex:1;overflow-y:auto;padding:6px}
html[data-scope="admin"] .cs-th{display:flex;gap:10px;padding:10px;border-radius:6px;cursor:pointer;align-items:flex-start}
html[data-scope="admin"] .cs-th:hover{background:#f5f7fa}
html[data-scope="admin"] .cs-th.on{background:#ecf5ff}
html[data-scope="admin"] .cs-av{width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:#409EFF;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:600}
html[data-scope="admin"] .cs-av.big{width:38px;height:38px;flex-basis:38px}
html[data-scope="admin"] .cs-th-main{flex:1;min-width:0}
html[data-scope="admin"] .cs-th-name{font-size:13.5px;color:#303133;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-scope="admin"] .cs-th-id{font-size:11px;color:#909399;font-weight:400;margin-left:5px}
html[data-scope="admin"] .cs-th-prev{font-size:12.5px;color:#909399;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-scope="admin"] .cs-th-meta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:0 0 auto}
html[data-scope="admin"] .cs-th-time{font-size:11px;color:#c0c4cc}
html[data-scope="admin"] .cs-badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#F56C6C;color:#fff;
  font-size:11px;display:inline-flex;align-items:center;justify-content:center;font-weight:600}
html[data-scope="admin"] .cs-main{flex:1;display:flex;flex-direction:column;overflow:hidden;padding:0;min-width:0}
html[data-scope="admin"] .cs-hd{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid #EBEEF5}
html[data-scope="admin"] .cs-hd-t b{display:block;font-size:14px;color:#303133}
html[data-scope="admin"] .cs-hd-t span{font-size:12px;color:#909399}
html[data-scope="admin"] .cs-msgs{flex:1;overflow-y:auto;padding:18px 20px;background:#fafbfc}
html[data-scope="admin"] .cs-tip{text-align:center;font-size:12px;color:#c0c4cc;margin-bottom:12px}
html[data-scope="admin"] .cs-m{margin-bottom:16px;display:flex;flex-direction:column}
html[data-scope="admin"] .cs-m.admin{align-items:flex-end}
html[data-scope="admin"] .cs-m.user{align-items:flex-start}
html[data-scope="admin"] .cs-bubble{max-width:70%;padding:10px 13px;border-radius:8px;font-size:14px;line-height:1.55;
  color:#303133;background:#fff;border:1px solid #EBEEF5;word-break:break-word;white-space:pre-wrap}
html[data-scope="admin"] .cs-m.admin .cs-bubble{background:#409EFF;border-color:#409EFF;color:#fff}
html[data-scope="admin"] .cs-bubble .cs-img{max-width:min(160px,100%);max-height:120px;border-radius:4px;display:block;cursor:zoom-in}
html[data-scope="admin"] .cs-bubble .cs-video{max-width:min(220px,100%);border-radius:4px;display:block;background:#000}
html[data-scope="admin"] .cs-bubble .cs-audio{width:240px;height:38px}
html[data-scope="admin"] .cs-m.admin .cs-bubble .cs-audio{color:#303133}
html[data-scope="admin"] .cs-file{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:inherit;text-decoration:underline}
html[data-scope="admin"] .cs-mtime{font-size:11px;color:#c0c4cc;margin-top:4px}
html[data-scope="admin"] .cs-input{border-top:1px solid #EBEEF5;padding:10px 14px}
html[data-scope="admin"] .cs-tools{display:flex;align-items:center;gap:6px;margin-bottom:8px}
html[data-scope="admin"] .cs-tool{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:5px;color:#909399;cursor:pointer}
html[data-scope="admin"] .cs-tool:hover{background:#f5f7fa;color:#409EFF}
html[data-scope="admin"] .cs-uping{font-size:12px;color:#909399;margin-left:6px}
html[data-scope="admin"] .cs-row{display:flex;gap:10px;align-items:flex-end}
html[data-scope="admin"] .cs-ta{flex:1;resize:none;border:1px solid #DCDFE6;border-radius:4px;padding:8px 11px;font-size:14px;
  line-height:1.5;color:#303133;outline:none;font-family:inherit}
html[data-scope="admin"] .cs-ta:focus{border-color:#409EFF}
html[data-scope="admin"] .cs-pick-tip{margin:auto}
html[data-scope="admin"] .cs-viewer{max-width:88vw;max-height:88vh;border-radius:6px}
html[data-scope="admin"] .mi-dot{min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:#F56C6C;color:#fff;
  font-size:10.5px;display:inline-flex;align-items:center;justify-content:center;margin-left:auto;font-weight:600}
html[data-scope="admin"] .grp-body a .mi-dot{margin-left:auto}

/* ---------------- 用户端悬浮客服（前台 + 用户中心） ---------------- */
.csx-btn{position:fixed;right:24px;bottom:24px;z-index:9000;width:54px;height:54px;border-radius:50%;
  background:linear-gradient(135deg,#409EFF,#2f7fe0);color:#fff;border:none;cursor:pointer;
  box-shadow:0 4px 16px rgba(64,158,255,.45);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.csx-btn:hover{transform:scale(1.08)}
.csx-btn .csx-dot{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:#F56C6C;color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:600;
  border:2px solid #fff}
.csx-panel{position:fixed;right:24px;bottom:90px;z-index:9001;width:360px;max-width:calc(100vw - 32px);height:520px;
  max-height:calc(100vh - 130px);background:#fff;border-radius:12px;box-shadow:0 12px 40px rgba(31,35,41,.18);
  display:flex;flex-direction:column;overflow:hidden;font-size:14px;color:#303133}
.csx-hd{background:#409EFF;color:#fff;padding:13px 16px;display:flex;align-items:center;gap:8px;font-weight:600}
.csx-hd button{margin-left:auto;background:none;border:none;color:#fff;cursor:pointer;font-size:18px;line-height:1;opacity:.85}
.csx-hd button:hover{opacity:1}
.csx-login{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#909399;padding:20px}
.csx-login a{background:#409EFF;color:#fff;text-decoration:none;padding:8px 22px;border-radius:5px;font-size:13.5px}
.csx-msgs{flex:1;overflow-y:auto;padding:14px;background:#f4f6f9}
.csx-tip{text-align:center;font-size:12px;color:#c0c4cc;margin-bottom:10px}
.csx-m{margin-bottom:12px;display:flex;flex-direction:column}
.csx-m.me{align-items:flex-end}
.csx-m.ta{align-items:flex-start}
.csx-bubble{max-width:76%;padding:9px 12px;border-radius:8px;font-size:13.5px;line-height:1.5;word-break:break-word;
  white-space:pre-wrap;background:#fff;border:1px solid #e8ebf0;color:#303133}
.csx-m.me .csx-bubble{background:#409EFF;border-color:#409EFF;color:#fff}
.csx-m .csx-time{font-size:10.5px;color:#c0c4cc;margin-top:3px}
.csx-bubble img{max-width:200px;max-height:180px;border-radius:5px;display:block;cursor:zoom-in}
.csx-bubble video{max-width:240px;border-radius:5px;display:block;background:#000}
.csx-bubble audio{width:220px;height:36px}
.csx-m.me .csx-bubble audio{color:#303133}
.csx-bubble a{display:inline-flex;align-items:center;gap:6px;color:inherit;font-size:12.5px;text-decoration:underline}
.csx-input{border-top:1px solid #ebeef5;padding:8px 10px;background:#fff}
.csx-tools{display:flex;gap:4px;margin-bottom:6px;align-items:center}
.csx-tool{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;
  color:#909399;cursor:pointer;background:none;border:none}
.csx-tool:hover{background:#f5f7fa;color:#409EFF}
.csx-tool.rec-on{color:#F56C6C;background:#fef0f0;animation:csxPulse 1s infinite}
.csx-tool svg{pointer-events:none}
@keyframes csxPulse{0%,100%{opacity:1}50%{opacity:.55}}
.csx-uping{font-size:11.5px;color:#909399;margin-left:5px}
.csx-row{display:flex;gap:8px;align-items:center}
.csx-ta{flex:1;border:1px solid #dcdfe6;border-radius:6px;padding:8px 10px;font-size:13.5px;resize:none;outline:none;
  font-family:inherit;color:#303133;line-height:1.4}
.csx-ta:focus{border-color:#409EFF}
.csx-send{background:#409EFF;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:13px;cursor:pointer}
.csx-send:hover{background:#3a94ee}
.csx-send:disabled{opacity:.55;cursor:not-allowed}
.csx-viewer{position:fixed;inset:0;z-index:9100;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center}
.csx-viewer img{max-width:90vw;max-height:90vh;border-radius:6px}
@media (max-width:520px){
  .csx-panel{right:8px;bottom:84px;width:calc(100vw - 16px)}
  .csx-btn{right:16px;bottom:16px}
}


/* ============================================================
   第十轮：用户后台复用管理端 RuoYi/Element 风格
   用户中心 data-scope="admin"，通用组件由上方覆盖块接管；
   此处仅适配用户侧边栏专属元素（.ugrp 分组 / .side-level 等级）
   ============================================================ */

/* 一级分组标题（用户中心 .ugrp）：对齐管理端 .grp 规格 */
html[data-scope="admin"] .sidebar .ugrp{
  display:flex;align-items:center;gap:10px;
  width:100%;height:50px;margin:0;padding:0 20px;
  background:transparent;border-radius:0;
  color:#bfcbd9;font-size:14px;font-weight:400;text-align:left}
html[data-scope="admin"] .sidebar .ugrp:hover{background:#263445;color:#fff}
html[data-scope="admin"] .sidebar .ugrp.open{color:#fff}
html[data-scope="admin"] .sidebar .ugrp .ugrp-ico{width:18px;height:18px;flex:0 0 18px;border-radius:0;
  background:transparent!important;box-shadow:none;color:#bfcbd9;display:inline-flex;align-items:center;justify-content:center}
html[data-scope="admin"] .sidebar .ugrp .ugrp-ico svg{width:16px;height:16px;opacity:1}
html[data-scope="admin"] .sidebar .ugrp:hover .ugrp-ico,
html[data-scope="admin"] .sidebar .ugrp.open .ugrp-ico{color:#fff}
html[data-scope="admin"] .sidebar .ugrp .ugrp-ar{color:#8a9bb8;background:transparent;transform:none}
html[data-scope="admin"] .sidebar .ugrp .ugrp-ar.open{transform:rotate(180deg)}
html[data-scope="admin"] .sidebar .ugrp:hover .ugrp-ar,
html[data-scope="admin"] .sidebar .ugrp.open .ugrp-ar{color:#fff}

/* 二级菜单容器（用户中心 .ugrp-body）：#1f2d3d + 子菜单 #001528 */
html[data-scope="admin"] .sidebar .ugrp-body{background:#1f2d3d;margin:0;padding:0;position:relative}
html[data-scope="admin"] .sidebar .ugrp-body::before{display:none}
html[data-scope="admin"] .sidebar .ugrp-body>a{
  display:flex;align-items:center;gap:10px;
  width:100%;min-height:50px;margin:0;padding:0 45px;
  background:transparent;border-radius:0;
  color:#bfcbd9;font-size:14px;font-weight:400;text-align:left}
html[data-scope="admin"] .sidebar .ugrp-body>a:hover{background:#001528;color:#409EFF}
html[data-scope="admin"] .sidebar .ugrp-body>a.on{background:#001528;color:#409EFF;font-weight:400;box-shadow:none}
html[data-scope="admin"] .sidebar .ugrp-body>a.on::before{display:none}
html[data-scope="admin"] .sidebar .ugrp-body>a .ico{color:inherit;opacity:1}

/* 徽标 pill：居右、Element 配色 */
html[data-scope="admin"] .sidebar .ugrp-body>a .pill{margin-left:auto}
html[data-scope="admin"] .sidebar a .pill{border-radius:10px;font-weight:600}

/* 会员等级条：融入深色侧边栏 */
html[data-scope="admin"] .sidebar .side-level{
  margin:10px 12px 0;padding:9px 12px;border-radius:4px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);
  color:#bfcbd9;font-size:12.5px}
html[data-scope="admin"] .sidebar .side-level b{color:#fff;font-weight:600}
html[data-scope="admin"] .sidebar .side-level .sub{color:#8a9bb8}

/* 顶栏铃铛按钮：Element 方角风格 */
html[data-scope="admin"] .bell-btn{border-radius:4px;border-color:#DCDFE6;background:#fff;color:#606266}
html[data-scope="admin"] .bell-btn:hover{background:#ecf5ff;color:#409EFF;border-color:#c6e2ff}
html[data-scope="admin"] .bell-btn.on{background:#ecf5ff;color:#409EFF;border-color:#c6e2ff}
html[data-scope="admin"] .bell-btn .bell-dot{background:#F56C6C;box-shadow:none;border:none}

/* ============================================================
   第十一轮：腾讯云控制台风格（TDesign）
   品牌蓝 #0052D9 · 灰阶中性色 · 白卡+细边框无阴影 · 3px 控件圆角
   侧边栏（.sidebar 及其子元素）保持原样，不做改动
   ============================================================ */
html[data-scope="admin"]{
  --shuxu-deep:#0034B5;
  --shuxu-1:#0052D9;          /* 品牌主色 */
  --shuxu-2:#0034B5;          /* 按下/深色 */
  --shuxu-3:#266FE8;          /* 悬浮 */
  --shuxu-4:#ECF2FE;          /* 浅蓝底 */
  --shuxu-5:#F3F3F3;          /* 页面灰底 / 表头灰 */
  --ink:rgba(0,0,0,.9);       /* 主文本 */
  --sub:rgba(0,0,0,.6);       /* 次级文本 */
  --muted:rgba(0,0,0,.4);     /* 弱化文本 */
  --line:#E7E7E7;             /* 细分隔线 */
  --ok:#2BA471; --warn:#E37318; --bad:#D54941;
  --amt-in:#2BA471; --amt-out:#D54941;
  --amt-in-soft:#E3F9E9; --amt-out-soft:#FDECEE;
  --r-card:6px; --r-pill:3px;
  --grad-main:linear-gradient(135deg,#0052D9,#0052D9);
  --grad-deep:linear-gradient(135deg,#0034B5 0%,#0052D9 100%);
  --shadow-1:0 0 0 rgba(0,0,0,0);
  --shadow-2:0 1px 4px rgba(0,0,0,.08);
  --shadow-3:0 8px 24px rgba(0,0,0,.12);
  --shadow-blue:0 0 0 rgba(0,0,0,0);
}
html[data-scope="admin"] body,
html[data-scope="admin"] .layout{background:#F3F3F3}
html[data-scope="admin"] a{color:#0052D9}
html[data-scope="admin"] a:hover{color:#266FE8}
html[data-scope="admin"] ::selection{background:#0052D9;color:#fff}

/* ---- 顶栏：白底 + 细分隔线，无投影 ---- */
html[data-scope="admin"] .topbar{
  background:#fff;backdrop-filter:none;box-shadow:none;
  border-bottom:1px solid #E7E7E7}
html[data-scope="admin"] .topbar .crumb{font-size:14px;font-weight:400;color:rgba(0,0,0,.4)}
html[data-scope="admin"] .topbar .crumb b,
html[data-scope="admin"] .topbar .crumb strong{color:rgba(0,0,0,.9);font-weight:600}
html[data-scope="admin"] .lang-switch{background:#F3F3F3;border-radius:3px}
html[data-scope="admin"] .lang-switch button{border-radius:3px;color:rgba(0,0,0,.6)}
html[data-scope="admin"] .lang-switch button.on{background:#fff;color:#0052D9;box-shadow:0 1px 3px rgba(0,0,0,.1)}
html[data-scope="admin"] .burger{border-radius:3px;border-color:#DCDCDE;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .avatar{background:#0052D9;box-shadow:none}

/* ---- 页头 ---- */
html[data-scope="admin"] .page-head h2,
html[data-scope="admin"] .page-head h1{font-size:20px;font-weight:600;color:rgba(0,0,0,.9);letter-spacing:0}

/* ---- 按钮：TDesign 主按钮 / 次按钮 ---- */
html[data-scope="admin"] .btn{
  height:32px;padding:0 15px;border-radius:3px;border:1px solid transparent;
  background:#0052D9;color:#fff;font-weight:400;font-size:14px;
  box-shadow:none;transition:background .15s,border-color .15s,color .15s}
html[data-scope="admin"] .btn:hover{background:#266FE8;box-shadow:none;transform:none;color:#fff}
html[data-scope="admin"] .btn:active{background:#0034B5;transform:none}
html[data-scope="admin"] .btn:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(0,82,217,.16)}
html[data-scope="admin"] .btn[disabled]{opacity:.4}
html[data-scope="admin"] .btn.ghost{
  background:#fff;color:rgba(0,0,0,.9);border-color:#DCDCDE;box-shadow:none}
html[data-scope="admin"] .btn.ghost:hover{
  background:#fff;color:#0052D9;border-color:#0052D9;box-shadow:none}
html[data-scope="admin"] .btn.gray{
  background:#fff;color:rgba(0,0,0,.9);border-color:#DCDCDE;box-shadow:none}
html[data-scope="admin"] .btn.gray:hover{background:#fff;color:#0052D9;border-color:#0052D9}
html[data-scope="admin"] .btn.danger{background:#D54941;box-shadow:none}
html[data-scope="admin"] .btn.danger:hover{background:#B43830;box-shadow:none}
html[data-scope="admin"] .btn.ok{background:#2BA471;box-shadow:none}
html[data-scope="admin"] .btn.ok:hover{background:#23855C;box-shadow:none}
html[data-scope="admin"] .btn.sm{height:28px;padding:0 13px;font-size:13px}
html[data-scope="admin"] .btn.xs{height:24px;padding:0 11px;font-size:12px}

/* ---- 标签：TDesign Tag（浅底无描边） ---- */
html[data-scope="admin"] .pill{
  height:22px;padding:0 8px;border-radius:3px;font-size:12px;font-weight:400;
  background:#ECF2FE;color:#0052D9;border:1px solid transparent}
html[data-scope="admin"] .pill.ok{background:#E3F9E9;color:#2BA471;border-color:transparent}
html[data-scope="admin"] .pill.warn{background:#FFF1E9;color:#E37318;border-color:transparent}
html[data-scope="admin"] .pill.bad{background:#FDECEE;color:#D54941;border-color:transparent}
html[data-scope="admin"] .pill.gray{background:#F3F3F3;color:rgba(0,0,0,.6);border-color:transparent}
html[data-scope="admin"] .pill.out{background:#fff;color:rgba(0,0,0,.9);border-color:#DCDCDE}
html[data-scope="admin"] .pill.amt-in{background:#E3F9E9;color:#2BA471;border-color:transparent}
html[data-scope="admin"] .pill.amt-out{background:#FDECEE;color:#D54941;border-color:transparent}
html[data-scope="admin"] .dot-new{background:#D54941;box-shadow:none}

/* ---- 卡片：白底 + 细边框，无阴影 ---- */
html[data-scope="admin"] .card,
html[data-scope="admin"] .kpi,
html[data-scope="admin"] .sb{
  background:#fff;border:1px solid #E7E7E7;border-radius:6px;
  box-shadow:none}
html[data-scope="admin"] .card:hover,
html[data-scope="admin"] .kpi.k2:hover{box-shadow:none;transform:none;border-color:#E7E7E7}
html[data-scope="admin"] .card .hd{border-bottom:1px solid #E7E7E7;background:transparent;
  font-size:14px;font-weight:600;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .card .hd .more{font-weight:400;color:#0052D9}
html[data-scope="admin"] .card .bd{padding:18px}
html[data-scope="admin"] .card.bd{padding:18px}
html[data-scope="admin"] .rs-box{background:#F3F3F3;border:1px solid transparent;border-radius:6px;box-shadow:none}

/* ---- 图标块：浅蓝底 + 品牌蓝图标（TDesign 浅色图标风格） ---- */
html[data-scope="admin"] .kpi-ico.blue,
html[data-scope="admin"] .k-c-blue .k2-ico,
html[data-scope="admin"] .rs-box .rs-ico.blue,
html[data-scope="admin"] .rs-box .rs-ico.cyan,
html[data-scope="admin"] .sb .sb-ic,
html[data-scope="admin"] .hero-ico,
html[data-scope="admin"] .ph-ico,
html[data-scope="admin"] .sb-ic,
html[data-scope="admin"] .hd-ico,
html[data-scope="admin"] .lo-ico,
html[data-scope="admin"] .bg-ico{
  background:#ECF2FE;color:#0052D9;box-shadow:none}
html[data-scope="admin"] .kpi-ico.green,
html[data-scope="admin"] .k-c-green .k2-ico,
html[data-scope="admin"] .rs-box .rs-ico.green,
html[data-scope="admin"] .sb.g .sb-ic{background:#E3F9E9;color:#2BA471}
html[data-scope="admin"] .kpi-ico.orange,
html[data-scope="admin"] .k-c-amber .k2-ico,
html[data-scope="admin"] .sb.o .sb-ic{background:#FFF1E9;color:#E37318}
html[data-scope="admin"] .kpi-ico.purple,
html[data-scope="admin"] .k-c-cyan .k2-ico,
html[data-scope="admin"] .rs-box .rs-ico.grey,
html[data-scope="admin"] .sb.r .sb-ic,
html[data-scope="admin"] .sb.s .sb-ic{background:#F3F3F3;color:rgba(0,0,0,.6)}
html[data-scope="admin"] .sb-v{color:rgba(0,0,0,.9);font-weight:600}
html[data-scope="admin"] .sb-l{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .kpi .v{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:rgba(0,0,0,.9);font-weight:600}
html[data-scope="admin"] .kpi .k{color:rgba(0,0,0,.4)}

/* ---- 仪表盘英雄卡 ---- */
html[data-scope="admin"] .dash-hero .hero-main{color:rgba(0,0,0,.9)}
html[data-scope="admin"] .dash-hero .hm-l{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .dash-hero .hero-num{color:rgba(0,0,0,.9);font-weight:600}
html[data-scope="admin"] .dash-hero .hero-sub .chip{
  background:#F3F3F3;border-color:transparent;border-radius:3px}
html[data-scope="admin"] .dash-hero .hero-sub .chip span{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .dash-hero .hero-sub .chip b{color:rgba(0,0,0,.9)}
html[data-scope="admin"] .hs-k{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .hs-v{color:rgba(0,0,0,.9)}
html[data-scope="admin"] .hs-v.warn{color:#E37318}
html[data-scope="admin"] .hs{border-bottom:1px solid #E7E7E7}

/* ---- 表单：TDesign Input ---- */
html[data-scope="admin"] .field label{font-weight:400;color:rgba(0,0,0,.6);font-size:14px}
html[data-scope="admin"] .input{
  height:32px;padding:0 11px;border-radius:3px;border-color:#DCDCDE;background:#fff;
  color:rgba(0,0,0,.9);font-size:14px}
html[data-scope="admin"] .input::placeholder{color:rgba(0,0,0,.26)}
html[data-scope="admin"] .input:hover{border-color:rgba(0,0,0,.4)}
html[data-scope="admin"] .input:focus{border-color:#0052D9;box-shadow:none}
html[data-scope="admin"] .input.bad{border-color:#D54941;background:#fff}
html[data-scope="admin"] .input.bad:focus{border-color:#D54941;box-shadow:none}
html[data-scope="admin"] textarea.input{padding:7px 11px;border-radius:3px}
html[data-scope="admin"] .req{color:#D54941}

/* ---- 表格：TDesign Table ---- */
html[data-scope="admin"] .table{font-size:13.5px;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .table th{
  background:#F3F3F3;color:rgba(0,0,0,.7);font-weight:500;font-size:13px;
  padding:11px 14px;border-bottom:1px solid #E7E7E7}
html[data-scope="admin"] .table td{padding:12px 14px;border-bottom:1px solid #E7E7E7;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .table tr:hover td{background:#F7F7F7}
html[data-scope="admin"] .table .op{color:#0052D9;font-weight:400;font-size:13px}
html[data-scope="admin"] .table .op:hover{color:#266FE8}
html[data-scope="admin"] .table .op+.op{border-left-color:#E7E7E7}
html[data-scope="admin"] .table .op.danger{color:#D54941}
html[data-scope="admin"] .table .op.danger:hover{color:#B43830}
html[data-scope="admin"] .table .op.warn{color:#E37318}
html[data-scope="admin"] .table td.empty{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .empty{color:rgba(0,0,0,.4)}

/* ---- 分页：白底描边，当前页品牌蓝 ---- */
html[data-scope="admin"] .pager .p{
  background:#fff;border:1px solid #DCDCDE;border-radius:3px;
  color:rgba(0,0,0,.9);font-weight:400}
html[data-scope="admin"] .pager .p:hover{color:#0052D9;background:#fff;border-color:#0052D9}
html[data-scope="admin"] .pager .p.on{background:#0052D9;color:#fff;border-color:#0052D9}

/* ---- 开关 ---- */
html[data-scope="admin"] .switch.off{background:#C9CDD4}
html[data-scope="admin"] .switch.on{background:#0052D9}

/* ---- 弹窗 / 提示 ---- */
html[data-scope="admin"] .modal-mask{background:rgba(0,0,0,.6);backdrop-filter:none}
html[data-scope="admin"] .modal{border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.14)}
html[data-scope="admin"] .modal .hd{border-bottom:1px solid #E7E7E7;font-size:16px;font-weight:600;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .modal .hd .x{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .modal .hd .x:hover{color:#0052D9}
html[data-scope="admin"] .modal .ft{border-top:1px solid #E7E7E7}
html[data-scope="admin"] .toast{border-radius:3px;font-weight:400;box-shadow:0 2px 8px rgba(0,0,0,.12)}
html[data-scope="admin"] .toast.ok{background:#E3F9E9;border-color:transparent;color:#2BA471}
html[data-scope="admin"] .toast.err{background:#FDECEE;border-color:transparent;color:#D54941}
html[data-scope="admin"] .toast.plain,.toast{color:rgba(0,0,0,.9)}
html[data-scope="admin"] .spinner{border-color:#ECF2FE;border-top-color:#0052D9}

/* ---- 保存条 / 顶部公告 ---- */
html[data-scope="admin"] .save-bar{
  background:#fff;border:1px solid #E7E7E7;border-radius:6px;
  backdrop-filter:none;box-shadow:0 1px 4px rgba(0,0,0,.08)}
html[data-scope="admin"] .save-bar .sb-tip i{background:#E37318}
html[data-scope="admin"] .intg-banner{
  border-radius:3px;background:#FFF1E9;border:1px solid #F0C9A6;color:#8A5A00}
html[data-scope="admin"] .intg-banner .ib-bad{border-radius:3px;background:#E37318}

/* ---- 通用小容器圆角统一 6px ---- */
html[data-scope="admin"] .mcard,
html[data-scope="admin"] .pkg-card,
html[data-scope="admin"] .vd-list,
html[data-scope="admin"] .cron-box,
html[data-scope="admin"] .rc-item,
html[data-scope="admin"] .rc-bal,
html[data-scope="admin"] .pay-item,
html[data-scope="admin"] .pay-opt,
html[data-scope="admin"] .ap-code,
html[data-scope="admin"] .logo-prev,
html[data-scope="admin"] .rs-box,
html[data-scope="admin"] .set-note{border-radius:6px}

/* ---- 链接与滚动条 ---- */
html[data-scope="admin"] .content ::-webkit-scrollbar-thumb{background:#C9CDD4;border-radius:3px}
html[data-scope="admin"] .content ::-webkit-scrollbar-thumb:hover{background:#B0B4BC}

/* ---- 账号下拉菜单 ---- */
html[data-scope="admin"] .user-pop{border:1px solid #E7E7E7;border-radius:6px;
  box-shadow:0 3px 14px rgba(0,0,0,.1)}
html[data-scope="admin"] .up-item:hover{background:#F3F3F3;color:#0052D9}
html[data-scope="admin"] .up-item.danger{color:#D54941}
html[data-scope="admin"] .up-item.danger:hover{background:#FDECEE;color:#D54941}

/* ---- 在线客服工作台 ---- */
html[data-scope="admin"] .cs-av{background:#0052D9}
html[data-scope="admin"] .cs-th.on{background:#ECF2FE}
html[data-scope="admin"] .cs-th:hover{background:#F3F3F3}
html[data-scope="admin"] .cs-badge{background:#D54941}
html[data-scope="admin"] .cs-m.admin .cs-bubble{background:#0052D9;border-color:#0052D9}
html[data-scope="admin"] .cs-ta:focus{border-color:#0052D9}
html[data-scope="admin"] .cs-tool:hover{background:#F3F3F3;color:#0052D9}
html[data-scope="admin"] .cs-msgs{background:#F7F8FA}

/* ---- 管理员登录页 ---- */
html[data-scope="admin"] .admin-login{background:#F3F3F3}
html[data-scope="admin"] .admin-login::before,
html[data-scope="admin"] .admin-login::after{display:none}
html[data-scope="admin"] .admin-login .left{background:linear-gradient(135deg,#0034B5 0%,#0052D9 100%)}
html[data-scope="admin"] .admin-login .right h1{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  -webkit-text-fill-color:currentColor;color:#0052D9}
html[data-scope="admin"] .admin-login .right .input{background:#fff}
html[data-scope="admin"] .admin-login .right .input:focus{box-shadow:none}
html[data-scope="admin"] .admin-login .shield b{color:#0052D9}
html[data-scope="admin"] .admin-login .shield .dot{background:#2BA471}
html[data-scope="admin"] .admin-login .captcha-img{border-radius:3px}
html[data-scope="admin"] .admin-login .ver{border-radius:3px}
html[data-scope="admin"] .admin-login .back-front{border-radius:3px;color:rgba(0,0,0,.6)}
html[data-scope="admin"] .admin-login .back-front:hover{background:#0052D9;border-color:#0052D9;color:#fff}

/* ---- 顶栏铃铛按钮 ---- */
html[data-scope="admin"] .bell-btn{border-radius:3px;border-color:#DCDCDE;background:#fff;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .bell-btn:hover{background:#ECF2FE;color:#0052D9;border-color:transparent}
html[data-scope="admin"] .bell-btn.on{background:#ECF2FE;color:#0052D9;border-color:transparent}
html[data-scope="admin"] .bell-btn .bell-dot{background:#D54941;box-shadow:none;border:none}

/* ============================================================
   第十一轮B：腾讯云风格补全 + 移动端响应式修复
   ============================================================ */

/* ---- 英雄卡主图标：品牌蓝实底 + 白色图标 ---- */
html[data-scope="admin"] .hero-ico{background:#0052D9;color:#fff}

/* ---- 图标块内 SVG 描边继承文字色，修复浅底白图标不清晰问题 ---- */
html[data-scope="admin"] .kpi-ico svg,
html[data-scope="admin"] .sb-ic svg,
html[data-scope="admin"] .hd-ico svg,
html[data-scope="admin"] .k2-ico svg,
html[data-scope="admin"] .rs-ico svg,
html[data-scope="admin"] .ph-ico svg,
html[data-scope="admin"] .lo-ico svg,
html[data-scope="admin"] .bg-ico svg,
html[data-scope="admin"] .rn-ico svg,
html[data-scope="admin"] .cs-av svg{stroke:currentColor}

/* ---- 旧轮次残留的 Element 色替换为 TDesign 色 ---- */
html[data-scope="admin"] .set-grp::before{background:#0052D9}
html[data-scope="admin"] .pwd-eye:hover{color:#0052D9;background:#F3F3F3}
html[data-scope="admin"] .rn-done{background:#E3F9E9;border:1px solid transparent}
html[data-scope="admin"] .rn-ico{background:#2BA471}
html[data-scope="admin"] .mtag.hot{background:#D54941}
html[data-scope="admin"] .mtag.new{background:#2BA471}
html[data-scope="admin"] .dm-tab.on{background:#0052D9;border-color:#0052D9;color:#fff}
html[data-scope="admin"] .rn-chip.on{background:#0052D9;border-color:#0052D9}
html[data-scope="admin"] .rq-bar i,
html[data-scope="admin"] .mini-bar i{background:#0052D9;border-radius:2px}
html[data-scope="admin"] .pf-card.pf-on{border-color:#0052D9;background:#ECF2FE}
html[data-scope="admin"] .eye-btn.on{background:#FFF1E9;border-color:transparent;color:#E37318}
html[data-scope="admin"] .buy-calc{border:1px solid #0052D9;background:#ECF2FE}
html[data-scope="admin"] .cs-badge{background:#D54941}
html[data-scope="admin"] .cs-tool:hover{background:#F3F3F3;color:#0052D9}
html[data-scope="admin"] .tc-range{background:#F3F3F3;color:rgba(0,0,0,.4)}
html[data-scope="admin"] .tc-lg{color:rgba(0,0,0,.6)}
html[data-scope="admin"] .tc-lg b{color:rgba(0,0,0,.9)}
html[data-scope="admin"] .tc-x{color:rgba(0,0,0,.4)}
html[data-scope="admin"] .tc-svg g[stroke]{stroke:#E7E7E7}

/* ---- 平板/手机：网格折叠 ---- */
@media (max-width:1024px){
  html[data-scope="admin"] .g4,
  html[data-scope="admin"] .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  /* 修复：本层特异性高于基础 900px 断点，需在此重申英雄卡单列 */
  html[data-scope="admin"] .dash-hero{grid-template-columns:1fr}
  html[data-scope="admin"] .hero-side{border-left:none;border-top:1px solid #E7E7E7}
  html[data-scope="admin"] .hero-num{font-size:26px}
}
@media (max-width:860px){
  html[data-scope="admin"] .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  html[data-scope="admin"] .statband{grid-template-columns:repeat(2,minmax(0,1fr))}
  html[data-scope="admin"] .page{padding:14px}
  html[data-scope="admin"] .cs-wrap{flex-direction:column;height:auto}
  html[data-scope="admin"] .cs-side{width:100%;flex:0 0 auto;max-height:260px}
  html[data-scope="admin"] .cs-msgs{height:320px}
}
@media (max-width:640px){
  html[data-scope="admin"] .g2,
  html[data-scope="admin"] .g3,
  html[data-scope="admin"] .g4,
  html[data-scope="admin"] .g5{grid-template-columns:1fr}
  html[data-scope="admin"] .statband{grid-template-columns:repeat(2,minmax(0,1fr))}
  html[data-scope="admin"] .page{padding:12px}
  html[data-scope="admin"] .page-head h2,
  html[data-scope="admin"] .page-head h1{font-size:17px}
  html[data-scope="admin"] .dash-hero .hero-main{padding:16px;gap:14px}
  html[data-scope="admin"] .dash-hero .hero-num{font-size:24px}
  html[data-scope="admin"] .dash-hero .hero-sub{gap:8px}
  html[data-scope="admin"] .dash-hero .hero-sub .chip{min-width:0;flex:1 1 calc(50% - 8px);padding:8px 10px}
  html[data-scope="admin"] .card .bd,
  html[data-scope="admin"] .card .hd{padding-left:14px;padding-right:14px}
  html[data-scope="admin"] .card.bd{padding:14px}
  html[data-scope="admin"] .kpi,
  html[data-scope="admin"] .sb{padding:13px 14px}
  html[data-scope="admin"] .modal{max-width:calc(100vw - 24px)}
  html[data-scope="admin"] .topbar{padding:0 12px}
  html[data-scope="admin"] .topbar .crumb{font-size:12.5px}
  html[data-scope="admin"] .tc-legend{flex-wrap:wrap;gap:10px}
}

/* ============================================================
   第十二轮：用户端（front）腾讯云 TDesign 一比一适配
   品牌蓝 #0052D9 · 灰阶中性色 · 白卡+细边框 · 3px 控件圆角
   侧边栏保持原样；site_theme 自定义主色仍可覆盖
   ============================================================ */
html[data-scope="front"]{
  --shuxu-1:#0052D9;
  --shuxu-2:#0034B5;
  --shuxu-3:#266FE8;
  --shuxu-4:#ECF2FE;
  --shuxu-5:#F3F3F3;
  --ink:rgba(0,0,0,.9);
  --sub:rgba(0,0,0,.6);
  --muted:rgba(0,0,0,.4);
  --line:#E7E7E7;
  --ok:#2BA471; --warn:#E37318; --bad:#D54941;
  --amt-in:#2BA471; --amt-out:#D54941;
  --amt-in-soft:#E3F9E9; --amt-out-soft:#FDECEE;
  --r-card:6px; --r-pill:3px;
  --grad-main:linear-gradient(135deg,#0052D9,#0052D9);
  --grad-deep:linear-gradient(135deg,#0034B5 0%,#0052D9 100%);
  --shadow-1:0 0 0 rgba(0,0,0,0);
  --shadow-2:0 1px 4px rgba(0,0,0,.08);
  --shadow-3:0 8px 24px rgba(0,0,0,.12);
  --shadow-blue:0 0 0 rgba(0,0,0,0);
}
html[data-scope="front"] a{color:#0052D9}
html[data-scope="front"] a:hover{color:#266FE8}
html[data-scope="front"] ::selection{background:#0052D9;color:#fff}
html[data-scope="front"] ::-webkit-scrollbar-thumb{background:#C9CDD4;border-radius:3px}
html[data-scope="front"] ::-webkit-scrollbar-thumb:hover{background:#B0B4BC}

/* ---- 按钮 ---- */
html[data-scope="front"] .btn{
  height:32px;padding:0 15px;border-radius:3px;border:1px solid transparent;
  background:#0052D9;color:#fff;font-weight:400;font-size:14px;
  box-shadow:none;transition:background .15s,border-color .15s,color .15s}
html[data-scope="front"] .btn:hover{background:#266FE8;box-shadow:none;transform:none;color:#fff}
html[data-scope="front"] .btn:active{background:#0034B5;transform:none}
html[data-scope="front"] .btn:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(0,82,217,.16)}
html[data-scope="front"] .btn[disabled]{opacity:.4}
html[data-scope="front"] .btn.ghost{
  background:#fff;color:rgba(0,0,0,.9);border-color:#DCDCDE;box-shadow:none}
html[data-scope="front"] .btn.ghost:hover{background:#fff;color:#0052D9;border-color:#0052D9}
html[data-scope="front"] .btn.gray{background:#fff;color:rgba(0,0,0,.9);border-color:#DCDCDE}
html[data-scope="front"] .btn.gray:hover{background:#fff;color:#0052D9;border-color:#0052D9}
html[data-scope="front"] .btn.danger{background:#D54941}
html[data-scope="front"] .btn.danger:hover{background:#B43830}
html[data-scope="front"] .btn.ok{background:#2BA471}
html[data-scope="front"] .btn.ok:hover{background:#23855C}
html[data-scope="front"] .btn.sm{height:28px;padding:0 13px;font-size:13px}
html[data-scope="front"] .btn.xs{height:24px;padding:0 11px;font-size:12px}

/* ---- 标签 ---- */
html[data-scope="front"] .pill{
  height:22px;padding:0 8px;border-radius:3px;font-size:12px;font-weight:400;
  background:#ECF2FE;color:#0052D9;border:1px solid transparent}
html[data-scope="front"] .pill.ok{background:#E3F9E9;color:#2BA471;border-color:transparent}
html[data-scope="front"] .pill.warn{background:#FFF1E9;color:#E37318;border-color:transparent}
html[data-scope="front"] .pill.bad{background:#FDECEE;color:#D54941;border-color:transparent}
html[data-scope="front"] .pill.gray{background:#F3F3F3;color:rgba(0,0,0,.6);border-color:transparent}
html[data-scope="front"] .pill.out{background:#fff;color:rgba(0,0,0,.9);border-color:#DCDCDE}
html[data-scope="front"] .pill.amt-in{background:#E3F9E9;color:#2BA471;border-color:transparent}
html[data-scope="front"] .pill.amt-out{background:#FDECEE;color:#D54941;border-color:transparent}

/* ---- 卡片 ---- */
html[data-scope="front"] .card{
  background:#fff;border:1px solid #E7E7E7;border-radius:6px;box-shadow:none}
html[data-scope="front"] .card:hover{box-shadow:none;transform:none}
html[data-scope="front"] .card .hd{border-bottom:1px solid #E7E7E7;background:transparent;
  font-size:14px;font-weight:600;color:rgba(0,0,0,.9)}
html[data-scope="front"] .card .hd .more{font-weight:400;color:#0052D9}
html[data-scope="front"] .card .bd{padding:18px}
html[data-scope="front"] .card.bd{padding:18px}

/* ---- 表单 ---- */
html[data-scope="front"] .field label{font-weight:400;color:rgba(0,0,0,.6);font-size:14px}
html[data-scope="front"] .input{
  height:32px;padding:0 11px;border-radius:3px;border-color:#DCDCDE;background:#fff;
  color:rgba(0,0,0,.9);font-size:14px}
html[data-scope="front"] .input::placeholder{color:rgba(0,0,0,.26)}
html[data-scope="front"] .input:hover{border-color:rgba(0,0,0,.4)}
html[data-scope="front"] .input:focus{border-color:#0052D9;box-shadow:none}
html[data-scope="front"] .input.bad{border-color:#D54941;background:#fff}
html[data-scope="front"] textarea.input{padding:7px 11px;border-radius:3px}
html[data-scope="front"] .req{color:#D54941}
html[data-scope="front"] .pwd-eye:hover{color:#0052D9;background:#F3F3F3}

/* ---- 表格 ---- */
html[data-scope="front"] .table{font-size:13.5px;color:rgba(0,0,0,.9)}
html[data-scope="front"] .table th{
  background:#F3F3F3;color:rgba(0,0,0,.7);font-weight:500;font-size:13px;
  padding:11px 14px;border-bottom:1px solid #E7E7E7}
html[data-scope="front"] .table td{padding:12px 14px;border-bottom:1px solid #E7E7E7;color:rgba(0,0,0,.9)}
html[data-scope="front"] .table tr:hover td{background:#F7F7F7}
html[data-scope="front"] .table .op{color:#0052D9;font-weight:400}
html[data-scope="front"] .table .op:hover{color:#266FE8}
html[data-scope="front"] .table .op.danger{color:#D54941}
html[data-scope="front"] .table .op.warn{color:#E37318}
html[data-scope="front"] .empty{color:rgba(0,0,0,.4)}

/* ---- 分页 / 开关 ---- */
html[data-scope="front"] .pager .p{
  background:#fff;border:1px solid #DCDCDE;border-radius:3px;color:rgba(0,0,0,.9);font-weight:400}
html[data-scope="front"] .pager .p:hover{color:#0052D9;background:#fff;border-color:#0052D9}
html[data-scope="front"] .pager .p.on{background:#0052D9;color:#fff;border-color:#0052D9}
html[data-scope="front"] .switch.off{background:#C9CDD4}
html[data-scope="front"] .switch.on{background:#0052D9}

/* ---- 弹窗 / 提示 ---- */
html[data-scope="front"] .modal-mask{background:rgba(0,0,0,.6);backdrop-filter:none}
html[data-scope="front"] .modal{border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.14)}
html[data-scope="front"] .modal .hd{border-bottom:1px solid #E7E7E7;font-size:16px;font-weight:600;color:rgba(0,0,0,.9)}
html[data-scope="front"] .modal .hd .x{color:rgba(0,0,0,.4)}
html[data-scope="front"] .modal .hd .x:hover{color:#0052D9}
html[data-scope="front"] .modal .ft{border-top:1px solid #E7E7E7}
html[data-scope="front"] .toast{border-radius:3px;font-weight:400;box-shadow:0 2px 8px rgba(0,0,0,.12);color:rgba(0,0,0,.9)}
html[data-scope="front"] .toast.ok{background:#E3F9E9;border-color:transparent;color:#2BA471}
html[data-scope="front"] .toast.err{background:#FDECEE;border-color:transparent;color:#D54941}
html[data-scope="front"] .spinner{border-color:#ECF2FE;border-top-color:#0052D9}

/* ---- 用户中心特有组件 ---- */
html[data-scope="front"] .rc-bal{border-radius:6px}
html[data-scope="front"] .rc-bal b{font-weight:600}
html[data-scope="front"] .rc-quick{gap:10px}
html[data-scope="front"] .rc-quick .btn{background:#fff;color:#0052D9;border:1px solid #DCDCDE}
html[data-scope="front"] .rc-quick .btn:hover{border-color:#0052D9;background:#fff}
html[data-scope="front"] .dmp .table-wrap{border-radius:6px;border-color:#E7E7E7}
html[data-scope="front"] .dmp .table th{background:#F3F3F3;color:rgba(0,0,0,.7)}
html[data-scope="front"] .dmp-hd .ico{color:#0052D9}
html[data-scope="front"] .dmp-hd .ttl{font-weight:600;color:rgba(0,0,0,.9)}
html[data-scope="front"] .dmp-hd .desc{color:rgba(0,0,0,.4)}
html[data-scope="front"] .pkg-card,
html[data-scope="front"] .mallgrid .pkg-card,
html[data-scope="front"] .rm-grid .pkg-card,
html[data-scope="front"] .rc-item,
html[data-scope="front"] .pay-item,
html[data-scope="front"] .pay-opt,
html[data-scope="front"] .ap-code,
html[data-scope="front"] .rs-box,
html[data-scope="front"] .exp-banner,
html[data-scope="front"] .bq-eq,
html[data-scope="front"] .br-exp,
html[data-scope="front"] .autotip{border-radius:6px}
html[data-scope="front"] .pkg-card:hover{box-shadow:0 1px 4px rgba(0,0,0,.08);transform:none}
html[data-scope="front"] .rs-box{background:#F3F3F3;border:1px solid transparent}
html[data-scope="front"] .rs-box .rs-ico{background:#ECF2FE;color:#0052D9}
html[data-scope="front"] .rs-box .rs-ico.green{background:#E3F9E9;color:#2BA471}
html[data-scope="front"] .rs-box .rs-ico.cyan{background:#ECF2FE;color:#0052D9}
html[data-scope="front"] .rs-box .rs-ico.grey{background:#fff;color:rgba(0,0,0,.6)}
html[data-scope="front"] .kpi,
html[data-scope="front"] .sb{background:#fff;border:1px solid #E7E7E7;border-radius:6px;box-shadow:none}
html[data-scope="front"] .kpi .v{background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:rgba(0,0,0,.9);font-weight:600}
html[data-scope="front"] .kpi .k{color:rgba(0,0,0,.4)}
html[data-scope="front"] .kpi-ico.blue,
html[data-scope="front"] .kpi-ico.cyan{background:#ECF2FE;color:#0052D9}
html[data-scope="front"] .kpi-ico.green{background:#E3F9E9;color:#2BA471}
html[data-scope="front"] .kpi-ico.orange{background:#FFF1E9;color:#E37318}
html[data-scope="front"] .kpi-ico.purple{background:#F3F3F3;color:rgba(0,0,0,.6)}
html[data-scope="front"] .kpi-ico svg,
html[data-scope="front"] .sb-ic svg,
html[data-scope="front"] .hd-ico svg,
html[data-scope="front"] .k2-ico svg,
html[data-scope="front"] .rs-ico svg,
.csx-av svg{stroke:currentColor}
html[data-scope="front"] .kpi.k2:hover,
html[data-scope="front"] .pkg-card:hover{transform:none}

/* ---- 认证页（登录/注册） ---- */
html[data-scope="front"] .panel{border-radius:6px;border:1px solid #E7E7E7;box-shadow:0 8px 24px rgba(0,0,0,.12)}
html[data-scope="front"] .auth-wrap{background:#F3F3F3}

/* ---- 顶部导航（front 顶栏） ---- */
html[data-scope="front"] .topbar{background:#fff;backdrop-filter:none;box-shadow:none;border-bottom:1px solid #E7E7E7}
html[data-scope="front"] .topbar .crumb{font-size:14px;font-weight:400;color:rgba(0,0,0,.4)}
html[data-scope="front"] .back-home{border-radius:3px;border-color:#DCDCDE;color:rgba(0,0,0,.9)}
html[data-scope="front"] .back-home:hover{background:#ECF2FE;color:#0052D9;border-color:transparent}
html[data-scope="front"] .lang-switch{background:#F3F3F3;border-radius:3px}
html[data-scope="front"] .lang-switch button{border-radius:3px;color:rgba(0,0,0,.6)}
html[data-scope="front"] .lang-switch button.on{background:#fff;color:#0052D9;box-shadow:0 1px 3px rgba(0,0,0,.1)}
html[data-scope="front"] .avatar{background:#0052D9;box-shadow:none}
html[data-scope="front"] .bell-btn{border-radius:3px;border-color:#DCDCDE;background:#fff;color:rgba(0,0,0,.9)}
html[data-scope="front"] .bell-btn:hover{background:#ECF2FE;color:#0052D9;border-color:transparent}
html[data-scope="front"] .bell-btn .bell-dot{background:#D54941}
html[data-scope="front"] .user-pop{border:1px solid #E7E7E7;border-radius:6px;box-shadow:0 3px 14px rgba(0,0,0,.1)}
html[data-scope="front"] .up-item:hover{background:#F3F3F3;color:#0052D9}
html[data-scope="front"] .up-item.danger{color:#D54941}
html[data-scope="front"] .up-item.danger:hover{background:#FDECEE;color:#D54941}

/* ---- 用户端客服悬浮组件 ---- */
.csx-btn{background:#0052D9;box-shadow:0 2px 8px rgba(0,82,217,.35)}
.csx-panel{border-radius:6px;border:1px solid #E7E7E7;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.csx-m.admin .csx-bubble{background:#0052D9;border-color:#0052D9}

/* ---- front 侧边栏会员条等小元素（不动侧边栏主体） ---- */
html[data-scope="front"] .page-head h1,
html[data-scope="front"] .page-head h2{font-size:20px;font-weight:600;color:rgba(0,0,0,.9)}

/* ---- 用户端移动端网格折叠 ---- */
@media (max-width:1024px){
  html[data-scope="front"] .g4,
  html[data-scope="front"] .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  html[data-scope="front"] .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  html[data-scope="front"] .statband{grid-template-columns:repeat(2,minmax(0,1fr))}
  html[data-scope="front"] .page{padding:14px}
}
@media (max-width:640px){
  html[data-scope="front"] .g2,
  html[data-scope="front"] .g3,
  html[data-scope="front"] .g4,
  html[data-scope="front"] .g5{grid-template-columns:1fr}
  html[data-scope="front"] .page{padding:12px}
  html[data-scope="front"] .page-head h1,
  html[data-scope="front"] .page-head h2{font-size:17px}
  html[data-scope="front"] .card .bd,
  html[data-scope="front"] .card .hd{padding-left:14px;padding-right:14px}
  html[data-scope="front"] .card.bd{padding:14px}
  html[data-scope="front"] .kpi,
  html[data-scope="front"] .sb{padding:13px 14px}
  html[data-scope="front"] .modal{max-width:calc(100vw - 24px)}
  html[data-scope="front"] .tc-legend{flex-wrap:wrap;gap:10px}
}

/* ============================================================
   第十三轮：用户端工作台（腾讯云概览风） + 客服两端 TDesign 适配
   ============================================================ */

/* ---- 用户端工作台概览 ---- */
.tw-desc{color:rgba(0,0,0,.4);font-size:13px;margin-top:-6px}
.tw-stat{
  background:#fff;border:1px solid #E7E7E7;border-radius:6px;padding:18px 20px;
  cursor:pointer;transition:box-shadow .15s ease,border-color .15s ease;
}
.tw-stat:hover{border-color:#B5C7F0;box-shadow:0 4px 14px rgba(0,82,217,.08)}
.tw-stat .tw-k{font-size:13px;color:rgba(0,0,0,.6)}
.tw-stat .tw-v{font-size:28px;font-weight:600;color:rgba(0,0,0,.9);line-height:1.3;margin-top:6px}
.tw-stat .tw-d,
.tw-d{font-size:12.5px;color:rgba(0,0,0,.4)}
.tw-sub{font-size:14px;color:rgba(0,0,0,.4);font-weight:400;margin-left:2px}
.tw-quick{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;padding:16px 20px}
.tq{
  display:flex;flex-direction:column;align-items:center;gap:9px;padding:16px 8px;border-radius:6px;
  color:rgba(0,0,0,.9);font-size:13px;transition:background .15s ease;
}
.tq:hover{background:#F3F3F3;color:var(--shuxu-1)}
.tq-ico{width:38px;height:38px;border-radius:6px;background:#ECF2FE;color:var(--shuxu-1);display:flex;align-items:center;justify-content:center}
.tw-bar{height:6px;border-radius:3px;background:#F0F0F0;overflow:hidden}
.tw-bar i{display:block;height:100%;border-radius:3px;background:var(--shuxu-1);transition:width .3s ease}
@media (max-width:1100px){ .tw-quick{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:860px){
  .tw-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tw-stat{padding:14px 16px}
  .tw-stat .tw-v{font-size:22px}
}
@media (max-width:560px){
  .tw-quick{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px 14px}
  html[data-scope="front"] .grid.g2{grid-template-columns:1fr}
}

/* ---- 管理端客服工作台 TDesign 化 ---- */
html[data-scope="admin"] .cs-headbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
html[data-scope="admin"] .cs-sw{display:inline-flex;align-items:center;gap:8px;padding:0 10px;height:32px;background:#fff;border:1px solid #E7E7E7;border-radius:3px}
html[data-scope="admin"] .cs-sw-l{font-size:13px;color:rgba(0,0,0,.6)}
html[data-scope="admin"] .cs-side-hd{display:flex;align-items:center;justify-content:space-between}
html[data-scope="admin"] .cs-selall{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:rgba(0,0,0,.9);cursor:pointer}
html[data-scope="admin"] .cs-selall input{width:15px;height:15px;accent-color:var(--shuxu-1);cursor:pointer}
html[data-scope="admin"] .cs-th-count{font-size:12px;color:rgba(0,0,0,.4);background:#F3F3F3;border-radius:10px;padding:0 8px;line-height:20px}
html[data-scope="admin"] .cs-ck{width:15px;height:15px;accent-color:var(--shuxu-1);cursor:pointer;flex:0 0 15px}
html[data-scope="admin"] .cs-clear{margin-left:auto}
/* 会话条目布局（含复选框） */
html[data-scope="admin"] .cs-th{display:flex;align-items:center;gap:10px}
html[data-scope="admin"] .cs-th-main{flex:1;min-width:0}
/* 消息气泡：加头像列，TDesign 聊天气泡配色 */
html[data-scope="admin"] .cs-m{display:flex;align-items:flex-start;gap:10px}
html[data-scope="admin"] .cs-m.admin{flex-direction:row-reverse}
html[data-scope="admin"] .cs-mcol{display:flex;flex-direction:column;max-width:70%}
html[data-scope="admin"] .cs-m.admin .cs-mcol{align-items:flex-end}
html[data-scope="admin"] .cs-av.sm{width:30px;height:30px;font-size:13px;flex:0 0 30px;background:#ECF2FE;color:var(--shuxu-1)}
html[data-scope="admin"] .cs-m.admin .cs-av.sm{background:var(--shuxu-1);color:#fff}
html[data-scope="admin"] .cs-m.user .cs-bubble{background:#F3F3F3;border-radius:3px 8px 8px 8px;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .cs-m.admin .cs-bubble{background:#ECF2FE;border-radius:8px 3px 8px 8px;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .cs-mtime{margin-top:4px}
html[data-scope="admin"] .cs-m.user .cs-mtime{align-self:flex-start}
html[data-scope="admin"] .cs-m.admin .cs-mtime{align-self:flex-end}
/* 批量操作弹窗 */
html[data-scope="admin"] .cs-modal{max-width:460px;border-radius:8px}
html[data-scope="admin"] .cs-modal .hd{padding:16px 20px;border-bottom:1px solid #E7E7E7;font-size:15px;font-weight:600;color:rgba(0,0,0,.9)}
html[data-scope="admin"] .cs-modal .bd{padding:20px;display:flex;flex-direction:column;gap:12px}
html[data-scope="admin"] .cs-modal .ft{padding:12px 20px;border-top:1px solid #E7E7E7;display:flex;justify-content:flex-end;gap:10px}
html[data-scope="admin"] .cs-batch-scope{display:flex;gap:24px;flex-wrap:wrap}
html[data-scope="admin"] .cs-batch-scope .radio{display:inline-flex;align-items:center;gap:7px;cursor:pointer;color:rgba(0,0,0,.9);font-size:13.5px}
html[data-scope="admin"] .cs-batch-scope .radio input{accent-color:var(--shuxu-1);width:15px;height:15px}
html[data-scope="admin"] .cs-batch-ta{width:100%;resize:vertical;line-height:1.6}
html[data-scope="admin"] .cs-batch-warn{background:#FFF1E9;border:1px solid #F5CFAF;color:#E37318;border-radius:4px;padding:12px 14px;font-size:13px;line-height:1.7}
/* 头部工具条小屏折叠 */
@media (max-width:900px){
  html[data-scope="admin"] .cs-headbar{width:100%;justify-content:flex-start}
}

/* ---- 用户端聊天悬浮框 TDesign 化（.csx-*） ---- */
.csx-btn{
  position:fixed;right:22px;bottom:26px;z-index:999;width:52px;height:52px;border-radius:6px;
  border:0;background:var(--shuxu-1);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(0,82,217,.3);transition:background .15s ease;
}
.csx-btn:hover{background:#266FE8}
.csx-panel{
  position:fixed;right:22px;bottom:88px;z-index:999;width:360px;max-width:calc(100vw - 24px);height:520px;
  background:#fff;border:1px solid #E7E7E7;border-radius:8px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 8px 30px rgba(0,0,0,.12);
}
.csx-hd{
  height:48px;flex:0 0 48px;display:flex;align-items:center;gap:8px;padding:0 14px;
  background:#fff;border-bottom:1px solid #E7E7E7;color:rgba(0,0,0,.9);font-size:14px;font-weight:600;
}
.csx-hd .csx-close{margin-left:auto;border:0;background:none;font-size:20px;color:rgba(0,0,0,.4);cursor:pointer;line-height:1}
.csx-hd .csx-close:hover{color:rgba(0,0,0,.9)}
.csx-msgs{flex:1;overflow-y:auto;padding:14px;background:#F8F8F8}
.csx-tip{text-align:center;font-size:12px;color:rgba(0,0,0,.4);margin-bottom:10px}
.csx-m{display:flex;align-items:flex-start;gap:8px;margin-bottom:12px}
.csx-m.me{flex-direction:row-reverse}
.csx-bubble{
  max-width:72%;padding:9px 12px;border-radius:3px 8px 8px 8px;background:#F3F3F3;
  color:rgba(0,0,0,.9);font-size:13.5px;line-height:1.6;word-break:break-word;
}
.csx-m.me .csx-bubble{background:var(--shuxu-1);color:#fff;border-radius:8px 3px 8px 8px}
.csx-m.me .csx-bubble a{color:#fff;text-decoration:underline}
.csx-bubble img{border-radius:4px;max-width:200px;cursor:zoom-in}
.csx-time{font-size:11px;color:rgba(0,0,0,.4);margin-top:4px}
.csx-m.me .csx-time{text-align:right}
.csx-input{flex:0 0 auto;border-top:1px solid #E7E7E7;background:#fff}
.csx-tools{display:flex;align-items:center;gap:4px;padding:6px 10px 0}
.csx-tool{border:0;background:none;color:rgba(0,0,0,.4);cursor:pointer;padding:5px;border-radius:3px;display:inline-flex}
.csx-tool:hover{background:#F3F3F3;color:var(--shuxu-1)}
.csx-uping{font-size:12px;color:var(--shuxu-1);margin-left:6px}
.csx-row{display:flex;align-items:flex-end;gap:8px;padding:8px 10px 10px}
.csx-ta{
  flex:1;border:1px solid #E7E7E7;border-radius:3px;padding:7px 10px;font-size:13px;resize:none;
  background:#fff;color:rgba(0,0,0,.9);line-height:1.5;min-height:34px;
}
.csx-ta:focus{border-color:var(--shuxu-1);box-shadow:0 0 0 2px rgba(0,82,217,.12)}
.csx-send{
  border:0;border-radius:3px;background:var(--shuxu-1);color:#fff;padding:8px 16px;font-size:13px;cursor:pointer;
}
.csx-send:hover{background:#266FE8}
.csx-send:disabled{opacity:.5;cursor:not-allowed}
.csx-login{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:rgba(0,0,0,.6);font-size:13px}
.csx-login a{color:var(--shuxu-1)}
.csx-viewer{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.csx-viewer img{max-width:92vw;max-height:92vh}
@media (max-width:640px){
  .csx-btn{right:14px;bottom:16px;width:46px;height:46px}
  .csx-panel{right:10px;left:10px;width:auto;bottom:70px;height:min(62vh,480px)}
}

/* ---- AI 风险预查 ---- */
html[data-scope="admin"] .ai-lv{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:6px;font-weight:800;font-size:20px;color:#fff;flex:0 0 44px}
html[data-scope="admin"] .ai-lv.sm{width:26px;height:26px;font-size:13px;flex:0 0 26px;border-radius:4px}
html[data-scope="admin"] .ai-lv.lvA{background:#2BA471}.ai-lv.lvB{background:#4B9B6E}
html[data-scope="admin"] .ai-lv.lvC{background:#E37318}
html[data-scope="admin"] .ai-lv.lvD{background:#D54941}.ai-lv.lvE{background:#A6302B}
html[data-scope="admin"] .ai-items{display:flex;flex-direction:column;gap:10px}
html[data-scope="admin"] .ai-item{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid #E7E7E7;border-radius:6px;background:#FAFAFA}
html[data-scope="admin"] .ai-sev{flex:0 0 auto;font-size:12px;padding:1px 8px;border-radius:3px;font-weight:600}
html[data-scope="admin"] .ai-sev.s-high{background:#FDECEE;color:#D54941}
html[data-scope="admin"] .ai-sev.s-mid{background:#FFF1E9;color:#E37318}
html[data-scope="admin"] .ai-sev.s-low{background:#ECF2FE;color:#0052D9}
html[data-scope="admin"] .t-ok{color:#2BA471}
html[data-scope="admin"] .t-bad{color:#D54941}
/* AI 功能角色分配 */
html[data-scope="admin"] .ai-role{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 12px;border:1px solid #E7E7E7;border-radius:8px;margin-bottom:8px;max-width:680px;background:#FAFAFB}
html[data-scope="admin"] .ai-role-badge{font-size:12px;font-weight:600;color:#0A55C4;background:#EAF2FF;border-radius:6px;padding:3px 10px;white-space:nowrap}
html[data-scope="admin"] .ai-role-page{font-size:12px;color:#667085;white-space:nowrap;padding:3px 10px;border:1px dashed #D8DCE5;border-radius:6px}

/* ---- 第十三轮补丁：聊天媒体尺寸约束（防撑破气泡） ---- */
/* 消息行布局：覆盖第九轮 column 布局，头像与气泡同行 */
html[data-scope="admin"] .cs-msgs .cs-m{flex-direction:row;align-items:flex-start;justify-content:flex-start;gap:10px}
html[data-scope="admin"] .cs-msgs .cs-m.admin{flex-direction:row-reverse}
html[data-scope="admin"] .cs-msgs .cs-m.user{flex-direction:row}
html[data-scope="admin"] .cs-img{max-width:min(160px,100%);max-height:120px;width:auto;height:auto;border-radius:4px;cursor:zoom-in;display:block}
html[data-scope="admin"] .cs-video{max-width:min(220px,100%);max-height:160px;border-radius:4px;display:block}
html[data-scope="admin"] .cs-audio{width:min(260px,100%)}
html[data-scope="admin"] .cs-file{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.csx-bubble img{max-width:min(140px,100%);max-height:110px;width:auto;height:auto}
.csx-bubble video{max-width:min(240px,100%);max-height:180px;border-radius:4px;display:block}
.csx-bubble audio{width:min(230px,100%)}
/* 上传限制弹窗 */
html[data-scope="admin"] .cs-up-grid{display:flex;flex-direction:column;gap:4px}
html[data-scope="admin"] .cs-up-item{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #F0F0F0}
html[data-scope="admin"] .cs-up-item:last-child{border-bottom:0}
html[data-scope="admin"] .cs-up-item .sub{font-size:12px;margin-top:2px}

