:root{
  --usl-workspace-paper:#f4f0e8;
  --usl-workspace-card:#fffdf8;
  --usl-workspace-ink:#17211d;
  --usl-workspace-muted:#60706a;
  --usl-workspace-line:rgba(23,33,29,.16);
  --usl-workspace-green:#173f35;
  --usl-workspace-acid:#d9ff57;
  --usl-workspace-blue:#2546d8;
}
.usl-workspace{
  position:sticky;
  top:0;
  z-index:30;
  overflow:hidden;
  border-block:1px solid var(--usl-workspace-line);
  background:color-mix(in srgb,var(--usl-workspace-paper) 91%,transparent);
  box-shadow:0 10px 30px rgba(23,33,29,.07);
  backdrop-filter:blur(18px);
}
.usl-workspace-inner{
  display:flex;
  width:min(1080px,calc(100% - 32px));
  margin:0 auto;
  gap:14px;
  align-items:stretch;
  padding:9px 0;
}
.usl-workspace-label{
  display:flex;
  flex:0 0 auto;
  gap:9px;
  align-items:center;
  padding-right:14px;
  border-right:1px solid var(--usl-workspace-line);
  color:var(--usl-workspace-ink);
}
.usl-workspace-label span{
  display:inline-grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:11px;
  color:var(--usl-workspace-acid);
  background:var(--usl-workspace-green);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.03em;
}
.usl-workspace-label strong{white-space:nowrap;font-size:.85rem}
.usl-workspace-links{
  display:flex;
  min-width:0;
  flex:1 1 auto;
  gap:7px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  padding-bottom:2px;
  scrollbar-width:thin;
}
.usl-workspace-links a{
  display:flex;
  min-width:142px;
  flex:1 0 142px;
  flex-direction:column;
  justify-content:center;
  padding:7px 11px;
  border:1px solid transparent;
  border-radius:13px;
  color:var(--usl-workspace-muted);
  text-decoration:none;
}
.usl-workspace-links a:hover{
  border-color:var(--usl-workspace-line);
  color:var(--usl-workspace-ink);
  background:var(--usl-workspace-card);
}
.usl-workspace-links a.active{
  border-color:color-mix(in srgb,var(--usl-workspace-green) 45%,var(--usl-workspace-line));
  color:var(--usl-workspace-ink);
  background:color-mix(in srgb,var(--usl-workspace-acid) 25%,var(--usl-workspace-card));
}
.usl-workspace-links small{
  color:var(--usl-workspace-blue);
  font-size:.6rem;
  font-weight:850;
  letter-spacing:.09em;
  line-height:1.2;
}
.usl-workspace-links strong{
  margin-top:3px;
  font-size:.84rem;
  line-height:1.25;
  white-space:nowrap;
}
@media(prefers-color-scheme:dark){
  :root{
    --usl-workspace-paper:#111923;
    --usl-workspace-card:#182331;
    --usl-workspace-ink:#edf2f7;
    --usl-workspace-muted:#b5c0cc;
    --usl-workspace-line:#344254;
    --usl-workspace-green:#77d6ca;
    --usl-workspace-acid:#102019;
    --usl-workspace-blue:#8fc1ec;
  }
}
@media(max-width:680px){
  .usl-workspace-inner{width:min(calc(100% - 24px),1080px);padding:8px 0}
  .usl-workspace-label{display:none}
  .usl-workspace-links{gap:6px}
  .usl-workspace-links a{min-width:128px;flex-basis:128px;padding:7px 10px}
  .usl-workspace-links small{font-size:.56rem}
  .usl-workspace-links strong{font-size:.8rem}
}
