/* Dashboard mock. Same ink ladder as the site; denser rhythm, vertical rules kept
   because columns are read simultaneously, horizontal ones cut in favour of space. */
.bleed{width:100%;padding:0}
.dash{
  border:1px solid var(--line-strong);
  border-radius:12px;
  overflow:hidden;
  margin-top:40px;
  font-size:14px;
  line-height:1.45;
}
/* the enlarged form: the mock stops being a figure and becomes the page */
.dash-full{
  border-left:0;border-right:0;border-radius:0;
  margin:48px auto 0;max-width:1800px;font-size:15px;
}
.dash-full .dash-bar{padding:18px clamp(24px,4vw,56px)}
.dash-full .dash-rail{padding:24px 0 24px clamp(8px,3vw,40px)}
.dash-full .dash-rail li,.dash-full .dash-rail .grp{padding-left:16px;padding-right:24px}
.dash-full .panel{padding:24px clamp(24px,4vw,56px) 28px}
.dash-full .dash-body{grid-template-columns:clamp(200px,18vw,260px) minmax(0,1fr)}
.dash-full .stats .v{font-size:26px}
.dash-bar{
  display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;
  padding:16px 20px;border-bottom:1px solid var(--line);
}
.dash-bar .studio{font-weight:500;font-size:16px}
.dash-bar .when{color:var(--ink-3)}
.dash-bar .spacer{flex:1}
.dash-bar .attn{color:var(--accent-ink);font-weight:500}

.dash-body{display:grid;grid-template-columns:180px minmax(0,1fr)}
.dash-main{min-width:0}
.dash-rail{border-right:1px solid var(--line);padding:20px 0}
.dash-rail ul{list-style:none;margin:0 0 24px;padding:0}
.dash-rail li{padding:6px 20px;color:var(--ink-2)}
.dash-rail li.on{color:var(--ink);font-weight:500;box-shadow:inset 2px 0 0 var(--ink)}
.dash-rail .grp{padding:0 20px 8px;color:var(--ink-3);font-size:12px}

.dash-main{padding:4px 0 20px}
.panel{padding:20px 20px 24px}
.panel + .panel{border-top:1px solid var(--line)}
.panel-head{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.panel-head h4{font-size:14px}
.panel-head .sub{color:var(--ink-3);font-size:13px}
.panel-head .spacer{flex:1}
.panel-head .link{color:var(--ink-3);font-size:13px;border-bottom:0}

table.grid{width:100%;border-collapse:collapse}
table.grid th{
  text-align:left;font-weight:500;color:var(--ink-3);font-size:12px;
  padding:0 16px 8px 0;border-bottom:1px solid var(--line);white-space:nowrap;
}
table.grid td{padding:9px 16px 9px 0;vertical-align:top}
table.grid tbody tr:nth-child(odd){background:var(--wash)}
table.grid td:last-child,table.grid th:last-child{padding-right:0}
table.grid .num{font-variant-numeric:tabular-nums}
table.grid .quiet{color:var(--ink-2)}
.needs{color:var(--accent-ink);font-weight:500}

.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ink-3);margin-right:8px;vertical-align:middle}
.dot.act{background:var(--ink)}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.stats div{padding:0 20px;border-left:1px solid var(--line)}
.stats div:first-child{padding-left:0;border-left:0}
.stats .k{color:var(--ink-3);font-size:12px;margin-bottom:4px}
.stats .v{font-size:22px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.stats .v.act{color:var(--accent-ink)}
.stats .m{color:var(--ink-3);font-size:12px;margin-top:2px}

.dash-note{margin-top:14px;font-size:15px;color:var(--ink-3);max-width:var(--measure)}

.scroll{overflow-x:auto}

@media (max-width:860px){
  .dash-full{margin-top:32px;font-size:14px}
  .dash-full .stats .v{font-size:22px}
  .dash-body,.dash-full .dash-body{grid-template-columns:minmax(0,1fr)}
  .dash-rail{border-right:0;border-bottom:1px solid var(--line);padding:16px 0}
  .dash-rail ul{display:flex;flex-wrap:wrap;gap:4px 0;margin-bottom:12px}
  .dash-rail li,.dash-full .dash-rail li{padding:6px 14px}
  .dash-rail li:first-child,.dash-full .dash-rail li:first-child{padding-left:24px}
  .dash-full .dash-rail{padding-left:0}
  .dash-full .dash-rail .grp{padding-left:24px}
  .dash-full .dash-bar{padding:16px 24px}
  .dash-full .panel{padding:20px 24px 24px}
  .dash-rail li.on{box-shadow:inset 0 -2px 0 var(--ink)}
  .panel-head .link{display:none}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 24px}
  .stats div{padding:0;border-left:0}
  table.grid{min-width:520px}
}