.dispatcher-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.dispatcher-links>a{display:flex;align-items:center;gap:14px;margin:0;text-decoration:none;color:inherit;padding:22px}.dispatcher-links>a>span{flex:1}.dispatcher-links strong,.dispatcher-links small{display:block}.dispatcher-links small{font-size:13px;margin-top:6px;color:var(--muted,#687b93)}.dispatcher-links>a>.ui-icon{width:24px;height:24px}.dispatcher-queue{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.dispatcher-queue>article,.dispatcher-accounts>article{padding:20px;border:1px solid var(--border,#dfe6ef);border-radius:10px;min-width:0}.dispatcher-queue header,.dispatcher-accounts header{display:flex;align-items:start;justify-content:space-between;flex-wrap:wrap;gap:10px}.dispatcher-queue h3{font-size:16px;line-height:1.6;font-weight:600;margin:16px 0 8px}.dispatcher-queue p,.dispatcher-accounts p{color:var(--muted,#687b93);font-size:14px}.dispatcher-queue .primary-button{width:100%;margin-top:12px}.dispatcher-accounts{display:grid;gap:16px}.dispatcher-accounts h3{margin:0}.dispatcher-accounts details{margin-top:14px}.dispatcher-accounts form{min-width:0}.landing-roles:has(.landing-role-dispatcher){grid-template-columns:repeat(3,minmax(0,1fr))}.landing-role-dispatcher .role-avatar{background:#edf4ff;color:#0963d3}.auth-shell-dispatcher .auth-brand p{max-width:320px}.role-dispatcher .sidebar{background:#073b7d;color:white}.role-dispatcher .sidebar a{color:#e5f0ff}.role-dispatcher .sidebar a[aria-current]{background:#ffffff20;color:#fff}.role-dispatcher .sidebar>.sidebar-label{color:#a9c9ed}.role-dispatcher .sidebar .ui-icon{filter:brightness(0) invert(1)}
@media(max-width:1200px){.dispatcher-links,.dispatcher-queue{grid-template-columns:repeat(2,minmax(0,1fr))}.landing-roles:has(.landing-role-dispatcher){grid-template-columns:1fr}.dispatcher-links>a:last-child{grid-column:1/-1}}
@media(max-width:700px){.dispatcher-links,.dispatcher-queue{grid-template-columns:1fr}.dispatcher-links>a:last-child{grid-column:auto}.dispatcher-links>a{padding:18px}.dispatcher-queue>article,.dispatcher-accounts>article{padding:16px}.dispatcher-accounts header{display:block}.dispatcher-accounts header .status-badge{display:inline-block}.auth-shell-dispatcher .auth-brand h2{font-size:24px}.account-copy small{overflow-wrap:anywhere}}
@media(min-width:901px){.app-body:not(.role-master) .topbar .brand{top:0;left:0;width:266px;height:76px;padding:13px 8px;background:#073b7d}:root[data-theme="dark"] .role-admin .topbar,:root[data-theme="dark"] .role-driver .topbar{background:transparent}}
:root[data-theme="dark"] .notification-button .ui-icon,:root[data-theme="dark"] .topbar-action .ui-icon,:root[data-theme="dark"] .dispatcher-links .ui-icon,:root[data-theme="dark"] .metrics .metric-icon .ui-icon{filter:brightness(0) invert(1)}
/* Status metric circles stay light in both themes, so keep their dark icons. */
:root[data-theme="dark"] .metrics :is(.metric-success, .metric-warning, .metric-new) .metric-icon .ui-icon { filter: none; }
@media(max-width:700px){.auth-shell-dispatcher .auth-brand>img:first-child{width:calc(100% - 148px);max-width:190px;height:54px;object-fit:contain;object-position:left center}}