/* ============================================================
   安筑识险 · 云端管理平台 —— 共享样式 V2
   主题：明亮清新（草绿 #2EB88A · 天蓝 #3FA9E0 · 暖黄 #FFC53D）
   吉祥物「安小筑」元素贯穿登录页与管理后台
   ============================================================ */
:root{
  --brand:#2EB88A;
  --brand-2:#45CB9D;
  --brand-3:#1E9C72;
  --brand-deep:#177A59;
  --brand-soft:#E8F8F1;
  --brand-grad:linear-gradient(135deg,#2EB88A 0%,#5FD6A6 100%);
  --blue:#3FA9E0;
  --blue-2:#71C4EB;
  --blue-soft:#E8F4FC;
  --yellow:#FFC53D;
  --yellow-2:#FFDC85;
  --yellow-soft:#FFF6E2;
  --coral:#FF8A65;
  --coral-soft:#FFEFE9;
  --bg:#F4F8F6;
  --card:#FFFFFF;
  --text:#1F2A28;
  --text-2:#63736F;
  --text-3:#98A6A2;
  --border:#E7EEEA;
  --ok:#1FA971;
  --ok-soft:#E4F7EE;
  --warn:#E9A23B;
  --warn-soft:#FBF1DE;
  --danger:#E5484D;
  --danger-soft:#FCEAEA;
  --radius-lg:18px;
  --radius:12px;
  --radius-sm:8px;
  --shadow-sm:0 1px 2px rgba(31,42,40,.04),0 6px 18px rgba(31,42,40,.05);
  --shadow:0 10px 34px rgba(31,42,40,.09);
  --shadow-lg:0 24px 70px rgba(31,42,40,.18);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Roboto,Helvetica,Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:var(--font);color:var(--text);background:var(--bg);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;outline:none}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:#D3DDD8;border-radius:8px}
::-webkit-scrollbar-track{background:transparent}

/* ---------- 通用元素 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:38px;padding:0 18px;border-radius:10px;border:1px solid var(--border);background:#fff;color:var(--text);font-size:13.5px;font-weight:600;transition:.18s;white-space:nowrap}
.btn:hover{border-color:#D6E0DB;background:#F8FBFA}
.btn-primary{background:var(--brand-grad);border:none;color:#fff;box-shadow:0 8px 20px rgba(46,184,138,.28)}
.btn-primary:hover{filter:brightness(1.04);transform:translateY(-1px)}
.btn-blue{background:linear-gradient(135deg,#3FA9E0 0%,#6EC1EA 100%);border:none;color:#fff;box-shadow:0 8px 20px rgba(63,169,224,.26)}
.btn-blue:hover{filter:brightness(1.04);transform:translateY(-1px)}
.btn-yellow{background:linear-gradient(135deg,#FFC53D 0%,#FFDC85 100%);border:none;color:#7A5410;box-shadow:0 8px 20px rgba(255,197,61,.28)}
.btn-yellow:hover{filter:brightness(1.03);transform:translateY(-1px)}
.btn-ghost{border:none;background:transparent;color:var(--text-2);height:34px}
.btn-ghost:hover{color:var(--brand-3);background:var(--brand-soft)}
.btn-danger{background:#fff;border:1px solid #F3C4C5;color:var(--danger)}
.btn-danger:hover{background:var(--danger-soft)}
.btn-sm{height:30px;padding:0 12px;font-size:12.5px;border-radius:8px}
.btn-lg{height:46px;font-size:15px;border-radius:12px}
.btn-block{width:100%}

.input,.select,.textarea{width:100%;height:40px;padding:0 14px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text);font-size:13.5px;transition:.18s}
.input:focus,.select:focus,.textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(46,184,138,.13)}
.textarea{height:auto;padding:10px 14px;resize:vertical}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2398A6A2' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}

.card{background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid rgba(231,238,234,.9)}
.card-pad{padding:20px}
.card-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.card-title h3{font-size:15.5px;font-weight:700}
.card-title .sub{font-size:12.5px;color:var(--text-3);font-weight:400;margin-left:8px}
.card-title .link{font-size:12.5px;color:var(--brand-3);font-weight:600}

.tag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:20px;font-size:12px;font-weight:600}
.tag-ok{background:var(--ok-soft);color:var(--ok)}
.tag-warn{background:var(--warn-soft);color:#B97E18}
.tag-danger{background:var(--danger-soft);color:var(--danger)}
.tag-gray{background:#F0F4F2;color:var(--text-2)}
.tag-brand{background:var(--brand-soft);color:var(--brand-3)}
.tag-blue{background:var(--blue-soft);color:#2078A8}
.tag-yellow{background:var(--yellow-soft);color:#9A6B08}

.avatar{width:34px;height:34px;border-radius:50%;background:var(--brand-grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0}
.avatar-sm{width:28px;height:28px;font-size:11px}
.mascot-ic{width:34px;height:34px;object-fit:contain;display:block}

/* 开关 */
.switch{position:relative;display:inline-block;width:42px;height:24px;flex-shrink:0}
.switch input{opacity:0;width:0;height:0}
.switch .slider{position:absolute;inset:0;background:#D2DCD7;border-radius:24px;transition:.22s;cursor:pointer}
.switch .slider::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.22s;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.switch input:checked + .slider{background:var(--brand)}
.switch input:checked + .slider::before{transform:translateX(18px)}
.switch.sw-blue input:checked + .slider{background:var(--blue)}
.switch.sw-yellow input:checked + .slider{background:var(--yellow)}

/* 弹窗 */
.modal-mask{position:fixed;inset:0;background:rgba(23,36,32,.42);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;z-index:999;padding:20px}
.modal-mask.open{display:flex}
.modal{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:560px;max-width:96vw;max-height:90vh;display:flex;flex-direction:column;animation:pop .22s ease}
@keyframes pop{from{opacity:0;transform:scale(.96) translateY(10px)}to{opacity:1;transform:none}}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border)}
.modal-head h3{font-size:16px;font-weight:700}
.modal-body{padding:22px;overflow:auto}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--border)}
.modal-close{width:30px;height:30px;border:none;background:#F0F4F2;border-radius:8px;color:var(--text-2);font-size:15px;display:flex;align-items:center;justify-content:center}
.modal-close:hover{background:#E2E9E5}

/* 表格 */
.table-wrap{overflow:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
table.tbl th{text-align:left;padding:11px 14px;color:var(--text-3);font-size:12px;font-weight:600;background:#F8FBFA;border-bottom:1px solid var(--border);white-space:nowrap}
table.tbl td{padding:12px 14px;border-bottom:1px solid var(--border);white-space:nowrap}
table.tbl tbody tr{transition:.12s}
table.tbl tbody tr:hover{background:#F5FCF8}
table.tbl tr:last-child td{border-bottom:none}
.tbl .cell-user{display:flex;align-items:center;gap:10px}
.tbl .cell-user .nm{font-weight:600}
.tbl .cell-user .ph{font-size:12px;color:var(--text-3)}
.tbl .op{display:flex;gap:6px}
.tbl .op button{background:none;border:none;color:var(--text-2);font-size:12.5px;font-weight:600;padding:2px 4px;border-radius:6px}
.tbl .op button:hover{color:var(--brand-3);background:var(--brand-soft)}
.tbl .op button.danger:hover{color:var(--danger);background:var(--danger-soft)}
.tbl-num{font-variant-numeric:tabular-nums}

.pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:14px 4px 0;font-size:13px;color:var(--text-2)}
.pager .pg{min-width:30px;height:30px;border:1px solid var(--border);background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--text-2)}
.pager .pg.active{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:700}
.pager .pg:hover{color:var(--brand-3);border-color:var(--brand-2)}

/* ============================================================
   登录页 —— 二次元漫画风场景 + 悬浮登录卡
   ============================================================ */
.login-body{overflow-x:hidden;background:#DFF3FF}
.login-scene{position:fixed;inset:0;overflow:hidden;z-index:0}
.login-scene svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.scene-sky{position:absolute;inset:0;background:linear-gradient(180deg,#A8DFFF 0%,#C9EDFF 32%,#E4F8FF 52%,#EAF9E3 70%,#CDEFD4 100%)}
.scene-sun{position:absolute;left:8%;top:6%;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(255,222,130,.95) 0%,rgba(255,222,130,.35) 38%,rgba(255,222,130,0) 68%);pointer-events:none}
.scene-glow{position:absolute;right:-6%;bottom:-14%;width:720px;height:720px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.65) 0%,rgba(255,255,255,0) 66%);pointer-events:none}
.float-slow{animation:floatY 6.5s ease-in-out infinite}
.float-mid{animation:floatY 4.8s ease-in-out infinite}
.float-fast{animation:floatY 3.4s ease-in-out infinite}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.sway{transform-origin:top center;animation:sway 5.2s ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(-1.4deg)}50%{transform:rotate(1.4deg)}}
.bob{animation:bob 2.8s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-9px) scale(1.012)}}

