/* The sample client dashboard. Invented data, labeled on the panel. */
.dash { background: rgba(7, 12, 36, 0.86); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 30px 80px -30px rgba(73, 118, 177, 0.45), 0 0 0 1px rgba(229, 138, 196, 0.06);
  overflow: hidden; font-size: 0.92rem; }
.dash-top { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.dash-top .biz { font-weight: 600; }
.live { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 0.78rem; color: var(--text-2); }
.live::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #5BD69B; box-shadow: 0 0 0 0 rgba(91, 214, 155, .6);
  animation: ping 2s infinite; }
@keyframes ping { 0% { box-shadow: 0 0 0 0 rgba(91, 214, 155, .55); } 70% { box-shadow: 0 0 0 8px rgba(91, 214, 155, 0); } 100% { box-shadow: 0 0 0 0 rgba(91, 214, 155, 0); } }
.sample { font-family: var(--mono); font-size: 0.74rem; color: var(--accent-text); padding: 8px 16px; border-bottom: 1px solid var(--line);
  background: rgba(172, 80, 143, 0.09); }
.dash-tabs { display: flex; gap: 4px; padding: 10px 12px 0; border-bottom: 1px solid var(--line); }
.dash-tabs button { background: none; border: 0; color: var(--text-2); font: inherit; font-size: 0.88rem; padding: 8px 12px 10px;
  cursor: pointer; border-bottom: 2px solid transparent; }
.dash-tabs button[aria-selected="true"] { color: var(--text); border-bottom-color: var(--accent-text); }
.dash-body { display: grid; }
.dash [role="tabpanel"][hidden] { display: none; }
@media (min-width: 640px) { .dash-body { grid-template-columns: 1.15fr 0.85fr; } }
/* v2.5: the rows are the shared row (site.css, .ur); the feed scrolls with no visible bar (SPEC.md,
   "Dashboard fixes"), each row a button, so keyboard focus still shows on the row itself. */
.feed { padding: 12px 12px 4px; max-height: 340px; overflow: auto; scrollbar-width: none; overscroll-behavior: contain; }
.feed::-webkit-scrollbar, .week::-webkit-scrollbar, .detail::-webkit-scrollbar { display: none; }
.feed .ur-card { cursor: pointer; }
.feed .ur-card:hover { background-color: rgba(255, 255, 255, 0.06); }
.feed .ur-card.sel { background-color: rgba(73, 118, 177, 0.16); border-color: rgba(143, 178, 240, 0.45); }
.feed .ur-card:focus-visible { outline-offset: -2px; border-radius: 14px; }
.detail { border-top: 1px solid var(--line); padding: 14px 16px; }
@media (min-width: 640px) { .detail { border-top: 0; border-left: 1px solid var(--line); } }
.detail .dh { margin: 0 0 10px; color: var(--text-2); font-size: 0.86rem; }
.thread { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.m { padding: 8px 11px; border-radius: 10px; max-width: 92%; font-size: 0.86rem; line-height: 1.45; }
.m.them { background: var(--surface-2); justify-self: start; }
.m.us { background: rgba(172, 80, 143, 0.28); justify-self: end; }
.m.system { background: none; border: 1px dashed var(--line); color: var(--text-2); font-family: var(--mono); font-size: 0.76rem; justify-self: stretch; max-width: none; }
/* This week: the week's rows, grouped by day (no second set of figures) */
.week { padding: 6px 12px 8px; max-height: 420px; overflow: auto; scrollbar-width: none; overscroll-behavior: contain; }
.week:focus-visible { outline-offset: -3px; }
.wk-day { padding-top: 8px; }
.wk-h { display: flex; align-items: center; gap: 8px; margin: 0 2px 8px; font-family: var(--mono); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--accent-text); }
.wk-h span { padding: 0 7px; border-radius: var(--pill); background: rgba(172, 80, 143, 0.16); color: var(--text-2); letter-spacing: 0; }
.wk-day .ur.ur-enter { transition-delay: calc(var(--i, 0) * 60ms); }
.stat { background: rgba(7, 12, 36, 0.95); padding: 18px 16px; }
.stat .v { display: block; font-family: var(--mono); font-size: 1.7rem; font-weight: 600; }
.stat .l { color: var(--text-2); font-size: 0.82rem; }

/* v2 (2026-10-02): the big centered dashboard, the per-industry mini dashboard, counters. */
.dash { position: relative; }
.dash-main { min-width: 0; }
.dash-big { display: grid; grid-template-columns: 1fr; border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 40px 120px -40px rgba(73, 118, 177, 0.6), 0 0 0 1px rgba(229, 138, 196, 0.08); }
@media (min-width: 768px) { .dash-big { grid-template-columns: 64px 1fr; } }
.dash-side { display: none; }
@media (min-width: 768px) { .dash-side { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 16px 0;
  border-right: 1px solid var(--line); background: rgba(255, 255, 255, 0.02); } }
.ds { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; color: var(--text-2); }
.ds .ic { width: 19px; height: 19px; }
.ds.on { background: rgba(172, 80, 143, 0.22); color: var(--accent-text); }
.dash-stats, .mini-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border-bottom: 1px solid var(--line); }
@media (min-width: 640px) { .dash-stats { grid-template-columns: repeat(6, 1fr); } }
.dash-stats .stat, .mini-stats .stat { padding: 14px 16px; }
.dash-stats .v, .mini-stats .v { font-size: 1.45rem; }
.dash-big .feed { max-height: 420px; }
.dash-stats .stat.bump .v { animation: bump .45s ease-out; }
.mini-dash { max-width: 560px; margin-left: auto; margin-right: auto; }
.mfeed { padding: 12px 12px 4px; }
/* v2.7 (Jin: the feed "should extend to the bottom"). Both tabs share one stage, so the panel keeps its
   height when the tab changes and This week fills it; side by side, the feed takes the row's full height,
   which the conversation sets, and scrolls inside it with the bar still hidden. A hidden tab keeps its
   box (and stays out of reach: visibility hides it from focus and from assistive tech). */
.dash-panes { display: grid; }
.dash-panes > [role="tabpanel"] { grid-area: 1 / 1; min-width: 0; }
.dash .dash-panes > .dash-body[hidden] { display: grid; visibility: hidden; }
.dash .dash-panes > [role="tabpanel"][hidden]:not(.dash-body) { display: block; visibility: hidden; }
.dash-panes .week { height: 0; min-height: 100%; max-height: none; }
@media (min-width: 640px) {
  .dash-body { min-height: 340px; }
  .dash-big .dash-body { min-height: 420px; }
  .dash-body .feed { height: 0; min-height: 100%; max-height: none; }
}
/* A narrow panel (the hero column at 1024 to 1440px) stacks the feed above the conversation */
.dash { container: dash / inline-size; }
@container dash (max-width: 480px) {
  .dash-body { grid-template-columns: 1fr; min-height: 0; }
  .dash-body .feed { height: auto; min-height: 0; max-height: 250px; }
  .detail { border-left: 0; border-top: 1px solid var(--line); max-height: 230px; overflow: auto; scrollbar-width: none; }
}