/* Stage 1: shared controls, application shell and dashboard. Domain layouts remain intact. */
body {font-size:14px;line-height:1.45}
:where(button,input,select,textarea) {font-family:inherit}
.primary {background:var(--teal);color:var(--primary-foreground);border:1px solid transparent;font-weight:600;min-height:var(--control-height);border-radius:var(--radius-md)}
html[data-theme="dark"] .primary {color:var(--primary-foreground)}
.primary.danger {background:var(--danger);color:#fff}
html[data-theme="dark"] .primary.danger {color:#071823}
.secondary {border:1px solid var(--line);background:var(--surface);font-weight:600;min-height:var(--control-height);border-radius:var(--radius-md)}
.primary:hover,.secondary:hover {transform:none;box-shadow:none}
.secondary:hover {background:var(--surface-hover)}
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),select {min-height:var(--control-height);border-radius:var(--radius-md)}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible {outline:3px solid var(--teal);outline-offset:3px}
:where(.panel,.modal-card,.metric-grid article,.knowledge-card,.platform-v30-card) {border-radius:var(--radius-lg)}
.app {grid-template-columns:var(--sidebar-width) minmax(0,1fr)}
#sidebar {width:var(--sidebar-width);background:var(--sidebar-surface);border-color:var(--line)}
#sidebar .brand {padding:20px 18px 16px;gap:10px}
#sidebar .brand img {width:34px;height:34px}
#sidebar .brand strong {font-size:18px;letter-spacing:-.04em}
#sidebar .brand small {font-size:10px}
#sidebar nav {padding:0 10px 16px}
#sidebar nav section,#sidebar nav section+section {margin:14px 0 0}
#sidebar nav section>p {font-size:10px;letter-spacing:.09em;margin:0 0 6px;padding-inline:10px}
#sidebar nav button {min-height:36px;padding:8px 10px;border-radius:9px;gap:10px;font-size:13px;line-height:20px}
#sidebar nav button.active {color:var(--ink);background:var(--ui-soft);box-shadow:inset 3px 0 var(--teal)}
#sidebar nav button.active i {color:var(--teal)}
#sidebar .account {padding:12px;gap:8px;grid-template-columns:34px minmax(0,1fr) 28px}
#sidebar .account>span {width:34px;height:34px;background:var(--ui-soft);color:var(--teal);border:1px solid var(--line)}
#sidebar .account>button {min-width:28px;min-height:32px;border-radius:8px}
#sidebar .account>button:hover {background:var(--surface-hover)}
.topbar {min-height:64px;height:64px;padding-inline:24px;gap:12px;background:var(--surface);backdrop-filter:none;border-color:var(--line)}
.topbar .search {height:40px;background:var(--surface-2);border:1px solid var(--line);gap:8px;max-width:560px;min-width:120px;font-weight:400}
.topbar .search input {min-height:0}
.top-actions {gap:8px;min-width:0}
.top-actions>.icon-button,#sidebarToggle,.mobile-menu {flex-shrink:0;width:40px;height:40px;border-radius:10px;background:var(--surface);border:1px solid var(--line)}
.company-picker {height:40px;border-radius:10px;padding-inline:10px;gap:6px;min-width:0}
.company-picker select {max-width:160px;min-height:34px;font-size:12px}
.company-picker small {font-size:9px;letter-spacing:.04em}
.network-status {font-size:11px}
main {padding:24px 28px 48px;max-width:1600px}
.page-head {margin-bottom:20px;gap:16px}
.page-head h1 {font-size:28px;line-height:1.2;letter-spacing:-.04em;margin:4px 0 6px}
.page-head p {font-size:13px;line-height:1.5}
.kicker {font-size:10px!important;letter-spacing:.1em}
#dashboardView .page-head {position:relative;isolation:isolate;overflow:hidden;min-height:156px;padding:28px;border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--background-hero);align-items:center}
#dashboardView .page-head::after {content:"";position:absolute;z-index:-1;right:-60px;top:-120px;width:320px;height:320px;border:45px solid color-mix(in srgb,var(--teal) 9%,transparent);border-radius:50%;pointer-events:none}
#dashboardView .page-head>div {min-width:0;max-width:650px}
#dashboardView .page-head h1 {font-size:32px;overflow-wrap:anywhere}
#dashboardView .page-head>.primary {flex-shrink:0}
#dashboardView .metric-grid {gap:12px}
#dashboardView .metric-grid article {position:relative;padding:18px 18px 18px 70px;gap:3px;min-width:0;min-height:120px;box-shadow:0 3px 12px rgb(13 27 56 / .025)}
#dashboardView .metric-grid article>span:not(.v58-metric-icon) {font-size:12px;color:var(--muted)}
#dashboardView .metric-grid strong {font-size:28px;line-height:1.25;font-weight:650}
#dashboardView .metric-grid small {font-size:11px;line-height:1.4}
.v58-metric-icon {position:absolute;left:18px;top:20px;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--ui-soft);color:var(--teal)}
.v58-metric-icon .ui-icon {width:22px;height:22px}
#dashboardView .metric-grid article:nth-child(2) .v58-metric-icon {background:color-mix(in srgb,var(--blue-500) 12%,var(--surface));color:var(--blue-500)}
#dashboardView .metric-grid article:nth-child(3) .v58-metric-icon {background:color-mix(in srgb,var(--violet-500) 12%,var(--surface));color:var(--violet-500)}
#dashboardView .metric-grid article:nth-child(4) .v58-metric-icon {background:color-mix(in srgb,var(--orange-500) 12%,var(--surface));color:var(--orange-500)}
#dashboardView .dashboard-grid {gap:16px;grid-template-columns:1.1fr 1fr;margin-top:20px}
#dashboardView .panel {padding:20px;box-shadow:0 3px 12px rgb(13 27 56 / .025)}
#dashboardView .panel-head h2 {font-size:18px;font-weight:650;letter-spacing:-.02em}
#dashboardView .setup-list button {padding-block:16px;gap:12px}
#dashboardView .setup-list button:hover {background:var(--surface-2)}
#dashboardView .setup-list button>i {background:var(--ui-soft);color:var(--teal);border-radius:10px}
#dashboardView .setup-list b {font-size:13px;font-weight:600}
#dashboardView .setup-list small {font-size:12px;line-height:1.5}
#dashboardView .status-pill {background:var(--ui-soft);color:var(--teal);font-weight:600}
#dashboardView .compact-empty {min-height:220px;padding:28px 16px}
#dashboardView .compact-empty>span {width:64px;height:64px;background:var(--surface-2);border-radius:20px}
#dashboardView .compact-empty p {font-size:12px;max-width:270px}
html[data-sidebar="collapsed"] {--sidebar-width:72px}
html[data-sidebar="collapsed"] #sidebar :is(.brand span,.nav-label,nav section>p,.account>div) {display:none}
html[data-sidebar="collapsed"] #sidebar .brand {justify-content:center;padding:20px 10px}
html[data-sidebar="collapsed"] #sidebar nav button {justify-content:center;padding-inline:4px}
html[data-sidebar="collapsed"] #sidebar .account {grid-template-columns:1fr;justify-items:center}
html[data-sidebar="collapsed"] #sidebar nav section {margin-top:8px}
html[data-density="compact"] #sidebar nav button {min-height:32px;padding-block:6px}
html[data-density="compact"] #dashboardView .metric-grid article {min-height:108px;padding-block:14px}
html[data-density="compact"] #dashboardView .setup-list button {padding-block:12px}
@media(min-width:1024px) {.mobile-menu {display:none}}
@media(min-width:1024px) and (max-width:1279px) {
 main {padding:20px}.topbar {padding-inline:16px;gap:8px}.company-picker small {display:none}.company-picker select {max-width:110px}.top-actions {gap:6px}.network-status span {display:none}
 #dashboardView .metric-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1023px) {
 .app {display:block}#sidebar {width:232px;transform:translateX(-100%)}#sidebar.open {transform:translateX(0);box-shadow:0 0 0 100vw rgb(7 24 35 / .5)}
 #sidebarToggle {display:none}.mobile-menu {display:block}html[data-sidebar="collapsed"] {--sidebar-width:232px}
 html[data-sidebar="collapsed"] #sidebar :is(.brand span,.nav-label,nav section>p,.account>div) {display:revert}
 html[data-sidebar="collapsed"] #sidebar .account {grid-template-columns:34px minmax(0,1fr) 28px;justify-items:stretch}
 html[data-sidebar="collapsed"] #sidebar nav button {justify-content:flex-start;padding-inline:10px}
 html[data-sidebar="collapsed"] #sidebar .brand {justify-content:flex-start;padding:20px 18px 16px}
 .workspace {grid-column:auto}main {padding:20px}.topbar {padding-inline:16px}.company-picker small {display:none}
 #dashboardView .metric-grid {grid-template-columns:repeat(2,minmax(0,1fr))}#dashboardView .dashboard-grid {grid-template-columns:1fr}
}
@media(max-width:767px) {
 .topbar {height:auto;min-height:64px;flex-wrap:wrap;padding:10px 12px;gap:8px}
 .topbar .search {display:flex;order:3;flex:1 1 100%;max-width:none;height:38px}
 .top-actions {flex:1;justify-content:flex-start;overflow-x:auto;max-width:calc(100% - 48px);padding:3px;gap:6px;scrollbar-width:thin}
 .top-actions>* {flex-shrink:0}.company-picker select {max-width:104px}.network-status {display:none}
 main {padding:16px 16px 36px}.page-head h1 {font-size:24px}.page-head>.primary {width:100%}
 #dashboardView .page-head {padding:20px;min-height:180px;align-items:flex-start;gap:16px}#dashboardView .page-head h1 {font-size:28px}
 #dashboardView .metric-grid {gap:10px}#dashboardView .metric-grid article {padding:14px;min-height:150px}
 .v58-metric-icon {position:static;width:34px;height:34px;margin-bottom:6px}#dashboardView .metric-grid strong {font-size:24px}
 #dashboardView .panel {padding:16px}#dashboardView .setup-list small {overflow-wrap:anywhere}
}
@media(max-width:359px) {#dashboardView .metric-grid {grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce) {#sidebar {transition:none}}
html[data-reduce-motion="true"] #sidebar {transition:none}