/* [project]/libs/core/ui/src/tokens.css [app-client] (css) */
@font-face {
  font-family: IRANSansX;
  src: url("/fonts/iranSansx/fonts/Woff2/IRANSansXFaNum-Regular.woff2") format("woff2"), url("/fonts/iranSansx/fonts/Woff/IRANSansXFaNum-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: IRANSansX;
  src: url("/fonts/iranSansx/fonts/Woff2/IRANSansXFaNum-Bold.woff2") format("woff2"), url("/fonts/iranSansx/fonts/Woff/IRANSansXFaNum-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --color-ink: #1e2638;
  --color-ink-soft: #445069;
  --color-muted: #656f84;
  --color-paper: #f2f7ff;
  --color-surface: #ffffffc7;
  --color-surface-solid: #fff;
  --color-line: #1e26381f;
  --color-accent: #3d66d0;
  --color-accent-deep: #2b4ea7;
  --color-accent-subtle: #3d66d01a;
  --color-success: #007e9f;
  --color-success-subtle: #007e9f1f;
  --color-warning: #d79628;
  --color-warning-subtle: #d7962824;
  --color-danger: #ba2b2e;
  --color-danger-subtle: #ba2b2e1a;
  --color-info: #3275b4;
  --color-info-subtle: #3275b41f;
  --color-on-accent: #fcfcfc;
  --color-focus-ring: #3d66d059;
  --ink: var(--color-ink);
  --ink-soft: var(--color-ink-soft);
  --muted: var(--color-muted);
  --paper: var(--color-paper);
  --panel: var(--color-surface);
  --line: var(--color-line);
  --accent: var(--color-accent);
  --accent-deep: var(--color-accent-deep);
  --stop: var(--color-danger);
  --start: var(--color-accent);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 2rem;
  --space-8: 2.5rem;
  --font-display: "IRANSansX", sans-serif;
  --font-body: "IRANSansX", sans-serif;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;
  --radius-sm: .5rem;
  --radius-md: .625rem;
  --radius-lg: 1.125rem;
  --radius-full: 999px;
  --radius: var(--radius-lg);
  --shadow-sm: 0 2px 8px #202c260f;
  --shadow-md: 0 12px 32px #202c261a;
  --shadow-lg: 0 18px 50px #202c261f;
  --shadow: var(--shadow-lg);
  --z-dropdown: 50;
  --z-sticky: 100;
  --z-modal-backdrop: 200;
  --z-modal: 210;
  --z-toast: 300;
  --z-tooltip: 400;
  --duration-fast: .15s;
  --duration-normal: .25s;
  --duration-slow: .4s;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-in-out: cubic-bezier(.45, 0, .55, 1);
  --bp-xs: 390px;
  --bp-sm: 768px;
  --bp-md: 1024px;
  --bp-lg: 1280px;
  --touch-min: 2.75rem;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --mobile-nav-height: 3.75rem;
}

@supports (color: lab(0% 0 0)) {
  :root {
    --color-ink: lab(15.0914% .523895 -12.7074);
    --color-ink-soft: lab(33.6076% .305563 -16.4398);
    --color-muted: lab(46.4539% -.207305 -12.939);
    --color-paper: lab(97.0753% -.963062 -4.39618);
    --color-surface: lab(100% 0 0 / .78);
    --color-surface-solid: lab(100% 0 0);
    --color-line: lab(15.0914% .523895 -12.7074 / .12);
    --color-accent: lab(44.8533% 13.5164 -60.1598);
    --color-accent-deep: lab(34.5566% 12.9366 -53.0243);
    --color-accent-subtle: lab(44.8533% 13.5164 -60.1598 / .1);
    --color-success: lab(48.197% -25.5097 -35.6742);
    --color-success-subtle: lab(48.197% -25.5097 -35.6742 / .12);
    --color-warning: lab(67.3872% 18.7132 63.1076);
    --color-warning-subtle: lab(67.3872% 18.7132 63.1076 / .14);
    --color-danger: lab(42.4959% 56.9739 35.4904);
    --color-danger-subtle: lab(42.4959% 56.9739 35.4904 / .1);
    --color-info: lab(47.2838% -4.9921 -40.4988);
    --color-info-subtle: lab(47.2838% -4.9921 -40.4988 / .12);
    --color-on-accent: lab(98.84% .0000298023 -.0000119209);
    --color-focus-ring: lab(44.8533% 13.5164 -60.1598 / .35);
    --shadow-sm: 0 2px 8px lab(16.7482% -6.6562 1.91945 / .06);
    --shadow-md: 0 12px 32px lab(16.7482% -6.6562 1.91945 / .1);
    --shadow-lg: 0 18px 50px lab(16.7482% -6.6562 1.91945 / .12);
  }
}

[data-theme="dark"] {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  --color-ink: #e0e8f9;
  --color-ink-soft: #acb8cf;
  --color-muted: #8892a8;
  --color-paper: #101622;
  --color-surface: #181f2ee6;
  --color-surface-solid: #1d2433;
  --color-line: #e0e8f91f;
  --color-accent: #6e9aff;
  --color-accent-deep: #567edc;
  --color-accent-subtle: #6e9aff26;
  --color-focus-ring: #6e9aff66;
  --shadow-sm: 0 2px 8px #00000040;
  --shadow-md: 0 12px 32px #00000059;
  --shadow-lg: 0 18px 50px #00000073;
}

@supports (color: lab(0% 0 0)) {
  [data-theme="dark"] {
    --color-ink: lab(91.7639% -.440538 -9.37252);
    --color-ink-soft: lab(74.3064% -.424385 -13.0298);
    --color-muted: lab(60.3813% -.336051 -12.9914);
    --color-paper: lab(7.0769% .310712 -9.02114);
    --color-surface: lab(11.6467% .403248 -10.9039 / .9);
    --color-surface-solid: lab(13.9722% .308588 -10.9296);
    --color-line: lab(91.7639% -.440538 -9.37252 / .12);
    --color-accent: lab(63.831% 7.79423 -57.0868);
    --color-accent-deep: lab(53.4199% 8.22216 -53.4068);
    --color-accent-subtle: lab(63.831% 7.79423 -57.0868 / .15);
    --color-focus-ring: lab(63.831% 7.79423 -57.0868 / .4);
    --shadow-sm: 0 2px 8px lab(0% 0 0 / .25);
    --shadow-md: 0 12px 32px lab(0% 0 0 / .35);
    --shadow-lg: 0 18px 50px lab(0% 0 0 / .45);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0s;
    --duration-normal: 0s;
  }
}

/* [project]/libs/core/ui/src/components.css [app-client] (css) */
.ui-focus-ring:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.ui-btn {
  justify-content: center;
  align-items: center;
  gap: var(--space-2);
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-weight: 600;
  line-height: var(--leading-tight);
  cursor: pointer;
  transition: transform var(--duration-fast) var(--ease-out),
    background var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
  white-space: nowrap;
  border: 0;
  display: inline-flex;
}

.ui-btn:active:not(:disabled) {
  transform: scale(.98);
}

.ui-btn:disabled, .ui-btn[aria-disabled="true"] {
  opacity: .6;
  cursor: not-allowed;
  transform: none;
}

.ui-btn--sm {
  min-height: 2rem;
  padding-inline: var(--space-3);
  font-size: var(--text-sm);
}

.ui-btn--md {
  min-height: 2.5rem;
  padding-inline: var(--space-4);
  font-size: var(--text-sm);
}

.ui-btn--lg {
  min-height: 2.75rem;
  padding-inline: var(--space-5);
  font-size: var(--text-base);
}

.ui-btn--primary {
  background: var(--color-accent);
  color: var(--color-on-accent);
}

.ui-btn--primary:hover:not(:disabled) {
  background: var(--color-accent-deep);
}

.ui-btn--secondary {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.ui-btn--secondary:hover:not(:disabled) {
  background: #3d66d029;
  background: lab(44.8533% 13.5164 -60.1598 / .16);
}

.ui-btn--ghost {
  color: var(--color-ink-soft);
  border: 1px solid var(--color-line);
  background: none;
}

.ui-btn--ghost:hover:not(:disabled) {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.ui-btn--danger {
  color: var(--color-danger);
  background: none;
  border: 1px solid #ba2b2e47;
  border: 1px solid lab(42.4959% 56.9739 35.4904 / .28);
}

.ui-btn--danger:hover:not(:disabled) {
  background: var(--color-danger-subtle);
}

.ui-btn--success {
  background: var(--color-success);
  color: var(--color-on-accent);
}

.ui-btn--success:hover:not(:disabled) {
  filter: brightness(.95);
}

.ui-btn--start {
  background: var(--color-accent);
  color: var(--color-on-accent);
  min-width: 5.5rem;
  font-weight: 700;
}

.ui-btn--start:hover:not(:disabled) {
  background: var(--color-accent-deep);
}

.ui-btn--stop {
  background: var(--color-danger);
  color: var(--color-on-accent);
  min-width: 5.5rem;
  font-weight: 700;
}

.ui-btn--stop:not(:disabled) {
  animation: 1.6s infinite ui-pulse-stop;
}

@keyframes ui-pulse-stop {
  0%, 100% {
    box-shadow: 0 0 #ba2b2e59;
    box-shadow: 0 0 lab(42.4959% 56.9739 35.4904 / .35);
  }

  50% {
    box-shadow: 0 0 0 8px #ba2b2e00;
    box-shadow: 0 0 0 8px lab(42.4959% 56.9739 35.4904 / 0);
  }
}

.ui-btn--loading {
  pointer-events: none;
  position: relative;
  color: #0000 !important;
}

.ui-btn--loading:after {
  content: "";
  inset-inline-start: 50%;
  border: 2px solid;
  width: 1rem;
  height: 1rem;
  color: var(--color-on-accent);
  border-inline-end-color: #0000;
  border-radius: 50%;
  margin: -.5rem 0 0 -.5rem;
  animation: .65s linear infinite ui-spin;
  position: absolute;
  top: 50%;
}

.ui-btn--ghost.ui-btn--loading:after, .ui-btn--danger.ui-btn--loading:after {
  color: var(--color-ink-soft);
}

@keyframes ui-spin {
  to {
    transform: rotate(360deg);
  }
}

button:not([class*="ui-btn"]).primary {
  background: var(--color-accent);
  color: var(--color-on-accent);
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background var(--duration-fast) var(--ease-out);
  border: 0;
  margin-top: .35rem;
  padding: .65rem 1.1rem;
  font-weight: 700;
}

button:not([class*="ui-btn"]).primary:hover:not(:disabled) {
  background: var(--color-accent-deep);
}

button:not([class*="ui-btn"]).ghost {
  color: var(--color-ink-soft);
  border: 1px solid var(--color-line);
  font-size: var(--text-sm);
  border-radius: var(--radius-full);
  cursor: pointer;
  background: none;
  padding: .45rem .85rem;
}

button:not([class*="ui-btn"]).ghost:hover {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

button:not([class*="ui-btn"]).danger {
  color: var(--color-danger);
  font-size: var(--text-sm);
  border-radius: var(--radius-full);
  cursor: pointer;
  background: none;
  border: 1px solid #ba2b2e47;
  border: 1px solid lab(42.4959% 56.9739 35.4904 / .28);
  padding: .45rem .85rem;
}

button:not([class*="ui-btn"]).danger:hover {
  background: var(--color-danger-subtle);
}

button:not([class*="ui-btn"]).start {
  background: var(--color-accent);
  color: var(--color-on-accent);
  border-radius: var(--radius-full);
  cursor: pointer;
  border: 0;
  min-width: 5.5rem;
  padding: .65rem 1.1rem;
  font-weight: 700;
}

button:not([class*="ui-btn"]).stop {
  background: var(--color-danger);
  color: var(--color-on-accent);
  border-radius: var(--radius-full);
  cursor: pointer;
  border: 0;
  min-width: 5.5rem;
  padding: .65rem 1.1rem;
  font-weight: 700;
  animation: 1.6s infinite ui-pulse-stop;
}

button:not([class*="ui-btn"]):disabled, .start:disabled, .stop:disabled {
  opacity: .65;
  cursor: not-allowed;
}

.ui-icon-btn {
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  background: var(--color-surface-solid);
  width: 2.25rem;
  height: 2.25rem;
  color: var(--color-ink-soft);
  cursor: pointer;
  transition: background var(--duration-fast) var(--ease-out);
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.ui-icon-btn:hover:not(:disabled) {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.ui-icon-btn:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.ui-field {
  gap: var(--space-2);
  display: grid;
}

.ui-field__label {
  font-size: var(--text-sm);
  color: var(--color-ink-soft);
  font-weight: 600;
}

.ui-field__hint {
  font-size: var(--text-xs);
  color: var(--color-muted);
  margin: 0;
}

.ui-field__error {
  font-size: var(--text-sm);
  color: var(--color-danger);
  margin: 0;
}

.ui-input, .ui-select, .ui-textarea {
  width: 100%;
  min-height: 2.5rem;
  padding-block: var(--space-3);
  padding-inline: var(--space-3);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  background: var(--color-surface-solid);
  color: var(--color-ink);
  font: inherit;
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  transition: border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
}

.ui-select {
  appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%235a6b66' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-position: .65rem;
  background-repeat: no-repeat;
  padding-inline-start: 2.25rem;
  padding-inline-end: var(--space-3);
}

[dir="ltr"] .ui-select {
  background-position: right .65rem center;
  padding-inline-start: var(--space-3);
  padding-inline-end: 2.25rem;
}

.ui-checkbox {
  appearance: none;
  background: var(--color-surface-solid);
  cursor: pointer;
  width: 1.125rem;
  height: 1.125rem;
  transition: background var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
  border: 1.5px solid #202c2638;
  border: 1.5px solid lab(16.7482% -6.6562 1.91945 / .22);
  border-radius: .3rem;
  flex-shrink: 0;
  place-content: center;
  margin: 0;
  display: inline-grid;
}

.ui-checkbox:after {
  content: "";
  border: 2px solid #0000;
  border-inline-end-color: var(--color-on-accent);
  border-bottom-color: var(--color-on-accent);
  width: .45rem;
  height: .25rem;
  transition: transform var(--duration-fast) var(--ease-out);
  margin-block-end: .1rem;
  transform: rotate(45deg)scale(0);
}

.ui-checkbox:checked {
  background: var(--color-accent);
  border-color: var(--color-accent);
}

.ui-checkbox:checked:after {
  transform: rotate(45deg)scale(1);
}

.ui-checkbox:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.ui-checkbox:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.ui-input:focus, .ui-select:focus, .ui-textarea:focus {
  box-shadow: 0 0 0 3px var(--color-focus-ring);
  border-color: #007b668c;
  border-color: lab(45.6129% -35.2776 3.0459 / .55);
  outline: none;
}

.ui-input:disabled, .ui-select:disabled, .ui-textarea:disabled {
  opacity: .65;
  cursor: not-allowed;
  background: #202c260a;
  background: lab(16.7482% -6.6562 1.91945 / .04);
}

.ui-input--error, .ui-select--error, .ui-textarea--error {
  border-color: #ba2b2e73;
  border-color: lab(42.4959% 56.9739 35.4904 / .45);
}

.ui-textarea {
  resize: vertical;
  min-height: 6.5rem;
  line-height: var(--leading-relaxed);
}

.ui-password-wrap {
  display: block;
  position: relative;
}

.ui-password-input {
  padding-inline-end: 2.75rem;
}

.ui-password-toggle {
  border-radius: var(--radius-sm);
  width: 2rem;
  height: 2rem;
  color: var(--color-muted);
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
  position: absolute;
  inset-block-start: 50%;
  inset-inline-end: var(--space-2);
  transform: translateY(-50%);
}

.ui-password-toggle:hover {
  color: var(--color-ink-soft);
  background: var(--color-accent-subtle);
}

.ui-badge {
  align-items: center;
  gap: var(--space-1);
  padding-block: .15rem;
  padding-inline: var(--space-2);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 600;
  line-height: var(--leading-tight);
  white-space: nowrap;
  display: inline-flex;
}

.ui-badge--default {
  color: var(--color-ink-soft);
  background: #202c2614;
  background: lab(16.7482% -6.6562 1.91945 / .08);
}

.ui-badge--accent {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.ui-badge--success {
  background: var(--color-success-subtle);
  color: #00512a;
  color: lab(29.363% -32.2878 16.7087);
}

.ui-badge--warning {
  background: var(--color-warning-subtle);
  color: #764b00;
  color: lab(35.9765% 17.8288 65.2658);
}

.ui-badge--danger {
  background: var(--color-danger-subtle);
  color: var(--color-danger);
}

.ui-badge--info {
  background: var(--color-info-subtle);
  color: #004f8b;
  color: lab(32.0502% -2.01271 -40.1671);
}

.ui-chip {
  align-items: center;
  gap: var(--space-1);
  padding-block: .2rem;
  padding-inline: var(--space-2);
  border-radius: var(--radius-full);
  border: 1px solid var(--color-line);
  font-size: var(--text-xs);
  background: var(--color-surface-solid);
  color: var(--color-ink-soft);
  font-weight: 500;
  display: inline-flex;
}

.ui-chip--accent {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
  border-color: #007b6640;
  border-color: lab(45.6129% -35.2776 3.0459 / .25);
}

.ui-chip--muted {
  color: var(--color-muted);
  background: #202c260d;
  background: lab(16.7482% -6.6562 1.91945 / .05);
}

.ui-chip__remove {
  color: inherit;
  opacity: .7;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  line-height: 1;
  display: inline-flex;
}

.ui-chip__remove:hover {
  opacity: 1;
}

.ui-card {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: var(--space-5);
}

.ui-card__header {
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
  margin-block-end: var(--space-4);
  display: flex;
}

.ui-card__title {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: var(--color-ink);
  margin: 0;
  font-weight: 700;
}

.ui-modal-backdrop {
  z-index: var(--z-modal-backdrop);
  padding: var(--space-5);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background: #202c2673;
  background: lab(16.7482% -6.6562 1.91945 / .45);
  place-items: center;
  display: grid;
  position: fixed;
  inset: 0;
}

.ui-modal {
  z-index: var(--z-modal);
  background: var(--color-surface-solid);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  width: min(100%, 480px);
  max-height: min(92vh, 760px);
  box-shadow: var(--shadow-lg);
  padding: var(--space-5);
  position: relative;
  overflow-y: auto;
}

.ui-modal__header {
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
  margin-block-end: var(--space-4);
  display: flex;
}

.ui-modal__title {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  margin: 0;
  font-weight: 700;
}

.ui-modal__body {
  gap: var(--space-4);
  display: grid;
}

.ui-modal__footer {
  justify-content: flex-end;
  gap: var(--space-2);
  margin-block-start: var(--space-4);
  display: flex;
}

.ui-confirm-dialog__message {
  color: var(--ink-soft);
  margin: 0;
  line-height: 1.55;
}

.ui-muted {
  color: var(--color-muted);
}

.ui-error-text {
  color: var(--color-danger);
  font-size: var(--text-sm);
  margin: 0;
}

.muted {
  color: var(--color-muted);
}

.error {
  margin: 0 0 var(--space-3);
  color: var(--color-danger);
  font-size: var(--text-sm);
}

/* [project]/libs/core/ui/src/a11y.css [app-client] (css) */
.skip-link {
  z-index: calc(var(--z-tooltip) + 1);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-accent-deep);
  color: var(--color-on-accent);
  font-size: var(--text-sm);
  transform: translateY(calc(-100% - var(--space-6)));
  transition: transform var(--duration-fast) var(--ease-out);
  font-weight: 700;
  text-decoration: none;
  position: fixed;
  inset-block-start: var(--space-4);
  inset-inline-start: var(--space-4);
}

.skip-link:focus, .skip-link:focus-visible {
  transform: translateY(0);
}

.sr-only {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

#main-content:focus {
  outline: none;
}

#main-content:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 4px;
  border-radius: var(--radius-sm);
}

button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [role="tab"]:focus-visible, [role="button"]:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.muted, .ui-empty__desc, .auth-card__subtitle {
  color: var(--color-ink-soft);
}

/* [project]/libs/core/ui/src/motion.css [app-client] (css) */
@keyframes tempo-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes tempo-scale-in {
  from {
    opacity: 0;
    transform: scale(.97);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes tempo-rise {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes tempo-toast-in {
  from {
    opacity: 0;
    transform: translateY(.65rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes tempo-toast-out {
  from {
    opacity: 1;
    transform: translateY(0);
  }

  to {
    opacity: 0;
    transform: translateY(.5rem);
  }
}

@keyframes tempo-live-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .45;
  }
}

@keyframes tempo-atmosphere-drift {
  from {
    transform: translate3d(0, 0, 0)scale(1);
  }

  to {
    transform: translate3d(-1.5%, 2%, 0)scale(1.03);
  }
}

.modal-backdrop, .ui-modal-backdrop {
  animation: tempo-fade-in var(--duration-fast) var(--ease-out);
  will-change: opacity;
}

.modal, .ui-modal {
  animation: tempo-scale-in var(--duration-normal) var(--ease-out);
  will-change: transform, opacity;
}

.panel, .list-panel {
  animation: tempo-rise var(--duration-normal) var(--ease-out);
  will-change: transform, opacity;
}

.ui-toast {
  animation: tempo-toast-in var(--duration-normal) var(--ease-out);
  will-change: transform, opacity;
}

.ui-toast.is-exiting {
  animation: tempo-toast-out var(--duration-fast) var(--ease-out) forwards;
}

.ui-btn:active:not(:disabled), .ui-icon-btn:active:not(:disabled) {
  transform: scale(.98);
}

.tempo-live-pulse, .task-table__status-pulse, .task-list-summary__pulse, .app-shell__live-dot, .kanban-card.is-running .kanban-card__live-dot {
  animation: tempo-live-pulse 1.5s var(--ease-out) infinite;
}

@keyframes tempo-hourglass-turn {
  0%, 38% {
    transform: rotate(0);
  }

  50%, 88% {
    transform: rotate(180deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .tempo-hourglass-running {
    transform-box: view-box;
    transform-origin: center;
    animation: 5.6s ease-in-out infinite tempo-hourglass-turn;
  }

  .task-card-list .task-card {
    animation: tempo-rise var(--duration-normal) var(--ease-out) both;
  }

  .task-card-list .task-card:first-child {
    animation-delay: 0s;
  }

  .task-card-list .task-card:nth-child(2) {
    animation-delay: 35ms;
  }

  .task-card-list .task-card:nth-child(3) {
    animation-delay: 70ms;
  }

  .task-card-list .task-card:nth-child(4) {
    animation-delay: .105s;
  }

  .task-card-list .task-card:nth-child(5) {
    animation-delay: .14s;
  }

  .task-card-list .task-card:nth-child(n+6) {
    animation-delay: .175s;
  }

  .task-table tbody tr {
    animation: tempo-rise var(--duration-normal) var(--ease-out) both;
  }

  .task-table tbody tr:first-child {
    animation-delay: 0s;
  }

  .task-table tbody tr:nth-child(2) {
    animation-delay: 30ms;
  }

  .task-table tbody tr:nth-child(3) {
    animation-delay: 60ms;
  }

  .task-table tbody tr:nth-child(4) {
    animation-delay: 90ms;
  }

  .task-table tbody tr:nth-child(5) {
    animation-delay: .12s;
  }

  .task-table tbody tr:nth-child(n+6) {
    animation-delay: .15s;
  }

  .kanban-board--enter .kanban-column__cards .kanban-card {
    animation: tempo-rise var(--duration-normal) var(--ease-out) both;
  }

  .kanban-board--enter .kanban-column__cards .kanban-card:first-child {
    animation-delay: 0s;
  }

  .kanban-board--enter .kanban-column__cards .kanban-card:nth-child(2) {
    animation-delay: 40ms;
  }

  .kanban-board--enter .kanban-column__cards .kanban-card:nth-child(3) {
    animation-delay: 80ms;
  }

  .kanban-board--enter .kanban-column__cards .kanban-card:nth-child(n+4) {
    animation-delay: .12s;
  }
}

.atmosphere {
  animation: tempo-atmosphere-drift 18s var(--ease-out) infinite alternate;
}

@media (prefers-reduced-motion: reduce) {
  .atmosphere {
    animation: none !important;
  }

  .modal-backdrop, .ui-modal-backdrop, .modal, .ui-modal, .panel, .list-panel, .ui-toast, .task-card-list .task-card, .task-table tbody tr, .kanban-column__cards .kanban-card {
    will-change: auto;
    transition: none !important;
    animation: 1ms linear tempo-fade-in !important;
  }

  .ui-toast.is-exiting {
    animation: 1ms linear reverse tempo-fade-in !important;
  }

  .tempo-live-pulse, .task-table__status-pulse, .task-list-summary__pulse, .app-shell__live-dot, .kanban-card.is-running .kanban-card__live-dot, .task-card.is-running .task-card__time strong:before {
    animation: none !important;
  }

  .ui-btn:active:not(:disabled), .ui-icon-btn:active:not(:disabled) {
    transform: none;
  }
}

/* [project]/libs/core/ui/src/states.css [app-client] (css) */
@keyframes ui-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.ui-skeleton {
  border-radius: var(--radius-md, 10px);
  background: linear-gradient(110deg, #1a24210f 30%, #1a24211a 50%, #1a24210f 70%) 0 0 / 200% 100%;
  animation: 1.2s ease-in-out infinite ui-shimmer;
}

.ui-skeleton--text {
  border-radius: 6px;
  height: .85rem;
}

.ui-skeleton--block {
  height: 3rem;
}

.ui-skeleton-table {
  gap: .45rem;
  margin-top: .75rem;
  display: grid;
}

.ui-skeleton-table__head, .ui-skeleton-table__row {
  grid-template-columns: 2fr 1fr 1fr .75fr;
  gap: .55rem;
  display: grid;
}

.ui-skeleton-table__head .ui-skeleton {
  opacity: .7;
  height: .75rem;
}

.ui-skeleton-table__row .ui-skeleton {
  height: 2.75rem;
}

.ui-skeleton-kanban {
  gap: .75rem;
  margin-top: .75rem;
  padding-bottom: .35rem;
  display: flex;
  overflow-x: auto;
}

.ui-skeleton-kanban__col {
  border: 1px solid var(--line);
  background: #ffffff8c;
  border-radius: 14px;
  flex: 0 0 min(17rem, 78vw);
  gap: .45rem;
  padding: .65rem;
  display: grid;
}

.ui-skeleton-kanban__col .ui-skeleton:first-child {
  width: 55%;
  height: 1.25rem;
}

.ui-skeleton-list {
  gap: .45rem;
  display: grid;
}

.ui-skeleton-list .ui-skeleton {
  height: 3.25rem;
}

.ui-skeleton-cards {
  grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  gap: .55rem;
  display: grid;
}

.ui-skeleton-cards .ui-skeleton {
  height: 4.5rem;
}

.ui-empty {
  text-align: center;
  border: 1px dashed var(--line);
  color: var(--muted);
  background: #ffffff8c;
  border-radius: 14px;
  justify-items: center;
  gap: .55rem;
  padding: 2rem 1.25rem;
  display: grid;
}

.ui-empty.is-compact {
  border-radius: 12px;
  gap: .35rem;
  padding: 1.25rem .85rem;
}

.ui-empty__icon {
  width: 3rem;
  height: 3rem;
  color: var(--accent-deep);
  background: #0f766e1a;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.ui-empty.is-compact .ui-empty__icon {
  width: 2.25rem;
  height: 2.25rem;
}

.ui-empty__icon svg {
  width: 1.35rem;
  height: 1.35rem;
}

.ui-empty.is-compact .ui-empty__icon svg {
  width: 1rem;
  height: 1rem;
}

.ui-empty__title {
  color: var(--ink-soft);
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.ui-empty.is-compact .ui-empty__title {
  font-size: .88rem;
}

.ui-empty__desc {
  max-width: 26rem;
  margin: 0;
  font-size: .85rem;
  line-height: 1.5;
}

.ui-empty.is-compact .ui-empty__desc {
  font-size: .78rem;
}

.ui-inline-error {
  background: #fee2e273;
  border: 1px solid #dc262640;
  border-radius: 12px;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  margin: .75rem 0 0;
  padding: .75rem .85rem;
  display: flex;
}

.ui-inline-error__msg {
  color: #991b1b;
  flex: 1;
  min-width: 10rem;
  margin: 0;
  font-size: .88rem;
}

.ui-offline-banner {
  z-index: var(--z-sticky);
  color: #fff;
  text-align: center;
  background: #78350f;
  justify-content: center;
  align-items: center;
  gap: .45rem;
  padding: .55rem 1rem;
  font-size: .84rem;
  font-weight: 600;
  display: flex;
  position: sticky;
  top: 0;
}

.ui-offline-banner svg {
  flex-shrink: 0;
}

.ui-error-fallback {
  text-align: center;
  background: var(--paper, #f4f7f6);
  place-content: center;
  justify-items: center;
  gap: .75rem;
  min-height: 100vh;
  padding: 2rem;
  display: grid;
}

.ui-error-fallback__icon {
  color: #dc2626;
  background: #dc26261f;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  height: 3.5rem;
  display: flex;
}

.ui-error-fallback h1 {
  color: var(--ink);
  margin: 0;
  font-size: 1.15rem;
}

.ui-error-fallback p {
  max-width: 24rem;
  color: var(--muted);
  margin: 0;
  font-size: .9rem;
  line-height: 1.55;
}

@media (prefers-reduced-motion: reduce) {
  .ui-skeleton {
    animation: none;
  }
}

/* [project]/libs/core/ui/src/responsive.css [app-client] (css) */
:root {
  --bp-xs: 390px;
  --bp-sm: 768px;
  --bp-md: 1024px;
  --bp-lg: 1280px;
  --touch-min: 2.75rem;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --mobile-nav-height: 3.75rem;
}

@media (max-width: 767px) {
  .ui-toast-stack {
    bottom: calc(var(--mobile-nav-height) + var(--safe-bottom) + var(--space-2));
    inset-inline-end: calc(var(--space-3) + var(--safe-right, 0px));
  }

  .modal-backdrop, .ui-modal-backdrop {
    place-items: stretch stretch;
    padding: 0;
  }

  .modal, .ui-modal {
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 100dvh;
    max-height: none;
    padding-top: calc(var(--space-5) + var(--safe-top));
    padding-bottom: calc(var(--space-5) + var(--safe-bottom));
    padding-inline: calc(var(--space-4) + var(--safe-right))
      calc(var(--space-4) + var(--safe-left));
    border-inline: 0;
    border-radius: 0;
    animation: none;
  }

  .modal-backdrop, .ui-modal-backdrop {
    animation: none;
  }

  .ui-icon-btn {
    min-width: var(--touch-min);
    min-height: var(--touch-min);
  }

  .ui-btn--sm {
    min-height: var(--touch-min);
  }

  .notif-bell__btn.ui-icon-btn, .user-menu__trigger, .kanban-card__action, .task-table__action {
    min-width: var(--touch-min);
    min-height: var(--touch-min);
  }

  .view-mode-toggle__btn {
    min-height: var(--touch-min) !important;
  }
}

@media (max-width: 389px) {
  .page {
    padding-inline: calc(var(--space-3) + var(--safe-right))
      calc(var(--space-3) + var(--safe-left));
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .page {
    padding-inline: clamp(1rem, 3vw, 2rem);
  }
}

@media (min-width: 1280px) {
  .page {
    max-width: var(--bp-lg);
    margin-inline: auto;
  }
}

/* [project]/frontend/app/globals.css [app-client] (css) */
* {
  margin: 0;
}

body {
  min-width: 320px;
}

.ui-preview-page .brand {
  margin: 0 0 var(--space-2);
  font-family: var(--font-display);
  letter-spacing: -.03em;
  color: var(--color-accent-deep);
  font-size: clamp(1.5rem, 4vw, 2.2rem);
  font-weight: 800;
}

.ui-preview-page .headline {
  margin-block: var(--space-2) var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
}

.ui-preview-page .lede {
  max-width: 34rem;
  color: var(--color-ink-soft);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  margin: 0;
}

.ui-preview-header {
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-block-end: var(--space-6);
  display: flex;
}

.ui-preview-grid {
  gap: var(--space-5);
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  display: grid;
}

.ui-preview-row {
  gap: var(--space-2);
  flex-wrap: wrap;
  align-items: center;
  margin-block-end: var(--space-3);
  display: flex;
}

.ui-preview-row:last-child {
  margin-block-end: 0;
}

.ui-preview-form {
  gap: var(--space-4);
  display: grid;
}

.ui-preview-swatches {
  gap: var(--space-3);
  grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
  display: grid;
}

.ui-preview-swatch {
  gap: var(--space-2);
  text-align: center;
  display: grid;
}

.ui-preview-swatch span {
  border-radius: var(--radius-md);
  border: 1px solid var(--color-line);
  height: 3rem;
  display: block;
}

.ui-preview-swatch code {
  font-size: var(--text-xs);
  color: var(--color-muted);
}

/* [project]/libs/modules/codex/src/Codex.css [app-client] (css) */
.codex-page {
  gap: 1rem;
  width: 100%;
  min-width: 0;
  padding: 1rem;
  display: grid;
}

.codex-job-report {
  gap: .5rem;
  min-width: 0;
  margin-block: .75rem;
  display: grid;
}

.codex-job-report pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: inherit;
  border: 1px solid var(--color-line);
  border-radius: .75rem;
  max-height: 28rem;
  padding: .75rem;
  overflow-y: auto;
}

.codex-job-report > button {
  justify-self: start;
}

.codex-settings, .codex-queue {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  border-radius: 1rem;
  gap: 1rem;
  padding: 1.25rem;
  display: grid;
}

.codex-environment {
  grid-template-columns: 1fr 1fr auto;
  align-items: end;
  gap: .75rem;
  display: grid;
}

.codex-environment > *, .codex-settings .ui-field {
  min-width: 0;
}

.codex-actions {
  flex-wrap: wrap;
  gap: .75rem;
  display: flex;
}

.codex-job-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
  gap: .75rem;
  display: grid;
}

.codex-job {
  border: 1px solid var(--color-line);
  background: var(--color-surface);
  min-width: 0;
  color: inherit;
  font: inherit;
  text-align: start;
  overflow-wrap: anywhere;
  cursor: pointer;
  border-radius: .875rem;
  gap: .5rem;
  padding: 1rem;
  transition: border-color .16s, box-shadow .16s, transform .16s;
  display: grid;
}

.codex-job:hover {
  border-color: var(--color-accent);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.codex-job:focus-visible {
  outline: 3px solid var(--color-accent-subtle);
  outline-offset: 2px;
}

.codex-job h3, .codex-job p, .codex-job-details p {
  margin: 0;
}

.codex-job h3 {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.codex-job p {
  color: var(--color-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.codex-job-modal {
  width: min(100%, 42rem);
}

.codex-job-details {
  overflow-wrap: anywhere;
  gap: .75rem;
  display: grid;
}

.codex-task-panel {
  gap: .75rem;
  padding-block: 1rem;
  display: grid;
}

.codex-task-panel > button {
  justify-self: start;
}

.codex-task-panel__form {
  gap: .75rem;
  display: grid;
}

.codex-task-panel__jobs {
  gap: .75rem;
  padding: 0;
  list-style: none;
  display: grid;
}

.codex-task-panel__jobs li {
  overflow-wrap: anywhere;
  gap: .35rem;
  display: grid;
}

@media (max-width: 767px) {
  .app-shell:has(.codex-page) {
    padding-block-end: 1rem;
  }

  :is(.app-shell:has(.codex-page) .app-shell__sidebar, .app-shell:has(.codex-page) .mobile-bottom-nav, .app-shell:has(.codex-page) .app-shell__fab) {
    display: none;
  }

  .app-shell:has(.codex-page) .app-shell__kanban-menu {
    display: inline-flex;
  }

  .app-shell:has(.codex-page) .app-shell__brand {
    text-decoration: none;
  }

  .app-shell:has(.codex-page) .app-shell__brand span {
    display: none;
  }

  .app-shell.is-sidebar-open:has(.codex-page) .app-shell__sidebar {
    background: var(--color-surface-solid);
    border-radius: 1rem;
    flex-direction: column;
    gap: .75rem;
    padding: 1rem;
    display: flex;
  }

  .app-shell:has(.codex-page) .app-shell__nav {
    gap: .5rem;
    display: grid;
  }

  .app-shell:has(.codex-page) .app-shell__nav button {
    min-height: 2.75rem;
    color: var(--color-ink);
    font: inherit;
    text-align: start;
    background: none;
    border: 0;
    border-radius: .75rem;
    align-items: center;
    gap: .5rem;
    padding: .5rem .75rem;
    display: flex;
  }

  .app-shell:has(.codex-page) .app-shell__nav button.is-active {
    color: var(--color-accent);
    background: var(--color-accent-subtle);
  }

  .codex-environment {
    grid-template-columns: 1fr;
  }

  .codex-page {
    padding: .5rem;
  }
}

.ssh-runner-settings {
  border: 1px solid var(--color-line);
  border-radius: 1rem;
  gap: 1rem;
  min-width: 0;
  margin-top: 2rem;
  padding: 1rem;
  display: grid;
}

.ssh-server-form {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 1rem;
  display: grid;
}

.ssh-server-form fieldset {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.ssh-job-list {
  gap: 1rem;
  min-width: 0;
  display: grid;
}

.ssh-job-list article {
  border-bottom: 1px solid var(--color-line);
  min-width: 0;
  padding: .75rem;
}

.ssh-job-list pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 28rem;
  overflow: auto;
}

.ssh-token {
  overflow-wrap: anywhere;
  -webkit-user-select: all;
  user-select: all;
  display: block;
}

/* [project]/libs/modules/auth/web/AuthPage.css [app-client] (css) */
.auth-page {
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  min-height: 100vh;
  padding: 0;
  display: grid;
  overflow-x: clip;
}

.auth-page__aside {
  justify-content: center;
  gap: var(--space-6);
  padding: clamp(var(--space-6), 5vw, var(--space-8));
  color: var(--color-on-accent);
  background: linear-gradient(165deg, #2b4c9f 0%, #3d66d0 45%, #253e7c 100%);
  background: linear-gradient(165deg, lab(33.5573% 11.3022 -49.5328) 0%, lab(44.8533% 13.5164 -60.1598) 45%, lab(26.9892% 7.73892 -38.9991) 100%);
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
}

.auth-page__brand-block {
  z-index: 1;
  position: relative;
}

.auth-page__brand {
  margin: 0 0 var(--space-3);
  font-family: var(--font-display);
  letter-spacing: -.03em;
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 800;
  line-height: var(--leading-tight);
}

.auth-page__tagline {
  max-width: 22rem;
  font-size: var(--text-lg);
  line-height: var(--leading-relaxed);
  opacity: .92;
  margin: 0;
}

.auth-page__features {
  z-index: 1;
  gap: var(--space-3);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  position: relative;
}

.auth-page__features li {
  align-items: center;
  gap: var(--space-3);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  display: flex;
}

.auth-page__features li:before {
  content: "";
  background: #ffffffd9;
  background: lab(100% 0 0 / .85);
  border-radius: 50%;
  flex-shrink: 0;
  width: .45rem;
  height: .45rem;
}

.auth-page__decor {
  aspect-ratio: 1;
  pointer-events: none;
  background: radial-gradient(circle, #ffffff24 0%, #0000 68%);
  background: radial-gradient(circle, lab(100% 0 0 / .14) 0%, #0000 68%);
  border-radius: 50%;
  width: min(420px, 70%);
  position: absolute;
  inset: auto -20% -25% auto;
}

.auth-page__main {
  padding: clamp(var(--space-5), 4vw, var(--space-8));
  place-items: center;
  display: grid;
}

.auth-card {
  width: min(100%, 400px);
  padding: var(--space-6);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-md);
  animation: auth-rise var(--duration-normal) var(--ease-out);
}

@keyframes auth-rise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-card {
    animation: none;
  }
}

.auth-card__header {
  text-align: center;
  margin-block-end: var(--space-5);
}

.auth-card__title {
  margin: 0 0 var(--space-2);
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: var(--color-ink);
  font-weight: 800;
}

.auth-card__subtitle {
  font-size: var(--text-sm);
  color: var(--color-muted);
  line-height: var(--leading-normal);
  margin: 0;
}

.auth-mode-toggle {
  gap: var(--space-1);
  padding: var(--space-1);
  border-radius: var(--radius-full);
  border: 1px solid var(--color-line);
  background: #202c260a;
  background: lab(16.7482% -6.6562 1.91945 / .04);
  grid-template-columns: 1fr 1fr;
  margin-block-end: var(--space-5);
  display: grid;
  position: relative;
}

.auth-mode-toggle__btn {
  z-index: 1;
  border-radius: var(--radius-full);
  min-height: 2.25rem;
  font: inherit;
  font-size: var(--text-sm);
  color: var(--color-ink-soft);
  cursor: pointer;
  transition: color var(--duration-fast) var(--ease-out);
  background: none;
  border: 0;
  font-weight: 600;
  position: relative;
}

.auth-mode-toggle__btn.is-active {
  color: var(--color-on-accent);
}

.auth-mode-toggle__indicator {
  inset-block: var(--space-1);
  width: calc(50% - var(--space-1));
  border-radius: var(--radius-full);
  background: var(--color-accent);
  box-shadow: var(--shadow-sm);
  transition: transform var(--duration-normal) var(--ease-out);
  position: absolute;
  inset-inline-start: var(--space-1);
}

.auth-mode-toggle__indicator[data-mode="register"] {
  transform: translateX(-100%);
}

.auth-form {
  gap: var(--space-4);
  display: grid;
}

.auth-form__error {
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: var(--color-danger-subtle);
  color: var(--color-danger);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  margin: 0;
}

.auth-form__submit {
  width: 100%;
  margin-block-start: var(--space-1);
}

.onboarding-modal {
  width: min(100%, 440px);
}

.onboarding-modal__body p {
  margin: 0 0 var(--space-4);
  color: var(--color-ink-soft);
  line-height: var(--leading-relaxed);
}

.onboarding-modal__tips {
  color: var(--color-muted);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
  margin: 0;
  padding-inline-start: var(--space-5);
}

.onboarding-modal__tips li + li {
  margin-block-start: var(--space-2);
}

@media (max-width: 860px) {
  .auth-page {
    grid-template-columns: 1fr;
  }

  .auth-page__aside {
    display: none;
  }

  .auth-page__main {
    align-content: center;
    min-height: 100vh;
  }
}

@media (max-width: 390px) {
  .auth-card {
    padding: var(--space-5);
    box-shadow: none;
    background: none;
    border: none;
  }
}

/* [project]/libs/modules/dashboard/src/App.css [app-client] (css) */
* {
  box-sizing: border-box;
}

html, body, #root {
  min-height: 100%;
}

body {
  color: var(--ink);
  font-family: var(--font-body);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

button, input, textarea {
  font: inherit;
}

.page {
  isolation: isolate;
  min-height: 100vh;
  padding: 2.5rem clamp(1.25rem, 4vw, 3rem) 3rem;
  position: relative;
  overflow-x: clip;
}

.layout {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 1.5rem;
  display: grid;
}

.list-panel {
  min-width: 0;
}

.atmosphere {
  z-index: -1;
  background: radial-gradient(50% 60% at 88% 20%, #0f766e38, #0000 70%), radial-gradient(40% 50% at 12% 8%, #d9770629, #0000 65%), linear-gradient(#e8efe9 0%, #0000 75%);
  height: 70vh;
  position: absolute;
  inset: -20% -10% auto;
}

.form-row {
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  display: grid;
}

.priority-badge {
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .72rem;
  font-weight: 700;
}

.priority-badge.p-low {
  color: var(--muted);
  background: #6b7c7424;
}

.priority-badge.p-high {
  color: #92500a;
  background: #d9770626;
}

.priority-badge.p-urgent {
  color: var(--stop);
  background: #b4231824;
}

.assignee-badge {
  color: var(--accent-deep);
  background: #0f766e1a;
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .72rem;
  font-weight: 600;
}

.due-badge {
  color: var(--ink-soft);
  border: 1px dashed #1a242140;
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .72rem;
}

.due-badge.is-overdue {
  color: var(--stop);
  background: #b4231814;
  border-color: #b4231880;
  font-weight: 700;
}

.my-tasks-toggle {
  margin-inline-start: auto;
}

.label-chip {
  color: #fff;
  text-shadow: 0 1px 2px #00000040;
  border-radius: 999px;
  padding: .15rem .6rem;
  font-size: .72rem;
  font-weight: 700;
}

.label-chip.pickable {
  cursor: pointer;
  opacity: .55;
  border: 2px solid #0000;
  transition: opacity .15s, border-color .15s;
}

.label-chip.pickable.is-selected {
  opacity: 1;
  border-color: #1a24218c;
}

.form-labels > span {
  color: var(--ink-soft);
  margin-bottom: .4rem;
  font-size: .85rem;
  display: block;
}

.label-picker {
  flex-wrap: wrap;
  gap: .4rem;
  display: flex;
}

.entry-form select {
  border: 1px solid var(--line);
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: #fff;
  border-radius: 12px;
  padding: .6rem .75rem;
}

.role-badge {
  color: var(--accent-deep);
  background: #0f766e1f;
  border-radius: 999px;
  margin-inline-start: .45rem;
  padding: .1rem .5rem;
  font-size: .72rem;
  font-weight: 700;
}

.muted {
  color: var(--muted);
}

.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: 1.35rem 1.35rem 1.5rem;
}

.panel-head {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.1rem;
  display: flex;
}

.panel-tools {
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem;
  display: flex;
}

.view-toggle {
  border: 1px solid var(--line);
  background: #ffffffb3;
  border-radius: 999px;
  padding: .2rem;
  display: inline-flex;
}

.view-btn {
  color: var(--ink-soft);
  background: none;
  border-radius: 999px;
  padding: .4rem .85rem;
  font-size: .88rem;
  font-weight: 600;
}

.view-btn.is-active {
  background: var(--accent);
  color: #fff;
}

.panel-head h2 {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  margin: 0;
  font-size: 1.2rem;
}

.entry-form {
  gap: var(--space-4);
  display: grid;
}

input:not(.ui-input):not(.ui-checkbox):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]), textarea:not(.ui-textarea), select:not(.ui-select) {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--color-surface-solid);
  width: 100%;
  color: var(--ink);
  padding-block: var(--space-3);
  padding-inline: var(--space-3);
  transition: border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
  outline: none;
}

input:not(.ui-input):not(.ui-checkbox):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]):focus, textarea:not(.ui-textarea):focus, select:not(.ui-select):focus {
  box-shadow: 0 0 0 3px var(--color-focus-ring);
  border-color: #007b668c;
  border-color: lab(45.6129% -35.2776 3.0459 / .55);
}

textarea:not(.ui-textarea) {
  resize: vertical;
  min-height: 6.5rem;
  line-height: var(--leading-relaxed);
}

.entry-form label:not(.ui-field) {
  gap: var(--space-2);
  display: grid;
}

.entry-form label:not(.ui-field) span {
  font-size: var(--text-sm);
  color: var(--muted);
  font-weight: 600;
}

.muted, .empty {
  color: var(--muted);
  margin: .5rem 0 0;
}

.title-block {
  justify-items: start;
  gap: .35rem;
  min-width: 0;
  display: grid;
}

.title-tags {
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  display: flex;
}

.file-badge {
  color: #9a3412;
  background: #d9770624;
  border-radius: 999px;
  padding: .12rem .45rem;
  font-size: .75rem;
  font-weight: 700;
  display: inline-block;
}

.files-field {
  gap: .65rem;
  display: grid;
}

.files-head {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.files-label {
  color: var(--muted);
  font-size: .8rem;
  font-weight: 600;
}

.files-count {
  color: var(--accent-deep);
  background: #0f766e1f;
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .78rem;
  font-weight: 700;
}

.file-dropzone {
  text-align: center;
  cursor: pointer;
  background: #0f766e0d;
  border: 2px dashed #0f766e59;
  border-radius: 14px;
  gap: .25rem;
  padding: 1rem;
  transition: border-color .15s, background .15s;
  display: grid;
  position: relative;
}

.file-dropzone:hover, .file-dropzone.is-dragover, .file-dropzone.has-files {
  background: #0f766e1a;
  border-color: #0f766ea6;
}

.file-input-hidden {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.dropzone-title {
  color: var(--accent-deep);
  margin: 0;
  font-weight: 700;
}

.dropzone-hint {
  color: var(--muted);
  margin: 0;
  font-size: .78rem;
}

.file-empty {
  color: var(--muted);
  text-align: center;
  background: #1a24210a;
  border-radius: 10px;
  margin: 0;
  padding: .55rem .65rem;
  font-size: .85rem;
}

.file-list.pending li {
  background: #d9770614;
  border-color: #d9770659;
}

.file-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  font-weight: 600;
  overflow: hidden;
}

.file-badge-new {
  color: #9a3412;
  background: #d977062e;
  border-radius: 999px;
  padding: .12rem .45rem;
  font-size: .72rem;
  font-weight: 700;
}

.upload-now-btn {
  width: 100%;
  margin-top: 0;
}

.file-list {
  gap: .4rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.file-list li {
  border: 1px solid var(--line);
  background: #ffffffd9;
  border-radius: 10px;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  padding: .45rem .55rem;
  font-size: .85rem;
  display: flex;
}

.file-list a {
  color: var(--accent-deep);
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  font-weight: 600;
  text-decoration: none;
  overflow: hidden;
}

.file-list a:hover {
  text-decoration: underline;
}

.file-size {
  color: var(--muted);
  white-space: nowrap;
  font-size: .78rem;
}

.cell-text {
  max-width: 100%;
  font-family: var(--font-display);
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
  display: block;
  overflow: hidden;
}

.desc-clamp {
  -webkit-line-clamp: 2;
  line-clamp: 2;
  color: var(--ink-soft);
  word-break: break-word;
  -webkit-box-orient: vertical;
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
}

.col-datetime .date-main {
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: .25rem;
  font-size: .85rem;
  display: block;
  overflow: hidden;
}

.col-datetime .timer-value {
  font-family: var(--font-display);
  color: var(--accent-deep);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  direction: ltr;
  unicode-bidi: isolate;
  font-size: 1.05rem;
  font-weight: 700;
  display: inline-block;
}

.col-status {
  overflow: visible;
}

.status-wrap {
  justify-content: center;
  align-items: center;
  gap: .35rem;
  display: inline-flex;
  position: relative;
}

.dash {
  color: var(--muted);
}

.project {
  max-width: 100%;
  color: var(--accent-deep);
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #0f766e1a;
  border-radius: 999px;
  padding: .12rem .5rem;
  font-size: .78rem;
  display: inline-block;
  overflow: hidden;
}

.status {
  white-space: nowrap;
  border-radius: 999px;
  padding: .2rem .55rem;
  font-size: .78rem;
  font-weight: 700;
  display: inline-block;
}

.status.running {
  color: var(--accent-deep);
  background: #0f766e24;
}

.status.idle {
  color: var(--muted);
  background: #1a24210f;
}

.sessions {
  display: inline-block;
  position: relative;
}

.session-badge {
  cursor: pointer;
  background: var(--accent);
  color: #fff;
  font-variant-numeric: tabular-nums;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  min-width: 1.45rem;
  height: 1.45rem;
  padding: 0 .4rem;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1;
  list-style: none;
  display: inline-flex;
}

.session-badge::-webkit-details-marker {
  display: none;
}

.sessions[open] .session-badge {
  background: var(--accent-deep);
}

.sessions ul {
  inset-inline-start: 50%;
  z-index: 30;
  border: 1px solid var(--line);
  min-width: 280px;
  box-shadow: var(--shadow);
  text-align: start;
  background: #fff;
  border-radius: 12px;
  gap: .45rem;
  margin: 0;
  padding: .65rem .75rem;
  list-style: none;
  display: grid;
  position: absolute;
  top: calc(100% + .45rem);
  translate: -50%;
}

.sessions li {
  color: var(--muted);
  justify-content: space-between;
  gap: .75rem;
  font-size: .82rem;
  display: flex;
}

.sessions li strong {
  color: var(--accent-deep);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  direction: ltr;
  unicode-bidi: isolate;
}

.modal-backdrop {
  z-index: 100;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background: #1a242173;
  place-items: center;
  padding: 1.25rem;
  display: grid;
  position: fixed;
  inset: 0;
}

.modal {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 18px;
  width: min(100%, 480px);
  max-height: min(92vh, 760px);
  padding: 1.25rem 1.25rem 1.4rem;
  overflow-y: auto;
  box-shadow: 0 24px 60px #1a24212e;
}

.modal.task-modal {
  background: linear-gradient(145deg, #fff 0%, #fbfcff 100%);
  width: min(100%, 1080px);
  padding: 1.5rem;
}

.task-modal__header {
  align-items: flex-start;
  margin-bottom: 1.25rem;
}

.task-modal__header h2 {
  color: #18284c;
  margin: 0;
  font-size: 1.7rem;
}

.task-modal__header p, .task-form-section__header p {
  color: #71809a;
  margin: .35rem 0 0;
  font-size: .88rem;
}

.task-modal .entry-form {
  gap: 1rem;
}

.task-form-section {
  background: linear-gradient(135deg, #f7faffeb, #ffffffeb);
  border: 1px solid #dfe6f1;
  border-radius: 1rem;
  gap: 1rem;
  padding: 1.15rem;
  display: grid;
}

.task-form-section__header {
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  display: flex;
}

.task-form-section__header h3 {
  color: #1b2b4e;
  margin: 0;
  font-size: 1.03rem;
}

.task-form-section__header h3 small {
  color: #52627d;
  font-weight: 600;
}

.task-form-section__header > span {
  color: #1464e8;
  background: #eaf1ff;
  border-radius: .65rem;
  place-items: center;
  width: 2rem;
  height: 2rem;
  font-size: 1.35rem;
  display: grid;
}

.task-form-section em {
  color: #e44d5d;
  font-style: normal;
}

.task-main-fields {
  grid-template-columns: minmax(10rem, 1fr) minmax(10rem, 1fr) minmax(14rem, 1.25fr);
  align-items: end;
  gap: .9rem;
  display: grid;
}

.task-priority {
  border: 0;
  grid-template-columns: repeat(4, 1fr);
  gap: .35rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  display: grid;
}

.task-priority legend {
  color: var(--muted);
  font-size: var(--text-sm);
  grid-column: 1 / -1;
  margin-bottom: .45rem;
  padding: 0;
  font-weight: 600;
}

.task-priority label {
  color: #54627b;
  cursor: pointer;
  background: #edf1f6;
  border: 1px solid #0000;
  border-radius: .8rem;
  place-items: center;
  min-height: 2.8rem;
  padding: .4rem;
  font-size: .82rem;
  font-weight: 700;
  display: grid;
}

.task-priority label.is-active {
  color: #1260d7;
  background: #dce9ff;
  border-color: #b8d2ff;
}

.task-priority input, .task-okr-toggle > input {
  opacity: 0;
  pointer-events: none;
  position: absolute;
}

.task-okr-section {
  gap: .85rem;
}

.task-okr-toggle {
  cursor: pointer;
  align-items: center;
  gap: .7rem;
  width: fit-content;
  display: flex !important;
}

.task-okr-toggle__track {
  background: #cbd4e2;
  border-radius: 999px;
  align-items: center;
  width: 3rem;
  height: 1.75rem;
  padding: .18rem;
  transition: background .18s;
  display: inline-flex;
}

.task-okr-toggle__track > span {
  background: #fff;
  border-radius: 50%;
  width: 1.38rem;
  height: 1.38rem;
  transition: transform .18s;
  box-shadow: 0 1px 3px #11264938;
}

.task-okr-toggle > input:checked + .task-okr-toggle__track {
  background: #1769ee;
}

.task-okr-toggle > input:checked + .task-okr-toggle__track > span {
  transform: translateX(-1.25rem);
}

.task-okr-toggle b, .task-okr-toggle small {
  display: block;
}

.task-okr-toggle small {
  color: #71809a;
  margin-top: .15rem;
  font-size: .76rem;
  font-weight: 400;
}

.task-okr-fields {
  border-top: 1px solid #e5ebf5;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .9rem;
  padding-top: .9rem;
  display: grid;
}

.task-schedule-fields {
  grid-template-columns: 1fr 1fr;
  align-items: end;
  gap: .9rem;
  display: grid;
}

.task-schedule-fields .estimate-row {
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
  display: grid;
}

.task-schedule-fields .estimate-label {
  grid-column: 1 / -1;
}

.modal-actions {
  justify-content: flex-end;
  gap: .5rem;
  margin-top: .35rem;
  display: flex;
}

.checklist-section {
  background: #ffffff8c;
  border: 1px solid #1a24211a;
  border-radius: 12px;
  margin: .25rem 0 .75rem;
  padding: .75rem;
}

.deps-section {
  background: #ffffff8c;
  border: 1px solid #1a24211a;
  border-radius: 12px;
  gap: .55rem;
  margin: .25rem 0 .75rem;
  padding: .75rem;
  display: grid;
}

.deps-section h3, .deps-blocks h4 {
  margin: 0;
  font-size: .9rem;
}

.deps-hint {
  margin: 0;
  font-size: .82rem;
}

.deps-list {
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.deps-list li {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: .45rem .6rem;
  display: flex;
}

.deps-list li > div {
  gap: .1rem;
  min-width: 0;
  display: grid;
}

.deps-status {
  color: var(--stop);
  font-size: .75rem;
}

.deps-status.is-done {
  color: var(--accent-deep, #3746a4);
}

.deps-add-form {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.deps-add-form select {
  border: 1px solid var(--line);
  min-width: 160px;
  font: inherit;
  background: #fff;
  border-radius: 10px;
  flex: 1;
  padding: .5rem .65rem;
}

.blocked-badge {
  color: #9a3412;
  background: #ea580c1f;
  border-radius: 6px;
  padding: .15rem .45rem;
  font-size: .72rem;
  font-weight: 700;
  display: inline-block;
}

.checklist-head {
  color: var(--ink-soft);
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-bottom: .5rem;
  font-size: .85rem;
  font-weight: 600;
  display: flex;
}

.checklist-hint {
  margin: .25rem 0 .75rem;
  font-size: .85rem;
}

.checklist-progress {
  background: #1a242114;
  border-radius: 999px;
  height: 6px;
  margin-bottom: .65rem;
  overflow: hidden;
}

.checklist-progress-bar {
  background: var(--accent, #4258c9);
  border-radius: inherit;
  height: 100%;
  transition: width .2s;
}

.checklist-list {
  flex-direction: column;
  gap: .35rem;
  margin: 0 0 .65rem;
  padding: 0;
  list-style: none;
  display: flex;
}

.checklist-list li {
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: .35rem .45rem;
  display: flex;
}

.checklist-list li.is-done .checklist-item span {
  color: var(--muted);
  text-decoration: line-through;
}

.checklist-item {
  cursor: pointer;
  flex: 1;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  display: flex;
}

.checklist-item span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.checklist-item-actions {
  flex-shrink: 0;
  gap: .15rem;
  display: flex;
}

.checklist-add {
  gap: .5rem;
  display: flex;
}

.checklist-add input {
  flex: 1;
}

.checklist-badge {
  color: var(--accent-deep, #3746a4);
  font-variant-numeric: tabular-nums;
  background: #0f766e1f;
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .72rem;
  font-weight: 700;
}

.visually-hidden {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.discussion-section {
  background: #ffffff8c;
  border: 1px solid #1a24211a;
  border-radius: 12px;
  margin: .5rem 0 .85rem;
  padding: .75rem;
}

.discussion-tabs {
  gap: .35rem;
  margin-bottom: .75rem;
  display: flex;
}

.discussion-tabs button {
  cursor: pointer;
  color: var(--ink-soft);
  background: none;
  border: 1px solid #1a24211f;
  border-radius: 999px;
  padding: .35rem .75rem;
  font-size: .85rem;
}

.discussion-tabs button.is-active {
  background: var(--accent, #4258c9);
  color: #fff;
  border-color: #0000;
  font-weight: 700;
}

.comments-list, .activity-list {
  flex-direction: column;
  gap: .65rem;
  max-height: 220px;
  margin: 0 0 .75rem;
  padding: 0;
  list-style: none;
  display: flex;
  overflow-y: auto;
}

.comment-meta {
  color: var(--muted);
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .2rem;
  font-size: .78rem;
  display: flex;
}

.comment-body {
  white-space: pre-wrap;
  margin: 0;
  font-size: .92rem;
}

.comment-form {
  flex-direction: column;
  gap: .5rem;
  display: flex;
}

.activity-list li {
  align-items: flex-start;
  gap: .65rem;
  display: flex;
}

.activity-dot {
  background: var(--accent, #4258c9);
  border-radius: 50%;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  margin-top: .45rem;
}

.activity-content p {
  margin: 0 0 .15rem;
  font-size: .88rem;
}

.activity-content time {
  color: var(--muted);
  font-size: .75rem;
}

.estimate-badge {
  color: var(--ink-soft);
  background: #1a242114;
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .72rem;
  font-weight: 600;
}

.estimate-row {
  align-items: end;
}

.estimate-label {
  color: var(--ink-soft);
  flex: 100%;
  font-size: .85rem;
}

.estimate-row label {
  flex: 1;
}

@media (max-width: 820px) {
  .task-main-fields, .task-okr-fields, .task-schedule-fields {
    grid-template-columns: 1fr;
  }

  .task-priority {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* [project]/libs/modules/integrations/src/IntegrationsPanel.css [app-client] (css) */
.integrations-panel {
  gap: 1rem;
  display: grid;
}

.integrations-panel__docs {
  background: #f0fdfabf;
  border: 1px solid #0f766e38;
  border-radius: 12px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .65rem;
  padding: .75rem .85rem;
  display: flex;
}

.integrations-panel__docs p {
  color: var(--ink-soft);
  margin: 0;
  font-size: .84rem;
  line-height: 1.45;
}

.integrations-panel__docs a {
  color: var(--accent-deep);
  font-weight: 700;
  text-decoration: none;
}

.integrations-panel__docs a:hover {
  text-decoration: underline;
}

.integrations-panel__readonly {
  border: 1px dashed var(--line);
  color: var(--muted);
  background: #ffffff8c;
  border-radius: 10px;
  padding: .65rem .75rem;
  font-size: .84rem;
}

.integrations-section {
  gap: .65rem;
  display: grid;
}

.integrations-section__title {
  margin: 0;
  font-size: .95rem;
  font-weight: 700;
}

.integrations-list {
  gap: .45rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.integrations-list__item {
  border: 1px solid var(--line);
  background: #ffffffc7;
  border-radius: 12px;
  justify-content: space-between;
  align-items: flex-start;
  gap: .65rem;
  padding: .65rem .75rem;
  display: flex;
}

.integrations-list__main {
  gap: .2rem;
  min-width: 0;
  display: grid;
}

.integrations-list__main strong {
  font-size: .9rem;
}

.integrations-list__meta {
  color: var(--muted);
  word-break: break-word;
  font-size: .76rem;
}

.integrations-list__prefix {
  align-items: center;
  gap: .35rem;
  margin-top: .15rem;
  display: inline-flex;
}

.integrations-list__prefix code {
  direction: ltr;
  background: #1a24210f;
  border-radius: 8px;
  padding: .15rem .45rem;
  font-size: .78rem;
}

.integrations-list__actions {
  flex-shrink: 0;
  align-items: center;
  gap: .25rem;
  display: flex;
}

.integrations-empty {
  text-align: center;
  border: 1px dashed var(--line);
  color: var(--muted);
  border-radius: 12px;
  margin: 0;
  padding: .85rem;
  font-size: .84rem;
}

.integrations-form {
  flex-wrap: wrap;
  align-items: end;
  gap: .45rem;
  display: flex;
}

.integrations-form .ui-field {
  flex: 1;
  min-width: 10rem;
}

.integrations-secret {
  background: linear-gradient(#fffbeb 0%, #fef3c7 100%);
  border: 1px solid #f59e0b73;
  border-radius: 12px;
  gap: .55rem;
  padding: .85rem;
  display: grid;
}

.integrations-secret__head {
  align-items: center;
  gap: .45rem;
  display: flex;
}

.integrations-secret__head strong {
  color: #92400e;
  font-size: .92rem;
}

.integrations-secret__value {
  align-items: stretch;
  gap: .45rem;
  display: flex;
}

.integrations-secret__value code {
  word-break: break-all;
  text-align: left;
  direction: ltr;
  background: #fff;
  border: 1px solid #f59e0b59;
  border-radius: 10px;
  flex: 1;
  padding: .55rem .65rem;
  font-size: .82rem;
}

.integrations-secret__hint {
  color: #92400e;
  margin: 0;
  font-size: .8rem;
  line-height: 1.45;
}

.integrations-webhook-wizard {
  border: 1px solid var(--line);
  background: #ffffffb8;
  border-radius: 12px;
  gap: .75rem;
  padding: .85rem;
  display: grid;
}

.integrations-webhook-wizard__steps {
  gap: .35rem;
  display: flex;
}

.integrations-webhook-wizard__step {
  text-align: center;
  color: var(--muted);
  flex: 1;
  gap: .2rem;
  font-size: .72rem;
  display: grid;
}

.integrations-webhook-wizard__step-dot {
  background: #1a24211f;
  border-radius: 999px;
  height: .28rem;
}

.integrations-webhook-wizard__step.is-active {
  color: var(--accent-deep);
  font-weight: 700;
}

.integrations-webhook-wizard__step.is-active .integrations-webhook-wizard__step-dot, .integrations-webhook-wizard__step.is-done .integrations-webhook-wizard__step-dot {
  background: var(--accent);
}

.integrations-webhook-wizard__body {
  gap: .65rem;
  display: grid;
}

.integrations-webhook-wizard__actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .45rem;
  display: flex;
}

.integrations-events {
  gap: .45rem;
  display: grid;
}

.integrations-events__item {
  border: 1px solid var(--line);
  cursor: pointer;
  background: #ffffffd9;
  border-radius: 10px;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: .55rem;
  padding: .55rem .65rem;
  display: grid;
}

.integrations-events__item:has(input:checked) {
  background: #f0fdfad9;
  border-color: #0f766e47;
}

.integrations-events__item input {
  margin-top: .15rem;
}

.integrations-events__label {
  color: var(--ink-soft);
  font-size: .86rem;
  font-weight: 700;
}

.integrations-events__hint {
  color: var(--muted);
  margin-top: .1rem;
  font-size: .76rem;
  font-weight: 400;
  line-height: 1.4;
  display: block;
}

.integrations-webhook-summary {
  background: #0f766e0f;
  border-radius: 10px;
  gap: .35rem;
  padding: .65rem .75rem;
  font-size: .84rem;
  display: grid;
}

.integrations-webhook-summary dt {
  color: var(--muted);
  font-size: .74rem;
}

.integrations-webhook-summary dd {
  word-break: break-word;
  margin: 0 0 .35rem;
}

.integrations-skeleton {
  gap: .45rem;
  display: grid;
}

.integrations-skeleton__row {
  background: linear-gradient(110deg, #1a24210f 30%, #1a24211a 50%, #1a24210f 70%) 0 0 / 200% 100%;
  border-radius: 12px;
  height: 3.5rem;
  animation: 1.2s ease-in-out infinite integrations-shimmer;
}

@keyframes integrations-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .integrations-skeleton__row {
    animation: none;
  }
}

.mcp-panel {
  border: 1px solid var(--line);
  background: var(--color-surface-solid, #fff);
  border-radius: 16px;
  gap: 1.25rem;
  min-width: 0;
  padding: 1.25rem;
  display: grid;
}

.mcp-panel__header, .mcp-panel__subheading, .mcp-token__heading {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .65rem;
  min-width: 0;
  display: flex;
}

.mcp-panel__header {
  align-items: flex-start;
}

.mcp-panel__header > div {
  flex: 1;
  min-width: 0;
}

.mcp-panel h4, .mcp-panel h5 {
  color: var(--ink);
  margin: 0;
}

.mcp-panel h4 {
  font-size: 1rem;
}

.mcp-panel h5 {
  font-size: .88rem;
}

.mcp-panel__header p, .mcp-panel__hint {
  color: var(--muted);
  margin: .4rem 0 0;
  font-size: .8rem;
  line-height: 1.9;
}

.mcp-panel__subheading > span {
  color: var(--muted);
  font-size: .75rem;
}

.mcp-panel__actions {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.mcp-connection {
  border: 1px solid var(--line);
  background: var(--color-paper, #f8faf9);
  border-radius: 10px;
  min-width: 0;
  font-size: .8rem;
}

.mcp-connection summary {
  cursor: pointer;
  color: var(--ink-soft);
  padding: .8rem 1rem;
  font-weight: 600;
}

.mcp-connection summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 10px;
}

.mcp-connection__body {
  color: var(--muted);
  gap: .65rem;
  padding: 0 1rem 1rem;
  display: grid;
}

.mcp-connection__endpoint {
  align-items: center;
  gap: .5rem;
  min-width: 0;
  display: flex;
}

.mcp-connection__endpoint > code {
  flex: 1;
  min-width: 0;
}

.mcp-connection__endpoint > button {
  flex-shrink: 0;
}

.mcp-connection code {
  overflow-wrap: anywhere;
  text-align: left;
  color: var(--ink-soft);
  font-size: .76rem;
  line-height: 1.7;
  display: block;
}

.mcp-panel .integrations-secret, .mcp-panel .integrations-secret__value, .mcp-panel .integrations-secret__value code {
  min-width: 0;
}

.mcp-token {
  flex-wrap: wrap;
  gap: .85rem;
  padding: 1rem;
}

.mcp-token--editing {
  border-color: var(--accent);
}

.mcp-token .integrations-list__main {
  flex: 15rem;
  gap: .4rem;
}

.mcp-token .integrations-list__actions {
  margin-inline-start: auto;
}

.mcp-token__heading {
  justify-content: flex-start;
}

.mcp-token__heading strong {
  overflow-wrap: anywhere;
}

.mcp-token__prefix {
  width: fit-content;
  color: var(--muted);
  font-size: .75rem;
}

.mcp-token__grants {
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .25rem;
  display: flex;
}

.mcp-token__grant {
  background: var(--color-paper, #f8faf9);
  border: 1px solid var(--line);
  color: var(--ink-soft);
  overflow-wrap: anywhere;
  border-radius: 6px;
  padding: .2rem .5rem;
  font-size: .72rem;
}

.mcp-form {
  border-top: 1px solid var(--line);
  gap: 1.15rem;
  min-width: 0;
  padding-top: 1.25rem;
  display: grid;
}

.mcp-form__fields {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: 1rem;
  display: grid;
}

.mcp-form__fields > .ui-field {
  min-width: 0;
}

.mcp-form__fields input {
  width: 100%;
  min-width: 0;
}

.mcp-form__permissions {
  gap: .75rem;
  min-width: 0;
  display: grid;
}

.mcp-form__permissions > .mcp-panel__hint {
  margin: 0;
}

.mcp-workspace {
  border: 1px solid var(--line);
  border-radius: 12px;
  min-inline-size: 0;
  margin: 0;
  padding: .4rem .85rem .6rem;
}

.mcp-workspace legend {
  color: var(--ink-soft);
  overflow-wrap: anywhere;
  max-width: 100%;
  padding: 0 .4rem;
  font-size: .82rem;
  font-weight: 700;
}

.mcp-project {
  grid-template-columns: minmax(0, 1fr) minmax(10rem, 12rem);
  align-items: center;
  gap: .75rem;
  padding: .7rem .3rem;
  display: grid;
}

.mcp-project + .mcp-project {
  border-top: 1px solid var(--line);
}

.mcp-project > span {
  overflow-wrap: anywhere;
  min-width: 0;
  font-size: .83rem;
  line-height: 1.7;
}

.mcp-project > select {
  width: 100%;
  min-width: 0;
  font-size: .78rem;
}

.mcp-project--selected > span {
  color: var(--accent-deep);
  font-weight: 600;
}

.mcp-form__footer {
  border-top: 1px solid var(--line);
  gap: .85rem;
  padding-top: .85rem;
  display: grid;
}

.mcp-form__footer .mcp-panel__actions {
  justify-content: flex-end;
}

.mcp-form__footer .mcp-panel__hint {
  margin: 0;
}

@media (max-width: 520px) {
  .mcp-panel {
    gap: 1rem;
    padding: .85rem;
  }

  .mcp-project {
    grid-template-columns: minmax(0, 1fr);
    gap: .4rem;
  }

  .mcp-workspace {
    padding-inline: .6rem;
  }

  .mcp-connection__endpoint {
    flex-direction: column;
    align-items: flex-start;
  }

  .mcp-form__footer .mcp-panel__actions > button {
    flex: 1;
  }
}

.integrations-tabs {
  border: 1px solid var(--line);
  background: var(--color-paper, #f8faf9);
  border-radius: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .3rem;
  padding: .3rem;
  display: grid;
}

.integrations-tabs__tab {
  min-width: 0;
  min-height: 2.65rem;
  color: var(--muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 9px;
  padding: .55rem .75rem;
  font-size: .85rem;
  font-weight: 600;
}

.integrations-tabs__tab:hover {
  color: var(--accent-deep);
}

.integrations-tabs__tab[aria-selected="true"] {
  border-color: var(--line);
  background: var(--color-surface-solid, #fff);
  color: var(--accent-deep);
  box-shadow: 0 1px 3px #1a24210f;
}

.integrations-tabs__tab:focus-visible, .integrations-tabpanel:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.integrations-tabpanel {
  min-width: 0;
}

.integrations-panel [hidden] {
  display: none;
}

.integration-guide {
  border: 1px solid var(--line);
  background: var(--color-surface-solid, #fff);
  border-radius: 12px;
  min-width: 0;
}

.integration-guide summary {
  color: var(--accent-deep);
  cursor: pointer;
  padding: .85rem 1rem;
  font-size: .85rem;
  font-weight: 700;
}

.integration-guide summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 12px;
}

.integration-guide__body {
  min-width: 0;
  color: var(--ink-soft);
  gap: .8rem;
  padding: 0 1rem 1rem;
  font-size: .82rem;
  line-height: 1.9;
  display: grid;
}

.integration-guide__body h5 {
  margin: .5rem 0 0;
  font-size: .86rem;
}

.integration-guide__body p, .integration-guide__body ul {
  margin: 0;
}

.integration-guide__body pre {
  border: 1px solid var(--line);
  background: var(--color-paper, #f8faf9);
  text-align: left;
  border-radius: 8px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: .85rem;
  font-size: .75rem;
  line-height: 1.8;
  overflow-x: auto;
}

.integration-guide__table {
  min-width: 0;
  overflow-x: auto;
}

.integration-guide table {
  border-collapse: collapse;
  text-align: start;
  width: 100%;
  font-size: .78rem;
}

.integration-guide th, .integration-guide td {
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
  text-align: start;
  padding: .6rem;
}

.integration-guide td code[dir="ltr"] {
  display: inline-block;
}

.oauth-consent {
  width: min(100%, 46rem);
  margin: 3rem auto;
  padding: 0 1rem;
}

.oauth-consent h1 {
  margin: 0;
  font-size: 1.25rem;
}

.oauth-consent h2 {
  margin: 0;
  font-size: .95rem;
}

.oauth-consent__client {
  border: 1px solid var(--line);
  background: var(--color-paper, #f8faf9);
  overflow-wrap: anywhere;
  border-radius: 10px;
  padding: 1rem;
}

.oauth-consent__client p {
  color: var(--muted);
  margin: .5rem 0 0;
  font-size: .85rem;
  line-height: 1.8;
}

.gitea-panel {
  gap: 1rem;
  min-width: 0;
  display: grid;
}

.gitea-panel p {
  margin: 0;
  line-height: 1.8;
}

.gitea-panel label {
  gap: .4rem;
  display: grid;
}

.gitea-panel select, .gitea-panel textarea {
  border: 1px solid var(--line, #d4d4d4);
  background: var(--surface, #fff);
  width: 100%;
  color: inherit;
  font: inherit;
  border-radius: 8px;
  padding: .65rem;
}

.gitea-panel textarea {
  resize: vertical;
  min-height: 100px;
}

.gitea-form {
  gap: .75rem;
  padding-block: 1rem;
  display: grid;
}

.gitea-toolbar {
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem;
  display: flex;
}

.gitea-list {
  gap: .5rem;
  padding: 0;
  list-style: none;
  display: grid;
}

.gitea-list button {
  text-align: start;
  border: 1px solid var(--line, #ddd);
  width: 100%;
  color: inherit;
  cursor: pointer;
  background: none;
  border-radius: 10px;
  padding: .85rem;
  display: block;
}

.gitea-list button[aria-pressed="true"] {
  background: #0f766e14;
  border-color: #0f766e;
}

.gitea-list small {
  opacity: .7;
  margin-top: .5rem;
  display: block;
}

.gitea-detail {
  border-top: 1px solid var(--line, #ddd);
  gap: 1rem;
  min-width: 0;
  padding-top: 1rem;
  display: grid;
}

.gitea-detail pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: inherit;
  margin: 0;
}

.gitea-detail code {
  overflow-wrap: anywhere;
}

.gitea-detail article {
  border: 1px solid var(--line, #ddd);
  border-radius: 8px;
  padding: .75rem;
}

.gitea-error {
  color: #b91c1c;
}

/* [project]/libs/modules/notifications/src/NotificationsBell.css [app-client] (css) */
.notif-bell, .notif-bell__btn {
  position: relative;
}

.notif-bell__icon {
  color: var(--ink-soft);
  display: flex;
}

.notif-bell__badge {
  top: -.15rem;
  background: var(--stop);
  color: #fff;
  text-align: center;
  border-radius: 999px;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 .25rem;
  font-size: .65rem;
  font-weight: 700;
  line-height: 1.1rem;
  position: absolute;
  inset-inline-start: -.15rem;
}

.notif-panel {
  top: calc(100% + .4rem);
  width: min(380px, 100vw - 2rem);
  max-height: min(440px, 70vh);
  z-index: var(--z-dropdown);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
  background: #fff;
  border-radius: 14px;
  flex-direction: column;
  display: flex;
  position: absolute;
  inset-inline-end: 0;
  overflow: hidden;
}

.notif-panel__head {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: .75rem .85rem;
  display: flex;
}

.notif-panel__head strong {
  font-size: .92rem;
}

.notif-panel__body {
  padding: .55rem;
  overflow-y: auto;
}

.notif-panel__error {
  background: #fee2e28c;
  border-radius: 10px;
  margin: .35rem .55rem;
  padding: .55rem .65rem;
  font-size: .82rem;
}

.notif-empty {
  text-align: center;
  color: var(--muted);
  gap: .35rem;
  padding: 1.75rem 1rem;
  display: grid;
}

.notif-empty strong {
  color: var(--ink-soft);
  font-size: .92rem;
}

.notif-empty p {
  margin: 0;
  font-size: .82rem;
}

.notif-skeleton {
  gap: .45rem;
  padding: .35rem;
  display: grid;
}

.notif-skeleton__row {
  background: linear-gradient(110deg, #1a24210f 30%, #1a24211a 50%, #1a24210f 70%) 0 0 / 200% 100%;
  border-radius: 10px;
  height: 3.25rem;
  animation: 1.2s ease-in-out infinite notif-shimmer;
}

@keyframes notif-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.notif-list {
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.notif-item {
  text-align: start;
  width: 100%;
  font: inherit;
  color: inherit;
  cursor: pointer;
  background: #0f766e0a;
  border: 1px solid #0000;
  border-radius: 10px;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: .55rem;
  padding: .65rem .7rem;
  transition: background .12s, border-color .12s;
  display: grid;
}

.notif-item:hover {
  border-color: var(--line);
  background: #0f766e14;
}

.notif-item.is-unread {
  background: #0f766e1a;
  border-color: #0f766e2e;
}

.notif-item__icon {
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
}

.notif-item__icon.is-task_assigned {
  color: #2563eb;
  background: #3b82f61f;
}

.notif-item__icon.is-comment_on_task {
  color: var(--accent-deep);
  background: #0f766e1f;
}

.notif-item__icon.is-due_soon {
  color: #d97706;
  background: #f59e0b24;
}

.notif-item__icon.is-mention {
  color: #9333ea;
  background: #a855f71f;
}

.notif-item__content {
  gap: .15rem;
  min-width: 0;
  display: grid;
}

.notif-item__msg {
  font-size: .86rem;
  line-height: 1.45;
}

.notif-item__meta {
  color: var(--muted);
  font-size: .74rem;
}

@media (prefers-reduced-motion: reduce) {
  .notif-skeleton__row {
    animation: none;
  }
}

/* [project]/libs/modules/projects/src/ProjectTabs.css [app-client] (css) */
.project-tabs-wrap {
  margin-bottom: .85rem;
  position: relative;
}

.project-tabs-wrap:before, .project-tabs-wrap:after {
  content: "";
  pointer-events: none;
  z-index: 0;
  width: 1.75rem;
  position: absolute;
  top: 0;
  bottom: 0;
}

.project-tabs-wrap:before {
  background: linear-gradient(to left, transparent, var(--paper, #e8efe9));
  inset-inline-start: 0;
}

.project-tabs-wrap:after {
  background: linear-gradient(to right, transparent, var(--paper, #e8efe9));
  inset-inline-end: 0;
}

.project-tabs {
  z-index: 1;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  gap: .4rem;
  padding-bottom: .25rem;
  display: flex;
  position: relative;
  overflow-x: auto;
}

.project-tab {
  scroll-snap-align: start;
  border: 1px solid var(--line);
  color: var(--ink-soft);
  cursor: pointer;
  background: #ffffffc7;
  border-radius: 999px;
  flex-shrink: 0;
  align-items: center;
  gap: .4rem;
  padding: .45rem .85rem;
  font-size: .88rem;
  font-weight: 600;
  transition: background .12s, border-color .12s, color .12s;
  display: inline-flex;
}

.project-tab:hover {
  color: var(--accent-deep);
  background: #0f766e14;
}

.project-tab.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.project-tab__count {
  font-variant-numeric: tabular-nums;
  min-width: 1.35rem;
  height: 1.35rem;
  color: inherit;
  background: #1a242114;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 .35rem;
  font-size: .72rem;
  font-weight: 700;
  display: inline-flex;
}

.project-tab.is-active .project-tab__count {
  background: #ffffff38;
}

.project-tab--mine {
  margin-inline-start: .15rem;
}

@media (max-width: 720px) {
  .project-tabs-wrap:before, .project-tabs-wrap:after {
    width: 1.25rem;
  }
}

/* [project]/libs/modules/projects/src/ProjectsModal.css [app-client] (css) */
.modal.projects-modal {
  flex-direction: column;
  width: min(96vw, 1080px);
  max-width: none;
  max-height: min(92vh, 900px);
  display: flex;
  overflow: hidden;
}

.projects-modal__body {
  flex: 1;
  grid-template-columns: 11.5rem minmax(0, 1fr);
  gap: 0;
  min-height: 0;
  display: grid;
}

.projects-modal__nav {
  border-inline-end: 1px solid var(--line);
  background: #ffffff73;
  flex-direction: column;
  gap: .35rem;
  padding: .75rem;
  display: flex;
}

.projects-modal__nav-btn {
  width: 100%;
  color: var(--ink-soft);
  font: inherit;
  text-align: start;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 10px;
  align-items: center;
  gap: .45rem;
  padding: .55rem .65rem;
  font-size: .84rem;
  font-weight: 600;
  transition: background .12s, color .12s;
  display: flex;
}

.projects-modal__nav-btn:hover {
  color: var(--accent-deep);
  background: #0f766e14;
}

.projects-modal__nav-btn.is-active {
  color: var(--accent-deep);
  background: #0f766e1f;
  border-color: #0f766e38;
}

.projects-modal__nav-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.projects-modal__project-picker {
  border-top: 1px solid var(--line);
  margin-top: auto;
  padding-top: .65rem;
}

.projects-modal__project-picker .ui-field__label {
  font-size: .72rem;
}

.projects-modal__main {
  min-width: 0;
  padding: .85rem 1rem 1rem;
  overflow-y: auto;
}

.projects-modal__section-title {
  margin: 0 0 .75rem;
  font-size: 1rem;
  font-weight: 700;
}

.projects-create {
  gap: .5rem;
  margin-bottom: 1rem;
  display: flex;
}

.projects-create .ui-input {
  flex: 1;
}

.projects-empty {
  text-align: center;
  border: 1px dashed var(--line);
  color: var(--muted);
  background: #ffffff8c;
  border-radius: 14px;
  margin-bottom: 1rem;
  padding: 1.25rem 1rem;
}

.projects-empty strong {
  color: var(--ink-soft);
  margin-bottom: .35rem;
  display: block;
}

.projects-empty p {
  margin: 0;
  font-size: .85rem;
}

.projects-cards {
  grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
  gap: 1rem;
  display: grid;
}

.projects-card {
  border: 1px solid var(--line);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-sm);
  border-radius: 12px;
  gap: .8rem;
  padding: 1rem;
  transition: border-color .12s, box-shadow .12s;
  display: grid;
  position: relative;
}

.projects-card.is-selected {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-subtle), var(--shadow-sm);
}

.projects-card.is-archived {
  opacity: .72;
}

.projects-card__head {
  justify-content: space-between;
  align-items: flex-start;
  gap: .5rem;
  display: flex;
}

.projects-card__head strong {
  font-size: .95rem;
}

.projects-card__identity {
  align-items: center;
  gap: .7rem;
  min-width: 0;
  display: flex;
}

.projects-card__link {
  color: inherit;
  gap: .8rem;
  text-decoration: none;
  display: grid;
}

.projects-card__link:hover .projects-card__cover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.projects-card__cover {
  background: linear-gradient(145deg, var(--color-accent), var(--color-accent-deep));
  height: 2.8rem;
  color: var(--color-on-accent);
  letter-spacing: .04em;
  border-radius: .8rem;
  flex: 0 0 2.8rem;
  place-items: center;
  font-size: .8rem;
  font-weight: 800;
  display: grid;
}

.projects-card__progress {
  gap: .45rem;
  display: grid;
}

.projects-card__progress-head {
  color: var(--color-muted);
  justify-content: space-between;
  font-size: .72rem;
  font-weight: 700;
  display: flex;
}

.projects-card__chart {
  background: var(--color-accent-subtle);
  border-radius: .45rem;
  height: 2.5rem;
  overflow: hidden;
}

.projects-card__chart svg {
  width: 100%;
  height: 100%;
  display: block;
}

.projects-card__progress-track {
  background: var(--color-line);
  border-radius: 99px;
  height: .35rem;
  overflow: hidden;
}

.projects-card__progress-track span {
  border-radius: inherit;
  background: var(--color-accent);
  height: 100%;
  transition: width .4s;
  display: block;
}

.projects-card {
  background: #ffffffeb;
  border: 0;
  border-radius: 1rem;
  gap: .7rem;
  min-height: 20rem;
  padding: 1.25rem;
  box-shadow: 0 10px 28px #23447514;
}

.projects-card__link {
  gap: .7rem;
  height: 100%;
}

.projects-card__identity {
  text-align: right;
  flex-direction: row-reverse;
  justify-content: flex-start;
}

.projects-card__cover {
  border-radius: .75rem;
  flex-basis: 2.75rem;
  height: 2.75rem;
}

.projects-card__title {
  flex: 1;
  min-width: 0;
}

.projects-card__title strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.05rem;
  display: block;
  overflow: hidden;
}

.projects-card__title p {
  color: #91a1ba;
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: .25rem 0 0;
  font-size: .75rem;
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
}

.projects-card__status {
  border-radius: 999px;
  align-self: flex-start;
  align-items: center;
  gap: .45rem;
  margin-top: .35rem;
  padding: .45rem .75rem;
  font-size: .75rem;
  font-weight: 700;
  display: inline-flex;
}

.projects-card__status span {
  background: currentColor;
  border-radius: 50%;
  width: .45rem;
  height: .45rem;
}

.projects-card__status.is-progress {
  color: #1da98a;
  background: #e5faf4;
}

.projects-card__status.is-idle {
  color: #d48a13;
  background: #fff3df;
}

.projects-card__status.is-archived {
  color: #8b9ab2;
  background: #f0f3f7;
}

.projects-card__status.is-loading {
  color: #8495ad;
  background: #f1f4f8;
}

.projects-card__members {
  color: #8494ad;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  min-height: 2.25rem;
  font-size: .72rem;
  display: flex;
}

.projects-card__avatars {
  direction: ltr;
  align-items: center;
  display: flex;
}

.projects-card__avatars span, .projects-card__avatars b {
  color: #38516f;
  background: #dbe4ef;
  border: 2px solid #fff;
  border-radius: 50%;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  margin-left: -.35rem;
  font-size: .58rem;
  font-weight: 700;
  display: grid;
}

.projects-card__avatars span:first-child {
  margin-left: 0;
}

.projects-card__avatars b {
  background: #f1f5fa;
  border-radius: 999px;
  width: auto;
  min-width: 1.8rem;
  padding: 0 .35rem;
  font-size: .68rem;
}

.projects-card__progress {
  border-top: 1px solid #edf1f7;
  padding-top: .85rem;
}

.projects-card__progress-head {
  color: #546883;
  font-size: .78rem;
}

.projects-card__chart {
  background: linear-gradient(#7445e829, #7445e808);
  height: 4rem;
  margin-top: .25rem;
}

.projects-card__footer {
  color: #9aa9bd;
  border-top: 1px solid #edf1f7;
  justify-content: space-between;
  gap: .75rem;
  margin-top: auto;
  padding-top: .75rem;
  font-size: .68rem;
  display: flex;
}

.projects-card__footer span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.projects-card {
  direction: rtl;
  background: #fff;
  border-radius: 1.9rem;
  gap: 0;
  min-height: 24rem;
  padding: 2rem;
  box-shadow: 0 18px 44px #24457717;
}

.projects-card__link {
  grid-template-rows: auto auto auto 1fr auto;
  gap: 0;
  height: 100%;
  display: grid;
}

.projects-card__menu-trigger {
  color: #70819b;
  font-size: 1.7rem;
}

.projects-card__identity {
  gap: 1rem;
}

.projects-card__cover {
  background: #415fc1;
  border-radius: 1rem;
  flex-basis: 3.7rem;
  height: 3.7rem;
  font-size: 1.1rem;
}

.projects-card__title strong {
  color: #172d54;
  font-size: 1.35rem;
  line-height: 1.25;
}

.projects-card__title p {
  color: #98a8c0;
  margin-top: .35rem;
  font-size: .95rem;
}

.projects-card__status {
  border-radius: 999px;
  justify-content: flex-start;
  align-self: stretch;
  width: 100%;
  margin-top: 1.9rem;
  padding: .8rem 1.1rem;
  font-size: 1rem;
}

.projects-card__status.is-complete {
  color: #3565df;
  background: #edf2ff;
}

.projects-card__members {
  color: #8295b2;
  min-height: 4.3rem;
  padding: 1.5rem 0 1rem;
  font-size: .95rem;
}

.projects-card__progress {
  border-top: 1px solid #e7edf6;
  grid-template-rows: auto 1fr;
  min-height: 10.8rem;
  padding-top: 1.6rem;
  display: grid;
}

.projects-card__progress-head {
  color: #536886;
  align-items: center;
  font-size: 1rem;
}

.projects-card__progress-head strong {
  color: #6844e7;
  font-size: 1.1rem;
}

.projects-card__chart {
  background: linear-gradient(#6f4ce22e, #6f4ce20d);
  border-radius: .8rem;
  align-self: end;
  height: 6.15rem;
  margin-top: 1.25rem;
}

.projects-card__chart svg {
  overflow: visible;
}

.projects-card__footer {
  color: #93a4bc;
  direction: rtl;
  border-top: 1px solid #e7edf6;
  padding-top: 1.45rem;
  font-size: .82rem;
}

@media (max-width: 460px) {
  .projects-card {
    border-radius: 1.35rem;
    min-height: 21rem;
    padding: 1.4rem;
  }

  .projects-card__status {
    margin-top: 1.2rem;
  }

  .projects-card__progress {
    min-height: 8.5rem;
    padding-top: 1.1rem;
  }

  .projects-card__chart {
    height: 4.75rem;
    margin-top: .8rem;
  }

  .projects-card__footer {
    flex-direction: column;
    gap: .4rem;
  }
}

.project-page {
  background: var(--color-paper);
  min-height: 100vh;
  padding: 0 0 2rem;
}

.projects-page {
  background: var(--color-paper);
  min-height: 100vh;
  padding: 1rem 0 2rem;
}

.projects-page__header {
  direction: rtl;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  display: flex;
}

.projects-page__heading {
  text-align: right;
  min-width: 0;
}

.projects-page__workspace {
  color: var(--muted);
  margin: 0 0 .15rem;
  font-size: .75rem;
  line-height: 1.4;
}

.projects-page__title-row {
  flex-wrap: wrap;
  align-items: baseline;
  gap: .3rem .75rem;
  display: flex;
}

.projects-page__header h1 {
  text-align: right;
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.4;
}

.projects-page__title-row > p {
  color: var(--muted);
  margin: 0;
  font-size: .85rem;
  line-height: 1.6;
}

.projects-page__back {
  border: 1px solid var(--color-line);
  min-height: 2.25rem;
  color: var(--color-accent-deep);
  background: var(--color-surface-solid);
  border-radius: .65rem;
  flex-shrink: 0;
  align-items: center;
  padding: .35rem .7rem;
  font-size: .8rem;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
}

.projects-page__back:hover {
  border-color: var(--color-accent);
  background: var(--color-accent-subtle);
}

.projects-page__create {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-sm);
  border-radius: 1rem;
  grid-template-columns: minmax(11rem, 1fr) minmax(11rem, 1fr) auto;
  align-items: end;
  gap: .75rem;
  margin-bottom: 1.5rem;
  padding: 1rem;
  display: grid;
}

.projects-page__create .ui-btn {
  margin-block-end: .05rem;
}

.projects-page__grid {
  grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
  gap: 1rem;
  display: grid;
}

.projects-page__skeleton {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--color-surface-solid);
  gap: .8rem;
  min-height: 12rem;
  padding: 1.25rem;
  display: grid;
}

.projects-page__skeleton span {
  background: linear-gradient(90deg, var(--color-line), var(--color-accent-subtle), var(--color-line));
  background-size: 200% 100%;
  border-radius: .4rem;
  height: .9rem;
  animation: 1.2s ease-in-out infinite project-skeleton;
  display: block;
}

.projects-page__skeleton span:first-child {
  border-radius: .8rem;
  width: 45%;
  height: 2.8rem;
}

.projects-page__skeleton span:last-child {
  width: 100%;
  height: 2.5rem;
}

@keyframes project-skeleton {
  to {
    background-position: -200% 0;
  }
}

.project-page__back {
  color: var(--color-accent-deep);
  margin-bottom: 1.5rem;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
}

.project-task-workspace {
  margin-top: 4rem;
  position: relative;
}

.project-task-views {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg) 0 var(--radius-lg) var(--radius-lg);
  background: var(--color-surface-solid);
  padding: 2rem 1.25rem 1.25rem;
  overflow: hidden;
}

.project-task-views__header {
  justify-content: flex-start;
  align-items: flex-end;
  gap: 1rem;
  margin: 0 -1.25rem 1rem;
  padding: 1.25rem 1.25rem 0;
  display: flex;
}

.project-task-views__eyebrow {
  color: var(--muted);
  margin: 0 0 .25rem;
  font-size: .78rem;
}

.project-task-views__toolbar {
  justify-content: flex-end;
  margin-bottom: 1.25rem;
  display: flex;
}

.project-task-views h2 {
  margin: 0;
  font-size: 1.2rem;
}

.project-task-views__tabs {
  z-index: 1;
  flex-wrap: wrap;
  align-items: end;
  gap: .5rem;
  display: flex;
  position: absolute;
  bottom: calc(100% - 1px);
  right: 0;
}

.project-task-views__tabs button {
  border: 1px solid var(--line);
  min-height: 2.75rem;
  box-shadow: none;
  background: var(--color-surface-solid);
  border-bottom: 0;
  border-radius: .75rem .75rem 0 0;
  padding-inline: 1.2rem;
  font-size: .95rem;
}

.project-task-views__tabs button[aria-selected="true"] {
  border-color: var(--color-accent);
  background: var(--color-accent);
  color: var(--color-on-accent);
}

@media (max-width: 720px) {
  .project-task-workspace {
    margin-top: 3.5rem;
  }

  .project-task-views__tabs {
    right: 0;
  }

  .projects-page__header {
    align-items: flex-start;
  }

  .projects-page__title-row {
    display: block;
  }

  .projects-page__title-row > p {
    margin-top: .15rem;
  }

  .projects-page__back {
    white-space: nowrap;
    min-height: 2rem;
    padding: .25rem .55rem;
  }

  .projects-page__create {
    grid-template-columns: 1fr;
  }

  .projects-page__create .ui-btn {
    width: 100%;
  }
}

@media (max-width: 460px) {
  .projects-page__header {
    flex-direction: column;
    gap: .6rem;
  }

  .projects-page__back {
    align-self: flex-start;
  }
}

.projects-card__meta {
  color: var(--muted);
  font-size: .78rem;
}

.projects-card__actions {
  flex-wrap: wrap;
  gap: .3rem;
  display: flex;
}

.projects-card__menu {
  z-index: 3;
  position: absolute;
  top: .7rem;
  left: .7rem;
}

.projects-card__menu-trigger {
  width: 2rem;
  height: 2rem;
  color: var(--muted);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: .5rem;
  place-items: center;
  padding: 0;
  font-size: 1.5rem;
  line-height: 1;
  display: grid;
}

.projects-card__menu-trigger:hover {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.projects-card__menu-popover {
  border: 1px solid var(--line);
  background: var(--color-surface-solid);
  min-width: 8rem;
  box-shadow: var(--shadow-md);
  border-radius: .65rem;
  padding: .35rem;
  display: grid;
  position: absolute;
  top: calc(100% + .35rem);
  left: 0;
}

.projects-card__menu-popover button {
  color: var(--ink);
  font: inherit;
  text-align: right;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: .4rem;
  padding: .55rem .7rem;
}

.projects-card__menu-popover button:hover {
  background: var(--color-accent-subtle);
}

.projects-card__menu-popover button.is-danger {
  color: var(--color-danger);
}

.projects-card__rename {
  gap: .45rem;
  display: flex;
}

.projects-card__rename .ui-input {
  flex: 1;
}

.projects-archived {
  margin-top: 1rem;
}

.projects-archived summary {
  cursor: pointer;
  color: var(--muted);
  padding: .35rem 0;
  font-size: .85rem;
  font-weight: 600;
  list-style: none;
}

.projects-archived summary::-webkit-details-marker {
  display: none;
}

.projects-archived .projects-cards {
  margin-top: .55rem;
}

.projects-dashboard {
  gap: 1rem;
  display: grid;
}

.projects-dashboard__stats {
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: .55rem;
  display: grid;
}

.projects-dashboard__stat {
  border: 1px solid var(--line);
  background: #0f766e0f;
  border-radius: 12px;
  gap: .15rem;
  padding: .75rem;
  display: grid;
}

.projects-dashboard__stat span {
  color: var(--muted);
  font-size: .76rem;
}

.projects-dashboard__stat strong {
  font-variant-numeric: tabular-nums;
  font-size: 1.05rem;
}

.projects-dashboard__stat.is-over {
  background: #fee2e28c;
  border-color: #dc262640;
}

.projects-dashboard__stat.is-over strong {
  color: #b91c1c;
}

.projects-dashboard__progress {
  border: 1px solid var(--line);
  background: #ffffffbf;
  border-radius: 12px;
  gap: .4rem;
  padding: .85rem;
  display: grid;
}

.projects-dashboard__progress-head {
  color: var(--muted);
  justify-content: space-between;
  gap: .5rem;
  font-size: .82rem;
  display: flex;
}

.projects-dashboard__progress-bar {
  background: #1a242114;
  border-radius: 999px;
  height: .55rem;
  overflow: hidden;
}

.projects-dashboard__progress-fill {
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), #7182f5);
  height: 100%;
  transition: width .25s;
}

.projects-dashboard__progress-fill.is-over {
  background: linear-gradient(90deg, #d97706, #dc2626);
}

.projects-dashboard__section h3 {
  margin: 0 0 .5rem;
  font-size: .9rem;
}

.projects-dashboard__section-head {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-bottom: .5rem;
  display: flex;
}

.projects-dashboard__list {
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.projects-dashboard__list li {
  border: 1px solid var(--line);
  background: #ffffffc7;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  gap: .65rem;
  padding: .55rem .7rem;
  display: flex;
}

.projects-dashboard__list li > div {
  gap: .12rem;
  min-width: 0;
  display: grid;
}

.projects-dashboard__list li strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.projects-dashboard__skeleton {
  gap: .55rem;
  display: grid;
}

.projects-dashboard__skeleton-stat, .projects-dashboard__skeleton-block {
  background: linear-gradient(110deg, #1a24210f 30%, #1a24211a 50%, #1a24210f 70%) 0 0 / 200% 100%;
  border-radius: 12px;
  animation: 1.2s ease-in-out infinite projects-shimmer;
}

.projects-dashboard__skeleton-stat {
  height: 4.25rem;
}

.projects-dashboard__skeleton-block {
  height: 6rem;
}

@keyframes projects-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.projects-members {
  gap: .85rem;
  display: grid;
}

.projects-members__add {
  flex-wrap: wrap;
  align-items: end;
  gap: .45rem;
  display: flex;
}

.projects-members__add .ui-field {
  flex: 1;
  min-width: 10rem;
}

.projects-members__table {
  border-collapse: collapse;
  width: 100%;
}

.projects-members__table th, .projects-members__table td {
  text-align: start;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
  padding: .55rem .45rem;
}

.projects-members__table th {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 700;
}

.projects-members__user {
  align-items: center;
  gap: .5rem;
  min-width: 0;
  display: flex;
}

.projects-members__avatar {
  width: 1.85rem;
  height: 1.85rem;
  color: var(--accent-deep);
  text-transform: uppercase;
  background: #0f766e24;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .68rem;
  font-weight: 800;
  display: inline-flex;
}

.projects-members__email {
  color: var(--muted);
  font-size: .74rem;
  display: block;
}

.projects-members__actions {
  justify-content: flex-end;
  align-items: center;
  gap: .25rem;
  display: flex;
}

.projects-labels {
  gap: .85rem;
  display: grid;
}

.projects-labels__add {
  gap: .55rem;
  display: grid;
}

.projects-labels__palette {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.projects-labels__swatch {
  cursor: pointer;
  border: 2px solid #0000;
  border-radius: 999px;
  width: 1.65rem;
  height: 1.65rem;
  padding: 0;
}

.projects-labels__swatch.is-selected {
  border-color: var(--ink);
  box-shadow: inset 0 0 0 2px #fff;
}

.projects-labels__list {
  gap: .45rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.projects-labels__item {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 12px;
  justify-content: space-between;
  align-items: center;
  gap: .65rem;
  padding: .55rem .7rem;
  display: flex;
}

.projects-labels__item-actions {
  align-items: center;
  gap: .25rem;
  display: flex;
}

.projects-view-empty {
  text-align: center;
  color: var(--muted);
  padding: 2rem 1rem;
  font-size: .9rem;
}

@media (max-width: 720px) {
  .projects-modal__body {
    grid-template-columns: 1fr;
  }

  .projects-modal__nav {
    border-inline-end: 0;
    border-bottom: 1px solid var(--line);
    flex-flow: wrap;
  }

  .projects-modal__project-picker {
    border-top: 0;
    width: 100%;
    margin-top: 0;
    padding-top: 0;
  }

  .projects-members__table thead {
    display: none;
  }

  .projects-members__table tr {
    border-bottom: 1px solid var(--line);
    gap: .35rem;
    padding: .65rem 0;
    display: grid;
  }

  .projects-members__table td {
    border: 0;
    padding: .15rem 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-dashboard__skeleton-stat, .projects-dashboard__skeleton-block {
    animation: none;
  }
}

.projects-card {
  border-radius: 1.2rem;
  min-height: 20rem;
  padding: 1.45rem;
}

.projects-card__link {
  grid-template-rows: auto auto 1fr auto;
}

.projects-card__menu {
  top: 1.05rem;
  left: 1.1rem;
}

.projects-card__head {
  min-height: 3.2rem;
}

.projects-card__cover {
  border-radius: .7rem;
  flex-basis: 2.65rem;
  height: 2.65rem;
  font-size: .9rem;
}

.projects-card__title strong {
  font-size: 1rem;
}

.projects-card__title p {
  font-size: .76rem;
}

.projects-card__summary {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  min-height: 3.25rem;
  margin: 1.15rem 0 .85rem;
  display: flex;
}

.projects-card__status {
  border-radius: 999px;
  align-self: auto;
  width: auto;
  margin: 0;
  padding: .45rem .75rem;
  font-size: .75rem;
}

.projects-card__status span {
  width: .45rem;
  height: .45rem;
}

.projects-card__members {
  min-height: 0;
  padding: 0;
  font-size: .73rem;
}

.projects-card__members > span {
  display: inline;
}

.projects-card__avatars span, .projects-card__avatars b {
  width: 1.8rem;
  height: 1.8rem;
  font-size: .56rem;
}

.projects-card__progress {
  border-top-color: #e8eef7;
  min-height: 0;
  padding-top: .9rem;
}

.projects-card__progress-head {
  font-size: .78rem;
}

.projects-card__progress-head strong {
  font-size: .9rem;
}

.projects-card__chart {
  border-radius: .55rem;
  height: 4rem;
  margin-top: .65rem;
}

.projects-card__footer {
  direction: ltr;
  align-items: center;
  padding-top: .85rem;
  font-size: .68rem;
}

.projects-card__date, .projects-card__metrics, .projects-card__metrics > span {
  align-items: center;
  gap: .3rem;
  display: inline-flex;
}

.projects-card__metrics {
  color: #7f91ac;
  direction: rtl;
  gap: .85rem;
}

@media (max-width: 460px) {
  .projects-card {
    min-height: 19rem;
    padding: 1.2rem;
  }

  .projects-card__footer {
    font-size: .62rem;
  }
}

@media (min-width: 900px) {
  .projects-page__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.7rem;
  }

  .projects-card {
    aspect-ratio: auto;
    border-radius: 1.15rem;
    height: auto;
    min-height: 0;
    padding: 1.1rem 1.25rem;
  }

  .projects-card__link {
    height: auto;
    display: grid;
  }

  .projects-card__head {
    min-height: 3.45rem;
  }

  .projects-card__cover {
    border-radius: .75rem;
    flex-basis: 3.25rem;
    height: 3.25rem;
  }

  .projects-card__title strong {
    font-size: 1.1rem;
  }

  .projects-card__title p {
    font-size: .78rem;
  }

  .projects-card__summary {
    min-height: 2.35rem;
    margin: .85rem 0 .75rem;
  }

  .projects-card__status {
    padding: .45rem .8rem;
    font-size: .75rem;
  }

  .projects-card__members {
    font-size: .72rem;
  }

  .projects-card__progress {
    border: 0;
    min-height: 0;
    padding: 0;
  }

  .projects-card__progress-head {
    font-size: .78rem;
  }

  .projects-card__chart {
    border-radius: .45rem;
    height: 4.75rem;
    margin-top: .7rem;
  }

  .projects-card__footer {
    border: 0;
    margin-top: .9rem;
    padding-top: .4rem;
    font-size: .7rem;
  }
}

.project-page__title {
  color: var(--color-ink);
  overflow-wrap: anywhere;
  margin: 0 0 1.5rem;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  line-height: 1.3;
}

.project-page__header {
  direction: rtl;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.project-page__header .project-page__title {
  min-width: 0;
  margin: 0;
}

.project-page__header .project-page__back {
  flex-shrink: 0;
  margin: 0;
}

.project-page:has([data-project-view="kanban"]) {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  display: flex;
}

.project-page:has([data-project-view="kanban"]) .project-page__header {
  flex-shrink: 0;
  margin-bottom: .75rem;
}

.project-task-workspace[data-project-view="kanban"] {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
  margin-top: 0;
  display: flex;
}

[data-project-view="kanban"] .project-task-views__tabs {
  flex-shrink: 0;
  margin-bottom: -1px;
  position: relative;
  inset: auto;
}

[data-project-view="kanban"] .project-task-views {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  overflow: clip;
}

[data-project-view="kanban"] .project-task-views__toolbar {
  flex-shrink: 0;
}

[data-project-view="kanban"] .kanban {
  flex: 1;
  height: auto;
  min-height: 0;
  margin: 0;
}

[data-project-view="kanban"] .kanban-board, [data-project-view="kanban"] .kanban-column__cards {
  overflow-anchor: none;
}

@media (max-width: 767px), (max-height: 650px) {
  .project-page:has([data-project-view="kanban"]) .project-page__title {
    font-size: 1.5rem;
  }

  [data-project-view="kanban"] .project-task-views {
    padding: .75rem;
  }

  [data-project-view="kanban"] .project-task-views__toolbar {
    margin-bottom: .5rem;
  }

  [data-project-view="kanban"] .project-task-views__tabs {
    gap: .25rem;
  }

  [data-project-view="kanban"] .project-task-views__tabs button {
    min-height: 2rem;
    padding-inline: .6rem;
    font-size: .8rem;
  }
}

@media (max-height: 500px) {
  .project-page:has([data-project-view="kanban"]) .project-page__header {
    margin-bottom: .25rem;
  }

  [data-project-view="kanban"] .project-task-views {
    padding: .5rem;
  }

  [data-project-view="kanban"] .kanban-column {
    gap: .35rem;
    padding: .5rem;
  }

  [data-project-view="kanban"] .kanban-column__head {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .25rem;
  }

  [data-project-view="kanban"] .kanban-column__accent, [data-project-view="kanban"] .kanban-column__rename {
    grid-column: 1 / -1;
  }

  [data-project-view="kanban"] .kanban-column__title {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  [data-project-view="kanban"] .kanban-column__toolbar {
    flex-wrap: nowrap;
  }
}

.ui-modal.project-task-modal {
  width: min(860px, 100%);
}

.project-task-modal__heading {
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.project-task-modal__heading h3 {
  overflow-wrap: anywhere;
  font-size: 1.5rem;
}

.project-task-modal__details {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  display: grid;
}

.project-task-modal__details dt {
  color: var(--color-muted);
  font-size: .85rem;
}

.project-task-modal__details dd {
  margin: .25rem 0 0;
}

.project-task-modal__description {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.project-task-modal__form > fieldset {
  border: 0;
  gap: 1rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  display: grid;
}

.project-task-modal__form label {
  gap: .4rem;
  display: grid;
}

.project-task-modal__form select, .project-task-modal__form textarea {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  width: 100%;
  color: inherit;
  font: inherit;
  border-radius: .6rem;
  padding: .65rem;
}

.project-task-modal__estimate {
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  display: grid;
}

.project-task-modal__form .project-task-modal__label {
  align-items: center;
  margin-inline-end: 1rem;
  display: inline-flex;
}

.project-task-modal__sections {
  gap: 1.25rem;
  margin-top: 1.5rem;
  display: grid;
}

@media (max-width: 480px) {
  .project-task-modal__details {
    grid-template-columns: 1fr;
  }
}

.task-completion-panel {
  border-block-start: 1px solid var(--color-line);
  gap: .8rem;
  min-width: 0;
  padding-block: 1rem;
  display: grid;
}

.task-completion-panel h3, .task-completion-panel p {
  margin: 0;
}

.task-completion-panel textarea {
  resize: vertical;
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  width: 100%;
  color: inherit;
  font: inherit;
  border-radius: .6rem;
  padding: .65rem;
}

.task-completion-panel a {
  overflow-wrap: anywhere;
}

.task-completion-panel label {
  gap: .4rem;
  display: grid;
}

.task-completion-panel fieldset {
  min-width: 0;
}

.kanban-card__completion {
  color: var(--color-primary);
  font-size: .75rem;
  font-weight: 600;
}

/* [project]/libs/modules/reports/src/ReportsModal.css [app-client] (css) */
.modal.reports-modal {
  flex-direction: column;
  width: min(96vw, 68rem);
  max-width: none;
  max-height: min(92vh, 880px);
  display: flex;
  overflow: hidden;
}

.reports-modal__body {
  padding-top: .25rem;
  overflow-y: auto;
}

.reports-modal__filters {
  gap: .75rem;
  margin-bottom: 1rem;
  display: grid;
}

.reports-period {
  border: 1px solid var(--line);
  background: #ffffffa6;
  border-radius: 12px;
  flex-wrap: wrap;
  gap: .35rem;
  padding: .25rem;
  display: inline-flex;
}

.reports-period__btn {
  color: var(--ink-soft);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 9px;
  padding: .4rem .75rem;
  font-size: .84rem;
  font-weight: 600;
  transition: background .12s, color .12s;
}

.reports-period__btn:hover {
  color: var(--accent-deep);
  background: #0f766e14;
}

.reports-period__btn.is-active {
  background: var(--accent);
  color: #fff;
}

.reports-modal__filter-row {
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  align-items: end;
  gap: .55rem;
  display: grid;
}

.reports-modal__dates {
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  display: grid;
}

.reports-modal__actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: .45rem;
  display: flex;
}

.reports-summary {
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: .55rem;
  margin-bottom: 1rem;
  display: grid;
}

.reports-summary__card {
  border: 1px solid var(--line);
  background: #ffffffc7;
  border-radius: 12px;
  gap: .15rem;
  padding: .75rem .85rem;
  display: grid;
}

.reports-summary__card span {
  color: var(--muted);
  font-size: .76rem;
}

.reports-summary__card strong {
  font-variant-numeric: tabular-nums;
  font-size: 1.02rem;
}

.reports-summary__card.is-over {
  background: #fee2e28c;
  border-color: #dc262647;
}

.reports-summary__card.is-over strong {
  color: #b91c1c;
}

.reports-summary__card.is-under strong {
  color: var(--accent-deep);
}

.reports-summary__card.is-match strong {
  color: var(--ink);
}

.reports-chart {
  border: 1px solid var(--line);
  background: #ffffffb8;
  border-radius: 12px;
  gap: .55rem;
  margin-bottom: 1rem;
  padding: .85rem;
  display: grid;
}

.reports-chart__title {
  color: var(--ink-soft);
  margin: 0 0 .25rem;
  font-size: .88rem;
  font-weight: 700;
}

.reports-chart__legend {
  color: var(--muted);
  flex-wrap: wrap;
  gap: .65rem;
  margin-bottom: .35rem;
  font-size: .72rem;
  display: flex;
}

.reports-chart__legend span {
  align-items: center;
  gap: .3rem;
  display: inline-flex;
}

.reports-chart__legend i {
  border-radius: 2px;
  width: .65rem;
  height: .65rem;
  font-style: normal;
}

.reports-chart__legend i.est {
  background: #1a24212e;
}

.reports-chart__legend i.act {
  background: var(--accent);
}

.reports-chart__row {
  grid-template-columns: minmax(5rem, 8rem) minmax(0, 1fr);
  align-items: center;
  gap: .55rem;
  display: grid;
}

.reports-chart__label {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .78rem;
  font-weight: 600;
  overflow: hidden;
}

.reports-chart__bars {
  gap: .2rem;
  display: grid;
}

.reports-chart__bar {
  background: #1a242114;
  border-radius: 999px;
  height: .45rem;
  overflow: hidden;
}

.reports-chart__bar > span {
  border-radius: inherit;
  min-width: 2px;
  height: 100%;
  transition: width .25s;
  display: block;
}

.reports-chart__bar > span.is-estimate {
  background: #1a242138;
}

.reports-chart__bar > span.is-tracked {
  background: var(--accent);
}

.reports-chart__bar > span.is-tracked.is-over {
  background: #dc2626;
}

.reports-chart__bar > span.is-tracked.is-under {
  background: #059669;
}

.reports-table-wrap {
  border: 1px solid var(--line);
  background: #ffffffc7;
  border-radius: 12px;
  overflow-x: auto;
}

.reports-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 520px;
}

.reports-table th, .reports-table td {
  text-align: start;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
  padding: .6rem .75rem;
}

.reports-table th {
  color: var(--muted);
  background: #0f766e0d;
  font-size: .76rem;
  font-weight: 700;
}

.reports-table tbody tr:last-child td {
  border-bottom: 0;
}

.reports-table td.is-over {
  color: #b91c1c;
  font-weight: 600;
}

.reports-table td.is-under {
  color: #047857;
  font-weight: 600;
}

.reports-table td.is-match {
  color: var(--muted);
}

.reports-variance-badge {
  border-radius: 999px;
  margin-inline-start: .35rem;
  padding: .12rem .45rem;
  font-size: .72rem;
  font-weight: 700;
  display: inline-block;
}

.reports-variance-badge.is-over {
  color: #991b1b;
  background: #fee2e2e6;
}

.reports-variance-badge.is-under {
  color: #047857;
  background: #d1fae5e6;
}

.reports-empty {
  text-align: center;
  border: 1px dashed var(--line);
  color: var(--muted);
  background: #ffffff80;
  border-radius: 14px;
  padding: 2rem 1rem;
}

.reports-empty strong {
  color: var(--ink-soft);
  margin-bottom: .35rem;
  display: block;
}

.reports-empty p {
  margin: 0;
  font-size: .85rem;
}

.reports-skeleton {
  gap: .55rem;
  display: grid;
}

.reports-skeleton__card, .reports-skeleton__block {
  background: linear-gradient(110deg, #1a24210f 30%, #1a24211a 50%, #1a24210f 70%) 0 0 / 200% 100%;
  border-radius: 12px;
  animation: 1.2s ease-in-out infinite reports-shimmer;
}

.reports-skeleton__card {
  height: 4rem;
}

.reports-skeleton__block {
  height: 10rem;
}

@keyframes reports-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.reports-error {
  background: #fee2e273;
  border: 1px solid #dc262640;
  border-radius: 12px;
  gap: .65rem;
  padding: 1rem;
  display: grid;
}

@media (max-width: 720px) {
  .reports-modal__dates {
    grid-template-columns: 1fr;
  }

  .reports-chart__row {
    grid-template-columns: 1fr;
    gap: .25rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reports-skeleton__card, .reports-skeleton__block {
    animation: none;
  }
}

/* [project]/libs/modules/shell/src/AppShell.css [app-client] (css) */
.app-shell {
  --app-view-bar-height: 0px;
  padding-block-start: var(--space-4);
}

.app-shell__header {
  margin-block-end: var(--space-4);
  padding-block-end: var(--space-2);
}

.app-shell__view-bar {
  display: none;
}

@media (min-width: 768px) {
  .app-shell {
    --app-view-bar-height: 3.5rem;
  }

  .app-shell__view-bar {
    z-index: var(--z-sticky);
    padding: var(--space-2);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-line);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: var(--shadow-sm);
    background: #ffffffeb;
    background: lab(100% 0 0 / .92);
    justify-content: center;
    align-items: center;
    margin-block-end: var(--space-4);
    display: flex;
    position: sticky;
    top: 0;
  }
}

.app-shell__topbar {
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: var(--shadow-sm);
  flex-wrap: wrap;
  margin-block-end: var(--space-4);
  display: flex;
}

.app-shell__topbar-end {
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
  display: flex;
}

.app-shell__hero {
  margin-block-end: var(--space-4);
}

.app-shell__brand-row {
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  display: flex;
}

.app-shell__brand {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  letter-spacing: -.03em;
  color: var(--color-accent-deep);
  font-weight: 800;
  line-height: var(--leading-tight);
  margin: 0;
}

.app-shell__stats {
  gap: var(--space-2);
  flex-wrap: wrap;
  align-items: stretch;
  display: flex;
}

.app-shell__stat {
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  gap: .1rem;
  min-width: 4.5rem;
  display: grid;
}

.app-shell__stat strong {
  font-family: var(--font-display);
  font-size: var(--text-base);
  color: var(--color-ink);
  line-height: var(--leading-tight);
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 12rem;
  overflow: hidden;
}

.app-shell__stat span:last-child {
  font-size: var(--text-xs);
  color: var(--color-muted);
}

.app-shell__stat--live {
  background: var(--color-accent-subtle);
  border-color: #007b6659;
  border-color: lab(45.6129% -35.2776 3.0459 / .35);
}

.app-shell__stat--live strong {
  color: var(--color-accent-deep);
}

.app-shell__live-dot {
  background: var(--color-accent);
  width: .45rem;
  height: .45rem;
  vertical-align: middle;
  border-radius: 50%;
  margin-inline-end: var(--space-1);
  display: inline-block;
}

.app-shell__toolbar {
  justify-content: flex-end;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-2);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-sm);
  flex-wrap: wrap;
  display: flex;
}

.app-shell__toolbar-actions {
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  display: flex;
}

.app-shell__cta {
  font-weight: 700;
}

.app-shell__main {
  margin-block-start: 0;
}

.app-shell__footer {
  margin-block-start: var(--space-7);
}

.app-shell__fab {
  z-index: calc(var(--z-sticky) + 1);
  width: var(--touch-min, 2.75rem);
  height: var(--touch-min, 2.75rem);
  box-shadow: var(--shadow-md);
  border-radius: 50%;
  padding: 0;
  display: none;
  position: fixed;
  inset-block-end: calc(var(--space-4) + var(--mobile-nav-height, 3.75rem) + var(--safe-bottom, 0px));
  inset-inline-start: calc(var(--space-4) + var(--safe-right, 0px));
}

.mobile-bottom-nav {
  z-index: var(--z-sticky);
  height: calc(var(--mobile-nav-height) + var(--safe-bottom, 0px));
  padding-inline: calc(var(--space-2) + var(--safe-right, 0px))
    calc(var(--space-2) + var(--safe-left, 0px));
  border-block-start: 1px solid var(--color-line);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: #fffffff0;
  background: lab(100% 0 0 / .94);
  padding-block-end: var(--safe-bottom, 0px);
  display: none;
  position: fixed;
  inset-block-end: 0;
  inset-inline: 0;
  box-shadow: 0 -4px 24px #202c2614;
  box-shadow: 0 -4px 24px lab(16.7482% -6.6562 1.91945 / .08);
}

.mobile-bottom-nav__btn {
  min-height: var(--touch-min);
  padding: var(--space-1);
  border-radius: var(--radius-md);
  color: var(--color-muted);
  font: inherit;
  font-size: var(--text-xs);
  cursor: pointer;
  transition: color var(--duration-fast) var(--ease-out),
    background var(--duration-fast) var(--ease-out);
  background: none;
  border: 0;
  flex: 1;
  align-content: center;
  justify-items: center;
  gap: .15rem;
  font-weight: 600;
  display: grid;
}

.mobile-bottom-nav__btn.is-active {
  color: var(--color-accent-deep);
  background: var(--color-accent-subtle);
}

.mobile-bottom-nav__btn svg {
  flex-shrink: 0;
}

.view-mode-toggle {
  padding: var(--space-1);
  gap: var(--space-1);
  border-radius: var(--radius-full);
  border: 1px solid var(--color-line);
  background: #ffffffa6;
  background: lab(100% 0 0 / .65);
  display: inline-flex;
}

.view-mode-toggle__btn {
  border-radius: var(--radius-full) !important;
  gap: var(--space-1) !important;
  min-height: 2.125rem !important;
  padding-inline: var(--space-3) !important;
  border: none !important;
}

.view-mode-toggle__btn.ui-btn--ghost {
  color: var(--color-ink-soft);
  background: none;
}

.view-mode-toggle__btn.is-active, .view-mode-toggle__btn.ui-btn--primary {
  box-shadow: var(--shadow-sm);
}

.workspace-switcher {
  align-items: flex-end;
  gap: var(--space-2);
  flex-wrap: wrap;
  flex: 1;
  min-width: min(100%, 280px);
  display: flex;
}

.workspace-switcher__field {
  flex: 1;
  min-width: 10rem;
}

.workspace-switcher__field .ui-field__label {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--color-accent-deep);
  font-weight: 700;
}

.workspace-switcher__field .ui-select {
  background: var(--color-surface-solid);
  border-color: #007b6659;
  border-color: lab(45.6129% -35.2776 3.0459 / .35);
  min-height: 2.5rem;
  font-weight: 600;
}

.workspace-switcher__actions {
  gap: var(--space-1);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.workspace-create-inline {
  gap: var(--space-1);
  align-items: center;
  width: 100%;
  display: flex;
}

.workspace-create-inline input {
  min-height: 2.25rem;
  padding-inline: var(--space-3);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-line);
  font: inherit;
  flex: 1;
}

.user-menu {
  position: relative;
}

.user-menu__trigger {
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-2) var(--space-1) var(--space-1);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-full);
  background: var(--color-surface-solid);
  cursor: pointer;
  font: inherit;
  color: var(--color-ink);
  max-width: min(100%, 14rem);
  display: inline-flex;
}

.user-menu__trigger:hover {
  background: var(--color-accent-subtle);
  border-color: #007b6659;
  border-color: lab(45.6129% -35.2776 3.0459 / .35);
}

.user-menu__avatar {
  background: var(--color-accent);
  width: 2rem;
  height: 2rem;
  color: var(--color-on-accent);
  font-size: var(--text-xs);
  border-radius: 50%;
  flex-shrink: 0;
  place-items: center;
  font-weight: 700;
  display: grid;
}

.user-menu__name {
  font-size: var(--text-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  overflow: hidden;
}

.user-menu__role {
  flex-shrink: 0;
}

.user-menu__chevron {
  opacity: .6;
  flex-shrink: 0;
}

.user-menu__dropdown {
  z-index: var(--z-dropdown);
  min-width: 12rem;
  padding: var(--space-2);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-md);
  position: absolute;
  inset-block-start: calc(100% + var(--space-2));
  inset-inline-end: 0;
}

.user-menu__meta {
  padding: var(--space-2) var(--space-2) var(--space-3);
  border-block-end: 1px solid var(--color-line);
  gap: .15rem;
  margin-block-end: var(--space-1);
  display: grid;
}

.user-menu__meta strong {
  font-size: var(--text-sm);
}

.user-menu__meta span {
  font-size: var(--text-xs);
  color: var(--color-muted);
}

.user-menu__item {
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  font: inherit;
  font-size: var(--text-sm);
  color: var(--color-ink-soft);
  cursor: pointer;
  text-align: start;
  background: none;
  border: 0;
  display: flex;
}

.user-menu__item:hover {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.user-menu__item--danger {
  color: var(--color-danger);
}

.user-menu__item--danger:hover {
  background: var(--color-danger-subtle);
  color: var(--color-danger);
}

.user-menu__lock {
  color: var(--color-muted);
  opacity: .75;
  margin-inline-start: auto;
}

@media (min-width: 768px) {
  .app-shell {
    max-width: none;
    padding: 0;
  }

  .app-shell__header {
    z-index: var(--z-sticky);
    padding: var(--space-3) var(--space-6);
    border-block-end: 1px solid var(--color-line);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    background: #f7faffe6;
    background: lab(98.2419% -.730693 -3.30186 / .9);
    margin: 0;
    position: sticky;
    inset-block-start: 0;
  }

  .app-shell__topbar {
    min-height: 2.9rem;
    box-shadow: none;
    background: none;
    border: 0;
    border-radius: 0;
    flex-direction: row-reverse;
    align-items: center;
    margin: 0;
    padding: 0;
  }

  .app-shell__hero {
    margin: 0;
    position: absolute;
    inset-block-start: var(--space-3);
    inset-inline-start: var(--space-6);
  }

  .app-shell__brand-row {
    gap: var(--space-3);
  }

  .app-shell__brand {
    font-size: 1.35rem;
  }

  .app-shell__brand span {
    color: var(--color-muted);
    font-family: var(--font-body);
    letter-spacing: .11em;
    text-transform: uppercase;
    margin-block-start: .05rem;
    font-size: .63rem;
    font-weight: 700;
    display: block;
  }

  .app-shell__stats, .app-shell__toolbar {
    display: none;
  }

  .app-shell__workspace {
    grid-template-columns: 16.5rem minmax(0, 1fr);
    min-height: calc(100vh - 5.4rem);
    display: grid;
  }

  .app-shell__sidebar {
    height: calc(100vh - 5.4rem);
    padding: var(--space-5) var(--space-3);
    border-inline-end: 1px solid var(--color-line);
    background: #f7faffa8;
    background: lab(98.2419% -.730693 -3.30186 / .66);
    flex-direction: column;
    grid-area: 1 / 1;
    display: flex;
    position: sticky;
    inset-block-start: 5.4rem;
  }

  .app-shell__content {
    min-width: 0;
    padding: var(--space-5) var(--space-6) var(--space-8);
    grid-column: 2;
  }

  .app-shell__sidebar-label {
    margin: 0 var(--space-3) var(--space-2);
    color: var(--color-muted);
    font-size: var(--text-xs);
    font-weight: 700;
  }

  .app-shell__nav {
    gap: var(--space-1);
    display: grid;
  }

  .app-shell__context-nav {
    flex-shrink: 0;
    max-height: 35vh;
    overflow: hidden auto;
  }

  .app-shell__context-nav button span {
    overflow-wrap: anywhere;
    min-width: 0;
  }

  .app-shell__context-nav button svg {
    flex-shrink: 0;
  }

  .app-shell__nav button {
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    min-height: 2.75rem;
    padding-inline: var(--space-3);
    border-radius: var(--radius-md);
    color: var(--color-ink-soft);
    cursor: pointer;
    font: inherit;
    font-size: var(--text-sm);
    text-align: start;
    transition: background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);
    background: none;
    border: 0;
    font-weight: 650;
    display: flex;
  }

  .app-shell__nav button:hover {
    background: var(--color-accent-subtle);
    color: var(--color-accent-deep);
  }

  .app-shell__nav button.is-active {
    background: var(--color-accent);
    color: var(--color-on-accent);
    box-shadow: 0 8px 18px #3d66d033;
    box-shadow: 0 8px 18px lab(44.8533% 13.5164 -60.1598 / .2);
  }

  .app-shell__sidebar-divider {
    height: 1px;
    margin: var(--space-5) var(--space-3);
    background: var(--color-line);
  }

  .app-shell__sidebar-footer {
    padding: var(--space-3);
    border-block-start: 1px solid var(--color-line);
    margin-top: auto;
  }

  .app-shell__sidebar-footer .ui-btn {
    width: 100%;
  }

  .app-shell__view-bar {
    margin: 0 0 var(--space-4);
    box-shadow: none;
    background: none;
    border: 0;
    justify-content: flex-start;
    padding: 0;
    position: static;
  }
}

@media (max-width: 767px) {
  .app-shell__sidebar, .app-shell__workspace {
    display: contents;
  }
}

@media (min-width: 768px) {
  html, body, #root {
    width: 100%;
    max-width: none;
  }

  .page.app-shell {
    background: var(--color-paper);
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .app-shell .atmosphere {
    display: none;
  }

  .app-shell__header {
    align-items: center;
    column-gap: var(--space-5);
    height: 5rem;
    padding: 0 var(--space-5);
    background: var(--color-surface-solid);
    direction: ltr;
    grid-template-columns: minmax(14rem, 1fr) auto minmax(14rem, 1fr);
    display: grid;
  }

  .app-shell__topbar {
    display: contents;
  }

  .app-shell__topbar .workspace-switcher {
    direction: rtl;
    grid-area: 1 / 3;
    justify-self: end;
    width: min(100%, 24rem);
    max-width: 24rem;
  }

  .app-shell__topbar-end {
    direction: rtl;
    grid-area: 1 / 1;
    justify-self: start;
  }

  .app-shell__hero {
    pointer-events: none;
    direction: rtl;
    grid-area: 1 / 2;
    justify-self: center;
    position: static;
    transform: none;
  }

  .app-shell__brand {
    align-items: baseline;
    gap: var(--space-2);
    white-space: nowrap;
    display: flex;
  }

  .app-shell__brand span {
    margin: 0;
    display: inline;
  }

  .app-shell__workspace {
    flex-direction: row;
    width: 100%;
    min-width: 0;
    min-height: calc(100vh - 5rem);
    display: flex;
  }

  .app-shell__sidebar {
    width: 15rem;
    height: calc(100vh - 5rem);
    padding: var(--space-5) var(--space-3);
    border-inline-end: 1px solid var(--color-line);
    background: var(--color-surface-solid);
    flex: 0 0 15rem;
    position: sticky;
    inset-block-start: 5rem;
  }

  .app-shell__content {
    width: auto;
    min-width: 0;
    padding: var(--space-5) var(--space-4);
    flex: 1 1 0;
  }

  .app-shell__view-bar {
    display: none;
  }

  .app-shell__main.layout {
    width: 100%;
    max-width: none;
    display: block;
  }

  .app-shell__main .panel, .app-shell__main .list-panel {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  .app-shell__nav button {
    min-height: 2.6rem;
  }

  .app-shell__header {
    height: auto;
    padding: .7rem var(--space-5);
    border-block-end: 1px solid var(--color-line);
    background: #fffffff0;
    background: lab(100% 0 0 / .94);
    display: block;
  }

  .app-shell__header-inner {
    align-items: center;
    gap: var(--space-5);
    direction: rtl;
    grid-template-columns: auto minmax(18rem, 28rem) auto;
    min-height: 3.5rem;
    display: grid;
  }

  .app-shell__header .app-shell__brand {
    color: var(--color-accent-deep);
    white-space: nowrap;
    grid-column: 1;
    align-items: baseline;
    gap: .45rem;
    font-size: 1.45rem;
    text-decoration: none;
    display: flex;
  }

  .app-shell__header .app-shell__brand span {
    color: var(--color-muted);
    font-family: var(--font-body);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin: 0;
    font-size: .65rem;
    display: inline;
  }

  .app-shell__workspace-control {
    grid-column: 2;
    min-width: 0;
  }

  .app-shell__workspace-control .workspace-switcher {
    flex-wrap: nowrap;
    justify-content: center;
    width: 100%;
    min-width: 0;
  }

  .app-shell__workspace-control .workspace-switcher__field {
    min-width: 10rem;
    max-width: 15rem;
  }

  .app-shell__workspace-control .workspace-switcher__field .ui-field__label {
    display: none;
  }

  .app-shell__workspace-control .workspace-switcher__field .ui-select {
    min-height: 2.55rem;
  }

  .app-shell__workspace-control .workspace-switcher__actions {
    flex-wrap: nowrap;
  }

  .app-shell__header-actions {
    justify-self: end;
    align-items: center;
    gap: var(--space-2);
    direction: rtl;
    grid-column: 3;
    display: flex;
  }

  .app-shell__workspace {
    background: var(--color-paper);
    min-height: calc(100vh - 4.9rem);
  }

  .app-shell__sidebar {
    width: 15.5rem;
    height: calc(100vh - 4.9rem);
    padding: var(--space-5) var(--space-3);
    border-inline-end: 1px solid var(--color-line);
    background: #ffffffd6;
    background: lab(100% 0 0 / .84);
    flex-basis: 15.5rem;
    inset-block-start: 4.9rem;
  }

  .app-shell__sidebar-label {
    margin: 0 var(--space-3) var(--space-2);
    letter-spacing: .02em;
  }

  .app-shell__nav {
    gap: .25rem;
  }

  .app-shell__nav button {
    border-radius: .7rem;
    min-height: 2.8rem;
  }

  .app-shell__sidebar-divider {
    margin: var(--space-4) var(--space-3);
  }

  .app-shell__content {
    padding: var(--space-5);
  }
}

@media (max-width: 767px) {
  .app-shell__header-inner {
    justify-content: space-between;
    align-items: center;
    gap: var(--space-2);
    display: flex;
  }

  .app-shell__workspace-control {
    order: 3;
    width: 100%;
  }

  .app-shell__workspace-control .workspace-switcher__field .ui-field__label {
    display: none;
  }

  .app-shell__header-actions {
    align-items: center;
    gap: var(--space-2);
    display: flex;
  }

  .app-shell {
    padding-inline: var(--space-4);
    padding-block-end: calc(var(--mobile-nav-height) + var(--safe-bottom, 0px) + var(--space-4));
  }

  .app-shell__main {
    padding-block-end: var(--space-2);
  }

  .mobile-bottom-nav {
    gap: var(--space-1);
    display: flex;
  }

  .app-shell__brand-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .app-shell__stats {
    width: 100%;
  }

  .app-shell__stat {
    flex: 1;
    min-width: 0;
  }

  .app-shell__stat strong {
    max-width: 100%;
  }

  .app-shell__toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .view-mode-toggle {
    justify-content: stretch;
    width: 100%;
  }

  .view-mode-toggle__btn {
    flex: 1;
    justify-content: center;
  }

  .app-shell__toolbar-actions {
    justify-content: stretch;
  }

  .app-shell__toolbar-actions .ui-btn {
    flex: 1;
    justify-content: center;
  }

  .app-shell__cta {
    display: none;
  }

  .app-shell__fab {
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  .app-shell__btn-label, .user-menu__name, .user-menu__role {
    display: none;
  }
}

@media (max-width: 389px) {
  .view-mode-toggle__btn span {
    display: none;
  }

  .view-mode-toggle__btn {
    padding-inline: var(--space-2) !important;
  }
}

@media (min-width: 768px) {
  .page.app-shell {
    color: #182c4d;
    background: #f6f9fe;
  }

  .app-shell__header {
    border-color: #e7edf6;
    height: 4.5rem;
    padding: 0 2rem;
    box-shadow: 0 1px #213d6705;
  }

  .app-shell__header-inner {
    grid-template-columns: auto minmax(10rem, 15rem) minmax(18rem, 25rem) auto;
    gap: 2rem;
    min-height: 4.5rem;
  }

  .app-shell__header-inner.has-project-control {
    grid-template-columns: auto minmax(9rem, 13rem) minmax(9rem, 13rem) minmax(15rem, 22rem) auto;
  }

  .app-shell__brand {
    gap: .35rem;
    font-weight: 800;
    color: #2860e8 !important;
    font-size: 1.5rem !important;
  }

  .app-shell__brand span {
    font-weight: 700;
    color: #9aa8bd !important;
    font-size: .58rem !important;
  }

  .app-shell__workspace-control {
    grid-column: 2;
    min-width: 0;
  }

  .app-shell__project-control {
    grid-column: 3;
    min-width: 0;
  }

  .project-switcher__field .ui-field__label {
    display: none;
  }

  .project-switcher__field .ui-select {
    color: #233b60;
    min-height: 2.55rem;
    box-shadow: none;
    background: none;
    border: 0;
    font-weight: 700;
  }

  .app-shell__workspace-control .workspace-switcher {
    justify-content: flex-start;
  }

  .app-shell__workspace-control .workspace-switcher__field {
    max-width: 13rem;
  }

  .app-shell__workspace-control .workspace-switcher__field .ui-select {
    color: #233b60;
    min-height: 2.55rem;
    box-shadow: none;
    background: none;
    border: 0;
    font-weight: 700;
  }

  .app-shell__workspace-control .workspace-switcher__actions {
    gap: .15rem;
  }

  .app-shell__workspace-control .workspace-switcher__actions .ui-btn {
    color: #7888a1;
  }

  .app-shell__search {
    grid-column: 3;
    min-width: 0;
    display: block;
    position: relative;
  }

  .app-shell__search input {
    color: #253c60;
    background: #f2f6fc;
    border: 0;
    border-radius: 999px;
    outline: 0;
    width: 100%;
    height: 2.55rem;
    padding: 0 1rem 0 2.75rem;
    font-size: .82rem;
  }

  .app-shell__search input::placeholder {
    color: #adbad0;
  }

  .app-shell__search input:focus {
    box-shadow: 0 0 0 3px #2b61e81f;
  }

  .app-shell__search svg {
    color: #b7c4d8;
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
  }

  .app-shell__header-actions {
    grid-column: 4;
    gap: .8rem;
  }

  .app-shell__header-actions .user-menu__trigger {
    background: none;
    border: 0;
    padding: 0;
  }

  .app-shell__header-inner.has-project-control .app-shell__search {
    grid-column: 4;
  }

  .app-shell__header-inner.has-project-control .app-shell__header-actions {
    grid-column: 5;
  }

  .app-shell__header-actions .user-menu__avatar {
    color: #18304f;
    background: linear-gradient(145deg, #d6e0ed, #879ab4);
    border: 2px solid #fff;
    width: 2.35rem;
    height: 2.35rem;
    box-shadow: 0 2px 8px #1f375d1f;
  }

  .app-shell__header-actions .user-menu__name, .app-shell__header-actions .user-menu__role, .app-shell__header-actions .user-menu__chevron {
    display: none;
  }

  .app-shell__workspace {
    direction: rtl;
    min-height: calc(100vh - 4.5rem);
  }

  .app-shell__sidebar {
    background: #ffffffb8;
    border-inline-start: 1px solid #e5ecf6;
    border-inline-end: 0;
    flex-basis: 16.5rem;
    width: 16.5rem;
    height: calc(100vh - 4.5rem);
    padding: 1.55rem 1rem;
    inset-block-start: 4.5rem;
  }

  .app-shell__content {
    direction: rtl;
    padding: 2rem 2.4rem 3rem;
  }

  .app-shell__sidebar-label {
    color: #8b9ab2;
    margin: 0 .85rem .7rem;
    font-size: .78rem;
    font-weight: 700;
  }

  .app-shell__nav {
    gap: .3rem;
  }

  .app-shell__nav button {
    color: #304463;
    border-radius: .85rem;
    min-height: 3rem;
    padding: 0 .9rem;
    font-size: .88rem;
  }

  .app-shell__nav button svg {
    color: currentColor;
  }

  .app-shell__nav button:hover {
    color: #2860e8;
    background: #eef4ff;
  }

  .app-shell__nav button.is-active {
    color: #2860e8;
    box-shadow: none;
    background: #edf3ff;
  }

  .app-shell__sidebar-divider {
    background: #e8eef7;
    margin: 1.35rem .85rem;
  }

  .app-shell__sidebar-footer {
    border-color: #e8eef7;
    padding: 1rem .85rem 0;
  }

  .app-shell__sidebar-footer .ui-btn {
    background: #2860e8;
    border-radius: 999px;
    min-height: 2.75rem;
    box-shadow: 0 8px 18px #2860e833;
  }
}

@media (max-width: 767px) {
  .app-shell__search, .app-shell__project-control {
    display: none;
  }
}

@media (min-width: 768px) {
  .app-shell__content:has(.project-page) {
    padding: 1rem;
  }

  .app-shell__header-inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .app-shell__header-inner .app-shell__search {
    grid-column: 2;
    justify-self: center;
    width: min(100%, 28rem);
  }

  .app-shell__header-inner .app-shell__header-actions {
    grid-column: 3;
  }
}

.workspace-tree {
  flex-shrink: 0;
  max-height: 45vh;
  overflow: hidden auto;
}

.workspace-tree ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.workspace-tree__row {
  align-items: center;
  gap: .2rem;
  display: flex;
}

.workspace-tree .workspace-tree__projects {
  border-inline-start: 1px solid var(--color-line);
  margin-inline-start: 1rem;
  padding-inline-start: .65rem;
}

.workspace-tree button {
  color: var(--color-ink);
  font: inherit;
  font-size: var(--text-sm);
  text-align: start;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: .6rem;
}

.workspace-tree__toggle {
  flex: 0 0 1.8rem;
  place-items: center;
  height: 2.6rem;
  display: grid;
}

.workspace-tree__item {
  align-items: center;
  gap: .5rem;
  width: 100%;
  min-width: 0;
  min-height: 2.7rem;
  padding: .55rem .65rem;
  display: flex;
}

.workspace-tree__item span {
  overflow-wrap: anywhere;
  min-width: 0;
}

.workspace-tree__item svg {
  flex-shrink: 0;
}

.workspace-tree button:hover {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
}

.workspace-tree button.is-active {
  background: var(--color-accent-subtle);
  color: var(--color-accent-deep);
  font-weight: 700;
}

.workspace-tree__projects button.is-active {
  color: var(--color-accent-deep);
  font-weight: inherit;
  background: none;
}

.workspace-tree__message {
  color: var(--color-muted);
  font-size: var(--text-xs);
  padding: .55rem .65rem;
}

.page.app-shell:has([data-project-view="kanban"]) {
  flex-direction: column;
  height: 100dvh;
  min-height: 0;
  padding-block: 0;
  display: flex;
  overflow: clip;
}

.app-shell:has([data-project-view="kanban"]) .app-shell__header {
  flex: none;
  margin: 0;
  position: relative;
}

.app-shell:has([data-project-view="kanban"]) .app-shell__workspace {
  flex: 1;
  min-height: 0;
  display: flex;
  position: relative;
}

.app-shell:has([data-project-view="kanban"]) .app-shell__sidebar {
  height: auto;
  min-height: 0;
  position: static;
  overflow-y: auto;
}

.app-shell:has([data-project-view="kanban"]) .app-shell__content {
  flex-direction: column;
  flex: 1;
  align-items: stretch;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.app-shell:has([data-project-view="kanban"]) .app-shell__main.layout {
  flex-direction: column;
  flex: 1;
  align-items: stretch;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.app-shell__kanban-menu {
  display: none;
}

@media (max-width: 767px) {
  .app-shell:has([data-project-view="kanban"]) .app-shell__content {
    padding: .5rem 0;
  }

  .app-shell:has([data-project-view="kanban"]) .app-shell__sidebar {
    display: none;
  }

  .app-shell:has([data-project-view="kanban"]) .app-shell__kanban-menu {
    display: inline-flex;
  }

  .app-shell.is-sidebar-open:has([data-project-view="kanban"]) .app-shell__sidebar {
    background: var(--color-surface-solid);
    width: min(85vw, 20rem);
    z-index: var(--z-sticky);
    flex-direction: column;
    padding: 1rem;
    display: flex;
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
  }

  :is(.app-shell:has([data-project-view="kanban"]) .mobile-bottom-nav, .app-shell:has([data-project-view="kanban"]) .app-shell__fab) {
    display: none;
  }
}

/* [project]/libs/modules/tasks/src/CalendarView.css [app-client] (css) */
.calendar-view {
  gap: 1rem;
  margin-top: .35rem;
  display: grid;
}

.calendar-toolbar {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  display: flex;
}

.calendar-toolbar__center {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .65rem;
  display: flex;
}

.calendar-toolbar__title {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}

.calendar-weekdays {
  text-align: center;
  color: var(--muted);
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .4rem;
  padding-inline: .1rem;
  font-size: .78rem;
  font-weight: 700;
  display: grid;
}

.calendar-weekdays span {
  padding: .25rem 0;
}

.calendar-grid-wrap {
  position: relative;
}

.calendar-grid {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .4rem;
  transition: opacity .18s;
  display: grid;
}

.calendar-grid.is-loading {
  opacity: .55;
  pointer-events: none;
}

.calendar-cell-wrap {
  min-width: 0;
  position: relative;
}

.calendar-cell {
  border: 1px solid var(--line);
  text-align: start;
  cursor: pointer;
  width: 100%;
  min-height: 6.25rem;
  color: inherit;
  font: inherit;
  background: #ffffffe0;
  border-radius: 12px;
  flex-direction: column;
  gap: .35rem;
  padding: .45rem;
  transition: border-color .12s, background .12s, box-shadow .12s;
  display: flex;
}

.calendar-cell.is-pad {
  background: none;
  border-color: #0000;
  min-height: 0;
  padding: 0;
}

.calendar-cell.is-today .calendar-cell__day {
  background: var(--accent);
  color: #fff;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  min-width: 1.65rem;
  height: 1.65rem;
  display: inline-flex;
}

.calendar-cell.is-active, .calendar-cell.is-hover {
  background: #0f766e12;
  border-color: #0f766e73;
  box-shadow: inset 0 0 0 1px #0f766e1f;
}

.calendar-cell.is-drop {
  background: #0f766e24;
  border-color: #0f766ea6;
}

.calendar-cell.has-overdue:not(.is-active):not(.is-hover) {
  border-color: #d9770647;
}

.calendar-cell__day {
  font-variant-numeric: tabular-nums;
  font-size: .88rem;
  font-weight: 700;
  line-height: 1;
}

.calendar-cell__pills {
  flex-direction: column;
  flex: 1;
  gap: .2rem;
  min-width: 0;
  display: flex;
}

.calendar-pill {
  max-width: 100%;
  color: var(--accent-deep);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  background: #0f766e1f;
  border: 1px solid #0000;
  border-radius: 999px;
  align-items: center;
  gap: .25rem;
  padding: .18rem .45rem;
  font-size: .68rem;
  font-weight: 700;
  line-height: 1.25;
  display: inline-flex;
}

.calendar-pill__text {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.calendar-pill__dot {
  background: currentColor;
  border-radius: 50%;
  flex-shrink: 0;
  width: .35rem;
  height: .35rem;
}

@media (prefers-reduced-motion: no-preference) {
  .calendar-pill.is-running .calendar-pill__dot {
    animation: 1.5s ease-in-out infinite calendar-pulse;
  }
}

@keyframes calendar-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .35;
  }
}

.calendar-pill--low {
  color: var(--muted);
  background: #1a242112;
}

.calendar-pill--high {
  color: #9a3412;
  background: #d9770624;
}

.calendar-pill--urgent {
  color: #b91c1c;
  background: #dc26261f;
}

.calendar-pill.is-overdue {
  color: #991b1b;
  background: #fee2e2d9;
  border-color: #dc262659;
}

.calendar-pill--more {
  color: var(--muted);
  cursor: default;
  background: #1a24210f;
  align-self: flex-start;
}

.calendar-pill.is-dragging {
  opacity: .5;
}

@media (prefers-reduced-motion: no-preference) {
  .calendar-pill.is-dragging {
    transform: scale(.98);
  }
}

.calendar-skeleton {
  pointer-events: none;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .4rem;
  display: grid;
  position: absolute;
  inset: 0;
}

.calendar-skeleton__cell {
  background: linear-gradient(110deg, #1a24210f 30%, #1a24211a 50%, #1a24210f 70%) 0 0 / 200% 100%;
  border-radius: 12px;
  min-height: 6.25rem;
}

@media (prefers-reduced-motion: no-preference) {
  .calendar-skeleton__cell {
    animation: 1.2s ease-in-out infinite calendar-shimmer;
  }
}

.calendar-skeleton__cell.is-pad {
  opacity: .35;
}

@keyframes calendar-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.calendar-popover {
  z-index: 20;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  background: #fff;
  border-radius: 12px;
}

.calendar-popover--hover {
  inset-inline: 0;
  max-height: 11rem;
  padding: .55rem .65rem;
  position: absolute;
  top: calc(100% + .35rem);
  overflow: auto;
}

.calendar-popover--panel {
  background: #ffffffeb;
  padding: .85rem 1rem;
}

.calendar-popover__head {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-bottom: .55rem;
  display: flex;
}

.calendar-popover__head h3 {
  margin: 0;
  font-size: .98rem;
  font-weight: 700;
}

.calendar-popover__empty {
  color: var(--muted);
  margin: 0;
  font-size: .85rem;
}

.calendar-popover__list {
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.calendar-popover__task {
  border: 1px solid var(--line);
  text-align: start;
  width: 100%;
  font: inherit;
  color: inherit;
  cursor: pointer;
  background: #fff;
  border-radius: 10px;
  gap: .12rem;
  padding: .5rem .65rem;
  transition: background .12s;
  display: grid;
}

.calendar-popover__task:hover {
  background: #0f766e0f;
}

.calendar-popover__task strong {
  font-size: .88rem;
}

.calendar-popover__task span {
  color: var(--muted);
  font-size: .76rem;
}

.calendar-popover__task--high {
  border-inline-start: 3px solid #d97706;
}

.calendar-popover__task--urgent, .calendar-popover__task.is-overdue {
  border-inline-start: 3px solid #dc2626;
}

.calendar-popover__task--low {
  border-inline-start: 3px solid var(--muted);
}

.calendar-popover__hint {
  color: var(--muted);
  margin: .65rem 0 0;
  font-size: .78rem;
}

.calendar-popover--hover .calendar-popover__list {
  gap: .2rem;
}

.calendar-popover--hover .calendar-popover__task {
  background: none;
  border: 0;
  padding: .35rem .45rem;
}

.calendar-popover--hover .calendar-popover__task strong {
  font-size: .78rem;
  font-weight: 600;
}

.calendar-popover--hover .calendar-popover__task span {
  display: none;
}

.calendar-empty-month {
  text-align: center;
  border: 1px dashed var(--line);
  color: var(--muted);
  background: #ffffff8c;
  border-radius: 14px;
  padding: 1.25rem 1rem;
}

.calendar-empty-month strong {
  color: var(--ink-soft);
  margin-bottom: .35rem;
  font-size: .95rem;
  display: block;
}

.calendar-empty-month p {
  margin: 0;
  font-size: .84rem;
}

@media (max-width: 720px) {
  .calendar-cell {
    min-height: 4.5rem;
    padding: .35rem;
  }

  .calendar-pill {
    padding: .12rem .35rem;
    font-size: .62rem;
  }

  .calendar-skeleton__cell {
    min-height: 4.5rem;
  }

  .calendar-popover--hover {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .calendar-grid {
    transition: none;
  }

  .calendar-skeleton__cell {
    animation: none;
  }
}

/* [project]/libs/modules/tasks/src/KanbanBoard.css [app-client] (css) */
.kanban {
  min-width: 0;
  height: 40rem;
  min-height: 0;
  margin-top: .25rem;
  display: flex;
}

.kanban-board {
  scroll-snap-type: none;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: auto;
  overscroll-behavior: contain;
  flex: 1;
  align-items: stretch;
  gap: .85rem;
  min-width: 0;
  min-height: 0;
  padding-bottom: .65rem;
  display: flex;
  overflow: auto hidden;
}

.kanban-column {
  --kanban-accent: #4258c9;
  border: 1px solid var(--line);
  scroll-snap-align: start;
  background: #ffffffc7;
  border-radius: 14px;
  flex-direction: column;
  flex: 0 0 292px;
  gap: .65rem;
  width: 292px;
  min-width: 292px;
  height: auto;
  min-height: 0;
  max-height: none;
  padding: .75rem;
  transition: border-color .15s, background .15s, box-shadow .15s;
  display: flex;
}

.kanban-column.is-drop {
  background: #0f766e12;
  border-color: #0f766e8c;
  box-shadow: inset 0 0 0 2px #0f766e2e;
}

.kanban-column__head {
  flex-shrink: 0;
  gap: .45rem;
  display: grid;
}

.kanban-column__accent {
  background: var(--kanban-accent);
  opacity: .85;
  border-radius: 999px;
  height: 3px;
  display: block;
}

.kanban-column.is-dragging-column {
  opacity: .45;
}

.kanban-column-drop-indicator {
  background: var(--accent, #4258c9);
  border-radius: 999px;
  flex-shrink: 0;
  align-self: stretch;
  width: 4px;
  box-shadow: 0 0 0 1px #0f766e33;
}

.kanban-column__head.is-draggable {
  cursor: grab;
}

.kanban-column__head.is-draggable:active {
  cursor: grabbing;
}

.kanban-column__grip {
  opacity: .35;
  background-image: radial-gradient(currentColor 1.1px, #0000 1.2px);
  background-position: center;
  background-size: .32rem .32rem;
  flex-shrink: 0;
  width: .7rem;
  height: .95rem;
  display: inline-block;
}

.kanban-column__title-row {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.kanban-column__title {
  min-width: 0;
  font-family: var(--font-display);
  color: var(--ink);
  flex: 1;
  margin: 0;
  font-size: .98rem;
  font-weight: 700;
}

.kanban-column__count {
  font-variant-numeric: tabular-nums;
  min-width: 1.4rem;
  height: 1.4rem;
  color: var(--muted);
  background: #1a242114;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 .4rem;
  font-size: .72rem;
  font-weight: 700;
  display: inline-flex;
}

.kanban-column__toolbar {
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem;
  display: flex;
}

.kanban-column__add-task {
  margin-inline-end: auto;
}

.kanban-column__icon-btn {
  width: 1.85rem;
  height: 1.85rem;
}

.kanban-column__icon-btn--danger:hover:not(:disabled) {
  color: #b91c1c;
  background: #dc26261a;
}

.kanban-column__system-note {
  color: var(--muted);
  margin-inline-start: auto;
  font-size: .72rem;
  font-weight: 600;
}

.kanban-column__rename {
  gap: .4rem;
  display: grid;
}

.kanban-column__rename input {
  border: 1px solid var(--line);
  min-height: 2.25rem;
  font: inherit;
  border-radius: 10px;
  padding: .4rem .65rem;
}

.kanban-column__cards {
  overscroll-behavior-y: contain;
  overscroll-behavior-x: auto;
  scrollbar-gutter: stable;
  border-radius: 10px;
  flex: 1;
  align-content: start;
  gap: .6rem;
  min-height: 0;
  padding-inline-end: .1rem;
  transition: background .15s;
  display: grid;
  overflow: hidden auto;
}

.kanban-column.is-drop .kanban-column__cards {
  background: #0f766e0a;
}

.kanban-drop-indicator {
  background: var(--accent, #4258c9);
  border-radius: 999px;
  flex-shrink: 0;
  height: 3px;
  box-shadow: 0 0 0 1px #0f766e33;
}

.kanban-column__empty {
  text-align: center;
  color: var(--muted);
  border: 1px dashed var(--line);
  background: #ffffff73;
  border-radius: 12px;
  justify-items: center;
  gap: .45rem;
  margin: 0;
  padding: 1.35rem .75rem;
  font-size: .84rem;
  display: grid;
}

.kanban-column__empty-icon {
  width: 2.25rem;
  height: 2.25rem;
  color: var(--muted);
  opacity: .7;
  border: 1px dashed #1a24212e;
  border-radius: 999px;
  place-items: center;
  font-size: 1rem;
  display: grid;
}

.kanban-column__empty p {
  margin: 0;
}

.kanban-column--add {
  background: #ffffff73;
  border-style: dashed;
}

.kanban-column__add-form {
  gap: .55rem;
  display: grid;
}

.kanban-column__add-form input {
  border: 1px solid var(--line);
  min-height: 2.25rem;
  font: inherit;
  border-radius: 10px;
  padding: .4rem .65rem;
}

.kanban-card {
  border: 1px solid var(--line);
  cursor: grab;
  touch-action: none;
  background: #fff;
  border-radius: 12px;
  align-self: start;
  gap: .5rem;
  padding: .75rem;
  display: grid;
  box-shadow: 0 4px 14px #1a24210a;
}

@media (prefers-reduced-motion: no-preference) {
  .kanban-card {
    transition: transform var(--duration-normal) var(--ease-out),
      box-shadow var(--duration-fast) ease,
      border-color var(--duration-fast) ease,
      opacity var(--duration-fast) ease;
  }
}

.kanban-card:active {
  cursor: grabbing;
}

@media (prefers-reduced-motion: no-preference) {
  .kanban-card.is-dragging {
    opacity: .45;
    transform: rotate(1.5deg)scale(1.02);
    box-shadow: 0 14px 28px #1a24211f;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kanban-card.is-dragging {
    opacity: .75;
    outline: 2px dashed var(--accent);
    outline-offset: 2px;
  }
}

.kanban-card.is-running {
  background: #0f766e0d;
  border-color: #0f766e61;
}

.kanban-card.is-blocked {
  background: #fffbebd9;
  border-color: #d9770659;
}

.kanban-card.is-busy {
  opacity: .88;
}

.kanban-card__live {
  color: var(--accent-deep);
  background: #0f766e1a;
  border-radius: 8px;
  align-items: center;
  gap: .4rem;
  padding: .3rem .45rem;
  font-size: .78rem;
  font-weight: 700;
  display: flex;
}

.kanban-card__live-dot {
  background: var(--accent);
  border-radius: 50%;
  flex-shrink: 0;
  width: .45rem;
  height: .45rem;
}

.kanban-card__live-time {
  font-variant-numeric: tabular-nums;
  direction: ltr;
}

.kanban-card__body {
  gap: .35rem;
  min-width: 0;
  display: grid;
}

.kanban-card__blocked {
  justify-self: start;
  font-size: .72rem;
}

.kanban-card__title {
  font-family: var(--font-display);
  letter-spacing: -.01em;
  margin: 0;
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.35;
}

.kanban-card__project {
  color: var(--muted);
  margin: 0;
  font-size: .76rem;
}

.kanban-card__desc {
  color: var(--ink-soft);
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0;
  font-size: .8rem;
  line-height: 1.45;
  display: -webkit-box;
  overflow: hidden;
}

.kanban-card__labels {
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem;
  display: flex;
}

.kanban-card__label {
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius: 999px;
  max-width: 7rem;
  padding: .12rem .45rem;
  font-size: .72rem;
  font-weight: 700;
  display: inline-block;
  overflow: hidden;
}

.kanban-card__label-overflow {
  color: var(--muted);
  background: #1a24210f;
  border-radius: 999px;
  padding: .1rem .35rem;
  font-size: .72rem;
  font-weight: 700;
}

.kanban-card__checklist {
  color: var(--muted);
  align-items: center;
  gap: .45rem;
  font-size: .72rem;
  font-weight: 600;
  display: flex;
}

.kanban-card__checklist-bar {
  background: #1a242114;
  border-radius: 999px;
  flex: 1;
  height: 5px;
  overflow: hidden;
}

.kanban-card__checklist-bar > div {
  background: var(--accent);
  border-radius: inherit;
  height: 100%;
  transition: width .2s;
}

.kanban-card__footer {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  display: flex;
}

.kanban-card__meta {
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  min-width: 0;
  display: flex;
}

.kanban-card__priority {
  border-radius: 50%;
  flex-shrink: 0;
  width: .55rem;
  height: .55rem;
}

.kanban-card__due {
  color: var(--muted);
  background: #1a24210f;
  border-radius: 999px;
  padding: .1rem .4rem;
  font-size: .72rem;
  font-weight: 600;
}

.kanban-card__due.is-overdue {
  color: #9a3412;
  background: #d9770624;
}

.kanban-card__time {
  font-variant-numeric: tabular-nums;
  color: var(--accent-deep);
  font-size: .78rem;
  font-weight: 700;
}

.kanban-card__avatar {
  width: 1.65rem;
  height: 1.65rem;
  color: var(--accent-deep);
  text-transform: uppercase;
  background: #0f766e24;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .68rem;
  font-weight: 800;
  display: inline-flex;
}

.kanban-card__actions {
  border-top: 1px solid #1a24210f;
  align-items: center;
  gap: .2rem;
  padding-top: .15rem;
  display: flex;
}

.kanban-card__reorder {
  border-inline-end: 1px solid #1a242114;
  align-items: center;
  gap: .1rem;
  margin-inline-end: auto;
  padding-inline-end: .25rem;
  display: inline-flex;
}

.kanban-card__action--reorder:hover:not(:disabled) {
  color: var(--accent-deep);
  background: #0f766e1a;
}

.kanban-card__action {
  width: 1.85rem;
  height: 1.85rem;
}

.kanban-card__action--start:hover:not(:disabled) {
  color: var(--accent-deep);
  background: #0f766e1f;
}

.kanban-card__action--stop:hover:not(:disabled) {
  color: #b45309;
  background: #d977061f;
}

.kanban-card__action--danger:hover:not(:disabled) {
  color: #b91c1c;
  background: #dc26261a;
}

@media (max-width: 767px) {
  .kanban-column {
    flex-basis: min(85vw, 292px);
    width: min(85vw, 292px);
    min-width: min(85vw, 292px);
    height: auto;
    min-height: 0;
  }

  .kanban-board {
    scroll-padding-inline: var(--space-4);
  }
}

.kanban-card--compact {
  gap: .65rem;
}

.kanban-card__open {
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: start;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  display: block;
}

.kanban-card__timer {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  display: flex;
}

/* [project]/libs/modules/tasks/src/TaskCardList.css [app-client] (css) */
.task-list-view__table {
  display: block;
}

.task-card-list {
  gap: .65rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: none;
}

.task-card {
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
  background: #ffffffd1;
  border-radius: 14px;
  gap: .55rem;
  padding: .85rem;
  display: grid;
}

.task-card.is-running {
  background: #f0fdfae6;
  border-color: #0f766e59;
  box-shadow: 0 0 0 1px #0f766e1f;
}

.task-card.is-running .task-card__time strong:before {
  content: "";
  background: var(--accent);
  vertical-align: middle;
  width: .45rem;
  height: .45rem;
  animation: tempo-live-pulse 1.5s var(--ease-out) infinite;
  border-radius: 50%;
  margin-inline-end: .35rem;
  display: inline-block;
}

.task-card__title {
  text-align: start;
  width: 100%;
  font: inherit;
  color: var(--ink);
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  font-size: .98rem;
  font-weight: 700;
  line-height: 1.45;
}

.task-card__meta {
  color: var(--muted);
  margin: 0;
  font-size: .78rem;
  line-height: 1.45;
}

.task-card__meta .is-overdue {
  color: #b91c1c;
  font-weight: 600;
}

.task-card__tags {
  flex-wrap: wrap;
  gap: .35rem;
  display: flex;
}

.task-card__stats {
  justify-content: space-between;
  align-items: center;
  gap: .55rem;
  display: flex;
}

.task-card__time {
  gap: .1rem;
  display: grid;
}

.task-card__time strong {
  font-family: var(--font-display);
  font-variant-numeric: tabular-nums;
  color: var(--accent-deep);
  font-size: 1.05rem;
}

.task-card__time span {
  color: var(--muted);
  font-size: .72rem;
}

.task-card__sessions summary {
  cursor: pointer;
  color: var(--ink-soft);
  font-size: .78rem;
  font-weight: 600;
}

.task-card__actions {
  gap: .45rem;
  padding-top: .15rem;
  display: flex;
}

.task-card__action {
  min-width: var(--touch-min, 2.75rem);
  min-height: var(--touch-min, 2.75rem);
}

@media (max-width: 767px) {
  .task-list-view__table {
    display: none;
  }

  .task-card-list {
    display: grid;
  }
}

@media (max-width: 767px) and (orientation: landscape) {
  .task-card {
    grid-template-columns: 1fr auto;
    grid-template-areas: "title actions"
                         "meta actions"
                         "stats stats"
                         "tags tags";
    align-items: start;
  }

  .task-card__title {
    grid-area: title;
  }

  .task-card__meta {
    grid-area: meta;
  }

  .task-card__tags {
    grid-area: tags;
  }

  .task-card__stats {
    grid-area: stats;
  }

  .task-card__actions {
    flex-direction: column;
    grid-area: actions;
    padding-top: 0;
  }

  .task-card__sessions {
    grid-column: 1 / -1;
  }
}

.task-card--compact {
  gap: .65rem;
}

.task-card__timer {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  display: flex;
}

/* [project]/libs/modules/tasks/src/TaskFiltersBar.css [app-client] (css) */
.filters-bar {
  border: 1px solid var(--line);
  background: #ffffffb8;
  border-radius: 14px;
  gap: .75rem;
  margin: .65rem 0 .35rem;
  padding: .85rem;
  display: grid;
}

.filters-bar__top {
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  display: flex;
}

.filters-search {
  flex: 14rem;
  align-items: center;
  min-width: min(100%, 12rem);
  display: flex;
  position: relative;
}

.filters-search__icon {
  color: var(--muted);
  pointer-events: none;
  position: absolute;
  inset-inline-start: .65rem;
}

.filters-search__input {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  width: 100%;
  min-height: 2.5rem;
  font: inherit;
  font-size: var(--text-sm);
  background: #fff;
  padding-inline: 2.2rem 2.35rem;
}

.filters-search__clear {
  width: 1.85rem;
  height: 1.85rem;
  position: absolute;
  inset-inline-end: .2rem;
}

.filters-bar__toggle {
  border: 1px solid var(--line);
  font: inherit;
  color: var(--ink-soft);
  cursor: pointer;
  background: #fff;
  border-radius: 999px;
  align-items: center;
  gap: .35rem;
  padding: .45rem .75rem;
  font-size: .85rem;
  font-weight: 600;
  display: none;
}

.filters-bar__toggle.has-active {
  color: var(--accent-deep);
  background: #0f766e14;
  border-color: #0f766e73;
}

.filters-bar__toggle-count {
  background: var(--accent);
  color: #fff;
  border-radius: 999px;
  padding: .1rem .45rem;
  font-size: .72rem;
  font-weight: 700;
}

.filters-bar__total {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  margin-inline-start: auto;
  font-size: .84rem;
  font-weight: 600;
}

.filters-bar__chips {
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  display: flex;
}

.filters-bar__panel {
  gap: .75rem;
  display: grid;
}

.filters-bar__section-title {
  color: var(--muted);
  letter-spacing: .01em;
  margin: 0 0 .45rem;
  font-size: .78rem;
  font-weight: 700;
}

.filters-bar__grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: end;
  gap: .65rem;
  display: grid;
}

.filters-bar__grid .ui-field {
  min-width: 0;
}

.filters-bar__secondary {
  border-top: 1px solid var(--line);
  gap: .65rem;
  padding-top: .75rem;
  display: grid;
}

.filters-bar__dates {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: .65rem;
  display: grid;
}

.filters-bar__date .ui-input {
  width: 100%;
}

.filters-bar__checks {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #1a242108;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .85rem;
  padding: .55rem .7rem;
  display: flex;
}

.filters-bar__check {
  color: var(--ink-soft);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  white-space: nowrap;
  align-items: center;
  gap: .45rem;
  font-size: .85rem;
  display: inline-flex;
}

@media (max-width: 1099px) {
  .filters-bar__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 899px) {
  .filters-bar__toggle {
    display: inline-flex;
  }

  .filters-bar__panel {
    display: none;
  }

  .filters-bar__panel.is-open {
    display: grid;
  }

  .filters-bar__grid, .filters-bar__dates {
    grid-template-columns: 1fr;
  }

  .filters-bar__checks {
    flex-direction: column;
    align-items: stretch;
  }
}

@media (min-width: 900px) {
  .filters-bar__toggle {
    display: none;
  }
}

/* [project]/libs/modules/tasks/src/TaskTable.css [app-client] (css) */
.task-list-summary {
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: .65rem;
  margin: 0 0 1rem;
  display: grid;
}

.task-list-summary__card {
  border: 1px solid var(--line);
  background: #ffffffbf;
  border-radius: 12px;
  gap: .15rem;
  padding: .75rem .9rem;
  display: grid;
}

.task-list-summary__card strong {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  color: var(--accent-deep);
  font-variant-numeric: tabular-nums;
  font-size: 1.25rem;
}

.task-list-summary__card span:last-child {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 600;
}

.task-list-summary__card--live {
  background: #0f766e14;
  border-color: #0f766e59;
}

.task-list-summary__card--live strong {
  color: var(--accent);
  align-items: center;
  gap: .35rem;
  display: inline-flex;
}

.task-list-summary__pulse {
  background: var(--accent);
  border-radius: 50%;
  flex-shrink: 0;
  width: .45rem;
  height: .45rem;
}

.table-wrap {
  border: 1px solid var(--line);
  scrollbar-gutter: stable;
  background: #ffffffc7;
  border-radius: 14px;
  width: 100%;
  max-height: min(70vh, 720px);
  overflow: auto;
}

.task-table {
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
  min-width: 640px;
}

.task-table .w-title {
  width: 46%;
}

.task-table .w-time, .task-table .w-status, .task-table .w-actions {
  width: 18%;
}

.task-table th, .task-table td {
  text-align: start;
  vertical-align: middle;
  border-bottom: 1px solid var(--line);
  padding: .75rem .85rem;
}

.task-table th {
  top: var(--app-view-bar-height, 0px);
  z-index: 2;
  color: var(--muted);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  white-space: nowrap;
  box-shadow: 0 1px 0 var(--line);
  background: #fffffff5;
  font-size: .76rem;
  font-weight: 700;
  position: sticky;
}

.task-table tbody tr:last-child td {
  border-bottom: 0;
}

.task-table tbody tr {
  transition: background .12s;
}

.task-table tbody tr:hover, .task-table tbody tr:focus-within {
  background: #0f766e0b;
}

.task-table tbody tr.is-running {
  background: #0f766e12;
}

.task-table tbody tr.is-running:hover, .task-table tbody tr.is-running:focus-within {
  background: #0f766e1a;
}

.task-table tbody tr.is-busy {
  opacity: .85;
}

.task-table td.col-time, .task-table td.col-status, .task-table td.col-actions {
  text-align: center;
}

.task-table__title-cell {
  gap: .3rem;
  min-width: 0;
  display: grid;
}

.task-table__title {
  width: 100%;
  text-align: inherit;
  font: inherit;
  color: var(--ink);
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.35;
  display: block;
}

.task-table__title:hover {
  color: var(--accent-deep);
}

.task-table__meta {
  color: var(--muted);
  margin: 0;
  font-size: .78rem;
  line-height: 1.4;
}

.task-table__meta-sep {
  opacity: .55;
  margin: 0 .35rem;
}

.task-table__meta-overdue {
  color: #b45309;
  font-weight: 600;
}

.task-table__tags {
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem;
  display: flex;
}

.task-table__timer {
  font-family: var(--font-display);
  font-variant-numeric: tabular-nums;
  color: var(--accent-deep);
  direction: ltr;
  font-size: 1rem;
  font-weight: 700;
  display: block;
}

.task-table__date {
  color: var(--muted);
  margin-top: .15rem;
  font-size: .72rem;
  display: block;
}

.task-table__status-wrap {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .35rem;
  display: inline-flex;
}

.task-table__status-badge {
  align-items: center;
  gap: .35rem;
  display: inline-flex;
}

.task-table__status-pulse {
  background: currentColor;
  border-radius: 50%;
  width: .45rem;
  height: .45rem;
}

.task-table__actions {
  justify-content: center;
  align-items: center;
  gap: .25rem;
  display: inline-flex;
}

.task-table__action {
  color: var(--muted);
}

.task-table__action:hover:not(:disabled) {
  color: var(--accent-deep);
  background: #0f766e1a;
}

.task-table__action--start:hover:not(:disabled) {
  color: var(--accent-deep);
  background: #0f766e1f;
}

.task-table__action--stop:hover:not(:disabled) {
  color: #b45309;
  background: #d977061f;
}

.task-table__action--danger:hover:not(:disabled) {
  color: #b91c1c;
  background: #dc26261a;
}

.task-list-empty {
  text-align: center;
  border: 1px dashed var(--line);
  color: var(--muted);
  background: #ffffff80;
  border-radius: 14px;
  margin: 1.5rem 0 0;
  padding: 2rem 1.25rem;
}

.task-list-empty strong {
  color: var(--ink-soft);
  margin-bottom: .35rem;
  font-size: 1rem;
  display: block;
}

/* [project]/libs/modules/workspace/src/UsersModal.css [app-client] (css) */
.users-modal {
  width: min(640px, 100%);
}

.users-modal__body {
  gap: .85rem;
  display: grid;
}

.users-modal__toolbar {
  flex-wrap: wrap;
  align-items: end;
  gap: .5rem;
  display: flex;
}

.users-modal__toolbar .ui-field {
  flex: 1;
  min-width: 10rem;
}

.users-modal__toolbar .ui-field:last-child {
  flex: 0 8.5rem;
  min-width: 7rem;
}

.users-modal__table {
  border-collapse: collapse;
  width: 100%;
}

.users-modal__table th, .users-modal__table td {
  text-align: start;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
  padding: .55rem .45rem;
}

.users-modal__table th {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 700;
}

.users-modal__user {
  align-items: center;
  gap: .5rem;
  min-width: 0;
  display: flex;
}

.users-modal__avatar {
  width: 1.85rem;
  height: 1.85rem;
  color: var(--accent-deep);
  text-transform: uppercase;
  background: #0f766e24;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .68rem;
  font-weight: 800;
  display: inline-flex;
}

.users-modal__email {
  color: var(--muted);
  text-overflow: ellipsis;
  font-size: .74rem;
  display: block;
  overflow: hidden;
}

.users-modal__meta {
  color: var(--muted);
  font-size: .72rem;
  display: block;
}

.users-modal__role-cell {
  flex-direction: column;
  align-items: flex-start;
  gap: .35rem;
  display: flex;
}

.users-modal__actions {
  justify-content: flex-end;
  align-items: center;
  gap: .35rem;
  display: flex;
}

.users-modal__you {
  color: var(--muted);
  font-size: .78rem;
}

@media (max-width: 560px) {
  .users-modal__table thead {
    display: none;
  }

  .users-modal__table tr {
    border-bottom: 1px solid var(--line);
    gap: .45rem;
    padding: .65rem 0;
    display: grid;
  }

  .users-modal__table td {
    border: none;
    padding: 0;
    display: block;
  }

  .users-modal__actions {
    justify-content: flex-start;
  }
}

/* [project]/libs/modules/workspace/src/WorkspaceSettingsModal.css [app-client] (css) */
.ws-settings-modal {
  flex-direction: column;
  width: min(820px, 100%);
  max-height: min(90vh, 760px);
  display: flex;
  overflow: hidden;
}

.workspace-settings-page {
  width: min(100%, 76rem);
  margin-inline: auto;
  padding: 1rem 0 3rem;
}

.workspace-settings-page__header {
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  margin-bottom: 1.5rem;
  display: flex;
}

.workspace-settings-page__eyebrow {
  color: var(--color-muted);
  font-size: var(--text-sm);
  margin: 0 0 .35rem;
}

.workspace-settings-page__header h1 {
  color: var(--color-ink);
  margin: 0;
  font-size: clamp(1.55rem, 3vw, 2.2rem);
}

.ws-settings-page-panel {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  width: 100%;
  min-height: 36rem;
  max-height: none;
  box-shadow: var(--shadow-sm);
  border-radius: 1.25rem;
}

.ws-settings-page-panel > .panel-head {
  border-bottom: 1px solid var(--color-line);
  margin: 0;
  padding: 1.25rem 1.4rem;
}

.ws-settings-page-panel > .panel-head h2 {
  font-size: var(--text-lg);
}

.ws-settings-page-panel .ws-settings-modal__body {
  min-height: 32rem;
}

.ws-settings-page-panel .ws-settings-modal__nav {
  background: var(--color-paper);
  padding: 1rem;
}

.ws-settings-page-panel .ws-settings-modal__nav-btn {
  min-height: 2.75rem;
  padding-inline: .8rem;
}

.ws-settings-page-panel .ws-settings-modal__main {
  padding: 1.5rem;
}

.ws-settings-page-panel .ws-settings-modal__section-title {
  font-size: 1.1rem;
}

@media (max-width: 720px) {
  .workspace-settings-page {
    padding-top: .25rem;
  }

  .workspace-settings-page__header {
    align-items: start;
  }

  .ws-settings-page-panel {
    border-radius: 1rem;
    min-height: 0;
  }

  .ws-settings-page-panel .ws-settings-modal__body {
    min-height: 0;
  }
}

.workspaces-page {
  width: min(100%, 76rem);
  margin-inline: auto;
  padding: 1rem 0 3rem;
}

.workspaces-page__header {
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  margin-bottom: 1.75rem;
  display: flex;
}

.workspaces-page__header p {
  color: var(--color-muted);
  font-size: var(--text-sm);
  margin: 0 0 .35rem;
}

.workspaces-page__header h1 {
  color: var(--color-ink);
  margin: 0;
  font-size: clamp(1.55rem, 3vw, 2.2rem);
}

.workspaces-page__settings {
  color: var(--color-accent-deep);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
}

.workspaces-page__grid {
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 1rem;
  display: grid;
}

.workspace-card {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  width: 100%;
  min-height: 8rem;
  box-shadow: var(--shadow-sm);
  color: var(--color-ink);
  font: inherit;
  text-align: start;
  cursor: pointer;
  transition: border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out);
  border-radius: 1rem;
  align-items: center;
  gap: 1rem;
  padding: 1.2rem;
  display: flex;
}

.workspace-card:hover {
  box-shadow: var(--shadow-md);
  border-color: #3d66d073;
  border-color: lab(44.8533% 13.5164 -60.1598 / .45);
  transform: translateY(-2px);
}

.workspace-card.is-active {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-subtle), var(--shadow-sm);
}

.workspace-card__mark {
  background: var(--color-accent);
  height: 3rem;
  color: var(--color-on-accent);
  font-size: var(--text-lg);
  border-radius: .85rem;
  flex: 0 0 3rem;
  place-items: center;
  font-weight: 800;
  display: grid;
}

.workspace-card__body {
  gap: .35rem;
  min-width: 0;
  display: grid;
}

.workspace-card__body strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.workspace-card__body span {
  color: var(--color-muted);
  font-size: var(--text-sm);
}

.workspace-card__state {
  color: var(--color-accent-deep);
  font-size: var(--text-xs);
  white-space: nowrap;
  margin-inline-start: auto;
  font-weight: 700;
}

.workspaces-page__skeleton {
  background: linear-gradient(90deg, var(--color-line), var(--color-accent-subtle), var(--color-line));
  background-size: 200% 100%;
  border-radius: 1rem;
  height: 8rem;
  animation: 1.2s ease-in-out infinite workspace-skeleton;
}

@keyframes workspace-skeleton {
  to {
    background-position: -200% 0;
  }
}

@media (max-width: 560px) {
  .workspaces-page__header {
    flex-direction: column;
    align-items: start;
  }

  .workspaces-page__grid {
    grid-template-columns: 1fr;
  }
}

.goals-page {
  width: min(100%, 70rem);
  margin-inline: auto;
  padding: 1rem 0 3rem;
}

.goals-page__header {
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  margin-bottom: 1.25rem;
  display: flex;
}

.goals-page__header p {
  color: var(--color-muted);
  font-size: var(--text-sm);
  margin: 0 0 .3rem;
}

.goals-page__header h1 {
  margin: 0;
  font-size: clamp(1.6rem, 3vw, 2.25rem);
}

.goals-page__header .ui-field__label {
  display: none;
}

.goals-page__header .ui-select {
  min-width: 12rem;
}

.goals-overview {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  border-radius: 1rem;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem 1.2rem;
  display: flex;
}

.goals-overview div {
  gap: .15rem;
  display: grid;
}

.goals-overview span {
  color: var(--color-muted);
  font-size: var(--text-xs);
}

.goals-overview strong {
  font-size: var(--text-lg);
}

.goals-overview button {
  color: var(--color-accent-deep);
  font: inherit;
  font-size: var(--text-sm);
  cursor: pointer;
  background: none;
  border: 0;
  margin-inline-start: auto;
  font-weight: 700;
}

.goals-advanced {
  border: 1px solid var(--color-line);
  background: #ffffffbf;
  background: lab(100% 0 0 / .75);
  border-radius: 1rem;
  gap: .9rem;
  margin-bottom: 1.25rem;
  padding: 1rem;
  display: grid;
}

.goals-advanced__tabs {
  border-bottom: 1px solid var(--color-line);
  gap: .35rem;
  padding-bottom: .75rem;
  display: flex;
}

.goals-advanced__tab {
  color: var(--color-muted);
  font: inherit;
  font-size: var(--text-sm);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: .65rem;
  padding: .55rem .9rem;
  font-weight: 700;
  transition: background .2s, color .2s;
}

.goals-advanced__tab:hover, .goals-advanced__tab.is-active {
  color: var(--color-accent-deep);
  background: var(--color-accent-subtle);
}

.goals-advanced__panel {
  align-items: end;
  min-height: 4.8rem;
  display: grid;
}

.goals-advanced form {
  flex-wrap: wrap;
  align-items: end;
  gap: .65rem;
  display: flex;
}

.goals-advanced .ui-field {
  flex: 11rem;
}

.goals-field-label {
  align-items: center;
  gap: .35rem;
  display: inline-flex;
}

.goals-field-help {
  width: 1.05rem;
  height: 1.05rem;
  color: var(--color-accent-deep);
  cursor: help;
  border: 1px solid;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  font-size: .7rem;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  position: relative;
}

.goals-field-help__tooltip {
  z-index: 10;
  border: 1px solid var(--color-line);
  width: min(19rem, 70vw);
  color: var(--color-ink);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-md);
  font-size: var(--text-xs);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  border-radius: .7rem;
  padding: .7rem .8rem;
  font-weight: 500;
  line-height: 1.8;
  transition: opacity .15s, transform .15s, visibility .15s;
  position: absolute;
  inset-block-start: calc(100% + .55rem);
  inset-inline-end: 0;
  transform: translateY(-.25rem);
}

.goals-field-help:hover .goals-field-help__tooltip, .goals-field-help:focus .goals-field-help__tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.goals-page__error {
  background: var(--color-danger-subtle);
  color: var(--color-danger);
  border-radius: .75rem;
  padding: .75rem 1rem;
}

.goals-advanced .goals-key-result-form {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  display: grid;
}

.goals-key-result-form > :first-child, .goals-key-result-form > :nth-child(2) {
  grid-column: 1 / -1;
}

.goals-key-result-form > .ui-button {
  width: 100%;
}

.objectives-list {
  gap: 1rem;
  display: grid;
}

.objective-card {
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  box-shadow: var(--shadow-sm);
  border-radius: 1rem;
  padding: 1.25rem;
}

.objective-card header {
  align-items: start;
  gap: 1rem;
  display: flex;
}

.objective-card h2 {
  margin: 0;
  font-size: 1.1rem;
}

.objective-card p {
  color: var(--color-muted);
  font-size: var(--text-sm);
  margin: .3rem 0 0;
}

.objective-card header > strong {
  color: var(--color-accent-deep);
  font-size: var(--text-lg);
  margin-inline-start: auto;
}

.objective-card__status {
  color: #16876e;
  font-size: var(--text-xs);
  white-space: nowrap;
  background: #e6faf4;
  border-radius: 999px;
  padding: .3rem .6rem;
  font-weight: 700;
}

.objective-card__status.at_risk {
  color: #b77610;
  background: #fff4df;
}

.objective-card__status.off_track {
  color: #c43846;
  background: #fff0f1;
}

.objective-card__bar, .key-result__progress {
  background: var(--color-line);
  border-radius: 99px;
  height: .45rem;
  overflow: hidden;
}

.objective-card__bar {
  margin: 1rem 0;
}

.objective-card__bar span, .key-result__progress > span {
  border-radius: inherit;
  background: var(--color-accent);
  height: 100%;
  display: block;
}

.key-results {
  gap: .75rem;
  display: grid;
}

.key-result {
  border-top: 1px solid var(--color-line);
  grid-template-columns: minmax(0, 1fr) minmax(9rem, .8fr) 5rem;
  align-items: center;
  gap: 1rem;
  padding-top: .75rem;
  display: grid;
}

.key-result div:first-child {
  gap: .2rem;
  display: grid;
}

.key-result div:first-child span {
  color: var(--color-muted);
  font-size: var(--text-xs);
}

.key-result__progress {
  position: relative;
}

.key-result__progress b {
  color: var(--color-muted);
  font-size: .68rem;
  position: absolute;
  inset-block-start: -.1rem;
  inset-inline-end: 0;
  transform: translateY(-100%);
}

.key-result input {
  border: 1px solid var(--color-line);
  background: var(--color-paper);
  width: 100%;
  min-height: 2.25rem;
  font: inherit;
  border-radius: .55rem;
  padding-inline: .55rem;
}

@media (max-width: 720px) {
  .goals-page__header {
    flex-direction: column;
    align-items: start;
  }

  .goals-overview {
    flex-wrap: wrap;
    align-items: start;
  }

  .goals-overview button {
    text-align: start;
    width: 100%;
    margin-inline-start: 0;
  }

  .goals-advanced__tabs {
    overflow-x: auto;
  }

  .goals-advanced__tab {
    white-space: nowrap;
    flex: 1 0 auto;
  }

  .goals-advanced .goals-key-result-form {
    grid-template-columns: 1fr;
  }

  .goals-key-result-form > :first-child, .goals-key-result-form > :nth-child(2) {
    grid-column: auto;
  }

  .key-result {
    grid-template-columns: 1fr;
    gap: .6rem;
  }

  .key-result__progress {
    margin-top: .8rem;
  }
}

.ws-settings-modal__body {
  flex: 1;
  grid-template-columns: 10.5rem minmax(0, 1fr);
  min-height: 0;
  display: grid;
}

.ws-settings-modal__nav {
  border-inline-end: 1px solid var(--line);
  background: #ffffff73;
  flex-direction: column;
  gap: .35rem;
  padding: .75rem;
  display: flex;
}

.ws-settings-modal__nav-btn {
  width: 100%;
  color: var(--ink-soft);
  font: inherit;
  text-align: start;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 10px;
  padding: .55rem .65rem;
  font-size: .84rem;
  font-weight: 600;
  transition: background .12s, color .12s;
}

.ws-settings-modal__nav-btn:hover {
  color: var(--accent-deep);
  background: #0f766e14;
}

.ws-settings-modal__nav-btn.is-active {
  color: var(--accent-deep);
  background: #0f766e1f;
  border-color: #0f766e38;
}

.ws-settings-modal__main {
  min-width: 0;
  padding: .85rem 1rem 1rem;
  overflow-y: auto;
}

.ws-settings-modal__section-title {
  margin: 0 0 .75rem;
  font-size: 1rem;
  font-weight: 700;
}

.ws-settings-modal__readonly {
  color: var(--ink-soft);
  background: #f0fdfabf;
  border: 1px solid #0f766e2e;
  border-radius: 10px;
  margin: 0 1rem .85rem;
  padding: .65rem .75rem;
  font-size: .84rem;
  line-height: 1.5;
}

.ws-settings-general {
  gap: .85rem;
  display: grid;
}

.ws-settings-general__rename {
  flex-wrap: wrap;
  align-items: end;
  gap: .45rem;
  display: flex;
}

.ws-settings-general__rename .ui-field {
  flex: 1;
  min-width: 12rem;
}

.ws-settings-general__meta {
  flex-wrap: wrap;
  gap: .45rem;
  display: flex;
}

.ws-settings-general__meta-card {
  border: 1px solid var(--line);
  background: #ffffffc7;
  border-radius: 12px;
  gap: .12rem;
  min-width: 7rem;
  padding: .65rem .75rem;
  display: grid;
}

.ws-settings-general__meta-card span {
  color: var(--muted);
  font-size: .74rem;
}

.ws-settings-general__meta-card strong {
  font-size: .92rem;
}

.ws-members {
  gap: .85rem;
  display: grid;
}

.ws-members__add {
  flex-wrap: wrap;
  align-items: end;
  gap: .45rem;
  display: flex;
}

.ws-members__add .ui-field {
  flex: 1;
  min-width: 10rem;
}

.ws-members__table {
  border-collapse: collapse;
  width: 100%;
}

.ws-members__table th, .ws-members__table td {
  text-align: start;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
  padding: .55rem .45rem;
}

.ws-members__table th {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 700;
}

.ws-members__user {
  align-items: center;
  gap: .5rem;
  min-width: 0;
  display: flex;
}

.ws-members__avatar {
  width: 1.85rem;
  height: 1.85rem;
  color: var(--accent-deep);
  text-transform: uppercase;
  background: #0f766e24;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  font-size: .68rem;
  font-weight: 800;
  display: inline-flex;
}

.ws-members__email {
  color: var(--muted);
  font-size: .74rem;
  display: block;
}

.ws-members__actions {
  justify-content: flex-end;
  align-items: center;
  gap: .25rem;
  display: flex;
}

.ws-members__role-readonly {
  color: var(--ink-soft);
  font-size: .84rem;
  font-weight: 600;
}

@media (max-width: 720px) {
  .ws-settings-modal__body {
    grid-template-columns: 1fr;
  }

  .ws-settings-modal__nav {
    border-inline-end: 0;
    border-bottom: 1px solid var(--line);
    flex-direction: row;
    overflow-x: auto;
  }

  .ws-settings-modal__nav-btn {
    white-space: nowrap;
    width: auto;
  }

  .ws-members__table thead {
    display: none;
  }

  .ws-members__table tr {
    border-bottom: 1px solid var(--line);
    gap: .35rem;
    padding: .65rem 0;
    display: grid;
  }

  .ws-members__table td {
    border-bottom: 0;
    padding: 0;
  }
}

.workspaces-page__archive-toggle {
  color: var(--color-muted);
  align-items: center;
  gap: .5rem;
  margin-bottom: 1rem;
  display: flex;
}

.workspace-card {
  cursor: default;
  position: relative;
}

.workspace-card:focus-within {
  z-index: 6;
}

.workspace-card__select {
  min-width: 0;
  color: inherit;
  font: inherit;
  text-align: start;
  cursor: pointer;
  background: none;
  border: 0;
  flex: 1;
  align-self: stretch;
  align-items: center;
  gap: 1rem;
  padding: 0;
  display: flex;
}

.workspace-card__select:disabled {
  cursor: default;
}

.workspace-card__menu {
  align-self: flex-start;
  position: relative;
}

.workspace-card__menu[open] {
  z-index: 5;
}

.workspace-card__menu summary {
  cursor: pointer;
  border-radius: .5rem;
  place-items: center;
  width: 2rem;
  height: 2rem;
  font-size: 1.5rem;
  list-style: none;
  display: grid;
}

.workspace-card__menu summary::-webkit-details-marker {
  display: none;
}

.workspace-card__menu summary:hover {
  background: var(--color-accent-subtle);
}

.workspace-card__menu-items {
  inset-inline-end: 0;
  border: 1px solid var(--color-line);
  background: var(--color-surface-solid);
  min-width: 11rem;
  box-shadow: var(--shadow-md);
  border-radius: .65rem;
  padding: .35rem;
  position: absolute;
  top: 2.25rem;
}

.workspace-card__menu-items button {
  width: 100%;
  color: var(--color-ink);
  font: inherit;
  text-align: start;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: .35rem;
  padding: .6rem .75rem;
  display: block;
}

.workspace-card__menu-items button:hover {
  background: var(--color-accent-subtle);
}

.workspace-card__menu-items button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.workspace-card__menu-items .is-danger {
  color: var(--color-danger, #c33);
}

.workspace-card__menu-items small {
  color: var(--color-muted);
  padding: .5rem;
  display: block;
}

/* [project]/libs/core/ui/src/Toast.css [app-client] (css) */
.ui-toast-stack {
  bottom: var(--space-4, 1rem);
  z-index: var(--z-toast);
  pointer-events: none;
  flex-direction: column-reverse;
  gap: .5rem;
  width: min(22rem, 100vw - 2rem);
  display: flex;
  position: fixed;
  inset-inline-end: var(--space-4, 1rem);
}

.ui-toast {
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
  pointer-events: auto;
  background: #fffffff5;
  border-radius: 12px;
  align-items: flex-start;
  gap: .55rem;
  padding: .75rem .85rem;
  display: flex;
}

.ui-toast__icon {
  flex-shrink: 0;
  margin-top: .1rem;
  display: flex;
}

.ui-toast__body {
  min-width: 0;
  color: var(--ink);
  flex: 1;
  font-size: .88rem;
  line-height: 1.45;
}

.ui-toast__close {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  background: none;
  border: 0;
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.ui-toast__close:hover {
  color: var(--ink-soft);
  background: #1a242114;
}

.ui-toast.is-success {
  background: #ecfdf5f7;
  border-color: #05966947;
}

.ui-toast.is-success .ui-toast__icon {
  color: #059669;
}

.ui-toast.is-error {
  background: #fef2f2f7;
  border-color: #dc262647;
}

.ui-toast.is-error .ui-toast__icon {
  color: #dc2626;
}

.ui-toast.is-info {
  background: #f0fdfaf7;
  border-color: #0f766e38;
}

.ui-toast.is-info .ui-toast__icon {
  color: var(--accent-deep);
}

@media (max-width: 767px) {
  .ui-toast-stack {
    bottom: calc(var(--mobile-nav-height, 3.75rem) + var(--safe-bottom, 0px) + var(--space-2, .5rem));
    inset-inline-end: calc(var(--space-3, .75rem) + var(--safe-right, 0px));
  }
}

/*# sourceMappingURL=_1cq0z7s._.css.map*/