/* Services metric explanations. Keep each help target inside its label row. */
#ser-design [data-work-layout="04"] [data-work-focus-panel] :is(.ser-barber-outcome,.ser-work-outcome,.ser-creator-report) dt:has(> .ser-metric-help){display:flex;align-items:center;gap:3px;min-height:20px}
#ser-design [data-work-layout="04"] dt > .ser-metric-help{
 all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;
 inline-size:20px;block-size:20px;min-inline-size:20px;margin:0;flex:none;
 vertical-align:middle;position:relative;cursor:pointer;touch-action:manipulation;
 color:var(--ser-muted);font:inherit;font-size:10px;font-weight:500;line-height:1;letter-spacing:0;
}
#ser-design .ser-metric-help > span{
 box-sizing:border-box;display:grid;place-items:center;inline-size:14px;block-size:14px;
 border:1px solid var(--ser-line-strong);border-radius:50%;pointer-events:none;
}
#ser-design .ser-metric-help:is(:hover,[aria-expanded="true"]){color:var(--ser-accent)}
#ser-design .ser-metric-help:is(:hover,[aria-expanded="true"]) > span{border-color:currentColor;background:var(--ser-accent-soft)}
#ser-design .ser-metric-help:focus-visible{outline:2px solid var(--ser-accent);outline-offset:1px;border-radius:50%}
#ser-design .ser-metric-popover{
 position:fixed;inset:auto;margin:0;box-sizing:border-box;width:320px;max-width:calc(100vw - 24px);
 max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;
 padding:14px 15px 12px;border:1px solid var(--ser-line);border-radius:14px;
 background:var(--ser-surface);color:var(--ser-ink);box-shadow:0 8px 30px var(--ser-shadow),0 2px 7px var(--ser-shadow);
 font-family:inherit;font-size:12px;line-height:1.5;letter-spacing:0;text-align:left;
 z-index:10000;outline:none;
}
#ser-design .ser-metric-popover[hidden]{display:none}
#ser-design .ser-metric-popover::backdrop{background:transparent}
#ser-design .ser-metric-popover header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:0 0 6px}
#ser-design .ser-metric-popover h3{margin:0;font:inherit;font-weight:600;font-size:13px;line-height:1.45;color:var(--ser-ink)}
#ser-design .ser-metric-popover .ser-metric-close{
 all:unset;box-sizing:border-box;display:grid;place-items:center;flex:none;cursor:pointer;
 inline-size:24px;block-size:24px;margin:-5px -6px -1px 0;border-radius:7px;
 color:var(--ser-muted);font:inherit;font-size:18px;line-height:1;
}
#ser-design .ser-metric-popover .ser-metric-close:hover{background:var(--ser-surface-raised);color:var(--ser-ink)}
#ser-design .ser-metric-popover .ser-metric-close:focus-visible{outline:2px solid var(--ser-accent);outline-offset:1px}
#ser-design .ser-metric-popover p{margin:0;color:var(--ser-muted);font:inherit}
#ser-design .ser-metric-calculation{margin:10px 0 0;padding:9px 10px;border-radius:8px;background:var(--ser-surface-raised);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
#ser-design .ser-metric-calculation > div{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:baseline}
#ser-design .ser-metric-calculation > div + div{margin-top:5px}
#ser-design .ser-metric-calculation dt{font:inherit;font-size:11px;color:var(--ser-muted);margin:0}
#ser-design .ser-metric-calculation dd{margin:0;font:inherit;font-size:12px;color:var(--ser-ink);text-align:right}
#ser-design .ser-metric-calculation .ser-metric-single{display:block;text-align:left}
#ser-design .ser-metric-popover footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 12px;margin:9px 0 0;padding:0;border:0;font-size:10px;color:var(--ser-muted)}
#ser-design .ser-metric-popover footer a{font:inherit;color:var(--ser-accent);text-decoration:none}
#ser-design .ser-metric-popover footer a:hover{text-decoration:underline}
@media(pointer:coarse){
 #ser-design [data-work-layout="04"] dt > .ser-metric-help{inline-size:24px;block-size:24px;min-inline-size:24px}
 #ser-design .ser-metric-popover .ser-metric-close{inline-size:28px;block-size:28px}
}