:root{--bg:#f5f7fb;--surface:#fff;--surface-soft:#f8faff;--text:#1d2738;--muted:#7c8798;--line:#e8edf4;--primary:#315efb;--primary-soft:#edf2ff;--green:#16a574;--shadow:0 8px 30px rgba(23,43,77,.035)} :root[data-theme="dark"]{--bg:#111827;--surface:#1b2535;--surface-soft:#202c3e;--text:#edf2fb;--muted:#a5b0c1;--line:#303d50;--primary:#7896ff;--primary-soft:#293a61;--shadow:0 8px 30px rgba(0,0,0,.12)} body{margin:0;background:var(--bg);color:var(--text);font-family:"DM Sans","Noto Sans SC",system-ui,sans-serif;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button{cursor:pointer}.app-shell{min-height:100vh;display:flex}.sidebar{width:238px;position:fixed;inset:0 auto 0 0;background:var(--surface);border-right:1px solid var(--line);padding:26px 16px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:11px;padding:0 9px 34px;font-size:15px;font-weight:700;letter-spacing:-.3px}.brand small{display:block;font-size:11px;color:var(--muted);font-weight:500;letter-spacing:0;margin-top:2px}.brand-mark,.login-logo{display:grid;place-items:center;width:39px;height:39px;background:linear-gradient(145deg,#4c7cff,#3153df);color:white;border-radius:12px;font-weight:800;font-size:14px;box-shadow:0 6px 14px #315efb33}.nav-caption{padding:0 12px 10px;color:#9aa5b5;font-size:10px;letter-spacing:1.2px;font-weight:700;text-transform:uppercase}.sidebar-link{display:flex;align-items:center;gap:13px;padding:12px 13px;border-radius:9px;color:var(--muted);font-weight:500;margin-bottom:4px;transition:.15s}.sidebar-link>span{font-size:18px;width:18px;text-align:center}.sidebar-link:hover{background:var(--surface-soft);color:var(--text)}.sidebar-link.active{background:var(--primary-soft);color:var(--primary);font-weight:700}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:20px 7px 0;display:flex;align-items:center;gap:10px}.status-dot,.live-pill i{width:8px;height:8px;border-radius:50%;background:#22bf83;box-shadow:0 0 0 4px #22bf8318}.sidebar-bottom strong{font-size:12px;display:block}.sidebar-bottom small{font-size:11px;color:var(--muted);display:block;margin-top:3px}.main-area{margin-left:238px;min-width:0;width:calc(100% - 238px)}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:var(--surface);border-bottom:1px solid var(--line)}.top-actions{display:flex;align-items:center;gap:20px}.user-chip{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600}.avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#e7edff;color:#315efb;font-weight:700}.page-content{padding:31px 34px 44px;max-width:1600px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:25px}.eyebrow{font-size:10px;color:var(--primary);letter-spacing:1.5px;font-weight:800;margin-bottom:6px}.page-heading h1{font-size:25px;line-height:1.3;letter-spacing:-.7px;margin:0 0 7px;font-weight:700}.page-heading p,.panel-head p{margin:0;color:var(--muted);font-size:12px}.heading-date{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:13px}.live-pill{display:inline-flex;align-items:center;gap:7px;background:#eafaf3;color:#159768;padding:6px 10px;border-radius:20px;font-size:10px;font-weight:700}.live-pill i{width:6px;height:6px;box-shadow:none}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.stat-card,.panel{background:var(--surface);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow)}.stat-card{padding:19px 20px 17px;min-height:139px}.stat-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:500}.stat-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:17px}.stat-icon.blue{background:#edf2ff;color:#4268f5}.stat-icon.violet{background:#f1edff;color:#8866e9}.stat-icon.green{background:#e7f9f1;color:#17a573}.stat-icon.orange{background:#fff2e7;color:#ef9144}.stat-number{font-size:30px;font-weight:700;letter-spacing:-1px;margin-top:9px;line-height:1.1}.stat-foot{font-size:10px;color:var(--muted);margin-top:9px}.content-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:18px}.panel{padding:22px 22px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.panel-head h2,.install-panel h2{font-size:15px;margin:0 0 5px;letter-spacing:-.2px}.panel-tag{display:inline-flex;align-items:center;padding:6px 10px;border-radius:7px;background:var(--surface-soft);border:1px solid var(--line);color:var(--muted);font-size:10px;white-space:nowrap}.chart-area{height:215px;display:flex;gap:14px;padding:20px 0 0}.chart-y{display:flex;flex-direction:column;justify-content:space-between;color:#a4adbb;font-size:10px;padding:0 0 23px}.chart-bars{flex:1;display:flex;align-items:stretch;justify-content:space-around;gap:12px;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to bottom,transparent 0,transparent 49px,var(--line) 50px,var(--line) 51px);position:relative}.bar-column{flex:1;max-width:52px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;z-index:1}.bar{width:65%;min-height:4px;background:linear-gradient(180deg,#7595ff,#4168f7);border-radius:6px 6px 2px 2px;box-shadow:0 4px 10px #4168f71c}.bar-value{font-size:10px;color:var(--muted)}.bar-column>span{font-size:10px;color:var(--muted);position:absolute;bottom:-23px}.empty-chart{margin:auto;color:var(--muted);font-size:12px}.chart-legend{display:flex;align-items:center;justify-content:space-between;margin-top:31px;font-size:10px;color:var(--muted)}.chart-legend span{display:flex;align-items:center;gap:7px}.chart-legend i{width:8px;height:8px;background:#5477ff;border-radius:3px}.ranking-panel{display:flex;flex-direction:column}.rank-icon{display:grid;place-items:center;width:33px;height:33px;border-radius:10px;background:var(--primary-soft);color:var(--primary);font-size:18px}.ranking-list{margin-top:19px}.ranking-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.rank-num{width:22px;height:22px;display:grid;place-items:center;background:var(--surface-soft);color:var(--muted);border-radius:6px;font-size:10px;font-weight:700}.rank-num.top-rank{background:#edf2ff;color:#315efb}.rank-name{flex:1;font-size:12px;font-weight:500}.ranking-row strong{font-size:12px}.text-link{display:flex;justify-content:space-between;margin-top:auto;padding-top:20px;color:var(--primary);font-size:11px;font-weight:700}.notice-card{display:flex;gap:12px;margin-top:19px;padding:16px 18px;border:1px solid #dce7ff;background:var(--primary-soft);border-radius:11px;color:var(--text)}.notice-symbol{flex:0 0 22px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:white;font-size:12px;font-weight:700}.notice-card strong{font-size:12px}.notice-card p{font-size:11px;color:var(--muted);line-height:1.8;margin:5px 0 0}.notice-card.compact{margin-top:25px}.table-panel{padding:0;overflow:hidden}.visitor-cell,.tenant-name{display:flex;align-items:center;gap:10px}.visitor-cell strong,.tenant-name strong{display:block;color:var(--text);font-size:12px}.visitor-cell small,.tenant-name small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.visitor-avatar,.tenant-logo{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e9efff;color:#4b6cf0;font-weight:700}.tenant-logo{border-radius:9px;color:#fff}.unread-dot{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 4px;margin-left:6px;background:#ef4444;color:white;border-radius:20px;font-size:10px}.empty-table,.empty-state{text-align:center;color:var(--muted);padding:34px}.form-panel{margin-bottom:18px}.reply-form textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);outline:none}.reply-form textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #315efb17}.install-panel{max-width:850px;padding:30px}.install-icon{width:45px;height:45px;display:grid;place-items:center;border-radius:12px;background:var(--primary-soft);color:var(--primary);font-size:22px;margin-bottom:16px}.install-panel>p{color:var(--muted);font-size:12px;line-height:1.8}.code-box{display:flex;align-items:center;gap:12px;margin-top:22px;background:#172033;border-radius:10px;padding:14px;color:#dce6ff}.code-box code{flex:1;white-space:normal;overflow-wrap:anywhere;font-size:11px;line-height:1.7}.info-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.info-list>div{padding:14px;background:var(--surface-soft);border:1px solid var(--line);border-radius:8px}.info-list span{display:block;color:var(--muted);font-size:10px;margin-bottom:7px}.info-list strong{font-size:12px}.color-swatch{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:7px;vertical-align:-1px}.login-body{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at top left,#e9efff 0,transparent 45%),var(--bg)}.login-logo{margin-bottom:23px}.login-card h1{font-size:25px;margin:0 0 7px}.muted{color:var(--muted);font-size:12px;margin:0 0 25px}.login-note{border-top:1px solid var(--line);margin-top:24px;padding-top:17px;color:var(--muted);font-size:11px;line-height:1.9}.login-note strong{color:#c27b25} @media(max-width:1100px){.sidebar{width:205px}.main-area{margin-left:205px;width:calc(100% - 205px)}.page-content{padding:25px 22px}.topbar{padding:0 22px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-grid{grid-template-columns:1fr}} @media(max-width:700px){.sidebar{width:64px;padding:20px 7px}.brand{padding:0 5px 28px}.brand>span:last-child,.nav-caption,.sidebar-link:not(.active){font-size:0}.brand-mark{width:42px;height:42px;flex:0 0 42px}.sidebar-link{justify-content:center;padding:13px 4px;gap:0;font-size:0}.sidebar-link>span{font-size:19px}.sidebar-bottom{justify-content:center;padding:17px 0 0}.sidebar-bottom>div:last-child{display:none}.main-area{margin-left:64px;width:calc(100% - 64px)}.topbar{height:60px;padding:0 13px}.topbar .topbar-breadcrumb,.breadcrumb-sep,.user-chip>span:last-child{display:none}.top-actions{gap:11px}.page-content{padding:22px 13px 32px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:19px}.page-heading h1{font-size:22px}.heading-date{font-size:11px}.stats-grid{gap:10px}.stat-card{padding:14px;min-height:124px}.stat-number{font-size:26px}.stat-top{font-size:11px}.stat-icon{width:29px;height:29px}.panel{padding:17px 14px}.table-panel{padding:0}.content-grid{gap:12px}.chart-area{height:185px;gap:7px}.chart-bars{gap:4px}.info-list{grid-template-columns:1fr}.code-box{align-items:flex-start;flex-direction:column}.chat-detail{padding:0}.message-stream{padding:14px;max-height:55vh}.reply-actions{align-items:flex-start;flex-direction:column}.bubble{max-width:78vw}} /* V1 后台补充样式：统一搜索栏、分页、弹窗和窄屏操作布局。 */ .topbar-left{display:flex;align-items:center;gap:12px;min-width:0}.mobile-menu-toggle{display:none;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);padding:7px 9px}.page-tabs{height:43px;display:flex;align-items:stretch;gap:5px;padding:0 22px;background:var(--surface-soft);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}.page-tab{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;max-width:210px;padding:0 12px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font-size:11px;white-space:nowrap}.page-tab.active{border-bottom-color:var(--primary);background:var(--surface);color:var(--text)}.page-tab-dot{width:6px;height:6px;border-radius:50%;background:var(--muted)}.page-tab.active .page-tab-dot{background:var(--primary)}.page-tab-close{font-size:16px;line-height:1;padding:1px 2px;border-radius:4px}.page-tab-close:hover{background:var(--surface-soft);color:var(--text)}.nav-parent{width:100%;border:0;background:transparent;text-align:left;font:inherit;cursor:pointer}.nav-chevron{margin-left:auto;font-size:12px;font-weight:500;transition:transform .15s}.nav-parent.expanded .nav-chevron{transform:rotate(180deg)}.nav-submenu{display:none;padding:2px 0 7px 43px}.nav-submenu.open{display:block}.nav-sublink{display:block;padding:9px 11px;margin:2px 0;border-radius:7px;color:var(--muted);font-size:12px}.nav-sublink:hover,.nav-sublink.active{background:var(--primary-soft);color:var(--primary);font-weight:700}.search-panel{padding:17px 20px;margin-bottom:17px}.table-panel-head{padding:20px 20px 16px}.form-divider{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:10px;margin:18px 0 14px}.form-divider:after{content:"";height:1px;flex:1;background:var(--line)}.avatar-upload-row{display:flex;align-items:center;gap:14px;margin-bottom:19px}.avatar-upload-row>div{min-width:0}.profile-avatar-preview{width:58px;height:58px;flex:0 0 58px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}.avatar-fallback{display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);font-size:22px;font-weight:700}.avatar-image{object-fit:cover}.user-chip{border:0;background:transparent;padding:0;color:var(--text);cursor:pointer}.sidebar-backdrop{display:none} :root[data-theme="dark"] .live-pill{background:#193b32;color:#73d8b2}:root[data-theme="dark"] .rank-num.top-rank{background:#293a61;color:#a9bcff}:root[data-theme="dark"] .notice-card{border-color:var(--line)} @media(max-width:1100px){.page-tabs{padding:0 14px}} @media(max-width:700px){.page-tabs{display:none!important}.sidebar{width:238px;transform:translateX(-105%);transition:transform .2s;box-shadow:12px 0 36px #0002;padding:22px 15px}.sidebar.mobile-open{transform:translateX(0)}.sidebar-backdrop.show{display:block;position:fixed;inset:0;z-index:9;background:#0b1220a3}.brand>span:last-child,.nav-caption,.sidebar-link,.nav-sublink{font-size:inherit}.sidebar-link{justify-content:flex-start;gap:13px;padding:12px 13px}.sidebar-link>span{font-size:18px;width:18px}.nav-parent{display:flex}.nav-submenu{padding-left:43px}.sidebar-bottom{justify-content:flex-start;padding:20px 7px 0}.sidebar-bottom>div:last-child{display:block}.main-area{margin-left:0;width:100%}.mobile-menu-toggle{display:block;flex:0 0 auto}.topbar{padding:0 12px;gap:8px}.topbar-left{gap:8px}.topbar .topbar-breadcrumb,.top-actions{gap:10px}.user-chip .avatar{width:28px;height:28px}.page-tabs{height:41px;padding:0 8px}.page-tab{padding:0 9px}.page-content{padding:19px 12px 30px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:18px}.search-panel{padding:14px}.table-panel-head{padding:16px 14px}.profile-avatar-preview{width:50px;height:50px;flex-basis:50px}.avatar-upload-row{align-items:flex-start}.page-tabs{overflow-x:auto}} /* V3：侧栏、弹窗与异步反馈统一使用同一套主题变量和过渡效果。 */ .sidebar-link>span:first-child{font-size:18px;width:18px;flex:0 0 18px;text-align:center} .sidebar-link .nav-text{min-width:0;flex:1;font-size:13px;white-space:nowrap} .nav-chevron{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 4px 4px auto;flex:0 0 7px;transition:transform .2s ease} .nav-parent.expanded .nav-chevron{transform:rotate(225deg);margin-bottom:0} .nav-submenu{display:block;max-height:0;opacity:0;overflow:hidden;padding-top:0;padding-bottom:0;transition:max-height .22s ease,opacity .18s ease,padding .22s ease} .nav-submenu.open{max-height:180px;opacity:1;padding:2px 0 7px 43px} .sidebar,.main-area{transition:width .22s ease,margin-left .22s ease,transform .22s ease} .sidebar-collapse-toggle{display:inline-grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);transition:background .18s ease,border-color .18s ease} .sidebar-collapse-toggle:hover,.mobile-menu-toggle:hover{background:var(--surface-soft);border-color:var(--primary)} .main-area.sidebar-collapsed{margin-left:76px;width:calc(100% - 76px)} .sidebar.collapsed{width:76px;padding-left:12px;padding-right:12px} .sidebar.collapsed .brand{justify-content:center;padding-left:0;padding-right:0} .sidebar.collapsed .brand>span:last-child,.sidebar.collapsed .nav-caption,.sidebar.collapsed .nav-text,.sidebar.collapsed .nav-chevron,.sidebar.collapsed .sidebar-bottom>div:last-child{display:none} .sidebar.collapsed .sidebar-link{justify-content:center;gap:0;padding-left:7px;padding-right:7px} .sidebar.collapsed .nav-submenu{display:none} .sidebar.collapsed .sidebar-bottom{justify-content:center;padding-left:0;padding-right:0} .page-content{transition:opacity .16s ease,transform .16s ease} .page-tab{transition:color .16s ease,background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease} .dialog-actions{padding-top:16px;margin-top:16px} .feedback-card{text-align:center;padding:28px 24px 20px} .feedback-card h2{margin:12px 0 7px;font-size:17px} .feedback-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.7;overflow-wrap:anywhere} .feedback-mark{display:grid;place-items:center;width:46px;height:46px;margin:0 auto;border-radius:50%;background:#e7f9f1;color:#159768;font-size:24px;font-weight:700} .feedback-card.is-error .feedback-mark{background:#fff0f0;color:#d04444} :root[data-theme="dark"] .feedback-mark{background:#193b32;color:#82ddba} :root[data-theme="dark"] .feedback-card.is-error .feedback-mark{background:#472629;color:#ffb5b5} .avatar-upload-row [hidden]{display:none!important} .profile-avatar-preview{transition:opacity .16s ease,transform .16s ease} .profile-avatar-preview:not([hidden]){animation:avatar-appear .18s ease both} @keyframes avatar-appear{from{opacity:.4;transform:scale(.94)}to{opacity:1;transform:scale(1)}} .user-chip{gap:8px} @media(max-width:700px){ .sidebar{width:238px;padding:22px 15px;transform:translateX(-105%);transition:transform .22s ease;width:238px} .sidebar.mobile-open{transform:translateX(0)} .sidebar .brand>span:last-child,.sidebar .nav-caption,.sidebar .nav-text,.sidebar .nav-sublink,.sidebar .sidebar-bottom>div:last-child{display:block!important;font-size:12px!important} .sidebar .brand>span:last-child{font-size:15px!important} .sidebar .nav-caption{font-size:10px!important} .sidebar .nav-text{font-size:13px!important} .sidebar .sidebar-link,.sidebar .sidebar-link:not(.active){font-size:13px!important;justify-content:flex-start;gap:13px;padding:12px 13px} .sidebar .sidebar-link>span:first-child{font-size:18px;width:18px;flex-basis:18px} .sidebar .nav-parent{display:flex} .sidebar .nav-chevron{display:block!important} .sidebar .nav-submenu{padding-left:43px} .sidebar .nav-submenu.open{padding-left:43px} .sidebar .sidebar-bottom{justify-content:flex-start;padding:20px 7px 0} .sidebar .sidebar-bottom>div:last-child{display:block!important} .sidebar.collapsed{width:238px;padding:22px 15px} .sidebar.collapsed .brand>span:last-child,.sidebar.collapsed .nav-caption,.sidebar.collapsed .nav-text,.sidebar.collapsed .nav-chevron,.sidebar.collapsed .sidebar-bottom>div:last-child{display:block!important} .sidebar.collapsed .sidebar-link{justify-content:flex-start;gap:13px;padding:12px 13px} .main-area.sidebar-collapsed{margin-left:0;width:100%} .sidebar-collapse-toggle{display:none} .main-area{margin-left:0;width:100%} .mobile-menu-toggle{display:block} .topbar-left{gap:8px} } @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}} /* V4：一级菜单图标列统一宽度，父级选中态由当前路由统一控制。 */ #mainSidebar>.sidebar-link{width:100%;min-height:42px;align-items:center;} #mainSidebar>.sidebar-link>span:first-child{width:18px;flex:0 0 18px;text-align:center;} #mainSidebar>.nav-parent .nav-text{flex:1;} #mainSidebar .nav-parent.active{background:var(--primary-soft);color:var(--primary);font-weight:700;} .tab-context-menu{position:fixed;z-index:200;min-width:132px;padding:5px;background:var(--surface);border:1px solid var(--line);border-radius:9px;box-shadow:0 10px 30px #0002;display:flex;flex-direction:column;gap:2px;animation:tabMenuIn .12s ease-out;} .tab-context-menu button{border:0;border-radius:6px;background:transparent;color:var(--text);text-align:left;padding:9px 12px;font-size:12px;} .tab-context-menu button:hover,.tab-context-menu button:focus-visible{background:var(--primary-soft);color:var(--primary);outline:0;} @keyframes tabMenuIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}} @media(prefers-reduced-motion:reduce){.tab-context-menu{animation:none}} /* V5：一级菜单文本左对齐；折叠状态下父级菜单可点击展开侧栏。 */ #mainSidebar .nav-text,#mainSidebar .nav-text1{ text-align:left; } #mainSidebar>.sidebar-link,#mainSidebar>.nav-parent{ justify-content:flex-start; } #mainSidebar>.sidebar-link .nav-text,#mainSidebar>.nav-parent .nav-text{ text-align:left; } .merchant-line-chart{margin-top:18px;position:relative;padding-bottom:24px;min-width:0} .merchant-line-chart svg{display:block;width:100%;height:220px;overflow:visible} .chart-grid-line{stroke:var(--line);stroke-width:1;stroke-dasharray:3 4} .merchant-line{fill:none;stroke:#4d73f6;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke} .merchant-line-dot{fill:var(--surface);stroke:#4d73f6;stroke-width:2;vector-effect:non-scaling-stroke} .merchant-line-labels{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));gap:2px;margin-top:4px;color:var(--muted);font-size:10px;text-align:center} .merchant-line-labels span{white-space:nowrap} .merchant-settings-panel{max-width:760px;padding:24px} @media(max-width:700px){.merchant-line-chart svg{height:175px}.merchant-line-labels{font-size:8px;overflow:hidden}.merchant-settings-panel{padding:18px}} /* V6：登录审计表格在窄屏上允许 User-Agent 换行，避免撑坏整体布局。 */ .user-agent-cell{max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.6;min-width:0} #openProfileModal{border-radius:8px;transition:background .16s ease,opacity .16s ease} #openProfileModal:hover{background:var(--surface-soft)} #serviceProfileForm input[readonly]{background:var(--surface-soft);color:var(--muted);cursor:not-allowed} @media(prefers-reduced-motion:reduce){.page-content,.page-tab,.tab-context-menu{transition:none!important;animation:none!important}} /* V7：保留后台专属布局与图表样式，常用控件交由 Bootstrap 统一处理。 */ :root{ --bs-body-bg: var(--bg); --bs-body-color: var(--text); --bs-border-color: var(--line); } :root[data-theme="dark"]{ --bs-body-bg: var(--bg); --bs-body-color: var(--text); --bs-border-color: var(--line); } body{ background:var(--bg); color:var(--text); } .login-body{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; background:var(--bg); } .login-card{ width:min(100%,430px); background:var(--surface); color:var(--text); } .login-card h1{ font-size:1.5rem; margin:0 0 .5rem; } .login-logo{ display:grid; place-items:center; width:44px; height:44px; margin-bottom:20px; background:linear-gradient(145deg,#4c7cff,#3153df); color:#fff; border-radius:12px; font-weight:800; } .login-note{ margin-top:22px; color:var(--muted); font-size:.8rem; line-height:1.7; } .modal-content{ color:var(--text); background:var(--surface); border-color:var(--line); } .modal-header,.modal-footer{ border-color:var(--line); } .modal.is-error .feedback-mark{ background:#fff0f0; color:#d04444; } :root[data-theme="dark"] .modal.is-error .feedback-mark{ background:#472629; color:#ffb5b5; } .modal-header p{ margin:4px 0 0; color:var(--muted); font-size:.82rem; } .modal-body .form-label{ display:block; margin-bottom:.8rem; } .modal-body .form-control,.modal-body .form-select{ margin-top:.35rem; } .modal-body .modal-footer{ margin:1rem -1rem -1rem; } .form-control,.form-select{ transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease; } .form-check-input{ cursor:pointer; transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease; } .btn{ transition:color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease; } .btn:active{ transform:translateY(1px); } .card{ color:var(--text); background-color:var(--surface); border-color:var(--line); } .table{ --bs-table-bg:var(--surface); --bs-table-color:var(--text); --bs-table-border-color:var(--line); --bs-table-hover-bg:var(--surface-soft); --bs-table-hover-color:var(--text); } .table thead th{ color:var(--muted); background:var(--surface-soft); font-size:.78rem; font-weight:600; white-space:nowrap; } .page-content .table-responsive{ width:100%; } .page-content .pagination{ margin:0; gap:.25rem; flex-wrap:wrap; } .page-content .page-link{ color:var(--primary); background:var(--surface); border-color:var(--line); } .page-content .page-item.active .page-link{ color:#fff; background:var(--primary); border-color:var(--primary); } .page-content .page-item.disabled .page-link{ color:var(--muted); background:var(--surface-soft); } :root[data-theme="dark"] .btn-outline-secondary{ --bs-btn-color:var(--text); --bs-btn-border-color:var(--line); --bs-btn-hover-color:var(--text); --bs-btn-hover-bg:var(--surface-soft); --bs-btn-hover-border-color:var(--muted); --bs-btn-active-color:var(--text); --bs-btn-active-bg:var(--surface-soft); --bs-btn-active-border-color:var(--line); } :root[data-theme="dark"] .form-control,:root[data-theme="dark"] .form-select{ background-color:var(--surface-soft); color:var(--text); border-color:var(--line); } :root[data-theme="dark"] .form-control::placeholder{ color:var(--muted); } :root[data-theme="dark"] .form-control:focus,:root[data-theme="dark"] .form-select:focus{ background-color:var(--surface-soft); color:var(--text); } :root[data-theme="dark"] .text-body-secondary{ color:var(--muted)!important; } .avatar-upload-row{ display:flex; align-items:center; gap:1rem; margin-bottom:1rem; } .avatar-upload-row .form-control{ max-width:100%; } .user-agent-cell{ max-width:320px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.6; min-width:0; } @media (max-width:700px) { .page-content{ padding:1rem; } .page-heading{ align-items:flex-start; flex-wrap:wrap; } .stats-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; } .stat-card{ padding:1rem; } .content-grid{ grid-template-columns:minmax(0,1fr); } .topbar{ padding:0 1rem; } .top-actions{ gap:.5rem; } .modal-dialog{ margin:.5rem; } .modal-content{ max-height:calc(100vh - 1rem); } } /* V8：统一表单和按钮字号，修正顶部标题对齐，并完善登录与状态操作的间距。 */ .btn, button, .form-control, .form-select, input, select, textarea, .form-check-label { font-size: 14px; } .page-tab, .tab-context-menu button { font-size: 14px; } .btn-sm { --bs-btn-font-size: 14px; } .login-body { padding: 24px 16px; } .login-card { width: min(100%, 440px); border-radius: 16px; padding: 32px !important; box-shadow: 0 18px 55px rgba(25, 42, 70, .09) !important; } .login-card .login-logo { margin-bottom: 24px !important; } .login-card h1 { font-size: 24px; line-height: 1.35; font-weight: 700; } .login-subtitle { font-size: 14px; line-height: 1.6; } .login-card .form-label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 500; } .login-card .form-control { min-height: 42px; padding: 9px 12px; } .login-card .btn { min-height: 42px; } .login-note { font-size: 12px; line-height: 1.8; } .modal-header { align-items: flex-start; gap: 16px; } .modal-header > div:first-child { min-width: 0; flex: 1 1 auto; } .modal-body .form-control, .modal-body .form-select { font-size: 14px; } .status-toggle-btn { min-width: 72px; padding: .4rem .85rem; font-weight: 600; line-height: 1.35; transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease; } .feedback-card .modal-footer { padding-bottom: 0; } :root[data-theme="dark"] .login-card { box-shadow: 0 18px 55px rgba(0, 0, 0, .24) !important; } :root[data-theme="dark"] .login-body { background: radial-gradient(ellipse at top left, #202c45 0, transparent 45%), var(--bg); } @media (max-width: 575.98px) { .login-card { padding: 26px 22px !important; border-radius: 14px; } } /* V9：Bootstrap Icons、本地刷新按钮与统一表格内容展示。 */ .nav-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;flex:0 0 18px;font-size:17px;line-height:1} .nav-icon .bi{display:block} .stat-icon .bi,.rank-icon .bi,.install-icon .bi{font-size:1em;line-height:1} .login-logo .bi{font-size:23px;line-height:1} .topbar-left .btn,.top-actions .btn{white-space:nowrap} .page-refresh-btn{display:inline-grid;place-items:center;width:34px;height:34px;flex:0 0 34px;padding:0;border-radius:8px} .page-refresh-btn .bi{font-size:15px} .modal-close-btn{display:inline-grid;place-items:center;width:32px;height:32px;flex:0 0 32px;padding:0;border-radius:8px} .modal-close-btn .bi{font-size:12px} .feedback-mark .bi{font-size:22px;line-height:1} .cell-detail-ready{position:relative;padding-right:28px!important;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis} .cell-ellipsis-text{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0} .cell-inner-ellipsis{min-width:0;max-width:100%;overflow:hidden} .tenant-name,.visitor-cell{min-width:0;max-width:100%;white-space:nowrap} .tenant-name>div,.visitor-cell>div{min-width:0;max-width:100%;flex:1 1 auto;overflow:hidden} .tenant-name strong,.tenant-name small,.visitor-cell strong,.visitor-cell small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cell-expand-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:inline-grid;place-items:center;width:21px;height:23px;padding:0;border:0;border-radius:5px;background:var(--surface);color:var(--muted);opacity:0;pointer-events:none;transition:opacity .14s ease,background-color .14s ease,color .14s ease;z-index:2} .cell-detail-ready:hover .cell-expand-toggle,.cell-expand-toggle:focus-visible,.cell-expand-toggle.expanded{opacity:1;pointer-events:auto} .cell-expand-toggle:hover,.cell-expand-toggle.expanded{background:var(--primary-soft);color:var(--primary)} .cell-expand-toggle .bi{font-size:12px} .cell-detail-popover{position:fixed;z-index:1200;max-width:min(380px,calc(100vw - 24px));max-height:min(55vh,360px);overflow:auto;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);box-shadow:0 12px 36px #0002;animation:cellDetailIn .12s ease-out;overflow-wrap:anywhere;white-space:normal;font-size:13px;line-height:1.65} .cell-detail-text{white-space:pre-wrap;overflow-wrap:anywhere} @keyframes cellDetailIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}} .page-content .table-panel .table.v9-nowrap-table{table-layout:fixed;width:100%;} .page-content .table-panel .table.v9-nowrap-table th,.page-content .table-panel .table.v9-nowrap-table td{white-space:nowrap;vertical-align:middle;} .page-content .table-panel .table.v9-nowrap-table td .d-flex{flex-wrap:nowrap!important;} .page-content .table-panel .table.v9-nowrap-table td form{white-space:nowrap;flex:0 0 auto;} .page-content .table-panel .table.v9-nowrap-table td .btn{white-space:nowrap;flex:0 0 auto;} .page-content .table-panel .table.v9-nowrap-table td .badge{white-space:nowrap;} .status-toggle-btn.btn-sm{min-width:56px;padding:.22rem .52rem;font-size:12px;line-height:1.2;font-weight:600;} @media(max-width:700px){ #themeToggle{width:34px;height:34px;min-width:34px;display:inline-grid;place-items:center;padding:0;} #themeToggle .theme-toggle-icon{font-size:16px;} .topbar-left{gap:6px;} .page-refresh-btn,.sidebar-collapse-toggle,.mobile-menu-toggle{width:32px;height:32px;flex-basis:32px;padding:0;} .cell-expand-toggle{opacity:1;pointer-events:auto;background:var(--surface-soft);} .cell-detail-popover{max-width:calc(100vw - 24px);} } @media(hover:none){.cell-expand-toggle{opacity:1;pointer-events:auto;}} @media(prefers-reduced-motion:reduce){.cell-detail-popover{animation:none!important;}} /* V10：统一顶部工具按钮、提示文字层级与页面加载反馈。 */ .topbar .sidebar-collapse-toggle, .topbar .mobile-menu-toggle, .topbar .page-refresh-btn, .topbar #themeToggle, .topbar .top-actions form > button { min-height:34px; height:34px; box-sizing:border-box; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--muted); box-shadow:none; transition:color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease; } .topbar .sidebar-collapse-toggle, .topbar .mobile-menu-toggle, .topbar .page-refresh-btn, .topbar #themeToggle { width:34px; min-width:34px; flex:0 0 34px; display:inline-flex; align-items:center; justify-content:center; padding:0; } .topbar .top-actions form > button { padding:0 11px; display:inline-flex; align-items:center; justify-content:center; gap:5px; white-space:nowrap; } .topbar .sidebar-collapse-toggle:hover, .topbar .mobile-menu-toggle:hover, .topbar .page-refresh-btn:hover, .topbar #themeToggle:hover, .topbar .top-actions form > button:hover { color:var(--text); background:var(--surface-soft); border-color:var(--primary); box-shadow:0 0 0 2px var(--primary-soft); } .topbar .sidebar-collapse-toggle:focus-visible, .topbar .mobile-menu-toggle:focus-visible, .topbar .page-refresh-btn:focus-visible, .topbar #themeToggle:focus-visible, .topbar .top-actions form > button:focus-visible { outline:2px solid var(--primary); outline-offset:2px; } .topbar .sidebar-collapse-toggle .bi, .topbar .mobile-menu-toggle .bi, .topbar .page-refresh-btn .bi, .topbar #themeToggle .bi, .topbar .top-actions form > button .bi { font-size:15px; line-height:1; } /* 小提示弱化显示，正文和表格数据颜色不受影响。 */ .form-text, .page-content small, .form-label small, .modal-content small, .login-note, .brand small, .sidebar-bottom small, .page-heading p, .panel-head p, .stat-foot, .notice-card p, .login-subtitle, .text-body-secondary { color:var(--muted)!important; } .modal-close-btn { display:inline-flex!important; align-items:center!important; justify-content:center!important; } .modal-close-btn .bi { display:block; flex:0 0 auto; margin:0!important; padding:0; line-height:1; vertical-align:middle; } .page-content.is-loading { min-height:280px; display:grid; place-items:center; opacity:1!important; transform:none!important; pointer-events:none; } .page-loading-state { min-height:220px; width:100%; display:flex; align-items:center; justify-content:center; color:var(--primary); } .page-loading-state .spinner-border { width:2rem; height:2rem; border-width:.2em; animation:spinner-border .72s linear infinite; } .page-content-fade-out { opacity:0!important; transform:translateY(3px); transition:opacity .09s ease, transform .09s ease; } .page-content-fade-in { animation:v10PageContentFadeIn .24s ease both; } @keyframes v10PageContentFadeIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } } @media(max-width:700px) { .topbar .mobile-menu-toggle { display:inline-flex; } .topbar .sidebar-collapse-toggle, .topbar .mobile-menu-toggle, .topbar .page-refresh-btn, .topbar #themeToggle { width:32px; min-width:32px; height:32px; min-height:32px; flex-basis:32px; } .topbar .top-actions form > button { height:32px; min-height:32px; padding:0 8px; } } @media(prefers-reduced-motion:reduce) { .page-content-fade-in, .page-content-fade-out, .page-loading-state .spinner-border { animation:none!important; transition:none!important; } } @media(min-width:701px){.topbar .mobile-menu-toggle{display:none!important;}} /* V11：顶部不再展示标题分组；手机端统一隐藏侧边栏折叠按钮，仅保留菜单按钮。 */ @media(max-width:700px){.topbar .sidebar-collapse-toggle{display:none!important}}