/* The USAGE page: per-seat usage history (telemetry) and each seat's own limits. Builds on dash.css. */
.usage-intro { color: #fff; text-shadow: 2px 2px 0 var(--shadow); margin: 0 0 18px; max-width: 70ch; }
.seat { margin-bottom: 22px; }
.seat .who { color: var(--muted); font-size: 18px; }
.now-row { display: flex; flex-wrap: wrap; gap: 18px 28px; margin-bottom: 12px; }
.now-row .stat b { display: block; font: 9px/1.6 var(--font-px); color: var(--ink-2); }
.now-row .stat span { font-size: 34px; }
.now-row .stat small { color: var(--muted); font-size: 17px; margin-left: 6px; }
.chart { width: 100%; height: 190px; display: block; background: var(--white); border: 3px solid var(--ink); border-radius: 6px; }
.chart .grid-line { stroke: var(--grid); stroke-width: 1; }
.chart .axis { fill: var(--muted); font: 14px var(--font-body); }
.chart .l5 { fill: none; stroke: var(--s1); stroke-width: 2.5; }
.chart .l7 { fill: none; stroke: var(--s2); stroke-width: 2.5; }
.chart .cap5 { stroke: var(--s1); stroke-width: 1.5; stroke-dasharray: 6 5; }
.chart .cap7 { stroke: var(--s2); stroke-width: 1.5; stroke-dasharray: 6 5; }
.seat .legend { display: flex; gap: 18px; font-size: 18px; margin: 8px 0 0; color: var(--ink-2); }
.seat .legend i { display: inline-block; width: 18px; height: 4px; vertical-align: middle; margin-right: 6px; border: 0; }
.seat .legend .k5 { background: var(--s1); }
.seat .legend .k7 { background: var(--s2); }
.empty { color: var(--muted); padding: 30px 0; text-align: center; }
.limits { display: flex; flex-wrap: wrap; align-items: end; gap: 12px 18px; margin-top: 16px; padding-top: 14px; border-top: 2px dashed var(--grid); }
.limits label { display: flex; flex-direction: column; gap: 4px; font: 8px/1.6 var(--font-px); color: var(--ink-2); }
.limits input { width: 92px; font: 22px var(--font-body); padding: 3px 6px; border: 3px solid var(--ink); border-radius: 5px; background: var(--white); }
.limits .own { color: var(--clay-2); }
.limits .msg { font-size: 18px; color: var(--good); }
.reason { color: var(--muted); font-size: 18px; margin-top: 8px; }