/* Unibox, the demo's team inbox piece (template-parts/demo-unibox.php, demo.js PIECES.unibox): the replies of both
   channels in one list under the filters, the thread with all of one person's activity, her lead card. The product's
   own screen (gs.front.app route/messages: the conversation list, the filter row's chips, the thread's one stream of
   touches, replies and facts, the context panel), drawn in the demo's frame and tokens. Every rule is scoped to the
   piece's views (.gsd-v-unibox, or the window's data-tab=unibox that only they print), so the full window never reads
   this file. Nothing here moves: what the loop adds has its room from the first frame. */

/* the piece's own pane in its own window, 1200 px at most: three columns from 1140 */
.gsd .gsd-win[data-tab=unibox] .gsd-pn[data-p=unibox]{display:flex}
.gsd.gsd-v-unibox{max-width:1200px}

/* ---- the header: the title, then the filter row's chips (the product's chip: field, "is", values, the clear) ------- */
.gsd.gsd-v-unibox .gsd-ph{gap:14px}
.gsd.gsd-v-unibox .gsd-pt{flex:none}
.gsd.gsd-v-unibox .gsd-ub-fr{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px;min-width:0;margin-left:auto}
.gsd.gsd-v-unibox .gsd-ub-chip{display:inline-flex;align-items:stretch;flex:none;max-width:100%;height:26px;overflow:hidden;border:1px solid var(--gsd-line);border-radius:7px;background:var(--gsd-bg);font:500 12px/1 var(--gsd-sans);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-cf{display:inline-flex;align-items:center;gap:5px;flex:none;padding:0 7px 0 8px;color:var(--gsd-mute)}
.gsd.gsd-v-unibox .gsd-ub-cf svg{width:13px;height:13px}
.gsd.gsd-v-unibox .gsd-ub-co{display:inline-flex;align-items:center;flex:none;padding:0 6px;border-left:1px solid var(--gsd-line2);border-right:1px solid var(--gsd-line2);color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-cv{display:block;min-width:0;padding:0 2px 0 8px;font-weight:600;line-height:24px;color:var(--gsd-ink);overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-cx{align-self:center;width:11px;height:11px;margin:0 7px 0 4px;color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-add{display:inline-flex;align-items:center;gap:4px;flex:none;height:26px;padding:0 10px 0 7px;border:1px dashed var(--gsd-line);border-radius:7px;font:500 12px/1 var(--gsd-sans);color:var(--gsd-mute);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-add svg{width:13px;height:13px}
/* the filters slice: the row under the title, the chips wrapping, Save at its end */
.gsd.gsd-v-unibox .gsd-ub-fw{padding:12px 16px 12px 18px;border-bottom:1px solid var(--gsd-line2);background:var(--gsd-soft)}
.gsd.gsd-v-unibox .gsd-ub-fw .gsd-ub-fr{justify-content:flex-start;margin-left:0}
.gsd.gsd-v-unibox .gsd-ub-save{display:inline-flex;align-items:center;gap:5px;flex:none;height:26px;margin-left:auto;padding:0 9px 0 11px;border-radius:7px;background:var(--gsd-ink);font:500 12px/1 var(--gsd-sans);color:var(--gsd-bg);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-save svg{width:11px;height:11px}

/* ---- the body: the list, the thread, the card --------------------------------------------------------------------- */
.gsd.gsd-v-unibox .gsd-ub-b{display:grid;grid-template-columns:296px minmax(0,1fr) 312px}

/* the list: every reply, each with the channels its conversation runs on and where it stands */
.gsd.gsd-v-unibox .gsd-ub-l{display:flex;flex-direction:column;min-width:0;min-height:0;border-right:1px solid var(--gsd-line2);background:var(--gsd-soft)}
.gsd.gsd-v-unibox .gsd-ub-lh{display:flex;align-items:center;gap:8px;flex:none;height:40px;padding:0 14px;border-bottom:1px solid var(--gsd-line2);font:500 12px/1 var(--gsd-sans);color:var(--gsd-mute);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-lh .gsd-n{background:var(--gsd-bg);box-shadow:inset 0 0 0 1px var(--gsd-line)}
.gsd.gsd-v-unibox .gsd-ub-lc{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.gsd.gsd-v-unibox .gsd-ub-lc b{margin-right:4px;font:500 11.5px/1 var(--gsd-mono);color:var(--gsd-text);font-variant-numeric:tabular-nums}
.gsd.gsd-v-unibox .gsd-ub-lc b:last-child{margin-right:0}
.gsd.gsd-v-unibox .gsd-ub-r{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:10px;row-gap:5px;padding:12px 14px;border-bottom:1px solid var(--gsd-line2)}
.gsd.gsd-v-unibox .gsd-ub-r>.gsd-av{grid-row:1/4}
.gsd.gsd-v-unibox .gsd-ub-r.gsd-ub-on{background:var(--gsd-bg);box-shadow:inset 2px 0 0 var(--gsd-ink)}
.gsd.gsd-v-unibox .gsd-ub-r1{display:flex;align-items:center;gap:7px;min-width:0}
.gsd.gsd-v-unibox .gsd-ub-nm{min-width:0;font:600 13px/1.2 var(--gsd-sans);color:var(--gsd-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-r1 time{flex:none;margin-left:auto;font:400 11.5px/1 var(--gsd-sans);color:var(--gsd-faint);font-variant-numeric:tabular-nums}
.gsd.gsd-v-unibox .gsd-ub-dot{flex:none;width:7px;height:7px;margin-left:auto;border-radius:50%;background:var(--gsd-ai)}
.gsd.gsd-v-unibox .gsd-ub-dot+time{margin-left:0}
.gsd.gsd-v-unibox .gsd-ub-unread+.gsd-ub-dot+time{color:var(--gsd-ai-ink);font-weight:500}
.gsd.gsd-v-unibox .gsd-ub-r2{min-width:0;font:400 12.5px/1.38 var(--gsd-sans);color:var(--gsd-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-r3{display:flex;align-items:center;gap:6px;min-width:0;font:500 11.5px/1.2 var(--gsd-sans);color:var(--gsd-mute);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-r3>i{font-style:normal;color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-chs{display:inline-flex;align-items:center;gap:9px;flex:none}
.gsd.gsd-v-unibox .gsd-ub-q{min-width:0;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-q-act{font-weight:600;color:var(--gsd-ai-ink)}
.gsd.gsd-v-unibox .gsd-ub-q-ai{color:var(--gsd-ai-ink)}

/* the thread: one stream of everything with this person, both channels, read from its top; each touch says its
   channel under it, the quiet facts are pills in the middle */
.gsd.gsd-v-unibox .gsd-ub-t{display:flex;flex-direction:column;min-width:0;min-height:0}
.gsd.gsd-v-unibox .gsd-ub-th{display:flex;align-items:center;gap:10px;flex:none;height:58px;padding:0 18px;border-bottom:1px solid var(--gsd-line2)}
.gsd.gsd-v-unibox .gsd-ub-th>span:not(.gsd-ub-chs){display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.gsd.gsd-v-unibox .gsd-ub-th b{font:600 13.5px/1.2 var(--gsd-sans);color:var(--gsd-ink)}
.gsd.gsd-v-unibox .gsd-ub-th small{font:400 12px/1.2 var(--gsd-sans);color:var(--gsd-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-th .gsd-ub-chs{gap:12px}
.gsd.gsd-v-unibox .gsd-ub-s{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0;padding:16px 20px;overflow:hidden}
.gsd.gsd-v-unibox .gsd-ub-f{align-self:center;display:flex;align-items:center;gap:8px;max-width:100%;height:26px;padding:0 11px;border-radius:999px;background:var(--gsd-soft);box-shadow:inset 0 0 0 1px var(--gsd-line2);font:400 11.5px/1 var(--gsd-sans);color:var(--gsd-mute);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-f>span:not(.gsd-ch){min-width:0;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-f b{flex:none;font-weight:600;color:var(--gsd-text)}
.gsd.gsd-v-unibox .gsd-ub-f svg{flex:none;width:13px;height:13px}
.gsd.gsd-v-unibox .gsd-ub-f time{flex:none;font-variant-numeric:tabular-nums;color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-sig svg{color:var(--gsd-info)}
.gsd.gsd-v-unibox .gsd-ub-o{align-self:flex-end;display:flex;flex-direction:column;align-items:flex-end;gap:5px;max-width:80%}
.gsd.gsd-v-unibox .gsd-ub-o>p{padding:9px 12px;border-radius:14px 14px 4px 14px;background:var(--gsd-sunk);font:400 13px/1.45 var(--gsd-sans);color:var(--gsd-ink)}
.gsd.gsd-v-unibox .gsd-ub-i{align-self:flex-start;display:flex;align-items:flex-start;gap:8px;max-width:80%}
.gsd.gsd-v-unibox .gsd-ub-i>.gsd-av{width:26px;height:26px;margin-top:4px}
.gsd.gsd-v-unibox .gsd-ub-i>div{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.gsd.gsd-v-unibox .gsd-ub-i p{padding:9px 12px;border-radius:14px 14px 14px 4px;border:1px solid var(--gsd-line);background:var(--gsd-bg);font:400 13px/1.45 var(--gsd-sans);color:var(--gsd-ink)}
/* an email reads as one: its subject over its words, and its trail (sent, opened) in the line under it */
.gsd.gsd-v-unibox .gsd-ub-subj{display:block;margin-bottom:2px;font-weight:600}
.gsd.gsd-v-unibox .gsd-ub-s small{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;padding:0 4px;font:400 11px/1.3 var(--gsd-sans);color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-s small>*+*:not(.gsd-ch)::before{content:"·";margin-right:6px;color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-s small .gsd-ch{font-size:11px}

/* the card: who she is and how to reach her, then where she stands in every part of the product */
.gsd.gsd-v-unibox .gsd-ub-c{display:flex;flex-direction:column;min-width:0;min-height:0;padding:16px 16px 12px;border-left:1px solid var(--gsd-line2);overflow:hidden}
.gsd.gsd-v-unibox .gsd-ub-ch{display:flex;align-items:center;gap:11px;min-width:0}
.gsd.gsd-v-unibox .gsd-ub-ch>.gsd-av{width:42px;height:42px}
.gsd.gsd-v-unibox .gsd-ub-ch>span{display:flex;flex-direction:column;gap:3px;min-width:0}
.gsd.gsd-v-unibox .gsd-ub-ch b{font:600 14.5px/1.2 var(--gsd-sans);color:var(--gsd-ink)}
.gsd.gsd-v-unibox .gsd-ub-ch small{font:400 12px/1.25 var(--gsd-sans);color:var(--gsd-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-ch small+small{color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-cc{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding-bottom:12px;border-bottom:1px solid var(--gsd-line2)}
.gsd.gsd-v-unibox .gsd-ub-cc li{display:flex;align-items:center;gap:10px;min-width:0;font:400 12.5px/1.2 var(--gsd-sans);color:var(--gsd-text)}
.gsd.gsd-v-unibox .gsd-ub-cc li>:last-child{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-cc .gsd-ch{min-width:70px}
.gsd.gsd-v-unibox .gsd-ub-cd{display:flex;flex-direction:column}
.gsd.gsd-v-unibox .gsd-ub-cd>div{display:flex;flex-direction:column;gap:7px;padding:11px 0;border-bottom:1px solid var(--gsd-line2)}
.gsd.gsd-v-unibox .gsd-ub-cd>div:last-child{border-bottom:0}
.gsd.gsd-v-unibox .gsd-ub-cd dt{font:500 10.5px/1 var(--gsd-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--gsd-faint)}
.gsd.gsd-v-unibox .gsd-ub-cd dd{display:flex;align-items:center;gap:8px;min-width:0;font:400 12.5px/1.3 var(--gsd-sans);color:var(--gsd-ink)}
.gsd.gsd-v-unibox .gsd-ub-cd dd .gsd-stg{font-weight:500}
.gsd.gsd-v-unibox .gsd-ub-cd .gsd-tbl{min-width:0;color:var(--gsd-text)}
.gsd.gsd-v-unibox .gsd-ub-cd .gsd-tbl>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-cd :is(.gsd-fit,.gsd-wc){flex:none;margin-left:auto}
/* the workflow: its name, then where the person is in it (the status pill and the step) */
.gsd.gsd-v-unibox .gsd-ub-wf dd{flex-wrap:wrap;row-gap:7px}
.gsd.gsd-v-unibox .gsd-ub-wf .gsd-tbl{flex:1 0 100%}
.gsd.gsd-v-unibox .gsd-ub-wf .gsd-wc{margin-left:0}
/* the AI SDR: its mode (a dot and a word), a hairline, then where it stands, as the app's thread bar splits them */
.gsd.gsd-v-unibox .gsd-ub-cd .gsd-mode::after{content:"";flex:none;width:1px;height:14px;margin-left:2px;background:var(--gsd-line)}
.gsd.gsd-v-unibox .gsd-ub-as{min-width:0;font-weight:500;color:var(--gsd-text);white-space:nowrap}
.gsd.gsd-v-unibox .gsd-ub-cd dd.gsd-ub-goal{display:block;margin-top:-1px;font-size:12px;color:var(--gsd-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsd.gsd-v-unibox .gsd-ub-goal span{color:var(--gsd-text)}
/* an engaging stage's ring (Replied, where a reply puts the person): a half, the product's pipe palette (the same in
   both themes) */
.gsd.gsd-v-unibox .gsd-rg-eng{--gsd-rg:#F0A23E}
.gsd.gsd-v-unibox .gsd-rg-pos{--gsd-rg:#4FC183}

/* ---- the marks: a ring off each element's own edge ---------------------------------------------------------------- */
.gsd.gsd-v-unibox .gsd-ub-chs[data-gsd-hl]{border-radius:6px;outline-offset:3px}
.gsd.gsd-v-unibox .gsd-ub-chs[data-gsd-hl]::before{inset:-3px}
.gsd.gsd-v-unibox .gsd-ub-fr[data-gsd-hl]{border-radius:10px;outline-offset:5px}
.gsd.gsd-v-unibox .gsd-ub-fr[data-gsd-hl]::before{inset:-5px}
.gsd.gsd-v-unibox :is(.gsd-ub-o,.gsd-ub-i)[data-gsd-hl]{border-radius:16px;outline-offset:5px}
.gsd.gsd-v-unibox :is(.gsd-ub-o,.gsd-ub-i)[data-gsd-hl]::before{inset:-5px}
.gsd.gsd-v-unibox .gsd-ub-f[data-gsd-hl]{outline-offset:3px}
.gsd.gsd-v-unibox .gsd-ub-f[data-gsd-hl]::before{inset:-3px}
.gsd.gsd-v-unibox .gsd-ub-cd>[data-gsd-hl]{margin:0 -9px;padding-left:9px;padding-right:9px;border-radius:10px;border-bottom-color:transparent}

/* ---- narrower: under 1140 px the card gives way (the list and the thread keep the room), under 720 the list stands
   over the thread: its first replies on two lines each, the thread from her LinkedIn answer down ------------------- */
@container gsd (max-width:1139px){
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-b{grid-template-columns:280px minmax(0,1fr)}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-c{display:none}
}
@container gsd (max-width:719px){
  .gsd.gsd-v-unibox .gsd-ph{height:auto;min-height:46px;padding-top:8px;padding-bottom:8px}
  .gsd.gsd-v-unibox .gsd-ph .gsd-ub-fr>:not(:first-child){display:none}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-b{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-l{border-right:0;border-bottom:1px solid var(--gsd-line2)}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-lh{display:none}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-r{padding:9px 12px;row-gap:4px}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-r:nth-child(n+4),.gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-r2{display:none}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-r>.gsd-av{grid-row:1/3;width:26px;height:26px}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-r{grid-template-columns:26px minmax(0,1fr)}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-th{height:48px;padding:0 12px}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-th .gsd-ub-chs{display:none}
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-s{gap:8px;padding:12px}
  /* the thread's head stands as its own band over the stream, so it never reads as a fourth reply of the list */
  .gsd.gsd-v-unibox:not([data-gsd-part]) .gsd-ub-th{background:var(--gsd-soft);border-top:1px solid var(--gsd-line2)}
  .gsd.gsd-v-unibox :is(.gsd-ub-o,.gsd-ub-i){max-width:88%}
  .gsd.gsd-v-unibox :is(.gsd-ub-o,.gsd-ub-i) p{font-size:12.5px}
  .gsd.gsd-v-unibox .gsd-ub-fw{padding:10px 12px}
}

/* ---- the slices (part=): one column at the pane's width, at its content's height ----------------------------------- */
.gsd.gsd-v-unibox[data-gsd-part] .gsd-ub-b{grid-template-columns:minmax(0,1fr)}
.gsd.gsd-v-unibox[data-gsd-part] :is(.gsd-ub-l,.gsd-ub-c){border:0}
.gsd.gsd-v-unibox[data-gsd-part] .gsd-ub-l{background:var(--gsd-bg)}
.gsd.gsd-v-unibox[data-gsd-part] .gsd-ub-r:last-child{border-bottom:0}
.gsd.gsd-v-unibox[data-gsd-part=activity] .gsd-ub-s{flex:none}
.gsd.gsd-v-unibox[data-gsd-part=card]{max-width:480px}
.gsd.gsd-v-unibox[data-gsd-part=card] .gsd-ub-c{padding:18px 20px 8px}
/* a still before the draft or the answer lands keeps no room for it */
.gsd.gsd-v-unibox.gsd-fit .gsd-go .gsd-ub-s>[data-t]:not(.gsd-on){display:none}

/* ---- a still beside a block's words: from 420 px of pane every label reads at 13 px or more, under 420 (a phone) at
   12 or more; the rows grow with it, nothing is cut ------------------------------------------------------------------ */
@container gsd (min-width:420px){
  .gsd.gsd-still.gsd-v-unibox :is(.gsd-ub-chip,.gsd-ub-add,.gsd-ub-save,.gsd-ub-lh,.gsd-ub-r3,.gsd-ub-f,.gsd-ub-cc li,.gsd-ub-th small,.gsd-ub-ch small){font-size:13px}
  .gsd.gsd-still.gsd-v-unibox :is(.gsd-ub-chip,.gsd-ub-add,.gsd-ub-save){height:30px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-cv{line-height:28px}
  .gsd.gsd-still.gsd-v-unibox :is(.gsd-ub-nm,.gsd-ub-th b){font-size:14px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-r2,.gsd.gsd-still.gsd-v-unibox .gsd-ub-cd dd{font-size:13.5px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-r1 time,.gsd.gsd-still.gsd-v-unibox .gsd-ub-lc b{font-size:12.5px}
  .gsd.gsd-still.gsd-v-unibox :is(.gsd-ch,.gsd-ub-s small .gsd-ch){font-size:12.5px}
  .gsd.gsd-still.gsd-v-unibox :is(.gsd-ub-o,.gsd-ub-i) p{font-size:14px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-s small{font-size:12.5px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-f{height:30px;padding:0 13px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-ch b{font-size:16px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-ch>.gsd-av{width:46px;height:46px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-cd dt{font-size:12px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-cd dd.gsd-ub-goal{font-size:13px}
  .gsd.gsd-still.gsd-v-unibox .gsd-wc{font-size:12.5px}
  .gsd.gsd-still.gsd-v-unibox .gsd-wcs{height:18px;font-size:12px;line-height:18px}
  .gsd.gsd-still.gsd-v-unibox .gsd-fit{height:26px;font-size:12.5px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-cc .gsd-ch{min-width:78px}
}
/* a still's reply keeps all its words, on two lines where one is short */
.gsd.gsd-still.gsd-v-unibox .gsd-ub-r2{display:-webkit-box;white-space:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical}
@container gsd (max-width:419px){
  .gsd.gsd-still.gsd-v-unibox :is(.gsd-ub-r3,.gsd-ub-f,.gsd-ub-s small,.gsd-ub-cc li,.gsd-ub-chip,.gsd-ub-add,.gsd-ub-save,.gsd-ub-cd dt){font-size:12px}
  .gsd.gsd-still.gsd-v-unibox .gsd-wcs{height:18px;font-size:12px;line-height:18px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-th{height:auto;min-height:50px;padding-top:8px;padding-bottom:8px}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-th small{white-space:normal}
  .gsd.gsd-still.gsd-v-unibox .gsd-ub-f{height:auto;min-height:26px;padding-top:5px;padding-bottom:5px;white-space:normal;flex-wrap:wrap;justify-content:center;border-radius:13px;text-align:center}
}