.login-wrap{position:relative;z-index:2;min-height:100vh;display:flex;align-items:center;justify-content:space-between;gap:40px;padding:56px 6vw 56px 6.5vw}
.login-hero{max-width:520px;padding-bottom:10px}
.login-hero .brandline{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.login-hero .brandline .mark{width:52px;height:52px;border-radius:16px;background:rgba(255,255,255,.78);backdrop-filter:blur(8px);box-shadow:0 10px 26px rgba(31,42,40,.12);display:flex;align-items:center;justify-content:center}
.login-hero .brandline .mark img{width:40px;height:40px;object-fit:contain}
.login-hero .brandline h1{font-size:21px;font-weight:800;letter-spacing:.6px;color:#14503C}
.login-hero .brandline span{display:block;font-size:11.5px;font-weight:600;color:#3E7C67;letter-spacing:2.4px}
.login-hero .hero-title{font-size:46px;line-height:1.28;font-weight:900;color:#12503B;letter-spacing:1px;text-shadow:0 2px 0 rgba(255,255,255,.6)}
.login-hero .hero-title em{font-style:normal;color:#1E9C72;position:relative;display:inline-block}
.login-hero .hero-title em::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:11px;border-radius:8px;background:rgba(255,197,61,.62);z-index:-1}
.login-hero .hero-desc{margin-top:18px;font-size:15px;line-height:2;color:#2C6B56;max-width:430px}
.login-hero .hero-badges{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.login-hero .hero-badges .chip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 15px;border-radius:20px;background:rgba(255,255,255,.72);backdrop-filter:blur(8px);box-shadow:0 6px 18px rgba(31,42,40,.08);font-size:12.5px;font-weight:700;color:#28735C}
.login-hero .hero-badges .chip i{width:8px;height:8px;border-radius:50%;background:var(--brand);display:inline-block}
.login-hero .hero-badges .chip.b i{background:var(--blue)}
.login-hero .hero-badges .chip.c i{background:var(--yellow)}

.login-card{position:relative;width:428px;flex-shrink:0;background:rgba(255,255,255,.76);backdrop-filter:blur(22px) saturate(150%);border:1px solid rgba(255,255,255,.92);border-radius:28px;box-shadow:0 30px 90px rgba(20,80,60,.2),0 4px 14px rgba(20,80,60,.06);padding:40px 38px 34px;animation:cardIn .5s ease}
@keyframes cardIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.login-card::before{content:"";position:absolute;inset:-1px;border-radius:28px;padding:1px;background:linear-gradient(140deg,rgba(255,255,255,.95),rgba(46,184,138,.35) 45%,rgba(255,197,61,.35));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;pointer-events:none}
.login-card .card-mascot{position:absolute;top:-64px;right:22px;width:104px;height:104px;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(20,80,60,.22))}
.login-card h2{font-size:25px;font-weight:900;letter-spacing:.5px;color:#14503C}
.login-card .welcome{color:#5C7B71;font-size:13.5px;margin:6px 0 26px}
.login-field{margin-bottom:16px}
.login-field label{display:block;font-size:12.5px;font-weight:700;color:#3D6255;margin-bottom:7px}
.login-field .input{height:48px;font-size:14px;border:none;background:rgba(240,247,244,.92);border-radius:12px;padding:0 16px}
.login-field .input:focus{background:#fff;box-shadow:0 0 0 3px rgba(46,184,138,.18)}
.login-field .input::placeholder{color:#9DB2AA}
.login-code{display:flex;gap:10px}
.login-code .input{flex:1}
.login-code .code-btn{width:112px;height:48px;border:none;background:rgba(240,247,244,.92);border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.login-code .code-btn img{height:32px;display:block;border-radius:6px}
.login-options{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:#5C7B71;margin:4px 0 22px}
.login-options .ck{display:flex;align-items:center;gap:6px}
.login-options .ck input{accent-color:var(--brand);width:15px;height:15px}
.login-options a{color:var(--brand-3);font-weight:600}
.login-card .btn-login{height:50px;font-size:15.5px;border-radius:14px;background:linear-gradient(135deg,#1E9C72 0%,#2EB88A 100%);border:none;color:#fff;font-weight:800;letter-spacing:3px;box-shadow:0 14px 30px rgba(30,156,114,.32);width:100%;transition:.2s}
.login-card .btn-login:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(30,156,114,.38)}
.login-card .foot{margin-top:22px;text-align:center;color:#7C968C;font-size:12px}
.login-tips{display:flex;align-items:center;gap:9px;margin-top:18px;padding:11px 14px;border-radius:12px;background:rgba(232,248,241,.86);font-size:12px;color:#2C7D62;line-height:1.6}
.login-tips img{width:22px;height:22px;object-fit:contain}
.scene-mascot{position:absolute;left:11.5%;bottom:1vh;width:min(17vw,238px);z-index:1;pointer-events:none;filter:drop-shadow(0 26px 44px rgba(20,80,60,.24))}
@media (max-width:1280px){.scene-mascot{width:min(19vw,200px);left:8%}}

/* ============================================================
   管理后台框架
   ============================================================ */
.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}
.topbar{height:62px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 22px;gap:18px;flex-shrink:0;position:relative;z-index:20}
.topbar .logo{display:flex;align-items:center;gap:11px;font-weight:800;font-size:16px;letter-spacing:.3px}
.topbar .logo .ic{width:36px;height:36px;border-radius:12px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 14px rgba(46,184,138,.18)}
.topbar .logo .ic img{width:30px;height:30px;object-fit:contain}
.topbar .logo small{display:block;font-size:10.5px;font-weight:600;color:var(--text-3);letter-spacing:1.5px}
.topbar .search{flex:1;max-width:420px;position:relative}
.topbar .search input{width:100%;height:38px;border-radius:10px;background:#F3F8F5;border:1px solid transparent;padding:0 38px 0 38px;font-size:13px;transition:.18s}
.topbar .search input:focus{background:#fff;border-color:var(--brand)}
.topbar .search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-3)}
.topbar .spacer{flex:1}
.topbar .tb-item{position:relative;width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--text-2);background:transparent;border:none;transition:.15s}
.topbar .tb-item:hover{background:#F3F8F5;color:var(--text)}
.topbar .tb-item .dot{position:absolute;top:8px;right:9px;width:8px;height:8px;background:var(--coral);border-radius:50%;border:2px solid #fff}
.topbar .user{display:flex;align-items:center;gap:10px;padding:5px 10px 5px 6px;border-radius:12px;cursor:pointer;border:none;background:transparent}
.topbar .user:hover{background:#F3F8F5}
.topbar .user .info{text-align:left}
.topbar .user .info b{display:block;font-size:13px;font-weight:700;line-height:1.2}
.topbar .user .info span{font-size:11px;color:var(--text-3)}

.layout{display:flex;flex:1;overflow:hidden}
.sidebar{width:236px;background:#fff;border-right:1px solid var(--border);padding:16px 12px;display:flex;flex-direction:column;flex-shrink:0;overflow:auto}
.side-group{font-size:11px;color:var(--text-3);font-weight:700;letter-spacing:1px;padding:12px 12px 6px}
.side-item{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:12px;color:var(--text-2);font-size:13.5px;font-weight:600;cursor:pointer;margin-bottom:3px;transition:.16s;border:none;background:transparent;width:100%;text-align:left}
.side-item svg{flex-shrink:0}
.side-item:hover{background:#F4F9F6;color:var(--text)}
.side-item.active{background:var(--brand-soft);color:var(--brand-3)}
.side-item.active svg{color:var(--brand-3)}
.side-item .badge{margin-left:auto;background:var(--brand);color:#fff;font-size:10.5px;font-weight:700;height:18px;min-width:18px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:0 5px}
.side-item.active .badge{background:var(--brand-3)}
.side-item.sub{padding-left:34px;font-size:13px;font-weight:500;color:var(--text-2)}
.side-item.sub::before{content:"";width:6px;height:6px;border-radius:50%;background:#CFDDD7;flex-shrink:0}
.side-item.sub.active::before{background:var(--brand)}
.side-item.sub .badge{background:#EDF2F0;color:var(--text-2)}
.side-item.sub.active .badge{background:var(--brand);color:#fff}
.side-bottom{margin-top:auto;padding:12px;font-size:12px;color:var(--text-3);background:linear-gradient(135deg,#E8F8F1,#EAF6FC);border-radius:14px;margin-top:14px}
.side-bottom .ver{display:flex;align-items:center;gap:6px;font-weight:700;color:#256B55;margin-bottom:3px}

.main{flex:1;overflow:auto;padding:24px;position:relative;background:
  radial-gradient(circle at 100% 0%,rgba(232,248,241,.85) 0%,rgba(232,248,241,0) 42%),
  radial-gradient(circle at 0% 100%,rgba(232,244,252,.75) 0%,rgba(232,244,252,0) 38%),
  var(--bg)}
.view{display:none;animation:fadeIn .3s ease}
.view.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.page-head h2{font-size:21px;font-weight:800;letter-spacing:.2px;display:flex;align-items:center;gap:10px}
.page-head h2 .mascot-ic{width:30px;height:30px}
.page-head .desc{color:var(--text-2);font-size:13px;margin-top:4px}
.page-head .right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* 看板 */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}
.kpi{position:relative;padding:20px 22px;overflow:hidden}
.kpi::after{content:"";position:absolute;right:-34px;top:-34px;width:120px;height:120px;border-radius:50%;background:var(--brand-soft);opacity:.72}
.kpi.b::after{background:var(--blue-soft)}
.kpi.y::after{background:var(--yellow-soft)}
.kpi.c::after{background:var(--coral-soft)}
.kpi .k-label{font-size:13px;color:var(--text-2);font-weight:600;display:flex;align-items:center;gap:7px;position:relative;z-index:1}
.kpi .k-label svg{color:var(--brand-3)}
.kpi.b .k-label svg{color:#2078A8}
.kpi.y .k-label svg{color:#B5820F}
.kpi.c .k-label svg{color:#D9633F}
.kpi .k-val{font-size:30px;font-weight:800;letter-spacing:.5px;margin:8px 0 4px;font-variant-numeric:tabular-nums;position:relative;z-index:1}
.kpi .k-trend{font-size:12.5px;color:var(--text-3);display:flex;align-items:center;gap:6px;position:relative;z-index:1}
.kpi .k-trend .up{color:var(--ok);font-weight:700}
.kpi .k-trend .down{color:var(--danger);font-weight:700}
.kpi .k-spark{position:absolute;right:14px;bottom:14px;opacity:.9}

.charts{display:grid;grid-template-columns:1.55fr 1fr;gap:16px;margin-bottom:16px}
.chart-box{padding:20px}
.chart-box .legend{display:flex;gap:16px;font-size:12px;color:var(--text-2);margin-top:6px}
.chart-box .legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px}
.dash-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:16px}
.donut-wrap{display:flex;align-items:center;gap:22px;padding:6px 0}
.donut-legend{flex:1;display:flex;flex-direction:column;gap:12px}
.donut-legend .li{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--text-2)}
.donut-legend .li b{margin-left:auto;color:var(--text);font-variant-numeric:tabular-nums}

/* 筛选栏 */
.filter-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:16px 20px;margin-bottom:16px}
.filter-bar .input,.filter-bar .select{width:auto;min-width:170px;height:38px}
.filter-bar .input.wide{min-width:240px}

/* 二级 Tab（发现页管理） */
.sub-tabs{display:flex;gap:8px;padding:6px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);margin-bottom:16px;width:fit-content}
.sub-tab{height:38px;padding:0 20px;border:none;background:transparent;border-radius:10px;font-size:13.5px;font-weight:700;color:var(--text-2);display:inline-flex;align-items:center;gap:8px;transition:.18s}
.sub-tab:hover{color:var(--text);background:#F4F9F6}
.sub-tab.active{background:var(--brand-grad);color:#fff;box-shadow:0 8px 18px rgba(46,184,138,.26)}
.sub-tab .cnt{font-size:11.5px;font-weight:700;background:rgba(0,0,0,.06);border-radius:10px;padding:1px 7px}
.sub-tab.active .cnt{background:rgba(255,255,255,.26)}
.sub-panel{display:none}
.sub-panel.active{display:block;animation:fadeIn .25s ease}

/* 发现页 - 资讯卡片网格 */
.disc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:16px}
.disc-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:.2s;display:flex;flex-direction:column}
.disc-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.disc-cover{position:relative;height:142px;background-size:cover;background-position:center}
.disc-cover .mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02) 40%,rgba(0,0,0,.32) 100%)}
.disc-cover .st{position:absolute;top:10px;left:10px}
.disc-cover .cat{position:absolute;right:10px;top:10px;background:rgba(255,255,255,.92);color:#256B55;font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px}
.disc-cover .ic{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:42px}
.disc-body{padding:14px 16px;display:flex;flex-direction:column;gap:7px;flex:1}
.disc-body .d-title{font-weight:700;font-size:14.5px;line-height:1.45}
.disc-body .d-sub{font-size:12.5px;color:var(--text-2);line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.disc-body .d-meta{font-size:11.5px;color:var(--text-3);display:flex;gap:12px;flex-wrap:wrap}
.disc-body .d-ops{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px;border-top:1px dashed var(--border)}
.disc-body .d-ops .op{display:flex;gap:4px}
.disc-body .d-ops .op button{background:none;border:none;color:var(--text-2);font-size:12.5px;font-weight:600;padding:3px 5px;border-radius:6px}
.disc-body .d-ops .op button:hover{color:var(--brand-3);background:var(--brand-soft)}
.disc-body .d-ops .op button.danger:hover{color:var(--danger);background:var(--danger-soft)}

/* 发现页 - PPT 网格 */
.ppt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:16px}
.ppt-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:.2s}
.ppt-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.ppt-thumb{position:relative;height:124px;display:flex;align-items:center;justify-content:center;font-size:34px;color:#fff}
.ppt-thumb .order{position:absolute;top:9px;left:9px;background:rgba(255,255,255,.92);color:#256B55;font-size:11px;font-weight:800;padding:3px 9px;border-radius:20px}
.ppt-thumb .st{position:absolute;top:9px;right:9px}
.ppt-thumb .pg-n{position:absolute;bottom:8px;right:10px;font-size:11px;color:rgba(255,255,255,.92);font-weight:600}
.ppt-body{padding:12px 14px}
.ppt-body .p-title{font-weight:700;font-size:13.5px;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ppt-body .p-sub{font-size:12px;color:var(--text-3);line-height:1.6;height:38px;overflow:hidden}
.ppt-body .p-ops{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding-top:9px;border-top:1px dashed var(--border)}
.ppt-body .p-ops .op{display:flex;gap:4px}
.ppt-body .p-ops .op button{background:none;border:none;color:var(--text-2);font-size:12.5px;font-weight:600;padding:3px 5px;border-radius:6px}
.ppt-body .p-ops .op button:hover{color:var(--brand-3);background:var(--brand-soft)}
.ppt-body .p-ops .op button.danger:hover{color:var(--danger);background:var(--danger-soft)}

/* Push 管理 */
.push-list{display:flex;flex-direction:column;gap:12px}
.push-item{display:flex;gap:16px;padding:16px 18px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:.2s;align-items:flex-start}
.push-item:hover{box-shadow:var(--shadow)}
.push-ico{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:21px;flex-shrink:0;background:var(--brand-soft)}
.push-ico.b{background:var(--blue-soft)}
.push-ico.y{background:var(--yellow-soft)}
.push-ico.c{background:var(--coral-soft)}
.push-main{flex:1;min-width:0}
.push-main .pu-title{font-weight:700;font-size:14.5px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.push-main .pu-text{font-size:12.8px;color:var(--text-2);line-height:1.7;margin:5px 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.push-main .pu-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:11.8px;color:var(--text-3)}
.push-main .pu-meta b{color:var(--text-2);font-weight:600}
.push-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex-shrink:0}
.push-side .op{display:flex;gap:4px}
.push-side .op button{background:none;border:none;color:var(--text-2);font-size:12.5px;font-weight:600;padding:3px 5px;border-radius:6px}
.push-side .op button:hover{color:var(--brand-3);background:var(--brand-soft)}
.push-side .op button.danger:hover{color:var(--danger);background:var(--danger-soft)}
.push-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}

/* 版本更新 - 安装包 & 开关 */
.upload-box{border:1.6px dashed #BFD9CE;border-radius:var(--radius-lg);background:linear-gradient(180deg,#F7FCFA,#FFFFFF);padding:26px;text-align:center;cursor:pointer;transition:.2s}
.upload-box:hover{border-color:var(--brand);background:#F3FBF7;transform:translateY(-1px)}
.upload-box .up-ic{width:56px;height:56px;border-radius:18px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.upload-box .up-ic img{width:40px;height:40px;object-fit:contain}
.upload-box b{display:block;font-size:14.5px;margin-bottom:5px}
.upload-box span{font-size:12.5px;color:var(--text-3)}
.upload-box .up-hint{margin-top:12px;font-size:12px;color:var(--text-3);display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.pkg-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border:1px solid var(--border);border-radius:14px;background:#fff;margin-top:12px}
.pkg-row .pkg-ic{width:40px;height:40px;border-radius:12px;background:var(--blue-soft);color:#2078A8;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}
.pkg-row .pkg-name{font-weight:700;font-size:13.5px}
.pkg-row .pkg-meta{font-size:11.8px;color:var(--text-3);display:flex;gap:14px;flex-wrap:wrap;margin-top:3px}
.pkg-row .pkg-right{margin-left:auto;display:flex;align-items:center;gap:10px}

.toggle-card{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border:1px solid var(--border);border-radius:14px;background:#fff;margin-bottom:12px}
.toggle-card:last-child{margin-bottom:0}
.toggle-card .t-ic{width:40px;height:40px;border-radius:12px;background:var(--brand-soft);color:var(--brand-3);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.toggle-card.blue .t-ic{background:var(--blue-soft);color:#2078A8}
.toggle-card.yellow .t-ic{background:var(--yellow-soft);color:#B5820F}
.toggle-card .t-body{flex:1;min-width:0}
.toggle-card .t-body b{font-size:14px;display:block;margin-bottom:3px}
.toggle-card .t-body p{font-size:12.5px;color:var(--text-2);line-height:1.7}
.toggle-card .t-act{flex-shrink:0;padding-top:2px}
.settings-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:16px;align-items:start}

/* 海报卡片列表 */
.banner-strip{display:flex;gap:16px;overflow-x:auto;padding:4px 4px 10px}
.banner-card{flex:0 0 300px;border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff;overflow:hidden;transition:.2s;box-shadow:var(--shadow-sm)}
.banner-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.banner-card.off{opacity:.72}
.banner-thumb{position:relative;height:150px;background-size:cover;background-position:center}
.banner-thumb .mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.3) 100%)}
.banner-thumb .order{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.94);color:#256B55;font-size:11px;font-weight:800;padding:3px 9px;border-radius:20px;box-shadow:var(--shadow-sm)}
.banner-thumb .st{position:absolute;top:10px;right:10px}
.banner-thumb .cta{position:absolute;left:14px;bottom:12px;color:#fff;font-size:13px;font-weight:700;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.banner-body{padding:14px 16px}
.banner-body .b-title{font-weight:700;font-size:14px;margin-bottom:2px}
.banner-body .b-meta{font-size:12px;color:var(--text-3);display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.banner-body .b-ops{display:flex;align-items:center;justify-content:space-between}
.banner-body .b-ops .switch{margin:0 6px 0 2px}
.banner-body .op button{background:none;border:none;color:var(--text-2);font-size:12.5px;font-weight:600;padding:3px 5px;border-radius:6px}
.banner-body .op button:hover{color:var(--brand-3);background:var(--brand-soft)}
.banner-body .op button.danger:hover{color:var(--danger);background:var(--danger-soft)}
.banner-body .sort-row{display:flex;align-items:center;gap:6px;margin-top:10px;padding-top:9px;border-top:1px dashed var(--border);font-size:12px;color:var(--text-3)}
.banner-body .sort-row .sq{width:24px;height:24px;border-radius:8px;border:1px solid var(--border);background:#fff;color:var(--text-2);font-size:12px;display:flex;align-items:center;justify-content:center}
.banner-body .sort-row .sq:hover{border-color:var(--brand);color:var(--brand-3)}

/* 二级页（轮播图内页）编辑器 */
.article-editor{display:flex;gap:26px;background:#F7FBF9;align-items:flex-start}
.cover-picker{display:flex;gap:10px;flex-wrap:wrap}
.cover-opt{width:96px;height:60px;border-radius:10px;border:2px solid transparent;background-size:cover;background-position:center;cursor:pointer;position:relative;box-shadow:var(--shadow-sm)}
.cover-opt.on{border-color:var(--brand);box-shadow:0 0 0 3px rgba(46,184,138,.18)}
.cover-opt span{position:absolute;left:6px;bottom:4px;font-size:10px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.4)}

/* 启动页网格 */
.splash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.splash-card{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:#fff;transition:.2s;box-shadow:var(--shadow-sm)}
.splash-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.splash-thumb{height:132px;background-size:cover;background-position:center;position:relative;display:flex;align-items:center;justify-content:center}
.splash-thumb .ph{position:absolute;bottom:6px;right:10px;font-size:10px;color:#fff;opacity:.9}
.splash-thumb .st{position:absolute;top:9px;left:9px}
.splash-body{padding:12px 14px}
.splash-body .s-title{font-weight:700;font-size:13.5px;margin-bottom:6px}
.splash-body .s-meta{font-size:12px;color:var(--text-3);display:flex;justify-content:space-between;margin-bottom:10px;gap:8px}
.splash-body .s-ops{display:flex;align-items:center;justify-content:space-between}
.splash-body .op{display:flex;gap:4px}
.splash-body .op button{background:none;border:none;color:var(--text-2);font-size:12.5px;font-weight:600;padding:3px 5px;border-radius:6px}
.splash-body .op button:hover{color:var(--brand-3);background:var(--brand-soft)}
.splash-body .op button.danger:hover{color:var(--danger);background:var(--danger-soft)}

/* 版本管理 */
.ver-detail{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:6px 0 4px}
.ver-detail .it{background:#F8FBFA;border:1px solid var(--border);border-radius:12px;padding:12px 14px}
.ver-detail .it span{font-size:11.5px;color:var(--text-3);display:block;margin-bottom:3px}
.ver-detail .it b{font-size:14px}
.ver-detail .it b.brand{color:var(--brand-3)}
.badge-ver{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:8px;background:var(--brand-soft);color:var(--brand-3);font-weight:800;font-size:12.5px;letter-spacing:.3px}
.legacy-list{display:flex;flex-direction:column;gap:8px}
.legacy-row{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--border);border-radius:12px;background:#FBFDFC}
.legacy-row .lv{font-weight:800;font-size:13px;color:var(--brand-3);min-width:74px}
.legacy-row .lt{font-size:12.3px;color:var(--text-3);flex:1}
.legacy-row .ls{font-size:12px;font-weight:700;color:var(--text-2);width:52px;text-align:right}

/* 手机弹窗模拟（更新弹窗 / 图文二级页） */
.phone{width:300px;border-radius:26px;background:#F4F8F6;border:1px solid var(--border);overflow:hidden;margin:0 auto;box-shadow:var(--shadow-lg)}
.phone-bar{height:26px;background:#25332F;color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:1px;gap:4px}
.phone-screen{background:#fff;min-height:440px}
.app-dialog{margin:70px 16px;background:#fff;border-radius:16px;box-shadow:0 10px 40px rgba(31,42,40,.2);overflow:hidden;animation:pop .25s ease}
.app-dialog .d-hero{height:112px;background:var(--brand-grad);display:flex;align-items:center;justify-content:center;position:relative}
.app-dialog .d-hero img{width:74px;height:74px;object-fit:contain;filter:drop-shadow(0 8px 16px rgba(0,0,0,.18))}
.app-dialog .d-body{padding:16px 18px;text-align:center}
.app-dialog .d-body h4{font-size:16px;font-weight:800;margin-bottom:8px}
.app-dialog .d-body .ver{font-size:12px;color:var(--text-3);margin-bottom:10px}
.app-dialog .d-notes{background:#F8FBFA;border:1px solid var(--border);border-radius:10px;padding:10px 12px;text-align:left;font-size:12px;color:var(--text-2);line-height:1.8;max-height:110px;overflow:auto;margin-bottom:14px}
.app-dialog .d-btns{display:flex;gap:10px;padding:0 18px 18px}
.app-dialog .d-btns .btn{flex:1}
.app-dialog .d-btns .btn-out{background:#fff;color:var(--text-2);border:1px solid var(--border)}

/* Push 手机预览 */
.push-preview{margin:14px 12px}
.push-preview .pp-bar{display:flex;align-items:center;gap:8px;font-size:10.5px;color:var(--text-3);padding:0 6px 8px}
.push-preview .pp-card{background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-radius:16px;box-shadow:0 10px 30px rgba(31,42,40,.18);padding:13px 14px;display:flex;gap:11px;align-items:flex-start}
.push-preview .pp-card .pi{width:34px;height:34px;border-radius:10px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.push-preview .pp-card .pi img{width:26px;height:26px;object-fit:contain}
.push-preview .pp-card .pt{font-weight:800;font-size:13px;margin-bottom:3px}
.push-preview .pp-card .pc{font-size:12px;color:var(--text-2);line-height:1.6}
.push-preview .pp-app{font-size:10.5px;color:var(--text-3);text-align:right;margin-top:5px}

/* 图文二级页（手机内预览） */
.article-phone .phone-screen{padding-bottom:0}
.article-hero{height:150px;background-size:cover;background-position:center;position:relative;color:#fff}
.article-hero .mask{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.55))}
.article-hero h3{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;font-size:17px;font-weight:800;line-height:1.4}
.article-body{padding:16px}
.article-body p{font-size:13px;color:var(--text-2);line-height:1.9;margin-bottom:12px;text-align:justify}
.article-body .img-ph{height:130px;border-radius:10px;background:var(--brand-soft);margin-bottom:12px;display:flex;align-items:center;justify-content:center;color:var(--brand-3);font-size:13px;font-weight:600}

/* 明细列表（弹窗内） */
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}
.detail-grid .dg{background:#F8FBFA;border-radius:10px;padding:10px 14px}
.detail-grid .dg span{display:block;font-size:11.5px;color:var(--text-3);margin-bottom:2px}
.detail-grid .dg b{font-size:13.5px;font-weight:600}
.detail-grid .dg.full{grid-column:1/-1}

/* toast */
.toast{position:fixed;top:78px;left:50%;transform:translateX(-50%) translateY(-20px);background:#25332F;color:#fff;padding:11px 22px;border-radius:12px;font-size:13px;opacity:0;pointer-events:none;transition:.3s;z-index:1200;box-shadow:var(--shadow);max-width:80vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:1280px){
  .settings-grid{grid-template-columns:1fr}
  .push-stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1200px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  .charts,.dash-grid{grid-template-columns:1fr}
  .ver-detail{grid-template-columns:repeat(2,1fr)}
  .login-hero .hero-title{font-size:36px}
}
@media (max-width:960px){
  .login-wrap{flex-direction:column;justify-content:center;padding:40px 22px}
  .login-hero{max-width:100%}
  .login-hero .hero-desc{max-width:100%}
  .login-card{width:100%;max-width:460px}
  .login-card .card-mascot{top:-56px;right:14px;width:88px;height:88px}
  .sidebar{display:none}
  .article-editor{flex-direction:column}
}

/* ============================================================
   数据看板 V2 · 多风格背景（含吉祥物安小筑）+ 实时数据监测
   依赖布局尺寸：顶栏 62px、左侧栏 236px（与 .topbar / .sidebar 保持一致）
   ============================================================ */

/* ---------------- 背景层（fixed 视差，仅看板激活时可见） ---------------- */
.dash-bg{position:fixed;top:62px;left:236px;right:0;bottom:0;z-index:0;overflow:hidden;pointer-events:none;background:#F4F8F6}
.dash-bg-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.bgset{display:none}
.dash-bg[data-bg="forest"] .bgset-forest,
.dash-bg[data-bg="stardust"] .bgset-stardust,
.dash-bg[data-bg="nebula"] .bgset-nebula,
.dash-bg[data-bg="sakura"] .bgset-sakura,
.dash-bg[data-bg="sunset"] .bgset-sunset,
.dash-bg[data-bg="seabreeze"] .bgset-seabreeze,
.dash-bg[data-bg="honey"] .bgset-honey{display:block}
.bgset-drift{animation:bgDrift 16s ease-in-out infinite alternate}
@keyframes bgDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-28px,16px,0)}}

.dash-bg-veil{position:absolute;inset:0;z-index:3;
  background:linear-gradient(180deg,rgba(255,255,255,.20) 0%,rgba(255,255,255,.34) 46%,rgba(255,255,255,.50) 100%)}
.dash-bg[data-bg="stardust"] .dash-bg-veil{background:linear-gradient(180deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.40) 50%,rgba(255,255,255,.54) 100%)}
.dash-bg[data-bg="nebula"] .dash-bg-veil{background:linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.46) 55%,rgba(255,255,255,.58) 100%)}

.dash-bg-mascot{position:absolute;right:2.6%;bottom:3%;width:min(19vw,292px);z-index:4;pointer-events:none;
  opacity:.98;transition:opacity .28s ease;animation:mascotFloat 7s ease-in-out infinite;
  filter:drop-shadow(0 24px 38px rgba(24,72,58,.22))}
@keyframes mascotFloat{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-18px) rotate(1.6deg)}}
@media (max-width:1440px){.dash-bg-mascot{width:min(19vw,210px);right:2%;bottom:2%}}

/* 内容层置于背景之上 */
.dash-inner{position:relative;z-index:5}
.dash-inner .card{background:rgba(255,255,255,.90);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}

/* ---------------- 页头（玻璃拟态，衬托背景） ---------------- */
#view-dashboard .page-head{margin-bottom:16px;align-items:center;padding:15px 20px;border-radius:20px;
  background:rgba(255,255,255,.74);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.9);box-shadow:0 14px 34px rgba(31,74,59,.08)}

/* ---------------- 数据监测状态条 ---------------- */
.monitor-bar{margin-bottom:16px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;
  gap:22px;flex-wrap:wrap;background:rgba(255,255,255,.9)!important;backdrop-filter:blur(10px)}
.mb-stats{display:flex;gap:26px;flex-wrap:wrap}
.mb-stat{display:flex;align-items:center;gap:10px}
.mb-stat b{display:block;font-size:16.5px;font-weight:800;line-height:1.2;font-variant-numeric:tabular-nums}
.mb-stat span{font-size:11.5px;color:var(--text-3)}
.mb-ic{position:relative;width:36px;height:36px;border-radius:12px;background:var(--brand-soft);flex-shrink:0}
.mb-ic::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--brand)}
.ic-a{animation:mbBeat 2.4s ease-in-out infinite}
.ic-b{background:var(--blue-soft)}.ic-b::after{background:var(--blue)}
.ic-c{background:var(--yellow-soft)}.ic-c::after{background:var(--yellow)}
.ic-d{background:var(--coral-soft)}.ic-d::after{background:var(--coral)}
@keyframes mbBeat{0%,100%{transform:scale(1)}50%{transform:scale(1.09)}}
.mb-refresh{flex:1;min-width:320px;max-width:432px}
.mb-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--text-2)}
.mb-line b{color:var(--text);font-variant-numeric:tabular-nums}
.mb-sel{height:32px;width:auto;min-width:88px}
.mb-progress{margin-top:9px;height:5px;border-radius:4px;background:#EEF3F1;overflow:hidden}
.mb-progress i{display:block;height:100%;width:0;border-radius:4px;background:var(--brand-grad);transition:width 1s linear}

/* ---------------- 迷你折线 ---------------- */
.kpi .k-spark{width:104px;height:44px}
.kpi .k-spark svg{display:block}

/* ---------------- 快捷工作入口（延伸工作展现） ---------------- */
.quick-row{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:16px}
.quick-item{display:flex;align-items:center;gap:11px;padding:13px 14px;border-radius:16px;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.95);border:1px solid var(--border);box-shadow:var(--shadow-sm);cursor:pointer;transition:.18s}
.quick-item:hover{transform:translateY(-3px);border-color:var(--brand-2);box-shadow:0 14px 30px rgba(46,184,138,.16)}
.qi-ic{width:38px;height:38px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  background:var(--brand-soft);color:var(--brand-3)}
.quick-item:nth-child(2) .qi-ic{background:var(--blue-soft);color:#2C7FB8}
.quick-item:nth-child(3) .qi-ic{background:var(--yellow-soft);color:#B58214}
.quick-item:nth-child(4) .qi-ic{background:var(--coral-soft);color:#C4553A}
.quick-item:nth-child(5) .qi-ic{background:#EFE9FF;color:#6C57C7}
.quick-item:nth-child(6) .qi-ic{background:#E6F6F4;color:#2E8B84}
.qi-txt{min-width:0}
.qi-txt b{display:block;font-size:13px;font-weight:700;white-space:nowrap}
.qi-txt span{display:block;font-size:11px;color:var(--text-3);white-space:nowrap}
@media (max-width:1560px){.quick-row{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1180px){.quick-row{grid-template-columns:repeat(2,1fr)}}

/* ---------------- 分段控件 ---------------- */
.seg{display:flex;gap:4px;background:#F2F7F4;border-radius:11px;padding:4px}
.seg-btn{border:none;background:transparent;font-size:12.5px;font-weight:600;color:var(--text-2);
  padding:6px 12px;border-radius:8px;cursor:pointer;transition:.16s;white-space:nowrap}
.seg-btn:hover{color:var(--text)}
.seg-btn.active{background:#fff;color:var(--brand-3);box-shadow:0 2px 8px rgba(31,42,40,.08)}

/* ---------------- 内容运营概览 ---------------- */
.ops-list{display:flex;flex-direction:column;gap:13px}
.ops-item{cursor:pointer;transition:.16s}
.ops-item:hover{transform:translateX(3px)}
.ops-top{display:flex;align-items:baseline;justify-content:space-between;font-size:13px;margin-bottom:6px}
.ops-name{font-weight:600;color:var(--text)}
.ops-num{font-size:12px;color:var(--text-3)}
.ops-num b{font-size:13.5px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}
.ops-num i{font-style:normal;margin-left:7px;font-weight:700;color:var(--brand-3)}
.ops-bar{height:7px;border-radius:6px;background:#EEF3F1;overflow:hidden}
.ops-bar i{display:block;height:100%;border-radius:6px;transition:width .5s ease}

/* ---------------- 环形图 + 图例 ---------------- */
.donut-wrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.donut-legend{flex:1;min-width:150px;display:flex;flex-direction:column;gap:9px;font-size:12.5px;color:var(--text-2)}
.donut-legend .li{display:flex;align-items:center;gap:8px}
.donut-legend .li b{margin-left:auto;color:var(--text);font-variant-numeric:tabular-nums}
.donut-legend .li em{font-style:normal;width:48px;text-align:right;color:var(--text-3)}

/* ---------------- 三列模块 ---------------- */
.dash-grid,.charts{margin-bottom:16px}
.dash-grid-3{display:grid;grid-template-columns:1fr 1fr 1.14fr;gap:16px;margin-bottom:16px}
/* 栅格子项允许收缩到轨道宽度（默认 min-width:auto 会以 min-content 撑破轨道，导致内容区横向溢出） */
.kpis > *,.charts > *,.dash-grid > *,.dash-grid-3 > *,.quick-row > *,
.settings-grid > *,.detail-grid > *,.push-stats > *,.disc-grid > *,.ppt-grid > *,
.splash-grid > *,.ver-detail > *{min-width:0}
.rank-row,.task-row,.dist-row,.feed-txt,.kv-row,.bar-label,.cell-user span{overflow-wrap:anywhere}
@media (max-width:1560px){.dash-grid-3{grid-template-columns:1fr 1fr}}
@media (max-width:1180px){.dash-grid-3{grid-template-columns:1fr}}

/* ---------------- 服务健康监测 ---------------- */
.svc-list{display:flex;flex-direction:column;gap:14px}
.svc-item{display:flex;align-items:center;gap:11px}
.svc-dot{width:9px;height:9px;border-radius:50%;background:var(--ok);flex-shrink:0;box-shadow:0 0 0 3px rgba(31,169,113,.14)}
.svc-dot.warn{background:var(--warn);box-shadow:0 0 0 3px rgba(233,162,59,.16);animation:pulseWarn 1.8s infinite}
@keyframes pulseWarn{0%,100%{opacity:1}50%{opacity:.35}}
.svc-main{flex:1;min-width:0}
.svc-top{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;margin-bottom:6px}
.svc-top b{font-weight:600}
.svc-ms{color:var(--text-3);font-variant-numeric:tabular-nums}
.svc-bar{height:6px;border-radius:6px;background:#EEF3F1;overflow:hidden}
.svc-bar i{display:block;height:100%;border-radius:6px;transition:width .5s ease}

/* ---------------- 待处理事项 ---------------- */
.todo-list{display:flex;flex-direction:column;gap:5px}
.todo-item{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;cursor:pointer;transition:.16s}
.todo-item:hover{background:#F4F9F6;transform:translateX(2px)}
.todo-n{width:30px;height:30px;border-radius:10px;background:var(--brand-soft);color:var(--brand-3);
  font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.todo-main{flex:1;min-width:0}
.todo-main b{display:block;font-size:13px;font-weight:600}
.todo-main span{font-size:11.5px;color:var(--text-3)}
.todo-arrow{font-style:normal;font-size:16px;color:var(--text-3)}

/* ---------------- 实时动态 ---------------- */
.card-title .live-dot{margin-left:auto}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--ok);animation:livePulse 1.7s infinite}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(31,169,113,.45)}70%{box-shadow:0 0 0 9px rgba(31,169,113,0)}100%{box-shadow:0 0 0 0 rgba(31,169,113,0)}}
.feed-list{display:flex;flex-direction:column;max-height:238px;overflow:auto}
.feed-item{display:flex;gap:10px;padding:8px 6px;border-bottom:1px dashed var(--border)}
.feed-item:last-child{border-bottom:none}
.feed-dot{width:7px;height:7px;border-radius:50%;margin-top:6px;flex-shrink:0;background:var(--brand)}
.feed-dot.warn{background:var(--warn)}
.feed-dot.brand{background:var(--blue)}
.feed-main{flex:1;min-width:0}
.feed-txt{display:block;font-size:12.5px;line-height:1.5;color:var(--text-2)}
.feed-time{font-size:11px;color:var(--text-3);font-variant-numeric:tabular-nums}
.feed-item.fresh{animation:feedIn .55s ease}
@keyframes feedIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}

/* ---------------- 最近注册用户 ---------------- */
.dash-table{margin-bottom:24px}

/* ---------------- 背景切换面板 ---------------- */
.bg-picker{position:fixed;right:30px;top:152px;width:388px;z-index:60;padding:18px;border-radius:20px;
  background:rgba(255,255,255,.98);border:1px solid var(--border);box-shadow:var(--shadow-lg);
  opacity:0;visibility:hidden;transform:translateY(-12px) scale(.97);transition:.22s ease}
.bg-picker.open{opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto}
.bg-picker-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:14px}
.bg-picker-head h4{font-size:15px;font-weight:800}
.bg-picker-head .sub{font-size:11.5px;color:var(--text-3)}
.bg-picker-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.bg-thumb{position:relative;padding:8px;border:1.5px solid var(--border);border-radius:14px;background:#fff;
  cursor:pointer;text-align:left;transition:.18s}
.bg-thumb:hover{border-color:var(--brand-2);transform:translateY(-2px);box-shadow:0 10px 22px rgba(31,42,40,.1)}
.bg-thumb.active{border-color:var(--brand);box-shadow:0 8px 20px rgba(46,184,138,.18)}
.bt-art{position:relative;display:block;height:60px;border-radius:10px;overflow:hidden}
.bt-dot{position:absolute;right:8px;bottom:6px;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.88);
  box-shadow:0 3px 8px rgba(0,0,0,.16)}
.bt-forest{background:linear-gradient(160deg,#E7F8EE 0%,#CDEEDD 56%,#A8DDBC 100%)}
.bt-stardust{background:linear-gradient(160deg,#5B4B9E 0%,#7A5CD6 58%,#3B2A6B 100%)}
.bt-nebula{background:linear-gradient(160deg,#123063 0%,#0B1B3A 58%,#081227 100%)}
.bt-sakura{background:linear-gradient(160deg,#FFF1F5 0%,#FFDCE9 58%,#F7BCCE 100%)}
.bt-sunset{background:linear-gradient(160deg,#FFF3DE 0%,#FFDCA8 58%,#FFB98C 100%)}
.bt-name{display:block;margin-top:7px;font-size:12.5px;font-weight:700}
.bt-desc{display:block;margin-top:2px;font-size:11px;color:var(--text-3)}
.bt-check{position:absolute;right:12px;top:12px;width:20px;height:20px;border-radius:50%;background:var(--brand);
  color:#fff;font-size:12px;font-style:normal;display:none;align-items:center;justify-content:center;
  box-shadow:0 3px 8px rgba(46,184,138,.35)}
.bg-thumb.active .bt-check{display:flex}
.bg-picker-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;
  padding-top:12px;border-top:1px solid var(--border)}
.bg-picker-foot .hint{font-size:12px;color:var(--text-3)}
.bg-picker-foot .hint b{color:var(--brand-3)}

/* ---------------- 按钮加载态 ---------------- */
.btn.loading{opacity:.72;pointer-events:none}
.btn.loading svg{animation:btnSpin .8s linear infinite}
@keyframes btnSpin{to{transform:rotate(360deg)}}

/* ============================================================
   登录页 V3 增强 · 二次元漫画风高保真 + 高级动效
   ============================================================ */

/* ---------------- 场景动效 ---------------- */
.v3-rays{animation:raysBreath 7.5s ease-in-out infinite}
@keyframes raysBreath{0%,100%{opacity:.62}50%{opacity:1}}

.v3-rainbow{animation:rainbowShift 12s ease-in-out infinite}
@keyframes rainbowShift{0%,100%{opacity:.22}50%{opacity:.38}}

.cloud-drift-1{animation:cloudDriftA 26s ease-in-out infinite alternate}
.cloud-drift-2{animation:cloudDriftB 34s ease-in-out infinite alternate}
.cloud-drift-3{animation:cloudDriftA 44s ease-in-out infinite alternate-reverse}
@keyframes cloudDriftA{from{transform:translateX(-26px)}to{transform:translateX(32px)}}
@keyframes cloudDriftB{from{transform:translateX(26px)}to{transform:translateX(-32px)}}

.bird-a{animation:birdFly 17s ease-in-out infinite}
.bird-b{animation:birdFly 21s ease-in-out infinite reverse}
.bird-c{animation:birdFly 25s ease-in-out infinite}
@keyframes birdFly{
  0%{transform:translate(0,0)}
  35%{transform:translate(52px,-16px)}
  70%{transform:translate(112px,6px)}
  100%{transform:translate(0,0)}
}

.tw-1{animation:twinkle 3.2s ease-in-out infinite}
.tw-2{animation:twinkle 4.1s ease-in-out infinite .5s}
.tw-3{animation:twinkle 3.7s ease-in-out infinite 1.1s}
.tw-4{animation:twinkle 4.6s ease-in-out infinite .8s}
.tw-5{animation:twinkle 3.4s ease-in-out infinite 1.6s}
.tw-6{animation:twinkle 4.3s ease-in-out infinite .3s}
@keyframes twinkle{0%,100%{opacity:.18;transform:scale(.82)}50%{opacity:.85;transform:scale(1.18)}}

/* ---------------- 樱花 / 光粒飘落层 ---------------- */
.scene-petals{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3}
.petal{position:absolute;top:-8%;border-radius:60% 0 60% 0;opacity:.92;
  background:linear-gradient(135deg,#FFD3E2,#FFA6C6);animation-name:petalFall;animation-timing-function:linear;
  animation-iteration-count:infinite;box-shadow:0 2px 6px rgba(255,150,185,.25)}
.petal.p2{background:linear-gradient(135deg,#EAF5FF,#BCE0FF);box-shadow:0 2px 6px rgba(120,180,240,.22)}
.petal.p3{background:linear-gradient(135deg,#FFF6D8,#FFE49C);box-shadow:0 2px 6px rgba(240,200,110,.22)}
@keyframes petalFall{
  0%{transform:translate3d(0,0,0) rotate(0deg)}
  25%{transform:translate3d(34px,26vh,0) rotate(120deg)}
  50%{transform:translate3d(-20px,52vh,0) rotate(230deg)}
  75%{transform:translate3d(40px,78vh,0) rotate(340deg)}
  100%{transform:translate3d(0,106vh,0) rotate(460deg)}
}

/* ---------------- 云端状态浮标 ---------------- */
.scene-status{position:absolute;left:34px;bottom:28px;z-index:6;display:inline-flex;align-items:center;gap:9px;
  padding:9px 17px;border-radius:999px;font-size:12.5px;color:#2C4A41;
  background:rgba(255,255,255,.74);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.92);box-shadow:0 12px 28px rgba(31,74,59,.14)}
.scene-status b{font-weight:800;color:#1F6B55}
.st-dot{width:8px;height:8px;border-radius:50%;background:#2EB88A;
  box-shadow:0 0 0 0 rgba(46,184,138,.5);animation:stPulse 1.8s infinite}
@keyframes stPulse{0%{box-shadow:0 0 0 0 rgba(46,184,138,.5)}70%{box-shadow:0 0 0 9px rgba(46,184,138,0)}100%{box-shadow:0 0 0 0 rgba(46,184,138,0)}}

/* ---------------- 登录卡：渐变描边 + 扫光 ---------------- */
.login-card{position:relative;overflow:hidden}
.login-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.6px;pointer-events:none;z-index:2;
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(46,184,138,.42) 38%,rgba(63,169,224,.38) 68%,rgba(255,255,255,.95));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude}
.login-card::after{content:"";position:absolute;top:-45%;left:-70%;width:55%;height:190%;pointer-events:none;z-index:1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);
  transform:rotate(12deg);animation:cardSheen 8s ease-in-out infinite}
@keyframes cardSheen{0%{left:-70%}52%{left:132%}100%{left:132%}}

.btn-login{position:relative;overflow:hidden}
.btn-login::after{content:"";position:absolute;top:0;left:-130%;width:58%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);animation:btnSheen 3.8s ease-in-out infinite}
@keyframes btnSheen{0%{left:-130%}46%{left:132%}100%{left:132%}}

/* ---------------- 输入聚焦光晕 ---------------- */
.login-field .input{transition:border-color .18s ease,box-shadow .22s ease}
.login-field .input:focus{border-color:#5BC8C0;box-shadow:0 0 0 4px rgba(46,184,138,.14),0 8px 20px rgba(46,184,138,.12)}

/* ---------------- 吉祥物 ---------------- */
.scene-mascot{filter:drop-shadow(0 28px 42px rgba(24,72,58,.26))}
.card-mascot{filter:drop-shadow(0 14px 22px rgba(24,72,58,.18))}

/* ---------------- 响应式 ---------------- */
@media (max-width:1280px){.scene-status{left:20px;bottom:18px}}
@media (max-width:900px){.scene-status{display:none}.v3-rainbow{display:none}}

/* ---------------- 登录页 V3 追加：霞光 / 星芒 / 流星 ---------------- */
.v3-aurora{animation:auroraShift 14s ease-in-out infinite alternate}
@keyframes auroraShift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-20px,12px,0)}}
.v3-sparkle .spk{transform-box:fill-box;transform-origin:center;animation:spkPulse 2.8s ease-in-out infinite}
.v3-sparkle .s2{animation-delay:.8s}
.v3-sparkle .s3{animation-delay:1.6s}
@keyframes spkPulse{0%,100%{opacity:.2;transform:scale(.6) rotate(0deg)}50%{opacity:1;transform:scale(1.15) rotate(45deg)}}
.v3-shooting .sh-1,.v3-shooting .sh-2{opacity:0;animation:shoot 6s ease-in-out infinite}
.v3-shooting .sh-2{animation-delay:3s}
@keyframes shoot{0%{opacity:0}10%{opacity:.85}22%{opacity:0}100%{opacity:0}}

/* ---------------- 看板页头吉祥物（安小筑） ---------------- */
#view-dashboard .page-head{padding-right:130px;min-height:104px}
#view-dashboard .dash-inner > .ph-mascot{position:absolute;right:22px;top:1px;display:flex;align-items:flex-end;gap:8px;pointer-events:none;z-index:6}
.ph-mascot img{height:96px;width:auto;filter:drop-shadow(0 14px 22px rgba(24,72,58,.20));animation:mascotFloat 6.4s ease-in-out infinite}
.ph-bubble{position:relative;margin-bottom:26px;background:#fff;border:1px solid var(--border);border-radius:14px;
  padding:7px 12px;font-size:12.5px;color:var(--text-2);box-shadow:0 8px 18px rgba(31,74,59,.08);white-space:nowrap}
.ph-bubble::after{content:"";position:absolute;right:-6px;bottom:11px;width:10px;height:10px;background:#fff;
  border-right:1px solid var(--border);border-bottom:1px solid var(--border);transform:rotate(-45deg)}
@media (max-width:1440px){#view-dashboard .page-head{padding-right:170px;min-height:92px}.ph-mascot img{height:88px}.ph-bubble{display:none}}

/* ---------------- 背景皮肤选择器（内嵌卡片版） ---------------- */
#view-dashboard .dash-inner > .bg-picker{position:relative!important;right:auto;top:auto;left:auto;width:auto;
  opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto;
  margin:0 0 20px;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.93);
  border:1px solid var(--border);box-shadow:0 14px 32px rgba(24,72,58,.09);
  display:flex;align-items:center;gap:18px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
#view-dashboard .dash-inner > .bg-picker .bg-picker-head{flex-direction:column;align-items:flex-start;margin:0;min-width:158px;gap:4px}
#view-dashboard .dash-inner > .bg-picker .bg-picker-grid{flex:1;grid-template-columns:repeat(5,1fr);gap:12px}
#view-dashboard .dash-inner > .bg-picker .bg-thumb{padding:7px}
#view-dashboard .dash-inner > .bg-picker .bt-art{height:52px}
#view-dashboard .dash-inner > .bg-picker .bg-picker-foot{flex-direction:column;align-items:flex-end;margin:0;padding:0;border-top:0;gap:8px}
#view-dashboard .dash-inner > .bg-picker .bg-picker-foot .hint{text-align:right;line-height:1.5}

/* ================= 登录页 · 二次元幻想场景 v2 ================= */
.login-scene{pointer-events:none}
.login-scene .ls-art{position:absolute;inset:0;width:100%;height:100%;display:block;will-change:transform}
.login-scene .ls-aurora{position:absolute;left:-10%;right:-10%;top:-12%;height:72%;
  background:radial-gradient(58% 58% at 22% 18%,rgba(122,90,240,.42),transparent 70%),
             radial-gradient(50% 50% at 78% 10%,rgba(90,200,255,.30),transparent 72%),
             radial-gradient(46% 46% at 52% 4%,rgba(255,150,215,.26),transparent 74%);
  filter:blur(10px);animation:lsAurora 15s ease-in-out infinite alternate}
@keyframes lsAurora{from{transform:translate3d(-1.6%,0,0) scale(1)}to{transform:translate3d(1.6%,2.4%,0) scale(1.06)}}
.login-scene .ls-mascot{position:absolute;left:5.4%;bottom:3%;height:min(35vh,332px);width:auto;z-index:5;
  filter:drop-shadow(0 26px 40px rgba(38,20,90,.5));animation:lsFloat 7.6s ease-in-out infinite}
@keyframes lsFloat{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-16px) rotate(1.2deg)}}
.login-scene .ls-mascot-halo{position:absolute;left:0;bottom:0;width:min(44vh,420px);height:min(30vh,300px);z-index:4;
  background:radial-gradient(50% 60% at 50% 72%,rgba(255,240,255,.62),transparent 72%);filter:blur(8px);
  animation:lsPulse 5.6s ease-in-out infinite}
@keyframes lsPulse{0%,100%{opacity:.5;transform:scale(.96)}50%{opacity:.95;transform:scale(1.05)}}
.login-scene .ls-cloud{transform-box:fill-box;transform-origin:center;animation:lsDrift 96s linear infinite}
.login-scene .ls-cloud-c2{animation-duration:70s;animation-delay:-24s}
.login-scene .ls-cloud-c3{animation-duration:126s;animation-delay:-52s}
@keyframes lsDrift{from{transform:translateX(-7%)}to{transform:translateX(7%)}}
.login-scene .ls-planet{transform-box:fill-box;transform-origin:center;animation:lsBob 13s ease-in-out infinite}
@keyframes lsBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.login-scene .ls-ring{transform-box:fill-box;transform-origin:center;animation:lsSpin 28s linear infinite}
@keyframes lsSpin{from{transform:rotate(-16deg)}to{transform:rotate(344deg)}}
.login-scene .ls-twinkle{animation:lsTwinkle 3.8s ease-in-out infinite}
@keyframes lsTwinkle{0%,100%{opacity:.22}50%{opacity:1}}
.login-scene .ls-comet{animation:lsComet 10s linear infinite}
@keyframes lsComet{0%{transform:translate(0,0);opacity:0}6%{opacity:.95}26%{opacity:0}100%{transform:translate(-380px,260px);opacity:0}}
.login-scene .ls-orb-mascot{transform-box:fill-box;transform-origin:center bottom;animation:lsOrbFloat 6.6s ease-in-out infinite}
@keyframes lsOrbFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(2deg)}}
.login-scene .ls-rays{transform-box:fill-box;transform-origin:top center;animation:lsRays 13s ease-in-out infinite alternate}
@keyframes lsRays{from{opacity:.34;transform:skewX(-2.4deg)}to{opacity:.6;transform:skewX(3deg)}}
@media (max-width:1180px){.login-scene .ls-mascot{height:26vh;left:4%;bottom:2%}}

/* ---------------- 安小筑 · 看板今日播报卡 ---------------- */
.mascot-brief{display:flex;align-items:center;gap:16px;margin:0 0 20px;padding:14px 18px;
  border-radius:20px;border:1px solid rgba(255,255,255,.9);position:relative;overflow:hidden;
  background:linear-gradient(120deg,rgba(255,246,255,.94),rgba(238,248,255,.9));
  box-shadow:0 14px 30px rgba(24,72,58,.08);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mascot-brief::after{content:"";position:absolute;right:-40px;top:-60px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,214,246,.55),rgba(255,214,246,0) 70%);pointer-events:none}
.mb-avatar{width:62px;height:62px;border-radius:18px;flex:none;display:grid;place-items:center;
  background:linear-gradient(140deg,#FFE9F7,#E6F3FF);border:1px solid #fff;box-shadow:0 8px 18px rgba(24,72,58,.1)}
.mb-avatar img{width:52px;height:52px;object-fit:contain;animation:mascotFloat 5.8s ease-in-out infinite}
.mb-body{flex:1;min-width:0}
.mb-title{font-size:13.5px;font-weight:800;color:#1F5C4A;letter-spacing:.3px;margin-bottom:4px}
.mb-text{font-size:12.5px;color:#4E6E64;line-height:1.65}
.mb-text b{color:#0E9F76}
.mb-btn{flex:none;border:0;cursor:pointer;padding:10px 16px;border-radius:12px;font-size:12.5px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#2EB88A,#3FA9E0);box-shadow:0 10px 20px rgba(46,184,138,.28);
  transition:transform .18s ease,box-shadow .18s ease}
.mb-btn:hover{transform:translateY(-2px);box-shadow:0 14px 26px rgba(46,184,138,.34)}
@media (max-width:900px){.mascot-brief{flex-wrap:wrap}.mb-btn{width:100%}}

/* 看板背景安小筑：右侧留出露出带 + 每套皮肤独立站位与光晕（确保明显可见且不遮挡前景） */
@media (min-width:1441px){
  #view-dashboard .dash-inner{padding-right:clamp(104px, 9.5vw, 214px)}
}
@media (min-width:1561px){
  #view-dashboard .dash-inner{padding-right:clamp(160px, 11.5vw, 250px)}
}
#view-dashboard .dash-mascot-spot{position:absolute;right:-4%;bottom:-8%;width:min(34vw,560px);height:min(34vw,560px);z-index:4;
  background:radial-gradient(circle, rgba(255,255,255,.52) 0%, rgba(255,255,255,0) 68%);pointer-events:none}
#view-dashboard .dash-bg-mascot{right:1.4%!important;bottom:1.6%!important;width:min(21vw,330px)!important;opacity:1!important;
  filter:drop-shadow(0 26px 44px rgba(24,72,58,.28)) drop-shadow(0 0 30px rgba(255,236,255,.7));animation:mascotStage 8.6s ease-in-out infinite}
@keyframes mascotStage{
  0%,100%{transform:translateY(0) rotate(-1.2deg) scale(1)}
  50%{transform:translateY(-16px) rotate(1.6deg) scale(1.035)}
}
/* 各皮肤站位（沿右侧露出带纵向错落） */
#view-dashboard .dash-bg[data-bg="forest"] .dash-bg-mascot{top:auto!important;bottom:1.6%!important}
#view-dashboard .dash-bg[data-bg="stardust"] .dash-bg-mascot{top:34%!important;bottom:auto!important}
#view-dashboard .dash-bg[data-bg="nebula"] .dash-bg-mascot{top:4%!important;bottom:auto!important;width:min(19vw,300px)!important}
#view-dashboard .dash-bg[data-bg="sakura"] .dash-bg-mascot{top:auto!important;bottom:3%!important}
#view-dashboard .dash-bg[data-bg="sunset"] .dash-bg-mascot{top:26%!important;bottom:auto!important}
#view-dashboard .dash-bg[data-bg="stardust"] .dash-mascot-spot{top:26%!important;bottom:auto!important;right:-6%!important}
#view-dashboard .dash-bg[data-bg="nebula"] .dash-mascot-spot{top:-4%!important;bottom:auto!important;right:-4%!important}
#view-dashboard .dash-bg[data-bg="sakura"] .dash-mascot-spot{top:auto!important;bottom:-4%!important}
#view-dashboard .dash-bg[data-bg="sunset"] .dash-mascot-spot{top:18%!important;bottom:auto!important;right:-6%!important}
/* 各皮肤光晕色调 */
#view-dashboard .dash-bg[data-bg="forest"] .dash-bg-mascot{filter:drop-shadow(0 26px 44px rgba(24,72,58,.28)) drop-shadow(0 0 32px rgba(214,255,233,.75))}
#view-dashboard .dash-bg[data-bg="stardust"] .dash-bg-mascot{filter:drop-shadow(0 26px 44px rgba(40,42,96,.30)) drop-shadow(0 0 36px rgba(214,222,255,.8))}
#view-dashboard .dash-bg[data-bg="nebula"] .dash-bg-mascot{filter:drop-shadow(0 26px 44px rgba(12,40,80,.32)) drop-shadow(0 0 34px rgba(186,224,255,.78))}
#view-dashboard .dash-bg[data-bg="sakura"] .dash-bg-mascot{filter:drop-shadow(0 26px 44px rgba(120,60,96,.24)) drop-shadow(0 0 36px rgba(255,224,241,.85))}
#view-dashboard .dash-bg[data-bg="sunset"] .dash-bg-mascot{filter:drop-shadow(0 26px 44px rgba(120,66,30,.26)) drop-shadow(0 0 36px rgba(255,231,199,.85))}
@media (max-width:1440px){
  #view-dashboard .dash-bg-mascot{width:min(19vw,232px)!important;opacity:.96!important}
}
@media (max-width:1200px){
  #view-dashboard .dash-bg-mascot{width:min(24vw,168px)!important;right:2%!important}
}

/* ===================== 看板深化模块：分布图表 / 业务进度 / 工作流 ===================== */
.dist-body{display:flex;align-items:center;gap:16px}
.donut-hold{position:relative;flex:none;display:inline-flex;align-items:center;justify-content:center}
.donut-hole{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:96px;height:96px;border-radius:50%;
  background:rgba(255,255,255,.97);box-shadow:0 8px 18px rgba(24,72,58,.08);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1px;pointer-events:none}
.donut-hole b{font-size:17px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}
.donut-hole span{font-size:10.5px;color:var(--text-3)}
.donut-legend .li .li-n{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:116px}
.ops-sub{font-style:normal;margin-left:8px;font-size:11px;font-weight:400;color:var(--text-3)}
.task-stats{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.task-stats .ts{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-2)}
.task-stats .ts i{width:8px;height:8px;border-radius:50%;flex:none}
.task-stats .ts b{margin-left:auto;color:var(--text);font-variant-numeric:tabular-nums}
.queue-list{display:flex;flex-direction:column;gap:10px}
.queue-item{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:14px;
  background:rgba(247,251,249,.92);border:1px solid rgba(46,184,138,.12);border-left:3px solid #8FE0BE}
.queue-item.lv-high{border-left-color:#FF8A65}
.queue-item.lv-mid{border-left-color:#FFC53D}
.queue-main{flex:1;min-width:0}
.queue-t{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.queue-m{font-size:11.5px;color:var(--text-3);margin-top:4px}
.queue-m b{color:var(--brand-3)}
.queue-wait{flex:none;font-size:11.5px;line-height:1.5;color:var(--text-3);text-align:right}
.rank-list{display:flex;flex-direction:column;gap:9px}
.rank-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:13px;background:rgba(247,251,249,.9)}
.rank-no{width:22px;height:22px;border-radius:8px;flex:none;display:grid;place-items:center;font-size:11.5px;font-weight:800;color:#fff;background:#C9D6D1}
.rank-no.top1{background:linear-gradient(135deg,#FFC53D,#FF8A65)}
.rank-no.top2{background:linear-gradient(135deg,#9BD8F5,#3FA9E0)}
.rank-no.top3{background:linear-gradient(135deg,#8FE0BE,#2EB88A)}
.rank-avatar{width:30px;height:30px;border-radius:10px;flex:none;display:grid;place-items:center;font-size:12.5px;font-weight:800;color:#fff;background:linear-gradient(135deg,#2EB88A,#3FA9E0)}
.rank-main{flex:1;min-width:0}
.rank-name{font-size:12.5px;font-weight:700;color:var(--text)}
.rank-name em{font-style:normal;margin-left:6px;font-size:10.5px;font-weight:600;color:var(--text-3)}
.rank-bar{height:6px;border-radius:5px;background:#EEF3F1;margin-top:6px;overflow:hidden}
.rank-bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#2EB88A,#5BC8C0);transition:width .5s ease}
.rank-val{flex:none;font-size:13px;font-weight:800;color:var(--brand-3);white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.rank-val span{display:block;font-size:10.5px;font-weight:600;color:var(--text-3)}
.funnel{display:flex;flex-direction:column;gap:12px}
.fn-row{display:flex;align-items:center;gap:10px}
.fn-bar{height:38px;border-radius:11px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;color:#fff;
  font-size:12.5px;font-weight:700;box-shadow:0 8px 18px rgba(24,72,58,.14);transition:width .6s ease;overflow:hidden}
.fn-bar span{white-space:nowrap}
.fn-bar b{font-size:13.5px;font-variant-numeric:tabular-nums}
.fn-rate{flex:none;font-size:11.5px;color:var(--text-3);white-space:nowrap}
.log-stream{display:flex;flex-direction:column;gap:8px;max-height:244px;overflow:hidden}
.log-item{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:12px;font-size:12px;
  background:rgba(247,251,249,.9);border:1px solid rgba(46,184,138,.1);animation:logIn .38s ease}
@keyframes logIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.log-dot{width:8px;height:8px;border-radius:50%;flex:none;background:#2EB88A}
.log-item.lv-warn .log-dot{background:#FFC53D}
.log-item.lv-error .log-dot{background:#FF8A65}
.log-time{flex:none;color:var(--text-3);font-variant-numeric:tabular-nums}
.log-svc{flex:none;font-weight:700;color:var(--brand-3)}
.log-msg{flex:1;min-width:0;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.log-item.lv-error .log-svc{color:#E4703F}
@media (max-width:1200px){
  .dist-body{flex-direction:column;align-items:stretch}
  .donut-hold{align-self:center}
}


/* 新皮肤显示规则 */
.dash-bg[data-bg="seabreeze"] .bgset-seabreeze,
.dash-bg[data-bg="honey"] .bgset-honey{display:block}

/* ============================================================
   V4 追加样式：清新绿 · 天蓝 · 暖黄 高保真改造
   ① 登录页（扁平 2.5D 治愈插画 + 玻璃登录卡 + 深墨绿按钮）
   ② 区域化栏目分区 / 批量工具栏 / 操作列下拉 / 次要数据折叠
   ③ 看板背景选择器（左侧菜单 · 版本信息下方）
   ④ 账号管理板块
   ============================================================ */

/* ============ ① 登录页 V4 ============ */
body.lgn-body{margin:0;overflow-x:hidden;background:#EAF7FF;font-family:inherit}
.lgn-scene{position:fixed;inset:0;z-index:0;overflow:hidden}
.lgn-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.lgn-scene-veil{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(104deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.46) 66%,rgba(255,255,255,.16) 100%)}

/* 动效 */
@keyframes lgnFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes lgnFloatSoft{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes lgnBob{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.03)}}
@keyframes lgnDrift{0%{transform:translateX(0)}50%{transform:translateX(36px)}100%{transform:translateX(0)}}
@keyframes lgnDriftBack{0%{transform:translateX(0)}50%{transform:translateX(-28px)}100%{transform:translateX(0)}}
@keyframes lgnSway{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.8deg)}}
@keyframes lgnTwinkle{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.18)}}
@keyframes lgnBird{0%,100%{transform:translate(0,0)}50%{transform:translate(14px,-8px)}}
@keyframes lgnBlink{0%,90%,100%{transform:scaleY(1) scaleX(1)}93%{transform:scaleY(.88) scaleX(1.02)}96%{transform:scaleY(.97) scaleX(1)}}
@keyframes lgnFall{0%{transform:translateY(-12vh) rotate(0deg);opacity:0}
  8%{opacity:.92}92%{opacity:.5}100%{transform:translateY(114vh) rotate(540deg);opacity:0}}
@keyframes lgnHaloBreath{0%,100%{opacity:.55;transform:translateX(-50%) scale(1)}50%{opacity:.95;transform:translateX(-50%) scale(1.08)}}

.lgn-float-slow{animation:lgnFloat 7.6s ease-in-out infinite}
.lgn-float-mid{animation:lgnFloatSoft 5.2s ease-in-out infinite}
.lgn-bob{animation:lgnBob 3.2s ease-in-out infinite}
.lgn-drift-a{animation:lgnDrift 26s ease-in-out infinite}
.lgn-drift-b{animation:lgnDriftBack 32s ease-in-out infinite}
.lgn-drift-c{animation:lgnDrift 22s ease-in-out infinite;animation-delay:-6s}
.lgn-sway{transform-origin:50% 100%;animation:lgnSway 5.4s ease-in-out infinite}
.lgn-twinkle{animation:lgnTwinkle 3.4s ease-in-out infinite}
.lgn-bird-a{animation:lgnBird 6s ease-in-out infinite}
.lgn-bird-b{animation:lgnBird 5.2s ease-in-out infinite;animation-delay:-1.4s}
.lgn-bird-c{animation:lgnBird 6.8s ease-in-out infinite;animation-delay:-2.6s}
.lgn-blink{transform-origin:50% 78%;animation:lgnBlink 5.4s ease-in-out infinite}

/* 吉祥物 */
.lgn-mascot-zone{position:absolute;left:3.4vw;bottom:.6vh;width:min(20vw,282px);z-index:1;pointer-events:none}
.lgn-mascot-halo{position:absolute;left:50%;bottom:3%;width:132%;height:36%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.9) 0%,rgba(255,255,255,0) 70%);
  animation:lgnHaloBreath 6.6s ease-in-out infinite}
.lgn-hero-mascot{position:relative;width:100%;display:block;filter:drop-shadow(0 26px 44px rgba(20,80,60,.26))}
.lgn-pet{position:absolute;left:25.5vw;bottom:23vh;width:min(7.2vw,104px);z-index:1;pointer-events:none;
  animation-delay:-1.3s;filter:drop-shadow(0 12px 22px rgba(20,80,60,.2))}

/* 飘落叶片 */
.lgn-leaves{position:absolute;inset:0;pointer-events:none}
.lgn-leaf{position:absolute;top:-6vh;display:block;border-radius:60% 0 60% 0;
  animation-name:lgnFall;animation-timing-function:linear;animation-iteration-count:infinite}

/* 布局：左插画说明 + 右玻璃卡 */
.lgn-wrap{position:relative;z-index:2;min-height:100vh;display:flex;align-items:center;justify-content:space-between;
  gap:44px;padding:58px 6vw 58px 5vw}
.lgn-hero{max-width:540px;min-width:0}
.lgn-hero .brandline{display:flex;align-items:center;gap:12px}
.lgn-hero .brandline .mark{width:50px;height:50px;border-radius:16px;background:#fff;display:inline-flex;align-items:center;
  justify-content:center;box-shadow:0 12px 26px rgba(20,80,60,.16)}
.lgn-hero .brandline .mark img{width:38px;height:38px;object-fit:contain}
.lgn-hero .brandline h1{margin:0;font-size:23px;font-weight:800;letter-spacing:2px;color:#14523E}
.lgn-hero .brandline span{font-size:10px;letter-spacing:2.6px;color:#5C8C7B;font-weight:700}
.lgn-hero .hero-title{margin:26px 0 14px;font-size:44px;line-height:1.24;font-weight:800;color:#17503C;letter-spacing:.5px}
.lgn-hero .hero-title em{font-style:normal;color:#17A06E;position:relative}
.lgn-hero .hero-title em::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:9px;border-radius:5px;
  background:rgba(255,209,102,.66);z-index:-1}
.lgn-hero .hero-desc{margin:0;font-size:14px;line-height:1.9;color:#386B5A;max-width:470px}
.lgn-hero .hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.lgn-hero .chip{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;font-size:12.5px;
  font-weight:700;color:#14523E;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.95);
  box-shadow:0 8px 20px rgba(20,80,60,.1)}
.lgn-hero .chip i{width:8px;height:8px;border-radius:50%;background:#2EB88A;display:block}
.lgn-hero .chip.b i{background:#3FA9E0}
.lgn-hero .chip.c i{background:#FFC53D}
.lgn-hero .hero-tips{display:flex;align-items:center;gap:10px;margin-top:26px;padding:12px 16px;border-radius:16px;
  background:rgba(255,255,255,.78);border:1px dashed rgba(46,184,138,.5);max-width:470px}
.lgn-hero .hero-tips img{width:40px;height:40px;object-fit:contain;animation:lgnFloatSoft 5.6s ease-in-out infinite}
.lgn-hero .hero-tips span{font-size:12.5px;line-height:1.7;color:#3B6B5A}

/* 玻璃拟态登录卡 */
.lgn-card{position:relative;width:432px;flex:none;padding:44px 38px 30px;border-radius:26px;
  background:rgba(255,255,255,.74);backdrop-filter:blur(26px) saturate(170%);-webkit-backdrop-filter:blur(26px) saturate(170%);
  border:1px solid rgba(255,255,255,.94);
  box-shadow:0 32px 84px rgba(16,72,54,.2),0 6px 18px rgba(16,72,54,.07)}
.lgn-card::before{content:"";position:absolute;inset:0;border-radius:26px;pointer-events:none;
  background:linear-gradient(150deg,rgba(255,255,255,.7),rgba(255,255,255,0) 46%)}
.lgn-card-mascot{position:absolute;top:-64px;left:-28px;width:112px;height:112px;object-fit:contain;
  filter:drop-shadow(0 16px 24px rgba(16,72,54,.22))}
.lgn-card h2{position:relative;margin:0 0 6px;font-size:26px;font-weight:800;color:#14523E;letter-spacing:1px}
.lgn-card .welcome{position:relative;margin:0 0 24px;font-size:12.5px;color:#5C8C7B;line-height:1.7}
.lgn-field{position:relative;margin-bottom:15px}
.lgn-field > label{display:block;margin-bottom:7px;font-size:12.5px;font-weight:700;color:#3B6155;letter-spacing:.4px}
.lgn-field .input{width:100%;height:48px;box-sizing:border-box;border:none;border-radius:13px;padding:0 16px;font-size:14px;
  background:rgba(240,249,245,.95);color:#173B2F;transition:.18s;box-shadow:inset 0 0 0 1px rgba(46,184,138,.14)}
.lgn-field .input::placeholder{color:#95B3A8}
.lgn-field .input:focus{outline:none;background:#fff;box-shadow:inset 0 0 0 1.6px rgba(46,184,138,.72),0 6px 16px rgba(46,184,138,.14)}
.lgn-code{display:flex;gap:10px}
.lgn-code .input{flex:1;min-width:0}
.lgn-code-box{width:112px;height:48px;flex:none;border-radius:13px;background:rgba(240,249,245,.95);display:flex;
  align-items:center;justify-content:center;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(46,184,138,.14)}
.lgn-code-box img{height:34px;display:block}
.lgn-options{position:relative;display:flex;align-items:center;justify-content:space-between;margin:4px 0 20px;font-size:12.5px}
.lgn-options .ck{display:inline-flex;align-items:center;gap:7px;color:#3B6155;font-weight:600;cursor:pointer}
.lgn-options .ck input{accent-color:#17A06E;width:15px;height:15px}
.lgn-options a{color:#17A06E;text-decoration:none;font-weight:700}
.lgn-options a:hover{text-decoration:underline}
.lgn-btn{position:relative;width:100%;height:52px;border:none;border-radius:14px;cursor:pointer;color:#fff;font-size:16px;
  font-weight:800;letter-spacing:5px;padding-left:5px;
  background:linear-gradient(135deg,#0E6247 0%,#157A58 58%,#1E8E67 100%);
  box-shadow:0 16px 32px rgba(14,98,71,.32);transition:.2s}
.lgn-btn:hover{transform:translateY(-2px);box-shadow:0 22px 40px rgba(14,98,71,.4)}
.lgn-btn:active{transform:translateY(0)}
.lgn-note{position:relative;display:flex;align-items:flex-start;gap:8px;margin-top:18px;padding:11px 13px;border-radius:13px;
  background:rgba(255,246,222,.9);border:1px solid rgba(255,209,102,.62)}
.lgn-note img{width:32px;height:32px;object-fit:contain;flex:none;animation:lgnFloatSoft 4.4s ease-in-out infinite}
.lgn-note span{font-size:11.5px;line-height:1.65;color:#7A5A17}
.lgn-foot{position:relative;margin:16px 0 0;text-align:center;font-size:11px;color:#7FA396}

@media (max-width:1180px){
  .lgn-hero .hero-title{font-size:36px}
  .lgn-pet{display:none}
}
@media (max-width:960px){
  .lgn-wrap{flex-direction:column;justify-content:center;gap:28px;padding:44px 7vw}
  .lgn-mascot-zone{width:min(40vw,190px);left:auto;right:4vw}
  .lgn-hero{max-width:none;text-align:center}
  .lgn-hero .brandline,.lgn-hero .hero-badges,.lgn-hero .hero-tips{justify-content:center}
  .lgn-hero .hero-title{font-size:30px}
  .lgn-card{width:100%;max-width:432px}
}

/* ============ ③ 看板背景选择器：左侧菜单 · 版本信息下方 ============ */
.side-theme{margin-top:12px;padding:12px;border-radius:16px;
  background:linear-gradient(152deg,#EAFBF2 0%,#EAF5FD 58%,#FFF7E4 100%);
  border:1px solid #E1F1E9;box-shadow:0 10px 24px rgba(31,42,40,.06)}
.st-head{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.st-mascot{width:40px;height:40px;object-fit:contain;flex:none;animation:lgnFloatSoft 5s ease-in-out infinite;
  filter:drop-shadow(0 8px 14px rgba(20,80,60,.2))}
.st-title b{display:block;font-size:12.5px;font-weight:800;color:#1E6B53;letter-spacing:.3px}
.st-title span{font-size:10.5px;color:#7C968C}
.st-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.st-grid .bg-thumb{display:flex;flex-direction:column;gap:5px;padding:6px;border:1.6px solid transparent;border-radius:12px;
  background:rgba(255,255,255,.78);cursor:pointer;text-align:left;transition:.18s}
.st-grid .bg-thumb:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(31,42,40,.12)}
.st-grid .bg-thumb.active{border-color:var(--brand);background:#fff;box-shadow:0 10px 20px rgba(46,184,138,.2)}
.st-grid .bt-art{height:34px;border-radius:9px}
.st-grid .bt-dot{width:12px;height:12px;right:5px;bottom:4px}
.st-grid .bt-name{margin-top:1px;font-size:11.5px;font-weight:700;color:#2B4A41;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.st-grid .bt-desc{display:none}
.st-grid .bt-check{right:5px;top:5px;width:17px;height:17px;font-size:11px}
.st-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:9px;
  border-top:1px dashed rgba(46,184,138,.34);font-size:10.5px;color:#7C968C}
.st-foot b{color:#1E6B53;font-weight:800}
.bt-seabreeze{background:linear-gradient(160deg,#DCF0FF 0%,#AEDCF7 58%,#7CC6EE 100%)}
.bt-honey{background:linear-gradient(160deg,#FFF8E4 0%,#FFE7A8 58%,#FFD166 100%)}
#view-dashboard .dash-bg[data-bg="seabreeze"] .dash-bg-mascot{top:auto!important;bottom:2.4%!important;
  filter:drop-shadow(0 26px 44px rgba(20,64,96,.26)) drop-shadow(0 0 34px rgba(214,244,255,.85))}
#view-dashboard .dash-bg[data-bg="seabreeze"] .dash-mascot-spot{top:auto!important;bottom:-6%!important;right:-5%!important}
#view-dashboard .dash-bg[data-bg="honey"] .dash-bg-mascot{top:28%!important;bottom:auto!important;
  filter:drop-shadow(0 26px 44px rgba(120,84,20,.24)) drop-shadow(0 0 34px rgba(255,243,206,.9))}
#view-dashboard .dash-bg[data-bg="honey"] .dash-mascot-spot{top:20%!important;bottom:auto!important;right:-6%!important}

/* ============ ② 区域化栏目分区 · B 端列表规则 ============ */
.zone{margin-bottom:22px}
.zone:last-child{margin-bottom:0}
.zone-head{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding-left:11px;position:relative;flex-wrap:wrap}
.zone-head::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:16px;
  border-radius:3px;background:linear-gradient(180deg,var(--brand),var(--blue))}
.zone-head h3{margin:0;font-size:14.5px;font-weight:800;color:var(--text);white-space:nowrap}
.zone-sub{font-size:11.5px;color:var(--text-3)}
.zone-head .zone-right{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.zone-foot-note,.page-foot-note{margin:14px 0 0;padding:11px 14px;border-radius:12px;font-size:11.8px;line-height:1.75;
  color:#5A7A6E;background:rgba(46,184,138,.07);border:1px dashed rgba(46,184,138,.32)}
.page-foot-note{margin-top:18px}
.page-foot-note b{color:var(--brand-3)}

/* 批量选择工具栏（图3：与勾选区联动） */
.batch-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:11px 16px;border-radius:14px;
  background:#fff;border:1px dashed var(--border);transition:.2s}
.batch-bar[data-empty="false"]{background:linear-gradient(96deg,rgba(46,184,138,.14),rgba(63,169,224,.12));
  border:1px solid rgba(46,184,138,.5);box-shadow:0 8px 20px rgba(46,184,138,.12)}
.batch-bar .bb-count{font-size:13px;font-weight:800;color:var(--text-2);font-variant-numeric:tabular-nums}
.batch-bar[data-empty="false"] .bb-count{color:var(--brand-3)}
.batch-bar .bb-count b{font-size:15px}
.batch-bar .bb-hint{font-size:11.8px;color:var(--text-3)}
.batch-bar .bb-actions{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.batch-bar .btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}

/* 表格紧凑化 / 次要列折叠 / 行内操作 */
.table-wrap{overflow-x:auto}
.tbl.cmp th,.tbl.cmp td{padding-top:11px;padding-bottom:11px}
.tbl.cmp tbody tr{transition:background .16s}
.tbl.cmp tbody tr:hover{background:#F4FBF7}
.tbl.cmp tbody tr.row-on{background:rgba(46,184,138,.09)}
.tbl.cmp .col-ck{width:40px;text-align:center}
.tbl.cmp .col-ck input{width:15px;height:15px;accent-color:#17A06E;cursor:pointer}
.tbl.cmp.hide-ext .col-fold{display:none}
.tbl.cmp th.op-col,.tbl.cmp td.op-col{width:1%;white-space:nowrap;text-align:right}
.tbl.cmp td.op-col .op{justify-content:flex-end}
.tbl.cmp td.q-main{font-weight:700;color:var(--text)}
.tbl.cmp td.q-sub{font-size:11.5px;color:var(--text-3);font-weight:400}
.cell-stack{display:flex;flex-direction:column;gap:2px;line-height:1.35}

/* 低频操作收进下拉（图4） */
.op-more{position:relative;display:inline-flex}
.op-more > .btn{height:28px;padding:0 10px;font-size:12.5px}
.op-menu{position:absolute;right:0;top:32px;min-width:152px;padding:6px;border-radius:12px;background:#fff;
  border:1px solid var(--border);box-shadow:0 16px 34px rgba(24,72,58,.16);z-index:40;display:none;text-align:left}
.op-menu.open{display:block;animation:opIn .16s ease}
@keyframes opIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.op-menu button{display:block;width:100%;border:none;background:none;text-align:left;padding:8px 10px;border-radius:9px;
  font-size:12.5px;color:var(--text-2);cursor:pointer;font-family:inherit}
.op-menu button:hover{background:rgba(46,184,138,.12);color:var(--brand-3)}
.op-menu button.danger{color:#D64545}
.op-menu button.danger:hover{background:rgba(214,69,69,.1);color:#B93030}
.op-menu .sep{height:1px;margin:5px 3px;background:var(--border)}

/* 危险操作确认弹窗（图5：对象清楚 · 后果明确） */
.cf-object{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:13px;font-size:13.5px;font-weight:700;
  color:#14523E;background:rgba(46,184,138,.1);border:1px solid rgba(46,184,138,.34);word-break:break-all}
.cf-object.danger{color:#A82F2F;background:rgba(214,69,69,.09);border-color:rgba(214,69,69,.32)}
.cf-desc{margin-top:12px;font-size:12.5px;line-height:1.8;color:var(--text-2)}
.cf-list{margin:10px 0 0;padding-left:18px;font-size:12.2px;line-height:1.9;color:var(--text-3)}
.cf-list li::marker{color:#D64545}
.btn-danger-solid{background:linear-gradient(135deg,#D64545,#B93030);color:#fff;border:none}
.btn-danger-solid:hover{box-shadow:0 10px 22px rgba(214,69,69,.32)}
.btn-warn-solid{background:linear-gradient(135deg,#F0A420,#DD8A0B);color:#fff;border:none}
.btn-ghost{background:#fff;color:var(--text-2)}

/* 卡片标题防裁切修复（业务进度概览等） */
.card-title{flex-wrap:wrap;row-gap:7px;align-items:center}
.card-title h3{white-space:nowrap;min-width:0;display:inline-flex;align-items:center;gap:8px}
.card-title h3 .sub{margin-left:0;white-space:nowrap}
.card-title > .link,.card-title > .tag,.card-title > .live-dot{flex:none}
.card-title > .link{margin-left:auto}
@media (max-width:1360px){
  .card-title h3{font-size:14.5px;letter-spacing:0}
  .card-title h3 .sub{font-size:11px}
}

/* ============ ④ 账号管理 ============ */
.acc-user{display:flex;align-items:center;gap:10px}
.acc-avatar{width:34px;height:34px;flex:none;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--brand),var(--blue))}
.acc-user .nm{font-weight:700;color:var(--text)}
.acc-user .id{font-size:11px;color:var(--text-3);font-variant-numeric:tabular-nums}
.tag-limit{color:#8A5B00;background:rgba(255,197,61,.2);border:1px solid rgba(255,197,61,.6)}
.tag-ban{color:#A82F2F;background:rgba(214,69,69,.12);border:1px solid rgba(214,69,69,.4)}
.acc-rate-line{font-size:11.5px;color:var(--text-3);font-variant-numeric:tabular-nums}
.rate-panel{display:flex;flex-direction:column;gap:14px}
.rate-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rate-row > label{width:96px;flex:none;font-size:12.5px;font-weight:700;color:#3B6155}
.rate-row .input{width:132px;height:42px}
.rate-tip{font-size:11.5px;color:var(--text-3);line-height:1.7;padding:10px 12px;border-radius:11px;
  background:rgba(63,169,224,.08);border:1px dashed rgba(63,169,224,.36)}
.switch{position:relative;display:inline-flex;align-items:center;gap:9px;cursor:pointer;font-size:12.5px;font-weight:700;color:#3B6155}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch .track{width:44px;height:25px;border-radius:999px;background:#CDDCD5;position:relative;transition:.2s;flex:none}
.switch .track::after{content:"";position:absolute;left:3px;top:3px;width:19px;height:19px;border-radius:50%;background:#fff;
  box-shadow:0 2px 6px rgba(0,0,0,.18);transition:.2s}
.switch input:checked + .track{background:linear-gradient(135deg,#2EB88A,#3FA9E0)}
.switch input:checked + .track::after{transform:translateX(19px)}
.ban-chips{display:flex;gap:8px;flex-wrap:wrap}
.ban-chips .chip-sel{padding:8px 14px;border-radius:11px;font-size:12.5px;font-weight:700;color:#3B6155;cursor:pointer;
  background:#F2F8F5;border:1.5px solid transparent;transition:.16s}
.ban-chips .chip-sel.active{color:#14523E;background:#fff;border-color:var(--brand);box-shadow:0 6px 16px rgba(46,184,138,.18)}
.acc-empty{padding:34px 0;text-align:center;font-size:12.5px;color:var(--text-3)}

/* ============================================================
   ⑨ 移动端适配（主断点 ≤768px / 小屏 ≤480px）
   仅作覆盖，不改动桌面端与平板端既有规则
   ============================================================ */

/* ---- 抽屉触发器与遮罩：默认隐藏，仅手机断点启用 ---- */
.nav-toggle{
  display:none;align-items:center;justify-content:center;
  width:40px;height:40px;flex:none;border:none;border-radius:11px;
  background:#F3F8F5;color:#2E5B4C;cursor:pointer;transition:.16s}
.nav-toggle:hover{background:#E7F3ED;color:#17A06E}
.nav-toggle:active{transform:scale(.94)}
.nav-mask{
  position:fixed;inset:0;z-index:70;background:rgba(23,36,32,.46);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:opacity .26s ease,visibility .26s ease}
body.nav-open .nav-mask{opacity:1;visibility:visible}

/* ================= 769–960px：平板竖屏沿用抽屉式菜单 =================
   该区间原规则直接隐藏 .sidebar，导致菜单入口不可达；
   此处沿用与手机一致的抽屉，保证导航可用（≥961px 桌面布局不受影响） */
@media (min-width:769px) and (max-width:960px){
  .layout{position:relative}
  .nav-toggle{display:inline-flex}
  .sidebar{
    display:flex;
    position:fixed;top:0;bottom:0;left:0;z-index:80;
    width:min(72vw,300px);max-width:100%;
    transform:translateX(-102%);
    transition:transform .28s cubic-bezier(.32,.72,.28,1);
    box-shadow:14px 0 34px rgba(23,36,32,.16);border-right:none;
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  body.nav-open .sidebar{transform:translateX(0)}
  .side-item{min-height:44px}
  .modal{max-width:calc(100vw - 32px)}
}

/* ================= ≤768px：手机主断点 ================= */
@media (max-width:768px){
  html,body{overflow-x:hidden;max-width:100%}
  .app{height:100vh;height:100dvh}

  /* ---------- 顶栏：可换行紧凑排列 ---------- */
  .topbar{
    height:auto;min-height:56px;padding:8px 12px;gap:8px;flex-wrap:wrap;
    padding-top:calc(8px + env(safe-area-inset-top,0px))}
  .nav-toggle{display:inline-flex;width:44px;height:44px}
  .topbar .logo{gap:8px;font-size:14.5px;letter-spacing:.2px}
  .topbar .logo small{display:none}
  .topbar .logo .ic{width:32px;height:32px}
  .topbar .logo .ic img{width:24px;height:24px}
  .topbar .spacer{flex:1}
  .topbar .tb-item{width:42px;height:42px;min-height:42px}
  .topbar .user{padding:4px 8px 4px 4px;gap:0;min-height:42px}
  .topbar .search{
    order:9;flex:1 1 100%;max-width:none;margin:0 0 2px}
  .topbar .search input{height:40px;font-size:13.5px}

  /* ---------- 侧栏 → 抽屉 ---------- */
  .layout{position:relative}
  .sidebar{
    display:flex;
    position:fixed;top:0;bottom:0;left:0;z-index:80;
    width:min(82vw,296px);max-width:100%;
    padding:calc(14px + env(safe-area-inset-top,0px)) 12px calc(14px + env(safe-area-inset-bottom,0px));
    transform:translateX(-102%);transition:transform .28s cubic-bezier(.32,.72,.28,1);
    box-shadow:14px 0 34px rgba(23,36,32,.16);border-right:none;
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  body.nav-open .sidebar{transform:translateX(0)}
  .side-item{min-height:44px;padding-top:10px;padding-bottom:10px}
  .side-group{margin-top:14px}
  .side-theme .st-grid{grid-template-columns:repeat(3,minmax(0,1fr))}

  /* ---------- 主内容区 ---------- */
  .main{padding:14px 12px calc(22px + env(safe-area-inset-bottom,0px));overflow-x:hidden}
  .card{border-radius:16px}
  .card-pad{padding:14px}
  .card-title{margin-bottom:12px}
  .card-title h3{font-size:14px}

  .page-head{
    flex-direction:column;align-items:stretch;gap:10px;margin-bottom:14px}
  .page-head h2{font-size:18px;gap:8px}
  .page-head h2 .mascot-ic{width:26px;height:26px}
  .page-head .desc{font-size:12px}
  .page-head .right{width:100%;gap:8px}
  .page-head .right .btn{flex:1 1 auto}
  #view-dashboard .page-head{
    padding:14px;padding-right:14px;min-height:0;align-items:stretch}
  #view-dashboard .page-head .dash-bg-mascot,
  #view-dashboard .page-head ~ * .dash-bg-mascot{width:min(30vw,120px);right:2%;bottom:2%}

  /* ---------- 网格：KPI / 图表 / 各类卡片 → 单列 ---------- */
  .kpis,.charts,.dash-grid,.dash-grid-3,
  .settings-grid,.detail-grid,.push-stats,.ver-detail,
  .disc-grid,.ppt-grid,.splash-grid,.quick-row,
  .bg-picker-grid,#view-dashboard .dash-inner > .bg-picker .bg-picker-grid{
    grid-template-columns:1fr!important}
  .quick-row{gap:10px}
  .kpis{gap:10px}
  .dash-inner{padding:0}

  /* ---------- 表格：横向滚动 + 固定关键列 ---------- */
  .table-wrap{
    overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
    margin:0 -14px;padding:0 14px 4px}
  .tbl{min-width:620px;font-size:13px}
  .tbl.tbl.cmp{min-width:660px}
  .tbl th,.tbl td{padding:10px 12px}
  .tbl.cmp .col-ck{
    position:sticky;left:0;z-index:3;background:#fff;
    box-shadow:1px 0 0 var(--border)}
  .tbl.cmp th.col-ck{background:#F8FBFA}
  .tbl.cmp tbody tr:hover .col-ck{background:#F1FAF6}
  .tbl.cmp tbody tr.row-on .col-ck{background:#EEF9F3}
  .tbl.cmp th.op-col,.tbl.cmp td.op-col{
    position:sticky;right:0;z-index:3;background:#fff;
    box-shadow:-1px 0 0 var(--border)}
  .tbl.cmp th.op-col{background:#F8FBFA}
  .tbl.cmp tbody tr:hover td.op-col{background:#F1FAF6}
  .tbl.cmp tbody tr.row-on td.op-col{background:#EEF9F3}
  .tbl .cell-user{gap:8px}

  /* ---------- 筛选栏 / 批量工具栏：换行 ---------- */
  .filter-bar{padding:12px;gap:10px;margin-bottom:12px}
  .filter-bar .input,.filter-bar .select,
  .filter-bar .input.wide{width:100%;min-width:0;height:40px;flex:1 1 100%}
  .filter-bar .btn,.filter-bar button{flex:1 1 auto}
  .batch-bar{padding:10px 12px;gap:8px;border-radius:12px}
  .batch-bar .bb-hint{display:none}
  .batch-bar .bb-actions{margin-left:0;width:100%;gap:8px}
  .batch-bar .bb-actions .btn{flex:1 1 auto}

  /* ---------- 弹窗：接近全屏 + 可滚动 ---------- */
  .modal-mask{padding:10px;align-items:flex-end}
  .modal{
    width:100%!important;max-width:100%!important;max-height:88vh;
    border-radius:18px 18px 14px 14px}
  .modal-head{padding:14px 16px}
  .modal-head h3{font-size:15px}
  .modal-body{padding:14px 16px;overscroll-behavior:contain}
  .modal-foot{
    padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));
    flex-wrap:wrap}
  .modal-foot .btn{flex:1 1 130px}
  .modal .detail-grid,.modal .settings-grid,.modal .ver-detail{
    grid-template-columns:1fr!important}

  /* ---------- 触控可用性：可点击元素 ≥40px ---------- */
  .btn{min-height:40px;padding-left:14px;padding-right:14px}
  .btn.sm,.btn-xs{min-height:40px}
  .input,.select,.textarea,.filter-bar .input,.filter-bar .select{
    min-height:40px;height:40px}
  .modal-close{width:40px;height:40px;min-height:40px}
  .tbl .op{gap:4px;flex-wrap:wrap}
  .tbl .op button{
    min-height:40px;padding:0 8px;display:inline-flex;align-items:center}
  .op-more > .btn{height:40px;padding:0 12px}
  .switch{min-height:40px}
  .mb-btn{min-height:40px;padding:11px 16px}
  .seg{width:100%;box-sizing:border-box}
  .seg-btn{min-height:40px;padding:9px 12px;flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center}
  .mb-sel{height:40px;min-height:40px}
  .ck,.lgn-card .ck{min-height:40px;display:inline-flex;align-items:center}
  .ck input,.lgn-card .ck input,.tbl.cmp .col-ck input{width:22px;height:22px}
  .card{overflow:hidden;max-width:100%}
  .kpis > *,.charts > *,.dash-grid > *,.dash-grid-3 > *,.quick-row > *,.settings-grid > *,.detail-grid > *,.disc-grid > *,.ppt-grid > *{min-width:0;max-width:100%}
  .log-msg{white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .log-item{max-width:100%}
  .mascot-brief{flex-wrap:wrap;gap:12px}
  .mb-body{min-width:0;flex:1 1 200px}
  .mb-btn{flex:1 1 100%;width:auto}
  .side-theme .bg-thumb{min-height:56px}
  .st-grid .bg-thumb{padding:6px}

  .toast{left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:auto;max-width:none}

  /* ---------- 登录页：单列 + 场景弱化为背景 ---------- */
  .lgn-scene .lgn-art{opacity:.9}
  .lgn-scene-veil{background:linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.52) 46%,rgba(255,255,255,.78) 100%)}
  .lgn-mascot-zone{
    width:min(38vw,168px);left:auto;right:2vw;bottom:auto;top:6vh;
    opacity:.5;z-index:0}
  .lgn-mascot-zone .lgn-mascot-halo{opacity:.5}
  .lgn-wrap{
    min-height:100vh;min-height:100dvh;
    flex-direction:column;justify-content:center;align-items:stretch;gap:16px;
    padding:calc(26px + env(safe-area-inset-top,0px)) 18px calc(26px + env(safe-area-inset-bottom,0px))}
  .lgn-hero{max-width:none;text-align:center;align-items:center}
  .lgn-hero .brandline{justify-content:center;gap:9px}
  .lgn-hero .brandline .mark{width:42px;height:42px;border-radius:13px}
  .lgn-hero .brandline .mark img{width:32px;height:32px}
  .lgn-hero .brandline h1{font-size:19px;letter-spacing:1.4px}
  .lgn-hero .brandline span{font-size:9px;letter-spacing:2px}
  .lgn-hero .hero-title{font-size:25px;margin:16px 0 10px;line-height:1.32}
  .lgn-hero .hero-title em::after{bottom:1px;height:7px}
  .lgn-hero .hero-desc{font-size:13px;line-height:1.8;max-width:none}
  .lgn-hero .hero-badges{gap:8px;margin-top:14px;justify-content:center}
  .lgn-hero .hero-tips{display:none}
  .lgn-card{
    width:100%;max-width:none;flex:none;
    padding:30px 20px 24px;border-radius:22px;box-sizing:border-box}
  .lgn-card::before{border-radius:22px}
  .lgn-card-mascot{width:84px;height:84px;top:-46px;left:auto;right:14px}
  .lgn-card h2{font-size:22px;letter-spacing:.6px}
  .lgn-card .welcome{font-size:12px;margin-bottom:18px}
  .lgn-field .input{height:48px}
  .lgn-btn{height:50px;font-size:15.5px;letter-spacing:3px;padding-left:3px}
  .lgn-foot{font-size:11.5px;text-align:center;flex-wrap:wrap;justify-content:center;gap:6px}
}

/* ================= ≤480px：小屏微调 ================= */
@media (max-width:480px){
  .topbar{padding-left:10px;padding-right:10px}
  .topbar .logo div{font-size:14px}
  .topbar .user .info{display:none}
  .topbar .user{padding:3px 3px;gap:0}
  .topbar .user .avatar{width:34px;height:34px;font-size:13px}
  .topbar .tb-item{width:40px;height:40px;min-height:40px}

  .main{padding:12px 10px calc(20px + env(safe-area-inset-bottom,0px))}
  .card-pad{padding:12px}
  .page-head h2{font-size:17px}
  .page-head .right{gap:8px}
  .page-head .right .btn{min-width:0}

  .table-wrap{margin:0 -12px;padding:0 12px 4px}
  .tbl,.tbl.tbl.cmp{min-width:560px;font-size:12.5px}
  .tbl th,.tbl td{padding:9px 10px}

  .kpis,.charts,.dash-grid,.dash-grid-3,.quick-row{gap:9px}

  .modal-mask{padding:0}
  .modal{max-height:100vh;height:auto;border-radius:0;max-width:100%}
  .modal-head{padding:12px 14px;padding-top:calc(12px + env(safe-area-inset-top,0px))}
  .modal-body{padding:12px 14px}
  .modal-foot{padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px))}
  .modal-foot .btn{flex:1 1 100%}

  .side-theme .st-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

  .lgn-wrap{padding:calc(20px + env(safe-area-inset-top,0px)) 14px calc(20px + env(safe-area-inset-bottom,0px));gap:14px}
  .lgn-hero .hero-title{font-size:22px}
  .lgn-hero .hero-desc{font-size:12.5px}
  .lgn-hero .chip{font-size:11.5px;padding:7px 11px}
  .lgn-card{padding:26px 16px 20px;border-radius:20px}
  .lgn-card::before{border-radius:20px}
  .lgn-card-mascot{width:72px;height:72px;top:-40px;right:12px}
  .lgn-card h2{font-size:20px}
  .lgn-mascot-zone{width:min(42vw,150px);opacity:.42}
  .lgn-btn{height:48px;font-size:15px;letter-spacing:2px}
}