:root { --acceptance-bg: #f4f5f7; --acceptance-side: #0a0e14; --acceptance-card: #ffffff; --acceptance-input: #ffffff; --acceptance-ink: #101828; --acceptance-ink-2: #475467; --acceptance-ink-3: #98a2b3; --acceptance-line: #e4e7ec; --acceptance-grid: #d0d5dd; --acceptance-accent: #2e5bd7; --acceptance-accent-bg: #eef3ff; --acceptance-red: #d92d20; --acceptance-red-bg: #fee4e2; --acceptance-amber: #dc6803; --acceptance-amber-bg: #fef0c7; --acceptance-green: #12b76a; --acceptance-green-bg: #d1fadf; --acceptance-radius: 14px; --acceptance-shadow: 0 1px 2px rgba(16,24,40,.04), 0 10px 28px -20px rgba(16,24,40,.22); --acceptance-shadow-strong: 0 2px 5px rgba(16,24,40,.07), 0 18px 40px -24px rgba(16,24,40,.25); --chart-muted-1: #8ea0b5; --chart-muted-2: #70869f; --chart-muted-3: #aab6c4; --chart-grid: #e5e9f0; --color-canvas: var(--acceptance-bg); --color-surface: var(--acceptance-card); --color-surface-subtle: #f7f8fa; --color-text: var(--acceptance-ink); --color-text-secondary: var(--acceptance-ink-2); --color-border: var(--acceptance-line); --color-primary: var(--acceptance-accent); --color-primary-soft: var(--acceptance-accent-bg); --color-success: var(--acceptance-green); --color-success-soft: var(--acceptance-green-bg); --color-warning: var(--acceptance-amber); --color-warning-soft: var(--acceptance-amber-bg); --color-danger: var(--acceptance-red); --color-danger-soft: var(--acceptance-red-bg); } html[data-theme="dark"] { --acceptance-bg: #0f1319; --acceptance-card: #161d27; --acceptance-input: #131d2b; --acceptance-ink: #eef1f6; --acceptance-ink-2: #b6c0cf; --acceptance-ink-3: #7a8699; --acceptance-line: #26303f; --acceptance-grid: #334155; --acceptance-accent: #5b82e8; --acceptance-accent-bg: #1d2a44; --acceptance-red: #f97066; --acceptance-red-bg: #3a1f1c; --acceptance-amber: #fdb022; --acceptance-amber-bg: #3a2c12; --acceptance-green: #32d583; --acceptance-green-bg: #10351f; --acceptance-shadow: 0 1px 3px rgba(0,0,0,.2), 0 8px 24px -16px rgba(0,0,0,.65); --acceptance-shadow-strong: 0 2px 6px rgba(0,0,0,.28), 0 20px 42px -24px rgba(0,0,0,.8); --chart-muted-1: #8291a6; --chart-muted-2: #667991; --chart-muted-3: #9aa7b8; --chart-grid: #2b3544; --color-surface-subtle: #121923; } body:has(#appShell:not([hidden])) { margin: 0; background: var(--acceptance-bg); color: var(--acceptance-ink); font: 14px/1.5 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; } #appShell.shell { display: grid; grid-template-columns: 224px minmax(0,1fr); min-height: 100vh; background: var(--acceptance-bg); } #appShell .app-sidebar { width: auto; height: 100vh; padding: 16px 12px; gap: 4px; position: sticky; top: 0; overflow: auto; background: var(--acceptance-side); border-right: 0; color: #cbd5e1; } #appShell .sidebar-brand { min-height: 0; margin: 0 0 10px; padding: 6px 10px 16px; gap: 10px; border-bottom: 1px solid rgba(255,255,255,.08); } #appShell .sidebar-brand-mark { width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg,#2e5bd7,#7a5af8); font-size: 16px; box-shadow: none; } #appShell .sidebar-brand strong { color: #fff; font-size: 14px; font-weight: 700; } #appShell .sidebar-brand small { margin-top: 1px; color: #7f8ca3; font-size: 11px; letter-spacing: 0; } #appShell .primary-nav { gap: 2px; padding: 0; } #appShell .nav-group { gap: 2px; } #appShell .nav-group-label { margin: 0; padding: 10px 10px 4px; color: #5f6c82; font-size: 11px; font-weight: 500; letter-spacing: .5px; } #appShell .nav-item { min-height: 0; padding: 8px 10px; gap: 9px; border-radius: 8px; color: #cbd5e1; font-size: 13px; font-weight: 500; } #appShell .nav-item:hover { background: rgba(255,255,255,.06); color: #fff; } #appShell .nav-item.active { background: var(--acceptance-accent); color: #fff; font-weight: 600; box-shadow: none; } #appShell .nav-glyph { width: 18px; height: 18px; display: grid; place-items: center; flex: 0 0 18px; color: inherit; line-height: 1; } #appShell .nav-glyph svg { width: 17px; height: 17px; display: block; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; } #appShell .sidebar-user { margin-top: auto; min-height: 0; padding: 14px 0 0; gap: 9px; border-top: 1px solid rgba(255,255,255,.08); } #appShell .sidebar-avatar { width: 30px; height: 30px; background: var(--acceptance-accent); font-size: 12px; } #appShell .sidebar-user strong { color: #fff; font-size: 13px; font-weight: 600; } #appShell .sidebar-user small { color: #7f8ca3; font-size: 11px; } #appShell .sidebar-logout { margin-left: auto; padding: 3px 5px; border: 0; background: transparent; color: #7f8ca3; font-size: 11px; cursor: pointer; } #appShell .sidebar-logout:hover { color: #fff; } #appShell .workspace { min-width: 0; padding: 16px 22px 44px; background: var(--acceptance-bg); } #appShell .topbar { min-height: 0; margin: 0 0 14px; padding: 0; align-items: center; gap: 14px; border: 0; background: transparent; box-shadow: none; } #appShell .mobile-menu-button { place-items: center; border-color: var(--acceptance-line); background: var(--acceptance-card); color: var(--acceptance-ink-2); } #appShell .mobile-menu-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; } #appShell .page-context { display: block; } #appShell .page-context h1 { margin: 0; color: var(--acceptance-ink); font-size: 24px; line-height: 1.25; } #appShell .page-context .page-crumb { margin: 4px 0 0; max-width: 880px; color: var(--acceptance-ink-3); font-size: 13px; line-height: 1.45; } #appShell .reference-topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; } #appShell .topbar-scope { min-width: 0; display: inline-flex; align-items: center; gap: 6px; color: var(--acceptance-ink-3); font-size: 11px; } #appShell .topbar-scope b { max-width: 150px; overflow: hidden; color: var(--acceptance-ink-2); font-weight: 650; text-overflow: ellipsis; white-space: nowrap; } #appShell .reference-period { padding: 3px 10px; border: 1px solid var(--acceptance-line); border-radius: 999px; background: var(--acceptance-bg); color: var(--acceptance-ink-3); font-size: 11px; font-weight: 600; } #appShell #exportDashboardButton { min-height: 32px; padding: 7px 14px; border-radius: 9px; background: var(--acceptance-accent); border-color: var(--acceptance-accent); color: #fff; font-size: 12.5px; box-shadow: 0 6px 16px -11px var(--acceptance-accent); } #appShell .topbar-utility-group { min-height: 32px; padding: 2px; display: inline-flex; align-items: center; gap: 1px; border: 1px solid var(--acceptance-line); border-radius: 10px; background: var(--acceptance-card); box-shadow: 0 1px 2px rgba(16,24,40,.04); } #appShell .theme-toggle { min-height: 30px; padding: 6px 10px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--acceptance-line); border-radius: 9px; background: var(--acceptance-card); color: var(--acceptance-ink-2); font: inherit; font-size: 12px; cursor: pointer; } #appShell .theme-toggle:hover { border-color: var(--acceptance-accent); color: var(--acceptance-accent); } #appShell .theme-toggle span { width: 14px; color: var(--acceptance-accent); font-size: 14px; line-height: 1; } #appShell .theme-toggle b { font-weight: 600; } #appShell .leadership-mode-toggle { min-height: 30px; padding: 6px 11px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid color-mix(in srgb,var(--acceptance-accent) 32%,var(--acceptance-line)); border-radius: 9px; background: var(--acceptance-accent-bg); color: var(--acceptance-accent); font: inherit; font-size: 12px; cursor: pointer; transition: transform 150ms ease,box-shadow 150ms ease,border-color 150ms ease; } #appShell .leadership-mode-toggle:hover { border-color: var(--acceptance-accent); box-shadow: 0 5px 14px -10px var(--acceptance-accent); } #appShell .leadership-mode-toggle:active { transform: translateY(1px) scale(.98); } #appShell .leadership-mode-toggle b { font-weight: 650; } #appShell .topbar-utility-group .theme-toggle, #appShell .topbar-utility-group .leadership-mode-toggle, #appShell .topbar-utility-group .view-mode-button { min-height: 26px; padding: 5px 8px; border: 0; border-radius: 7px; background: transparent; color: var(--acceptance-ink-2); box-shadow: none; font-size: 11.5px; } #appShell .topbar-utility-group > button + button { border-left: 1px solid var(--acceptance-line); border-top-left-radius: 0; border-bottom-left-radius: 0; } #appShell .topbar-utility-group button:hover,#appShell .topbar-utility-group button[aria-pressed="true"] { background: var(--acceptance-accent-bg); color: var(--acceptance-accent); } #appShell .system-context-controls { display: none !important; } #appShell .auth-feedback { margin-bottom: 14px; } #appShell .page-view { max-width: none; } #appShell .reference-card, #appShell .reference-kpi { min-width: 0; border: 1px solid var(--acceptance-line); border-radius: var(--acceptance-radius); background: var(--acceptance-card); color: var(--acceptance-ink); box-shadow: var(--acceptance-shadow); } #appShell .reference-card { padding: 16px 18px; } #appShell .reference-title { min-height: 24px; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: 15px; font-weight: 700; } #appShell .reference-title small { color: var(--acceptance-ink-3); font-size: 12px; font-weight: 400; } #appShell .reference-tag { display: inline-block; padding: 1.5px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; } #appShell .reference-tag.red { color: var(--acceptance-red); background: var(--acceptance-red-bg); } #appShell .reference-tag.amber { color: var(--acceptance-amber); background: var(--acceptance-amber-bg); } #appShell .reference-tag.green { color: var(--acceptance-green); background: var(--acceptance-green-bg); } #appShell .reference-tag.blue { color: var(--acceptance-accent); background: var(--acceptance-accent-bg); } #appShell .reference-tag.gray { color: var(--acceptance-ink-3); background: var(--acceptance-bg); } #appShell .reference-grid { display: grid; gap: 14px; } #appShell .reference-g4 { grid-template-columns: repeat(4,minmax(0,1fr)); } #appShell .reference-g3 { grid-template-columns: repeat(3,minmax(0,1fr)); } #appShell .module-overview { margin-bottom: 14px; } #appShell .module-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; } #appShell .module-grid button { min-height: 64px; padding: 11px 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--acceptance-line); border-radius: 10px; background: transparent; color: var(--acceptance-ink); text-align: left; cursor: pointer; } #appShell .module-grid button { transition: transform 150ms ease,border-color 150ms ease,background 150ms ease,box-shadow 150ms ease; } #appShell .module-grid button:hover { border-color: color-mix(in srgb,var(--acceptance-accent) 36%,var(--acceptance-line)); background: var(--acceptance-accent-bg); box-shadow: 0 8px 18px -16px var(--acceptance-accent); transform: translateY(-1px); } #appShell .module-grid button:active { transform: translateY(1px) scale(.985); box-shadow: none; } #appShell .module-grid b,#appShell .module-grid small { display: block; } #appShell .module-grid b { font-size: 13px; } #appShell .module-grid small { margin-top: 4px; color: var(--acceptance-ink-3); font-size: 11.5px; } #appShell .module-light,#appShell .reference-status-dot { width: 10px; height: 10px; flex: 0 0 auto; display: inline-block; border-radius: 50%; } #appShell .reference-status-dot { background: var(--chart-muted-3); } #appShell .reference-status-dot.ready { background: var(--acceptance-accent); } #appShell .module-light.red,#appShell .reference-status-dot.red { background: var(--acceptance-red); box-shadow: none; } #appShell .module-light.amber,#appShell .reference-status-dot.amber { background: var(--acceptance-amber); box-shadow: none; } #appShell .module-light.green,#appShell .reference-status-dot.green { background: var(--acceptance-accent); box-shadow: none; } #appShell .reference-kpis { margin-bottom: 14px; } #appShell .reference-kpi { min-height: 102px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; } #appShell .reference-kpi .label { display: flex; align-items: center; gap: 6px; color: var(--acceptance-ink-2); font-size: 12.5px; font-weight: 600; } #appShell .reference-kpi strong { color: var(--acceptance-ink); font-size: 30px; font-weight: 800; line-height: 1.1; letter-spacing: -.6px; } #appShell .reference-kpi:first-child strong,#appShell .reference-kpi:nth-child(2) strong { color: var(--acceptance-ink-3); } #appShell .reference-kpi:nth-child(3) strong { color: var(--acceptance-green); } #appShell .reference-kpi:nth-child(4) strong { color: var(--acceptance-red); } #appShell .reference-kpi small { color: var(--acceptance-ink-3); font-size: 12px; } /* Leadership-first overview: conclusions and decisions stay above operational detail. */ #appShell .executive-summary { margin-bottom: 14px; } #appShell .executive-summary-heading { margin-bottom: 10px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; } #appShell .executive-summary-heading .section-label { margin: 0 0 3px; } #appShell .executive-summary-heading h2 { margin: 0; color: var(--acceptance-ink); font-size: 22px; line-height: 1.25; letter-spacing: -.02em; } #appShell .executive-publication-state { display: flex; align-items: center; gap: 9px; color: var(--acceptance-ink-3); } #appShell .executive-publication-state small { font-size: 12.5px; } #appShell .executive-kpis { display: grid; grid-template-columns: 1.15fr repeat(4,minmax(0,1fr)); gap: 12px; } #appShell .leadership-kpi { min-height: 132px; padding: 17px 18px; gap: 6px; position: relative; overflow: hidden; transition: transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease; } #appShell .leadership-kpi:not(.is-unavailable):hover { border-color: color-mix(in srgb,var(--acceptance-accent) 28%,var(--acceptance-line)); box-shadow: var(--acceptance-shadow-strong); transform: translateY(-2px); } #appShell .leadership-kpi::after { content: ""; width: 62px; height: 62px; position: absolute; right: -28px; top: -30px; border: 13px solid color-mix(in srgb,var(--acceptance-accent) 8%,transparent); border-radius: 50%; pointer-events: none; } #appShell .leadership-kpi .label { min-height: 25px; justify-content: space-between; color: var(--acceptance-ink-2); font-size: 13.5px; } #appShell .leadership-kpi strong { margin-top: 2px; color: var(--acceptance-ink); font-size: 40px; line-height: 1; letter-spacing: -1.2px; font-variant-numeric: tabular-nums; } #appShell .leadership-kpi[data-metric-card] strong { color: var(--acceptance-ink); } #appShell .leadership-kpi small { min-height: 18px; color: var(--acceptance-ink-2); font-size: 12.5px; line-height: 1.45; } #appShell .leadership-kpi-foot { margin: auto 0 0; padding-top: 7px; border-top: 1px solid var(--acceptance-line); color: var(--acceptance-ink-3); font-size: 12px; line-height: 1.35; } #appShell .leadership-kpi.is-unavailable { background: color-mix(in srgb,var(--acceptance-card) 90%,var(--acceptance-bg)); border-style: dashed; box-shadow: none; } #appShell .leadership-kpi.is-unavailable strong { margin-top: 9px; color: var(--acceptance-ink-3); font-size: 23px; letter-spacing: 0; } #appShell .leadership-kpi.is-unavailable::after { display: none; } #appShell .leadership-kpi[data-metric-card="risk"]:not(.is-unavailable) strong { color: var(--acceptance-ink); } #appShell .leadership-kpi[data-metric-card="risk"].has-risk:not(.is-unavailable) strong { color: var(--acceptance-red); } #appShell .leadership-kpi[data-metric-card="risk"].has-risk:not(.is-unavailable)::after { border-color: color-mix(in srgb,var(--acceptance-red) 12%,transparent); } #appShell .leadership-kpi[data-metric-card="breakthrough"]:not(.is-unavailable) strong { color: var(--acceptance-accent); } #appShell .executive-focus-grid { margin-bottom: 14px; display: grid; grid-template-columns: minmax(0,1.35fr) minmax(390px,.85fr); gap: 14px; align-items: stretch; } #appShell .executive-focus-grid > .reference-card { min-height: 306px; } #appShell .executive-trend-card { display: flex; flex-direction: column; } #appShell .trend-narrative { margin-bottom: 8px; padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid color-mix(in srgb,var(--acceptance-accent) 20%,var(--acceptance-line)); border-radius: 10px; background: color-mix(in srgb,var(--acceptance-accent-bg) 55%,var(--acceptance-card)); } #appShell .trend-narrative > div { min-width: 0; display: grid; gap: 1px; } #appShell .trend-narrative > div > span { color: var(--acceptance-accent); font-size: 11px; font-weight: 750; letter-spacing: .06em; } #appShell .trend-narrative strong { color: var(--acceptance-ink); font-size: 14px; } #appShell .trend-narrative small { color: var(--acceptance-ink-3); font-size: 11.5px; } #appShell .trend-delta { flex: 0 0 auto; padding: 4px 9px; border-radius: 999px; background: var(--acceptance-bg); color: var(--acceptance-ink-2); font-size: 12px; font-weight: 750; font-variant-numeric: tabular-nums; } #appShell .trend-delta.up { background: var(--acceptance-accent-bg); color: var(--acceptance-accent); } #appShell .trend-delta.down { background: var(--acceptance-red-bg); color: var(--acceptance-red); } #appShell .executive-trend-card #homeWeeklyTrendChart { min-height: 178px; position: relative; display: grid; place-items: center; } #appShell .executive-trend-card .reference-trend { width: 100%; height: 212px; } #appShell .executive-chart-empty { width: 100%; min-width: 0; display: grid; place-items: center; } #appShell .executive-empty-state { width: 100%; min-height: 200px; padding: 24px; display: grid; align-content: center; justify-items: center; border: 1px dashed var(--acceptance-line); border-radius: 10px; background: var(--acceptance-bg); text-align: center; } #appShell .executive-empty-state.compact { min-height: 210px; } #appShell .executive-empty-state strong { color: var(--acceptance-ink-2); font-size: 15px; } #appShell .executive-empty-state p { max-width: 440px; margin: 7px 0 0; color: var(--acceptance-ink-3); font-size: 13px; line-height: 1.55; } #appShell .reference-decisions.executive-decisions { margin: 0; border-left: 1px solid var(--acceptance-line); border-top: 3px solid var(--acceptance-accent); } #appShell .reference-decisions.executive-decisions.has-critical { border-top-color: var(--acceptance-red); } #appShell .reference-decisions.executive-decisions.is-clear { border-top-color: var(--acceptance-accent); } #appShell .executive-decisions .status-list { display: grid; gap: 8px; } #appShell .executive-decisions .status-list-item { padding: 11px 12px; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 12px; border: 1px solid var(--acceptance-line); border-radius: 10px; background: color-mix(in srgb,var(--acceptance-bg) 55%,var(--acceptance-card)); transition: transform 150ms ease,border-color 150ms ease,box-shadow 150ms ease; } #appShell .executive-decisions .status-list-item:hover { border-color: color-mix(in srgb,var(--acceptance-accent) 30%,var(--acceptance-line)); box-shadow: 0 9px 18px -18px var(--acceptance-ink); transform: translateY(-1px); } #appShell .executive-decisions .status-list-item:active { transform: translateY(1px) scale(.992); box-shadow: none; } #appShell .executive-decisions .status-list-item > .status-item-content { grid-column: 1; min-width: 0; } #appShell .executive-decisions .status-list-item > .status-item-aside { grid-column: 2; align-self: start; } #appShell .executive-decisions .status-list-item strong { font-size: 13.5px; } #appShell .executive-decisions .status-list-item p { display: -webkit-box; overflow: hidden; font-size: 12.5px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } #appShell .executive-decisions .status-item-facts { margin-top: 7px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; } #appShell .executive-decisions .status-item-facts span { min-width: 0; padding: 5px 7px; } #appShell .executive-decisions .status-item-facts span:last-child { grid-column: 1 / -1; } #appShell .executive-decisions .status-item-owner { margin-top: 7px; } #appShell .status-item-evidence { margin-top: 8px; color: var(--acceptance-ink-3); font-size: 11.5px; } #appShell .status-item-evidence-toggle { width: max-content; padding: 0; display: block; border: 0; background: transparent; color: var(--acceptance-accent); font: inherit; font-weight: 650; cursor: pointer; user-select: none; } #appShell .status-item-evidence-toggle::before { content: "›"; margin-right: 5px; display: inline-block; transition: transform 140ms ease; } #appShell .status-item-evidence-toggle[aria-expanded="true"]::before { transform: rotate(90deg); } #appShell .status-item-evidence-panel[hidden] { display: none !important; } #appShell .status-item-evidence-panel p { margin-top: 6px !important; padding: 8px 9px; display: block !important; border-left: 2px solid var(--acceptance-accent); background: var(--acceptance-accent-bg); color: var(--acceptance-ink-2) !important; -webkit-line-clamp: unset !important; } #appShell .executive-insight { margin-bottom: 14px; padding-top: 12px; padding-bottom: 12px; } #appShell .executive-insight .reference-title { margin-bottom: 7px; } #appShell .insight-brief-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; } #appShell .insight-brief { min-width: 0; padding: 12px 13px 11px; display: flex; flex-direction: column; border-top: 2px solid color-mix(in srgb,var(--acceptance-accent) 72%,var(--chart-muted-2)); border-radius: 9px; background: color-mix(in srgb,var(--acceptance-bg) 72%,transparent); } #appShell .insight-brief.risk { border-top-color: color-mix(in srgb,var(--acceptance-red) 72%,var(--acceptance-line)); } #appShell .insight-brief header,#appShell .insight-brief footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; } #appShell .insight-kind { color: var(--acceptance-accent); font-size: 11.5px; font-weight: 750; } #appShell .insight-brief.risk .insight-kind { color: var(--acceptance-red); } #appShell .insight-confidence { padding: 2px 7px; border-radius: 999px; background: var(--acceptance-accent-bg); color: var(--acceptance-ink-2); font-size: 10.5px; font-weight: 700; white-space: nowrap; } #appShell .insight-brief > strong { margin: 9px 0 7px; color: var(--acceptance-ink); font-size: 14px; line-height: 1.4; } #appShell .insight-brief > p { margin: 0 0 5px; color: var(--acceptance-ink-2); font-size: 12.5px; line-height: 1.5; } #appShell .insight-brief > p b { margin-right: 6px; color: var(--acceptance-ink-3); font-size: 11px; } #appShell .insight-brief footer { margin-top: auto; padding-top: 6px; color: var(--acceptance-ink-3); font-size: 11px; } #appShell .insight-evidence-toggle { margin-top: 7px; font-size: 11.5px; } #appShell .insight-evidence-panel p { margin: 5px 0 0 !important; font-size: 11.5px !important; } #appShell .business-summary-card { min-height: 148px; padding: 15px; gap: 8px; } #appShell .business-summary-value-area { min-height: 39px; flex-wrap: wrap; } #appShell .business-summary-value.compact { font-size: 17px !important; line-height: 1.3 !important; } #appShell .business-summary-delta { padding: 3px 7px; border-radius: 999px; background: color-mix(in srgb,var(--chart-muted-1) 11%,transparent); color: var(--acceptance-ink-2); font-size: 10.5px; font-weight: 700; white-space: nowrap; } #appShell .business-summary-progress { width: 100%; height: 5px; display: block; overflow: hidden; border-radius: 999px; background: color-mix(in srgb,var(--chart-muted-1) 13%,var(--acceptance-bg)); } #appShell .business-summary-progress i { width: var(--progress); height: 100%; display: block; border-radius: inherit; background: color-mix(in srgb,var(--acceptance-accent) 72%,var(--chart-muted-2)); transition: width 360ms ease; } #appShell .business-summary-card small { margin-top: auto; color: var(--acceptance-ink-3); } #appShell .leadership-detail-grid { margin-bottom: 14px; display: grid; grid-template-columns: minmax(0,1.18fr) minmax(410px,.82fr); gap: 14px; } #appShell .leadership-detail-grid > .reference-card { min-height: 276px; } #appShell .leadership-detail-grid #homeFourDimensionRadar { flex: 0 0 250px; min-height: 210px; } #appShell .leadership-detail-grid #homeFourDimensionRadar.executive-chart-empty { flex-basis: 55%; } #appShell .leadership-detail-grid .executive-empty-state { min-height: 198px; } #appShell .table-empty-state { padding: 22px 10px; display: grid; justify-items: center; gap: 5px; text-align: center; } #appShell .table-empty-state strong { color: var(--acceptance-ink-2); font-size: 13.5px; } #appShell .table-empty-state span { color: var(--acceptance-ink-3); font-size: 12.5px; } #appShell .leadership-detail-grid > .reference-card { position: relative; } #appShell .department-bar { width: min(150px,100%); min-width: 90px; height: 22px; position: relative; overflow: hidden; border-radius: 7px; background: color-mix(in srgb,var(--chart-muted-1) 12%,var(--acceptance-bg)); cursor: crosshair; } #appShell .department-bar i { width: var(--bar); height: 100%; display: block; border-radius: inherit; background: color-mix(in srgb,var(--acceptance-accent) 64%,var(--chart-muted-2)); transition: width 360ms ease,filter 120ms ease; } #appShell .department-bar b { position: absolute; inset: 0 7px 0 auto; display: grid; align-items: center; color: var(--acceptance-ink); font-size: 11px; font-variant-numeric: tabular-nums; } #appShell .department-bar:hover i,#appShell .department-bar:focus i { filter: saturate(1.25) brightness(1.04); } #appShell .department-ranking-card { overflow: visible; } #appShell .department-rank-controls { margin: 0 0 11px; padding: 3px; display: inline-flex; gap: 2px; border-radius: 8px; background: color-mix(in srgb,var(--chart-muted-1) 10%,var(--acceptance-bg)); } #appShell .department-rank-controls button { min-height: 27px; padding: 4px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--acceptance-ink-3); font-size: 11.5px; font-weight: 650; cursor: pointer; } #appShell .department-rank-controls button[aria-pressed="true"] { background: var(--acceptance-card); color: var(--acceptance-accent); box-shadow: 0 1px 4px rgba(20,35,70,.12); } #appShell .department-ranking { display: grid; gap: 7px; } #appShell .department-rank-item { min-width: 0; padding: 7px 3px; display: grid; grid-template-columns: 24px minmax(0,1fr) 54px; align-items: center; gap: 9px; border-bottom: 1px solid color-mix(in srgb,var(--acceptance-line) 78%,transparent); } #appShell .department-rank-item:last-child { border-bottom: 0; } #appShell .department-rank-index { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px; background: color-mix(in srgb,var(--chart-muted-1) 11%,transparent); color: var(--acceptance-ink-3); font-size: 10.5px; font-weight: 800; } #appShell .department-rank-main { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: baseline; gap: 2px 8px; } #appShell .department-rank-main strong { overflow: hidden; color: var(--acceptance-ink); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; } #appShell .department-rank-main > span { color: var(--acceptance-ink-3); font-size: 10.5px; white-space: nowrap; } #appShell .department-rank-track { grid-column: 1 / -1; width: 100%; height: 5px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb,var(--chart-muted-1) 12%,var(--acceptance-bg)); cursor: crosshair; } #appShell .department-rank-track i { width: var(--rank); height: 100%; display: block; border-radius: inherit; background: color-mix(in srgb,var(--chart-muted-1) 70%,var(--chart-muted-2)); transition: width 320ms ease; } #appShell .department-rank-track i.risk { background: color-mix(in srgb,var(--acceptance-red) 74%,var(--chart-muted-2)); } #appShell .department-rank-metric { display: flex; align-items: baseline; justify-content: flex-end; gap: 2px; font-variant-numeric: tabular-nums; } #appShell .department-rank-metric b { color: var(--acceptance-ink); font-size: 17px; } #appShell .department-rank-metric span { color: var(--acceptance-ink-3); font-size: 10px; } #appShell .compact-module-overview .module-grid { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px; } #appShell .compact-module-overview .module-grid button { min-height: 62px; padding: 10px; } #appShell .compact-module-overview .module-grid b { font-size: 13px; } #appShell .compact-module-overview .module-grid small { min-height: 32px; font-size: 12px; line-height: 1.35; } #appShell .reference-charts { margin-bottom: 14px; align-items: stretch; } #appShell .reference-charts > article { min-height: 282px; } #appShell .radar-layout { display: flex; align-items: center; gap: 14px; } #appShell .reference-radar { width: min(250px,60%); flex: 0 0 auto; overflow: visible; } #appShell .reference-radar polygon,#appShell .reference-radar line { fill: none; stroke: var(--acceptance-grid); stroke-width: 1; } #appShell .reference-radar .radar-placeholder { fill: rgba(91,130,232,.16); stroke: var(--acceptance-accent); stroke-width: 2; } #appShell .reference-radar .radar-data-area { fill: rgba(91,130,232,.22); stroke-width: 2.4; } #appShell .reference-radar .radar-data-dot { fill: var(--acceptance-accent); stroke: var(--acceptance-card); stroke-width: 1.5; } #appShell .reference-radar .radar-data-dot { cursor: crosshair; transition: r 120ms ease; } #appShell .reference-radar .radar-data-dot:hover,#appShell .reference-radar .radar-data-dot:focus { r: 5.5px; outline: none; } #appShell .reference-radar text { fill: var(--acceptance-ink-2); font-size: 12px; text-anchor: middle; } #appShell #homeFourDimensionRadar { flex: 0 0 250px; } #appShell #homeFourDimensionRadar .reference-radar { width: 100%; } #appShell .chart-copy { color: var(--acceptance-ink-3); font-size: 12px; line-height: 1.55; } #appShell .reference-trend { width: 100%; height: 180px; } #appShell .reference-trend .trend-grid line { stroke: var(--chart-grid); stroke-width: 1; stroke-dasharray: 2 4; } #appShell .reference-trend .trend-series { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } #appShell .reference-trend .trend-series-landscape { stroke: var(--chart-muted-1); } #appShell .reference-trend .trend-series-thinking { stroke: var(--chart-muted-2); } #appShell .reference-trend .trend-series-ability { stroke: var(--acceptance-accent); stroke-width: 3; } #appShell .reference-trend .trend-series-habit { stroke: var(--chart-muted-3); } #appShell .reference-trend .trend-point { fill: var(--acceptance-card); stroke-width: 2; cursor: crosshair; transform-box: fill-box; transform-origin: center; transition: transform 120ms ease,fill 120ms ease; } #appShell .reference-trend .trend-point.trend-series-ability { fill: var(--acceptance-accent); } #appShell .development-weekly-reference .reference-trend .trend-series-landscape { stroke: #7387a6; } #appShell .development-weekly-reference .reference-trend .trend-series-thinking { stroke: #8b78b8; stroke-dasharray: 7 3; } #appShell .development-weekly-reference .reference-trend .trend-series-ability { stroke: var(--acceptance-accent); stroke-width: 3.2; } #appShell .development-weekly-reference .reference-trend .trend-series-habit { stroke: #3f9b7a; stroke-dasharray: 2 3; } #appShell .development-weekly-reference .reference-trend .trend-point.trend-series-landscape { fill: #7387a6; } #appShell .development-weekly-reference .reference-trend .trend-point.trend-series-thinking { fill: #8b78b8; } #appShell .development-weekly-reference .reference-trend .trend-point.trend-series-ability { fill: var(--acceptance-accent); } #appShell .development-weekly-reference .reference-trend .trend-point.trend-series-habit { fill: #3f9b7a; } #appShell .development-weekly-reference .reference-trend .trend-selected-band { fill: color-mix(in srgb,var(--acceptance-accent) 8%,transparent); stroke: none; } #appShell .development-weekly-reference .reference-trend .trend-grid line.selected { stroke: color-mix(in srgb,var(--acceptance-accent) 45%,var(--chart-grid)); stroke-width: 1.4; stroke-dasharray: none; } #appShell .development-weekly-reference .reference-trend .trend-point.selected { stroke-width: 3; } #appShell .development-weekly-reference .reference-trend .trend-axis-labels text.selected { fill: var(--acceptance-accent); font-weight: 750; } #appShell .reference-trend .trend-point:hover,#appShell .reference-trend .trend-point:focus { fill: var(--acceptance-card); outline: none; transform: scale(1.55); } #appShell .reference-trend .trend-extreme line { stroke: var(--chart-muted-3); stroke-width: 1; stroke-dasharray: 4 4; } #appShell .reference-trend .trend-extreme text { fill: var(--acceptance-ink-3); font-size: 10px; font-weight: 700; } #appShell .reference-trend .trend-extreme.high text { fill: var(--acceptance-accent); } #appShell .reference-trend path { fill: none; stroke: var(--acceptance-ink-3); stroke-width: 2; stroke-dasharray: 5 4; } #appShell .reference-trend .trend-axis-labels text { fill: var(--acceptance-ink-3); font-size: 10px; } #appShell .chart-legend { margin-top: -2px; display: flex; align-items: center; justify-content: center; gap: 15px; color: var(--acceptance-ink-3); font-size: 11px; } #appShell .chart-legend span { display: inline-flex; align-items: center; gap: 5px; } #appShell .chart-legend i { width: 14px; height: 3px; display: block; border-radius: 999px; background: var(--chart-muted-1); } #appShell .chart-legend .thinking i { background: var(--chart-muted-2); } #appShell .chart-legend .ability { color: var(--acceptance-accent); font-weight: 700; } #appShell .chart-legend .ability i { height: 4px; background: var(--acceptance-accent); } #appShell .chart-legend .habit i { background: var(--chart-muted-3); } #appShell .chart-tooltip { max-width: 210px; padding: 6px 9px; position: absolute; z-index: 5; transform: translate(-50%,-100%); border: 1px solid color-mix(in srgb,var(--acceptance-accent) 25%,var(--acceptance-line)); border-radius: 7px; background: color-mix(in srgb,var(--acceptance-card) 96%,transparent); color: var(--acceptance-ink); box-shadow: var(--acceptance-shadow-strong); font-size: 11.5px; font-weight: 650; line-height: 1.35; pointer-events: none; white-space: nowrap; } #appShell #homeFourDimensionRadar { position: relative; } #appShell .coverage-track i,#appShell .source-coverage-row i,#appShell .trend-bars i { border-radius: 999px; background: var(--chart-muted-1); } #appShell .trend-bars .current i,#appShell .coverage-button.active .coverage-track i { background: var(--acceptance-accent); } #appShell .reference-hint { margin: 8px 0 0; color: var(--acceptance-ink-3); font-size: 12.5px; line-height: 1.55; } #appShell .reference-link { padding: 0; border: 0; background: none; color: var(--acceptance-accent); font-size: 12px; cursor: pointer; } #appShell .reference-table { width: 100%; border-collapse: collapse; color: var(--acceptance-ink); font-size: 13.5px; } #appShell .reference-table th,#appShell .reference-table td { padding: 8px 10px; border-bottom: 1px solid var(--acceptance-line); text-align: left; vertical-align: middle; } #appShell .reference-table th { color: var(--acceptance-ink-3); background: var(--acceptance-bg); font-size: 11.5px; font-weight: 600; } #appShell .reference-table tr:last-child td { border-bottom: 0; } #appShell .reference-ai { margin-bottom: 14px; background: linear-gradient(135deg,var(--acceptance-accent-bg),transparent 60%),var(--acceptance-card); } #appShell .reference-ai ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; } #appShell .reference-ai li { color: var(--acceptance-ink-2); font-size: 13.5px; line-height: 1.55; } #appShell .reference-decisions { margin-bottom: 14px; border-left: 4px solid var(--acceptance-red); } #appShell .reference-decisions:not(.executive-decisions) .status-list { gap: 0; } #appShell .reference-decisions:not(.executive-decisions) .status-list-item { min-height: 0; padding: 11px 2px; border: 0; border-bottom: 1px solid var(--acceptance-line); border-radius: 0; background: transparent; box-shadow: none; } #appShell .reference-decisions:not(.executive-decisions) .status-list-item:last-child { border-bottom: 0; } #appShell .reference-decisions .status-list-item > i { display: none; } #appShell .reference-decisions .status-list-item strong { font-size: 13px; } #appShell .reference-decisions .status-list-item p { color: var(--acceptance-ink-2); } #appShell .reference-decisions .status-item-action { border-color: var(--acceptance-line); background: transparent; color: var(--acceptance-accent); } #appShell .reference-talent-dynamics { margin-bottom: 14px; } #appShell .reference-filters { display: flex; gap: 8px; flex-wrap: wrap; } #appShell .reference-filters select,#appShell .reference-filters button { min-height: 28px; padding: 5px 10px; border: 1px solid var(--acceptance-line); border-radius: 8px; background: var(--acceptance-card); color: var(--acceptance-ink); font-size: 12px; } #appShell .reference-table-scroll { overflow: auto; } #appShell .reference-person-link { padding: 0; border: 0; background: none; color: var(--acceptance-ink); font: inherit; font-weight: 650; cursor: pointer; } #appShell .reference-person-link:hover { color: var(--acceptance-accent); } #appShell .reference-full-button { width: 100%; margin-top: 10px; padding: 7px 14px; border: 1px solid var(--acceptance-line); border-radius: 9px; background: var(--acceptance-card); color: var(--acceptance-ink); font-size: 12.5px; font-weight: 600; cursor: pointer; } #appShell .reference-full-button:active,#appShell .status-item-action:active,#appShell .reference-link:active { transform: translateY(1px); } /* Leadership-ready organization drill-down and talent profile. */ #appShell [data-department-detail] { display: none; } body[data-route="talent-department"] #appShell [data-department-detail] { display: block; } #appShell .department-executive-brief { margin-bottom: 15px; padding: 18px; border: 1px solid var(--acceptance-line); border-radius: 13px; background: linear-gradient(135deg,var(--acceptance-accent-bg),transparent 48%),var(--acceptance-card); box-shadow: var(--acceptance-shadow); } #appShell .department-brief-empty { min-height: 118px; display: grid; place-content: center; gap: 5px; color: var(--acceptance-ink-3); text-align: center; } #appShell .department-brief-empty strong { color: var(--acceptance-ink-2); } #appShell .department-brief-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; } #appShell .department-brief-head h3 { margin: 2px 0 4px; color: var(--acceptance-ink); font-size: 22px; } #appShell .department-brief-head p { margin: 0; color: var(--acceptance-ink-3); font-size: 12px; } #appShell .department-brief-head > div:last-child { display: flex; align-items: center; gap: 8px; } #appShell .department-brief-kpis { margin-top: 15px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; } #appShell .department-brief-kpis article { padding: 12px 13px; border: 1px solid color-mix(in srgb,var(--acceptance-line) 82%,transparent); border-radius: 10px; background: color-mix(in srgb,var(--acceptance-card) 88%,transparent); } #appShell .department-brief-kpis span,#appShell .department-brief-kpis small { display: block; color: var(--acceptance-ink-3); font-size: 11.5px; } #appShell .department-brief-kpis strong { display: block; margin: 6px 0 3px; color: var(--acceptance-ink); font-size: 24px; font-variant-numeric: tabular-nums; } #appShell .department-brief-narrative { margin-top: 10px; display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 9px; } #appShell .department-brief-narrative article { min-width: 0; padding: 12px 13px; border-radius: 10px; background: color-mix(in srgb,var(--chart-muted-1) 7%,transparent); } #appShell .department-brief-narrative article.conclusion { border-left: 3px solid var(--acceptance-accent); background: var(--acceptance-accent-bg); } #appShell .department-brief-narrative article.risk { border-left: 3px solid color-mix(in srgb,var(--acceptance-red) 68%,var(--acceptance-line)); } #appShell .department-brief-narrative span { display: block; margin-bottom: 6px; color: var(--acceptance-ink-3); font-size: 11.5px; font-weight: 700; } #appShell .department-brief-narrative strong,#appShell .department-brief-narrative p { margin: 0; color: var(--acceptance-ink-2); font-size: 13px; line-height: 1.55; } #appShell .department-brief-detail { margin-top: 10px; display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 10px; } #appShell .department-brief-detail > section { padding: 13px; border: 1px solid color-mix(in srgb,var(--acceptance-line) 82%,transparent); border-radius: 10px; background: color-mix(in srgb,var(--acceptance-card) 86%,transparent); } #appShell .department-section-title > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; } #appShell .department-section-title span { color: var(--acceptance-ink); font-size: 13px; font-weight: 750; } #appShell .department-section-title small { color: var(--acceptance-ink-3); font-size: 11px; } #appShell .department-risk-grid { margin-top: 9px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; } #appShell .department-risk-metric { padding: 9px; border-top: 2px solid var(--chart-muted-1); border-radius: 8px; background: color-mix(in srgb,var(--chart-muted-1) 7%,transparent); } #appShell .department-risk-metric.warning { border-top-color: var(--acceptance-amber); } #appShell .department-risk-metric.risk { border-top-color: var(--acceptance-red); } #appShell .department-risk-metric span,#appShell .department-risk-metric small { display: block; color: var(--acceptance-ink-3); font-size: 10.5px; } #appShell .department-risk-metric strong { display: block; margin: 5px 0 2px; color: var(--acceptance-ink); font-size: 21px; } #appShell .department-decision-list { margin-top: 8px; display: grid; gap: 6px; } #appShell .department-decision-item { padding: 8px 9px; border-left: 2px solid var(--acceptance-accent); border-radius: 7px; background: var(--acceptance-accent-bg); } #appShell .department-decision-item.risk { border-left-color: var(--acceptance-red); background: color-mix(in srgb,var(--acceptance-red) 7%,transparent); } #appShell .department-decision-item strong { color: var(--acceptance-ink); font-size: 12px; } #appShell .department-decision-item p { margin: 3px 0 0; color: var(--acceptance-ink-2); font-size: 11.5px; line-height: 1.45; } #appShell .department-decision-item footer { margin-top: 5px; display: flex; justify-content: space-between; gap: 8px; color: var(--acceptance-ink-3); font-size: 10.5px; } #appShell .department-rank-item { width: 100%; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; } #appShell .department-rank-item:hover,#appShell .department-rank-item:focus-visible { border-radius: 8px; background: color-mix(in srgb,var(--acceptance-accent) 7%,transparent); outline: none; } #appShell .department-rank-item:focus-visible { box-shadow: 0 0 0 2px color-mix(in srgb,var(--acceptance-accent) 36%,transparent); } #appShell .talent-toolbar { position: sticky; top: 0; z-index: 3; padding: 10px; border: 1px solid var(--acceptance-line); border-radius: 10px; background: color-mix(in srgb,var(--acceptance-card) 96%,transparent); box-shadow: 0 4px 12px rgba(20,35,70,.06); } #appShell .talent-table-wrap,#appShell .operations-table-wrap { overflow: auto; border: 1px solid var(--acceptance-line); border-radius: 10px; background: var(--acceptance-card); box-shadow: 0 5px 16px rgba(20,35,70,.06); } #appShell .talent-table th,#appShell .operations-table th { position: sticky; top: 0; z-index: 2; height: 44px; border-bottom: 1px solid var(--acceptance-line); background: color-mix(in srgb,var(--acceptance-bg) 92%,var(--acceptance-card)); color: var(--acceptance-ink-3); font-weight: 700; } #appShell .talent-table td,#appShell .operations-table td { min-height: 56px; border-top: 1px solid color-mix(in srgb,var(--acceptance-line) 76%,transparent); background: transparent; color: var(--acceptance-ink-2); } #appShell .talent-table tbody tr:nth-child(even) td,#appShell .operations-table tbody tr:nth-child(even) td { background: color-mix(in srgb,var(--chart-muted-1) 3%,transparent); } #appShell .talent-table tbody tr:hover td,#appShell .operations-table tbody tr:hover td { background: color-mix(in srgb,var(--acceptance-accent) 6%,transparent); } #appShell .table-sort { padding: 4px 0; display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; cursor: pointer; } #appShell .table-sort span { color: var(--acceptance-ink-3); font-size: 10px; } #appShell .table-sort.active { color: var(--acceptance-accent); } #appShell .talent-person-button { padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; } #appShell .talent-person-button:hover strong { color: var(--acceptance-accent); } #appShell .mapping-state,#appShell .talent-status-cell .reference-tag,#appShell .operations-table .reference-tag { min-width: max-content; border-radius: 999px; font-weight: 700; } #profileDialog.profile-dialog { width: min(860px,100vw); } #profileDialog .profile-dialog-head { position: sticky; top: 0; z-index: 6; border-bottom: 1px solid var(--acceptance-line); background: color-mix(in srgb,var(--acceptance-card) 96%,transparent); backdrop-filter: blur(12px); } #profileDialog #profileExecutiveSummary { margin: 14px 24px 0; } #profileDialog .profile-executive-summary { padding: 15px; border: 1px solid color-mix(in srgb,var(--acceptance-accent) 24%,var(--acceptance-line)); border-radius: 12px; background: linear-gradient(135deg,var(--acceptance-accent-bg),transparent 62%),var(--acceptance-card); box-shadow: var(--acceptance-shadow); } #profileDialog .profile-executive-summary > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } #profileDialog .profile-executive-summary h3 { margin: 2px 0 0; color: var(--acceptance-ink); font-size: 17px; } #profileDialog .profile-conclusion { margin-top: 10px; padding: 10px 11px; border-left: 3px solid var(--acceptance-accent); border-radius: 7px; background: color-mix(in srgb,var(--acceptance-card) 72%,transparent); } #profileDialog .profile-conclusion span { display: block; margin-bottom: 4px; color: var(--acceptance-accent); font-size: 11px; font-weight: 750; } #profileDialog .profile-conclusion strong { color: var(--acceptance-ink); font-size: 14px; line-height: 1.5; } #profileDialog .profile-summary-grid { margin-top: 9px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; } #profileDialog .profile-summary-grid article { padding: 10px; border-radius: 8px; background: color-mix(in srgb,var(--chart-muted-1) 7%,transparent); } #profileDialog .profile-summary-grid article.risk { border-top: 2px solid color-mix(in srgb,var(--acceptance-red) 68%,var(--acceptance-line)); } #profileDialog .profile-summary-grid article.action { border-top: 2px solid var(--acceptance-accent); } #profileDialog .profile-summary-grid span { color: var(--acceptance-ink-3); font-size: 11px; font-weight: 700; } #profileDialog .profile-summary-grid p { margin: 5px 0 0; color: var(--acceptance-ink-2); font-size: 12px; line-height: 1.5; } #profileDialog .profile-executive-summary > footer { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 6px 12px; color: var(--acceptance-ink-3); font-size: 10.5px; } #profileDialog .profile-grid { gap: 10px; } #profileDialog .profile-grid > section,#profileDialog .profile-grid > details { border: 1px solid var(--acceptance-line); border-radius: 11px; background: color-mix(in srgb,var(--acceptance-card) 94%,var(--acceptance-bg)); box-shadow: none; } #profileDialog .profile-roster-grid > div,#profileDialog .loop-fact-column,#profileDialog .evidence-timeline article { background: var(--acceptance-card); border-color: var(--acceptance-line); } #profileDialog .profile-detail-disclosure { padding: 0; overflow: hidden; } #profileDialog .profile-detail-disclosure > summary { padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; list-style: none; cursor: pointer; } #profileDialog .profile-detail-disclosure > summary::-webkit-details-marker,#profileDialog .profile-evidence-groups details > summary::-webkit-details-marker { display: none; } #profileDialog .profile-detail-disclosure > summary span { display: grid; gap: 3px; } #profileDialog .profile-detail-disclosure > summary small { color: var(--acceptance-accent); font-size: 10.5px; font-weight: 750; } #profileDialog .profile-detail-disclosure > summary strong { color: var(--acceptance-ink); font-size: 15px; } #profileDialog .profile-detail-disclosure > summary em { color: var(--acceptance-ink-3); font-size: 11px; font-style: normal; } #profileDialog .profile-detail-disclosure[open] > summary { border-bottom: 1px solid var(--acceptance-line); background: var(--acceptance-accent-bg); } #profileDialog .profile-evidence-groups { padding: 12px 14px 15px; gap: 8px; } #profileDialog .profile-evidence-groups > details { border: 1px solid var(--acceptance-line); border-radius: 8px; background: var(--acceptance-card); } #profileDialog .profile-evidence-groups > details + details { padding-top: 0; border-top: 1px solid var(--acceptance-line); } #profileDialog .profile-evidence-groups details > summary { padding: 10px 11px; display: flex; justify-content: space-between; gap: 8px; color: var(--acceptance-ink-2); font-size: 12px; font-weight: 700; cursor: pointer; } #profileDialog .profile-evidence-groups details > summary span { color: var(--acceptance-ink-3); font-size: 10.5px; font-weight: 500; } #profileDialog .profile-evidence-groups details > div { padding: 0 10px 11px; } body[data-presentation="true"] #appShell.shell { grid-template-columns: minmax(0,1fr); } body[data-presentation="true"] #appShell .app-sidebar { display: none; } body[data-presentation="true"] #appShell .workspace { max-width: 1680px; width: 100%; margin: 0 auto; padding: 24px 34px 52px; } body[data-presentation="true"] #appShell .topbar { margin-bottom: 20px; } body[data-presentation="true"] #appShell .page-context h1 { font-size: 30px; } body[data-presentation="true"] #appShell .page-context .page-crumb { font-size: 14px; } body[data-presentation="true"] #appShell .reference-period, body[data-presentation="true"] #appShell .theme-toggle, body[data-presentation="true"] #appShell #exportDashboardButton, body[data-presentation="true"] #appShell .view-mode-button, body[data-presentation="true"] #appShell .reference-filters, body[data-presentation="true"] #appShell .compact-module-overview, body[data-presentation="true"] #appShell .reference-talent-dynamics { display: none !important; } body[data-presentation="true"] #appShell button[data-route], body[data-presentation="true"] #appShell .status-item-action, body[data-presentation="true"] #appShell .reference-link { display: none !important; } body[data-presentation="true"] #appShell .executive-summary-heading h2 { font-size: 28px; } body[data-presentation="true"] #appShell .executive-kpis { gap: 16px; } body[data-presentation="true"] #appShell .leadership-kpi { min-height: 154px; padding: 20px 21px; } body[data-presentation="true"] #appShell .leadership-kpi strong { font-size: 48px; } body[data-presentation="true"] #appShell .reference-title { min-height: 28px; font-size: 17px; } body[data-presentation="true"] #appShell .executive-focus-grid { grid-template-columns: minmax(0,1.4fr) minmax(420px,.8fr); gap: 18px; } body[data-presentation="true"] #appShell .executive-focus-grid > .reference-card { min-height: 340px; box-shadow: var(--acceptance-shadow-strong); } body[data-presentation="true"] #appShell .trend-narrative strong { font-size: 16px; } body[data-presentation="true"] #appShell .insight-brief > strong { font-size: 16px; } body[data-presentation="true"] #appShell .insight-brief > p { font-size: 14px; } body[data-presentation="true"] #appShell .talent-toolbar, body[data-presentation="true"] #appShell .profile-link, body[data-presentation="true"] #appShell .talent-table .col-action, body[data-presentation="true"] #appShell .talent-table td:last-child { display: none !important; } body[data-presentation="true"] #appShell .table-sort { pointer-events: none; } body[data-presentation="true"] #appShell .table-sort span { display: none; } body[data-presentation="true"] #appShell .department-executive-brief { padding: 22px; box-shadow: var(--acceptance-shadow-strong); } body[data-presentation="true"] #appShell .department-brief-head h3 { font-size: 28px; } body[data-presentation="true"] #appShell .department-brief-narrative strong, body[data-presentation="true"] #appShell .department-brief-narrative p { font-size: 15px; } body[data-presentation="true"] #profileDialog.profile-dialog { width: min(1180px,94vw); height: min(920px,94vh); max-height: 94vh; margin: auto; border: 1px solid var(--acceptance-line); border-radius: 16px; } body[data-presentation="true"] #profileDialog #previousProfileButton, body[data-presentation="true"] #profileDialog #nextProfileButton { display: none; } body[data-presentation="true"] #profileDialog .profile-executive-summary h3 { font-size: 21px; } body[data-presentation="true"] #profileDialog .profile-conclusion strong { font-size: 17px; } body[data-presentation="true"] #profileDialog .profile-summary-grid p { font-size: 14px; } body[data-presentation="true"] #appShell .development-scoring-view .section-heading, body[data-presentation="true"] #appShell .development-scoring-view .scoring-boundary, body[data-presentation="true"] #appShell .development-scoring-view .scoring-toolbar, body[data-presentation="true"] #appShell .development-scoring-view .development-roster-filters, body[data-presentation="true"] #appShell .development-scoring-view .scoring-metrics, body[data-presentation="true"] #appShell .development-scoring-view .development-weekly-reference, body[data-presentation="true"] #appShell .development-scoring-view .development-loop-head, body[data-presentation="true"] #appShell .development-scoring-view .development-loop-metrics, body[data-presentation="true"] #appShell .development-scoring-view .development-plan-alerts, body[data-presentation="true"] #appShell .development-scoring-view .development-loop-layout > aside, body[data-presentation="true"] #appShell .development-scoring-view .scoring-layout, body[data-presentation="true"] #appShell .development-scoring-view .development-plan-detail { display: none !important; } body[data-presentation="true"] #appShell .development-scoring-view { gap: 22px; } body[data-presentation="true"] #appShell .development-executive-summary { padding: 24px; box-shadow: var(--acceptance-shadow-strong); } body[data-presentation="true"] #appShell .development-executive-summary h3 { font-size: 28px; } body[data-presentation="true"] #appShell .development-executive-conclusion strong { font-size: 18px; } body[data-presentation="true"] #appShell .development-executive-grid article { padding: 16px; } body[data-presentation="true"] #appShell .development-stage-section, body[data-presentation="true"] #appShell .development-four-dimensions, body[data-presentation="true"] #appShell .development-loop-layout > article { box-shadow: var(--acceptance-shadow-strong); } body[data-presentation="true"] #appShell .development-stage-timeline article { min-height: 74px; } body[data-presentation="true"] #appShell .development-plan-list { margin-top: 0; } #appShell .reference-placeholder { padding-top: 0; } #appShell .reference-placeholder .reference-card { min-height: 180px; } #appShell .reference-placeholder p { color: var(--acceptance-ink-2); } #appShell .settings-entry-grid { margin-top: 14px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; } #appShell .settings-entry-grid button { min-height: 86px; padding: 14px; display: block; border: 1px solid var(--acceptance-line); border-radius: 10px; background: transparent; color: var(--acceptance-ink); text-align: left; cursor: pointer; } #appShell .settings-entry-grid button:hover { background: var(--acceptance-accent-bg); } #appShell .settings-entry-grid b,#appShell .settings-entry-grid small { display: block; } #appShell .settings-entry-grid small { margin-top: 5px; color: var(--acceptance-ink-3); font-size: 11.5px; } /* Existing business pages inherit the acceptance shell and card language. */ #appShell .section-block { padding: 0; background: transparent; border: 0; box-shadow: none; } #appShell .section-heading { margin-bottom: 14px; } #appShell .section-heading h2 { font-size: 18px; } #appShell .interview-boundary,#appShell .scoring-boundary,#appShell .interview-metrics article,#appShell .scoring-metrics article,#appShell .interview-panel,#appShell .scoring-ability,#appShell .scoring-level,#appShell .development-scoring-toolbar { border-color: var(--acceptance-line); background: var(--acceptance-card); color: var(--acceptance-ink); box-shadow: var(--acceptance-shadow); } #appShell .development-scoring-toolbar select,#appShell .development-scoring-toolbar input,#appShell .scoring-ability input,#appShell .scoring-ability textarea { border-color: var(--acceptance-line); background: var(--acceptance-input); color: var(--acceptance-ink); } @media (max-width: 1180px) { #appShell .executive-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); } #appShell .compact-module-overview .module-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } } @media (max-width: 1100px) { #appShell .reference-g4,#appShell .reference-g3 { grid-template-columns: repeat(2,minmax(0,1fr)); } #appShell .module-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } #appShell .executive-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } #appShell .executive-focus-grid,#appShell .leadership-detail-grid { grid-template-columns: 1fr; } #appShell .insight-brief-grid { grid-template-columns: 1fr; } #appShell .department-brief-narrative,#appShell .department-brief-detail { grid-template-columns: 1fr; } #appShell .department-risk-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 760px) { #appShell.shell { display: block; } #appShell .app-sidebar { position: fixed; left: 0; top: 0; z-index: 30; width: min(286px,86vw); transform: translateX(-105%); transition: transform 180ms ease; box-shadow: var(--shadow-float); } #appShell .app-sidebar.open { transform: translateX(0); } #appShell .workspace { padding: 14px 12px 32px; } #appShell .topbar { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 9px; } #appShell .page-context { min-width: 0; } #appShell .page-context h1 { overflow: hidden; font-size: 19px; text-overflow: ellipsis; white-space: nowrap; } #appShell .page-context .page-crumb { display: none; } #appShell .reference-topbar-actions { width: auto; margin-left: 0; justify-content: flex-end; gap: 6px; } #appShell .topbar-scope,#appShell .reference-period,#appShell .view-mode-context { display: none; } #appShell .topbar-utility-group b { display: none; } #appShell .topbar-utility-group .theme-toggle,#appShell .topbar-utility-group .leadership-mode-toggle { width: 28px; padding: 5px; justify-content: center; } #appShell .topbar-utility-group .theme-toggle span { width: auto; } #appShell .topbar-utility-group .view-mode-button { width: 28px; padding: 5px; font-size: 0; } #appShell .topbar-utility-group .view-mode-button::before { content: '◎'; font-size: 13px; } #appShell .reference-g4,#appShell .reference-g3,#appShell .module-grid { grid-template-columns: 1fr; } #appShell .executive-summary-heading { align-items: flex-start; flex-direction: column; } #appShell .executive-publication-state { align-items: flex-start; flex-direction: column; } #appShell .executive-kpis,#appShell .compact-module-overview .module-grid { grid-template-columns: 1fr; } #appShell .executive-focus-grid { grid-template-columns: 1fr; } #appShell .leadership-detail-grid { grid-template-columns: 1fr; } #appShell .settings-entry-grid { grid-template-columns: 1fr; } #appShell .radar-layout { align-items: flex-start; flex-direction: column; } #appShell .reference-radar { width: 230px; max-width: 100%; } #appShell .department-rank-main { grid-template-columns: 1fr; } #appShell .department-rank-main > span { white-space: normal; } #appShell .department-executive-brief { padding: 14px; } #appShell .department-brief-head { flex-direction: column; } #appShell .department-brief-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } #profileDialog #profileExecutiveSummary { margin-inline: 14px; } #profileDialog .profile-grid { padding-inline: 14px; } #profileDialog .profile-summary-grid { grid-template-columns: 1fr; } #profileDialog .profile-detail-disclosure > summary,#profileDialog .profile-evidence-groups details > summary { align-items: flex-start; flex-direction: column; } } @media (max-width: 620px) { #appShell #exportDashboardButton { min-width: 34px; padding-inline: 8px; font-size: 0; } #appShell #exportDashboardButton::after { content: '导出'; font-size: 11.5px; } } @media print { #appShell.shell { display: block; } #appShell .app-sidebar,#appShell .reference-topbar-actions { display: none !important; } #appShell .workspace { padding: 0; } #appShell .reference-card,#appShell .reference-kpi { break-inside: avoid; box-shadow: none; } } /* 2026-09 executive polish: visual hierarchy only; data and behavior stay unchanged. */ #appShell .role-workbench.ceo-standard-mode .workbench-kpis { gap: 10px; } #appShell .role-workbench.ceo-standard-mode .workbench-kpi { min-height: 102px; padding: 13px 14px; border-color: var(--acceptance-line); border-top: 2px solid color-mix(in srgb,var(--chart-muted-1) 30%,var(--acceptance-line)); background: var(--acceptance-card); box-shadow: none; } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.blue, #appShell .role-workbench.ceo-standard-mode .workbench-kpi.warning { border-top-color: color-mix(in srgb,var(--chart-muted-1) 44%,var(--acceptance-line)); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.blue i, #appShell .role-workbench.ceo-standard-mode .workbench-kpi.warning i { background: var(--chart-muted-2); box-shadow: 0 0 0 4px color-mix(in srgb,var(--chart-muted-2) 12%,transparent); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.danger { border-color: color-mix(in srgb,var(--acceptance-red) 36%,var(--acceptance-line)); border-top-color: var(--acceptance-red); background: linear-gradient(180deg,color-mix(in srgb,var(--acceptance-red-bg) 54%,var(--acceptance-card)),var(--acceptance-card)); box-shadow: 0 10px 24px -24px var(--acceptance-red); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.danger strong { color: var(--acceptance-red); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.danger .workbench-kpi-action b { color: var(--acceptance-red); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.is-interactive:hover { border-color: color-mix(in srgb,var(--acceptance-ink-3) 38%,var(--acceptance-line)); box-shadow: 0 10px 24px -22px var(--acceptance-ink); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi.danger.is-interactive:hover { border-color: color-mix(in srgb,var(--acceptance-red) 58%,var(--acceptance-line)); } #appShell .executive-four-dimension-card { --score-manual: #20ad7a; --score-ai: #4d7ff0; } #appShell .executive-four-dimension-card .reference-title { margin-bottom: 14px; } #appShell .executive-score-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; } #appShell .executive-score-person { min-height: 318px; padding: 14px; display: grid; grid-template-rows: auto auto minmax(0,1fr) auto auto; align-content: start; border-color: var(--acceptance-line); background: color-mix(in srgb,var(--acceptance-card) 94%,var(--acceptance-bg)); box-shadow: none; } #appShell .executive-score-person.watched, #appShell .executive-score-person.warning, #appShell .executive-score-person.watched.warning { border-color: var(--acceptance-line); box-shadow: none; } #appShell .executive-score-person header { min-height: 32px; } #appShell .executive-score-role { margin: 7px 0 6px; } #appShell .executive-score-visual { grid-template-columns: minmax(190px,1fr) minmax(118px,.45fr); gap: 12px; } #appShell .executive-score-visual .reference-radar .radar-series-manual .radar-data-area { fill: color-mix(in srgb,var(--score-manual) 15%,transparent); stroke: var(--score-manual); } #appShell .executive-score-visual .reference-radar .radar-series-manual .radar-data-dot { fill: var(--score-manual); } #appShell .executive-score-visual .reference-radar .radar-series-ai .radar-data-area { fill: color-mix(in srgb,var(--score-ai) 9%,transparent); stroke: var(--score-ai); } #appShell .executive-score-visual .reference-radar .radar-series-ai .radar-data-dot { fill: var(--score-ai); } #appShell .executive-score-chart-legend .executive-score-legend-manual i { border-color: var(--score-manual); } #appShell .executive-score-chart-legend .executive-score-legend-ai i { border-color: var(--score-ai); } #appShell .executive-score-summary .executive-score-source-manual strong, #appShell .executive-score-summary .executive-score-source-manual small { color: var(--score-manual); } #appShell .executive-score-summary .executive-score-source-ai strong, #appShell .executive-score-summary .executive-score-source-ai small { color: var(--score-ai); } #appShell .executive-score-difference { margin: 9px 0 0; padding-top: 9px; border-top: 1px solid var(--acceptance-line); } #appShell .executive-score-person footer { margin-top: 7px; padding-top: 7px; align-self: end; border-top: 0; } #appShell .executive-score-person footer > span { color: var(--acceptance-ink-3); white-space: normal; line-height: 1.45; } #appShell .executive-score-roster-note { padding: 9px 11px; background: color-mix(in srgb,var(--acceptance-bg) 72%,var(--acceptance-card)); } /* Organization talent: compact decision workspace and a left-to-right decision path. */ #appShell .organization-view > .section-heading { margin-bottom: 8px; } #appShell .organization-talent-summary { min-height: 0; padding: 12px 16px; } #appShell .organization-talent-summary h2 { font-size: 18px; } #appShell .organization-talent-summary p { margin-top: 3px; } #appShell .executive-talent-decision { gap: 10px; } #appShell .executive-decision-metrics { gap: 9px; } #appShell .executive-decision-metric { min-height: 88px; padding: 12px 14px; border-left-color: color-mix(in srgb,var(--chart-muted-1) 55%,var(--acceptance-line)); background: var(--acceptance-card); } #appShell .executive-decision-metric.warning { border-left-color: var(--acceptance-amber); } #appShell .executive-decision-metric.critical { border-left-color: var(--acceptance-red); } #appShell .executive-decision-metric strong { margin: 4px 0 2px; font-size: 23px; } #appShell .executive-talent-search > label { justify-content: start; } #appShell .executive-talent-management-grid { grid-template-columns: minmax(0,1.55fr) minmax(292px,.65fr); align-items: start; gap: 12px; } #appShell .executive-talent-main-column { min-width: 0; display: grid; gap: 12px; } #appShell .executive-priority-section, #appShell .executive-organization-section, #appShell .executive-change-section { padding: 15px; } #appShell .executive-organization-section { position: sticky; top: 98px; } #appShell .executive-priority-list .executive-talent-person.is-decision { grid-template-columns: minmax(142px,.8fr) 86px minmax(180px,1.35fr) minmax(158px,1fr); gap: 6px 12px; border-top-color: var(--acceptance-line); border-left: 3px solid var(--acceptance-red); } #appShell .executive-priority-list .executive-talent-person.is-decision::before { content: "人员"; grid-column: 1; grid-row: 1; align-self: start; margin-bottom: 36px; color: var(--acceptance-ink-3); font-size: 10px; font-weight: 750; } #appShell .executive-priority-list .executive-talent-person.is-decision header { grid-row: 1; align-self: end; } #appShell .executive-priority-list .executive-talent-person.is-decision .executive-talent-role { grid-row: 2; } #appShell .executive-priority-list .executive-talent-person.is-decision .executive-talent-change::before { content: "变化幅度"; grid-column: 1 / -1; margin-bottom: 4px; color: var(--acceptance-ink-3); font-size: 10px; font-weight: 750; } #appShell .executive-priority-list .executive-talent-person.is-decision > p:not(.executive-talent-role)::before { content: "原因"; display: block; margin-bottom: 5px; color: var(--acceptance-ink-3); font-size: 10px; font-weight: 750; } #appShell .executive-priority-list .executive-talent-person.is-decision footer::before { content: "建议动作"; color: var(--acceptance-ink-3); font-size: 10px; font-weight: 750; } #appShell .executive-priority-list .executive-talent-person.is-decision footer > b { display: none; } #appShell .executive-change-list { grid-template-columns: repeat(3,minmax(0,1fr)); } #appShell .executive-change-list .executive-talent-person { min-height: 216px; display: grid; grid-template-rows: auto auto auto 1fr auto; } /* Talent review: one journey, one toolbar, one card language. */ #appShell .talent-review-view { gap: 10px; } #appShell .talent-closure-nav { width: 100%; margin: 0; padding: 4px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; border-color: var(--acceptance-line); background: var(--acceptance-card); counter-reset: talent-step; } #appShell .talent-closure-nav button { min-height: 44px; padding: 7px 12px; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--acceptance-ink-3); font-weight: 700; counter-increment: talent-step; } #appShell .talent-closure-nav button::before { content: counter(talent-step); width: 23px; height: 23px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--acceptance-line); border-radius: 50%; background: var(--acceptance-bg); color: var(--acceptance-ink-3); font-size: 11px; } body[data-route="talent-stock"] #appShell .talent-closure-nav button:nth-child(1), body[data-route="talent-interviews"] #appShell .talent-closure-nav button:nth-child(2), body[data-route="talent-scoring"] #appShell .talent-closure-nav button:nth-child(3) { background: var(--acceptance-accent-bg); color: var(--acceptance-accent); } body[data-route="talent-stock"] #appShell .talent-closure-nav button:nth-child(1)::before, body[data-route="talent-interviews"] #appShell .talent-closure-nav button:nth-child(2)::before, body[data-route="talent-scoring"] #appShell .talent-closure-nav button:nth-child(3)::before { border-color: var(--acceptance-accent); background: var(--acceptance-accent); color: #fff; } #appShell .talent-gradient-page { gap: 11px; } #appShell .talent-gradient-toolbar { padding: 12px 14px; align-items: flex-end; border: 1px solid var(--acceptance-line); border-radius: 11px; background: var(--acceptance-card); } #appShell .talent-gradient-toolbar-title { min-width: 190px; display: grid; gap: 2px; } #appShell .talent-gradient-toolbar-title > strong { font-size: 15px; } #appShell .talent-gradient-toolbar-title > small { color: var(--acceptance-ink-3); font-size: 11px; } #appShell .talent-gradient-toolbar-actions { min-width: 0; display: flex; align-items: flex-end; justify-content: flex-end; gap: 8px; } #appShell .talent-period-control, #appShell .talent-gradient-search-control, #appShell .talent-cadence-control { display: grid; gap: 4px; color: var(--acceptance-ink-3); font-size: 10.5px; font-weight: 700; } #appShell .talent-period-control { min-width: 86px; } #appShell .talent-period-control strong { min-height: 34px; padding: 7px 10px; display: flex; align-items: center; border: 1px solid var(--acceptance-line); border-radius: 8px; background: var(--acceptance-input); color: var(--acceptance-ink); font-size: 12px; } #appShell .talent-gradient-search-control input { width: min(250px,22vw); min-width: 180px; min-height: 34px; padding: 6px 10px; border: 1px solid var(--acceptance-line); border-radius: 8px; background: var(--acceptance-input); color: var(--acceptance-ink); } #appShell .talent-cadence-control .performance-window-switch { padding: 2px; border: 1px solid var(--acceptance-line); border-radius: 8px; background: var(--acceptance-bg); } #appShell .talent-cadence-control .button { min-height: 28px; padding: 4px 8px; border: 0; background: transparent; } #appShell .talent-cadence-control .button.active { background: var(--acceptance-card); color: var(--acceptance-accent); box-shadow: 0 1px 4px rgba(20,35,70,.12); } #appShell .talent-gradient-export { min-height: 34px; } #appShell .talent-gradient-cards { gap: 10px; } #appShell .talent-gradient-card { min-height: 104px; padding: 13px 14px; border: 1px solid var(--acceptance-line); border-left: 3px solid var(--chart-muted-2); border-radius: 11px; background: var(--acceptance-card); box-shadow: none; } #appShell .talent-gradient-card.benchmark { border-left-color: var(--acceptance-green); } #appShell .talent-gradient-card.stable { border-left-color: var(--score-ai,#4d7ff0); } #appShell .talent-gradient-card.performance_attention { border-left-color: var(--acceptance-red); } #appShell .talent-gradient-card.ai_low,#appShell .talent-gradient-card.review { border-left-color: var(--acceptance-amber); } #appShell .talent-gradient-card.insufficient { border-left-color: var(--chart-muted-2); } #appShell .talent-gradient-card span, #appShell .talent-gradient-card small { color: var(--acceptance-ink-3); } #appShell .talent-gradient-card strong { margin: 6px 0 4px; color: var(--acceptance-ink); font-size: 28px; } #appShell .talent-trace-guidance { padding: 12px 14px; } @media (min-width: 1800px) { #appShell .executive-score-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } } @media (max-width: 1320px) { #appShell .talent-gradient-toolbar { align-items: flex-start; flex-direction: column; } #appShell .talent-gradient-toolbar-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; } } @media (max-width: 1180px) { #appShell .executive-change-list { grid-template-columns: repeat(2,minmax(0,1fr)); } #appShell .executive-priority-list .executive-talent-person.is-decision { display: block; } #appShell .executive-priority-list .executive-talent-person.is-decision::before, #appShell .executive-priority-list .executive-talent-person.is-decision .executive-talent-change::before, #appShell .executive-priority-list .executive-talent-person.is-decision > p:not(.executive-talent-role)::before, #appShell .executive-priority-list .executive-talent-person.is-decision footer::before { display: none; } #appShell .executive-priority-list .executive-talent-person.is-decision .executive-talent-role { margin: 8px 0; } #appShell .executive-priority-list .executive-talent-person.is-decision > p:not(.executive-talent-role) { margin-top: 9px; } #appShell .executive-priority-list .executive-talent-person.is-decision footer { margin-top: 10px; padding: 9px 0 0; border-top: 1px solid var(--acceptance-line); border-left: 0; } #appShell .executive-priority-list .executive-talent-person.is-decision footer > b { display: block; } } @media (max-width: 900px) { #appShell .executive-talent-management-grid { grid-template-columns: 1fr; } #appShell .executive-organization-section { position: static; } #appShell .talent-gradient-search-control { flex: 1 1 240px; } #appShell .talent-gradient-search-control input { width: 100%; } } @media (max-width: 620px) { #appShell .role-workbench.ceo-standard-mode .workbench-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } #appShell .role-workbench.ceo-standard-mode .workbench-kpi { min-height: 96px; } #appShell .executive-score-grid, #appShell .executive-change-list { grid-template-columns: 1fr; } #appShell .executive-score-person { min-height: 0; } #appShell .executive-score-visual { grid-template-columns: 1fr; } #appShell .executive-score-summary { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: center; } #appShell .executive-decision-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } #appShell .executive-talent-search > label { grid-template-columns: 1fr; } #appShell .talent-closure-nav button { padding-inline: 5px; font-size: 11px; } #appShell .talent-gradient-toolbar-actions { display: grid; grid-template-columns: 1fr 1fr; align-items: end; } #appShell .talent-period-control, #appShell .talent-gradient-search-control { grid-column: 1 / -1; } #appShell .talent-gradient-search-control input { width: 100%; min-width: 0; } #appShell .talent-gradient-export { width: 100%; } } /* Shared product chrome: one control language across light and dark themes. */ #appShell :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea) { border-color: var(--acceptance-line); border-radius: 8px; background: var(--acceptance-input); color: var(--acceptance-ink); box-shadow: 0 1px 2px rgba(16,24,40,.03); } #appShell :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea):focus { border-color: color-mix(in srgb,var(--acceptance-accent) 58%,var(--acceptance-line)); outline: 3px solid color-mix(in srgb,var(--acceptance-accent) 12%,transparent); } #appShell :where(.button,.compact-button,.mini-action,.reference-tag,button[class*="filter"]) { transition: border-color 150ms ease,background-color 150ms ease,color 150ms ease,box-shadow 150ms ease,transform 150ms ease; } #appShell .button.ghost { border-color: var(--acceptance-line); background: var(--acceptance-card); color: var(--acceptance-ink-2); } #appShell .button.ghost:hover { border-color: color-mix(in srgb,var(--acceptance-accent) 45%,var(--acceptance-line)); background: var(--acceptance-accent-bg); color: var(--acceptance-accent); } #appShell .reference-tag { border: 1px solid transparent; line-height: 1.45; } #appShell .reference-tag.gray { border-color: var(--acceptance-line); } #appShell .reference-tag.blue { border-color: color-mix(in srgb,var(--acceptance-accent) 18%,transparent); } #appShell .reference-tag.amber { border-color: color-mix(in srgb,var(--acceptance-amber) 20%,transparent); } #appShell .reference-tag.red { border-color: color-mix(in srgb,var(--acceptance-red) 18%,transparent); }