:root { color-scheme: light; background: #f8f9fc; }
html, body { background: #f8f9fc; }
@view-transition { navigation: auto; }

.sidebar .brand { min-width: 0; padding: 0 22px; letter-spacing: -.045em; }
.brand-wordmark, .login-wordmark { color: #27243c; font-size: 20px; font-weight: 850; white-space: nowrap; }
.brand-wordmark strong, .login-wordmark strong { color: #7148e8; font-weight: 850; }
.login-wordmark { display: block; margin-bottom: 28px; font-size: 24px; }
.workspace-name { margin-top: 4px; padding-left: 15px; }
.sidebar-bottom:empty, .demo-pill, .demo-note { display: none; }
.topbar-right:empty { display: none; }

input, textarea, .custom-select-trigger { transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
input:hover, textarea:hover, .custom-select-trigger:hover { border-color: #c4b7e8; }
input:focus-visible, textarea:focus-visible, .custom-select-trigger:focus-visible { outline: 0; border-color: #7952e4; box-shadow: 0 0 0 3px rgba(116,73,232,.14); }
input[type="date"] { color-scheme: light; accent-color: #7449e8; }
.button { transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button:focus-visible, a:focus-visible { outline: 2px solid #7952e4; outline-offset: 2px; }

.native-select-hidden { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; padding: 0 !important; opacity: 0 !important; pointer-events: none !important; border: 0 !important; }
.custom-select { position: relative; display: block; min-width: 0; width: 100%; font-weight: 500; }
.custom-select-trigger { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: 39px; padding: 10px 12px; border: 1px solid #dedce8; border-radius: 9px; background: #fff; color: #373449; text-align: left; font-size: 12px; font-weight: 650; cursor: pointer; }
.custom-select-trigger span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.custom-select-chevron { width: 8px; height: 8px; margin-top: -4px; flex: none; border-right: 1.8px solid #8f88a6; border-bottom: 1.8px solid #8f88a6; transform: rotate(45deg); transition: transform .18s ease; }
.custom-select.is-open .custom-select-chevron { transform: rotate(225deg) translate(-3px,-3px); }
.custom-select.is-open .custom-select-trigger { border-color: #7952e4; box-shadow: 0 0 0 3px rgba(116,73,232,.11); }
.custom-select-menu { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; width: max(100%, 180px); max-width: min(320px, calc(100vw - 32px)); max-height: 250px; overflow: auto; padding: 5px; border: 1px solid #e7e1f1; border-radius: 11px; background: #fff; box-shadow: 0 16px 42px rgba(41,28,75,.16); }
.custom-select-menu[hidden] { display: none; }
.custom-select-option { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: 34px; padding: 8px 10px; border: 0; border-radius: 7px; background: transparent; color: #4d485f; text-align: left; font-size: 12px; cursor: pointer; }
.custom-select-option:hover, .custom-select-option:focus-visible { outline: 0; background: #f5f1ff; color: #6841ce; }
.custom-select-option[aria-selected="true"] { background: #f1eaff; color: #6841ce; font-weight: 750; }
.custom-select-option[aria-selected="true"]::after { content: '✓'; display: grid; place-items: center; width: 17px; height: 17px; flex: none; font-size: 13px; line-height: 1; color: #7047da; }
.custom-select-option:disabled { opacity: .45; cursor: not-allowed; }
.filter-bar .search { width: 200px; min-width: 150px; max-width: 200px; flex: 0 1 200px; }
.filter-bar .custom-select { width: 135px; min-width: 115px; max-width: 135px; flex: 0 1 135px; }
.filter-bar .custom-select-trigger { min-height: 35px; padding: 8px 10px; font-size: 11px; }
.quick-status .custom-select { width: 185px; }
.form-grid label .custom-select { margin-top: 0; }

@media (max-width: 650px) {
  .filter-bar .search { width: 100%; max-width: none; flex: 1 1 100%; min-width: 100%; }
  .filter-bar .custom-select { flex: 1 1 calc(50% - 5px); min-width: calc(50% - 5px); max-width: none; }
  .custom-select-menu { width: 100%; }
  .quick-status .custom-select { width: 100%; }
}
@media (min-width: 651px) and (max-width: 850px) {
  .sidebar .brand { justify-content: center; padding: 0 5px; }
  .sidebar .brand .brand-wordmark { display: block; font-size: 0; }
  .sidebar .brand .brand-wordmark::after { content: 'UW'; font-size: 16px; letter-spacing: -.05em; color: #7148e8; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
