/* Overview layout using the existing Console palette and reviewer accents. */
.overview-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); gap:14px; margin-block:0 20px; }
.overview-stat { position:relative; overflow:hidden; min-width:0; padding:14px 16px; background:linear-gradient(160deg,var(--card),var(--card-2)); border:1px solid var(--line); border-top:4px solid var(--accent); border-radius:var(--radius); }
.overview-stat h3 { position:relative; z-index:1; display:block; min-height:2.5em; margin:0 0 6px; padding:0; border:0; color:var(--muted); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; overflow-wrap:anywhere; }
.overview-stat strong { position:relative; z-index:1; display:block; font-size:2.4rem; line-height:1.1; font-variant-numeric:tabular-nums; }
.overview-stat > i { position:absolute; right:0; bottom:-10px; font-size:4.5rem; color:var(--accent); opacity:.1; }
.flow-overview-grid { display:grid; grid-template-areas:"flows flows" "connectors references" "variables variables"; grid-template-columns:minmax(0, .85fr) minmax(0,1.15fr); gap:16px; }
.flow-overview-grid > .panel { min-width:0; margin:0; }
.flow-overview-grid > .panel h2 { display:inline-block; margin:0 0 12px; padding-bottom:6px; border-bottom:2px solid var(--accent); font-size:.95rem; }
#flow-overview { container-type:inline-size; }
#flow-overview .overview-stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
.flow-overview-grid > :nth-child(1) { grid-area:flows; }
.flow-overview-grid > :nth-child(2) { grid-area:connectors; }
.flow-overview-grid > :nth-child(3) { grid-area:references; }
.flow-overview-grid > :nth-child(4) { grid-area:variables; }
.overview-table-scroll { overflow-x:auto; max-width:100%; }
.overview-table-scroll table { width:100%; border-collapse:collapse; text-align:left; }
.overview-table-scroll th,.overview-table-scroll td { padding:10px 12px; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.overview-table-scroll th { color:var(--muted); font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; }
.overview-table-scroll th { white-space:nowrap; overflow-wrap:normal; }
.overview-flow-link { padding:0; background:none; border:0; color:var(--accent); font:inherit; font-weight:600; text-align:left; cursor:pointer; }
.overview-flow-link:hover { text-decoration:underline; }
.overview-counts { margin-bottom:20px; }
.app-overview-heading { display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin-bottom:20px; }
.app-overview-heading h2 { margin:0; }
.app-overview-heading img { width:44px; height:44px; object-fit:contain; border-radius:8px; }
.app-overview-heading .chip { max-width:100%; overflow-wrap:anywhere; white-space:normal; }
.page.tool-solutions { container-type:inline-size; }
.tool-solutions .overview-stats { grid-template-columns:repeat(6,minmax(0,1fr)); }
.tool-solutions .overview-stat { --accent:var(--tool); }
@container(max-width:1000px) { .tool-solutions .overview-stats { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@container(max-width:540px) { .tool-solutions .overview-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@container(max-width:600px) { #flow-overview .overview-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .flow-overview-grid { grid-template-areas:"flows" "connectors" "references" "variables"; grid-template-columns:minmax(0,1fr); } }
@container(max-width:320px) { #flow-overview .overview-stats,.tool-solutions .overview-stats { grid-template-columns:minmax(0,1fr); } }
@media(max-width:800px) { .flow-overview-grid { grid-template-areas:"flows" "connectors" "references" "variables"; grid-template-columns:minmax(0,1fr); } }
@media(max-width:400px) { .overview-stats { grid-template-columns:minmax(0,1fr); } }