/* Let the document handle scrolling, including when the pointer is over a call. */
body.minimal-calm .sx-recordings{max-height:none;overflow:visible;overscroll-behavior:auto}
body.minimal-calm .sx-record-preview{position:relative;flex:0 0 128px;width:128px;aspect-ratio:16/9;align-self:center;overflow:hidden;border-radius:6px;background:var(--soft)}
body.minimal-calm .sx-record-preview>img{display:block;width:100%;height:100%;object-fit:contain}
body.minimal-calm .sx-record-preview>div,body.minimal-calm .sx-record-preview.is-unavailable{display:flex;align-items:center;justify-content:center;flex-direction:column;color:var(--secondary)}
body.minimal-calm .sx-record-open{display:flex;align-items:center;gap:14px;min-width:0;flex:1;padding:0;text-align:left}
body.minimal-calm .sx-record-excerpt{grid-column:1;grid-row:3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:var(--secondary)}
body.minimal-calm .sx-record-icon{
  position:relative;flex:0 0 112px;width:112px;height:auto;min-height:0;aspect-ratio:16/9;
  align-self:center;overflow:hidden;border-radius:6px;background:var(--soft);
}
body.minimal-calm .sx-record-icon>.icon{width:19px;height:19px;color:var(--secondary)}
body.minimal-calm .sx-record-icon>span{
  position:absolute;right:4px;bottom:3px;padding:0 3px;border-radius:3px;
  font-size:9px;line-height:13px;background:var(--surface);color:var(--secondary);
}
body.minimal-calm .sx-record-text{row-gap:3px}
body.minimal-calm .sx-record-tags{grid-row:1/4}
body.minimal-calm .sx-player-placeholder.minimal-recording-player{
  min-height:0;aspect-ratio:16/9;height:auto;padding:16px;
}
@media(max-width:600px){
  body.minimal-calm .sx-record-icon{flex-basis:80px;width:80px;min-height:0}
  body.minimal-calm .sx-record-tags{grid-row:4}
  body.minimal-calm .sx-record-text>p{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}

/* The recording library shares the dashboard's neutral controls and type scale. */
body.balanced-blue.minimal-calm .page-closer .sx-record-search{
  display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:10px;
  margin:0;padding:14px 16px;border:1px solid var(--line);border-bottom:0;
  border-radius:12px 12px 0 0;background:var(--surface);
}
body.balanced-blue.minimal-calm .page-closer .sx-record-search .sx-search{
  flex:1 1 260px;width:auto;min-width:0;max-width:none;min-height:38px;
  margin:0;font-size:14px;line-height:20px;
}
body.balanced-blue.minimal-calm .page-closer .sx-record-search :is(.btn,.sx-select){
  flex:0 0 auto;min-height:38px;margin:0;font-size:14px;line-height:20px;
}
body.balanced-blue.minimal-calm .page-closer .sx-record-search .sx-select{max-width:240px}
/* Preserve the existing filter while an older open page still has two rows. */
body.balanced-blue.minimal-calm .page-closer .sx-record-search+.sx-filters{
  margin:0;padding:0 16px 14px;background:var(--surface);
  border-inline:1px solid var(--line);
}
body.balanced-blue.minimal-calm .page-closer .sx-recordings{
  margin:0;border:1px solid var(--line);border-radius:0 0 12px 12px;
  max-height:none;overflow:visible;overscroll-behavior:auto;background:var(--surface);
}
body.balanced-blue.minimal-calm .page-closer .sx-recording{
  position:relative;display:flex;align-items:center;gap:16px;padding:16px;
  min-width:0;background:var(--surface);border:0;border-bottom:1px solid var(--line);
  transition:background-color 140ms ease;
}
body.balanced-blue.minimal-calm .page-closer .sx-recording:last-child{border-bottom:0;border-radius:0 0 11px 11px}
body.balanced-blue.minimal-calm .page-closer .sx-recording:hover{background:var(--soft)}
body.balanced-blue.minimal-calm .page-closer .sx-record-open{
  appearance:none;display:flex;flex:1;align-items:center;gap:16px;min-width:0;
  min-height:68px;padding:0;border:0;border-radius:0;background:transparent;
  color:var(--ink);box-shadow:none;font:inherit;text-align:left;cursor:pointer;
}
body.balanced-blue.minimal-calm .page-closer .sx-record-open::after{content:"";position:absolute;inset:0}
body.balanced-blue.minimal-calm .page-closer .sx-recording:has(.sx-record-open:focus-visible){outline:2px solid var(--accent);outline-offset:-2px}
body.balanced-blue.minimal-calm .page-closer .sx-record-open:focus-visible{outline:0}
body.balanced-blue.minimal-calm .page-closer :is(.sx-record-preview,.sx-record-icon){
  display:flex;align-items:center;justify-content:center;flex:0 0 120px;
  width:120px;height:auto;min-height:0;aspect-ratio:16/9;align-self:center;
  overflow:hidden;border:1px solid var(--line);border-radius:8px;
  background:var(--soft);color:var(--secondary);
}
body.balanced-blue.minimal-calm .page-closer .sx-record-preview>div{
  display:flex;flex:1;align-self:stretch;align-items:center;justify-content:center;gap:4px;
  padding:8px;background:var(--soft);color:var(--secondary);
}
body.balanced-blue.minimal-calm .page-closer .sx-record-preview>img{display:block;width:100%;height:100%;object-fit:contain;background:var(--soft)}
body.balanced-blue.minimal-calm .page-closer :is(.sx-record-preview,.sx-record-icon) .icon{width:20px;height:20px;color:var(--secondary)}
body.balanced-blue.minimal-calm .page-closer .sx-record-preview :is(span,small){font-size:11px;line-height:15px;color:var(--secondary)}
body.balanced-blue.minimal-calm .page-closer .sx-record-preview small{display:none}
body.balanced-blue.minimal-calm .page-closer .sx-record-text{display:grid;flex:1;grid-template-columns:minmax(0,1fr);gap:4px;min-width:0}
body.balanced-blue.minimal-calm .page-closer .sx-record-text>strong{
  display:block;grid-column:1;grid-row:1;margin:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;color:var(--ink);font-size:14px;font-weight:500;line-height:20px;
}
body.balanced-blue.minimal-calm .page-closer .sx-record-text>small{
  display:block;grid-column:1;grid-row:2;margin:0;color:var(--secondary);
  font-size:13px;line-height:19px;font-variant-numeric:tabular-nums;
}
body.balanced-blue.minimal-calm .page-closer .sx-record-text>:is(.sx-record-excerpt,p){
  display:block;grid-column:1;grid-row:3;min-width:0;margin:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;color:var(--secondary);font-size:13px;line-height:19px;
}
body.balanced-blue.minimal-calm .page-closer .sx-recording .sx-arrow{flex:0 0 auto;margin:0;color:var(--secondary);font-size:18px;line-height:24px}
body.balanced-blue.minimal-calm .page-closer .sx-recordings:empty{display:none}
body.balanced-blue.minimal-calm .page-closer .sx-recordings:empty+.empty-state{margin:0;border:1px solid var(--line);border-radius:0 0 12px 12px;background:var(--surface);font-size:14px}
body.balanced-blue.minimal-calm .page-closer [data-sx-action="more-recordings"]{margin-top:16px}
@media(max-width:600px){
  body.balanced-blue.minimal-calm .page-closer .sx-record-search{gap:8px;padding:12px}
  body.balanced-blue.minimal-calm .page-closer .sx-record-search .sx-search{flex-basis:100%;min-height:40px}
  body.balanced-blue.minimal-calm .page-closer .sx-record-search .sx-select{flex:1;max-width:none;min-width:0}
  body.balanced-blue.minimal-calm .page-closer .sx-record-search :is(.btn,.sx-select){min-height:40px}
  body.balanced-blue.minimal-calm .page-closer .sx-record-search+.sx-filters{padding:0 12px 12px}
  body.balanced-blue.minimal-calm .page-closer .sx-recording{gap:12px;padding:14px 12px;align-items:flex-start}
  body.balanced-blue.minimal-calm .page-closer :is(.sx-record-preview,.sx-record-icon){flex-basis:88px;width:88px;align-self:flex-start;margin-top:2px}
  body.balanced-blue.minimal-calm .page-closer .sx-record-open{gap:8px;min-height:60px}
  body.balanced-blue.minimal-calm .page-closer .sx-recording .sx-arrow{display:none}
}
@media(prefers-reduced-motion:reduce){body.balanced-blue.minimal-calm .page-closer .sx-recording{transition:none}}
