:root { --brand-a: #7b22ee; --brand-b: #2569cc; --sidebar: #222d32; --page: #eef3f8; --text: #263142; --muted: #788598; --border: #e4eaf1; --shadow: 0 12px 30px rgba(47, 69, 103, .10); } * { box-sizing: border-box; } html, body { margin: 0; min-height: 100%; font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; color: var(--text); background: var(--page); } button, input, textarea, select { font: inherit; } button, a { -webkit-tap-highlight-color: transparent; } a { color: inherit; text-decoration: none; } .login-page { background: #0e1530; } .login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr); background: radial-gradient(circle at 18% 25%, rgba(115, 43, 237, .45), transparent 38%), linear-gradient(135deg, #0c1228 0%, #17113f 55%, #12346b 100%); } .login-brand { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: 9vw; color: white; } .brand-mark { width: 64px; height: 64px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.45); border-radius: 20px; background: rgba(255,255,255,.12); font-size: 30px; font-weight: 800; box-shadow: 0 20px 50px rgba(45, 17, 114, .35); } .eyebrow { margin: 24px 0 8px; color: #a99aff; letter-spacing: .18em; font-size: 12px; font-weight: 800; } .login-brand h1 { margin: 0; font-size: clamp(44px, 6vw, 78px); letter-spacing: -.05em; } .login-brand > p:last-of-type { max-width: 520px; line-height: 1.8; color: #cbd3f7; } .brand-orbit { position: absolute; width: 420px; height: 420px; right: -80px; bottom: -160px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; } .brand-orbit::before, .brand-orbit::after { content: ""; position: absolute; inset: 55px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; } .brand-orbit::after { inset: 120px; } .brand-orbit span { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: #5ee7f0; box-shadow: 0 0 24px #5ee7f0; } .brand-orbit span:nth-child(1) { top: 36px; left: 118px; }.brand-orbit span:nth-child(2) { top: 210px; right: -6px; background: #ff80ce; }.brand-orbit span:nth-child(3) { bottom: 58px; left: 45px; background: #a7ff62; } .login-card { align-self: center; width: min(430px, calc(100% - 48px)); margin: 24px auto; padding: 44px; border: 1px solid rgba(255,255,255,.45); border-radius: 26px; background: rgba(255,255,255,.96); box-shadow: 0 30px 80px rgba(0,0,0,.32); } .login-card h2 { margin: 0; font-size: 30px; }.muted, .login-hint { color: var(--muted); }.login-hint { font-size: 12px; margin-top: 18px; } .stack-form { display: grid; gap: 18px; margin-top: 28px; }.stack-form label { display: grid; gap: 8px; font-size: 14px; font-weight: 700; } .stack-form input { width: 100%; padding: 13px 14px; border: 1px solid #d8dfeb; border-radius: 10px; outline: none; background: #f9fbfd; }.stack-form input:focus { border-color: #7b5bec; box-shadow: 0 0 0 3px rgba(123,91,236,.12); } .primary-btn { border: 0; border-radius: 10px; padding: 14px 18px; color: white; font-weight: 800; background: linear-gradient(100deg, var(--brand-a), var(--brand-b)); cursor: pointer; box-shadow: 0 10px 26px rgba(87,69,211,.28); } .app-shell { min-height: 100vh; display: grid; grid-template: 50px 1fr / 230px 1fr; } .topbar { position: sticky; z-index: 30; top: 0; grid-column: 1 / -1; display: grid; grid-template-columns: 230px 1fr auto; align-items: center; height: 50px; color: white; background: linear-gradient(100deg, #8224ee 0%, #315fce 100%); box-shadow: 0 2px 8px rgba(34,47,88,.18); } .wordmark { justify-self: center; font-size: 20px; line-height: 50px; padding: 0 26px; background: rgba(32, 153, 201, .42); } .icon-btn { border: 0; width: 48px; height: 50px; color: inherit; background: transparent; cursor: pointer; font-size: 18px; } .topbar-actions { display: flex; height: 100%; align-items: center; gap: 14px; padding-right: 10px; }.topbar-actions form { height: 100%; }.quota-pill { font-size: 13px; }.quota-pill span { color: #ffd74e; }.user-name { font-size: 13px; } .sidebar { position: sticky; top: 50px; height: calc(100vh - 50px); grid-column: 1; grid-row: 2; overflow-y: auto; background: var(--sidebar); color: #bdc7cc; transition: width .24s ease; } .sidebar nav { padding: 10px 0; }.sidebar a { display: flex; align-items: center; gap: 15px; min-height: 48px; padding: 0 20px; border-left: 3px solid transparent; font-size: 14px; }.sidebar a:hover { color: white; background: #1e282c; }.sidebar a.active { color: white; border-color: #8454ee; background: #1e282c; }.sidebar a span { width: 18px; text-align: center; font-size: 16px; }.sidebar b { font-weight: 500; white-space: nowrap; } .content { min-width: 0; grid-column: 2; grid-row: 2; padding: 22px 24px 40px; } .app-shell[data-sidebar="closed"] { grid-template-columns: 52px 1fr; }.app-shell[data-sidebar="closed"] .topbar { grid-template-columns: 52px 1fr auto; }.app-shell[data-sidebar="closed"] .sidebar b { display: none; }.app-shell[data-sidebar="closed"] .sidebar a { padding: 0 14px; } .metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }.metric-card { position: relative; overflow: hidden; min-height: 128px; padding: 18px 20px; border-radius: 8px; color: white; box-shadow: var(--shadow); }.metric-card::after { content: ""; position: absolute; width: 130px; height: 130px; right: -52px; top: -60px; border-radius: 50%; border: 24px solid rgba(255,255,255,.08); }.metric-card p { margin: 0; font-size: 17px; font-weight: 800; }.metric-card strong { display: block; margin: 12px 0 8px; font-size: 30px; letter-spacing: .01em; }.metric-card small { font-weight: 700; opacity: .9; }.metric-icon { position: absolute; right: 18px; top: 16px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.22); box-shadow: 0 0 18px rgba(255,255,255,.32); }.metric-card.blue { background: linear-gradient(120deg, #3189ee, #854ee4); }.metric-card.green { background: linear-gradient(120deg, #24ba3b, #70e20b); }.metric-card.purple { background: linear-gradient(120deg, #8d43df, #d790f2); }.metric-card.orange { background: linear-gradient(120deg, #ff9c21, #ff4a2e); }.metric-card.sunset { background: linear-gradient(120deg, #7d397e, #ff9d26); } .panel { margin-top: 18px; padding: 18px; border-radius: 9px; background: white; box-shadow: var(--shadow); }.panel h2 { margin: 0; font-size: 14px; }.chart-panel { min-height: 274px; }.donut-wrap { display: grid; place-items: center; padding: 20px 0 12px; }.donut { width: 154px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#4966ed 0 12%, #ef8397 12% 38%, #45bb21 38% 60%, #5749e4 60% 75%, #37c4c4 75% 100%); position: relative; }.donut::after { content: ""; position: absolute; inset: 40px; border-radius: 50%; background: white; box-shadow: inset 0 0 0 1px #edf1f5; }.legend { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px 18px; color: #536174; font-size: 12px; }.legend span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: currentColor; }.deepseek { color: #4966ed; }.doubao { color: #ef8397; }.yuanbao { color: #45bb21; }.qianwen { color: #5749e4; }.wenxin { color: #37c4c4; } .chatgpt { color: #4966ed; }.gemini { color: #ef8397; }.google-ai { color: #45bb21; }.grok { color: #5749e4; }.copilot { color: #37c4c4; } .panel-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.segmented { display: flex; gap: 8px; }.segmented button { border: 0; padding: 7px 16px; border-radius: 20px; color: #7c89a0; background: #f3f5f8; cursor: pointer; font-size: 11px; }.segmented button.active { color: #735bd5; background: #f0edff; }.bar-chart { height: 260px; margin-top: 22px; padding: 14px 26px 0; border-left: 1px solid #dfe6ee; border-bottom: 1px solid #dfe6ee; display: flex; align-items: end; justify-content: space-around; background: repeating-linear-gradient(to bottom, transparent 0 51px, #edf1f5 52px 53px); }.bar-chart i { width: 10%; height: 42%; background: linear-gradient(#6a6ce9, #a35ad9); border-radius: 5px 5px 0 0; }.bar-chart i:nth-child(2) { height: 86%; background: #ef8397; }.bar-chart i:nth-child(3) { height: 60%; background: #45bb21; }.bar-chart i:nth-child(4) { height: 74%; background: #5749e4; }.bar-chart i:nth-child(5) { height: 54%; background: #37c4c4; } .metric-grid.compact { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 18px; }.stat-card { padding: 20px; border: 1px solid var(--border); border-radius: 9px; background: white; box-shadow: var(--shadow); }.stat-card p, .stat-card small { color: var(--muted); }.stat-card p { margin: 0; }.stat-card strong { display: block; margin: 10px 0; font-size: 26px; }.stat-card small { font-size: 12px; } .placeholder-panel { min-height: 360px; display: grid; align-content: center; justify-items: center; text-align: center; }.placeholder-panel h1 { margin: 0; font-size: 32px; }.placeholder-panel p:last-child { max-width: 580px; color: var(--muted); line-height: 1.8; } .alert { margin-bottom: 14px; padding: 11px 14px; border-radius: 8px; background: #eef6ff; color: #2569a8; }.alert.error { background: #fff0f0; color: #b33030; } .alert.success { background: #edfbf3; color: #177847; } .page-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 0 0 18px; }.page-head .eyebrow { margin: 0 0 5px; }.page-head h1 { margin: 0; font-size: 26px; }.page-head form { margin: 0; } .primary-btn, .secondary-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; border-radius: 7px; padding: 0 16px; border: 0; cursor: pointer; font-weight: 700; font-size: 13px; } .secondary-btn { color: #526171; border: 1px solid #d7e0e8; background: white; }.secondary-btn:hover { color: #6346dc; border-color: #8b78e7; } details > summary { list-style: none; width: max-content; }details > summary::-webkit-details-marker { display: none; }details[open] > summary { margin-bottom: 18px; } .toolbar-panel { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-top: 0; }.inline-form { display: flex; gap: 10px; align-items: center; }.inline-form.wide { align-items: stretch; }.inline-form.wide select, .inline-form.wide input { min-width: 240px; } .grid-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }.compact-form { border-top: 1px solid var(--border); padding-top: 18px; }.grid-form label, .setting-card label { display: grid; gap: 7px; color: #536174; font-size: 13px; font-weight: 700; }.grid-form .span-2 { grid-column: 1 / -1; }.grid-form input, .grid-form select, .grid-form textarea, .inline-form input, .inline-form select, .setting-card input { min-width: 0; width: 100%; border: 1px solid #d8e0e8; border-radius: 7px; padding: 10px 12px; color: var(--text); background: white; outline: none; }.grid-form input:focus, .grid-form select:focus, .grid-form textarea:focus, .inline-form input:focus, .inline-form select:focus, .setting-card input:focus { border-color: #7b5bec; box-shadow: 0 0 0 3px rgba(123,91,236,.1); }.grid-form textarea { resize: vertical; line-height: 1.7; }.check { display: flex !important; align-items: center; grid-auto-flow: column; justify-content: start; gap: 8px !important; }.check input { width: 16px !important; height: 16px; }.form-warning { padding: 10px 12px; border-radius: 7px; color: #865c0c; background: #fff7df; font-size: 12px; } .table-panel { padding: 0; overflow: hidden; }.table-wrap { overflow-x: auto; }.table-panel table { width: 100%; border-collapse: collapse; font-size: 13px; white-space: nowrap; }.table-panel th { padding: 13px 14px; color: #5c697b; background: #f7f9fb; border-bottom: 1px solid var(--border); text-align: left; font-weight: 700; }.table-panel td { padding: 13px 14px; border-bottom: 1px solid #edf1f5; color: #566476; }.table-panel tbody tr:hover { background: #fbfcfe; }.table-panel tbody tr:last-child td { border-bottom: 0; }.strong-cell { color: var(--text) !important; font-weight: 700; }.money { color: #9c4cc0 !important; font-weight: 800; }.positive { color: #168456 !important; font-weight: 800; }.negative { color: #dc5e4f !important; font-weight: 800; }.title-cell { max-width: 300px; overflow: hidden; text-overflow: ellipsis; }.mono { font-family: Consolas, monospace; font-size: 12px; }.empty { text-align: center; padding: 40px !important; color: #94a0af !important; } .badge { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 9px; border-radius: 20px; font-size: 11px; font-weight: 700; }.badge.success, .status-completed, .status-approved { color: #178052; background: #e8f8ef; }.badge.info, .status-submitted, .status-processing { color: #5b4dc4; background: #eeebff; }.badge.warning, .status-pending, .status-queued, .status-appealed { color: #9b6800; background: #fff4d4; }.muted-badge, .status-draft { color: #748093; background: #eef1f4; }.status-rejected, .status-cancelled { color: #b84040; background: #ffeded; } .row-action { position: relative; }.row-action summary, .text-btn { color: #6551ce; cursor: pointer; }.mini-form { position: absolute; z-index: 20; right: 0; top: 26px; width: 260px; display: grid; gap: 8px; padding: 14px; border: 1px solid var(--border); border-radius: 9px; background: white; box-shadow: 0 16px 44px rgba(34,49,72,.18); }.mini-form input { width: 100%; border: 1px solid #d8e0e8; border-radius: 6px; padding: 8px; }.text-btn { border: 0; padding: 3px 5px; background: transparent; font-weight: 700; }.text-btn.danger, .danger { color: #cc4b4b; }.success-text { color: #168456; }.action-row { display: flex; gap: 7px; } .notice { margin: 0 0 18px; padding: 13px 16px; border-left: 3px solid #8264e9; border-radius: 0 8px 8px 0; color: #5c6878; background: #f2efff; font-size: 13px; line-height: 1.7; }.notice code { color: #5940b6; } .settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }.setting-card { display: grid; align-content: start; gap: 16px; margin-top: 0; }.setting-card h2 { font-size: 18px; }.setting-card small { color: var(--muted); }.card-head { display: flex; align-items: center; justify-content: space-between; }.order-create { margin-top: 0; } .balance-check { margin: -4px 0 18px; }.section-head { margin-top: 28px; }.error-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; text-align: center; background: radial-gradient(circle at 50% 20%, #fff, #e9eef7); }.error-page h1 { margin: 0; color: #6f4ae0; font-size: 90px; }.error-page p:not(.eyebrow) { margin: 12px 0 28px; color: var(--muted); } @media (min-width: 1280px) { .metric-card.sunset { grid-column: auto; }.metric-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } } @media (max-width: 900px) { .login-shell { grid-template-columns: 1fr; }.login-brand { min-height: 280px; padding: 54px 32px; }.login-brand h1 { font-size: 48px; }.login-card { margin-top: -38px; position: relative; z-index: 2; } .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.metric-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }.user-name { display: none; }.settings-grid { grid-template-columns: 1fr; } } @media (max-width: 680px) { .app-shell { grid-template: 44px 1fr / 1fr; }.topbar { height: 44px; grid-template-columns: 52px 1fr auto; }.wordmark { line-height: 44px; font-size: 17px; }.icon-btn { height: 44px; }.quota-pill { display: none; }.sidebar { position: fixed; z-index: 40; top: 44px; left: 0; width: 230px; height: calc(100vh - 44px); transform: translateX(0); box-shadow: 10px 0 30px rgba(17,31,42,.28); }.content { grid-column: 1; grid-row: 2; padding: 16px; }.app-shell[data-sidebar="closed"] { grid-template-columns: 1fr; }.app-shell[data-sidebar="closed"] .topbar { grid-template-columns: 52px 1fr auto; }.app-shell[data-sidebar="closed"] .sidebar { transform: translateX(-100%); }.app-shell[data-sidebar="closed"] .sidebar b { display: block; }.metric-grid { grid-template-columns: 1fr; gap: 14px; }.metric-grid.compact { grid-template-columns: 1fr 1fr; }.panel-head { align-items: flex-start; flex-direction: column; }.segmented { width: 100%; overflow-x: auto; }.segmented button { flex: 0 0 auto; }.login-card { padding: 32px 24px; } .page-head, .toolbar-panel { align-items: stretch; flex-direction: column; }.page-head .secondary-btn, .page-head form .secondary-btn { width: 100%; }.grid-form { grid-template-columns: 1fr; }.grid-form .span-2 { grid-column: 1; }.inline-form, .inline-form.wide { align-items: stretch; flex-direction: column; }.inline-form.wide select, .inline-form.wide input { min-width: 0; }.mini-form { position: static; width: 230px; margin-top: 8px; }.settings-grid { grid-template-columns: 1fr; } } /* Unified local vector icon system */ .ui-icon { --icon: none; display: inline-block; flex: 0 0 auto; width: 1em; height: 1em; background-color: currentColor; -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat; vertical-align: -0.12em; } .menu-toggle .ui-icon { width: 19px; height: 19px; } .logout-btn .ui-icon { width: 18px; height: 18px; } .quota-pill, .backend-link, .user-name { display: inline-flex; align-items: center; gap: 6px; } .quota-pill .ui-icon { width: 12px; height: 12px; color: #72f5e7; filter: drop-shadow(0 0 4px rgba(114,245,231,.55)); } .backend-link .ui-icon { width: 14px; height: 14px; color: #fff; } .user-avatar { color: #42cdb1; } .user-avatar .ui-icon { width: 17px; height: 17px; } .quota-gem, .user-glyph, .user-avatar img { display: none; } .sidebar a { display: grid; grid-template-columns: 18px minmax(0,1fr); align-items: center; column-gap: 14px; padding: 0 18px; } .sidebar .nav-icon { width: 17px; height: 17px; margin: 0; color: rgba(255,255,255,.92); opacity: 1; filter: none; transform: none; } .sidebar a:hover .nav-icon, .sidebar a.active .nav-icon { color: #fff; transform: none; } .app-shell[data-sidebar="closed"] .sidebar a { grid-template-columns: 18px; justify-content: center; padding: 0; } .app-shell[data-sidebar="closed"] .sidebar .nav-icon { width: 17px; height: 17px; } .metric-icon { top: 19px; right: 18px; width: 27px; height: 27px; overflow: visible; border: 1px solid rgba(255,255,255,.27); border-radius: 50%; background: rgba(255,255,255,.13); box-shadow: 0 0 14px rgba(74,255,210,.2); } .metric-icon .ui-icon { width: 15px; height: 15px; color: #65f1ca; filter: drop-shadow(0 0 4px rgba(60,255,204,.6)); } .metric-icon img { display: none; } .stat-icon { position: absolute; top: 18px; right: 20px; width: 25px; height: 25px; color: #49d8b9; opacity: .92; filter: drop-shadow(0 2px 5px rgba(45,201,170,.2)); } .tool-btn, .view-btn, .search-toggle, .test-model-btn, .outline-action { gap: 6px; } .tool-btn .ui-icon { width: 14px; height: 14px; } .tool-btn.refresh .ui-icon { width: 17px; height: 17px; } .view-btn .ui-icon, .search-toggle .ui-icon { width: 16px; height: 16px; color: #596573; } .toolbar-right > .view-btn::before, .toolbar-right > .view-btn::after, .search-toggle::before, .search-toggle::after { display: none !important; } .view-btn.active { color: #6b52df; border-color: #bdb2ef; background: #f1edff; } .circle-action .ui-icon { width: 14px; height: 14px; color: #fff; } .circle-action.refresh-action { background: #5f90ef; } .modal-close .ui-icon { width: 18px; height: 18px; } .enter-portal .ui-icon { width: 14px; height: 14px; } .table-compact .data-table th, .table-compact .data-table td { height: 40px; padding-top: 7px; padding-bottom: 7px; } .model-test-row { display: flex; align-items: center; gap: 12px; } .test-model-btn { display: inline-flex; align-items: center; justify-content: center; } .test-model-btn .ui-icon { width: 15px; height: 15px; } .model-test-row small { color: #71798a; } .model-test-row small.test-ok { color: #13a884; } .model-test-row small.test-error { color: #df4350; } .test-model-btn:disabled { cursor: wait; opacity: .65; } .detail-modal { width: min(620px,calc(100vw - 30px)); } .detail-grid { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 0; padding: 20px 24px 26px; } .detail-grid > * { min-height: 42px; padding: 10px 12px; border-bottom: 1px solid #edf0f5; } .detail-grid span { color: #7b8391; } .detail-grid b { color: #394352; font-weight: 600; } .bulk-actions { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 6px 16px; border-bottom: 1px solid #eef0f4; color: #7a8290; } .bulk-actions button, .keyword-batch .resume { min-height: 30px; border: 1px solid #dfe3ea; border-radius: 4px; padding: 0 11px; color: #5b6472; background: #fff; cursor: pointer; } .keyword-batch button { display: inline-flex; align-items: center; gap: 5px; } .keyword-batch .ui-icon { width: 13px; height: 13px; } .table-footer nav { align-items: center; } .table-footer nav button { border-radius: 0; } .table-footer nav .page-current { display: grid; place-items: center; min-width: 54px; height: 34px; color: #fff; background: #454566; } .table-footer nav button:disabled { color: #a8afb9; background: #f7f8fa; cursor: not-allowed; } .portal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid #edf0f4; } .portal-header h1 { margin: 8px 0 4px; font-size: 23px; color: #2f3949; } .portal-header p { margin: 0; color: #8992a2; } .portal-back { display: inline-flex; align-items: center; gap: 5px; color: #6c58d8; font-size: 13px; } .portal-back .ui-icon { width: 14px; height: 14px; } .portal-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; padding: 18px 20px; background: #f7f8fb; } .portal-metrics article { position: relative; min-height: 108px; padding: 18px 18px 16px 66px; border: 1px solid #e6e9f0; border-radius: 8px; background: #fff; box-shadow: 0 3px 12px rgba(48,58,88,.045); } .portal-metrics article > .ui-icon { position: absolute; left: 20px; top: 25px; width: 31px; height: 31px; color: #6c55df; } .portal-metrics span { display: block; color: #818999; font-size: 13px; } .portal-metrics strong { display: block; margin-top: 9px; color: #303a49; font-size: 22px; } .portal-quota-panel { margin: 0; padding: 0 20px 18px; background: #f7f8fb; } .portal-quota-panel > header { display: flex; align-items: baseline; justify-content: space-between; padding: 14px 16px 10px; border: 1px solid #e6e9f0; border-bottom: 0; border-radius: 8px 8px 0 0; background: #fff; } .portal-quota-panel > header h2 { margin: 0; color: #303a49; font-size: 15px; } .portal-quota-panel > header span { color: #8a93a2; font-size: 12px; } .portal-quota-grid { display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); border: 1px solid #e6e9f0; border-radius: 0 0 8px 8px; background: #fff; overflow: hidden; } .portal-quota-grid > span { display: flex; flex-direction: column; gap: 5px; padding: 12px 14px; border-right: 1px solid #edf0f4; } .portal-quota-grid > span:last-child { border-right: 0; } .portal-quota-grid b { color: #7d8795; font-size: 12px; font-weight: 500; } .portal-quota-grid strong { color: #5f50d8; font-size: 17px; } .portal-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 16px; padding: 0 20px 22px; background: #f7f8fb; } .portal-section { overflow: hidden; border: 1px solid #e6e9f0; border-radius: 8px; background: #fff; } .portal-section > header { display: flex; align-items: center; justify-content: space-between; min-height: 54px; padding: 0 16px; border-bottom: 1px solid #edf0f4; } .portal-section h2 { margin: 0; font-size: 15px; } .portal-section header a { color: #6d56de; font-size: 12px; } @media (max-width: 1100px) { .portal-quota-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } .portal-quota-grid > span:nth-child(4n) { border-right: 0; } } @media (max-width: 900px) { .portal-metrics { grid-template-columns: 1fr 1fr; } .portal-quota-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } .portal-quota-grid > span:nth-child(4n) { border-right: 0; } .portal-grid { grid-template-columns: 1fr; } } /* Replica UI v2 — matched to the authorized agent console */ :root { --brand-purple: #7226e8; --brand-blue: #2d82cf; --shell-gradient: linear-gradient(115deg, #7b24ed 0%, #4b54d6 48%, #3183ce 100%); --sidebar-gradient: linear-gradient(160deg, #7925ec 0%, #5251dd 46%, #2886ca 100%); --workspace: #f2f5f8; --line: #edf0f4; --green: #18b993; --red: #ff5262; --violet: #856df3; } html, body { background: var(--workspace); color: #4b5360; font-size: 14px; } body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } .app-shell { display: grid; grid-template: 50px minmax(0,1fr) / 230px minmax(0,1fr); min-height: 100vh; } .topbar { position: sticky; top: 0; z-index: 90; grid-column: 1 / -1; display: grid; grid-template-columns: 230px 52px minmax(0,1fr) auto; height: 50px; background: var(--shell-gradient); color: #fff; box-shadow: 0 1px 7px rgba(44,57,114,.2); } .wordmark { grid-column: 1; justify-self: stretch; display: grid; place-items: center; height: 50px; padding: 0; background: rgba(25,156,199,.37); font-size: 19px; font-weight: 500; letter-spacing: .02em; } .wordmark span { text-shadow: 0 1px 2px rgba(0,0,0,.12); } .menu-toggle { grid-column: 2; width: 52px; font-size: 18px; } .topbar-spacer { grid-column: 3; } .topbar-actions { grid-column: 4; gap: 21px; padding: 0 11px 0 0; font-weight: 600; } .topbar-actions form { display: flex; align-items: center; } .quota-pill { display: flex; align-items: center; gap: 6px; padding: 5px 12px; border: 1px solid rgba(35,48,83,.7); border-radius: 22px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.15); white-space: nowrap; } .quota-gem { width: 9px; height: 12px; border-radius: 65% 35% 64% 36% / 66% 39% 61% 34%; transform: rotate(38deg); background: linear-gradient(135deg,#c8fff9,#37d8ed); box-shadow: 0 0 8px rgba(95,245,255,.6); } .user-glyph { position: relative; width: 13px; height: 13px; } .user-glyph::before { content:""; position:absolute; left:4px; top:0; width:5px; height:5px; border-radius:50%; background:#fff; } .user-glyph::after { content:""; position:absolute; left:2px; bottom:0; width:9px; height:6px; border-radius:6px 6px 2px 2px; background:#fff; } .backend-link, .user-name { display: flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 13px; } .user-avatar { display: grid; place-items: center; width: 27px; height: 27px; overflow: hidden; border-radius: 50%; background: rgba(255,255,255,.96); box-shadow: 0 1px 5px rgba(23,38,85,.2); } .user-avatar img { width: 30px; height: 30px; object-fit: contain; } .logout-btn { width: 34px; } .sidebar { position: sticky; top: 50px; grid-row: 2; grid-column: 1; height: calc(100vh - 50px); background: var(--sidebar-gradient); color: #fff; overflow-y: auto; } .sidebar nav { padding: 13px 0; } .sidebar a { min-height: 51px; padding: 0 15px; gap: 10px; border: 0; color: rgba(255,255,255,.96); font-size: 15px; } .sidebar a:hover { background: rgba(54,27,154,.18); } .sidebar a.active { border: 0; background: rgba(79,31,184,.3); box-shadow: inset 0 1px rgba(255,255,255,.025), inset 0 -1px rgba(24,22,105,.08); } .sidebar .nav-icon { flex: 0 0 auto; width: 24px; height: 24px; margin-left: -3px; object-fit: contain; opacity: .94; filter: saturate(0) brightness(3.1) drop-shadow(0 1px 2px rgba(29,20,98,.16)); transition: transform .18s ease, opacity .18s ease; } .sidebar a:hover .nav-icon, .sidebar a.active .nav-icon { transform: scale(1.07); opacity: 1; } .sidebar b { font-weight: 600; } .content { grid-row: 2; grid-column: 2; min-width: 0; padding: 27px 96px 44px; background: var(--workspace); } .content:not(.content-dashboard) { padding: 8px 15px 40px; } .app-shell[data-sidebar="closed"] { grid-template-columns: 52px minmax(0,1fr); } .app-shell[data-sidebar="closed"] .topbar { grid-template-columns: 52px 52px minmax(0,1fr) auto; } .app-shell[data-sidebar="closed"] .wordmark span { display: none; } .app-shell[data-sidebar="closed"] .sidebar a { justify-content: center; padding: 0; } .app-shell[data-sidebar="closed"] .sidebar .nav-icon { width: 20px; height: 20px; } .alert { position: relative; z-index: 12; margin: 0 0 10px; border: 1px solid #cfe2ff; border-radius: 4px; padding: 9px 12px; } /* Dashboard */ .metric-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; } .metric-card { min-height: 128px; padding: 18px 17px; border-radius: 7px; box-shadow: 0 7px 17px rgba(49,72,114,.09); } .metric-card::after { display: none; } .metric-card p { font-size: 19px; font-weight: 700; } .metric-card strong { margin: 8px 0 8px; font-size: 29px; } .metric-card strong { white-space: nowrap; } .metric-card small { font-size: 12px; } .metric-icon { top: 12px; right: 14px; width: 42px; height: 42px; overflow: visible; background: transparent; box-shadow: none; } .metric-icon img { width: 42px; height: 42px; object-fit: contain; filter: drop-shadow(0 2px 5px rgba(35,25,88,.16)); } .metric-card.blue { background: linear-gradient(120deg,#358cf2,#8058e3); } .metric-card.green { background: linear-gradient(120deg,#28b735,#74e015); } .metric-card.purple { background: linear-gradient(120deg,#8a43db,#d89aef); } .metric-card.orange { background: linear-gradient(120deg,#ff9b25,#fc4b30); } .metric-card.sunset { background: linear-gradient(120deg,#713a78,#ed962b); } .panel { margin-top: 18px; border: 1px solid #edf0f4; border-radius: 7px; padding: 16px; box-shadow: 0 7px 20px rgba(43,64,103,.07); } .dashboard-chart-grid { display: grid; grid-template-columns: minmax(310px,.8fr) minmax(540px,1.65fr); gap: 14px; } .dashboard-chart-grid .panel { min-height: 305px; } .panel h2 { color: #444b55; font-size: 13px; font-weight: 700; } .donut-wrap { padding: 17px 0 11px; } .donut { width: 160px; } .donut::after { inset: 39px; } .legend { max-width: 260px; margin: 0 auto; grid-template-columns: repeat(3,1fr); } .question-panel { overflow: hidden; } .panel-head { align-items: flex-start; } .segmented { gap: 9px; } .segmented button { min-width: 62px; padding: 5px 13px; font-size: 10px; } .chart-body { display: grid; grid-template-columns: 52px 1fr; height: 237px; margin-top: 12px; } .y-axis { display: flex; flex-direction: column; justify-content: space-between; align-items: end; padding: 5px 7px 21px 0; color: #656d77; font-size: 11px; } .bar-chart { height: 215px; margin: 0; padding: 0 24px; border-left: 1px solid #dfe4ea; border-bottom: 1px solid #dfe4ea; background: repeating-linear-gradient(to bottom,transparent 0 41px,#e7ebef 42px 43px); } .bar-chart i, .bar-chart i:nth-child(n) { position: relative; width: 14%; border-radius: 0; } .bar-chart i.v1 { height:36%; }.bar-chart i.v2 { height:86%; }.bar-chart i.v3 { height:53%; }.bar-chart i.v4 { height:32%; }.bar-chart i.v5 { height:75%; } .bar-chart i:nth-child(1) { background:#4e67ee; }.bar-chart i:nth-child(2) { background:#ef7f92; }.bar-chart i:nth-child(3) { background:#4bc821; }.bar-chart i:nth-child(4) { background:#5b56e1; }.bar-chart i:nth-child(5) { background:#38c2c4; } .bar-chart b { position: absolute; top: calc(100% + 11px); left: 50%; transform: translateX(-50%); min-width: 86px; color: #5b626c; font-size: 11px; font-style: normal; font-weight: 400; text-align: center; } .metric-grid.compact { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 18px; } .stat-card { position:relative; min-height: 112px; padding: 15px; border-radius: 7px; box-shadow: 0 7px 18px rgba(43,64,103,.06); } .stat-card strong { margin: 8px 0; font-size: 27px; color: #333b45; } .stat-icon { position:absolute; top:7px; right:7px; width:50px; height:50px; object-fit:contain; opacity:.84; filter:drop-shadow(0 2px 5px rgba(74,56,150,.12)); } /* FastAdmin-style list workspace */ .workspace-panel { min-height: calc(100vh - 174px); border: 1px solid #edf0f4; border-radius: 4px; background: #fff; box-shadow: 0 4px 14px rgba(46,67,101,.04); } .table-toolbar { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 66px; padding: 12px 16px; border-bottom: 1px solid #f1f2f5; } .toolbar-left, .toolbar-right, .round-actions, .inline-review { display: flex; align-items: center; gap: 7px; } .toolbar-left form, .round-actions form, .inline-review form { margin: 0; } .tool-btn, .view-btn, .search-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; border: 0; border-radius: 18px; padding: 0 13px; color: #fff; cursor: pointer; font-weight: 700; font-size: 13px; } .tool-btn.refresh { width: 35px; padding: 0; background: #5f90ef; font-size: 18px; } .tool-btn.add { background: #1db89c; }.tool-btn.delete { background: #ff8b94; }.tool-btn.more { background: #6f7b8e; }.tool-btn.sync { background: #8c73ed; } .toolbar-inline-form { display: inline-flex; margin: 0; } .tool-btn, .view-btn, .search-toggle, .circle-action, .outline-action { transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease; } .tool-btn:hover, .circle-action:hover { transform: translateY(-1px); box-shadow: 0 5px 12px rgba(42,55,91,.14); } .view-btn:hover, .search-toggle:hover { border-color: #c9cfe0; background: #fff; } .tool-btn:focus-visible, .view-btn:focus-visible, .search-toggle:focus-visible, .circle-action:focus-visible, .outline-action:focus-visible { outline: 3px solid rgba(115,91,223,.2); outline-offset: 2px; } .view-btn { min-width: 38px; border: 1px solid #e3e7ec; border-radius: 3px; padding: 0 10px; color: #4c5561; background: #f9fafb; } .search-toggle { width: 38px; padding: 0; border: 1px solid #e3e7ec; color: #3c4652; background: #f9fafb; font-size: 19px; } .toolbar-right > .view-btn { position: relative; font-size: 0; } .toolbar-right > .view-btn::before { content:""; display:block; width:14px; height:12px; } .toolbar-right > .view-btn:nth-of-type(1)::before { background: repeating-linear-gradient(to bottom,#65707c 0 1px,transparent 1px 4px); box-shadow: inset 3px 0 #f9fafb; } .toolbar-right > .view-btn:nth-of-type(2)::before { background: linear-gradient(#69737e,#69737e) 0 0/5px 5px no-repeat,linear-gradient(#69737e,#69737e) 9px 0/5px 5px no-repeat,linear-gradient(#69737e,#69737e) 0 8px/5px 5px no-repeat,linear-gradient(#69737e,#69737e) 9px 8px/5px 5px no-repeat; } .toolbar-right > .view-btn:nth-of-type(3)::before { width:13px; height:13px; border-bottom:1px solid #69737e; background: linear-gradient(45deg,transparent 47%,#69737e 48% 55%,transparent 56%) center 2px/8px 8px no-repeat; } .search-toggle { position:relative; font-size:0; } .search-toggle::before { content:""; position:absolute; width:9px; height:9px; border:2px solid #505b67; border-radius:50%; transform:translate(-1px,-1px); } .search-toggle::after { content:""; position:absolute; width:6px; height:2px; border-radius:2px; background:#505b67; transform:translate(6px,6px) rotate(45deg); } .table-wrap { overflow-x: auto; } .data-table { width: 100%; border-collapse: collapse; white-space: nowrap; font-size: 13px; } .data-table th { height: 49px; padding: 9px 13px; border-right: 1px solid #f0f1f3; border-bottom: 1px solid #e8ebef; background: linear-gradient(#fff,#fafbfc); color: #3f4650; font-weight: 700; text-align: center; } .data-table td { height: 51px; padding: 9px 13px; border-right: 1px solid #f2f3f5; border-bottom: 1px solid #eef0f3; color: #59616d; text-align: center; } .data-table tbody tr:nth-child(even) { background: #fcfcfd; } .data-table tbody tr:hover { background: #f8fbff; } .data-table tbody tr { transition: background .12s ease; } .data-table input[type="checkbox"] { width: 14px; height: 14px; accent-color: #7967e9; } .row-hidden { opacity: .58; } .strong-cell { color: #3b424b !important; font-weight: 500; } .title-cell { max-width: 260px; text-align: left !important; overflow: hidden; text-overflow: ellipsis; } .outline-badge, .outline-action, .image-link { display: inline-flex; align-items: center; justify-content: center; min-height: 30px; border: 1px solid #1db89c; border-radius: 4px; padding: 0 10px; color: #17a98e; background: #fff; cursor: pointer; font-size: 12px; } .outline-badge { border-color: #bbc3cc; color: #66717d; } .outline-action.danger { border-color: #ff6571; color: #ef4f5d; } .outline-action.disabled { border-color: #d8dee8; color: #9aa5b5; background: #f6f8fb; cursor: not-allowed; } .avatar-dot { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; background: linear-gradient(135deg,#8870ef,#52a4e6); } .avatar-empty { color: #a6adb7; } .dot-status { display: inline-flex; align-items: center; gap: 6px; color: #65717e; } .dot-status::before { content:""; width: 11px; height: 11px; border-radius: 50%; background: #a8b0ba; } .dot-status.on::before, .dot-status.status-approved::before, .dot-status.status-completed::before, .dot-status.status-submitted::before { background: var(--green); } .dot-status.off::before, .dot-status.status-rejected::before, .dot-status.status-cancelled::before { background: var(--red); } .dot-status.pending::before, .dot-status.status-pending::before, .dot-status.status-queued::before, .dot-status.status-processing::before, .dot-status.status-draft::before, .dot-status.status-appealed::before { background: #f2a734; } .link-badge, .table-link { color: #6f57d7; } .circle-action { display: inline-grid; place-items: center; width: 29px; height: 29px; border: 0; border-radius: 50%; color: #fff; cursor: pointer; font-weight: 800; } .circle-action.edit { background: #856cf2; }.circle-action.delete { background: #ff5160; } .round-actions details > summary { margin: 0 !important; } .table-footer { display: flex; align-items: center; gap: 16px; min-height: 58px; padding: 10px 15px; color: #59616b; font-size: 12px; } .table-footer > span:nth-child(2) { margin-left: auto; } .table-footer button, .table-footer a, .table-footer input { min-height: 34px; border: 1px solid #e1e4e8; background: #fff; color: #555e68; } .table-footer button { border-radius: 16px; padding: 0 11px; }.table-footer nav { display: flex; }.table-footer nav a { display: grid; place-items: center; min-width: 35px; padding: 0 9px; }.table-footer nav a.active { color: #fff; background: #454566; }.table-footer nav input { width: 52px; } .empty { height: 110px !important; color: #9ba4af !important; text-align: center !important; } .bulk-actions, .keyword-batch { display: flex; align-items: center; gap: 7px; padding: 0 16px 11px; } .bulk-actions span, .bulk-actions button, .keyword-batch button { min-height: 31px; border: 1px solid #dfe4e9; border-radius: 3px; padding: 0 11px; color: #596574; background: #fff; cursor: pointer; } .keyword-batch button { color: #6b54d0; border-color: #d8d1fa; }.keyword-batch button.pause { color: #e85c66; border-color: #ffc7cb; } /* Filters and dialogs */ details > summary { cursor: pointer; } .modal-details[open] > summary, .search-details[open] > summary { margin-bottom: 0; } .search-details { position: relative; } .filter-pop { position: absolute; z-index: 40; top: 43px; right: 0; width: 310px; display: grid; gap: 11px; padding: 16px; border: 1px solid #e2e6eb; border-radius: 5px; background: #fff; box-shadow: 0 14px 34px rgba(39,54,78,.16); } .filter-pop.order-filter { width: 560px; grid-template-columns: repeat(2,1fr); } .filter-pop label { display: grid; gap: 5px; color: #555f6c; font-size: 12px; } .filter-pop input, .filter-pop select { width: 100%; min-height: 35px; border: 1px solid #dfe3e8; border-radius: 3px; padding: 0 9px; } .filter-pop > div { display: flex; align-items: end; gap: 7px; } .modal-backdrop { position: fixed; z-index: 110; inset: 0; background: rgba(12,20,34,.28); backdrop-filter: blur(1px); } .app-modal { position: fixed; z-index: 120; left: 50%; top: 18%; transform: translateX(-50%); width: min(760px,calc(100vw - 36px)); max-height: 66vh; overflow: hidden; border-radius: 3px; background: #fff; box-shadow: 0 20px 60px rgba(24,35,59,.3); } .enterprise-modal { width: min(800px,calc(100vw - 36px)); }.order-modal { width: min(820px,calc(100vw - 36px)); }.model-modal { width: min(740px,calc(100vw - 36px)); } .app-modal > header { display: flex; align-items: center; justify-content: space-between; height: 46px; padding: 0 18px; color: #fff; background: linear-gradient(90deg,#8571ef,#8669f2); } .app-modal > header strong { font-size: 14px; }.modal-close { border: 0; color: #fff; background: transparent; cursor: pointer; font-size: 22px; } .modal-close:hover { transform: rotate(5deg) scale(1.08); } .modal-form { max-height: calc(66vh - 46px); overflow-y: auto; padding: 18px 58px 0; } .modal-form { scrollbar-width: thin; scrollbar-color: #9aa1aa transparent; } .modal-form::-webkit-scrollbar { width: 6px; }.modal-form::-webkit-scrollbar-track { background: transparent; }.modal-form::-webkit-scrollbar-thumb { border-radius: 8px; background: #9aa1aa; } .modal-form > h3 { margin: 2px 0 18px; color: #536bce; text-align: center; font-size: 20px; } .modal-form > label, .modal-two-col > label { display: grid; grid-template-columns: 126px minmax(0,1fr); align-items: start; gap: 14px; margin-bottom: 13px; } .modal-form > label > span:first-child, .modal-two-col > label > span:first-child { padding-top: 9px; color: #525b67; text-align: right; } .modal-form i { margin-right: 4px; color: #f15b61; font-style: normal; } .modal-form input:not([type="radio"]):not([type="checkbox"]), .modal-form select, .modal-form textarea { width: 100%; min-height: 36px; border: 1px solid #d9dee5; border-radius: 5px; padding: 8px 12px; color: #4c5561; outline: 0; background: #fff; } .modal-form textarea { resize: vertical; line-height: 1.6; }.modal-form input:focus, .modal-form select:focus, .modal-form textarea:focus { border-color: #8b78ee; box-shadow: 0 0 0 3px rgba(123,99,229,.09); } .modal-form small, .field-help { display: block; margin-top: 5px; color: #7c858f; font-size: 11px; } .modal-two-col > label > small { grid-column: 2; margin-top: -8px; } .resource-picker { position: relative; min-width: 0; } .resource-results { position: absolute; z-index: 25; top: 40px; right: 0; left: 0; max-height: 285px; overflow-y: auto; border: 1px solid #dfe3e9; border-radius: 6px; background: #fff; box-shadow: 0 13px 32px rgba(31,42,64,.18); } .resource-result { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 12px; width: 100%; border: 0; border-bottom: 1px solid #edf0f4; padding: 10px 12px; color: #394352; text-align: left; background: #fff; cursor: pointer; } .resource-result:hover, .resource-result:focus { background: #f5f3ff; outline: 0; } .resource-result strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .resource-result > span { color: #6752d8; font-size: 12px; white-space: nowrap; } .resource-result small { grid-column: 1/-1; overflow: hidden; margin: 0; color: #818a97; text-overflow: ellipsis; white-space: nowrap; } .resource-empty { padding: 18px 12px; color: #8a93a0; text-align: center; font-size: 12px; } .modal-form footer { position: sticky; bottom: 0; display: flex; justify-content: center; gap: 8px; margin: 20px -58px 0; padding: 12px; border-top: 1px solid #edf0f3; background: rgba(247,249,251,.97); } .primary-btn { min-height: 36px; border-radius: 18px; padding: 0 17px; background: linear-gradient(90deg,#588ff1,#8171ed); box-shadow: none; } .reset-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; border: 1px solid #dfe3e8; border-radius: 18px; padding: 0 15px; color: #65707c; background: #fff; cursor: pointer; } .modal-two-col { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }.modal-two-col > label { grid-template-columns: 126px 1fr; } .modal-tip { margin: 2px 0 15px 140px; padding: 9px 11px; border-radius: 4px; color: #77682f; background: #fff9df; font-size: 11px; } .radio-row { display: flex; align-items: center; gap: 20px; padding-top: 6px !important; text-align: left !important; }.radio-row.wrap { flex-wrap: wrap; }.radio-row label { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; } .field-help { margin: -5px 0 14px 140px; line-height: 1.7; } .test-model-btn { min-height: 34px; border: 1px solid #8171e6; border-radius: 4px; padding: 0 13px; color: #725ed3; background: #fff; cursor: pointer; } .check-line { display: flex; align-items: center; gap: 7px; padding-top: 7px !important; text-align: left !important; } .mini-form { width: 280px; } /* Cloud and profile */ .cloud-workspace, .profile-workspace { padding: 22px 26px 32px; } .cloud-form { max-width: 1020px; margin: 0 auto; } .cloud-fields { display: grid; gap: 15px; } .cloud-fields label, .profile-form label { display: grid; grid-template-columns: 210px minmax(0,1fr); align-items: center; gap: 15px; } .cloud-fields label > span, .profile-form label > span { text-align: right; color: #555f6c; } .cloud-fields input, .profile-form input { width: 100%; min-height: 39px; border: 1px solid #dfe3e8; border-radius: 4px; padding: 0 12px; outline: 0; } .cloud-fields input:focus, .profile-form input:focus { border-color: #8370ea; box-shadow: 0 0 0 3px rgba(121,101,224,.08); } .profile-form input[readonly], .cloud-fields input[readonly] { color: #7f8997; background: #f6f7f9; cursor: not-allowed; } .api-config-section { max-width: 1020px; margin: 28px auto 0; padding-top: 20px; border-top: 1px solid #edf0f3; }.api-config-section h3 { margin: 0 0 13px; font-size: 14px; }.api-config-list { display: grid; gap: 10px; }.api-config-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: end; gap: 10px; }.api-config-row > label:first-of-type { display: grid; gap: 5px; color: #596474; }.api-config-row input[type="url"] { min-height: 38px; border: 1px solid #dfe3e8; border-radius: 4px; padding: 0 11px; }.api-config-section > p { color: #87909d; font-size: 11px; } .config-submit { margin: 22px 0 0 225px; } .api-connection-strip { display: flex; justify-content: space-between; align-items: center; max-width: 1020px; margin: 26px auto 0; padding: 15px 18px; border-top: 1px solid #edf0f3; background: #fafbfc; } .api-connection-strip > div { display: flex; align-items: center; gap: 14px; }.api-connection-strip small { color: #8a939d; } .profile-title { display: flex; align-items: center; justify-content: space-between; margin: -22px -26px 24px; padding: 17px 24px; border-bottom: 1px solid #edf0f3; } .profile-title h2 { margin: 0; color: #424a55; font-size: 18px; }.profile-title small { color: #99a2ad; font-size: 12px; font-weight: 400; } .profile-form { display: grid; gap: 13px; max-width: 990px; margin: 0 auto; }.profile-form label { grid-template-columns: 230px 1fr; }.profile-form footer { padding-left: 245px; } .profile-form .quota-policy { display: flex; align-items: flex-start; gap: 12px; padding: 12px 15px; border: 1px solid #dfe5ff; border-radius: 6px; color: #687283; background: #f7f8ff; font-size: 12px; line-height: 1.7; } .profile-form .quota-policy strong { flex: 0 0 auto; color: #5e50d7; } .wordmark.has-image{padding:5px 14px}.wordmark.has-image img{display:block;max-width:190px;max-height:40px;object-fit:contain}.user-avatar img[data-backend-square-logo]{display:block;width:27px;height:27px;border-radius:50%;object-fit:cover}.app-shell[data-sidebar="closed"] .wordmark.has-image{padding:5px}.app-shell[data-sidebar="closed"] .wordmark.has-image img{max-width:39px;max-height:39px}.profile-logo{align-content:center;gap:10px}.profile-brand-heading{display:grid;gap:3px;text-align:center}.profile-brand-heading strong{color:#313842;font-size:14px}.profile-brand-heading span{color:#8792a5;font-size:12px}.profile-logo-remove{border:0;color:#d84b60;background:transparent;font:inherit;font-size:12px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.profile-logo-remove:disabled{opacity:.5;cursor:not-allowed} .geo-drawer { margin-top: 12px; border: 1px solid #e5e9ee; border-radius: 4px; background: #fff; } .geo-drawer > summary { padding: 13px 16px; color: #6250c7; font-weight: 700; }.geo-drawer > summary b { margin-left: 7px; } .geo-panel { display: grid; grid-template-columns: minmax(360px,.7fr) minmax(420px,1.3fr); gap: 20px; padding: 18px; border-top: 1px solid #edf0f3; } .geo-task-list { max-height: 320px; overflow-y: auto; }.geo-task-list p { display: grid; grid-template-columns: 1fr auto; gap: 4px 15px; margin: 0; padding: 10px; border-bottom: 1px solid #edf0f3; }.geo-task-list small { grid-column: 1 / -1; color: #7f8995; } .geo-task-item { padding: 12px 4px; border-bottom: 1px solid #edf0f3; }.geo-task-item header { display: flex; justify-content: space-between; gap: 16px; }.geo-task-item small { display: block; margin-top: 5px; color: #7f8995; }.geo-task-item .geo-question { color: #364153; font-weight: 650; }.geo-task-item .geo-result { display: block; margin: 8px 0 0; padding: 8px 10px; border: 1px solid #e7eaf0; border-radius: 6px; background: #fafbfc; color: #5c6574; }.geo-task-item footer { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }.geo-task-item footer form { margin: 0; }.geo-task-item .outline-action { min-height: 28px; padding: 4px 9px; font-size: 11px; }.geo-task-item .outline-action .ui-icon { width: 13px; height: 13px; } .donut.empty-donut { background: #e8ecf2; }.bar-chart i.empty-bar { min-height: 2px; background: #dce2ea; } .balance-action { display: inline-block; }.balance-action > summary { cursor: pointer; color: #5e51c7; text-decoration: underline dotted; text-underline-offset: 3px; } .toast { position: fixed; z-index: 300; left: 50%; bottom: 34px; transform: translateX(-50%); max-width: min(480px,calc(100vw - 32px)); padding: 11px 18px; border-radius: 5px; color: #fff; background: rgba(37,46,61,.94); box-shadow: 0 12px 30px rgba(20,29,44,.25); animation: toast-in .2s ease; } @keyframes toast-in { from { opacity: 0; transform: translate(-50%,8px); } } .brand-mark { width: 72px; height: 72px; overflow: hidden; border: 1px solid rgba(255,255,255,.34); border-radius: 22px; background: rgba(255,255,255,.1); } .brand-mark img { width: 78px; height: 78px; margin: -3px; object-fit: contain; filter: drop-shadow(0 8px 14px rgba(12,20,55,.25)); } @media (max-width: 1500px) { .content { padding: 27px 24px 40px; } .content:not(.content-dashboard) { padding: 8px 15px 40px; } .metric-card strong { font-size: 25px; } .metric-card.sunset strong { font-size: 22px; } } @media (max-width: 1120px) { .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.metric-card.sunset { grid-column: span 2; } .dashboard-chart-grid { grid-template-columns: 1fr; }.topbar-actions { gap: 10px; }.backend-link { display: none; } .modal-two-col { grid-template-columns: 1fr; }.geo-panel { grid-template-columns: 1fr; } } @media (max-width: 760px) { .app-shell { grid-template: 46px minmax(0,1fr) / 1fr; }.topbar { height: 46px; grid-template-columns: 54px minmax(0,1fr) auto; }.wordmark { grid-column: 2; grid-row: 1; height: 46px; background: transparent; }.menu-toggle { grid-column: 1; grid-row: 1; height: 46px; }.topbar-spacer { display: none; }.topbar-actions { grid-column: 3; grid-row: 1; }.quota-pill, .backend-link, .user-name { display: none; } .sidebar { position: fixed; z-index: 80; top: 46px; left: 0; width: 230px; height: calc(100vh - 46px); transform: translateX(0); box-shadow: 12px 0 26px rgba(34,41,76,.25); }.content { grid-row: 2; grid-column: 1; padding: 13px; }.app-shell[data-sidebar="closed"] { grid-template-columns: 1fr; }.app-shell[data-sidebar="closed"] .topbar { grid-template-columns: 54px minmax(0,1fr) auto; }.app-shell[data-sidebar="closed"] .sidebar { transform: translateX(-100%); }.app-shell[data-sidebar="closed"] .wordmark span, .app-shell[data-sidebar="closed"] .sidebar b { display: block; } .metric-grid, .metric-grid.compact { grid-template-columns: 1fr; }.metric-card.sunset { grid-column: auto; }.dashboard-chart-grid .panel { min-height: 280px; } .table-toolbar { align-items: flex-start; gap: 10px; }.toolbar-left, .toolbar-right { flex-wrap: wrap; }.filter-pop.order-filter { width: min(560px,calc(100vw - 28px)); grid-template-columns: 1fr; } .modal-form { padding: 16px 18px 0; }.modal-form > label, .modal-two-col > label { grid-template-columns: 1fr; gap: 5px; }.modal-form > label > span:first-child, .modal-two-col > label > span:first-child { padding: 0; text-align: left; }.modal-two-col > label > small { grid-column: 1; margin-top: 0; }.modal-form footer { margin: 18px -18px 0; }.modal-tip, .field-help { margin-left: 0; } .cloud-workspace, .profile-workspace { padding: 18px 14px; }.cloud-fields label, .profile-form label { grid-template-columns: 1fr; gap: 5px; }.cloud-fields label > span, .profile-form label > span { text-align: left; }.config-submit { margin-left: 0; }.profile-form footer { padding-left: 0; }.profile-title { margin: -18px -14px 20px; } .table-footer { flex-wrap: wrap; }.table-footer > span:nth-child(2) { margin-left: 0; }.table-footer nav { width: 100%; } } /* Final icon and interaction calibration: keep after replica rules. */ .ui-icon { --icon:none; display:inline-block; flex:0 0 auto; width:1em; height:1em; background-color:currentColor; -webkit-mask-image:var(--icon); mask-image:var(--icon); -webkit-mask-position:center; mask-position:center; -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; vertical-align:-.12em; } .menu-toggle .ui-icon{width:19px;height:19px}.logout-btn .ui-icon{width:18px;height:18px} .quota-pill,.backend-link,.user-name{display:inline-flex;align-items:center;gap:6px}.quota-pill .ui-icon{width:12px;height:12px;color:#72f5e7}.backend-link .ui-icon{width:14px;height:14px}.user-avatar{color:#42cdb1}.user-avatar .ui-icon{width:17px;height:17px}.quota-gem,.user-glyph,.user-avatar img{display:none} .sidebar a{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;column-gap:14px;padding:0 18px}.sidebar .nav-icon{width:17px;height:17px;margin:0;color:rgba(255,255,255,.94);opacity:1;filter:none;transform:none}.sidebar a:hover .nav-icon,.sidebar a.active .nav-icon{color:#fff;transform:none}.app-shell[data-sidebar="closed"] .sidebar a{grid-template-columns:18px;justify-content:center;padding:0}.app-shell[data-sidebar="closed"] .sidebar .nav-icon{width:17px;height:17px} .metric-icon{top:19px;right:18px;width:27px;height:27px;overflow:visible;border:1px solid rgba(255,255,255,.27);border-radius:50%;background:rgba(255,255,255,.13);box-shadow:0 0 14px rgba(74,255,210,.2)}.metric-icon .ui-icon{width:15px;height:15px;color:#65f1ca;filter:drop-shadow(0 0 4px rgba(60,255,204,.6))}.metric-icon img{display:none}.stat-icon{position:absolute;top:18px;right:20px;width:25px;height:25px;color:#49d8b9;opacity:.92;filter:drop-shadow(0 2px 5px rgba(45,201,170,.2))} .tool-btn,.view-btn,.search-toggle,.test-model-btn,.outline-action{gap:6px}.tool-btn .ui-icon{width:14px;height:14px}.tool-btn.refresh .ui-icon{width:17px;height:17px}.view-btn .ui-icon,.search-toggle .ui-icon{width:16px;height:16px;color:#596573}.toolbar-right>.view-btn::before,.toolbar-right>.view-btn::after,.search-toggle::before,.search-toggle::after{display:none!important}.view-btn.active{color:#6b52df;border-color:#bdb2ef;background:#f1edff}.circle-action .ui-icon{width:14px;height:14px;color:#fff}.circle-action.refresh-action{background:#5f90ef}.modal-close .ui-icon{width:18px;height:18px}.enter-portal .ui-icon{width:14px;height:14px} .table-compact .data-table th,.table-compact .data-table td{height:40px;padding-top:7px;padding-bottom:7px}.bulk-actions{padding:6px 16px}.table-footer nav{align-items:center}.table-footer nav button{border-radius:0}.table-footer nav .page-current{display:grid;place-items:center;min-width:54px;height:34px;color:#fff;background:#454566}.table-footer nav button:disabled{color:#a8afb9;background:#f7f8fa;cursor:not-allowed} @media (max-width:760px){.sidebar a{grid-template-columns:18px minmax(0,1fr);padding:0 18px}.portal-metrics{grid-template-columns:1fr}.portal-grid{grid-template-columns:1fr}.api-config-row{grid-template-columns:1fr;align-items:start}.api-config-row .check-line{justify-self:start}} .brand-mark{display:grid;place-items:center;color:#fff}.brand-mark>.ui-icon{width:38px;height:38px;filter:drop-shadow(0 8px 14px rgba(12,20,55,.25))}.brand-mark img{display:none} .ui-icon-layout-dashboard{--icon:url('/static/img/icons/ui/layout-dashboard.svg')}.ui-icon-building-2{--icon:url('/static/img/icons/ui/building-2.svg')}.ui-icon-bot{--icon:url('/static/img/icons/ui/bot.svg')}.ui-icon-cloud-cog{--icon:url('/static/img/icons/ui/cloud-cog.svg')}.ui-icon-newspaper{--icon:url('/static/img/icons/ui/newspaper.svg')}.ui-icon-radio-tower{--icon:url('/static/img/icons/ui/radio-tower.svg')}.ui-icon-briefcase-business{--icon:url('/static/img/icons/ui/briefcase-business.svg')}.ui-icon-id-card{--icon:url('/static/img/icons/ui/id-card.svg')}.ui-icon-key-round{--icon:url('/static/img/icons/ui/key-round.svg')}.ui-icon-user-round{--icon:url('/static/img/icons/ui/user-round.svg')} .ui-icon-menu{--icon:url('/static/img/icons/ui/menu.svg')}.ui-icon-gem{--icon:url('/static/img/icons/ui/gem.svg')}.ui-icon-badge-check{--icon:url('/static/img/icons/ui/badge-check.svg')}.ui-icon-shield-check{--icon:url('/static/img/icons/ui/shield-check.svg')}.ui-icon-log-out{--icon:url('/static/img/icons/ui/log-out.svg')}.ui-icon-circle-user-round{--icon:url('/static/img/icons/ui/circle-user-round.svg')}.ui-icon-users-round{--icon:url('/static/img/icons/ui/users-round.svg')}.ui-icon-file-pen-line{--icon:url('/static/img/icons/ui/file-pen-line.svg')}.ui-icon-cloud-upload{--icon:url('/static/img/icons/ui/cloud-upload.svg')}.ui-icon-wallet-cards{--icon:url('/static/img/icons/ui/wallet-cards.svg')}.ui-icon-file-text{--icon:url('/static/img/icons/ui/file-text.svg')}.ui-icon-sparkles{--icon:url('/static/img/icons/ui/sparkles.svg')} .ui-icon-search{--icon:url('/static/img/icons/ui/search.svg')}.ui-icon-refresh-cw{--icon:url('/static/img/icons/ui/refresh-cw.svg')}.ui-icon-plus{--icon:url('/static/img/icons/ui/plus.svg')}.ui-icon-trash-2{--icon:url('/static/img/icons/ui/trash-2.svg')}.ui-icon-list{--icon:url('/static/img/icons/ui/list.svg')}.ui-icon-grid-2x2{--icon:url('/static/img/icons/ui/grid-2x2.svg')}.ui-icon-download{--icon:url('/static/img/icons/ui/download.svg')}.ui-icon-pencil{--icon:url('/static/img/icons/ui/pencil.svg')}.ui-icon-x{--icon:url('/static/img/icons/ui/x.svg')}.ui-icon-link{--icon:url('/static/img/icons/ui/link.svg')}.ui-icon-log-in{--icon:url('/static/img/icons/ui/log-in.svg')}.ui-icon-pause{--icon:url('/static/img/icons/ui/pause.svg')}.ui-icon-play{--icon:url('/static/img/icons/ui/play.svg')}.ui-icon-circle-dollar-sign{--icon:url('/static/img/icons/ui/circle-dollar-sign.svg')}.ui-icon-database-zap{--icon:url('/static/img/icons/ui/database-zap.svg')}.ui-icon-columns-3-cog{--icon:url('/static/img/icons/ui/columns-3-cog.svg')}.ui-icon-eye{--icon:url('/static/img/icons/ui/eye.svg')}.ui-icon-message-square-warning{--icon:url('/static/img/icons/ui/message-square-warning.svg')}.ui-icon-chevron-left{--icon:url('/static/img/icons/ui/chevron-left.svg')} .ui-icon-circle-help{--icon:url('/static/img/icons/ui/circle-help.svg')}.ui-icon-paperclip{--icon:url('/static/img/icons/ui/paperclip.svg')}.ui-icon-image{--icon:url('/static/img/icons/ui/image.svg')}.ui-icon-copy{--icon:url('/static/img/icons/ui/copy.svg')}.ui-icon-folder{--icon:url('/static/img/icons/ui/folder.svg')}.ui-icon-chevron-right{--icon:url('/static/img/icons/ui/chevron-right.svg')}.ui-icon-chevron-down{--icon:url('/static/img/icons/ui/chevron-down.svg')} .ui-icon-contact{--icon:url('/static/img/icons/ui/contact.svg')} /* Source comparison calibration — 2026-08-23 */ .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important} .sidebar a{grid-template-columns:15px minmax(0,1fr);column-gap:8px;padding:0 14px;font-size:14px}.sidebar .nav-icon{width:15px;height:15px}.sidebar b{font-weight:600} .metric-icon{top:18px;right:17px;width:30px;height:30px;border-color:rgba(255,255,255,.36);background:rgba(255,255,255,.16);box-shadow:0 0 12px rgba(255,255,255,.2)}.metric-icon .ui-icon{width:16px;height:16px;color:rgba(255,255,255,.96);filter:drop-shadow(0 0 4px rgba(255,255,255,.35))}.metric-card:nth-child(1) .metric-icon{background:rgba(183,142,255,.26);box-shadow:0 0 14px rgba(237,215,255,.42)}.metric-card:nth-child(2) .metric-icon{background:rgba(79,218,106,.28)}.metric-card:nth-child(3) .metric-icon{background:rgba(119,182,255,.25)}.metric-card:nth-child(4) .metric-icon{background:rgba(255,211,169,.22)}.metric-card:nth-child(5) .metric-icon{background:rgba(255,179,211,.24)} .stat-icon-wrap{position:absolute;top:16px;right:18px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%}.stat-icon-wrap .ui-icon{width:17px;height:17px}.stat-icon-wrap.question{color:#8e6cef;background:#f0ebff}.stat-icon-wrap.collected{color:#fff;background:#ef8994}.stat-icon-wrap.platform{color:#fff;background:#23c89b}.stat-icon-wrap.keywords{color:#fff;background:#43c635} .model-platform-badge{display:inline-flex;padding:2px 7px;border-radius:2px;color:#fff;background:#efad2a;font-size:11px;font-weight:700}.article-link{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:4px;color:#fff;background:linear-gradient(100deg,#5d51d9,#9a36c3);font-weight:700}.review-action-cell{display:flex;align-items:center;justify-content:center;gap:7px}.review-action-cell>.round-actions{display:none}.review-action-cell:hover>.round-actions,.review-action-cell:focus-within>.round-actions{display:flex} .content-media .status-completed::before,.content-influencer .status-completed::before{background:#ff5b52}.content-media .status-queued::before,.content-influencer .status-queued::before{background:#1db99b}.content-media .status-rejected::before,.content-influencer .status-rejected::before{background:#f4a51f}.content-b2b .status-completed::before{background:#1db99b}.title-cell{text-align:center!important} .content-cloud{padding:27px 39px 40px!important}.cloud-page-title{max-width:1184px;margin:0 0 20px;color:#3f4650;font-size:20px;line-height:1}.cloud-workspace{max-width:1184px;min-height:0;padding:0 25px 38px;border-top:3px solid #4aa7e9;box-shadow:none}.cloud-form{max-width:none}.cloud-fields{gap:0}.cloud-fields label{grid-template-columns:280px minmax(0,1fr);min-height:67px;gap:18px;border-bottom:1px solid #edf0f3}.cloud-fields label>span{color:#313842;font-weight:600;text-align:left}.cloud-fields input{min-height:34px;border-radius:0}.config-submit{display:flex;width:340px;margin:40px auto 0}.advanced-config{max-width:960px;margin:28px auto 0;border-top:1px solid #e8ebef}.advanced-config>summary{padding:14px 0;color:#7162d5;font-weight:700}.advanced-config-body{display:grid;gap:18px;padding:8px 0 0}.advanced-settings-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.advanced-settings-form label{display:grid;gap:5px}.advanced-settings-form input{min-height:36px;border:1px solid #dfe3e8;border-radius:4px;padding:0 10px}.advanced-settings-form .outline-action{align-self:end}.advanced-config .api-config-section,.advanced-config .api-connection-strip{max-width:none;margin-top:0} .cloud-fields input,.profile-form input{background:#fff}.cloud-fields input:-webkit-autofill,.cloud-fields input:-webkit-autofill:hover,.cloud-fields input:-webkit-autofill:focus,.profile-form input:-webkit-autofill,.profile-form input:-webkit-autofill:hover,.profile-form input:-webkit-autofill:focus{-webkit-text-fill-color:#4c5561!important;-webkit-box-shadow:0 0 0 1000px #fff inset!important;transition:background-color 9999s ease-out 0s}.profile-form input[readonly]:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #f6f7f9 inset!important} .content-profile{padding:16px 16px 40px!important}.profile-workspace{max-width:1348px;min-height:calc(100vh - 66px);padding:0 36px 42px;border-top:3px solid #4aa7e9;box-shadow:none}.profile-title{margin:0 -20px 0;padding:13px 0 12px 0;border:0}.profile-title h2{font-size:14px;font-weight:500}.profile-logo{display:grid;place-items:center;min-height:176px}.profile-image-uploader{display:grid;justify-items:center;gap:7px;cursor:pointer}.profile-image-uploader>input{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0}.profile-image-frame{position:relative;display:grid;place-items:center;width:112px;height:112px;overflow:hidden;border:2px solid #dce2ea;border-radius:50%;background:#fff;box-shadow:0 4px 16px rgba(34,49,78,.08)}.profile-image-frame img{width:100%;height:100%;object-fit:contain}.profile-image-overlay{position:absolute;inset:auto 0 0;display:flex;align-items:center;justify-content:center;gap:5px;min-height:34px;color:#fff!important;background:rgba(36,43,55,.72);font-size:12px;opacity:0;transition:opacity .18s}.profile-image-overlay .ui-icon{width:14px;height:14px}.profile-image-uploader:hover .profile-image-overlay,.profile-image-uploader:focus-within .profile-image-overlay{opacity:1}.profile-image-uploader>small{color:#8792a5;font-size:12px;font-weight:400}.profile-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 66px;max-width:1120px}.profile-form label{grid-template-columns:104px minmax(0,1fr);gap:14px}.profile-form label>span{color:#313842;font-weight:600}.profile-form input{min-height:34px}.profile-form .profile-wide{grid-column:1/-1;grid-template-columns:104px minmax(0,1fr)}.profile-form footer.profile-wide{grid-column:1/-1;padding:0 0 0 118px}.profile-form footer .primary-btn{min-width:150px} .toolbar-batch{display:inline-flex;align-items:center;gap:5px;padding:0}.toolbar-batch button{min-height:34px;border:0;border-radius:18px;padding:0 13px;color:#fff;background:#638cef;font-size:12px;cursor:pointer}.toolbar-batch button.pause{color:#fff;border:0;background:#f05247}.content-keywords .table-toolbar{padding-right:16px}.content-keywords .toolbar-left{gap:5px;min-width:0}.content-keywords .toolbar-right{flex:0 0 auto}.switch-control{position:relative;display:inline-flex;width:29px;height:19px;border:0;border-radius:12px;padding:0;background:#cbd1d8;cursor:pointer;vertical-align:middle}.switch-control span{position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:left .15s}.switch-control.on{background:#21b99c}.switch-control.on span{left:12px}.content-keywords td form{margin:0} .portal-actions{display:flex;flex-wrap:wrap;gap:9px;padding:0 24px 20px}.portal-actions form{margin:0}.portal-action{display:inline-flex;align-items:center;gap:6px;min-height:34px;border:1px solid #dcdff0;border-radius:18px;padding:0 14px;color:#6858ca;background:#fff;cursor:pointer;font-weight:700}.portal-action .ui-icon{width:15px;height:15px} @media(max-width:1500px){.content-cloud{padding-left:24px!important;padding-right:24px!important}.profile-form{gap:26px 34px}.toolbar-batch button{padding:0 10px;font-size:11px}} @media(max-width:1120px){.profile-form{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-form .profile-wide{grid-column:1/-1}.toolbar-batch{flex-wrap:wrap}} @media(max-width:760px){.sidebar a{grid-template-columns:15px minmax(0,1fr);column-gap:8px;padding:0 14px}.content-cloud,.content-profile{padding:13px!important}.cloud-page-title{margin-bottom:14px}.cloud-workspace,.profile-workspace{padding:0 14px 26px}.cloud-fields label,.profile-form label,.profile-form .profile-wide{grid-template-columns:1fr;gap:5px}.cloud-fields label{padding:10px 0}.profile-form{grid-template-columns:1fr}.profile-form .profile-wide{grid-column:1}.profile-form footer.profile-wide{padding:0}.advanced-settings-form{grid-template-columns:1fr}.profile-logo{height:120px}} /* Source-style window controls for every application modal. */ .app-modal > header{user-select:none} .app-modal > header > strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .modal-window-controls{display:flex;align-items:stretch;align-self:stretch;margin:0 -10px 0 auto} .modal-window-control{position:relative;display:grid;place-items:center;width:31px;min-width:31px;height:100%;margin:0;padding:0;border:0;border-radius:0;color:#fff;background:transparent;cursor:pointer;transition:background .15s ease} .modal-window-control:hover{background:rgba(255,255,255,.16);transform:none} .modal-window-control.modal-close:hover{background:#f05a68;transform:none} .modal-window-control > span{position:relative;display:block;width:12px;height:12px} .modal-window-control.modal-minimize > span::before{content:"";position:absolute;left:1px;right:1px;bottom:2px;height:1px;background:currentColor} .modal-window-control.modal-maximize > span::before{content:"";position:absolute;inset:1px;border:1px solid currentColor} .modal-window-control.modal-maximize.is-restore > span::before{inset:3px 0 0 3px} .modal-window-control.modal-maximize.is-restore > span::after{content:"";position:absolute;inset:0 3px 3px 0;border:1px solid currentColor;background:#8571ef} .modal-window-control.modal-close .ui-icon{width:14px;height:14px} .app-modal.is-maximized{left:230px;top:50px;right:0;bottom:0;width:auto;height:calc(100vh - 50px);max-height:none;transform:none;border-radius:0;box-shadow:0 6px 24px rgba(29,38,71,.2)} .app-shell[data-sidebar="closed"] .app-modal.is-maximized{left:52px} .app-modal.is-maximized > header{height:44px} .app-modal.is-maximized .modal-form{height:calc(100vh - 94px);max-height:calc(100vh - 94px);padding-top:20px} .app-modal.is-maximized .modal-form footer{padding-bottom:13px} details.modal-window-maximized > .modal-backdrop{background:transparent;backdrop-filter:none;pointer-events:none} .app-modal.is-minimized{left:auto;top:auto;right:18px;bottom:18px;width:min(340px,calc(100vw - 36px));height:44px;max-height:44px;transform:none;border-radius:3px;box-shadow:0 12px 30px rgba(24,35,59,.28)} .app-modal.is-minimized > header{height:44px} .app-modal.is-minimized > :not(header){display:none!important} details.modal-window-minimized > .modal-backdrop{display:none} @media(max-width:760px){.app-modal.is-maximized,.app-shell[data-sidebar="closed"] .app-modal.is-maximized{left:0;top:46px;height:calc(100vh - 46px)}.app-modal.is-maximized .modal-form{height:calc(100vh - 90px);max-height:calc(100vh - 90px)}} /* Enterprise list and pagination calibrated to the source table. */ .content-enterprises .table-wrap{overflow-x:hidden} .content-enterprises .data-table{width:100%;min-width:0;table-layout:fixed} .content-enterprises .data-table th,.content-enterprises .data-table td{overflow:hidden;padding-left:8px;padding-right:8px;text-overflow:ellipsis} .content-enterprises .data-table th:first-child,.content-enterprises .data-table td:first-child{overflow:hidden;padding-left:0;padding-right:0;text-overflow:clip} .content-enterprises .data-table td:nth-child(6),.content-enterprises .data-table td:nth-child(12){overflow:visible} .content-enterprises .data-table th:nth-child(1){width:2.5%}.content-enterprises .data-table th:nth-child(2){width:5%}.content-enterprises .data-table th:nth-child(3){width:10%}.content-enterprises .data-table th:nth-child(4){width:16%}.content-enterprises .data-table th:nth-child(5){width:5.5%}.content-enterprises .data-table th:nth-child(6){width:6.5%}.content-enterprises .data-table th:nth-child(7){width:5.5%}.content-enterprises .data-table th:nth-child(8){width:8.5%}.content-enterprises .data-table th:nth-child(9){width:14%}.content-enterprises .data-table th:nth-child(10){width:7%}.content-enterprises .data-table th:nth-child(11){width:9%}.content-enterprises .data-table th:nth-child(12){width:10.5%} .content-enterprises .data-table td:nth-child(3),.content-enterprises .data-table td:nth-child(4),.content-enterprises .data-table td:nth-child(5),.content-enterprises .data-table td:nth-child(6){color:#2f3640} .pricing-page{display:grid;gap:18px}.pricing-head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 26px;border:1px solid #e5e9f3;border-radius:12px;background:linear-gradient(125deg,#fff 0%,#f7faff 64%,#eef4ff 100%);box-shadow:0 7px 22px rgba(47,73,124,.06)}.pricing-kicker{color:#476fe8;font-size:11px;font-weight:900;letter-spacing:.16em}.pricing-head h1{margin:6px 0 7px;color:#263958;font-size:26px}.pricing-head p{margin:0;color:#778397;font-size:13px}.pricing-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.pricing-metrics article{position:relative;overflow:hidden;padding:18px 20px;border:1px solid #e6eaf2;border-radius:10px;background:#fff;box-shadow:0 5px 16px rgba(47,73,124,.05)}.pricing-metrics article:before{content:"";position:absolute;left:0;top:0;width:4px;height:100%;background:linear-gradient(#5c7cf3,#8d62df)}.pricing-metrics span,.pricing-metrics small{display:block;color:#8390a3;font-size:12px}.pricing-metrics strong{display:block;margin:8px 0 5px;color:#263958;font-size:28px}.pricing-form{display:grid;gap:16px}.pricing-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 16px;border:1px solid #dce5fb;border-radius:9px;background:#f4f7ff}.pricing-tip{display:flex;align-items:center;gap:7px;color:#60718d;font-size:13px}.pricing-tip .ui-icon{width:16px;height:16px;color:#5875dc}.pricing-toolbar .primary-btn{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}.pricing-toolbar .primary-btn .ui-icon{width:15px;height:15px}.pricing-group{overflow:hidden;border:1px solid #e5e8ef;border-radius:10px;background:#fff;box-shadow:0 5px 16px rgba(47,73,124,.045)}.pricing-group>header{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid #edf0f5;background:#fafbfe}.pricing-group>header h2{margin:0;color:#34425a;font-size:16px}.pricing-group>header span{color:#8b95a5;font-size:12px}.pricing-table{table-layout:fixed;white-space:normal}.pricing-table th:nth-child(1){width:17%}.pricing-table th:nth-child(2){width:10%}.pricing-table th:nth-child(3){width:14%}.pricing-table th:nth-child(4){width:16%}.pricing-table th:nth-child(5){width:12%}.pricing-table th:nth-child(6){width:31%}.pricing-table td:first-child strong,.pricing-table td:first-child small,.pricing-table td:nth-child(5) strong,.pricing-table td:nth-child(5) small{display:block}.pricing-table td:first-child small{margin-top:3px;color:#a0a8b6;font-family:Consolas,monospace;font-size:10px}.pricing-unit{display:inline-flex;padding:4px 9px;border-radius:12px;color:#5b6c84;background:#f0f3f8;font-size:11px}.price-input{display:inline-flex;align-items:center;overflow:hidden;border:1px solid #d8deea;border-radius:7px;background:#fff}.price-input:focus-within{border-color:#6d73e5;box-shadow:0 0 0 3px rgba(109,115,229,.11)}.price-input input{width:82px;height:35px;border:0;padding:0 8px;color:#34425a;background:transparent;text-align:center;font-weight:800;outline:0}.price-input span{height:35px;padding:9px 9px;color:#78869a;background:#f5f7fa;font-size:11px}.pricing-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer}.pricing-switch input{position:absolute;opacity:0;pointer-events:none}.pricing-switch>span{position:relative;width:34px;height:20px;border-radius:12px;background:#c9d0da;transition:.15s}.pricing-switch>span:after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.15s}.pricing-switch input:checked+span{background:#20b89a}.pricing-switch input:checked+span:after{left:17px}.pricing-switch b{color:#7a8596;font-size:11px}.pricing-switch input:checked~b{color:#13957d}.pricing-consumed{color:#5b4fd3}.pricing-description{color:#778397!important;text-align:left!important;line-height:1.55}.point-change{display:inline-flex;min-width:66px;justify-content:center;padding:4px 8px;border-radius:12px;font-size:11px;font-weight:800}.point-change.charge{color:#d45462;background:#fff0f2}.point-change.refund{color:#168a70;background:#e9faf5}.pricing-ledger{margin-bottom:18px}@media(max-width:1100px){.pricing-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.pricing-table{min-width:980px}}@media(max-width:760px){.pricing-head,.pricing-toolbar{align-items:stretch;flex-direction:column}.pricing-metrics{grid-template-columns:1fr 1fr}.pricing-toolbar .primary-btn{justify-content:center}} .content-enterprises .balance-action > summary{color:#2f3640;text-decoration:none}.content-enterprises .balance-action > summary:hover{color:#6858ca} .enterprise-avatar,.content-enterprises .avatar-dot{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:0;object-fit:contain;color:#fff;background:#9cace9;font-size:15px;line-height:30px} .content-enterprises tbody tr:nth-child(4n+2) .avatar-dot{background:#dec78e}.content-enterprises tbody tr:nth-child(4n+3) .avatar-dot{background:#91b2df}.content-enterprises tbody tr:nth-child(4n) .avatar-dot{background:#a99ee8} .table-footer > span:nth-child(2){margin-left:0}.table-footer nav{margin-left:auto}.table-footer .page-numbers{display:flex}.table-footer nav .page-number{min-width:35px;padding:0 9px;border-radius:0}.table-footer nav .page-number.active{color:#fff;background:#454566}.table-footer nav input{margin-left:6px} @media(max-width:760px){.table-footer nav{margin-left:0}.content-enterprises .data-table{min-width:0;font-size:11px}.content-enterprises .data-table th,.content-enterprises .data-table td{padding-left:3px;padding-right:3px}.content-enterprises .circle-action{width:24px;height:24px}} /* 全后台共享服务端分页 */ .shared-pagination{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:44px;padding:14px 0 0;color:#69768b;font-size:12px}.shared-pagination-summary{margin-right:auto}.shared-pagination-summary b{color:#26344c}.shared-page-size label{display:flex;align-items:center;gap:6px;white-space:nowrap}.shared-page-size select{height:34px;border:1px solid #d8e0eb;border-radius:7px;padding:0 26px 0 10px;color:#46546c;background:#fff;outline:none}.shared-page-size select:focus{border-color:#6378e8;box-shadow:0 0 0 3px rgba(99,120,232,.1)}.shared-page-nav{display:flex}.shared-page-nav a,.shared-page-nav span{display:grid;place-items:center;box-sizing:border-box;min-width:34px;height:34px;margin-left:-1px;border:1px solid #dbe2ec;padding:0 9px;color:#536178;background:#fff;text-decoration:none}.shared-page-nav a:first-child,.shared-page-nav span:first-child{border-radius:7px 0 0 7px}.shared-page-nav a:last-child,.shared-page-nav span:last-child{border-radius:0 7px 7px 0}.shared-page-nav a:hover{position:relative;border-color:#6975e8;color:#5366da;background:#f3f4ff}.shared-page-nav a.active{position:relative;z-index:1;border-color:#665be2;color:#fff;background:linear-gradient(135deg,#5678eb,#7553df);font-weight:700}.shared-page-nav .disabled,.shared-page-nav .ellipsis{color:#a8b1bf;background:#f8fafc}.shared-page-jump{display:flex}.shared-page-jump input{box-sizing:border-box;width:58px;height:34px;border:1px solid #d8e0eb;border-radius:7px 0 0 7px;padding:0 7px;outline:none}.shared-page-jump button{height:34px;border:1px solid #d8e0eb;border-left:0;border-radius:0 7px 7px 0;padding:0 11px;color:#57657b;background:#fff;cursor:pointer}.shared-page-jump button:hover{color:#fff;border-color:#665be2;background:#665be2} @media(max-width:900px){.shared-pagination{align-items:flex-start;flex-wrap:wrap}.shared-pagination-summary{flex-basis:100%;margin-right:0}.shared-page-nav{order:4;overflow:auto;max-width:100%}} /* 独立品牌资源：横版 Logo 与正方形 Logo 分开上传、分开使用。 */ .profile-logo{display:grid;place-items:stretch;min-height:0;padding:18px 0 26px}.profile-logo-intro{display:grid;gap:4px;margin-bottom:15px;text-align:left}.profile-logo-intro strong{color:#253248;font-size:16px}.profile-logo-intro span{color:#8792a5;font-size:12px}.profile-logo-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:880px}.profile-logo-card{display:grid;grid-template-rows:auto 1fr auto;justify-items:center;gap:12px;min-height:220px;padding:20px;border:1px solid #e1e7f0;border-radius:12px;background:linear-gradient(145deg,#fff,#f8faff);box-shadow:0 8px 24px rgba(42,58,96,.05)}.profile-logo-card .profile-brand-heading{gap:4px}.profile-image-frame-wide{width:270px;height:76px;border-radius:12px}.profile-image-frame-square{width:104px;height:104px;border-radius:18px}.profile-image-frame[hidden],.profile-image-frame img[hidden],.profile-logo-placeholder[hidden]{display:none}.profile-logo-placeholder{display:grid;place-items:center;box-sizing:border-box;width:100%;height:100%;padding:8px 14px;color:#fff;background:linear-gradient(135deg,#428de6,#6f52df);font-size:20px;font-weight:800;letter-spacing:.04em;text-align:center}.profile-logo-placeholder-square{color:#5e67e5;background:#f0f2ff}.profile-logo-placeholder-square .ui-icon{width:34px;height:34px}.profile-logo-card .profile-logo-remove{align-self:end}.profile-logo-card .profile-image-uploader>small{max-width:290px;text-align:center} @media(max-width:900px){.profile-logo-grid{grid-template-columns:1fr}.profile-logo-card{min-height:205px}.profile-image-frame-wide{max-width:100%}} /* 企业编辑弹窗：操作栏始终可见，避免滚动后找不到保存按钮。 */ .enterprise-modal .modal-form{box-sizing:border-box;padding-bottom:74px}.enterprise-modal .modal-form>footer{position:absolute;z-index:3;right:0;bottom:0;left:0;margin:0;padding:13px 18px;background:#f8fafc;box-shadow:0 -8px 18px rgba(35,48,75,.07)}.enterprise-balance-field{margin-top:2px!important}.enterprise-balance-field>div{min-width:0}.enterprise-balance-field input[readonly]{color:#727d8e;background:#f3f5f8} @media(max-width:760px){.enterprise-modal .modal-form{padding-bottom:72px}.enterprise-modal .modal-form>footer{margin:0}}