:root{--aside-bg: #304156;--aside-hover: #263445;--aside-text: #bfcbd9;--aside-active-bg: #263445;--brand: #409eff;--page-bg: #f0f2f5;--ease: cubic-bezier(.55, 0, .1, 1)}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;background:var(--page-bg);color:#303133}.app-wrapper{display:flex;min-height:100%}.layout-sidebar{width:210px;background:var(--aside-bg);color:var(--aside-text);flex-shrink:0;display:flex;flex-direction:column;height:100vh;position:sticky;top:0;transition:width .28s var(--ease);overflow:hidden;box-shadow:2px 0 6px #00152926;z-index:20}.layout-sidebar .el-scrollbar{flex:1;height:calc(100vh - 50px)}.collapse .layout-sidebar{width:64px}.layout-sidebar-logo{height:50px;display:flex;align-items:center;justify-content:center;gap:8px;background:#2b2f3a;overflow:hidden}.logo-mark{width:28px;height:28px;border-radius:6px;background:linear-gradient(135deg,#409eff,#66b1ff);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}.logo-text{color:#fff;font-size:16px;font-weight:700;white-space:nowrap}.layout-sidebar .el-menu{background:var(--aside-bg);border-right:0}.layout-sidebar .el-menu .el-menu{background:#1f2d3d}.layout-sidebar .el-sub-menu__title,.layout-sidebar .el-menu-item{color:var(--aside-text)!important;height:50px;line-height:50px}.layout-sidebar .el-menu-item:hover,.layout-sidebar .el-sub-menu__title:hover{background:transparent!important;color:#fff!important}.layout-sidebar .el-menu-item.is-active{background:var(--aside-active-bg)!important;color:#409eff!important;border-right:3px solid #409eff}.layout-sidebar .el-sub-menu.is-active>.el-sub-menu__title{color:#fff!important}.layout-main{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--page-bg)}.layout-main-navbar{height:50px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 16px;box-shadow:0 1px 4px #00152914;z-index:9}.navbar-left,.navbar-right{display:flex;align-items:center;gap:12px}.hamburger{width:22px;height:22px;border:0;background:none;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;padding:3px 0}.hamburger span{display:block;height:2px;background:#5a5e66;border-radius:1px;transition:transform .28s var(--ease),opacity .2s}.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.user-entry{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:#606266;font-size:14px}.user-avatar{background:#409eff}.nav-badge{margin-left:2px}.nav-badge :deep(.el-badge__content){transform:translateY(-2px) scale(.85)}.el-table .el-table__row{transition:background .2s}.tags-view{height:34px;background:#fff;border-bottom:1px solid #d8dce5;display:flex;align-items:center;padding:0 8px;gap:6px}.tags-item{height:26px;line-height:26px;padding:0 8px 0 10px;font-size:12px;color:#495060;background:#fff;border:1px solid #d8dce5;border-radius:2px;text-decoration:none;display:inline-flex;align-items:center;gap:4px;cursor:pointer;transition:all .2s var(--ease)}.tag-close{font-size:12px}.tag-close:hover{color:#f56c6c}.nprogress{height:2px;background:#409eff;width:0;opacity:0;transition:width .35s var(--ease),opacity .2s}.nprogress.on{width:100%;opacity:1}.tags-item:hover{color:#409eff}.tags-item.active{background:#409eff;color:#fff;border-color:#409eff}.layout-content{padding:16px;flex:1}.mb{margin-bottom:16px}.fade-transform-enter-active,.fade-transform-leave-active{transition:all .45s var(--ease)}.fade-transform-enter-from{opacity:0;transform:translate(-30px)}.fade-transform-leave-to{opacity:0;transform:translate(30px)}.panel-fade-enter-active,.panel-fade-leave-active{transition:opacity .28s var(--ease),transform .28s var(--ease)}.panel-fade-enter-from{opacity:0;transform:translateY(8px)}.panel-fade-leave-to{opacity:0;transform:translateY(-8px)}.kpi-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:16px}@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}}.kpi-card{transition:transform .25s var(--ease),box-shadow .25s var(--ease);animation:rise-in .45s var(--ease) both}.kpi-card:nth-child(2){animation-delay:.05s}.kpi-card:nth-child(3){animation-delay:.1s}.kpi-card:nth-child(4){animation-delay:.15s}.kpi-card:nth-child(5){animation-delay:.2s}.kpi-card:hover{transform:translateY(-4px);box-shadow:0 8px 18px #00000014}.kpi-card.is-first{border:1px solid #409eff;background:#ecf5ff}.kpi-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#909399}.kpi-card.is-first .kpi-title,.kpi-card.is-first .kpi-icon{color:#409eff}.kpi-icon{font-size:18px}.kpi-value{font-size:24px;font-weight:700;margin:8px 0 4px}.kpi-sub{font-size:12px;color:#909399}.up{color:#f56c6c}.down{color:#67c23a}.card-head{display:flex;justify-content:space-between;align-items:center}.font-bold{font-weight:700}.rank-row{display:flex;align-items:flex-start;margin-bottom:16px;animation:rise-in .4s var(--ease) both}.rank-no{width:24px;height:24px;border-radius:50%;background:#fdf6ec;color:#e6a23c;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;margin-right:12px;flex-shrink:0}.rank-body{flex:1;min-width:0}.rank-top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:4px;gap:8px}.rank-metric{color:#409eff;font-weight:700;white-space:nowrap}.rank-empty{padding:48px 0;text-align:center;color:#909399;font-size:13px}.rank-sub{display:flex;justify-content:space-between;font-size:12px;color:#c0c4cc;margin-top:4px}.thumb{width:48px;height:48px;object-fit:cover;border-radius:6px;background:#ebeef5;margin-right:12px}.chart-box{width:100%;height:384px}.filter-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px}.mode-row{display:flex;gap:8px;margin-top:16px}.mode-row .el-button{transition:transform .2s var(--ease),box-shadow .2s}.mode-row .el-button:hover{transform:translateY(-1px)}.tab-bar{background:#fff;padding:8px 12px 0;margin-bottom:8px;border-bottom:1px solid #ebeef5;border-radius:4px 4px 0 0}.tab-item{display:inline-block;margin-right:24px;padding-bottom:8px;cursor:pointer;color:#606266;font-size:14px;position:relative;transition:color .2s}.tab-item:hover{color:#409eff}.tab-item.active{color:#409eff;font-weight:700}.tab-item.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#409eff;animation:underline .25s var(--ease)}.cell-name{font-size:13px;font-weight:700}.cell-id{font-size:12px;color:#909399;margin-top:4px}.blue{color:#409eff}.empty-hint{color:#909399;font-size:13px;text-align:center;padding:24px 0}.pager{display:flex;justify-content:flex-end;margin-top:16px}.el-card{transition:box-shadow .25s var(--ease),transform .25s var(--ease)}.el-card:hover{box-shadow:0 6px 16px #00000014}.el-progress-bar__inner{transition:width .6s var(--ease)!important}.skeleton-line{height:10px;border-radius:6px;background:linear-gradient(90deg,#f2f3f5 25%,#e9ebee 37%,#f2f3f5 63%);background-size:400% 100%;animation:shimmer 1.4s ease infinite}@keyframes rise-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes underline{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0 0}}html,body,#app{width:100%;min-width:0}.layout-content{min-width:0;overflow-x:clip}.layout-main-navbar{min-width:0;gap:12px}.navbar-left{min-width:0}.navbar-right{flex-shrink:0}.nav-search{width:170px}.tags-view{overflow-x:auto;white-space:nowrap}.tags-item{flex-shrink:0}.el-card,.el-card__body{min-width:0}.el-table{max-width:100%}.el-dialog,.el-message-box{max-width:94vw}.sidebar-backdrop{display:none}@media(max-width:1100px){.nav-search{width:130px}.layout-main-navbar{padding:0 12px}.navbar-left .el-breadcrumb__item:first-child{display:none}}@media(max-width:760px){.layout-sidebar,.collapse .layout-sidebar{width:230px;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);transition:transform .2s ease;z-index:1001}.mobile-open .layout-sidebar{transform:translate(0)}.sidebar-backdrop{display:block;position:fixed;inset:0;background:#0007;z-index:1000;border:0}.layout-main{width:100%}.layout-content{padding:10px}.layout-main-navbar{padding:0 10px}.navbar-left,.navbar-right{gap:8px}.navbar-left .el-breadcrumb{display:none}.nav-search{width:115px}.nav-username{display:none}.user-entry{gap:4px}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kpi-value{font-size:21px;overflow-wrap:anywhere}.filter-row{gap:10px}.filter-row>.el-select,.filter-row>.el-date-editor{width:100%!important;max-width:100%}.mode-row{flex-wrap:wrap;gap:8px}.mode-row .el-button{margin-left:0}.pager{overflow-x:auto;justify-content:flex-start}.el-card__body{padding:14px}.chart-box{height:300px}}.layout-login{max-width:calc(100vw - 32px)}@media(max-width:380px){.nav-search{width:95px}.user-entry>.el-icon{display:none}}
