/* Customer service ratings (2026-11-08, part 9). Status colours always come with a word and an emoji. */
:root{--sv-great:#1F7A45;--sv-okay:#C98A0B;--sv-bad:#CC0F37}
.sv-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
.sv-kpis .sv-hero b{color:var(--sv-great);font-size:24px}
.sv-kpis .sv-warn b{color:var(--sv-bad)}
.sv-card{margin-bottom:12px}
.sv-card h3{margin:0 0 10px;font:700 12px/1 var(--sp-body);letter-spacing:.1em;text-transform:uppercase;color:var(--sp-muted)}
.sv-dist{display:flex;gap:2px;height:16px;border-radius:8px;overflow:hidden;background:var(--sp-cream)}
.sv-dist i,.sv-stack i,.sv-key i{display:block}
:is(.sv-dist,.sv-stack,.sv-key) .great{background:var(--sv-great)}:is(.sv-dist,.sv-stack,.sv-key) .okay{background:var(--sv-okay)}:is(.sv-dist,.sv-stack,.sv-key) .bad{background:var(--sv-bad)}
.sv-key{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:10px;font:500 13.5px/1.3 var(--sp-body);color:var(--sp-ink)}
.sv-key span{display:inline-flex;align-items:center;gap:6px}
.sv-key i{width:10px;height:10px;border-radius:3px}
.sv-key b{font-variant-numeric:tabular-nums}.sv-key small{color:var(--sp-muted)}
.sv-weeks{display:flex;align-items:flex-end;gap:8px;height:150px;padding-top:6px;overflow-x:auto}
.sv-wk{flex:1 0 34px;max-width:64px;height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;gap:3px}
.sv-stack{align-self:end;width:70%;display:flex;flex-direction:column;gap:2px;border-radius:4px 4px 0 0;overflow:hidden}
.sv-stack i{width:100%}
.sv-wk span{font:500 10.5px/1 var(--sp-body);color:var(--sp-muted);white-space:nowrap}
.sv-wk b{font:700 11px/1 var(--sp-body);font-variant-numeric:tabular-nums;color:var(--sp-ink)}
.sv-team{display:grid;font:500 13.5px/1.3 var(--sp-body)}
.sv-tr{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,.6fr));gap:8px;padding:8px 0;border-top:1px solid var(--sp-line)}
.sv-tr span:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
.sv-tr span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sv-th{border-top:0;font:700 11px/1.2 var(--sp-body);letter-spacing:.06em;text-transform:uppercase;color:var(--sp-muted)}
.sv-listhead{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.sv-listhead h3{margin:0}
.sv-list{display:flex;flex-direction:column}
.sv-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--sp-line);min-width:0}
.sv-row:first-child{border-top:0}
.sv-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sv-main b{font:600 14px/1.3 var(--sp-body);overflow:hidden;text-overflow:ellipsis}
.sv-main b small{color:var(--sp-muted);font-weight:500}
.sv-main span{font:500 12px/1.35 var(--sp-body);color:var(--sp-muted)}
.sv-main .sv-todo{color:var(--sv-bad);font-weight:600}
.sv-main .sv-done{color:var(--sv-great);font-weight:600}
.sv-act{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.sv-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;background:var(--sp-cream);color:var(--sp-ink);font:600 12.5px/1.2 var(--sp-body);white-space:nowrap}
.sv-chip.great{background:var(--sp-ok-soft,#E3F3E9);color:var(--sv-great)}
.sv-chip.okay{background:var(--sp-butter-soft,#FFF1C2);color:#7a5600}
.sv-chip.bad{background:color-mix(in srgb,var(--sv-bad) 11%,#fff);color:var(--sv-bad)}
.sv-chip.muted{opacity:.75}
.sv-empty{display:flex;flex-direction:column;gap:6px;text-align:center}
.sv-picks{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.sv-picks .wa-field em{font-style:normal;margin-left:6px}
@media (max-width:560px){.sv-kpis{grid-template-columns:1fr 1fr}.sv-kpis .sv-hero{grid-column:1/-1}.sv-picks{grid-template-columns:minmax(0,1fr)}.sv-row{flex-wrap:wrap}.sv-act{width:100%;justify-content:flex-start}}
/* Part 10: comments, team notes, replies editor */
.sv-comment{margin:6px 0 2px;padding:8px 12px;border-left:3px solid var(--sp-line);background:var(--sp-cream);border-radius:0 10px 10px 0;font:500 13.5px/1.45 var(--sp-body);color:var(--sp-ink);white-space:pre-wrap;overflow-wrap:anywhere}
.sv-note{margin-top:6px;padding:8px 12px;border-radius:10px;background:var(--sp-sky-soft,#E6F1FC)}
.sv-note>span{display:block;font:700 11px/1.2 var(--sp-body);letter-spacing:.04em;text-transform:uppercase;color:var(--sp-sky-ink,#1d4f80)}
.sv-note p{margin:3px 0 2px;font:500 13.5px/1.45 var(--sp-body);color:var(--sp-ink);white-space:pre-wrap;overflow-wrap:anywhere}
.sv-note .mn-link,.sv-addnote{padding:4px 0;font-size:12.5px;align-self:flex-start}
.sv-note-edit{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.sv-note-edit textarea{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--sp-line);border-radius:10px;font:500 13.5px/1.4 var(--sp-body);color:var(--sp-ink);resize:vertical}
.sv-note-edit textarea:focus{outline:2px solid var(--sp-red);outline-offset:1px}
.sv-pick{display:flex;flex-direction:column;gap:8px;min-width:0}
.sv-replies .st-row.col{gap:10px}
.sv-replies textarea{min-height:70px}
.sv-rsave{justify-content:flex-end;width:100%}
.sv-picks{align-items:start}
