/* Personnel follows the interface brandbook palette without changing customer themes. */
.platform-runtime { --blue-700: #1269a3; --background: #f2f6f9; --danger-light: #fee2e2; }
/* Portal identity extends the shared navy shell and restrained Ratio card system. */
.platform-sidebar-label { padding: 0 20px 12px; color: #9db6ca; font-size: var(--interface-label-size); letter-spacing: .06em; text-transform: uppercase; }
.platform-shell { max-width: var(--interface-content-width); margin: 0 auto; display: grid; gap: 18px; }
.platform-intro { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; }
.platform-intro p { margin: 5px 0 0; color: var(--muted); font-size: var(--interface-value-size); }
.platform-intro h2 { margin: 4px 0 0; color: var(--navy-950); font-size: 23px; font-weight: 750; line-height: 1.1; }
/* The dashboard and permission cards share the brandbook's calm tile geometry. */
.platform-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.platform-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.platform-card { padding: 18px var(--interface-card-padding) var(--interface-card-padding); border: 1px solid var(--interface-border); border-radius: var(--interface-card-radius); background: var(--surface); box-shadow: var(--shadow-small); min-width: 0; }
.platform-card h2 { margin: 0 0 14px; font-size: var(--interface-heading-size); font-weight: 700; line-height: 1.25; }
.platform-card h3 { margin: 0 0 10px; font-size: var(--interface-value-size); font-weight: 700; }
.platform-card > a:not(.button) { font-size: var(--interface-value-size); font-weight: 650; }
.platform-card p { color: var(--muted); font-size: var(--interface-value-size); line-height: 1.5; }
.platform-metric strong { display: block; margin-top: 8px; color: var(--navy-900); font-size: 28px; font-weight: 700; }
.platform-metric span { font-size: var(--interface-label-size); color: var(--muted); }
.platform-metric { text-decoration: none; }
.platform-card dl { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 16px 12px; margin: 0; }
.platform-card dt { color: var(--muted); font-size: var(--interface-label-size); font-weight: 750; }
.platform-card dd { margin: 0; font-size: var(--interface-value-size); font-weight: 450; line-height: 1.5; overflow-wrap: anywhere; }
/* Editors retain the shared actual-state unsaved guard and 40px controls. */
.platform-form { max-width: 820px; }
.platform-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
.platform-field label { display: block; margin-bottom: 5px; font-size: var(--interface-label-size); font-weight: 750; }
.platform-field input:not([type=checkbox]), .platform-field select { width: 100%; height: var(--interface-control-height); font-size: var(--interface-value-size); font-weight: 450; }
.platform-field .errorlist, .platform-form > .errorlist { padding: 0; list-style: none; color: var(--danger); font-size: var(--interface-value-size); }
.platform-notice { padding: 14px 16px; border: 1px solid var(--blue-200); border-radius: var(--interface-tile-radius); background: var(--blue-050); color: var(--text); font-size: var(--interface-value-size); }
.content > .platform-notice { margin-bottom: 18px; }
/* Operational tables retain central status widths, typography and pagination. */
.platform-table { width: 100%; border-collapse: collapse; }
.platform-table th, .platform-table td { padding: 13px 12px; border-bottom: 1px solid var(--interface-border); text-align: left; font-size: var(--interface-value-size); }
.platform-table td { font-weight: 450; }
.platform-table th { color: var(--muted); font-size: var(--interface-label-size); }
.platform-table small { display: block; color: var(--muted); font-size: var(--interface-helper-size); }
.platform-table tbody tr:hover { background: var(--blue-050); }
.platform-toolbar { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.platform-toolbar input { width: auto; min-width: min(240px, 100%); flex: 1 1 240px; }
.platform-toolbar select { width: auto; flex: 0 1 260px; }
.platform-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.platform-table .platform-audit-data { max-width: 420px; }
.platform-audit-data { white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--interface-label-size); color: var(--muted); }
.platform-empty { padding: 32px; text-align: center; color: var(--muted); font-size: var(--interface-value-size); }
/* Authentication follows the same hierarchy without altering customer pages. */
.platform-runtime .login-card { border: 1px solid var(--interface-border); border-radius: var(--interface-card-radius); }
.platform-runtime .login-card h1 { font-size: 23px; font-weight: 750; line-height: 1.1; }
.platform-runtime .ratio-login-form label, .platform-runtime .invitation-password-field label { font-size: var(--interface-label-size); }
.platform-runtime .login-intro { font-size: var(--interface-value-size); line-height: 1.5; }
.platform-runtime .login-security-note, .platform-runtime .password-help { font-size: var(--interface-helper-size); line-height: 1.5; }
.platform-runtime .ratio-login-form, .platform-runtime .invitation-password-form { gap: 16px; }
.platform-runtime .ratio-login-form > div, .platform-runtime .invitation-password-field { gap: 5px; }
/* Compact screens keep cards and controls in a readable single flow. */
@media (max-width: 1000px) { .platform-grid, .platform-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .platform-grid, .platform-metrics, .platform-fields { grid-template-columns: 1fr; } .platform-intro { flex-direction: column; } .platform-card dl { grid-template-columns: 1fr; gap: 5px; } .platform-card dd { margin-bottom: 10px; } }

/* Example submenus retain their hierarchy on every personnel page. */
.example-sidebar-children { padding-left: 24px; }
.example-sidebar-children .sidebar-link { font-size: 13px; min-height: 34px; }
