/* Admin settings workspace * Keep status actions in the sticky top command bar. Configuration summaries remain * full-width document content so they never become a detached side panel while scrolling. */ :is(.admin-drawing-settings, .admin-runtime-policy, .admin-access-settings, .admin-email-settings, .admin-storage-settings, .admin-ark-settings, .admin-intercept-settings, .admin-third-party-settings) :is(.admin-drawing-overview, .admin-runtime-policy-overview, .admin-access-overview, .admin-email-overview, .admin-storage-overview, .admin-ark-overview, .admin-intercept-overview, .admin-third-party-overview) .admin-stat-tile { min-height: 88px; padding: 14px 16px; } /* Appearance management follows the same full-width settings document used by storage and access pages. */ .admin-appearance-settings { padding-bottom: 24px; } .admin-appearance-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-appearance-settings .admin-settings-section-summary, .admin-appearance-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-appearance-brand-section { border-color: color-mix(in srgb, var(--foreground) 22%, var(--admin-card-border)) !important; } .admin-appearance-brand-section > .admin-settings-section-summary { background: color-mix(in srgb, var(--foreground) 3%, var(--admin-layer-1)); } .admin-appearance-brand-section > .admin-settings-section-summary h2 { font-size: 16px; letter-spacing: -0.01em; } .admin-appearance-command-bar { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--admin-divider); padding: 0 0 10px; transition: border-color 180ms ease; } .admin-appearance-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 42%, var(--admin-divider)); } .admin-appearance-command-copy, .admin-appearance-command-actions, .admin-appearance-load-error { display: flex; align-items: center; } .admin-appearance-command-copy { min-width: 0; } .admin-appearance-command-copy strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-appearance-command-copy p { margin-top: 1px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.5; } .admin-appearance-command-actions { flex: 0 0 auto; gap: 8px; } .admin-appearance-brand-layout, .admin-appearance-auth-layout { display: grid; gap: 20px; padding: 20px; } .admin-appearance-brand-layout { grid-template-columns: minmax(0, 1fr) minmax(360px, 0.8fr); align-items: start; } .admin-appearance-auth-layout { grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); align-items: start; } .admin-appearance-form, .admin-appearance-auth-controls, .admin-appearance-media-list, .admin-appearance-brand-logo { min-width: 0; } .admin-appearance-form .ant-form-item:last-child { margin-bottom: 0; } .admin-appearance-brand-logo { display: grid; align-self: stretch; } .admin-appearance-logo-stack { align-self: start; gap: 12px; } .admin-appearance-logo-frame-option { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid var(--admin-card-border); border-radius: var(--r-md); background: var(--admin-layer-2); padding: 13px 14px; } .admin-appearance-logo-frame-copy { min-width: 0; } .admin-appearance-logo-frame-copy strong { color: var(--admin-text-primary); font-size: var(--fs-caption); font-weight: 650; } .admin-appearance-logo-frame-copy p { max-width: 520px; margin: 5px 0 0; color: var(--admin-text-muted); font-size: var(--fs-label); line-height: 1.55; } .admin-appearance-logo-frame-control { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; } .admin-appearance-logo-frame-control > span { color: var(--admin-text-muted); font-size: 10px; font-weight: 600; white-space: nowrap; } .admin-appearance-logo-frame-option [data-slot="switch"][data-state="off"] { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 16%, transparent); } .admin-appearance-logo-frame-option [data-slot="switch"][data-state="on"] { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-switch-checked-bg) 70%, var(--foreground)), 0 0 0 2px color-mix(in srgb, var(--control-switch-checked-bg) 15%, transparent); } .admin-appearance-logo-preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .admin-appearance-logo-preview { display: grid; min-height: 104px; place-items: center; gap: 8px; border: 1px solid var(--admin-card-border); border-radius: var(--r-md); padding: 14px; } .admin-appearance-logo-preview.is-light { background: var(--color-neutral-50); color: var(--color-neutral-900); } .admin-appearance-logo-preview.is-dark { background: var(--color-neutral-900); color: var(--color-neutral-50); } .admin-appearance-logo-preview-mark { display: grid; width: 44px; height: 44px; place-items: center; border-radius: var(--r-md); background: currentColor; box-shadow: var(--shadow-sm); } .admin-appearance-logo-preview-mark.is-unframed { border-radius: 0; background: transparent; box-shadow: none; } .admin-appearance-logo-preview-mark img { width: 28px; height: 28px; object-fit: contain; } .admin-appearance-logo-preview-mark.is-unframed img { width: 100%; height: 100%; } .admin-appearance-logo-preview-label { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-label); font-weight: 600; } .admin-appearance-logo-preview-label svg { width: 13px; height: 13px; } .admin-appearance-auth-controls, .admin-appearance-media-list { display: grid; gap: 12px; } .admin-appearance-media-list { margin-top: 4px; } .admin-appearance-video-autoplay-option { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid var(--admin-card-border); border-radius: var(--r-md); background: var(--admin-layer-2); padding: 12px 14px; } .admin-appearance-video-autoplay-copy { display: grid; gap: 4px; min-width: 0; } .admin-appearance-video-autoplay-copy strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-appearance-video-autoplay-copy small, .admin-appearance-video-autoplay-control > span { color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-appearance-video-autoplay-control { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; } .admin-appearance-video-autoplay-control > span { font-size: 10px; font-weight: 600; white-space: nowrap; } .admin-appearance-asset-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 84px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 13px 14px; } .admin-appearance-brand-logo .admin-appearance-asset-row { min-height: 96px; } .admin-appearance-asset-icon, .admin-appearance-load-error-icon { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); border-radius: 8px; background: var(--admin-layer-1); color: var(--admin-text-secondary); } .admin-appearance-asset-icon { width: 36px; height: 36px; } .admin-appearance-asset-icon svg { width: 16px; height: 16px; } .admin-appearance-asset-copy { display: grid; gap: 3px; min-width: 0; } .admin-appearance-asset-copy strong, .admin-appearance-skin-note > span { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-appearance-asset-copy small, .admin-appearance-skin-note small, .admin-appearance-preview > p { color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-appearance-asset-copy em { overflow: hidden; color: var(--admin-status-info); font-size: 11px; font-style: normal; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; } .admin-appearance-asset-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; } .admin-appearance-asset-actions input { display: none; } .admin-appearance-preview { display: grid; gap: 12px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-2); padding: 12px; } .admin-appearance-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .admin-appearance-preview-heading > div { display: grid; min-width: 0; } .admin-appearance-preview-heading span { color: var(--admin-text-muted); font-size: 10px; } .admin-appearance-preview-heading strong { overflow: hidden; color: var(--admin-text-primary); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; } .admin-appearance-preview-stage { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 8px; background: #08090c; color: #fff; } .admin-appearance-preview-stage video, .admin-appearance-preview-shade { position: absolute; inset: 0; width: 100%; height: 100%; } .admin-appearance-preview-stage video { object-fit: cover; } .admin-appearance-preview-shade { background: linear-gradient(180deg, rgb(4 5 8 / 0.52), transparent 42%, rgb(4 5 8 / 0.8)); } .admin-appearance-preview-brand { position: absolute; top: 18px; left: 18px; display: flex; align-items: center; gap: 8px; max-width: calc(100% - 36px); font-size: 12px; } .admin-appearance-preview-brand img { width: 26px; height: 26px; flex: 0 0 auto; object-fit: contain; } .admin-appearance-preview-brand strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-appearance-preview-copy { position: absolute; right: 18px; bottom: 22px; left: 18px; display: grid; gap: 8px; } .admin-appearance-preview-copy small { color: rgb(255 255 255 / 0.58); font-size: 10px; font-weight: 700; letter-spacing: 0.16em; } .admin-appearance-preview-copy strong, .admin-appearance-preview-copy > span { white-space: pre-line; } .admin-appearance-preview-copy strong { font-size: clamp(23px, 2.2vw, 31px); line-height: 1.22; } .admin-appearance-preview-copy > span { color: rgb(255 255 255 / 0.66); font-size: 11px; line-height: 1.55; } .admin-appearance-preview > p { margin: 0; } .admin-appearance-skin-note { display: grid; gap: 6px; padding: 20px; } .admin-appearance-skin-note strong { color: var(--admin-text-primary); font-size: 14px; } .admin-appearance-section-form, .admin-appearance-skin-library { padding: 20px; } .admin-appearance-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } .admin-appearance-footer-settings { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 0.72fr); align-items: start; gap: 20px; } .admin-appearance-skin-library { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } .admin-appearance-skin-card { position: relative; display: grid; min-width: 0; min-height: 148px; grid-template-rows: 76px auto; gap: 11px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-2); padding: 10px; color: var(--admin-text-primary); text-align: left; transition: border-color var(--motion-state) ease-out, background-color var(--motion-state) ease-out, transform var(--motion-state) var(--ease-aceternity); } .admin-appearance-skin-card:hover:not(:disabled) { border-color: color-mix(in srgb, var(--workspace-accent) 48%, var(--admin-card-border)); background: var(--admin-layer-3); transform: translateY(-1px); } .admin-appearance-skin-card:focus-visible { outline: 2px solid color-mix(in srgb, var(--ring) 70%, transparent); outline-offset: 2px; } .admin-appearance-skin-card.is-selected { border-color: color-mix(in srgb, var(--workspace-accent) 74%, var(--admin-card-border)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--workspace-accent) 42%, transparent); } .admin-appearance-skin-card-preview { display: block; overflow: hidden; border: 1px solid color-mix(in srgb, var(--foreground) 12%, transparent); border-radius: calc(var(--r-md) - 2px); background: #090a0d; padding: 12px; } .admin-appearance-skin-card-surface { display: flex; height: 100%; align-items: flex-end; gap: 7px; border-radius: calc(var(--r-sm) - 1px); background: #111318; padding: 11px; } .admin-appearance-skin-card-surface i { width: 13px; height: 13px; border-radius: var(--r-full); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12); } .admin-appearance-skin-card-copy { display: grid; gap: 3px; min-width: 0; } .admin-appearance-skin-card-copy strong { overflow: hidden; font-size: var(--fs-caption); font-weight: 650; text-overflow: ellipsis; white-space: nowrap; } .admin-appearance-skin-card-copy small { overflow: hidden; color: var(--admin-text-muted); font-size: var(--fs-label); text-overflow: ellipsis; white-space: nowrap; } .admin-appearance-skin-card-check { position: absolute; top: 8px; right: 8px; display: grid; width: 20px; height: 20px; place-items: center; border-radius: var(--r-full); background: var(--btn-solid-bg); color: var(--btn-solid-fg); } .admin-appearance-skin-card:not(.is-selected) .admin-appearance-skin-card-check { display: none; } .admin-appearance-skin-card-check svg { width: 12px; height: 12px; stroke-width: 2.4; } .admin-appearance-skin-library-note { grid-column: 1 / -1; margin: 2px 0 0; color: var(--admin-text-muted); font-size: var(--fs-label); line-height: 1.6; } /* Editable skin library: one document-style workspace, consistent with the other * admin settings modules. Theme cards select the active draft; edits stay local * until the shared page command bar saves the complete appearance document. */ .admin-skin-workspace { display: grid; gap: 18px; padding: 20px; } .admin-skin-library-toolbar, .admin-skin-library-toolbar > div, .admin-skin-editor-heading, .admin-skin-mode-bar, .admin-skin-mode-bar > div, .admin-skin-locked-note { display: flex; align-items: center; } .admin-skin-library-toolbar, .admin-skin-editor-heading, .admin-skin-mode-bar { justify-content: space-between; gap: 16px; } .admin-skin-library-toolbar > div:first-child, .admin-skin-mode-bar > div:first-child, .admin-skin-editor-heading > div { min-width: 0; align-items: flex-start; flex-direction: column; gap: 2px; } .admin-skin-library-toolbar > div:last-child { flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 8px; } .admin-skin-library-toolbar strong, .admin-skin-mode-bar strong, .admin-skin-editor-heading strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-skin-library-toolbar span, .admin-skin-mode-bar span, .admin-skin-editor-heading > div > span { color: var(--admin-text-muted); font-size: 10px; line-height: 1.5; } .admin-skin-library { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; } .admin-skin-card { position: relative; min-width: 0; overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-2); transition: border-color var(--motion-state) ease-out, background-color var(--motion-state) ease-out, transform var(--motion-state) var(--ease-aceternity); } .admin-skin-card:hover { border-color: color-mix(in srgb, var(--workspace-accent) 46%, var(--admin-card-border)); transform: translateY(calc(-1 * var(--theme-hover-lift))); } .admin-skin-card.is-selected { border-color: color-mix(in srgb, var(--workspace-accent) 76%, var(--admin-card-border)); background: color-mix(in srgb, var(--workspace-accent) 5%, var(--admin-layer-2)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--workspace-accent) 36%, transparent); } .admin-skin-card-select { position: relative; display: grid; width: 100%; min-width: 0; grid-template-rows: 68px auto; gap: 10px; border: 0; background: transparent; padding: 9px 9px 8px; color: var(--admin-text-primary); text-align: left; } .admin-skin-card-select:focus-visible { outline: var(--focus-ring-width) solid color-mix(in srgb, var(--ring) 72%, transparent); outline-offset: -3px; } .admin-skin-card-preview { display: block; overflow: hidden; border: 1px solid color-mix(in srgb, white 11%, transparent); padding: 9px; } .admin-skin-card-preview > span { display: flex; height: 100%; overflow: hidden; align-items: center; gap: 4px; padding: 9px; } .admin-skin-card-preview i { width: 10px; height: 22px; flex: 0 0 10px; border-radius: var(--r-full); box-shadow: 0 0 0 1px rgb(255 255 255 / 0.14); } .admin-skin-card-copy { display: grid; min-width: 0; gap: 2px; padding-right: 22px; } .admin-skin-card-copy strong, .admin-skin-card-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-skin-card-copy strong { font-size: 12px; font-weight: 650; } .admin-skin-card-copy small { color: var(--admin-text-muted); font-size: 10px; } .admin-skin-card-check, .admin-skin-card-lock { position: absolute; right: 9px; display: grid; place-items: center; } .admin-skin-card-check { top: 9px; width: 20px; height: 20px; border-radius: var(--r-full); background: var(--btn-solid-bg); color: var(--btn-solid-fg); } .admin-skin-card-check svg { width: 12px; height: 12px; } .admin-skin-card-lock { right: 10px; bottom: 45px; width: 14px; color: var(--admin-text-muted); } .admin-skin-card-actions { display: flex; min-height: 34px; align-items: center; justify-content: flex-end; gap: 2px; border-top: 1px solid var(--admin-divider); padding: 3px 6px; } .admin-skin-delete-button.ant-btn:not(:disabled) { border-color: var(--destructive); background: var(--destructive) !important; color: var(--destructive-foreground); box-shadow: none; } .admin-skin-delete-button.ant-btn:not(:disabled):hover, .admin-skin-delete-button.ant-btn:not(:disabled):focus-visible { border-color: var(--destructive-hover); background: var(--destructive-hover) !important; color: var(--destructive-foreground) !important; } .admin-skin-delete-button.ant-btn:not(:disabled):active { border-color: var(--destructive-active); background: var(--destructive-active) !important; } .admin-skin-editor { display: grid; gap: 16px; border-top: 1px solid var(--admin-divider); padding-top: 18px; } .admin-skin-editor-heading > div { display: flex; } .admin-skin-editor-heading strong { overflow: hidden; max-width: 60ch; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; } .admin-skin-locked-note { align-items: flex-start; gap: 9px; border: 1px solid var(--admin-card-border); border-radius: var(--r-md); background: var(--admin-layer-2); padding: 11px 12px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-skin-locked-note svg { flex: 0 0 auto; margin-top: 1px; color: var(--icon-muted); } .admin-skin-identity-form { border: 1px solid var(--admin-card-border); border-radius: var(--r-md); background: var(--admin-layer-2); padding: 14px; } .admin-skin-mode-bar { min-height: 40px; } .admin-skin-mode-label { display: inline-flex; align-items: center; gap: 6px; } .admin-skin-mode-label svg { width: 13px; height: 13px; } .admin-skin-live-preview { border: 1px solid; padding: 16px; transition: background-color var(--motion-state) ease-out, border-color var(--motion-state) ease-out; } .admin-skin-live-preview-card { display: grid; min-height: 168px; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 9px 12px; border: 1px solid; padding: 14px; } .admin-skin-live-preview-icon { display: grid; width: 38px; height: 38px; place-items: center; } .admin-skin-live-preview-icon svg { width: var(--icon-size); height: var(--icon-size); } .admin-skin-live-preview-card > div { display: grid; gap: 2px; } .admin-skin-live-preview-card > div strong { font-size: 12px; } .admin-skin-live-preview-card > div small { font-size: 10px; } .admin-skin-live-preview-status { padding: 4px 7px; font-size: 10px; font-weight: 650; } .admin-skin-live-preview-menu { display: inline-flex; min-width: 86px; height: 30px; grid-column: 1 / -1; align-items: center; padding: 0 10px; font-size: 10px; font-weight: 600; } .admin-skin-live-preview-input, .admin-skin-live-preview-button { display: inline-flex; align-items: center; border-style: solid; padding: 0 12px; font-size: 11px; } .admin-skin-live-preview-switches { display: flex; grid-column: 2; align-items: center; gap: 8px; } .admin-skin-live-preview-switches > i { position: relative; width: 34px; height: 20px; border-radius: var(--r-full); } .admin-skin-live-preview-switches b { position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: var(--r-full); box-shadow: 0 1px 2px #00000033; } .admin-skin-live-preview-switches > i.is-on b { left: 17px; } .admin-skin-live-preview-danger { display: inline-flex; min-width: 58px; height: 28px; grid-column: 3; align-items: center; justify-content: center; padding: 0 10px; font-size: 10px; font-weight: 650; } .admin-skin-live-preview-input { grid-column: 2; } .admin-skin-live-preview-button { grid-column: 3; justify-content: center; } .admin-skin-live-preview-signals { display: flex; grid-column: 1; grid-row: 2; flex-wrap: wrap; gap: 4px; } .admin-skin-live-preview-signals i { width: 6px; height: 6px; border-radius: var(--r-full); } .admin-skin-color-groups { display: grid; gap: 10px; } .admin-skin-token-group { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-md); background: var(--admin-layer-1); } .admin-skin-token-group > summary { display: flex; min-height: 46px; cursor: pointer; list-style: none; align-items: center; justify-content: space-between; gap: 12px; background: color-mix(in srgb, var(--foreground) 2%, var(--admin-layer-1)); padding: 0 14px; } .admin-skin-token-group > summary::-webkit-details-marker { display: none; } .admin-skin-token-group > summary:focus-visible { outline: var(--focus-ring-width) solid color-mix(in srgb, var(--ring) 68%, transparent); outline-offset: -3px; } .admin-skin-token-group > summary span { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-skin-token-group > summary small { color: var(--admin-text-muted); font-size: 10px; } .admin-skin-color-grid, .admin-skin-component-grid { display: grid; gap: 10px; border-top: 1px solid var(--admin-divider); padding: 12px; } .admin-skin-color-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .admin-skin-color-field { display: grid; min-width: 0; gap: 7px; border: 1px solid var(--admin-card-border); border-radius: var(--r-sm); background: var(--admin-layer-2); padding: 9px; } .admin-skin-color-field > span:first-child { display: grid; min-width: 0; gap: 1px; } .admin-skin-color-field strong { color: var(--admin-text-secondary); font-size: 11px; font-weight: 650; } .admin-skin-color-field small { overflow: hidden; color: var(--admin-text-muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; } .admin-skin-color-control { display: grid; min-width: 0; grid-template-columns: 32px minmax(0, 1fr); gap: 6px; } .admin-skin-color-control input[type="color"] { width: 32px; height: 32px; cursor: pointer; border: 1px solid var(--admin-card-border); border-radius: var(--r-sm); background: transparent; padding: 2px; } .admin-skin-color-control input[type="color"]::-webkit-color-swatch { border: 0; border-radius: calc(var(--r-sm) - 3px); } .admin-skin-component-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .admin-skin-number-field { display: grid; min-width: 0; gap: 6px; } .admin-skin-number-field > span:first-child { color: var(--admin-text-secondary); font-size: 10px; font-weight: 650; } .admin-skin-number-field .ant-input-number, .admin-skin-number-field .ant-select { width: 100%; } .admin-appearance-load-error, .admin-appearance-loading-card { min-height: 150px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); padding: 20px; box-shadow: var(--admin-card-shadow); } .admin-appearance-load-error { gap: 12px; } .admin-appearance-load-error-icon { width: 32px; height: 32px; } .admin-appearance-load-error > div { min-width: 0; flex: 1 1 auto; } .admin-appearance-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-appearance-load-error p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } @media (max-width: 1120px) { .admin-appearance-brand-layout, .admin-appearance-auth-layout { grid-template-columns: 1fr; } .admin-appearance-preview { max-width: 480px; } .admin-appearance-footer-settings { grid-template-columns: 1fr; } .admin-appearance-skin-library { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-skin-library, .admin-skin-color-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-skin-component-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 720px) { .admin-appearance-command-bar { align-items: flex-start; flex-direction: column; } .admin-appearance-command-actions { width: 100%; flex-wrap: wrap; } .admin-appearance-asset-row { grid-template-columns: 36px minmax(0, 1fr); } .admin-appearance-logo-preview-grid { grid-template-columns: 1fr; } .admin-appearance-logo-frame-option { align-items: flex-start; flex-direction: column; } .admin-appearance-logo-frame-control { width: 100%; justify-content: space-between; } .admin-appearance-video-autoplay-option { align-items: flex-start; flex-direction: column; } .admin-appearance-video-autoplay-control { width: 100%; justify-content: space-between; } .admin-appearance-asset-actions { grid-column: 1 / -1; justify-content: flex-start; } .admin-appearance-form-grid, .admin-appearance-skin-library { grid-template-columns: 1fr; } .admin-skin-workspace { padding: 14px; } .admin-skin-library-toolbar, .admin-skin-mode-bar, .admin-skin-editor-heading { align-items: flex-start; flex-direction: column; } .admin-skin-library-toolbar > div:last-child { width: 100%; justify-content: flex-start; } .admin-skin-library, .admin-skin-color-grid, .admin-skin-component-grid { grid-template-columns: 1fr; } .admin-skin-live-preview-card { grid-template-columns: 38px minmax(0, 1fr); } .admin-skin-live-preview-status { grid-column: 2; justify-self: start; } .admin-skin-live-preview-input, .admin-skin-live-preview-button, .admin-skin-live-preview-switches, .admin-skin-live-preview-danger, .admin-skin-live-preview-menu { grid-column: 1 / -1; } } :is(.admin-drawing-settings, .admin-runtime-policy, .admin-access-settings, .admin-email-settings, .admin-storage-settings, .admin-ark-settings, .admin-intercept-settings, .admin-third-party-settings) :is(.admin-drawing-overview, .admin-runtime-policy-overview, .admin-access-overview, .admin-email-overview, .admin-storage-overview, .admin-ark-overview, .admin-intercept-overview, .admin-third-party-overview) .admin-stat-tile-value { margin-top: 5px; font-size: 18px; } :is(.admin-drawing-settings, .admin-runtime-policy, .admin-access-settings, .admin-email-settings, .admin-storage-settings, .admin-ark-settings, .admin-intercept-settings, .admin-third-party-settings) :is(.admin-drawing-overview, .admin-runtime-policy-overview, .admin-access-overview, .admin-email-overview, .admin-storage-overview, .admin-ark-overview, .admin-intercept-overview, .admin-third-party-overview) .admin-stat-tile-detail { margin-top: 5px; } /* 管理端专用视觉收口:不覆盖创作端 workspace 的导航、状态和图表样式。 */ .admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root { --admin-layer-0: var(--skin-admin-layer-0, #f5f5f5); --admin-layer-1: var(--skin-admin-layer-1, #ffffff); --admin-layer-2: var(--skin-admin-layer-2, #f6f6f6); --admin-layer-3: var(--skin-admin-layer-3, #ececec); --admin-sidebar: var(--admin-layer-0); --admin-text-primary: var(--foreground); --admin-text-secondary: color-mix(in srgb, var(--foreground) 72%, transparent); --admin-text-muted: color-mix(in srgb, var(--foreground) 52%, transparent); --admin-text-placeholder: color-mix(in srgb, var(--foreground) 42%, transparent); --admin-control-border: color-mix(in srgb, var(--foreground) 18%, transparent); --admin-divider: rgba(17, 17, 17, 0.12); --admin-card-border: rgba(17, 17, 17, 0.15); --admin-row-border: rgba(17, 17, 17, 0.09); --admin-row-hover: #f2f2f2; --admin-card-shadow: var(--theme-admin-card-shadow, 0 1px 2px rgba(17, 17, 17, 0.04)); --admin-status-success: var(--palette-status-success); --admin-status-warning: var(--palette-status-warning); --admin-status-error: var(--palette-status-error); --admin-status-info: var(--palette-status-loading); --admin-chart-primary: var(--workspace-accent); --admin-chart-secondary: oklch(0.55 0.11 180); --admin-chart-warning: oklch(0.64 0.14 78); --admin-sidebar-width: 224px; } .dark .admin-shell, .dark .admin-drawer, .dark .admin-secondary-drawer, .dark .admin-modal-root, .dark .admin-channel-modal-root { --admin-layer-0: var(--skin-admin-layer-0, #0f0f0f); --admin-layer-1: var(--skin-admin-layer-1, #181818); --admin-layer-2: var(--skin-admin-layer-2, #222222); --admin-layer-3: var(--skin-admin-layer-3, #2a2a2a); --admin-sidebar: var(--admin-layer-0); --admin-text-primary: var(--foreground); --admin-text-secondary: color-mix(in srgb, var(--foreground) 74%, transparent); --admin-text-muted: color-mix(in srgb, var(--foreground) 54%, transparent); --admin-text-placeholder: color-mix(in srgb, var(--foreground) 43%, transparent); --admin-control-border: color-mix(in srgb, var(--foreground) 18%, transparent); --admin-divider: rgba(255, 255, 255, 0.12); --admin-card-border: rgba(255, 255, 255, 0.16); --admin-row-border: rgba(255, 255, 255, 0.085); --admin-row-hover: #242424; --admin-card-shadow: var(--theme-admin-card-shadow, 0 1px 2px rgba(0, 0, 0, 0.32)); --admin-status-success: var(--palette-status-success); --admin-status-warning: var(--palette-status-warning); --admin-status-error: var(--palette-status-error); --admin-status-info: var(--palette-status-loading); --admin-chart-secondary: oklch(0.72 0.11 180); --admin-chart-warning: oklch(0.78 0.14 78); } .admin-shell { position: relative; } .admin-shell .admin-nav-group-label { display: flex; align-items: center; gap: 7px; margin-bottom: 6px !important; padding-inline: 2px !important; color: color-mix(in srgb, var(--foreground) 68%, transparent) !important; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; line-height: 16px; transition: color var(--motion-instant) ease-out; } .admin-shell .admin-nav-group-label::before { display: block; width: 5px; height: 5px; flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--admin-text-muted) 72%, transparent); border-radius: 999px; background: var(--admin-sidebar); content: ""; transition: border-color var(--motion-instant) ease-out, background-color var(--motion-instant) ease-out; } .admin-shell .admin-nav-group-label::after { display: block; height: 1px; min-width: 12px; flex: 1 1 auto; background: linear-gradient(90deg, color-mix(in srgb, var(--foreground) 14%, transparent), transparent); content: ""; } .admin-shell .admin-nav-group-label span { flex: 0 0 auto; } .admin-shell .admin-nav-group:has(.app-workspace-nav-link.is-active) .admin-nav-group-label { color: var(--admin-text-primary) !important; } .admin-shell .admin-nav-group:has(.app-workspace-nav-link.is-active) .admin-nav-group-label::before { border-color: var(--admin-text-primary); background: var(--admin-text-primary); } .admin-shell .app-workspace-nav-link { position: relative; height: 34px !important; border: 1px solid transparent; border-radius: var(--menu-radius); color: color-mix(in srgb, var(--foreground) 82%, transparent); font-size: 13px; font-weight: 500; } .admin-shell .app-workspace-brand-link { color: var(--foreground); } .admin-shell .app-workspace-nav-link.is-active { border-color: color-mix(in srgb, var(--foreground) 26%, transparent); background: var(--admin-layer-3); box-shadow: 0 1px 3px color-mix(in srgb, var(--foreground) 10%, transparent); color: var(--admin-text-primary); font-weight: 700; } .admin-shell .app-workspace-nav-link.is-active::before { display: block; } .admin-shell .app-workspace-nav-link:hover:not(.is-active) { border-color: color-mix(in srgb, var(--foreground) 16%, transparent); background: color-mix(in srgb, var(--admin-layer-3) 68%, var(--admin-sidebar)); color: var(--admin-text-primary); } .admin-shell .app-workspace-nav-link > svg { width: 16px; height: 16px; color: color-mix(in srgb, var(--foreground) 64%, transparent); stroke-width: 1.9; } .admin-shell .app-workspace-nav-link.is-active > svg { color: var(--admin-text-primary); } .admin-shell .app-workspace-nav-link:focus-visible, .admin-shell .app-workspace-icon-button:focus-visible { outline: 1px solid color-mix(in srgb, var(--ring) 58%, transparent); outline-offset: -1px; box-shadow: none; } .admin-shell .app-workspace-sidebar, .admin-shell .admin-sidebar { background: var(--admin-sidebar); border-radius: 0 !important; border-right: 1px solid var(--admin-divider); box-shadow: none; } /* 管理后台侧栏不复用通用 Tailwind 宽度:通用 sidebar 规则在后面会覆盖 w-*,导致视觉收缩但布局仍占展开宽度。 */ .admin-shell .admin-sidebar { width: var(--admin-sidebar-width); flex-basis: var(--admin-sidebar-width); } .admin-shell .admin-sidebar.is-collapsed { width: 64px; flex-basis: 64px; } .admin-shell .admin-sidebar-header { height: 68px; border-bottom: 0; background: var(--admin-sidebar); } .admin-shell .admin-sidebar-identity { padding: 10px 12px; border-bottom: 1px solid var(--admin-divider); background: var(--admin-sidebar); } .admin-shell .admin-sidebar-brand-button { display: grid; width: 100%; min-width: 0; grid-template-columns: clamp(34px, 2.2vw, 38px) minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 10px; padding: 7px 9px; border: 1px solid transparent; border-radius: 10px; color: var(--admin-text-primary); text-align: left; transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease; } .admin-shell .admin-sidebar-brand-button:hover { border-color: color-mix(in srgb, var(--foreground) 14%, transparent); background: var(--admin-layer-2); } .admin-shell .admin-sidebar-brand-button:focus-visible { outline: 2px solid color-mix(in srgb, var(--foreground) 36%, transparent); outline-offset: 2px; } .admin-shell .admin-sidebar-brand-mark { width: clamp(34px, 2.2vw, 38px); height: clamp(34px, 2.2vw, 38px); grid-column: 1; grid-row: 1 / 3; border-radius: 9px; box-shadow: 0 6px 16px color-mix(in srgb, var(--foreground) 12%, transparent); } .admin-shell .admin-sidebar-brand-title { min-width: 0; grid-column: 2; grid-row: 1; overflow: hidden; color: var(--admin-text-primary); font-size: 14px; font-weight: 650; line-height: 18px; text-overflow: ellipsis; } .admin-shell .admin-sidebar-brand-version { min-width: 0; grid-column: 2; grid-row: 2; overflow: hidden; color: var(--admin-text-muted); font-size: 10px; letter-spacing: 0; line-height: 14px; text-overflow: ellipsis; white-space: nowrap; } .admin-shell .admin-sidebar-brand-button.is-collapsed { grid-template-columns: 1fr; place-items: center; padding: 7px 0; } .admin-shell .admin-sidebar-brand-button.is-collapsed .admin-sidebar-brand-mark { width: 32px; height: 32px; grid-column: 1; grid-row: 1; } .admin-sidebar-edge-toggle { position: absolute; top: 50%; left: calc(var(--admin-sidebar-width) - 10px); z-index: 35; width: 20px; height: 36px; place-items: center; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-sidebar); color: var(--admin-text-muted); box-shadow: 0 0 0 3px var(--admin-sidebar); transform: translateY(-50%); transition: left var(--motion-state) var(--ease-aceternity), background-color var(--motion-instant) ease-out, border-color var(--motion-instant) ease-out, color var(--motion-instant) ease-out; } .admin-sidebar-edge-toggle.is-collapsed { left: 54px; } .admin-sidebar-edge-toggle:hover { border-color: var(--admin-control-border); background: var(--admin-layer-1); color: var(--admin-text-primary); } .admin-sidebar-edge-toggle:focus-visible { outline: 2px solid color-mix(in srgb, var(--ring) 72%, transparent); outline-offset: 2px; } .admin-shell .admin-sidebar-nav { padding: 6px 10px; } .admin-shell .admin-nav-group { margin-bottom: 0; } .admin-shell .admin-nav-group + .admin-nav-group { margin-top: 14px; } .admin-shell .admin-nav-group-items:not(.is-collapsed) { margin-left: 4px; padding-left: 9px; border-left: 1px solid color-mix(in srgb, var(--foreground) 13%, transparent); } .admin-shell .admin-nav-group-items:not(.is-collapsed) .app-workspace-nav-link { padding-left: 10px !important; } .admin-shell .admin-nav-collapsed-separator { width: 28px; height: 1px; margin: 8px auto; background: var(--admin-divider); } .admin-shell .admin-sidebar-footer { border-top: 1px solid var(--admin-divider); background: var(--admin-sidebar); padding: 9px 10px 10px; } .admin-shell .admin-sidebar-footer :is(button, a) { min-height: 34px; border-radius: 8px; color: var(--admin-text-muted); } .admin-shell .admin-sidebar-footer :is(button, a):hover { background: var(--admin-layer-2); color: var(--admin-text-primary); } .admin-shell .admin-sidebar.is-collapsed .admin-sidebar-nav, .admin-shell .admin-sidebar.is-collapsed .admin-sidebar-footer { padding-inline: 8px; } .admin-shell .admin-sidebar.is-collapsed .admin-sidebar-identity { padding-inline: 8px; } .admin-mobile-navigation { min-height: 54px; border-color: var(--admin-divider); background: color-mix(in srgb, var(--admin-sidebar) 94%, transparent); padding: 6px 10px; backdrop-filter: blur(14px); } .admin-mobile-navigation-trigger { display: inline-flex; min-width: 0; min-height: 42px; flex: 1 1 auto; align-items: center; gap: 9px; border: 0; border-radius: 8px; background: transparent; padding: 4px 8px; color: var(--admin-text-primary); transition: background-color var(--motion-instant) ease-out; } .admin-mobile-navigation-trigger:hover, .admin-mobile-navigation-trigger[aria-expanded="true"] { background: var(--admin-layer-2); } .admin-mobile-navigation-trigger:focus-visible, .admin-mobile-navigation-action:focus-visible { outline: 1px solid color-mix(in srgb, var(--ring) 62%, transparent); outline-offset: 1px; } .admin-mobile-navigation-current-icon, .admin-mobile-navigation-action { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-mobile-navigation-eyebrow, .admin-mobile-navigation-current-label { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-mobile-navigation-eyebrow { color: var(--admin-text-muted); font-size: 9px; font-weight: 650; letter-spacing: 0.06em; line-height: 1.25; } .admin-mobile-navigation-current-label { margin-top: 1px; color: var(--admin-text-primary); font-size: 13px; font-weight: 650; line-height: 1.35; } .admin-mobile-navigation-action { border: 0; background: transparent; transition: background-color var(--motion-instant) ease-out, color var(--motion-instant) ease-out; } .admin-mobile-navigation-action:hover { background: var(--admin-layer-2); color: var(--admin-text-primary); } .admin-mobile-navigation-menu { width: min(320px, calc(100vw - 20px)); max-height: min(72dvh, 620px); overflow-y: auto; } .admin-mobile-navigation-menu-link { display: flex; min-height: 34px; align-items: center; gap: 9px; } .admin-mobile-navigation-menu-link > svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--admin-text-muted); } .admin-shell .app-user-content, .admin-shell .app-workspace-page, .admin-shell .admin-page-root { background: var(--admin-layer-0); } .admin-shell .app-table-surface, .admin-shell .admin-table-surface, .admin-shell .ant-table-wrapper, .admin-shell .ant-table, .admin-shell .ant-table-container { background: var(--admin-layer-1); } .admin-shell .ant-input, .admin-shell .ant-input-affix-wrapper, .admin-shell .ant-select-selector, .admin-shell .ant-picker, .admin-shell .ant-input-number, .admin-shell .ant-input-number-input-wrap { background: var(--admin-layer-2) !important; } .admin-page-root > div { height: 100%; } .admin-page-root.admin-page-root-scrollable > div { height: auto; min-height: 100%; } .admin-page-frame { display: flex; height: 100%; min-height: 0; flex-direction: column; padding: 12px 16px 0; } .admin-page-frame-scrollable { height: auto; min-height: 100%; } .admin-page-header { min-height: 58px; border-bottom: 0; padding-bottom: 10px; } .admin-page-location { display: flex; min-width: 0; align-items: center; gap: 6px; font-size: 14px; line-height: 20px; } .admin-page-location-section { display: flex; align-items: center; min-height: 20px; margin: 0; padding: 0; flex: none; border-radius: 4px; color: var(--admin-text-muted); font-size: 14px; font-weight: 500; text-decoration: none; transition: color var(--motion-instant) ease-out, background-color var(--motion-instant) ease-out; } .admin-page-location-section:hover { color: var(--admin-text-primary); } .admin-page-location-section:focus-visible { outline: 2px solid color-mix(in srgb, var(--foreground) 46%, transparent); outline-offset: 3px; } .admin-page-location-separator { display: flex; align-items: center; min-height: 20px; margin: 0; padding: 0; flex: none; color: color-mix(in srgb, var(--admin-text-muted) 58%, transparent); font-size: 14px; font-weight: 400; } .admin-page-title { display: flex; align-items: center; min-height: 20px; margin: 0; padding: 0; min-width: 0; color: var(--admin-text-primary); font-size: 14px; font-weight: 600; line-height: 20px; } .admin-page-description { margin-top: 5px; color: var(--admin-text-muted); font-size: 13px; line-height: 1.55; } .admin-shell .admin-page-theme-toggle { width: 36px; height: 36px; min-height: 36px; border: 1px solid var(--admin-control-border); border-radius: 8px; background: var(--admin-layer-1); color: var(--admin-text-secondary); } .admin-shell .admin-page-theme-toggle:hover { border-color: color-mix(in srgb, var(--foreground) 28%, transparent); background: var(--admin-layer-2); color: var(--admin-text-primary); } .admin-shell .admin-page-actions .ant-btn { min-height: 36px; border-radius: 8px; } .admin-data-table { display: flex; width: 100%; min-height: 0; flex: 1 1 auto; flex-direction: column; } .admin-list-toolbar { flex: 0 0 auto; padding-top: 10px; padding-bottom: 10px; } .admin-list-toolbar-main .app-list-search { min-width: 180px; width: min(360px, 100%) !important; max-width: 360px; flex: 0 1 360px; } .admin-storage-resource-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; width: 100%; min-width: 0; } .admin-storage-resource-filters > *, .admin-storage-resource-filters .app-list-search { width: 100% !important; min-width: 0; max-width: none; } @media (min-width: 640px) { .admin-storage-resource-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (min-width: 1024px) { .admin-storage-resource-filters { grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.1fr); } } .admin-filter-toggle { display: inline-flex; flex: 0 0 auto; } .admin-list-toolbar-filters { display: none; flex: 0 0 auto; } .admin-list-toolbar-filters.is-open { display: flex; } .admin-list-toolbar-chips { display: inline-flex; min-width: 0; flex: 0 1 auto; flex-wrap: wrap; align-items: center; gap: 6px; } .admin-filter-chip { display: inline-flex; min-height: 26px; align-items: center; gap: 5px; border: 1px solid color-mix(in srgb, var(--foreground) 12%, transparent); border-radius: var(--r-full); background: color-mix(in srgb, var(--foreground) 5%, var(--admin-layer-1)); padding: 0 8px 0 9px; color: color-mix(in srgb, var(--foreground) 72%, transparent); font-size: 11px; line-height: 1; transition: background-color 160ms ease, color 160ms ease; } .admin-filter-chip:hover { background: color-mix(in srgb, var(--foreground) 10%, var(--admin-layer-1)); color: var(--foreground); } .admin-filter-chip:focus:not(:focus-visible) { outline: none; } .admin-filter-chip:focus-visible { outline: 1px solid color-mix(in srgb, var(--ring) 62%, transparent); outline-offset: 1px; } .admin-filter-active-dot { width: 5px; height: 5px; margin-left: 2px; border-radius: var(--r-full); background: var(--foreground); } .admin-shell .admin-batch-bar { border-color: var(--admin-card-border); background: color-mix(in srgb, var(--admin-layer-1) 94%, transparent); color: var(--admin-text-primary); box-shadow: var(--admin-card-shadow); } .admin-table-frame { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-table-surface { min-height: 0; flex: 1 1 auto; overflow: hidden; border-radius: 0; } .admin-table-scroll { height: 100%; overflow: auto; min-width: 100%; min-height: 0; } .admin-table-pagination { flex: 0 0 auto; min-height: 44px; border-top: 1px solid var(--admin-divider); background: var(--admin-layer-2); backdrop-filter: blur(10px); } .admin-table-pagination .app-pagination-bar { min-height: 44px; margin-top: 0 !important; } .admin-shell .admin-table-surface .ant-table-wrapper { min-width: 100%; } .admin-shell .admin-table-surface .ant-table-thead > tr > th, .admin-modal-root .admin-table-surface .ant-table-thead > tr > th { position: sticky; top: 0; z-index: 3; height: 42px; padding: 9px 16px !important; background: var(--admin-layer-2) !important; border-bottom: 1px solid var(--admin-card-border) !important; color: color-mix(in srgb, var(--foreground) 52%, transparent) !important; font-size: 11px; font-weight: 600; letter-spacing: 0.035em; } .admin-shell .admin-table-surface .ant-table-tbody > tr > td, .admin-modal-root .admin-table-surface .ant-table-tbody > tr > td { height: 52px; padding: 11px 16px !important; border-bottom: 1px solid var(--admin-row-border) !important; background: var(--admin-layer-1) !important; font-size: 13px; font-variant-numeric: tabular-nums; } .admin-shell .admin-table-surface .ant-table-tbody > tr.ant-table-measure-row > td, .admin-modal-root .admin-table-surface .ant-table-tbody > tr.ant-table-measure-row > td { height: 0 !important; padding: 0 !important; border: 0 !important; font-size: 0; line-height: 0; } .admin-shell .admin-table-surface .ant-table-tbody > tr:hover > td, .admin-modal-root .admin-table-surface .ant-table-tbody > tr:hover > td { background: var(--admin-row-hover) !important; } .admin-shell .admin-table-surface .ant-table-tbody > tr > td:first-child, .admin-modal-root .admin-table-surface .ant-table-tbody > tr > td:first-child { border-inline-start: 0; } .admin-shell .admin-logical-model-table .ant-table-tbody > tr > td { height: auto; vertical-align: top; } .admin-shell .admin-logical-model-table .admin-capability-summary-tag { max-width: 100%; margin-inline-end: 0; overflow-wrap: anywhere; border: 1px solid color-mix(in srgb, var(--foreground) 14%, transparent) !important; background: color-mix(in srgb, var(--foreground) 6%, var(--admin-layer-1)) !important; color: color-mix(in srgb, var(--foreground) 72%, transparent) !important; white-space: normal; } .admin-shell .admin-table-clickable-row { cursor: pointer; } .admin-shell .admin-table-pagination .ant-pagination-total-text { margin-inline-end: auto; color: color-mix(in srgb, var(--foreground) 55%, transparent); font-size: 11px; font-variant-numeric: tabular-nums; } .admin-pagination-bar { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 16px; } .admin-pagination-total { flex: 1 1 auto; min-width: 0; color: color-mix(in srgb, var(--foreground) 55%, transparent); font-size: 11px; font-variant-numeric: tabular-nums; white-space: nowrap; } .admin-pagination-bar .ant-pagination { display: flex; align-items: center; gap: 2px; margin: 0; } .admin-pagination-bar .ant-pagination-item, .admin-pagination-bar .ant-pagination-prev, .admin-pagination-bar .ant-pagination-next, .admin-pagination-bar .ant-pagination-jump-prev, .admin-pagination-bar .ant-pagination-jump-next { min-width: 26px; height: 26px; margin: 0; border: 0; border-radius: var(--r-sm); background: transparent; line-height: 26px; } .admin-pagination-bar .ant-pagination-item a, .admin-pagination-bar .ant-pagination-prev button, .admin-pagination-bar .ant-pagination-next button { color: color-mix(in srgb, var(--foreground) 62%, transparent); } .admin-pagination-bar .ant-pagination-item-active { background: color-mix(in srgb, var(--foreground) 9%, transparent); font-weight: 600; } .admin-pagination-bar .ant-pagination-item-active a { color: var(--foreground); } .admin-pagination-bar .ant-pagination-item:hover, .admin-pagination-bar .ant-pagination-prev:hover, .admin-pagination-bar .ant-pagination-next:hover { background: color-mix(in srgb, var(--foreground) 7%, transparent); } .admin-pagination-bar .ant-pagination-options { margin-inline-start: 8px; } .admin-pagination-bar .ant-pagination-options .ant-select { min-width: 88px; } .admin-pagination-bar .ant-pagination-options .ant-select-selector { min-height: 28px !important; border: 1px solid color-mix(in srgb, var(--foreground) 14%, transparent) !important; border-radius: var(--r-sm) !important; background: var(--admin-layer-2) !important; box-shadow: none !important; color: var(--foreground); } .admin-row-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; white-space: nowrap; } .admin-row-action.ant-btn { height: 30px; min-height: 30px; padding: 0 9px; border: 1px solid var(--admin-card-border); border-radius: 6px; background: var(--admin-layer-1) !important; box-shadow: none !important; color: var(--admin-text-secondary); font-size: 12px; font-weight: 550; line-height: 1; transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease !important; } .admin-row-action.ant-btn .ant-btn-icon { display: grid; margin-inline-end: 0; } .admin-row-action.ant-btn .ant-btn-icon > svg { width: 13px; height: 13px; } .admin-row-action.ant-btn:hover:not(:disabled), .admin-row-action.ant-btn:active:not(:disabled), .admin-row-action.ant-btn:focus:not(:disabled), .admin-row-action.ant-btn.ant-dropdown-open { border-color: var(--admin-control-border); background: var(--admin-layer-2) !important; color: var(--admin-text-primary); } .admin-row-action-primary.ant-btn { border-color: color-mix(in srgb, var(--admin-status-info) 30%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-info) 8%, var(--admin-layer-1)) !important; color: color-mix(in srgb, var(--admin-status-info) 68%, var(--admin-text-primary)); font-weight: 650; } .admin-row-action-primary.ant-btn:hover:not(:disabled), .admin-row-action-primary.ant-btn:focus:not(:disabled) { border-color: color-mix(in srgb, var(--admin-status-info) 52%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-info) 13%, var(--admin-layer-1)) !important; color: var(--admin-text-primary); } .admin-row-action-danger.ant-btn { border-color: color-mix(in srgb, var(--destructive) 24%, var(--admin-card-border)); background: color-mix(in srgb, var(--destructive) 6%, var(--admin-layer-1)) !important; color: var(--destructive); } .admin-row-action-more.ant-btn { display: inline-flex; align-items: center; gap: 3px; min-width: 54px; color: var(--admin-text-secondary); } .admin-row-action-chevron { width: 12px; height: 12px; flex: 0 0 auto; stroke-width: 1.75; } .admin-modal-data-table-shell { display: flex; height: min(58vh, 540px); min-height: 320px; } .admin-shell :where(button, .ant-btn, .ant-input, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus:not(:focus-visible), .admin-drawer :where(button, .ant-btn, .ant-input, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus:not(:focus-visible), .admin-secondary-drawer :where(button, .ant-btn, .ant-input, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus:not(:focus-visible), .admin-modal-root :where(button, .ant-btn, .ant-input, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus:not(:focus-visible), .admin-channel-modal-root :where(button, .ant-btn, .ant-input, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus:not(:focus-visible) { outline: none; box-shadow: none !important; } .admin-shell :where(.ant-btn, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus-visible, .admin-drawer :where(.ant-btn, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus-visible, .admin-secondary-drawer :where(.ant-btn, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus-visible, .admin-modal-root :where(.ant-btn, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus-visible, .admin-channel-modal-root :where(.ant-btn, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number):focus-visible { outline: 1px solid color-mix(in srgb, var(--ring) 62%, transparent); outline-offset: 1px; box-shadow: none !important; } .admin-shell :where(.ant-input-affix-wrapper-focused, .ant-picker-focused, .ant-input-number-focused), .admin-shell .ant-select-focused .ant-select-selector, .admin-drawer :where(.ant-input-affix-wrapper-focused, .ant-picker-focused, .ant-input-number-focused), .admin-drawer .ant-select-focused .ant-select-selector, .admin-secondary-drawer :where(.ant-input-affix-wrapper-focused, .ant-picker-focused, .ant-input-number-focused), .admin-secondary-drawer .ant-select-focused .ant-select-selector, .admin-modal-root :where(.ant-input-affix-wrapper-focused, .ant-picker-focused, .ant-input-number-focused), .admin-modal-root .ant-select-focused .ant-select-selector, .admin-channel-modal-root :where(.ant-input-affix-wrapper-focused, .ant-picker-focused, .ant-input-number-focused), .admin-channel-modal-root .ant-select-focused .ant-select-selector { border-color: color-mix(in srgb, var(--ring) 58%, transparent) !important; box-shadow: none !important; } .admin-status-badge { display: inline-flex; align-items: center; gap: 5px; min-height: 20px; border-radius: var(--r-full); background: color-mix(in srgb, currentColor 10%, transparent); padding: 2px 7px; color: color-mix(in srgb, var(--foreground) 62%, transparent); font-size: 11px; font-weight: 500; letter-spacing: 0.02em; line-height: 1.25; white-space: nowrap; } .admin-status-badge::before { width: 6px; height: 6px; flex: 0 0 auto; border-radius: var(--r-full); background: currentColor; content: ""; } .admin-status-badge[data-tone="success"] { color: var(--admin-status-success); } .admin-status-badge[data-tone="warning"] { color: var(--admin-status-warning); } .admin-status-badge[data-tone="error"] { color: var(--admin-status-error); } .admin-status-badge[data-tone="info"] { color: var(--admin-status-info); } .admin-stat-tile { min-width: 0; min-height: 112px; padding: 18px; background: linear-gradient(145deg, color-mix(in srgb, var(--foreground) 6%, var(--admin-layer-1)), var(--admin-layer-1) 70%); } .admin-stat-tile + .admin-stat-tile { border-left: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-stat-tile-label { color: color-mix(in srgb, var(--foreground) 55%, transparent); font-size: 12px; font-weight: 500; } .admin-stat-tile-value { margin-top: 7px; color: var(--foreground); font-size: 22px; font-variant-numeric: tabular-nums; font-weight: 650; line-height: 1.25; } .admin-stat-tile-detail { margin-top: 8px; color: color-mix(in srgb, var(--foreground) 45%, transparent); font-size: 11px; } .admin-settings-section { width: 100%; overflow: hidden; border: 0; border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-settings-section > :last-child { min-width: 0; } .admin-settings-section-summary { background: var(--admin-layer-2); } .admin-settings-section-content { background: var(--admin-layer-1); } .admin-settings-section-content .ant-form-item-label > label { color: var(--admin-text-secondary); font-size: 12px; font-weight: 600; } .admin-settings-section-content .ant-form-item-extra, .admin-settings-section-content .ant-form-item-explain { color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-settings-section-footer { border-top: 1px solid var(--admin-divider); background: var(--admin-layer-2); } .admin-feature-availability { padding-bottom: 24px; } .admin-feature-availability .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-feature-availability .admin-settings-section-summary, .admin-feature-availability .admin-settings-section-content { background: var(--admin-layer-1); } .admin-feature-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-feature-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-feature-command-copy, .admin-feature-command-actions, .admin-feature-load-error, .admin-feature-inline-alert { display: flex; align-items: center; } .admin-feature-command-copy { min-width: 0; gap: 11px; } .admin-feature-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-feature-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-feature-command-icon, .admin-feature-load-error-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-feature-command-actions { flex: 0 0 auto; gap: 8px; } .admin-feature-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-feature-board { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.94fr) minmax(0, 1fr); align-items: stretch; gap: 14px; } .admin-feature-domain { min-width: 0; overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-feature-board.is-loading .admin-feature-domain { min-height: 258px; padding: 18px; } .admin-feature-domain-header { display: flex; min-height: 66px; align-items: center; gap: 10px; padding: 11px 14px; } .admin-feature-domain-icon, .admin-feature-board-row-icon, .admin-feature-detail-icon { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-feature-domain-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-feature-domain-header h2 { color: var(--admin-text-primary); font-size: 14px; font-weight: 660; line-height: 1.4; } .admin-feature-domain-header p { margin-top: 2px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.4; } .admin-feature-domain-list { border-top: 1px solid var(--admin-divider); } .admin-feature-domain.is-compact .admin-feature-domain-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-feature-domain.is-compact .admin-feature-board-row:nth-child(odd) { border-right: 1px solid var(--admin-divider); } .admin-feature-domain.is-compact .admin-feature-board-row:nth-last-child(-n + 2) { border-bottom: 0; } .admin-feature-board-row { position: relative; display: grid; min-height: 58px; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; border-bottom: 1px solid var(--admin-divider); transition: background-color 160ms ease, box-shadow 160ms ease; } .admin-feature-board-row.is-source { grid-template-columns: minmax(0, 1fr) auto; } .admin-feature-board-row:last-child { border-bottom: 0; } .admin-feature-board-row:hover, .admin-feature-board-row.is-selected { background: color-mix(in srgb, var(--foreground) 4%, var(--admin-layer-1)); } .admin-feature-board-row.is-selected { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-text-primary) 24%, transparent); } .admin-feature-board-row.is-dirty { background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); } .admin-feature-board-row.is-dirty.is-selected { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 54%, transparent); } .admin-feature-board-row.is-readonly { background: color-mix(in srgb, var(--admin-layer-0) 20%, var(--admin-layer-1)); } .admin-feature-board-row-select { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 8px 8px 8px 14px; text-align: left; } .admin-feature-board-row-select:focus-visible, .admin-feature-board-source-selector button:focus-visible { position: relative; z-index: 2; outline: 2px solid var(--admin-focus-ring); outline-offset: -2px; } .admin-feature-board-row-icon { width: 30px; height: 30px; border-radius: 7px; } .admin-feature-board-row.is-off .admin-feature-board-row-icon { color: var(--admin-text-muted); } .admin-feature-board-row-name { display: flex; min-width: 0; flex-direction: column; } .admin-feature-board-row-name small { overflow: hidden; margin-bottom: 1px; color: var(--admin-text-muted); font-size: 9px; font-weight: 600; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; } .admin-feature-board-row-name strong { overflow: hidden; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; } .admin-feature-board-row-dirty { flex: 0 0 auto; border-radius: 999px; background: color-mix(in srgb, var(--admin-status-warning) 12%, transparent); padding: 2px 6px; color: color-mix(in srgb, var(--admin-status-warning) 82%, var(--admin-text-primary)); font-size: 9px; font-weight: 650; } .admin-feature-board-row-control, .admin-feature-board-runtime-status { display: flex; align-items: center; justify-content: flex-end; gap: 7px; padding: 8px 14px 8px 6px; } .admin-feature-board-row-control { min-width: 64px; } .admin-feature-board-runtime-status { min-width: 94px; } .admin-feature-board-row-control > span, .admin-feature-board-runtime-status > span { color: var(--admin-text-muted); font-size: 10px; font-weight: 600; white-space: nowrap; } .admin-feature-availability [data-slot="switch"][data-state="off"] { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 16%, transparent); } .admin-feature-availability [data-slot="switch"][data-state="on"] { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-switch-checked-bg) 70%, var(--foreground)), 0 0 0 2px color-mix(in srgb, var(--control-switch-checked-bg) 15%, transparent); } .admin-feature-board-row.is-dependent .admin-feature-board-row-select { padding-left: 32px; } .admin-feature-board-row.is-dependent .admin-feature-board-row-select::before { position: absolute; top: -20px; bottom: 50%; left: 17px; width: 10px; border-bottom: 1px solid color-mix(in srgb, var(--admin-text-muted) 54%, transparent); border-left: 1px solid color-mix(in srgb, var(--admin-text-muted) 54%, transparent); border-bottom-left-radius: 5px; content: ""; } .admin-feature-board-source-selector { display: grid; width: 178px; align-self: center; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; margin-right: 12px; border: 1px solid var(--admin-card-border); border-radius: 7px; background: var(--admin-layer-2); padding: 3px; } .admin-feature-board-source-selector button { min-height: 29px; border: 1px solid transparent; border-radius: 5px; padding: 0 7px; color: var(--admin-text-secondary); font-size: 10px; font-weight: 620; white-space: nowrap; transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, box-shadow 160ms ease; } .admin-feature-board-source-selector button:hover:not(:disabled) { color: var(--admin-text-primary); } .admin-feature-board-source-selector button.is-selected { border-color: color-mix(in srgb, var(--foreground) 16%, transparent); background: var(--admin-layer-1); color: var(--admin-text-primary); box-shadow: var(--admin-card-shadow); } .admin-feature-board-source-selector button:disabled { cursor: not-allowed; opacity: 0.55; } .admin-feature-detail { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-feature-detail.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 4%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-feature-detail-header { display: flex; min-height: 62px; align-items: center; gap: 10px; padding: 11px 15px; } .admin-feature-detail-icon { width: 34px; height: 34px; border-radius: 8px; } .admin-feature-detail-header p, .admin-feature-detail-cell > span { color: var(--admin-text-muted); font-size: 9px; font-weight: 620; letter-spacing: 0.035em; } .admin-feature-detail-header h2 { margin-top: 1px; color: var(--admin-text-primary); font-size: 14px; font-weight: 660; line-height: 1.45; } .admin-feature-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--admin-divider); } .admin-feature-detail-cell { min-width: 0; min-height: 78px; border-left: 1px solid var(--admin-divider); padding: 12px 15px; } .admin-feature-detail-cell:first-child { border-left: 0; } .admin-feature-detail-cell p { max-width: 720px; margin-top: 5px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.55; } .admin-feature-detail-cell.is-warning > span, .admin-feature-detail-cell.is-warning p { color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); } .admin-feature-load-error, .admin-feature-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-feature-load-error { justify-content: center; gap: 14px; } .admin-feature-load-error > div { max-width: 560px; flex: 1; } .admin-feature-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-feature-load-error p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.6; } .admin-feature-review > p { margin-bottom: 12px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-feature-review-list { display: grid; max-height: min(420px, 52vh); gap: 8px; overflow-y: auto; } .admin-feature-review-item { border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-feature-review-item > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .admin-feature-review-item strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-feature-review-item span { flex: 0 0 auto; color: var(--admin-text-secondary); font-size: 11px; font-weight: 600; } .admin-feature-review-item p { margin-top: 5px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-access-settings { padding-bottom: 24px; } .admin-access-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-access-settings .admin-settings-section-summary, .admin-access-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-access-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-access-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-access-command-copy, .admin-access-command-actions, .admin-access-inline-alert, .admin-access-load-error, .admin-access-registration-policy, .admin-access-footer-note, .admin-access-form-section-heading, .admin-access-switch-field, .admin-access-advanced > summary, .admin-access-confirm-row { display: flex; align-items: center; } .admin-access-command-copy { min-width: 0; gap: 11px; } .admin-access-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-access-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-access-command-icon, .admin-access-load-error-icon, .admin-access-policy-icon, .admin-access-advanced-icon { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-access-command-icon, .admin-access-load-error-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-access-command-actions { flex: 0 0 auto; gap: 8px; } .admin-access-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-access-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-access-overview .admin-stat-tile { min-height: 104px; background: var(--admin-layer-1); box-shadow: none; } .admin-access-overview .admin-stat-tile-value { overflow: hidden; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; } .admin-access-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-access-registration-policy { min-height: 112px; gap: 14px; padding: 18px 20px; } .admin-access-policy-icon { width: 38px; height: 38px; border-radius: 9px; } .admin-access-policy-copy { min-width: 0; flex: 1 1 auto; } .admin-access-policy-copy strong { color: var(--admin-text-primary); font-size: 14px; font-weight: 650; } .admin-access-policy-copy p { max-width: 920px; margin-top: 6px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-access-policy-copy > span { display: block; margin-top: 6px; color: var(--admin-text-muted); font-size: 11px; } .admin-access-form-section { padding: 18px 20px 4px; } .admin-access-form-section + .admin-access-form-section { border-top: 1px solid var(--admin-divider); } .admin-access-form-section-heading { gap: 10px; margin-bottom: 16px; } .admin-access-form-section-heading > span { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border: 1px solid var(--admin-card-border); border-radius: 7px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-access-form-section-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-access-form-section-heading p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-access-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; } .admin-access-form-grid .ant-form-item { min-width: 0; } .admin-access-form-span-full { grid-column: 1 / -1; } .admin-access-switch-field { min-height: 74px; justify-content: space-between; gap: 16px; margin-bottom: 18px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-access-switch-field label { color: var(--admin-text-secondary); font-size: 12px; font-weight: 600; } .admin-access-switch-field p { margin-top: 4px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-access-advanced { border-top: 1px solid var(--admin-divider); } .admin-access-advanced > summary { min-height: 68px; gap: 10px; cursor: pointer; padding: 12px 20px; list-style: none; transition: background-color 180ms ease; } .admin-access-advanced > summary::-webkit-details-marker { display: none; } .admin-access-advanced > summary:hover { background: color-mix(in srgb, var(--foreground) 3%, transparent); } .admin-access-advanced > summary:focus-visible { outline: 2px solid var(--admin-focus-ring); outline-offset: -2px; } .admin-access-advanced-icon { width: 30px; height: 30px; border-radius: 7px; } .admin-access-advanced > summary > span:nth-child(2) { min-width: 0; flex: 1 1 auto; } .admin-access-advanced strong, .admin-access-advanced small { display: block; } .admin-access-advanced strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-access-advanced small { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-access-advanced > .admin-access-form-grid { border-top: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--admin-layer-2) 48%, var(--admin-layer-1)); padding: 18px 20px 4px; } .admin-access-footer-note { min-width: 0; gap: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-access-load-error, .admin-access-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-access-load-error { justify-content: center; gap: 14px; } .admin-access-load-error > div { max-width: 560px; flex: 1; } .admin-access-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-access-load-error p, .admin-access-confirm-copy p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-access-confirm-copy p + p { margin-top: 8px; } .admin-access-confirm-row { justify-content: space-between; gap: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-access-confirm-row + .admin-access-confirm-row { margin-top: 8px; } .admin-access-confirm-row span { color: var(--admin-text-muted); font-size: 11px; } .admin-access-confirm-row strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; text-align: right; } .admin-email-settings { padding-bottom: 24px; } .admin-email-form-stack { display: flex; flex-direction: column; gap: 16px; } .admin-email-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-email-settings .admin-settings-section-summary, .admin-email-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-email-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-email-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-email-command-copy, .admin-email-command-actions, .admin-email-inline-alert, .admin-email-load-error, .admin-email-delivery-policy, .admin-email-footer-note, .admin-email-form-section-heading, .admin-email-confirm-row { display: flex; align-items: center; } .admin-email-command-copy { min-width: 0; gap: 11px; } .admin-email-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-email-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-email-command-icon, .admin-email-load-error-icon, .admin-email-policy-icon { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-email-command-icon, .admin-email-load-error-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-email-command-actions { flex: 0 0 auto; gap: 8px; } .admin-email-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-email-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-email-overview .admin-stat-tile { min-height: 104px; background: var(--admin-layer-1); box-shadow: none; } .admin-email-overview .admin-stat-tile-value, .admin-email-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-email-overview .admin-stat-tile-value { font-size: 20px; } .admin-email-delivery-policy { min-height: 116px; gap: 14px; padding: 18px 20px; } .admin-email-policy-icon { width: 38px; height: 38px; border-radius: 9px; } .admin-email-policy-copy { min-width: 0; flex: 1 1 auto; } .admin-email-policy-copy strong { color: var(--admin-text-primary); font-size: 14px; font-weight: 650; } .admin-email-policy-copy p { max-width: 980px; margin-top: 6px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-email-policy-copy > span { display: block; margin-top: 6px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-email-form-section { padding: 18px 20px 4px; } .admin-email-form-section + .admin-email-form-section { border-top: 1px solid var(--admin-divider); } .admin-email-form-section-heading { gap: 10px; margin-bottom: 16px; } .admin-email-form-section-heading > span { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border: 1px solid var(--admin-card-border); border-radius: 7px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-email-form-section-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-email-form-section-heading p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-email-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; } .admin-email-form-grid.is-connection { grid-template-columns: minmax(0, 1.5fr) minmax(150px, 0.5fr) minmax(0, 1fr); } .admin-email-form-grid .ant-form-item { min-width: 0; } .admin-email-form-grid .ant-input-number { width: 100%; } .admin-email-footer-note { min-width: 0; gap: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-email-load-error, .admin-email-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-email-load-error { justify-content: center; gap: 14px; } .admin-email-load-error > div { max-width: 560px; flex: 1; } .admin-email-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-email-load-error p, .admin-email-confirm-copy p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-email-confirm-copy p + p { margin-top: 8px; } .admin-email-confirm-row { justify-content: space-between; gap: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-email-confirm-row + .admin-email-confirm-row { margin-top: 8px; } .admin-email-confirm-row span { color: var(--admin-text-muted); font-size: 11px; } .admin-email-confirm-row strong { min-width: 0; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; text-align: right; } .admin-storage-settings { padding-bottom: 24px; } .admin-storage-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-storage-settings .admin-settings-section-summary, .admin-storage-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-storage-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-storage-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-storage-command-copy, .admin-storage-command-actions, .admin-storage-inline-alert, .admin-storage-history-note, .admin-storage-provider-note, .admin-storage-context-note, .admin-storage-footer-note, .admin-storage-form-section-heading, .admin-storage-load-error, .admin-storage-confirm-row { display: flex; align-items: center; } .admin-storage-command-copy { min-width: 0; gap: 11px; } .admin-storage-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-storage-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-storage-command-icon, .admin-storage-load-error-icon, .admin-storage-mode-icon, .admin-storage-form-section-heading > span { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-storage-command-icon, .admin-storage-load-error-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-storage-command-actions { flex: 0 0 auto; gap: 8px; } .admin-storage-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-storage-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-storage-overview .admin-stat-tile { min-height: 104px; background: var(--admin-layer-1); box-shadow: none; } .admin-storage-overview .admin-stat-tile-value, .admin-storage-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-storage-overview .admin-stat-tile-value { font-size: 20px; } .admin-storage-mode-content { padding: 18px 20px 20px; } .admin-storage-mode-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; } .admin-storage-mode-choice { position: relative; display: grid; min-width: 0; min-height: 118px; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 9px 10px; overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-2); padding: 14px; color: var(--admin-text-primary); text-align: left; transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; } .admin-storage-mode-choice:hover { border-color: color-mix(in srgb, var(--foreground) 22%, var(--admin-card-border)); background: var(--admin-layer-3); transform: translateY(-1px); } .admin-storage-mode-choice:focus-visible { outline: 2px solid var(--admin-focus-ring); outline-offset: 2px; } .admin-storage-mode-choice.is-selected { border-color: color-mix(in srgb, var(--foreground) 30%, var(--admin-card-border)); background: var(--admin-layer-1); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 8%, transparent); } .admin-storage-mode-choice:disabled { cursor: not-allowed; opacity: 0.58; transform: none; } .admin-storage-mode-icon { width: 34px; height: 34px; border-radius: 8px; } .admin-storage-mode-choice.is-selected .admin-storage-mode-icon { border-color: color-mix(in srgb, var(--foreground) 22%, transparent); background: var(--admin-layer-3); color: var(--admin-text-primary); } .admin-storage-mode-copy { min-width: 0; } .admin-storage-mode-copy strong, .admin-storage-mode-copy small { display: block; } .admin-storage-mode-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-storage-mode-copy small { margin-top: 5px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-storage-mode-choice > .admin-status-badge { align-self: end; justify-self: start; grid-column: 2; } .admin-storage-history-note, .admin-storage-provider-note, .admin-storage-context-note { gap: 8px; border-radius: 8px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-storage-history-note { margin-top: 14px; border: 1px solid var(--admin-card-border); background: color-mix(in srgb, var(--admin-layer-2) 72%, var(--admin-layer-1)); padding: 10px 12px; } .admin-storage-provider-note { margin: 18px 20px 0; border: 1px solid color-mix(in srgb, var(--admin-status-info) 24%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-info) 6%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-info) 70%, var(--admin-text-primary)); } .admin-storage-context-note { border-top: 1px solid var(--admin-divider); padding: 13px 0 15px; } .admin-storage-history-note svg, .admin-storage-provider-note svg, .admin-storage-context-note svg { flex: 0 0 auto; } .admin-storage-form-section { padding: 18px 20px 4px; } .admin-storage-provider-note + .admin-storage-form-section { padding-top: 16px; } .admin-storage-form-section + .admin-storage-form-section { border-top: 1px solid var(--admin-divider); } .admin-storage-form-section-heading { gap: 10px; margin-bottom: 16px; } .admin-storage-form-section-heading > span { width: 30px; height: 30px; border-radius: 7px; } .admin-storage-form-section-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-storage-form-section-heading p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-storage-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; } .admin-storage-form-grid.is-location { grid-template-columns: repeat(3, minmax(0, 1fr)); } .admin-storage-form-grid .ant-form-item, .admin-storage-local-field .ant-form-item { min-width: 0; } .admin-storage-local-field { max-width: 980px; } .admin-storage-address-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; } .admin-storage-footer-note { min-width: 0; gap: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-storage-load-error, .admin-storage-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-storage-load-error { justify-content: center; gap: 14px; } .admin-storage-load-error > div { max-width: 560px; flex: 1; } .admin-storage-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-storage-load-error p, .admin-storage-confirm-copy p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-storage-confirm-copy p + p { margin-top: 8px; } .admin-storage-confirm-row { justify-content: space-between; gap: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-storage-confirm-row + .admin-storage-confirm-row { margin-top: 8px; } .admin-storage-confirm-row span { color: var(--admin-text-muted); font-size: 11px; } .admin-storage-confirm-row strong { min-width: 0; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; text-align: right; } .admin-ark-settings { padding-bottom: 24px; } .admin-ark-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-ark-settings .admin-settings-section-summary, .admin-ark-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-ark-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-ark-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-ark-command-copy, .admin-ark-command-actions, .admin-ark-inline-alert, .admin-ark-policy-control, .admin-ark-policy-switch, .admin-ark-flow-step, .admin-ark-context-note, .admin-ark-scope-note, .admin-ark-footer-note, .admin-ark-form-section-heading, .admin-ark-load-error, .admin-ark-confirm-row { display: flex; align-items: center; } .admin-ark-command-copy { min-width: 0; gap: 11px; } .admin-ark-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-ark-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-ark-command-icon, .admin-ark-load-error-icon, .admin-ark-policy-icon, .admin-ark-flow-icon, .admin-ark-form-section-heading > span { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-ark-command-icon, .admin-ark-load-error-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-ark-command-actions { flex: 0 0 auto; gap: 8px; } .admin-ark-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-ark-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-ark-overview .admin-stat-tile { min-height: 104px; background: var(--admin-layer-1); box-shadow: none; } .admin-ark-overview .admin-stat-tile-value, .admin-ark-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-ark-overview .admin-stat-tile-value { font-size: 20px; } .admin-ark-policy-control { min-height: 112px; gap: 14px; padding: 18px 20px; } .admin-ark-policy-icon { width: 38px; height: 38px; border-radius: 9px; } .admin-ark-policy-copy { min-width: 0; flex: 1 1 auto; } .admin-ark-policy-copy strong { color: var(--admin-text-primary); font-size: 14px; font-weight: 650; } .admin-ark-policy-copy p { max-width: 1080px; margin-top: 5px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.6; } .admin-ark-policy-copy > span { display: block; margin-top: 5px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-ark-policy-switch { flex: 0 0 auto; gap: 9px; border: 1px solid var(--admin-card-border); border-radius: 9px; background: var(--admin-layer-2); padding: 9px 11px; } .admin-ark-policy-switch > span { min-width: 26px; color: var(--admin-text-secondary); font-size: 11px; font-weight: 650; text-align: right; } .admin-ark-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; border-top: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--admin-layer-2) 48%, var(--admin-layer-1)); padding: 16px 20px; } .admin-ark-flow-step { min-width: 0; align-items: flex-start; gap: 10px; border: 1px solid var(--admin-card-border); border-radius: 9px; background: var(--admin-layer-1); padding: 13px; } .admin-ark-flow-icon { width: 30px; height: 30px; border-radius: 7px; } .admin-ark-flow-step > div { min-width: 0; } .admin-ark-flow-step small, .admin-ark-flow-step strong { display: block; } .admin-ark-flow-step small { color: var(--admin-text-muted); font-size: 10px; font-weight: 650; letter-spacing: 0.05em; } .admin-ark-flow-step strong { margin-top: 3px; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-ark-flow-step p { margin-top: 4px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-ark-context-note, .admin-ark-scope-note { gap: 8px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-ark-context-note { border-top: 1px solid var(--admin-divider); padding: 11px 20px 13px; } .admin-ark-scope-note { margin-bottom: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: color-mix(in srgb, var(--admin-layer-2) 72%, var(--admin-layer-1)); padding: 10px 12px; } .admin-ark-context-note svg, .admin-ark-scope-note svg { flex: 0 0 auto; } .admin-ark-form-section { padding: 18px 20px 4px; } .admin-ark-form-section + .admin-ark-form-section { border-top: 1px solid var(--admin-divider); } .admin-ark-form-section-heading { gap: 10px; margin-bottom: 16px; } .admin-ark-form-section-heading > span { width: 30px; height: 30px; border-radius: 7px; } .admin-ark-form-section-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-ark-form-section-heading p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-ark-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; padding: 18px 20px 4px; } .admin-ark-form-grid .ant-form-item { min-width: 0; } .admin-ark-footer-note { min-width: 0; gap: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-ark-load-error, .admin-ark-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-ark-load-error { justify-content: center; gap: 14px; } .admin-ark-load-error > div { max-width: 560px; flex: 1; } .admin-ark-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-ark-load-error p, .admin-ark-confirm-copy p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-ark-confirm-copy p + p { margin-top: 8px; } .admin-ark-confirm-row { justify-content: space-between; gap: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-ark-confirm-row + .admin-ark-confirm-row { margin-top: 8px; } .admin-ark-confirm-row span { color: var(--admin-text-muted); font-size: 11px; } .admin-ark-confirm-row strong { min-width: 0; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; text-align: right; } .admin-intercept-settings { padding-bottom: 24px; } .admin-intercept-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-intercept-settings .admin-settings-section-summary, .admin-intercept-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-intercept-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-intercept-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-intercept-command-copy, .admin-intercept-command-actions, .admin-intercept-inline-alert, .admin-intercept-policy-control, .admin-intercept-policy-switch, .admin-intercept-context-note, .admin-intercept-rule-toolbar, .admin-intercept-duplicate-alert, .admin-intercept-rule-actions, .admin-intercept-empty, .admin-intercept-preview-heading, .admin-intercept-footer-note, .admin-intercept-load-error, .admin-intercept-confirm-row { display: flex; align-items: center; } .admin-intercept-command-copy { min-width: 0; gap: 11px; } .admin-intercept-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-intercept-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-intercept-command-icon, .admin-intercept-load-error-icon, .admin-intercept-policy-icon, .admin-intercept-empty > span { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-intercept-command-icon, .admin-intercept-load-error-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-intercept-command-actions { flex: 0 0 auto; gap: 8px; } .admin-intercept-inline-alert, .admin-intercept-duplicate-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-intercept-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-intercept-overview .admin-stat-tile { min-height: 104px; background: var(--admin-layer-1); box-shadow: none; } .admin-intercept-overview .admin-stat-tile-value, .admin-intercept-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-intercept-overview .admin-stat-tile-value { font-size: 20px; } .admin-intercept-policy-control { min-height: 112px; gap: 14px; padding: 18px 20px; } .admin-intercept-policy-icon { width: 38px; height: 38px; border-radius: 9px; } .admin-intercept-policy-copy { min-width: 0; flex: 1 1 auto; } .admin-intercept-policy-copy strong { color: var(--admin-text-primary); font-size: 14px; font-weight: 650; } .admin-intercept-policy-copy p { max-width: 1120px; margin-top: 5px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.6; } .admin-intercept-policy-copy > span { display: block; margin-top: 5px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-intercept-policy-switch { flex: 0 0 auto; gap: 9px; border: 1px solid var(--admin-card-border); border-radius: 9px; background: var(--admin-layer-2); padding: 9px 11px; } .admin-intercept-policy-switch > span { min-width: 26px; color: var(--admin-text-secondary); font-size: 11px; font-weight: 650; text-align: right; } .admin-intercept-context-note { gap: 8px; border-top: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--admin-layer-2) 42%, var(--admin-layer-1)); padding: 11px 20px 13px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-intercept-context-note svg, .admin-intercept-duplicate-alert svg { flex: 0 0 auto; } .admin-intercept-rule-toolbar { min-height: 72px; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--admin-divider); padding: 13px 20px; } .admin-intercept-rule-toolbar > div { min-width: 0; } .admin-intercept-rule-toolbar strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-intercept-rule-toolbar p { margin-top: 3px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-intercept-duplicate-alert { margin: 14px 20px 0; } .admin-intercept-rule-table { padding: 14px 20px 18px; } .admin-intercept-rule-header, .admin-intercept-rule-row { display: grid; grid-template-columns: 68px minmax(220px, 0.9fr) minmax(260px, 1.1fr) 112px; gap: 12px; } .admin-intercept-rule-header { align-items: center; min-height: 34px; padding: 0 12px; color: var(--admin-text-muted); font-size: 10px; font-weight: 650; letter-spacing: 0.04em; } .admin-intercept-rule-header span:last-child { text-align: center; } .admin-intercept-rule-list { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); } .admin-intercept-rule-row { min-height: 92px; align-items: start; padding: 14px 12px 12px; transition: background-color 180ms ease, box-shadow 180ms ease; } .admin-intercept-rule-row + .admin-intercept-rule-row { border-top: 1px solid var(--admin-divider); } .admin-intercept-rule-row:hover { background: color-mix(in srgb, var(--foreground) 2.5%, var(--admin-layer-1)); } .admin-intercept-rule-row.has-duplicate { background: color-mix(in srgb, var(--admin-status-warning) 5%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 38%, transparent); } .admin-intercept-rule-index { min-width: 0; padding-top: 2px; text-align: center; } .admin-intercept-rule-index > span { display: grid; width: 30px; height: 30px; margin-inline: auto; place-items: center; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-primary); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; } .admin-intercept-rule-index small { display: block; margin-top: 5px; color: var(--admin-text-muted); font-size: 10px; } .admin-intercept-rule-field { min-width: 0; } .admin-intercept-rule-field > small { display: block; margin-top: 5px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.45; } .admin-intercept-rule-field :is(.ant-input, .ant-input-affix-wrapper, .ant-input-textarea) { width: 100%; } .admin-intercept-rule-field .ant-input-show-count-suffix, .admin-intercept-rule-field .ant-input-data-count { color: var(--admin-text-muted); font-size: 10px; } .admin-intercept-rule-actions { justify-content: center; gap: 2px; } .admin-intercept-rule-actions .ant-btn { width: 32px; height: 32px; padding: 0; } .admin-intercept-empty { min-height: 170px; justify-content: center; gap: 14px; padding: 28px 20px; } .admin-intercept-empty > span { width: 42px; height: 42px; border-radius: 10px; } .admin-intercept-empty > div { max-width: 520px; } .admin-intercept-empty strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-intercept-empty p { margin-top: 4px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.6; } .admin-intercept-preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 18px 20px 20px; } .admin-intercept-preview-input, .admin-intercept-preview-result { min-width: 0; } .admin-intercept-preview-input label { display: block; margin-bottom: 7px; color: var(--admin-text-primary); font-size: 12px; font-weight: 600; } .admin-intercept-preview-input p { margin-top: 6px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.45; } .admin-intercept-preview-result { min-height: 132px; border: 1px solid var(--admin-card-border); border-radius: 9px; background: var(--admin-layer-2); padding: 13px 14px; } .admin-intercept-preview-heading { justify-content: space-between; gap: 10px; } .admin-intercept-preview-heading strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-intercept-preview-result > p { margin-top: 14px; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 13px; line-height: 1.65; white-space: pre-wrap; } .admin-intercept-preview-result > p.is-placeholder { color: var(--admin-text-muted); } .admin-intercept-preview-result > small { display: block; margin-top: 10px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.5; } .admin-intercept-footer-note { min-width: 0; gap: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-intercept-load-error, .admin-intercept-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-intercept-load-error { justify-content: center; gap: 14px; } .admin-intercept-load-error > div { max-width: 560px; flex: 1; } .admin-intercept-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-intercept-load-error p, .admin-intercept-confirm-copy p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-intercept-confirm-copy p + p { margin-top: 8px; } .admin-intercept-confirm-row { justify-content: space-between; gap: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-intercept-confirm-row + .admin-intercept-confirm-row { margin-top: 8px; } .admin-intercept-confirm-row span { color: var(--admin-text-muted); font-size: 11px; } .admin-intercept-confirm-row strong { min-width: 0; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; text-align: right; } .admin-drawing-settings { padding-bottom: 24px; } .admin-drawing-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-drawing-settings .admin-settings-section-summary, .admin-drawing-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-drawing-command-bar, .admin-drawing-command-copy, .admin-drawing-command-actions, .admin-drawing-engine-choice-heading, .admin-drawing-engine-choice-note, .admin-drawing-license-note, .admin-drawing-load-error, .admin-drawing-inline-alert { display: flex; align-items: center; } .admin-drawing-command-bar { position: sticky; top: 0; z-index: 24; min-height: 62px; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-drawing-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-drawing-command-copy { min-width: 0; gap: 11px; } .admin-drawing-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-drawing-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-drawing-command-icon, .admin-drawing-load-error-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-drawing-command-actions { flex: 0 0 auto; gap: 8px; } .admin-drawing-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-drawing-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-drawing-overview .admin-stat-tile { min-height: 106px; background: var(--admin-layer-1); box-shadow: none; } .admin-drawing-overview .admin-stat-tile-value { overflow: hidden; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; } .admin-drawing-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-settings-anchor { width: 100%; scroll-margin-top: 78px; } .admin-settings-anchor .admin-settings-section { width: 100%; max-width: none !important; } .admin-drawing-section-grid { display: grid; gap: 16px; } .admin-drawing-engine-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 14px; } .admin-drawing-engine-choice { min-width: 0; min-height: 118px; border: 1px solid var(--admin-card-border); border-radius: 9px; background: color-mix(in srgb, var(--admin-layer-2) 48%, var(--admin-layer-1)); padding: 15px; color: var(--admin-text-primary); cursor: pointer; text-align: left; transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; } .admin-drawing-engine-choice:hover { border-color: color-mix(in srgb, var(--foreground) 28%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-layer-2) 68%, var(--admin-layer-1)); transform: translateY(-1px); } .admin-drawing-engine-choice:focus-visible { outline: 2px solid var(--control-focus-ring); outline-offset: 2px; } .admin-drawing-engine-choice.is-selected { border-color: color-mix(in srgb, var(--admin-status-info) 52%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-info) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-info) 16%, transparent); } .admin-drawing-engine-choice.is-unavailable:not(.is-selected) { cursor: pointer; } .admin-drawing-engine-choice:disabled { cursor: wait; transform: none; } .admin-drawing-engine-choice-heading { min-width: 0; gap: 10px; } .admin-drawing-engine-choice-icon, .admin-drawing-license-note-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); border-radius: 8px; background: var(--admin-layer-1); color: var(--admin-text-secondary); } .admin-drawing-engine-choice-eyebrow { display: block; margin-bottom: 2px; color: var(--admin-text-muted); font-size: 10px; font-weight: 600; letter-spacing: 0.035em; } .admin-drawing-engine-choice-heading strong { display: block; font-size: 14px; font-weight: 650; line-height: 1.45; } .admin-drawing-engine-choice-description { display: block; margin-top: 11px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-drawing-engine-choice-note { min-height: 24px; gap: 6px; margin-top: 10px; border-top: 1px solid var(--admin-divider); padding-top: 9px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-drawing-license-layout { display: grid; grid-template-columns: minmax(0, 1fr); padding: 18px 20px 4px; } .admin-drawing-license-field, .admin-drawing-license-note { min-width: 0; } .admin-drawing-license-field { max-width: 820px; } .admin-drawing-license-field label { display: block; margin-bottom: 8px; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-drawing-license-field .ant-input-affix-wrapper { min-height: 38px; border-color: var(--admin-control-border); border-radius: 7px; background: var(--admin-layer-1); } .admin-drawing-license-field p, .admin-drawing-license-note p { margin-top: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.6; } .admin-drawing-license-note { align-items: flex-start; gap: 10px; } .admin-drawing-license-note strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-drawing-license-note.is-warning { border-color: color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); } .admin-drawing-license-note.is-warning .admin-drawing-license-note-icon { color: var(--admin-status-warning); } .admin-drawing-load-error, .admin-drawing-loading-card { min-height: 220px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-drawing-load-error { justify-content: center; gap: 14px; } .admin-drawing-load-error > div { max-width: 560px; flex: 1; } .admin-drawing-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-drawing-load-error p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.6; } .admin-drawing-review > p { margin-bottom: 12px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-drawing-review-list { display: grid; gap: 8px; } .admin-drawing-review-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 12px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-drawing-review-item.is-warning { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); } .admin-drawing-review-item strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-drawing-review-item span { color: var(--admin-text-secondary); font-size: 11px; font-weight: 600; } .admin-drawing-review-item p { grid-column: 1 / -1; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-runtime-policy { padding-bottom: 24px; } .admin-runtime-policy-command-bar, .admin-runtime-policy-command-copy, .admin-runtime-policy-command-actions, .admin-runtime-policy-index, .admin-runtime-policy-index-label, .admin-runtime-policy-load-error, .admin-runtime-policy-inline-alert { display: flex; align-items: center; } .admin-runtime-policy-command-bar { position: sticky; top: 0; z-index: 24; min-height: 62px; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-runtime-policy-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-runtime-policy-command-copy { min-width: 0; gap: 11px; } .admin-runtime-policy-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-runtime-policy-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-runtime-policy-command-icon, .admin-runtime-policy-load-error-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-runtime-policy-command-actions { flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 8px; } .admin-runtime-policy-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-runtime-policy-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-runtime-policy-overview .admin-stat-tile { min-height: 106px; background: var(--admin-layer-1); box-shadow: none; } .admin-runtime-policy-overview .admin-stat-tile-value { overflow: hidden; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; } .admin-runtime-policy-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-runtime-policy-index { min-height: 62px; overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-runtime-policy-index-label { min-height: 62px; flex: 0 0 172px; gap: 9px; border-right: 1px solid var(--admin-divider); background: var(--admin-layer-2); padding: 12px 16px; color: var(--admin-text-secondary); font-size: 12px; font-weight: 650; } .admin-runtime-policy-index-links { display: grid; min-width: 0; flex: 1; grid-template-columns: repeat(5, minmax(0, 1fr)); } .admin-runtime-policy-index-links button { min-width: 0; min-height: 62px; border: 0; border-left: 1px solid var(--admin-divider); background: transparent; padding: 10px 14px; color: var(--admin-text-primary); cursor: pointer; text-align: left; transition: color 180ms ease, background-color 180ms ease; } .admin-runtime-policy-index-links button:first-child { border-left: 0; } .admin-runtime-policy-index-links button:hover { background: var(--admin-layer-2); } .admin-runtime-policy-index-links button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--control-focus-ring); outline-offset: -2px; } .admin-runtime-policy-index-links span, .admin-runtime-policy-index-links small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-runtime-policy-index-links span { font-size: 12px; font-weight: 650; } .admin-runtime-policy-index-links small { margin-top: 3px; color: var(--admin-text-muted); font-size: 10px; font-weight: 500; } .admin-runtime-policy-anchor { width: 100%; scroll-margin-top: 78px; } .admin-runtime-policy-anchor .admin-settings-section { max-width: none; border: 1px solid var(--admin-card-border); } .admin-runtime-policy-anchor .admin-settings-section-summary, .admin-runtime-policy-anchor .admin-settings-section-content { background: var(--admin-layer-1); } .admin-runtime-policy-field-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 20px; padding: 20px; } .admin-runtime-policy-field-grid .ant-form-item { min-width: 0; margin-bottom: 0; } .admin-runtime-policy-number-control { display: flex; width: 100%; min-width: 0; } .admin-runtime-policy-number-control .ant-input-number { width: auto; min-width: 0; flex: 1 1 auto; border-radius: 7px 0 0 7px; } .admin-runtime-policy-number-unit { display: flex; min-width: 58px; min-height: 36px; align-items: center; justify-content: center; border: 1px solid var(--admin-control-border); border-left: 0; border-radius: 0 7px 7px 0; background: var(--admin-layer-2); color: var(--admin-text-secondary); font-size: 11px; font-weight: 600; text-align: center; } .admin-runtime-policy-number-control:focus-within .admin-runtime-policy-number-unit { border-color: var(--control-focus-ring); } .admin-runtime-policy-field-grid .ant-input-number-input { font-variant-numeric: tabular-nums; } .admin-runtime-policy-load-error, .admin-runtime-policy-loading-card { min-height: 240px; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); padding: 22px; box-shadow: var(--admin-card-shadow); } .admin-runtime-policy-load-error { justify-content: center; gap: 14px; } .admin-runtime-policy-load-error > div { max-width: 600px; flex: 1; } .admin-runtime-policy-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-runtime-policy-load-error p, .admin-runtime-policy-confirm-copy p, .admin-runtime-policy-review > p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-runtime-policy-confirm-copy p + p { margin-top: 8px; } .admin-runtime-policy-review > p { margin: 0 0 12px; color: var(--admin-text-secondary); } .admin-runtime-policy-review-groups { display: grid; max-height: min(520px, 58vh); gap: 10px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; } .admin-runtime-policy-review-groups section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-1); } .admin-runtime-policy-review-groups h3 { border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-2); padding: 8px 11px; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-runtime-policy-review-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 9px 11px; } .admin-runtime-policy-review-item + .admin-runtime-policy-review-item { border-top: 1px solid var(--admin-divider); } .admin-runtime-policy-review-item strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 600; } .admin-runtime-policy-review-item span { color: var(--admin-text-secondary); font-size: 11px; font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; } .admin-third-party-settings { padding-bottom: 24px; } .admin-third-party-settings .admin-settings-section { border: 1px solid var(--admin-card-border); } .admin-third-party-settings .admin-settings-section-summary, .admin-third-party-settings .admin-settings-section-content { background: var(--admin-layer-1); } .admin-third-party-command-bar { position: sticky; top: 0; z-index: 24; display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: color-mix(in srgb, var(--admin-layer-1) 96%, transparent); padding: 11px 14px; box-shadow: var(--admin-card-shadow); backdrop-filter: blur(14px); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .admin-third-party-command-bar.is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 6%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-warning) 24%, transparent); } .admin-third-party-command-copy, .admin-third-party-command-actions, .admin-third-party-inline-alert, .admin-third-party-provider, .admin-third-party-provider-heading, .admin-third-party-provider-tags, .admin-third-party-domain-heading, .admin-third-party-policy-control, .admin-third-party-policy-switch, .admin-third-party-flow, .admin-third-party-flow-step, .admin-third-party-credential-state, .admin-third-party-credential-indicator, .admin-third-party-credential-actions, .admin-third-party-test-heading, .admin-third-party-test-controls, .admin-third-party-test-note, .admin-third-party-footer, .admin-third-party-footer-note, .admin-third-party-load-error, .admin-third-party-confirm-row { display: flex; align-items: center; } .admin-third-party-command-copy { min-width: 0; gap: 11px; } .admin-third-party-command-copy strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-third-party-command-copy p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-third-party-command-icon, .admin-third-party-load-error-icon, .admin-third-party-domain-heading > span, .admin-third-party-test-heading > span { display: grid; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-third-party-command-icon, .admin-third-party-load-error-icon { width: 32px; height: 32px; border-radius: 8px; } .admin-third-party-command-actions { flex: 0 0 auto; gap: 8px; } .admin-third-party-inline-alert { gap: 8px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 10px 12px; color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); font-size: 12px; line-height: 1.55; } .admin-third-party-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: var(--r-lg); background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-third-party-overview .admin-stat-tile { min-height: 104px; background: var(--admin-layer-1); box-shadow: none; } .admin-third-party-overview .admin-stat-tile-value, .admin-third-party-overview .admin-stat-tile-detail { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-third-party-overview .admin-stat-tile-value { font-size: 20px; } .admin-third-party-provider { min-height: 70px; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--admin-layer-2) 34%, var(--admin-layer-1)); padding: 13px 20px; } .admin-third-party-provider-heading { min-width: 0; gap: 11px; } .admin-third-party-provider-mark { display: grid; width: 36px; height: 36px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--foreground); color: var(--background); font-size: 15px; font-weight: 750; } .admin-third-party-provider-heading strong, .admin-third-party-domain-heading h3, .admin-third-party-test-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-third-party-provider-heading p, .admin-third-party-domain-heading p, .admin-third-party-test-heading p { margin-top: 2px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-third-party-provider-tags { flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 6px; } .admin-third-party-domain-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 16px 20px; } .admin-third-party-domain, .admin-third-party-test-section { min-width: 0; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-2); } .admin-third-party-domain { min-height: 254px; padding: 16px; } .admin-third-party-domain-heading { align-items: flex-start; gap: 10px; } .admin-third-party-domain-heading > span, .admin-third-party-test-heading > span { width: 30px; height: 30px; border-radius: 8px; background: var(--admin-layer-1); } .admin-third-party-domain-heading > div, .admin-third-party-test-heading > div { min-width: 0; flex: 1 1 auto; } .admin-third-party-policy-control { justify-content: space-between; gap: 14px; margin-top: 18px; border: 1px solid var(--admin-card-border); border-radius: 9px; background: var(--admin-layer-1); padding: 13px; } .admin-third-party-policy-control > div:first-child { min-width: 0; } .admin-third-party-policy-control strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-third-party-policy-control p { margin-top: 3px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-third-party-policy-switch { flex: 0 0 auto; gap: 8px; } .admin-third-party-policy-switch > span { color: var(--admin-text-secondary); font-size: 11px; font-weight: 650; } .admin-third-party-flow { justify-content: space-between; gap: 8px; margin-top: 14px; color: var(--admin-text-muted); } .admin-third-party-flow-step { min-width: 0; flex: 1 1 0; gap: 8px; } .admin-third-party-flow-step > span { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; border-radius: 7px; background: color-mix(in srgb, var(--foreground) 6%, transparent); color: var(--admin-text-secondary); } .admin-third-party-flow-step strong, .admin-third-party-flow-step small { display: block; } .admin-third-party-flow-step strong { overflow: hidden; color: var(--admin-text-primary); font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; } .admin-third-party-flow-step small { margin-top: 1px; color: var(--admin-text-muted); font-size: 10px; } .admin-third-party-field-label, .admin-third-party-test-input label { display: block; color: var(--admin-text-secondary); font-size: 11px; font-weight: 650; } .admin-third-party-field-label { margin: 17px 0 7px; } .admin-third-party-credential-state { align-items: flex-start; gap: 9px; margin-top: 9px; } .admin-third-party-credential-indicator { flex: 0 0 auto; gap: 5px; color: var(--admin-text-muted); font-size: 11px; font-weight: 650; } .admin-third-party-credential-indicator.is-ready { color: var(--admin-status-success); } .admin-third-party-credential-indicator.is-warning { color: var(--admin-status-warning); } .admin-third-party-credential-state p { color: var(--admin-text-muted); font-size: 10px; line-height: 1.55; } .admin-third-party-credential-actions { min-height: 32px; justify-content: flex-end; margin-top: 12px; } .admin-third-party-test-section { margin: 0 20px 18px; overflow: hidden; } .admin-third-party-test-heading { min-height: 74px; align-items: flex-start; gap: 10px; border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 14px 16px; } .admin-third-party-test-heading .admin-status-badge { flex: 0 0 auto; } .admin-third-party-test-controls { align-items: flex-end; gap: 10px; padding: 14px 16px 11px; } .admin-third-party-test-input { min-width: 0; flex: 1 1 auto; } .admin-third-party-test-input label { margin-bottom: 7px; } .admin-third-party-test-note { gap: 7px; border-top: 1px solid var(--admin-divider); padding: 10px 16px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.55; } .admin-third-party-test-note svg { flex: 0 0 auto; } .admin-third-party-test-note.is-success { color: var(--admin-status-success); } .admin-third-party-test-note.is-error { color: var(--admin-status-error); } .admin-third-party-footer { width: 100%; justify-content: space-between; gap: 14px; } .admin-third-party-footer-note { min-width: 0; gap: 7px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-third-party-footer-note svg { flex: 0 0 auto; } .admin-third-party-load-error, .admin-third-party-loading-card { min-height: 150px; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); padding: 20px; box-shadow: var(--admin-card-shadow); } .admin-third-party-load-error { gap: 12px; } .admin-third-party-load-error > div { min-width: 0; flex: 1 1 auto; } .admin-third-party-load-error h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 650; } .admin-third-party-load-error p, .admin-third-party-confirm-copy p { margin-top: 4px; color: var(--admin-text-muted); font-size: 12px; line-height: 1.65; } .admin-third-party-confirm-copy p + p { margin-top: 8px; } .admin-third-party-confirm-row { justify-content: space-between; gap: 14px; border: 1px solid var(--admin-card-border); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; } .admin-third-party-confirm-row + .admin-third-party-confirm-row { margin-top: 8px; } .admin-third-party-confirm-row span { color: var(--admin-text-muted); font-size: 11px; } .admin-third-party-confirm-row strong { min-width: 0; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 12px; font-weight: 650; text-align: right; } /* Task-first settings hierarchy: the page action is primary; sync metadata stays quiet. */ :is(.admin-feature-command-bar, .admin-drawing-command-bar, .admin-access-command-bar, .admin-email-command-bar, .admin-storage-command-bar, .admin-ark-command-bar, .admin-intercept-command-bar, .admin-third-party-command-bar) { position: static; min-height: 42px; border: 0; border-bottom: 1px solid var(--admin-divider); border-radius: 0; background: transparent; padding: 0 0 10px; box-shadow: none; backdrop-filter: none; } :is(.admin-feature-command-bar, .admin-drawing-command-bar, .admin-access-command-bar, .admin-email-command-bar, .admin-storage-command-bar, .admin-ark-command-bar, .admin-intercept-command-bar, .admin-third-party-command-bar).is-dirty { border-color: color-mix(in srgb, var(--admin-status-warning) 42%, var(--admin-divider)); background: transparent; box-shadow: none; } :is(.admin-feature-command-icon, .admin-drawing-command-icon, .admin-access-command-icon, .admin-email-command-icon, .admin-storage-command-icon, .admin-ark-command-icon, .admin-intercept-command-icon, .admin-third-party-command-icon) { display: none; } :is(.admin-feature-command-copy, .admin-drawing-command-copy, .admin-access-command-copy, .admin-email-command-copy, .admin-storage-command-copy, .admin-ark-command-copy, .admin-intercept-command-copy, .admin-third-party-command-copy) { gap: 0; } :is(.admin-feature-command-copy, .admin-drawing-command-copy, .admin-access-command-copy, .admin-email-command-copy, .admin-storage-command-copy, .admin-ark-command-copy, .admin-intercept-command-copy, .admin-third-party-command-copy) strong { font-size: 12px; } :is(.admin-feature-command-copy, .admin-drawing-command-copy, .admin-access-command-copy, .admin-email-command-copy, .admin-storage-command-copy, .admin-ark-command-copy, .admin-intercept-command-copy, .admin-third-party-command-copy) p { margin-top: 1px; font-size: 10px; } .admin-storage-mode-section, .admin-email-delivery-section, .admin-access-registration-section, .admin-access-linuxdo-section, .admin-intercept-policy-section, .admin-third-party-credential-section { border-color: color-mix(in srgb, var(--foreground) 22%, var(--admin-card-border)) !important; } .admin-storage-mode-section > .admin-settings-section-summary, .admin-email-delivery-section > .admin-settings-section-summary, .admin-access-registration-section > .admin-settings-section-summary, .admin-access-linuxdo-section > .admin-settings-section-summary, .admin-intercept-policy-section > .admin-settings-section-summary, .admin-third-party-credential-section > .admin-settings-section-summary { background: color-mix(in srgb, var(--foreground) 3%, var(--admin-layer-1)); } :is(.admin-storage-mode-section, .admin-email-delivery-section, .admin-access-registration-section, .admin-access-linuxdo-section, .admin-intercept-policy-section, .admin-third-party-credential-section) > .admin-settings-section-summary h2 { font-size: 16px; letter-spacing: -0.01em; } :is(.admin-storage-mode-section, .admin-email-delivery-section, .admin-access-registration-section, .admin-access-linuxdo-section, .admin-intercept-policy-section, .admin-third-party-credential-section) > .admin-settings-section-summary p { max-width: 760px; margin-top: 5px; font-size: 12px; line-height: 1.6; } .admin-storage-mode-grid { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); } .admin-storage-mode-choice { min-height: 132px; padding: 16px; } .admin-storage-mode-choice.is-selected { border-color: color-mix(in srgb, var(--admin-status-info) 72%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-info) 9%, var(--admin-layer-1)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--admin-status-info) 44%, transparent); } .admin-storage-mode-choice.is-selected .admin-storage-mode-copy { padding-right: 74px; } .admin-storage-mode-meta { align-self: end; grid-column: 2; color: var(--admin-text-muted); font-size: 10px; font-weight: 600; } .admin-storage-mode-selected { position: absolute; top: 13px; right: 13px; display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; background: color-mix(in srgb, var(--admin-status-info) 18%, var(--admin-layer-1)); padding: 4px 7px; color: color-mix(in srgb, var(--admin-status-info) 82%, var(--admin-text-primary)); font-size: 10px; font-weight: 700; } .admin-access-provider-toggle { display: flex; min-height: 116px; align-items: center; gap: 14px; padding: 18px 20px; } .admin-third-party-credential-panel { max-width: 820px; padding: 18px 20px 20px; } .admin-third-party-credential-panel .admin-third-party-field-label { margin: 0 0 7px; } .admin-third-party-access-section .admin-third-party-policy-control { min-height: 112px; margin: 0; border: 0; border-radius: 0; background: transparent; padding: 18px 20px; } .admin-third-party-access-section .admin-third-party-flow { margin: 0; border-top: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--admin-layer-2) 42%, var(--admin-layer-1)); padding: 13px 20px 15px; } .admin-third-party-test-card .admin-third-party-test-controls { padding: 18px 20px 14px; } .admin-third-party-test-card .admin-third-party-test-note { padding: 11px 20px 13px; } .admin-feature-board { width: 100%; max-width: none; grid-template-columns: minmax(0, 1fr); gap: 14px; } .admin-feature-domain:last-child { grid-column: auto; } .admin-feature-domain-header { min-height: 72px; border-bottom: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--foreground) 3%, var(--admin-layer-1)); padding: 14px 18px; } .admin-feature-domain-header h2 { font-size: 15px; } .admin-feature-domain-header p { margin-top: 4px; font-size: 11px; } .admin-feature-board-row { min-height: 78px; grid-template-columns: minmax(0, 1fr) 132px; } .admin-feature-board-row-copy { display: flex; min-width: 0; align-items: flex-start; gap: 11px; padding: 15px 16px; } .admin-feature-board-row-name { flex: 1 1 auto; } .admin-feature-board-row-name strong { overflow: visible; font-size: 13px; white-space: normal; } .admin-feature-board-row-name > span, .admin-feature-board-row-name > em { display: block; max-width: 760px; font-style: normal; line-height: 1.55; } .admin-feature-board-row-name > span { margin-top: 4px; color: var(--admin-text-secondary); font-size: 11px; } .admin-feature-board-row-name > em { margin-top: 6px; color: var(--admin-text-muted); font-size: 10px; } .admin-feature-board-row-name > em.is-warning { color: color-mix(in srgb, var(--admin-status-warning) 78%, var(--admin-text-primary)); } .admin-feature-board-row-control, .admin-feature-board-runtime-status { min-width: 132px; align-items: flex-end; justify-content: center; flex-direction: column; padding: 15px 16px; } .admin-feature-board-row-control > span, .admin-feature-board-runtime-status > span { font-size: 10px; } .admin-feature-board-row.is-dependent .admin-feature-board-row-copy { padding-left: 36px; } .admin-feature-board-row.is-dependent .admin-feature-board-row-copy::before { position: absolute; top: 22px; left: 17px; color: var(--admin-text-muted); content: "↳"; font-size: 14px; } .admin-feature-board-source-selector { width: 216px; margin-right: 16px; } .admin-feature-board-source-selector button { min-height: 34px; font-size: 11px; } .admin-feature-runtime-note { display: flex; min-height: 56px; align-items: center; gap: 10px; border-top: 1px solid var(--admin-divider); background: color-mix(in srgb, var(--admin-layer-0) 18%, var(--admin-layer-1)); padding: 11px 16px; color: var(--admin-text-muted); } .admin-feature-runtime-note > div { display: flex; min-width: 0; flex: 1 1 auto; flex-direction: column; gap: 2px; } .admin-feature-runtime-note strong { color: var(--admin-text-secondary); font-size: 11px; font-weight: 650; } .admin-feature-runtime-note span { font-size: 10px; line-height: 1.45; } @media (max-width: 1279px) { .admin-third-party-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-third-party-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-third-party-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-third-party-domain-grid { grid-template-columns: minmax(0, 1fr); } .admin-access-command-bar { align-items: flex-start; flex-direction: column; } .admin-access-command-actions { width: 100%; justify-content: flex-start; } .admin-access-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-access-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-access-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-email-command-bar { align-items: flex-start; flex-direction: column; } .admin-email-command-actions { width: 100%; justify-content: flex-start; } .admin-email-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-email-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-email-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-email-form-grid.is-connection { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-email-form-grid.is-connection .ant-form-item:first-child { grid-column: 1 / -1; } .admin-storage-command-bar { align-items: flex-start; flex-direction: column; } .admin-storage-command-actions { width: 100%; justify-content: flex-start; } .admin-storage-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-storage-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-storage-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-storage-mode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-storage-form-grid.is-location { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-storage-form-grid.is-location .ant-form-item:last-child { grid-column: 1 / -1; } .admin-ark-command-bar { align-items: flex-start; flex-direction: column; } .admin-ark-command-actions { width: 100%; justify-content: flex-start; } .admin-ark-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-ark-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-ark-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-intercept-command-bar { align-items: flex-start; flex-direction: column; } .admin-intercept-command-actions { width: 100%; justify-content: flex-start; } .admin-third-party-command-bar { align-items: flex-start; flex-direction: column; } .admin-third-party-command-actions { width: 100%; justify-content: flex-start; } .admin-intercept-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-intercept-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-intercept-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-intercept-rule-header, .admin-intercept-rule-row { grid-template-columns: 60px minmax(200px, 0.9fr) minmax(230px, 1.1fr) 104px; gap: 10px; } .admin-runtime-policy-command-bar { align-items: flex-start; flex-direction: column; } .admin-runtime-policy-command-actions { width: 100%; justify-content: flex-start; } .admin-runtime-policy-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-runtime-policy-overview .admin-stat-tile:nth-child(3) { border-left: 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-runtime-policy-overview .admin-stat-tile:nth-child(4) { border-top: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); } .admin-runtime-policy-index { align-items: stretch; flex-direction: column; } .admin-runtime-policy-index-label { min-height: 44px; flex-basis: auto; border-right: 0; border-bottom: 1px solid var(--admin-divider); } .admin-runtime-policy-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (min-width: 1100px) and (max-width: 1279px) { .admin-access-command-bar, .admin-email-command-bar, .admin-storage-command-bar, .admin-ark-command-bar, .admin-intercept-command-bar, .admin-third-party-command-bar, .admin-runtime-policy-command-bar { align-items: center; flex-direction: row; } .admin-access-command-actions, .admin-email-command-actions, .admin-storage-command-actions, .admin-ark-command-actions, .admin-intercept-command-actions, .admin-third-party-command-actions, .admin-runtime-policy-command-actions { width: auto; justify-content: flex-end; } } @media (max-width: 720px) { .admin-intercept-policy-control, .admin-third-party-policy-control { align-items: stretch; flex-direction: column; } .admin-intercept-policy-switch, .admin-third-party-policy-switch { align-self: flex-start; } .admin-intercept-rule-header { display: none; } .admin-intercept-rule-row { grid-template-columns: 42px minmax(0, 1fr); gap: 10px; } .admin-intercept-rule-index { grid-row: 1 / span 2; } .admin-intercept-rule-actions { grid-column: 2; justify-content: flex-end; } .admin-intercept-preview-grid { grid-template-columns: minmax(0, 1fr); } .admin-third-party-provider { align-items: flex-start; flex-direction: column; } .admin-third-party-provider-tags { justify-content: flex-start; } .admin-third-party-credential-panel, .admin-third-party-access-section .admin-third-party-policy-control, .admin-third-party-test-card .admin-third-party-test-controls { padding-inline: 16px; } .admin-third-party-access-section .admin-third-party-flow { align-items: stretch; flex-direction: column; padding-inline: 16px; } .admin-third-party-flow > span[aria-hidden="true"] { align-self: center; transform: rotate(90deg); } .admin-third-party-test-controls { align-items: stretch; flex-direction: column; } .admin-third-party-test-controls > .ant-btn { width: 100%; } .admin-third-party-footer { align-items: flex-start; flex-direction: column; } } @media (prefers-reduced-motion: reduce) { .admin-access-command-bar, .admin-access-advanced > summary, .admin-email-command-bar, .admin-storage-command-bar, .admin-storage-mode-choice, .admin-ark-command-bar, .admin-intercept-command-bar, .admin-intercept-rule-row, .admin-feature-command-bar, .admin-feature-board-row, .admin-feature-board-source-selector button, .admin-feature-detail, .admin-drawing-command-bar, .admin-drawing-engine-choice, .admin-runtime-policy-command-bar, .admin-runtime-policy-index-links button, .admin-third-party-command-bar { transition: none !important; } .admin-drawing-engine-choice:hover { transform: none; } } .admin-operation-card { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 12px; background: var(--admin-layer-1); padding: 18px 20px 20px; box-shadow: var(--admin-card-shadow); } .admin-operation-card-heading { padding-bottom: 13px; border-bottom: 1px solid var(--admin-divider); } .admin-operation-card-heading p { margin-top: 3px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-credit-operations, .admin-credit-operations-table-region, .admin-credit-operations-table-region > .admin-data-table { width: 100%; } .admin-credit-drawer .ant-drawer-content { background: var(--admin-layer-0); } .admin-credit-drawer .ant-drawer-header { min-height: 64px; border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 16px 20px; } .admin-credit-drawer .ant-drawer-title { color: var(--admin-text-primary); font-size: 16px; font-weight: 650; } .admin-credit-drawer .ant-drawer-body { padding: 20px; } .admin-credit-drawer .ant-drawer-footer { min-height: 64px; background: var(--admin-layer-1); padding: 14px 20px; } .admin-credit-drawer .ant-drawer-footer .ant-btn { min-width: 80px; min-height: 36px; border-radius: 7px; } .admin-credit-drawer :is(.ant-input-number, .ant-input-number-affix-wrapper) { width: 100%; } .admin-credit-drawer-intro { margin-bottom: 16px; border: 1px solid color-mix(in srgb, var(--admin-status-info) 20%, var(--admin-card-border)); border-radius: 10px; background: color-mix(in srgb, var(--admin-status-info) 4%, var(--admin-layer-1)); padding: 14px 16px; } .admin-credit-drawer-intro.is-warning { border-color: color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); } .admin-credit-drawer-intro strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-credit-drawer-intro p { margin-top: 4px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-credit-drawer-loading { display: grid; min-height: 240px; place-items: center; color: var(--admin-text-muted); font-size: 13px; } .admin-credit-drawer-section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); padding: 18px; box-shadow: var(--admin-card-shadow); } .admin-credit-drawer-section + .admin-credit-drawer-section { margin-top: 16px; } .admin-credit-drawer-section-heading { margin-bottom: 16px; border-bottom: 1px solid var(--admin-divider); padding-bottom: 12px; } .admin-credit-drawer-section-heading-with-action { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; } .admin-credit-drawer-section-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; line-height: 1.45; } .admin-credit-drawer-section-heading p { margin-top: 3px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-credit-policy-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } .admin-credit-policy-grid .ant-form-item { margin-bottom: 0; } .admin-credit-multiplier-list { overflow: hidden; border: 1px solid var(--admin-divider); border-radius: 8px; } .admin-credit-multiplier-header, .admin-credit-multiplier-row { display: grid; grid-template-columns: minmax(0, 1fr) 128px 42px; align-items: start; gap: 10px; } .admin-credit-multiplier-header { background: var(--admin-layer-2); padding: 9px 10px; color: var(--admin-text-muted); font-size: 11px; font-weight: 600; } .admin-credit-multiplier-row { padding: 10px; } .admin-credit-multiplier-row + .admin-credit-multiplier-row { border-top: 1px solid var(--admin-divider); } .admin-credit-multiplier-row .ant-form-item { margin-bottom: 0; } .admin-credit-multiplier-remove.ant-btn { width: 36px; min-width: 36px; height: 36px; padding: 0; } .admin-credit-multiplier-empty { border: 1px dashed var(--admin-control-border); border-radius: 8px; background: var(--admin-layer-2); padding: 22px 16px; color: var(--admin-text-muted); font-size: 12px; text-align: center; } .admin-redemption-codes, .admin-redemption-codes > section, .admin-redemption-codes > section > .admin-data-table { width: 100%; } .admin-redemption-codes > section > .admin-data-table > .admin-table-frame { margin-bottom: 16px; } .admin-redemption-codes .admin-table-scroll { scrollbar-gutter: stable; } .admin-redemption-codes .admin-table-scroll .ant-table { min-width: 1140px; } .admin-redemption-status-distribution { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px; } .admin-redemption-uncertain-notice { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 16px; margin: 8px 0 2px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); border-radius: 10px; background: color-mix(in srgb, var(--admin-status-warning) 8%, var(--admin-layer-1)); padding: 11px 12px 11px 14px; } .admin-redemption-uncertain-notice strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-redemption-uncertain-notice p { margin-top: 3px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.55; } .admin-redemption-uncertain-notice .ant-btn { flex: 0 0 auto; } .admin-api-logs, .admin-api-logs > .admin-data-table { width: 100%; } .admin-api-logs > .admin-data-table > .admin-table-frame { margin-bottom: 16px; } .admin-api-logs .admin-table-scroll { scrollbar-gutter: stable; } .admin-api-logs .admin-table-scroll .ant-table { min-width: 1030px; } .admin-api-log-date-filter { width: 244px; } .admin-api-log-date-control { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; } .admin-api-log-date-control > span { color: var(--admin-text-muted); font-size: 10px; font-weight: 650; letter-spacing: 0.04em; white-space: nowrap; } .admin-api-log-capability-filter { width: 126px; } .admin-api-log-status-filter { width: 146px; } .admin-api-logs .admin-list-toolbar .ant-input-affix-wrapper:focus-within, .admin-api-logs .admin-list-toolbar .ant-picker-focused, .admin-api-logs .admin-list-toolbar .ant-select-focused .ant-select-selector { border-color: color-mix(in srgb, var(--admin-text-primary) 52%, var(--admin-control-border)) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--admin-text-primary) 16%, transparent) !important; } .admin-api-logs :is(.admin-api-log-capability-filter, .admin-api-log-status-filter).ant-select-focused { border-radius: 8px; outline: 2px solid color-mix(in srgb, var(--admin-text-primary) 34%, transparent); outline-offset: 1px; } .admin-api-log-refresh { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; } .admin-api-log-refresh > span { color: var(--admin-text-muted); font-size: 10px; font-variant-numeric: tabular-nums; white-space: nowrap; } .admin-api-log-recovery-notice { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 18px; margin: 8px 0 2px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); border-radius: 10px; background: color-mix(in srgb, var(--admin-status-warning) 8%, var(--admin-layer-1)); padding: 11px 12px 11px 14px; } .admin-api-log-recovery-notice strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-api-log-recovery-notice p { max-width: 920px; margin-top: 3px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.55; } .admin-api-log-recovery-notice .ant-btn { flex: 0 0 auto; } .admin-api-log-request, .admin-api-log-status-summary, .admin-api-log-metric, .admin-api-log-result-cost { display: flex; min-width: 0; flex-direction: column; justify-content: center; } .admin-api-log-request { gap: 3px; } .admin-api-log-primary-text { overflow: hidden; color: var(--admin-text-primary); font-size: 12px; font-weight: 600; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; } .admin-api-log-secondary-text, .admin-api-log-tertiary-text, .admin-api-log-reference, .admin-api-log-task-state, .admin-api-log-metric span, .admin-api-log-result-cost > span { color: var(--admin-text-muted); font-size: 10px; line-height: 1.45; } .admin-api-log-tertiary-text { margin-top: 2px; } .admin-api-log-path { display: flex; min-width: 0; align-items: center; gap: 5px; color: var(--admin-text-secondary); font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 10px; line-height: 1.45; } .admin-api-log-path > :first-child { flex: 0 0 auto; border-radius: 4px; background: var(--admin-layer-3); padding: 1px 4px; color: var(--admin-text-primary); font-size: 9px; font-weight: 650; } .admin-api-log-path > :last-child, .admin-api-log-reference { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-api-log-reference { font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); } .admin-api-log-status-summary, .admin-api-log-metric, .admin-api-log-result-cost { align-items: center; gap: 4px; text-align: center; } .admin-api-log-task-state { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-api-log-error-summary { display: -webkit-box; max-width: 190px; max-height: 29px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--admin-status-error); font-size: 10px; line-height: 1.4; } .admin-api-log-metric strong { color: var(--admin-text-primary); font-size: 12px; font-variant-numeric: tabular-nums; font-weight: 650; } .admin-api-log-media-result { display: inline-flex; width: 48px; height: 38px; flex: 0 0 auto; } .admin-api-log-media-button { position: relative; width: 48px; height: 38px; flex: 0 0 auto; overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 7px; background: var(--admin-layer-3); color: white; cursor: pointer; } .admin-api-log-media-button:disabled { cursor: not-allowed; opacity: 0.58; } .admin-api-log-media-overlay { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(0, 0, 0, 0.24); opacity: 0; transition: opacity 150ms ease; } .admin-api-log-media-button:hover .admin-api-log-media-overlay, .admin-api-log-media-button:focus-visible .admin-api-log-media-overlay { opacity: 1; } .admin-api-log-media-count { position: absolute; top: 2px; right: 2px; min-width: 16px; border-radius: 999px; background: rgba(0, 0, 0, 0.72); padding: 1px 4px; color: white; font-size: 9px; font-weight: 650; line-height: 1.35; } .admin-api-log-download.ant-btn { width: 30px; min-width: 30px; height: 30px; border: 1px solid var(--admin-control-border); border-radius: 6px; background: var(--admin-layer-2); color: var(--admin-text-secondary); padding: 0; transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; } .admin-api-log-download.ant-btn:hover, .admin-api-log-download.ant-btn:focus-visible { border-color: color-mix(in srgb, var(--foreground) 24%, transparent) !important; background: var(--admin-layer-3) !important; color: var(--admin-text-primary) !important; } .admin-api-log-download-unavailable { color: var(--admin-text-muted); font-size: 11px; } .admin-api-log-no-media { color: var(--admin-text-muted); font-size: 10px; } .admin-api-log-media-button:focus-visible, .admin-api-log-download.ant-btn:focus-visible { outline: 2px solid var(--admin-text-primary); outline-offset: 2px; } .admin-api-log-drawer .ant-drawer-content { background: var(--admin-layer-0); } .admin-api-log-drawer .ant-drawer-header { min-height: 64px; border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 14px 20px; } .admin-api-log-drawer .ant-drawer-title { color: var(--admin-text-primary); } .admin-api-log-drawer .ant-drawer-body { padding: 20px; } .admin-api-log-drawer .ant-drawer-footer { min-height: 64px; border-top: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 14px 20px; } .admin-api-log-drawer .ant-drawer-footer .ant-btn { min-width: 88px; min-height: 36px; border-radius: 7px; } .admin-api-log-drawer-title { display: flex; min-width: 0; flex-direction: column; gap: 2px; } .admin-api-log-drawer-title > span { color: var(--admin-text-primary); font-size: 16px; font-weight: 650; line-height: 1.35; } .admin-api-log-drawer-title > small { max-width: 560px; overflow: hidden; color: var(--admin-text-muted); font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 10px; font-weight: 450; text-overflow: ellipsis; white-space: nowrap; } .admin-api-log-drawer-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; } .admin-api-log-drawer-body, .admin-api-log-detail-stack { min-width: 0; } .admin-api-log-detail-stack { display: grid; gap: 16px; } .admin-api-log-detail-section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-api-log-detail-section > header { border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-2); padding: 12px 14px; } .admin-api-log-detail-section > header h2 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; line-height: 1.45; } .admin-api-log-detail-section > header p { margin-top: 2px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.5; } .admin-api-log-overview-grid, .admin-api-log-detail-grid, .admin-api-log-trace-grid { display: grid; gap: 1px; background: var(--admin-divider); } .admin-api-log-overview-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .admin-api-log-detail-grid, .admin-api-log-trace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-api-log-detail-field { min-width: 0; background: var(--admin-layer-1); padding: 10px 12px; } .admin-api-log-detail-field.is-wide { grid-column: 1 / -1; } .admin-api-log-detail-field dt { color: var(--admin-text-muted); font-size: 10px; font-weight: 550; line-height: 1.4; } .admin-api-log-detail-field dd { display: flex; min-width: 0; align-items: flex-start; gap: 7px; margin-top: 4px; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 12px; font-weight: 550; line-height: 1.5; } .admin-api-log-detail-field dd > span:first-child { min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; } .admin-api-log-detail-field dd.is-mono { font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 10.5px; font-weight: 500; } .admin-api-log-detail-field .ant-typography-copy { color: var(--admin-text-muted); } .admin-api-log-error-card, .admin-api-log-recovery-review, .admin-api-log-other-recovery-notice, .admin-api-log-detail-error { border-radius: 10px; padding: 13px 14px; } .admin-api-log-error-card, .admin-api-log-detail-error { border: 1px solid color-mix(in srgb, var(--admin-status-error) 30%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-error) 7%, var(--admin-layer-1)); } .admin-api-log-error-card > div, .admin-api-log-recovery-review-heading { display: flex; align-items: flex-start; gap: 8px; } .admin-api-log-error-card strong, .admin-api-log-detail-error strong, .admin-api-log-recovery-review strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-api-log-error-card p, .admin-api-log-detail-error p, .admin-api-log-recovery-review p { margin-top: 4px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-api-log-detail-error { display: grid; min-height: 220px; place-items: center; align-content: center; text-align: center; } .admin-api-log-detail-error .ant-btn { margin-top: 8px; } .admin-api-log-recovery-review, .admin-api-log-other-recovery-notice { margin-bottom: 16px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 34%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 8%, var(--admin-layer-1)); color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-api-log-recovery-review > dl, .admin-api-log-recovery-confirmation dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 12px; overflow: hidden; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-divider); } .admin-api-log-recovery-review > dl > div, .admin-api-log-recovery-confirmation dl > div { min-width: 0; background: var(--admin-layer-2); padding: 9px 10px; } .admin-api-log-recovery-review dt, .admin-api-log-recovery-confirmation dt { color: var(--admin-text-muted); font-size: 10px; } .admin-api-log-recovery-review dd, .admin-api-log-recovery-confirmation dd { margin-top: 3px; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 11px; font-weight: 600; line-height: 1.5; } .admin-api-log-recovery-review-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; } .admin-api-log-payload-section > details > summary { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; background: var(--admin-layer-2); padding: 12px 14px; color: var(--admin-text-primary); font-size: 13px; font-weight: 650; cursor: pointer; } .admin-api-log-payload-section > details > summary small { color: var(--admin-text-muted); font-size: 10px; font-weight: 500; } .admin-api-log-payload-section details[open] > summary { border-bottom: 1px solid var(--admin-divider); } .admin-api-log-payload-warning { margin: 12px 14px 0; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 26%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-2)); padding: 9px 11px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-api-log-payload-section .ant-tabs { padding: 0 14px 14px; } .admin-api-log-payload-section .ant-tabs-nav { margin-bottom: 10px; } .admin-api-log-payload-panel { min-width: 0; } .admin-api-log-payload-copy { display: flex; justify-content: flex-end; margin-bottom: 7px; color: var(--admin-text-secondary); font-size: 11px; } .admin-api-log-payload-panel pre { max-height: 360px; overflow: auto; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-layer-0); padding: 12px; color: var(--admin-text-secondary); font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 10.5px; line-height: 1.62; white-space: pre-wrap; word-break: break-word; } .admin-api-log-recovery-confirmation > p { color: var(--admin-text-secondary); font-size: 12px; line-height: 1.7; } .admin-api-log-recovery-confirmation-note { margin-top: 12px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-2)); padding: 10px 11px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.6; } .admin-api-log-drawer :is(button, summary, pre, .ant-typography-copy):focus-visible, .admin-api-log-recovery-confirm-modal :is(button, .ant-btn):focus-visible, .admin-api-log-media-modal-root :is(button, video):focus-visible { outline: 2px solid var(--admin-text-primary); outline-offset: 2px; } .admin-api-log-media-modal-root .ant-modal-body { overflow: hidden; border-radius: 8px; background: #000; padding: 0; } .admin-api-log-media-modal-root .ant-modal-body :is(img, video) { display: block; max-height: 72vh; } .admin-announcements, .admin-announcements > section, .admin-announcements > section > .admin-data-table { width: 100%; } .admin-announcements > section > .admin-data-table > .admin-table-frame { margin-bottom: 16px; } .admin-announcements .admin-table-scroll { scrollbar-gutter: stable; } .admin-announcements .admin-table-scroll .ant-table { min-width: 860px; } .admin-announcement-list-content { display: -webkit-box; max-height: 40px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .admin-announcement-list-content :where(p, div, blockquote, ul, ol, li) { display: inline; margin: 0; padding: 0; } .admin-announcement-list-content li + li::before { content: " · "; } .admin-announcement-list-content a { pointer-events: none; color: inherit; text-decoration: none; } .admin-announcement-lifecycle { display: flex; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: var(--admin-text-muted); font-size: 10px; line-height: 1.45; } .admin-announcement-uncertain-notice { display: flex; flex: 0 0 auto; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 8px 0 2px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 36%, var(--admin-card-border)); border-radius: 10px; background: color-mix(in srgb, var(--admin-status-warning) 8%, var(--admin-layer-1)); padding: 11px 12px 11px 14px; } .admin-announcement-uncertain-copy { min-width: 0; flex: 1 1 auto; } .admin-announcement-uncertain-notice strong { color: var(--admin-text-primary); font-size: 12px; font-weight: 650; } .admin-announcement-uncertain-notice p { max-width: 900px; margin-top: 3px; color: var(--admin-text-secondary); font-size: 11px; line-height: 1.55; } .admin-announcement-uncertain-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 8px; } .admin-announcement-review-target { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 10px; overflow: hidden; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-divider); } .admin-announcement-review-target > div { min-width: 0; background: var(--admin-layer-2); padding: 8px 10px; } .admin-announcement-review-target > .is-wide { grid-column: 1 / -1; } .admin-announcement-review-target dt { color: var(--admin-text-muted); font-size: 10px; line-height: 1.4; } .admin-announcement-review-target dd { margin-top: 3px; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 11px; font-weight: 600; line-height: 1.5; } .admin-announcement-review-content { max-height: 64px; overflow: auto; color: var(--admin-text-secondary); font-weight: 400; } .admin-announcements .admin-list-toolbar .ant-input-affix-wrapper:focus-within, .admin-announcements .admin-list-toolbar .ant-select-focused .ant-select-selector { border-color: color-mix(in srgb, var(--admin-text-primary) 52%, var(--admin-control-border)) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--admin-text-primary) 16%, transparent) !important; } .admin-shell .admin-announcement-status-filter.ant-select-focused { border-radius: 8px; outline: 2px solid color-mix(in srgb, var(--admin-text-primary) 34%, transparent); outline-offset: 1px; } .admin-announcement-drawer .ant-drawer-content { background: var(--admin-layer-0); } .admin-announcement-editor-modal { max-width: calc(100vw - 32px); } .admin-announcement-editor-modal .ant-modal-container { max-height: calc(100vh - 32px); } .admin-announcement-editor-modal .ant-modal-body { padding: 24px 28px 8px; } .admin-announcement-editor-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr); gap: 24px; } .admin-announcement-editor-layout .admin-announcement-preview { align-self: start; margin-top: 0; } @media (max-width: 800px) { .admin-announcement-editor-layout { grid-template-columns: minmax(0, 1fr); } .admin-announcement-editor-layout .admin-announcement-preview { margin-top: 24px; } } .admin-announcement-drawer .ant-drawer-header { min-height: 64px; border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 16px 20px; } .admin-announcement-drawer .ant-drawer-title { color: var(--admin-text-primary); font-size: 16px; font-weight: 650; } .admin-announcement-drawer .ant-drawer-body { padding: 20px; } .admin-announcement-drawer .ant-drawer-footer { min-height: 64px; background: var(--admin-layer-1); padding: 14px 20px; } .admin-announcement-drawer .ant-drawer-footer .ant-btn { min-width: 88px; min-height: 36px; border-radius: 7px; } .admin-announcement-drawer .ant-form-item-label > label { color: var(--admin-text-secondary); font-size: 12px; font-weight: 600; } .admin-announcement-drawer :is(.ant-form-item-extra, .ant-form-item-explain) { color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-announcement-drawer :is(.ant-input, .ant-input-affix-wrapper, .ant-select-selector):focus, .admin-announcement-drawer .ant-input-affix-wrapper:focus-within, .admin-announcement-drawer .ant-select-focused .ant-select-selector { border-color: color-mix(in srgb, var(--admin-text-primary) 52%, var(--admin-control-border)) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--admin-text-primary) 16%, transparent) !important; } .admin-announcement-drawer .ant-select-focused { border-radius: 8px; outline: 2px solid color-mix(in srgb, var(--admin-text-primary) 34%, transparent); outline-offset: 1px; } .admin-announcement-editor-intro { margin-bottom: 16px; border: 1px solid color-mix(in srgb, var(--admin-status-info) 28%, var(--admin-card-border)); border-radius: 10px; background: color-mix(in srgb, var(--admin-status-info) 6%, var(--admin-layer-1)); padding: 13px 15px; } .admin-announcement-editor-intro.is-warning { border-color: color-mix(in srgb, var(--admin-status-warning) 32%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); } .admin-announcement-editor-intro strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-announcement-editor-intro p { margin-top: 4px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-announcement-editor-section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); padding: 18px; box-shadow: var(--admin-card-shadow); } .admin-announcement-editor-section-heading { margin-bottom: 16px; border-bottom: 1px solid var(--admin-divider); padding-bottom: 12px; } .admin-announcement-editor-section-heading h2 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; line-height: 1.45; } .admin-announcement-editor-section-heading p { margin-top: 3px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-announcement-form-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(180px, 1fr); gap: 14px; } .admin-announcement-preview { --announcement-accent: var(--admin-status-info); margin-top: 16px; border: 1px solid color-mix(in srgb, var(--announcement-accent) 28%, var(--admin-card-border)); border-left: 3px solid var(--announcement-accent); border-radius: 10px; background: color-mix(in srgb, var(--announcement-accent) 5%, var(--admin-layer-1)); padding: 15px 16px 16px; } .admin-announcement-preview[data-level="success"] { --announcement-accent: var(--admin-status-success); } .admin-announcement-preview[data-level="warning"] { --announcement-accent: var(--admin-status-warning); } .admin-announcement-preview[data-level="critical"] { --announcement-accent: var(--destructive); } .admin-announcement-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 11px; color: var(--admin-text-muted); font-size: 11px; font-weight: 600; } .admin-announcement-preview > h3 { color: var(--admin-text-primary); font-size: 14px; font-weight: 650; line-height: 1.5; } .admin-announcement-preview-content, .admin-announcement-preview-placeholder { max-height: 220px; margin-top: 7px; overflow: auto; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.7; } .admin-announcement-preview-content :where(p, blockquote, ul, ol) + :where(p, blockquote, ul, ol) { margin-top: 7px; } .admin-announcement-preview-content :where(ul, ol) { padding-left: 20px; } .admin-announcement-preview-content ul { list-style: disc; } .admin-announcement-preview-content ol { list-style: decimal; } .admin-announcement-preview-content blockquote { border-left: 2px solid var(--admin-divider); padding-left: 10px; color: var(--admin-text-muted); } .admin-announcement-preview-content code { border-radius: 4px; background: var(--admin-layer-2); padding: 1px 4px; font-size: 0.92em; } .admin-announcement-confirm-content { max-height: 180px; overflow: auto; color: var(--admin-text-secondary); font-weight: 400; white-space: pre-wrap; } .admin-announcement-confirm-content :where(ul, ol) { padding-left: 18px; } .admin-announcement-confirm-content ul { list-style: disc; } .admin-announcement-confirm-content ol { list-style: decimal; } .admin-redemption-drawer .ant-drawer-content { background: var(--admin-layer-0); } .admin-redemption-drawer .ant-drawer-header { min-height: 64px; border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 16px 20px; } .admin-redemption-drawer .ant-drawer-title { color: var(--admin-text-primary); font-size: 16px; font-weight: 650; } .admin-redemption-drawer .ant-drawer-body { padding: 20px; } .admin-redemption-drawer .ant-drawer-footer { min-height: 64px; background: var(--admin-layer-1); padding: 14px 20px; } .admin-redemption-drawer .ant-drawer-footer .ant-btn { min-width: 80px; min-height: 36px; border-radius: 7px; } .admin-redemption-drawer :is(.ant-input-number, .ant-input-number-affix-wrapper) { width: 100%; } .admin-redemption-drawer .ant-form-item-label > label { color: var(--admin-text-secondary); font-size: 12px; font-weight: 600; } .admin-redemption-drawer :is(.ant-form-item-extra, .ant-form-item-explain) { color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-redemption-drawer-intro { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 16px; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); border-radius: 10px; background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-1)); padding: 14px 16px; } .admin-redemption-drawer-intro-icon { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--admin-status-warning) 26%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-warning) 9%, var(--admin-layer-2)); color: var(--admin-status-warning); } .admin-redemption-drawer-intro strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; } .admin-redemption-drawer-intro p { margin-top: 4px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-redemption-drawer-section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); padding: 18px; box-shadow: var(--admin-card-shadow); } .admin-redemption-drawer-section-heading { margin-bottom: 16px; border-bottom: 1px solid var(--admin-divider); padding-bottom: 12px; } .admin-redemption-drawer-section-heading h3 { color: var(--admin-text-primary); font-size: 13px; font-weight: 650; line-height: 1.45; } .admin-redemption-drawer-section-heading p { margin-top: 3px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-redemption-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .admin-redemption-live-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 4px; overflow: hidden; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-divider); } .admin-redemption-live-summary > div { min-width: 0; background: var(--admin-layer-2); padding: 11px 12px; } .admin-redemption-live-summary > .is-emphasis { background: color-mix(in srgb, var(--admin-status-success) 7%, var(--admin-layer-2)); } .admin-redemption-live-summary dt { color: var(--admin-text-muted); font-size: 11px; line-height: 1.4; } .admin-redemption-live-summary dd { margin-top: 5px; overflow-wrap: anywhere; color: var(--admin-text-primary); font-size: 13px; font-weight: 650; line-height: 1.5; } .admin-redemption-live-summary > .is-emphasis dd { color: var(--admin-status-success); } .admin-redemption-sensitive-notice { margin-bottom: 14px; border: 1px solid color-mix(in srgb, var(--admin-status-info) 20%, var(--admin-card-border)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-info) 5%, var(--admin-layer-2)); padding: 10px 12px; color: var(--admin-text-secondary); font-size: 12px; line-height: 1.65; } .admin-redemption-sensitive-notice.is-warning { border-color: color-mix(in srgb, var(--admin-status-warning) 30%, var(--admin-card-border)); background: color-mix(in srgb, var(--admin-status-warning) 7%, var(--admin-layer-2)); } .admin-generated-codes-preview-note { margin: -4px 0 10px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.55; } .admin-redemption-detail-summary { display: flex; min-height: 40px; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 12px; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-layer-2); padding: 8px 10px; color: var(--admin-text-secondary); font-size: 11px; } .admin-redemption-detail-summary .admin-redemption-status-distribution { justify-content: flex-start; } .admin-modal-data-table-shell.is-mutating :is(.admin-list-toolbar, .admin-table-pagination) { pointer-events: none; opacity: 0.64; } .admin-credit-account-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: -4px 0 18px; overflow: hidden; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-divider); } .admin-credit-account-summary > div { background: var(--admin-layer-2); padding: 11px 12px; } .admin-credit-account-summary dt, .admin-operation-confirmation-grid dt { color: var(--admin-text-muted); font-size: 11px; line-height: 1.4; } .admin-credit-account-summary dd, .admin-operation-confirmation-grid dd { margin-top: 5px; color: var(--admin-text-primary); font-size: 13px; font-weight: 600; line-height: 1.5; } .admin-credit-account-summary.is-unavailable { display: block; border-style: dashed; background: var(--admin-layer-2); padding: 12px; color: var(--admin-text-muted); font-size: 11px; line-height: 1.5; } .admin-operation-confirmation { margin-bottom: 18px; } .admin-operation-confirmation-copy { color: var(--admin-text-secondary); font-size: 12px; line-height: 1.7; } .admin-operation-confirmation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 12px; overflow: hidden; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-divider); } .admin-operation-confirmation-grid > div { min-width: 0; background: var(--admin-layer-2); padding: 11px 12px; } .admin-operation-confirmation-grid > .is-wide { grid-column: 1 / -1; } .admin-operation-confirmation-grid dd { overflow-wrap: anywhere; } .admin-operation-confirmation-grid dd.is-positive { color: var(--admin-status-success); } .admin-operation-confirmation-grid dd.is-negative { color: var(--destructive); } .admin-analytics-range-presets, .admin-analytics-trend-switch { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--admin-control-border); border-radius: 8px; background: var(--admin-layer-2); padding: 3px; } .admin-analytics-range-presets button, .admin-analytics-trend-switch button { min-width: 52px; min-height: 30px; border: 1px solid transparent; border-radius: 6px; padding: 4px 10px; color: var(--admin-text-secondary); font-size: 12px; font-weight: 550; line-height: 18px; transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease; } .admin-analytics-range-presets button:hover, .admin-analytics-trend-switch button:hover { color: var(--admin-text-primary); } .admin-analytics-range-presets button.is-active, .admin-analytics-trend-switch button.is-active { border-color: color-mix(in srgb, var(--foreground) 14%, transparent); background: var(--admin-layer-1); color: var(--admin-text-primary); box-shadow: 0 1px 3px color-mix(in srgb, #000 8%, transparent); } .admin-analytics-range-presets button:focus-visible, .admin-analytics-trend-switch button:focus-visible { outline: 2px solid color-mix(in srgb, var(--foreground) 32%, transparent); outline-offset: 2px; } .admin-analytics-range-picker .ant-picker { width: 246px; } .admin-analytics-pricing-modal .admin-analytics-price-field, .admin-analytics-pricing-modal .admin-analytics-price-field .ant-form-item-control, .admin-analytics-pricing-modal .admin-analytics-price-field .ant-form-item-control-input, .admin-analytics-pricing-modal .admin-analytics-price-input, .admin-analytics-pricing-modal .admin-analytics-price-input input { width: 100%; min-width: 0; pointer-events: auto; user-select: text; } .admin-analytics-pricing-modal .admin-analytics-price-input { display: block; } .admin-analytics-toolbar .admin-list-toolbar-actions { align-items: center; } .admin-analytics-toolbar :is(.admin-filter-toggle, .admin-list-toolbar-actions .ant-btn, .admin-analytics-range-picker .ant-picker) { min-height: 38px; } .admin-shell .admin-analytics-capability-tag { min-height: 22px; margin: 0; border: 1px solid color-mix(in srgb, var(--foreground) 14%, transparent); border-radius: 6px; background: color-mix(in srgb, var(--foreground) 6%, var(--admin-layer-1)); padding: 1px 8px; color: color-mix(in srgb, var(--foreground) 72%, transparent); font-size: 11px; font-weight: 600; line-height: 18px; } .admin-analytics-health-grid { display: grid; grid-template-columns: 1fr; gap: 12px; } .admin-analytics-health-card { min-width: 0; min-height: 118px; border: 1px solid var(--admin-card-border); border-radius: 11px; background: var(--admin-layer-1); padding: 16px 18px; box-shadow: var(--admin-card-shadow); } .admin-analytics-health-card-heading { display: flex; align-items: center; gap: 8px; color: var(--admin-text-muted); font-size: 12px; font-weight: 600; } .admin-analytics-health-card-heading > span:first-child { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid var(--admin-divider); border-radius: 7px; background: var(--admin-layer-2); color: var(--admin-text-secondary); } .admin-analytics-health-card[data-tone="warning"] .admin-analytics-health-card-heading > span:first-child { color: var(--admin-status-warning); } .admin-analytics-health-card[data-tone="success"] .admin-analytics-health-card-heading > span:first-child { color: var(--admin-status-success); } .admin-analytics-health-card-value { margin-top: 10px; overflow: hidden; color: var(--admin-text-primary); font-size: clamp(23px, 1.8vw, 28px); font-variant-numeric: tabular-nums; font-weight: 680; letter-spacing: -0.025em; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; } .admin-analytics-health-card-meta { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 10px; color: var(--admin-text-muted); font-size: 11px; line-height: 16px; } .admin-analytics-overview-grid { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 16px; } .admin-analytics-trend-section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 12px; background: var(--admin-layer-1); padding: 18px 20px; box-shadow: var(--admin-card-shadow); } .admin-analytics-section-heading, .admin-analytics-attention-heading, .admin-analytics-analysis-heading { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 16px; } .admin-analytics-section-heading { margin-bottom: 14px; border-bottom: 1px solid var(--admin-divider); padding-bottom: 13px; } .admin-analytics-section-heading h2, .admin-analytics-attention-heading h2, .admin-analytics-analysis-heading h2 { color: var(--admin-text-primary); font-size: 15px; font-weight: 660; line-height: 20px; } .admin-analytics-section-heading p, .admin-analytics-attention-heading p, .admin-analytics-analysis-heading p { margin-top: 4px; color: var(--admin-text-muted); font-size: 11px; line-height: 17px; } .admin-analytics-chart { height: 280px; } .admin-analytics-empty-chart { display: flex; min-height: 220px; flex-direction: column; align-items: center; justify-content: center; color: var(--admin-text-secondary); text-align: center; } .admin-analytics-empty-chart > span { display: grid; width: 42px; height: 42px; margin-bottom: 12px; place-items: center; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-2); color: var(--admin-text-muted); } .admin-analytics-empty-chart p { margin-top: 5px; color: var(--admin-text-muted); font-size: 12px; } .admin-shell .admin-analytics-chart .recharts-default-tooltip { border: 1px solid var(--admin-card-border) !important; border-radius: 8px; background: var(--admin-layer-2) !important; box-shadow: 0 8px 22px color-mix(in srgb, #000 18%, transparent); } .admin-shell .admin-analytics-chart .recharts-tooltip-label { color: var(--admin-text-primary) !important; font-weight: 600; } .admin-analytics-attention { display: flex; overflow: hidden; flex-direction: column; border: 1px solid var(--admin-card-border); border-radius: 12px; background: var(--admin-layer-1); padding: 18px 20px; box-shadow: var(--admin-card-shadow); } .admin-analytics-attention-heading { min-height: 50px; align-items: flex-start; border-bottom: 1px solid var(--admin-divider); padding-bottom: 13px; } .admin-analytics-attention-list { display: grid; flex: 1 1 auto; grid-template-rows: repeat(3, minmax(76px, 1fr)); margin-top: 2px; } .admin-analytics-attention-item { display: grid; width: 100%; min-width: 0; min-height: 76px; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; border: 0; border-bottom: 1px solid var(--admin-divider); background: transparent; padding: 11px 2px; color: var(--admin-text-primary); text-align: left; } .admin-analytics-attention-item:last-child { border-bottom: 0; } .admin-analytics-attention-item.is-action { cursor: pointer; } .admin-analytics-attention-item.is-action:hover { background: color-mix(in srgb, var(--foreground) 3%, transparent); } .admin-analytics-attention-item.is-action:focus-visible { outline: 2px solid color-mix(in srgb, var(--foreground) 30%, transparent); outline-offset: -2px; } .admin-analytics-attention-icon { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-muted); } .admin-analytics-attention-item[data-tone="warning"] .admin-analytics-attention-icon { color: var(--admin-status-warning); } .admin-analytics-attention-item[data-tone="success"] .admin-analytics-attention-icon { color: var(--admin-status-success); } .admin-analytics-attention-copy { display: block; min-width: 0; } .admin-analytics-attention-label, .admin-analytics-attention-description { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-analytics-attention-label { font-size: 12px; font-weight: 620; } .admin-analytics-attention-description { margin-top: 4px; color: var(--admin-text-muted); font-size: 10px; } .admin-analytics-attention-item strong { font-size: 17px; font-variant-numeric: tabular-nums; font-weight: 680; } .admin-analytics-analysis-section { overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 12px; background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); scroll-margin-top: 16px; } .admin-analytics-analysis-heading { min-height: 72px; align-items: center; border-bottom: 1px solid var(--admin-divider); padding: 14px 18px; } .admin-analytics-tabs { padding: 0 18px 18px; } .admin-analytics-tabs > .ant-tabs-nav { margin-bottom: 14px; } .admin-analytics-tabs > .ant-tabs-nav::before { border-color: var(--admin-divider); } .admin-analytics-tabs .ant-tabs-tab { min-height: 42px; padding-block: 10px; } .admin-analytics-pricing-description { margin-bottom: 14px; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-layer-2); padding: 10px 12px; color: var(--admin-text-secondary); font-size: 11px; line-height: 17px; } .admin-analytics-pricing-drawer .admin-table-frame { min-height: min(620px, calc(100vh - 190px)); } @media (min-width: 1280px) { .admin-analytics-overview-grid { grid-template-columns: minmax(0, 2fr) minmax(300px, 0.82fr); } } @media (max-width: 720px) { .admin-analytics-section-heading, .admin-analytics-analysis-heading { flex-direction: column; align-items: stretch; } .admin-analytics-trend-switch { align-self: flex-start; } .admin-analytics-range-picker, .admin-analytics-range-picker .ant-picker { width: 100%; } } .admin-drawer .ant-drawer-body, .admin-secondary-drawer .ant-drawer-body { background: var(--admin-layer-0); } .admin-drawer .ant-drawer-footer, .admin-secondary-drawer .ant-drawer-footer { border-top: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: color-mix(in srgb, var(--admin-layer-0) 94%, transparent); backdrop-filter: blur(10px); } .admin-form-section { margin-top: 12px; border-radius: 10px; background: color-mix(in srgb, var(--foreground) 4%, var(--admin-layer-1)); padding: 20px; } .admin-form-section:first-child { margin-top: 0; } .admin-form-section h2, .admin-settings-section h2 { font-size: 13px; } .admin-capability-group > summary::-webkit-details-marker { display: none; } .admin-capability-tags .ant-select-selector { max-height: 96px; overflow-y: auto; } /* 系统渠道模型编辑器:恢复已确认的信息层级、协议参数与价格档布局。 */ .admin-model-import-modal .channel-model-import-picker .ant-checkbox-wrapper { display: flex; min-width: 0; min-height: 38px; align-items: center; margin-inline-end: 0; border: 1px solid var(--admin-divider); border-radius: 7px; background: var(--admin-layer-2); padding: 7px 10px; color: var(--admin-text-primary); transition: background-color 150ms ease, border-color 150ms ease; } .admin-model-import-modal .channel-model-import-picker .ant-checkbox-wrapper:hover { border-color: color-mix(in srgb, var(--foreground) 22%, var(--admin-card-border)); background: color-mix(in srgb, var(--foreground) 5%, var(--admin-layer-1)); } .admin-model-import-modal .channel-model-import-picker .ant-checkbox-wrapper.ant-checkbox-wrapper-checked { border-color: color-mix(in srgb, var(--foreground) 26%, var(--admin-card-border)); background: color-mix(in srgb, var(--foreground) 7%, var(--admin-layer-1)); } .admin-model-import-modal .channel-model-import-picker .ant-checkbox { align-self: center; width: 18px; height: 18px; flex: none; border-radius: 5px; } .admin-model-import-modal .channel-model-import-picker .ant-checkbox-checked { background: var(--control-check-bg) !important; border-color: var(--control-check-bg) !important; } .admin-model-import-modal .channel-model-import-picker .ant-checkbox-checked::after { border-color: var(--control-check-fg) !important; } /* Model editor: one fixed-height dialog, one scrolling panel, persistent actions. */ .admin-model-editor-modal .ant-modal-container { display: flex; height: min(880px, calc(100dvh - 48px)); flex-direction: column; } .admin-model-editor-modal .ant-modal-body { display: flex; overflow: hidden; } .admin-model-editor-title p { margin-top: 4px; color: var(--admin-text-muted); font-size: 13px; font-weight: 400; overflow-wrap: anywhere; } .admin-model-editor-form > .ant-tabs { height: 100%; min-height: 0; } .admin-model-editor-form > .ant-tabs > .ant-tabs-nav { flex-shrink: 0; margin: 0; padding-inline: 28px; } .admin-model-editor-form > .ant-tabs > .ant-tabs-body-holder { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; } .admin-model-editor-tab-content { display: grid; gap: 16px; padding: 16px 24px 20px; } .admin-model-protocol-field { grid-column: 1 / -1; } .admin-model-editor-form { width: 100%; min-width: 0; min-height: 0; } .admin-model-editor-section { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; } .admin-model-editor-section + .admin-model-editor-section { border-top: 1px solid var(--admin-divider); padding-top: 16px; } .admin-model-editor-section-stacked { grid-template-columns: minmax(0, 1fr); gap: 12px; } .admin-model-editor-section-heading, .admin-model-editor-section-content { min-width: 0; } .admin-model-editor-section-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; } .admin-model-editor-section-heading h2 { margin: 0; color: var(--foreground); font-size: 15px; font-weight: 650; line-height: 1.4; } .admin-model-editor-section-heading p { margin: 0; color: var(--admin-text-muted); font-size: 13px; line-height: 1.65; } .admin-model-editor-section-content > .ant-form-item:last-child, .admin-model-editor-section-content > .ant-form-item-row:last-child { margin-bottom: 0; } .admin-model-editor-parameters .admin-model-editor-section-content { overflow: hidden; } .admin-model-identity-grid, .admin-model-protocol-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; } .admin-model-editor-modal .ant-form-item { margin-bottom: 0; } .admin-model-editor-modal .ant-form-item .ant-form-item-label { padding-bottom: 4px; } .admin-model-protocol-grid > .ant-alert { grid-column: 1 / -1; } .admin-model-editor-modal .admin-capability-editor { border-radius: 0; background: transparent; padding: 0; } .admin-model-editor-modal .admin-capability-editor-heading { padding: 0 2px 2px; } .admin-model-editor-modal .admin-capability-group { border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); background: color-mix(in srgb, var(--foreground) 2.5%, var(--admin-layer-1)); padding: 14px; } .admin-model-editor-modal .admin-capability-group > summary { position: relative; padding-right: 20px; } .admin-model-editor-modal .admin-capability-group > summary::after { position: absolute; top: 5px; right: 2px; width: 7px; height: 7px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; content: ""; transform: rotate(45deg); transition: transform 140ms ease; } .admin-model-editor-modal .admin-capability-group:not([open]) > summary::after { transform: rotate(-45deg); } .admin-model-editor-modal .admin-capability-group-description { color: var(--admin-text-muted) !important; line-height: 1.5; } .admin-model-editor-modal .admin-capability-block + .admin-capability-block { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--admin-divider); } .admin-model-editor-modal .admin-capability-block-title { margin-bottom: 9px; color: var(--admin-text-secondary); font-size: 10px; font-weight: 700; letter-spacing: 0.08em; } .admin-model-editor-modal .admin-capability-number-field, .admin-model-editor-modal .admin-capability-boolean-field, .admin-model-editor-modal .admin-capability-parameter-field { min-width: 0; } .admin-model-editor-modal .admin-capability-number-field .ant-input-number { width: 100% !important; min-width: 0; } .admin-model-editor-references .admin-capability-reference-grid { align-items: start; gap: 10px; } .admin-model-editor-references .admin-capability-reference-card { padding: 10px 12px; } .admin-model-editor-references .admin-capability-reference-card-heading { min-height: 0; margin-bottom: 6px; padding-bottom: 6px; } .admin-model-editor-references .admin-capability-reference-fields { gap: 6px; } .admin-model-editor-references .admin-capability-number-field { min-height: 32px; grid-template-columns: minmax(0, 1fr) 80px; align-items: center; gap: 8px; border-bottom: 0; padding: 0; } .admin-model-editor-references .admin-capability-boolean-field { min-height: 32px; margin-top: 0; gap: 6px; border: 0; border-radius: 0; padding: 0; } .admin-model-editor-references .admin-capability-boolean-field > div:last-child { gap: 8px; } .admin-model-editor-references .admin-capability-boolean-field label { display: flex; align-items: center; gap: 4px; } @media (min-width: 601px) and (max-width: 1000px) { .admin-model-editor-references .admin-capability-reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .admin-price-tier-card { overflow: hidden; border: 1px solid color-mix(in srgb, var(--foreground) 12%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--foreground) 2%, var(--admin-layer-1)); } .admin-price-tier-card-header { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid color-mix(in srgb, var(--foreground) 9%, transparent); padding: 8px 12px; } .admin-price-tier-card-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 12px 16px; padding: 12px; } .admin-price-tier-block { min-width: 0; } .admin-price-tier-block-title { margin-bottom: 10px; color: color-mix(in srgb, var(--foreground) 48%, transparent); font-size: 10px; font-weight: 650; letter-spacing: 0.08em; } .admin-price-tier-block-title > span { margin-right: 5px; color: var(--admin-text-muted); } .admin-price-tier-match-grid { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } .admin-price-tier-upstream { grid-column: span 2; } .admin-price-tier-billing-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; } .admin-price-tier-token-grid { grid-column: 1 / -1; } .admin-price-tier-token-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .admin-price-tier-billing-mode .ant-segmented { border: 1px solid var(--admin-card-border); background: var(--admin-layer-2); padding: 2px; } .admin-price-tier-billing-mode .ant-segmented-item { min-height: 28px; border-radius: 5px; } .admin-price-tier-billing-mode .ant-segmented-item-label { min-height: 28px; padding-inline: 12px; line-height: 28px; } .admin-price-tier-billing-mode .ant-segmented-item-selected { background: var(--admin-layer-1); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--foreground) 14%, transparent); } .admin-price-tier-unit-price .ant-input-number { width: 100% !important; } .admin-price-tier-controls { margin-left: auto; } .admin-price-tier-toggle { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; } .admin-price-tier-toggle span { overflow-wrap: anywhere; color: var(--admin-text-muted); font-size: 12px; line-height: 1.4; white-space: normal; } .admin-model-editor-add-tier.ant-btn { min-height: 38px; } .admin-model-editor-footer-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; } .admin-model-editor-footer-primary { display: flex; min-width: 0; flex-wrap: wrap; gap: 8px; } .admin-model-editor-footer-status { display: flex; align-items: center; gap: 10px; text-align: left; } .admin-model-editor-footer-status > div { display: grid; gap: 2px; } .admin-model-editor-footer-status strong { color: var(--admin-text-primary); font-size: 13px; font-weight: 600; } .admin-model-editor-footer-status small { color: var(--admin-text-muted); font-size: 12px; } :root:not(.dark) .admin-model-editor-drawer .ant-drawer-header, :root:not(.dark) .admin-model-editor-drawer .ant-drawer-footer { border-color: rgba(17, 17, 17, 0.15); background: #ffffff; } :root:not(.dark) .admin-model-editor-drawer .ant-drawer-body, :root:not(.dark) .admin-drawer.admin-model-editor-drawer .ant-drawer-footer { background: #f6f6f6; } :root:not(.dark) .admin-model-editor-section { border: 1px solid rgba(17, 17, 17, 0.15); background: #ffffff; box-shadow: 0 1px 3px rgb(17 17 17 / 0.055); } :root:not(.dark) .admin-model-editor-drawer :is(.admin-capability-group, .admin-capability-boolean-field, .admin-capability-parameter-field), :root:not(.dark) .admin-model-editor-drawer .admin-capability-reference-card, :root:not(.dark) .admin-model-editor-drawer .admin-capability-protocol-card, :root:not(.dark) .admin-price-tier-toggle, :root:not(.dark) .admin-price-tier-billing-mode .ant-segmented { border-color: rgba(17, 17, 17, 0.18); background: #ffffff; } :root:not(.dark) .admin-price-tier-card { border-color: rgba(17, 17, 17, 0.18); background: #f7f7f7; } :root:not(.dark) .admin-model-editor-drawer .admin-capability-reference-card, :root:not(.dark) .admin-model-editor-drawer .admin-capability-protocol-card { border-color: rgba(17, 17, 17, 0.18); background: #f7f7f7; } :root:not(.dark) .admin-model-editor-drawer [role="radio"] { border-color: rgba(17, 17, 17, 0.25); background: #ffffff; } :root:not(.dark) .admin-model-editor-drawer [role="radio"]:hover { border-color: rgba(17, 17, 17, 0.4); background: #f8fafc; } :root:not(.dark) .admin-model-editor-drawer [role="radio"][aria-checked="true"] { border-color: rgba(17, 17, 17, 0.7); background: #ececec; box-shadow: inset 0 0 0 1px rgb(17 17 17 / 0.08); } :root:not(.dark) .admin-model-editor-drawer :is(.ant-input, .ant-input-affix-wrapper, .ant-input-number, .ant-select-selector, .ant-segmented) { background: #ffffff; } :root:not(.dark) .admin-model-editor-section-heading h2 { color: #1f1f1f; } :root:not(.dark) .admin-model-editor-drawer .ant-form-item-label > label { color: rgba(17, 17, 17, 0.72); font-weight: 550; } :root:not(.dark) .admin-model-editor-footer-actions { border-color: rgba(17, 17, 17, 0.15); background: #ffffff; box-shadow: 0 6px 20px rgb(17 17 17 / 0.08); } :root:not(.dark) .admin-price-tier-billing-mode .ant-segmented-item-selected { background: #ececec; box-shadow: inset 0 0 0 1px rgb(17 17 17 / 0.12); } @media (max-width: 600px) { .admin-model-editor-modal .ant-modal-container { height: calc(100dvh - 24px); } .admin-model-editor-tab-content { padding: 12px 16px; } .admin-model-editor-footer-primary { width: 100%; justify-content: flex-end; } .admin-model-editor-modal .admin-capability-reference-grid { grid-template-columns: minmax(0, 1fr); } .admin-price-tier-upstream { grid-column: 1 / -1; } .admin-model-identity-grid, .admin-model-protocol-grid, .admin-price-tier-billing-grid, .admin-price-tier-match-grid, .admin-price-tier-token-grid { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 899px) { .admin-model-editor-section, .admin-price-tier-card-body { grid-template-columns: minmax(0, 1fr); } } /* 管理后台可读性基线:收敛历史页面中过低的文字透明度,并统一表单层级。 */ :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) { color: var(--admin-text-primary); } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(.text-foreground\/30, .text-foreground\/35, .text-foreground\/38, .text-foreground\/40, .text-foreground\/42, .text-foreground\/45) { color: var(--admin-text-muted) !important; } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(.text-foreground\/48, .text-foreground\/50, .text-foreground\/52, .text-foreground\/55) { color: var(--admin-text-secondary) !important; } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(.ant-form-item-label > label, .ant-checkbox-wrapper, .ant-radio-wrapper, .ant-segmented-item-label) { color: var(--admin-text-secondary); } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(.ant-input, .ant-input-affix-wrapper, .ant-input-number, .ant-picker, .ant-select-selector) { border-color: var(--admin-control-border) !important; } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(.ant-input, .ant-input-affix-wrapper input, .ant-input-number-input, .ant-picker-input > input, .ant-select-selection-item) { color: var(--admin-text-primary) !important; } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(input, textarea)::placeholder { color: var(--admin-text-placeholder) !important; opacity: 1; } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) .ant-select-selection-placeholder, :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) .ant-input-number-input::placeholder { color: var(--admin-text-placeholder) !important; opacity: 1; } :is(.admin-shell, .admin-drawer, .admin-secondary-drawer, .admin-modal-root, .admin-channel-modal-root) :is(.ant-input-disabled, .ant-input-number-disabled, .ant-picker-disabled, .ant-select-disabled .ant-select-selector) { color: var(--admin-text-muted) !important; opacity: 0.82; } .admin-shell .app-workspace-nav-link { color: color-mix(in srgb, var(--foreground) 82%, transparent); } .admin-shell .admin-sidebar :is(button, a):not(.app-workspace-nav-link) { color: var(--admin-text-secondary); } .admin-shell .admin-nav-group-label { color: color-mix(in srgb, var(--foreground) 68%, transparent) !important; } .admin-shell .admin-table-surface .ant-table-thead > tr > th, .admin-modal-root .admin-table-surface .ant-table-thead > tr > th { color: var(--admin-text-muted) !important; } .admin-shell .admin-table-surface .ant-table-tbody > tr > td, .admin-modal-root .admin-table-surface .ant-table-tbody > tr > td, .admin-shell .admin-pagination-total { color: var(--admin-text-primary); } .admin-shell .admin-table-surface .ant-table-tbody > tr > td, .admin-modal-root .admin-table-surface .ant-table-tbody > tr > td, .admin-table-pagination, .admin-drawer .ant-drawer-footer, .admin-secondary-drawer .ant-drawer-footer { border-color: var(--admin-divider); } .admin-model-editor-section-heading p, .admin-model-editor-subsection-heading p, .admin-price-tier-block-title { color: var(--admin-text-muted); } .admin-channel-modal .ant-modal-body { max-height: min(70vh, 620px); overflow-y: auto; } .admin-channel-modal.workspace-modal.workspace-modal-wide { width: min(760px, calc(100vw - 32px)) !important; } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-container { overflow: hidden; border: 1px solid var(--admin-card-border) !important; border-radius: 12px !important; background: var(--admin-layer-1) !important; padding: 0 !important; box-shadow: 0 20px 54px color-mix(in srgb, #000 28%, transparent) !important; } .admin-channel-modal-root .admin-channel-modal.workspace-modal .ant-modal-container { border: 1px solid var(--admin-card-border) !important; background: var(--admin-layer-1) !important; } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-header { display: flex; min-height: 60px; align-items: center; margin: 0; border-bottom: 1px solid var(--admin-divider); background: var(--admin-layer-1); padding: 16px 56px 15px 24px; } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-title { color: var(--admin-text-primary); font-size: 16px; font-weight: 650; line-height: 1.4; } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-close { top: 14px; right: 16px; width: 32px; height: 32px; border-radius: 7px; color: var(--admin-text-muted); } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-close:hover { background: var(--admin-layer-2); color: var(--admin-text-primary); } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-body { background: var(--admin-layer-1); padding: 20px 24px 4px; scrollbar-gutter: stable; } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-footer { min-height: 64px; margin: 0; border-top: 1px solid var(--admin-divider); background: var(--admin-layer-2); padding: 14px 24px; } :is(.admin-modal-root, .admin-channel-modal-root) .ant-modal-footer .ant-btn { min-width: 72px; min-height: 36px; border-radius: 7px; } @media (min-width: 1024px) { .admin-shell :where( .admin-sidebar, .admin-sidebar-header, .admin-sidebar-footer, .admin-page-root, .admin-table-frame, .admin-table-pagination, .admin-settings-section, .admin-settings-section-summary, .admin-settings-section-content, .admin-settings-section-footer, .admin-operation-card, .admin-analytics-trend-section, .admin-analytics-attention, .admin-analytics-analysis-section, .admin-analytics-health-card, .admin-analytics-secondary-metrics, .admin-stat-tile, .ant-table, .ant-table-thead > tr > th, .ant-table-tbody > tr > td, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number, .ant-btn ) { transition-property: background-color, border-color, color, box-shadow; transition-duration: 180ms; transition-timing-function: ease-out; } .admin-shell .admin-sidebar-header { height: 72px; padding-inline: 14px; } .admin-shell .admin-sidebar-nav { padding: 8px 12px 12px; } .admin-shell .admin-nav-group + .admin-nav-group { margin-top: 16px; } .admin-shell .admin-sidebar-footer { padding: 10px 12px 12px; } .admin-page-frame { width: 100%; padding: 20px 20px 0; } .admin-page-frame-scrollable { padding-bottom: 32px; } .admin-page-frame-scrollable > :not(.admin-page-header) { width: 100%; max-width: none; margin-inline: 0; } .admin-page-header { min-height: 68px; border-bottom: 1px solid var(--admin-divider); padding-bottom: 14px; } .admin-page-title { font-size: 14px; } .admin-page-location-section, .admin-page-location-separator { font-size: 14px; } .admin-page-description { margin-top: 4px; font-size: 13px; } .admin-settings-stack { display: flex; width: 100%; max-width: 1440px; flex-direction: column; gap: 16px; padding-top: 16px; } .admin-page-frame-scrollable > .admin-settings-stack { max-width: 1440px; } .admin-page-frame-scrollable > .admin-settings-stack.admin-feature-availability { max-width: none; } .admin-settings-stack > * { margin-block: 0 !important; } .admin-settings-stack > .admin-settings-section, .admin-settings-stack > form, .admin-settings-stack > form > .admin-settings-section { width: 100%; max-width: none; } .admin-list-toolbar { margin-top: 0; min-height: 60px; padding-block: 14px; } .admin-list-toolbar :where(.ant-btn, .ant-input-affix-wrapper, .ant-picker, .ant-input-number) { min-height: 36px; border-color: var(--admin-control-border) !important; border-radius: 7px; background: var(--admin-layer-1) !important; } .admin-list-toolbar .ant-select-selector { min-height: 36px !important; border-color: var(--admin-control-border) !important; border-radius: 7px !important; background: var(--admin-layer-1) !important; } .admin-list-toolbar .ant-btn { padding-inline: 13px; font-weight: 550; } .admin-analytics-panel { padding-bottom: 28px; } .admin-page-frame > .admin-data-table > .admin-table-frame { max-height: none; flex: 1 1 auto; margin-bottom: 16px; } .admin-analytics-health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-analytics-trend-section { padding: 22px 24px 18px; } .admin-settings-section:not(.is-stacked) { max-width: 1440px; border: 1px solid var(--admin-card-border); } .admin-settings-section:not(.is-stacked) .admin-settings-section-summary { padding: 20px; border-bottom: 1px solid var(--admin-divider); } .admin-settings-section:not(.is-stacked) .admin-settings-section-content { border-left: 0; } .admin-settings-section-content .ant-form-item { margin-bottom: 18px; } .admin-settings-section-content .ant-form-item-label { padding-bottom: 6px; } .admin-settings-section-footer { min-height: 64px; padding: 14px 20px !important; } .admin-settings-section-footer > .ant-btn:last-child { margin-left: auto; } .admin-settings-section.is-stacked .admin-settings-section-summary { border-bottom: 1px solid var(--admin-divider); } } @media (min-width: 1200px) { .admin-analytics-health-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media (min-width: 1600px) { .admin-page-frame-scrollable > .admin-settings-stack, .admin-page-frame-scrollable > form > .admin-settings-stack { max-width: none; } .admin-settings-stack > .admin-settings-section:not(.is-stacked) { max-width: none; } .admin-runtime-policy-anchor .admin-settings-section:not(.is-stacked) { max-width: none; } } @media (min-width: 1800px) { .admin-access-form-grid.is-credentials { grid-template-columns: repeat(4, minmax(0, 1fr)); } .admin-access-form-grid.is-mapping { grid-template-columns: repeat(3, minmax(0, 1fr)); } .admin-runtime-policy-field-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media (max-width: 1599px) { .admin-feature-board { grid-template-columns: minmax(0, 1fr); } .admin-feature-domain:last-child { grid-column: auto; } } @media (max-width: 1099px) { .admin-feature-board { grid-template-columns: 1fr; } .admin-feature-domain:last-child { grid-column: auto; } .admin-feature-detail-grid { grid-template-columns: 1fr; } .admin-feature-detail-cell { min-height: auto; border-top: 1px solid var(--admin-divider); border-left: 0; } } @media (max-width: 639px) { .admin-storage-mode-grid { grid-template-columns: minmax(0, 1fr); } .admin-storage-mode-choice { min-height: 118px; } .admin-access-provider-toggle, .admin-email-delivery-policy, .admin-access-registration-policy { align-items: flex-start; flex-wrap: wrap; } .admin-access-provider-toggle > .ant-form-item, .admin-email-delivery-policy > [data-slot="switch"], .admin-access-registration-policy > [data-slot="switch"] { margin-left: auto; } .admin-feature-board-row, .admin-feature-board-row.is-source { grid-template-columns: minmax(0, 1fr); } .admin-feature-board-row-control { min-width: 0; align-items: center; justify-content: space-between; flex-direction: row; border-top: 1px solid var(--admin-divider); padding: 10px 16px; } .admin-feature-board-source-selector { width: auto; margin: 0 16px 14px; } .admin-feature-runtime-note { align-items: flex-start; flex-wrap: wrap; } .admin-feature-runtime-note .admin-status-badge { margin-left: 26px; } } @media (prefers-reduced-motion: reduce) { .admin-shell .admin-page-root > div { animation: none !important; } .admin-shell :where( .admin-sidebar, .admin-sidebar-header, .admin-sidebar-footer, .admin-page-root, .admin-table-frame, .admin-table-pagination, .admin-settings-section, .admin-settings-section-summary, .admin-settings-section-content, .admin-settings-section-footer, .admin-operation-card, .admin-analytics-trend-section, .admin-analytics-attention, .admin-analytics-analysis-section, .admin-analytics-health-card, .admin-analytics-secondary-metrics, .admin-stat-tile, .ant-table, .ant-table-thead > tr > th, .ant-table-tbody > tr > td, .ant-input-affix-wrapper, .ant-select-selector, .ant-picker, .ant-input-number, .ant-btn ) { transition-duration: 0.01ms !important; } } /* 原有圆形主题揭示动画已负责整页过渡;揭示期间暂停管理端组件自身的颜色过渡,避免双重插值产生拖影和尾帧闪烁。 */ html[data-theme-switching="true"] .admin-shell, html[data-theme-switching="true"] .admin-shell *, html[data-magicui-theme-vt="active"] .admin-shell, html[data-magicui-theme-vt="active"] .admin-shell * { transition: none !important; } .admin-shell .admin-monospace { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: 12px; } .admin-shell .admin-table-primary-link { color: inherit; text-align: left; transition: color var(--motion-instant) ease-out; } .admin-shell .admin-table-primary-link:hover { color: var(--foreground); } .admin-system-update { gap: 14px; padding-bottom: 28px; } .admin-system-update-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.75fr); gap: 14px; } .admin-system-update-release-body, .admin-system-update-progress, .admin-system-update-backup { padding: 16px; } .admin-system-update-version-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding-bottom: 15px; } .admin-system-update-version-row > strong { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: clamp(22px, 3vw, 29px); line-height: 1; letter-spacing: -0.04em; } .admin-system-update-facts, .admin-system-update-backup dl { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 8px 14px; margin: 0; font-size: 12px; } .admin-system-update-facts dt, .admin-system-update-backup dt { color: color-mix(in srgb, var(--foreground) 48%, transparent); } .admin-system-update-facts dd, .admin-system-update-backup dd { min-width: 0; margin: 0; overflow-wrap: anywhere; } .admin-system-update-notes { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--admin-divider); } .admin-system-update-notes h3 { font-size: 12px; font-weight: 650; } .admin-system-update-notes a { display: inline-flex; align-items: center; gap: 4px; color: color-mix(in srgb, var(--foreground) 62%, transparent); font-size: 11px; } .admin-system-update-notes pre { max-height: 260px; margin: 10px 0 0; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; color: color-mix(in srgb, var(--foreground) 68%, transparent); font: inherit; font-size: 12px; line-height: 1.7; } .admin-system-update-checks { padding: 4px 16px 8px; } .admin-system-update-check-row { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: start; gap: 9px; padding: 11px 0; border-bottom: 1px solid var(--admin-divider); } .admin-system-update-check-row:last-child { border-bottom: 0; } .admin-system-update-check-row > svg { margin-top: 1px; color: color-mix(in srgb, var(--foreground) 38%, transparent); } .admin-system-update-check-row[data-status="passed"] > svg, .admin-system-update-check-row[data-status="passed"] > span { color: var(--status-success); } .admin-system-update-check-row[data-status="failed"] > svg, .admin-system-update-check-row[data-status="failed"] > span { color: var(--status-error); } .admin-system-update-check-row strong { display: block; font-size: 12px; font-weight: 600; } .admin-system-update-check-row p { margin: 2px 0 0; color: color-mix(in srgb, var(--foreground) 48%, transparent); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; } .admin-system-update-check-row > span { color: color-mix(in srgb, var(--foreground) 45%, transparent); font-size: 11px; } .admin-system-update-progress ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; } .admin-system-update-progress li { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; gap: 9px; padding: 9px 0; } .admin-system-update-progress li strong { font-size: 12px; font-weight: 600; } .admin-system-update-progress li p { margin: 2px 0 0; color: color-mix(in srgb, var(--foreground) 55%, transparent); font-size: 12px; } .admin-system-update-progress time { color: color-mix(in srgb, var(--foreground) 40%, transparent); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: 10px; } .admin-system-update-dot { width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: color-mix(in srgb, var(--foreground) 24%, transparent); } .admin-system-update-dot[data-active="true"] { background: var(--status-loading); box-shadow: 0 0 0 4px color-mix(in srgb, var(--status-loading) 12%, transparent); } .admin-system-update-empty, .admin-system-update-backup > p { margin: 0; color: color-mix(in srgb, var(--foreground) 52%, transparent); font-size: 12px; line-height: 1.7; } .admin-system-update-alert { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--status-warning) 26%, var(--admin-divider)); border-radius: 8px; background: color-mix(in srgb, var(--status-warning) 7%, var(--background)); } .admin-system-update-alert[data-tone="error"] { border-color: color-mix(in srgb, var(--status-error) 28%, var(--admin-divider)); background: color-mix(in srgb, var(--status-error) 7%, var(--background)); } .admin-system-update-alert > svg { margin-top: 1px; color: var(--status-warning); } .admin-system-update-alert[data-tone="error"] > svg { color: var(--status-error); } .admin-system-update-alert strong { display: block; font-size: 12px; } .admin-system-update-alert p { margin: 3px 0 0; color: color-mix(in srgb, var(--foreground) 62%, transparent); font-size: 12px; line-height: 1.6; } .admin-system-update-alert.is-compact { margin-bottom: 10px; padding: 10px 12px; } @media (max-width: 980px) { .admin-system-update-grid { grid-template-columns: 1fr; } } @media (max-width: 639px) { .admin-page-frame { padding: 10px 12px 0; } .admin-page-header { min-height: 0; gap: 10px; padding-bottom: 12px; } .admin-page-title { font-size: 14px; } .admin-page-location-section, .admin-page-location-separator { font-size: 14px; } .admin-page-actions { width: 100%; flex: 1 1 auto; justify-content: flex-end; } .admin-list-toolbar { padding-block: 8px; } .admin-list-toolbar-filters { width: 100%; padding-top: 2px; } .admin-list-toolbar-chips { width: 100%; } .admin-list-toolbar-filters.is-open { display: flex; } .admin-list-toolbar-main .app-list-search { min-width: 0; width: 100% !important; max-width: none; flex-basis: 100%; } .admin-table-frame { border-radius: 8px; } .admin-shell .admin-table-surface .ant-table-thead > tr > th, .admin-modal-root .admin-table-surface .ant-table-thead > tr > th, .admin-shell .admin-table-surface .ant-table-tbody > tr > td, .admin-modal-root .admin-table-surface .ant-table-tbody > tr > td { padding-inline: 12px !important; } .admin-pagination-bar { flex-wrap: wrap; padding: 8px 12px; } .admin-pagination-total { width: 100%; flex-basis: 100%; } .admin-pagination-bar .ant-pagination { max-width: 100%; flex-wrap: wrap; } .admin-batch-bar { align-items: flex-start; } .admin-settings-section-summary { border-bottom: 1px solid var(--admin-divider); } .admin-shell .app-workspace-nav-link.is-active::before { display: none; } .admin-stat-tile + .admin-stat-tile { border-top: var(--stroke-1) solid var(--color-border); border-left: 0; } } /* 系统性能:高密度运维快照,仅作用于管理员性能页。 */ .admin-system-performance { gap: 12px; padding-bottom: 24px; } .admin-performance-auto, .admin-performance-statusbar, .admin-performance-statusbar > div, .admin-performance-kpi-heading, .admin-performance-cache-note, .admin-performance-safety { display: flex; align-items: center; } .admin-performance-auto { gap: 7px; color: var(--admin-text-muted); font-size: 12px; } .admin-performance-alert { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 9px 11px; border: 1px solid color-mix(in srgb, var(--admin-status-error) 28%, var(--admin-divider)); border-radius: 8px; background: color-mix(in srgb, var(--admin-status-error) 6%, var(--admin-layer-1)); color: var(--admin-status-error); font-size: 12px; } .admin-performance-statusbar { justify-content: space-between; gap: 12px; min-height: 34px; padding: 6px 10px; border: 1px solid var(--admin-divider); border-radius: 8px; background: var(--admin-layer-2); color: var(--admin-text-muted); font-size: 11px; } .admin-performance-statusbar > div { gap: 9px; min-width: 0; } .admin-performance-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--admin-card-border); border-radius: 10px; background: var(--admin-layer-1); box-shadow: var(--admin-card-shadow); } .admin-performance-kpi { min-width: 0; padding: 12px 14px 11px; } .admin-performance-kpi + .admin-performance-kpi { border-left: 1px solid var(--admin-divider); } .admin-performance-kpi-heading { gap: 7px; color: var(--admin-text-muted); } .admin-performance-kpi-heading > span { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 6px; background: var(--admin-layer-2); color: var(--admin-chart-primary); } .admin-performance-kpi p { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-performance-kpi-heading p { font-size: 11px; font-weight: 600; } .admin-performance-kpi > strong { display: block; margin-top: 8px; color: var(--admin-text-primary); font-size: 20px; font-weight: 650; letter-spacing: -0.025em; } .admin-performance-kpi > p { margin-top: 3px; color: var(--admin-text-muted); font-size: 10px; } .admin-performance-kpi .ant-progress { display: block; margin-top: 7px; line-height: 1; } .admin-performance-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: start; gap: 12px; } .admin-performance-side-stack { display: grid; gap: 12px; } .admin-system-performance .admin-settings-section-summary { padding: 12px 14px; } .admin-system-performance .admin-settings-section-content { padding: 0; } .admin-performance-facts { display: grid; grid-template-columns: minmax(112px, 0.72fr) minmax(0, 1.45fr); margin: 0; } .admin-performance-facts dt, .admin-performance-facts dd { min-width: 0; margin: 0; padding: 8px 14px; border-top: 1px solid var(--admin-row-border); font-size: 11px; line-height: 1.45; } .admin-performance-facts dt { color: var(--admin-text-muted); } .admin-performance-facts dd { color: var(--admin-text-secondary); overflow-wrap: anywhere; } .admin-performance-submetrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--admin-divider); } .admin-performance-submetrics > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 9px 14px; } .admin-performance-submetrics > div:nth-child(even) { border-left: 1px solid var(--admin-row-border); } .admin-performance-submetrics > div:nth-child(n + 3) { border-top: 1px solid var(--admin-row-border); } .admin-performance-submetrics span, .admin-performance-cache-groups small { color: var(--admin-text-muted); font-size: 10px; } .admin-performance-submetrics strong { font-size: 11px; font-weight: 600; } .admin-performance-cache-groups { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); } .admin-performance-cache-groups > div { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: 5px; padding: 13px 14px; border-top: 1px solid var(--admin-row-border); } .admin-performance-cache-groups > div + div { border-left: 1px solid var(--admin-row-border); } .admin-performance-cache-groups span { overflow: hidden; color: var(--admin-text-muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; } .admin-performance-cache-groups strong { font-size: 16px; font-weight: 650; } .admin-performance-safety { flex-wrap: wrap; gap: 7px 12px; padding: 9px 14px; border-top: 1px solid var(--admin-divider); background: var(--admin-layer-2); color: var(--admin-text-muted); font-size: 10px; } .admin-performance-safety strong { color: var(--admin-status-success); } .admin-performance-safety span::before { margin-right: 5px; color: var(--admin-status-success); content: "✓"; } .admin-performance-cache-note { gap: 6px; color: var(--admin-text-muted); font-size: 11px; } .admin-performance-confirm { display: grid; gap: 8px; color: var(--admin-text-secondary); font-size: 13px; line-height: 1.65; } .admin-performance-confirm p { margin: 0; } @media (max-width: 1080px) { .admin-performance-kpis, .admin-performance-cache-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-performance-kpi:nth-child(3), .admin-performance-kpi:nth-child(4), .admin-performance-cache-groups > div:nth-child(n + 3) { border-top: 1px solid var(--admin-divider); } .admin-performance-kpi:nth-child(3), .admin-performance-cache-groups > div:nth-child(3) { border-left: 0; } } @media (max-width: 820px) { .admin-performance-grid { grid-template-columns: 1fr; } } @media (max-width: 560px) { .admin-performance-statusbar { align-items: flex-start; flex-direction: column; } .admin-performance-kpis, .admin-performance-cache-groups { grid-template-columns: 1fr; } .admin-performance-kpi + .admin-performance-kpi, .admin-performance-cache-groups > div + div { border-top: 1px solid var(--admin-divider); border-left: 0; } .admin-performance-facts { grid-template-columns: 100px minmax(0, 1fr); } }