/* /Components/Features/Auditing/Components/AuditHistory.razor.rz.scp.css */
.ah-root[b-q896y9ijjz] {
    --ah-ink: #14243a;
    --ah-muted: #64748b;
    --ah-line: #e4e9f1;
    --ah-soft: #f7f9fc;
    --ah-indigo: #4f46e5;
    --ah-teal: #0d9488;
    color: var(--ah-ink);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
}

.ah-timeline[b-q896y9ijjz] {
    position: relative;
    display: grid;
    gap: 9px;
}

    .ah-timeline[b-q896y9ijjz]::before {
        content: "";
        position: absolute;
        top: 16px;
        bottom: 16px;
        left: 16px;
        width: 1px;
        background: var(--ah-line);
    }

.ah-event[b-q896y9ijjz] {
    position: relative;
    padding: 12px 14px 12px 45px;
    border: 1px solid var(--ah-line);
    border-radius: 7px;
    background: #fff;
    transition: border-color .18s, box-shadow .18s;
}

    .ah-event:hover[b-q896y9ijjz] {
        border-color: #cfd8e6;
        box-shadow: 0 8px 22px -20px rgba(20, 36, 58, .55);
    }

.ah-event__top[b-q896y9ijjz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.ah-event__heading[b-q896y9ijjz] {
    display: contents;
}

    .ah-event__heading > div[b-q896y9ijjz] {
        min-width: 0;
    }

.ah-event h3[b-q896y9ijjz] {
    margin: 0;
    color: var(--ah-ink);
    font-size: .81rem;
    font-weight: 730;
    line-height: 1.35;
}

.ah-actor[b-q896y9ijjz] {
    margin: 3px 0 0;
    color: var(--ah-muted);
    font-size: .69rem;
}

.ah-time[b-q896y9ijjz] {
    flex: 0 0 auto;
    color: #8795a8;
    font-size: .66rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.ah-action[b-q896y9ijjz] {
    position: absolute;
    top: 11px;
    left: 5px;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border: 3px solid #fff;
    border-radius: 50%;
    font-size: .8rem;
    font-weight: 800;
}

.ah-action--create[b-q896y9ijjz] {
    color: #087967;
    background: #dff5ee;
}

.ah-action--update[b-q896y9ijjz] {
    color: var(--ah-indigo);
    background: #e9e8ff;
}

.ah-action--delete[b-q896y9ijjz] {
    color: #b42318;
    background: #fee9e7;
}

.ah-changes[b-q896y9ijjz] {
    display: grid;
    gap: 5px;
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px solid #edf1f5;
}

.ah-change[b-q896y9ijjz] {
    display: grid;
    grid-template-columns: minmax(90px, 130px) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 25px;
}

.ah-change__field[b-q896y9ijjz] {
    overflow: hidden;
    color: var(--ah-muted);
    font-size: .67rem;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ah-change__values[b-q896y9ijjz] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.ah-value[b-q896y9ijjz] {
    overflow: hidden;
    max-width: min(260px, 42%);
    padding: 3px 6px;
    border-radius: 4px;
    font-size: .67rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ah-value--old[b-q896y9ijjz] {
    color: #7a4650;
    background: #fff1f2;
}

.ah-value--new[b-q896y9ijjz] {
    color: #087967;
    background: #eaf8f3;
}

.ah-value__arrow[b-q896y9ijjz] {
    color: #9aa7b7;
    font-size: .7rem;
}

.ah-state[b-q896y9ijjz] {
    display: flex;
    min-height: 112px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 18px;
    border: 1px dashed #d8e0ea;
    border-radius: 7px;
    color: var(--ah-muted);
    background: var(--ah-soft);
    text-align: center;
}

    .ah-state strong[b-q896y9ijjz] {
        color: var(--ah-ink);
        font-size: .8rem;
    }

    .ah-state p[b-q896y9ijjz] {
        max-width: 430px;
        margin: 0;
        font-size: .7rem;
        line-height: 1.45;
    }

.ah-state--error[b-q896y9ijjz] {
    border-color: #fecaca;
    background: #fff7f7;
}

.ah-empty-icon[b-q896y9ijjz] {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    border-radius: 6px;
    color: var(--ah-indigo);
    background: #ecebff;
    font-size: 1rem;
}

.ah-spinner[b-q896y9ijjz] {
    width: 23px;
    height: 23px;
    border: 2px solid #d9deff;
    border-top-color: var(--ah-indigo);
    border-radius: 50%;
    animation: ah-spin-b-q896y9ijjz .75s linear infinite;
}

.ah-limit[b-q896y9ijjz] {
    margin: 9px 0 0;
    color: var(--ah-muted);
    font-size: .67rem;
    text-align: right;
}

@keyframes ah-spin-b-q896y9ijjz {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 620px) {
    .ah-event[b-q896y9ijjz] {
        padding-right: 11px;
    }

    .ah-event__top[b-q896y9ijjz] {
        flex-direction: column;
        gap: 4px;
    }

    .ah-time[b-q896y9ijjz] {
        white-space: normal;
    }

    .ah-change[b-q896y9ijjz] {
        grid-template-columns: 1fr;
        gap: 3px;
    }

    .ah-value[b-q896y9ijjz] {
        max-width: 43%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ah-root *[b-q896y9ijjz], .ah-root *[b-q896y9ijjz]::before, .ah-root *[b-q896y9ijjz]::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }
}
/* /Components/Features/Profile/Components/ProfileProjects.razor.rz.scp.css */
.profile-projects[b-iiwmoz21zn] { padding: 26px 30px; margin-top: 20px; }
.profile-projects-heading[b-iiwmoz21zn] { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.profile-projects-heading > div[b-iiwmoz21zn] { min-width: 0; flex: 1; }
.profile-projects-heading h2[b-iiwmoz21zn] { margin: 0 0 6px; font-size: 1.1rem; font-weight: 650; }
.profile-projects-heading p[b-iiwmoz21zn] { margin: 0; color: var(--profile-muted); font-size: .85rem; }
.profile-project-count[b-iiwmoz21zn] { padding: 5px 9px; background: var(--profile-wash); border-radius: 10px; color: var(--profile-muted); font-size: .75rem; white-space: nowrap; }
.profile-project-filters[b-iiwmoz21zn] { display: flex; flex-wrap: wrap; gap: 5px; width: fit-content; max-width: 100%; padding: 5px; border: 1px solid var(--profile-edge); border-radius: 18px; background: var(--profile-wash); box-shadow: inset 0 1px 0 var(--profile-shine); margin-bottom: 18px; }
.profile-project-summary[b-iiwmoz21zn] { margin: 0 0 22px; padding: 12px 14px; border-radius: 14px; background: var(--profile-wash); }
.profile-project-summary p[b-iiwmoz21zn] { margin: 0; color: var(--profile-muted); font-size: .75rem; line-height: 1.6; }
.profile-project-summary p:first-child[b-iiwmoz21zn] { margin-bottom: 4px; color: var(--profile-ink); font-weight: 600; }
.profile-project-filter[b-iiwmoz21zn], .profile-project-button[b-iiwmoz21zn] { padding: 8px 12px; border: 1px solid var(--profile-line); border-radius: 14px; background: var(--profile-surface); color: var(--profile-ink); font: inherit; font-size: .8rem; cursor: pointer; }
.profile-project-filter span[b-iiwmoz21zn] { margin-left: 6px; font-size: .75rem; }
.profile-project-filter[aria-pressed=true][b-iiwmoz21zn] { background: var(--profile-tint); color: var(--profile-blue); border-color: var(--profile-line); }
.profile-project-filter:hover[b-iiwmoz21zn], .profile-project-button:hover[b-iiwmoz21zn] { background: var(--profile-wash); }
.profile-project-filter:focus-visible[b-iiwmoz21zn], .profile-project-button:focus-visible[b-iiwmoz21zn], .profile-project-link:focus-visible[b-iiwmoz21zn] { outline: 3px solid var(--profile-blue); outline-offset: 3px; }
.profile-project-button:disabled[b-iiwmoz21zn] { opacity: .5; cursor: not-allowed; }
.profile-project-list[b-iiwmoz21zn] { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.profile-project-row[b-iiwmoz21zn] { border: 1px solid var(--profile-line); border-radius: 16px; padding: 20px; background: linear-gradient(145deg,var(--profile-surface),var(--profile-wash)); box-shadow: inset 0 1px 0 var(--profile-shine); }
.profile-project-top[b-iiwmoz21zn] { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.profile-project-title[b-iiwmoz21zn] { min-width: 0; }
.profile-project-title h3[b-iiwmoz21zn] { font-size: .95rem; font-weight: 600; margin: 0 0 5px; overflow-wrap: anywhere; }
.profile-project-title p[b-iiwmoz21zn] { margin: 0; font-size: .8rem; color: var(--profile-muted); overflow-wrap: anywhere; }
.profile-project-status[b-iiwmoz21zn] { padding: 4px 8px; border-radius: 10px; font-size: .7rem; white-space: nowrap; }
.profile-project-status.is-active[b-iiwmoz21zn] { background: var(--profile-success-wash); color: var(--profile-green); }
.profile-project-status.is-inactive[b-iiwmoz21zn] { background: var(--profile-wash); color: var(--profile-muted); }
.profile-project-dates[b-iiwmoz21zn] { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 18px 32px; margin: 18px 0 14px; }
.profile-project-dates dt[b-iiwmoz21zn] { font-size: .75rem; color: var(--profile-muted); font-weight: 400; }
.profile-project-dates dd[b-iiwmoz21zn] { margin: 6px 0 0; font-size: .8rem; overflow-wrap: anywhere; }
.profile-assignment-status[b-iiwmoz21zn] { display: inline-block; margin-left: 6px; color: var(--profile-blue); font-size: .7rem; }
.profile-project-link[b-iiwmoz21zn] { display: inline-flex; align-items: center; gap: 6px; color: var(--profile-blue); font-size: .8rem; font-weight: 600; text-decoration: none; }
.profile-project-link:hover[b-iiwmoz21zn] { text-decoration: underline; }
.profile-project-link .material-icons[b-iiwmoz21zn] { font-size: 16px; }
.profile-project-message[b-iiwmoz21zn] { color: var(--profile-muted); font-size: .85rem; margin: 0; }
.profile-project-message p[b-iiwmoz21zn] { margin: 0 0 14px; }
.profile-project-empty[b-iiwmoz21zn] { padding: 14px 0; text-align: center; }
.profile-project-empty > .material-icons[b-iiwmoz21zn] { font-size: 28px; color: var(--profile-blue); margin-bottom: 10px; }
.profile-project-empty h3[b-iiwmoz21zn] { font-size: .95rem; margin: 0 0 8px; }
.profile-project-empty p[b-iiwmoz21zn] { color: var(--profile-muted); font-size: .8rem; margin: 0; }
.profile-project-pagination[b-iiwmoz21zn] { display: flex; align-items: center; justify-content: flex-end; gap: 12px; border-top: 1px solid var(--profile-line); padding-top: 20px; margin-top: 24px; }
.profile-project-pagination span[b-iiwmoz21zn] { font-size: .75rem; color: var(--profile-muted); }
@media (max-width: 640px) {
    .profile-projects[b-iiwmoz21zn] { padding: 22px 20px; }
    .profile-project-dates[b-iiwmoz21zn] { grid-template-columns: minmax(0,1fr); }
    .profile-project-pagination[b-iiwmoz21zn] { justify-content: space-between; gap: 8px; }
    .profile-projects-heading[b-iiwmoz21zn] { flex-wrap: wrap; }
    .profile-project-count[b-iiwmoz21zn] { margin-left: 52px; }
    .profile-project-row[b-iiwmoz21zn] { padding: 16px; }
}
/* /Components/Features/Profile/Components/ProfileSecurity.razor.rz.scp.css */
.profile-security[b-7olp6o6uf9] { padding: 26px 30px; margin-top: 20px; }
.profile-security-heading[b-7olp6o6uf9] { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.profile-security-heading h2[b-7olp6o6uf9] { margin: 0 0 6px; font-size: 1.1rem; font-weight: 650; }
.profile-security-heading p[b-7olp6o6uf9] { margin: 0; color: var(--profile-muted); font-size: .85rem; }
.profile-security-heading > div[b-7olp6o6uf9] { min-width: 0; flex: 1; }
.profile-security-primary[b-7olp6o6uf9], .profile-security-cancel[b-7olp6o6uf9] { border: 1px solid var(--profile-blue); border-radius: 14px; padding: 10px 16px; background: var(--profile-blue); color: #fff; font: inherit; font-size: .85rem; cursor: pointer; }
.profile-security-primary:hover[b-7olp6o6uf9] { background: var(--profile-blue); }
.profile-security-cancel[b-7olp6o6uf9] { background: var(--profile-surface); border-color: var(--profile-line); color: var(--profile-ink); }
.profile-security-cancel:hover[b-7olp6o6uf9] { background: var(--profile-wash); }
.profile-security-field[b-7olp6o6uf9] { max-width: 520px; margin-bottom: 20px; }
.profile-security-field label[b-7olp6o6uf9] { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 8px; }
.profile-security-field input[b-7olp6o6uf9] { width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--profile-line); border-radius: 14px; padding: 10px 12px; font: inherit; font-size: .85rem; color: var(--profile-ink); background: var(--profile-surface); box-shadow: inset 0 1px 0 var(--profile-shine); }
.profile-security-field p[b-7olp6o6uf9] { font-size: .75rem; color: var(--profile-muted); margin: 8px 0 0; line-height: 1.6; }
.profile-security-show[b-7olp6o6uf9] { border: 0; background: transparent; color: var(--profile-blue); padding: 0; font: inherit; font-size: .8rem; cursor: pointer; }
.profile-security-note[b-7olp6o6uf9] { font-size: .75rem; color: var(--profile-muted); margin: 18px 0 0; line-height: 1.6; }
.profile-security-actions[b-7olp6o6uf9] { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; padding-top: 20px; border-top: 1px solid var(--profile-line); margin-top: 22px; }
.profile-security-error[b-7olp6o6uf9] {
    --feedback-accent: var(--profile-danger);
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 22px;
    padding: 16px 18px;
    border: 1px solid color-mix(in srgb, var(--feedback-accent) 24%, var(--profile-edge));
    border-radius: 20px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--feedback-accent) 6%, var(--profile-surface)), var(--profile-wash));
    box-shadow: var(--profile-shadow);
    backdrop-filter: blur(22px) saturate(145%);
    -webkit-backdrop-filter: blur(22px) saturate(145%);
    font-size: .85rem;
}
.profile-security-error.is-warning[b-7olp6o6uf9] { --feedback-accent: var(--profile-amber); }
.profile-security-error > .material-icons[b-7olp6o6uf9] {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border: 1px solid color-mix(in srgb, var(--feedback-accent) 22%, var(--profile-edge));
    border-radius: 12px;
    background: color-mix(in srgb, var(--feedback-accent) 10%, transparent);
    color: var(--feedback-accent);
    font-size: 21px;
}
.profile-security-error > div[b-7olp6o6uf9] { min-width: 0; overflow-wrap: anywhere; }
.profile-security-error strong[b-7olp6o6uf9] { display: block; margin-bottom: 4px; color: var(--feedback-accent); font-weight: 650; }
.profile-security-error p[b-7olp6o6uf9] { margin: 0; color: var(--profile-muted); line-height: 1.6; }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .profile-security-error[b-7olp6o6uf9] { background: var(--profile-solid); }
}
@media (prefers-reduced-transparency: reduce) {
    .profile-security-error[b-7olp6o6uf9] { background: var(--profile-solid); backdrop-filter: none; -webkit-backdrop-filter: none; }
}
.profile-security-field input[aria-invalid="true"][b-7olp6o6uf9] { border-color: var(--profile-danger); }
.profile-security button:focus-visible[b-7olp6o6uf9], .profile-security input:focus-visible[b-7olp6o6uf9] { outline: 3px solid var(--profile-blue); outline-offset: 3px; }
@media (max-width: 640px) { .profile-security[b-7olp6o6uf9] { padding: 22px 20px; } }
/* /Components/Features/Profile/Components/ProfileWorkSummary.razor.rz.scp.css */
.profile-work[b-2nnms3j7gn] { padding: 26px 30px; margin-top: 20px; }
.profile-work-heading[b-2nnms3j7gn], .profile-work-priority-heading[b-2nnms3j7gn] { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.profile-work-heading > div[b-2nnms3j7gn], .profile-work-priority-heading > div[b-2nnms3j7gn] { min-width: 0; flex: 1; }
.profile-work-heading h2[b-2nnms3j7gn] { margin: 0 0 6px; font-size: 1.1rem; font-weight: 650; }
.profile-work-heading p[b-2nnms3j7gn], .profile-work-priority-heading p[b-2nnms3j7gn] { color: var(--profile-muted); font-size: .85rem; margin: 0; }
.profile-work-date[b-2nnms3j7gn] { padding: 5px 9px; color: var(--profile-muted); background: var(--profile-wash); border-radius: 10px; font-size: .75rem; }
.profile-work-metrics[b-2nnms3j7gn] { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0; gap: 12px; }
.profile-work-metrics > div[b-2nnms3j7gn] { min-width: 0; padding: 18px; border: 1px solid var(--profile-edge); border-radius: 16px; background: linear-gradient(145deg,var(--profile-surface),var(--profile-wash)); box-shadow: inset 0 1px 0 var(--profile-shine); }
.profile-work-metrics dt[b-2nnms3j7gn] { color: var(--profile-muted); font-size: .75rem; font-weight: 500; }
.profile-work-metrics dd[b-2nnms3j7gn] { color: var(--profile-blue); font-size: 1.8rem; font-weight: 650; margin: 8px 0; }
.profile-work-metrics span[b-2nnms3j7gn] { display: block; font-size: .7rem; color: var(--profile-muted); line-height: 1.5; }
.profile-work-attention dd[b-2nnms3j7gn] { color: var(--profile-amber); }
.profile-work-scope[b-2nnms3j7gn] { color: var(--profile-muted); font-size: .75rem; line-height: 1.7; margin: 22px 0; }
.profile-work-effort[b-2nnms3j7gn] { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; padding: 18px; background: var(--profile-wash); border: 1px solid var(--profile-line); border-radius: 16px; }
.profile-work-effort h3[b-2nnms3j7gn] { margin: 0 0 10px; color: var(--profile-muted); font-size: .8rem; font-weight: 500; }
.profile-work-effort strong[b-2nnms3j7gn] { font-size: 1.15rem; font-weight: 600; }
.profile-work-effort p[b-2nnms3j7gn] { color: var(--profile-muted); font-size: .7rem; margin: 8px 0 0; line-height: 1.6; }
.profile-work-rules[b-2nnms3j7gn] { color: var(--profile-muted); font-size: .75rem; margin: 18px 0 24px; }
.profile-work-rules summary[b-2nnms3j7gn] { cursor: pointer; color: var(--profile-blue); }
.profile-work-rules p[b-2nnms3j7gn] { margin: 12px 0 0; line-height: 1.7; }
.profile-work-rules summary:focus-visible[b-2nnms3j7gn], .profile-work-workspace:focus-visible[b-2nnms3j7gn], .profile-work-item-meta a:focus-visible[b-2nnms3j7gn], .profile-work-retry:focus-visible[b-2nnms3j7gn] { outline: 3px solid var(--profile-blue); outline-offset: 3px; }
.profile-work-priority-heading[b-2nnms3j7gn] { border-top: 1px solid var(--profile-line); padding-top: 24px; margin-bottom: 20px; }
.profile-work-priority-heading h3[b-2nnms3j7gn] { font-size: .95rem; margin: 0 0 6px; }
.profile-work-priority-heading p[b-2nnms3j7gn] { font-size: .75rem; }
.profile-work-priority-heading > span[b-2nnms3j7gn] { font-size: .75rem; color: var(--profile-muted); }
.profile-work-priority[b-2nnms3j7gn] { list-style: none; padding: 0; margin: 0; }
.profile-work-priority li[b-2nnms3j7gn] { padding: 18px 0; border-top: 1px solid var(--profile-line); }
.profile-work-priority li:first-child[b-2nnms3j7gn] { padding-top: 0; border-top: 0; }
.profile-work-item-heading[b-2nnms3j7gn] { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.profile-work-item-heading h4[b-2nnms3j7gn] { font-size: .85rem; font-weight: 600; margin: 0; overflow-wrap: anywhere; }
.profile-work-status[b-2nnms3j7gn] { flex-shrink: 0; font-size: .7rem; padding: 4px 8px; background: var(--profile-tint); color: var(--profile-blue); border-radius: 10px; }
.profile-work-priority li > p[b-2nnms3j7gn] { font-size: .75rem; color: var(--profile-muted); margin: 8px 0 12px; overflow-wrap: anywhere; }
.profile-work-item-meta[b-2nnms3j7gn] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: .7rem; color: var(--profile-muted); }
.profile-work-warning[b-2nnms3j7gn] { padding: 3px 7px; border-radius: 10px; color: var(--profile-amber); background: var(--profile-warning-wash); }
.profile-work-item-meta a[b-2nnms3j7gn] { color: var(--profile-blue); margin-left: auto; font-weight: 600; }
.profile-work-workspace[b-2nnms3j7gn] { display: inline-flex; align-items: center; gap: 6px; color: var(--profile-blue); font-size: .8rem; font-weight: 600; margin-top: 20px; text-decoration: none; }
.profile-work-workspace:hover[b-2nnms3j7gn] { text-decoration: underline; }
.profile-work-workspace .material-icons[b-2nnms3j7gn] { font-size: 16px; }
.profile-work-message[b-2nnms3j7gn] { color: var(--profile-muted); font-size: .85rem; margin: 0; }
.profile-work-message p[b-2nnms3j7gn] { margin: 0 0 14px; }
.profile-work-retry[b-2nnms3j7gn] { border: 1px solid var(--profile-blue); border-radius: 14px; padding: 9px 14px; background: var(--profile-blue); color: #fff; font: inherit; font-size: .8rem; cursor: pointer; }
.profile-work-empty[b-2nnms3j7gn] { text-align: center; padding: 14px 0; }
.profile-work-empty > .material-icons[b-2nnms3j7gn] { color: var(--profile-blue); font-size: 28px; margin-bottom: 10px; }
.profile-work-empty h3[b-2nnms3j7gn] { font-size: .95rem; margin: 0 0 8px; }
.profile-work-empty p[b-2nnms3j7gn] { font-size: .8rem; color: var(--profile-muted); margin: 0; }
@media (max-width: 850px) { .profile-work-metrics[b-2nnms3j7gn] { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 640px) {
    .profile-work[b-2nnms3j7gn] { padding: 22px 20px; }
    .profile-work-effort[b-2nnms3j7gn] { grid-template-columns: minmax(0,1fr); }
    .profile-work-item-meta a[b-2nnms3j7gn] { margin-left: 0; }
    .profile-work-heading[b-2nnms3j7gn], .profile-work-priority-heading[b-2nnms3j7gn] { flex-wrap: wrap; }
    .profile-work-date[b-2nnms3j7gn] { margin-left: 52px; }
    .profile-work-metrics > div[b-2nnms3j7gn] { padding: 12px; }
}
/* /Components/Features/Profile/Pages/MyProfile.razor.rz.scp.css */
.profile-page[b-30t85huz4f] {
    width: 100%;
    min-width: 0;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 0 32px;
    color: var(--profile-ink);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
}

.profile-intro[b-30t85huz4f] { display: flex; align-items: center; gap: 14px; padding: 20px 24px; border: 1px solid rgba(210,230,255,.3); border-radius: 28px; background: linear-gradient(115deg,#111a2b,#1e2845 66%,#2d4768); color: #f4f8ff; box-shadow: 0 10px 28px rgba(26,48,64,.09); }
.profile-page-icon[b-30t85huz4f] { display: grid; place-items: center; width: 48px; height: 48px; flex: 0 0 48px; border: 1px solid rgba(112,217,255,.33); border-radius: 16px; background: linear-gradient(135deg,rgba(82,215,255,.13),rgba(195,238,255,.02)); color: #70ddff; box-shadow: inset 0 1px 0 rgba(206,247,255,.15); font-size: 27px; }
.profile-intro h1[b-30t85huz4f] { margin: 0; font-size: clamp(1.6rem, 3vw, 2rem); font-weight: 750; letter-spacing: -.035em; color: #f4f8ff; }
.profile-intro p[b-30t85huz4f] { margin: 3px 0 0; color: #b7cbe2; font-size: .78rem; line-height: 1.6; }
.profile-details-heading p[b-30t85huz4f] { margin: 0; color: var(--profile-muted); font-size: .8rem; line-height: 1.6; }

.profile-hero[b-30t85huz4f] {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 30px 32px;
    border-radius: 20px;
    color: var(--profile-ink);
    margin-bottom: 20px;
}
.profile-avatar[b-30t85huz4f] { display: grid; place-items: center; width: 86px; height: 86px; flex: 0 0 86px; overflow: hidden; border-radius: 50%; background: var(--profile-tint); border: 3px solid var(--profile-edge); font-size: 1.75rem; font-weight: 600; }
.profile-avatar img[b-30t85huz4f] { width: 100%; height: 100%; object-fit: cover; }
.profile-photo-zoom[b-30t85huz4f] { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: zoom-in; }
.profile-photo-zoom:focus-visible[b-30t85huz4f] { outline: 3px solid var(--profile-blue); outline-offset: -4px; }
.profile-zoom-icon[b-30t85huz4f] { position: absolute; right: 8px; bottom: 8px; display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; color: #fff; background: rgba(9,17,31,.8); font-size: 16px; pointer-events: none; }
.profile-photo-viewer[b-30t85huz4f] { width: calc(100% - 32px); max-width: 960px; max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--profile-line); border-radius: 20px; background: var(--profile-surface); color: var(--profile-ink); overflow: auto; }
.profile-photo-viewer[b-30t85huz4f]::backdrop { background: rgba(11,25,51,.5); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.profile-viewer-header[b-30t85huz4f] { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--profile-line); }
.profile-viewer-header h2[b-30t85huz4f] { margin: 0; font-size: 1rem; }
.profile-viewer-close[b-30t85huz4f] { display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; padding: 0; cursor: pointer; }
.profile-viewer-close:focus-visible[b-30t85huz4f] { outline: 3px solid var(--profile-blue); outline-offset: 2px; }
.profile-full-photo[b-30t85huz4f] { display: block; width: 100%; height: auto; max-height: calc(100dvh - 130px); object-fit: contain; background: var(--profile-wash); }
.profile-viewer-error[b-30t85huz4f] { padding: 24px; margin: 0; color: var(--profile-danger); font-size: .85rem; }
.profile-hero-copy[b-30t85huz4f] { min-width: 0; overflow-wrap: anywhere; }
.profile-hero h2[b-30t85huz4f] { margin: 0; color: var(--profile-ink); font-size: clamp(1.35rem, 2.5vw, 1.75rem); font-weight: 650; letter-spacing: -.025em; }
.profile-id[b-30t85huz4f] { display: inline-block; margin-top: 10px; border: 1px solid var(--profile-line); background: var(--profile-tint); color: var(--profile-blue); padding: 6px 10px; border-radius: 10px; font-size: .72rem; }
.profile-id > span[b-30t85huz4f] { margin: 0 5px; }

.profile-edit-photo[b-30t85huz4f] { margin-left: auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 14px; font: inherit; font-size: .8rem; cursor: pointer; }
.profile-edit-photo .material-icons[b-30t85huz4f] { font-size: 18px; }
.profile-photo-editor[b-30t85huz4f] { padding: 26px 30px; margin-bottom: 20px; container-type: inline-size; container-name: photo-editor; }
.profile-photo-editor h2[b-30t85huz4f] { font-size: 1.1rem; margin: 0 0 6px; font-weight: 650; }
.profile-photo-heading[b-30t85huz4f] { flex-wrap: wrap; }
.profile-photo-unsaved[b-30t85huz4f] { padding: 5px 9px; border: 1px solid var(--profile-line); border-radius: 10px; background: var(--profile-tint); color: var(--profile-blue); font-size: .7rem; }
.profile-photo-draft[b-30t85huz4f] { display: grid; grid-template-columns: minmax(180px,220px) minmax(0,1fr); gap: 20px; align-items: stretch; }
.profile-photo-preview[b-30t85huz4f] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 28px 18px 20px; border: 1px solid var(--profile-edge); border-radius: 20px;
    background: var(--profile-wash);
    box-shadow: inset 0 1px 0 var(--profile-shine); text-align: center;
}
.profile-avatar.profile-draft-avatar[b-30t85huz4f] { width: 120px; height: 120px; flex: 0 0 auto; color: var(--profile-ink); box-shadow: 0 0 0 5px var(--profile-tint); }
.profile-photo-preview strong[b-30t85huz4f] { margin-top: 20px; font-size: .85rem; font-weight: 600; }
.profile-photo-preview p[b-30t85huz4f] { margin: 6px 0 0; font-size: .7rem; color: var(--profile-muted); line-height: 1.5; }
.profile-photo-controls[b-30t85huz4f] { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.profile-upload-control[b-30t85huz4f] { position: relative; min-width: 0; }
.profile-upload-control[b-30t85huz4f]  input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; opacity: 0; z-index: 1; cursor: pointer; }
.profile-upload-control[b-30t85huz4f]  input[type=file]:disabled { cursor: not-allowed; }
.profile-upload-control[b-30t85huz4f]  input[type=file]:focus-visible + .profile-upload { outline: 3px solid var(--profile-blue); outline-offset: 3px; }
.profile-upload[b-30t85huz4f] {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px;
    min-height: 216px; padding: 24px 18px; margin: 0;
    border: 1px dashed color-mix(in srgb,var(--profile-blue) 40%,var(--profile-edge)); border-radius: 20px;
    background: var(--profile-frost);
    box-shadow: inset 0 1px 0 var(--profile-shine); text-align: center; cursor: pointer;
    transition: border-color .12s ease;
}
.profile-upload-control:not(.is-busy):hover .profile-upload[b-30t85huz4f] { border-color: var(--profile-blue); }
.profile-upload-control.is-busy .profile-upload[b-30t85huz4f] { opacity: .6; cursor: not-allowed; }
.profile-upload-icon[b-30t85huz4f] { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 3px; border: 1px solid var(--profile-edge); border-radius: 15px; background: var(--profile-tint); color: var(--profile-blue); font-size: 26px; }
.profile-upload strong[b-30t85huz4f] { color: var(--profile-blue); font-size: .95rem; font-weight: 650; }
.profile-upload-hint[b-30t85huz4f] { font-size: .8rem; color: var(--profile-muted); }
.profile-upload #profile-photo-help[b-30t85huz4f] { margin-top: 4px; font-size: .7rem; color: var(--profile-muted); }
.profile-selected-file[b-30t85huz4f] { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 10px 12px; border: 1px solid var(--profile-line); border-radius: 12px; background: var(--profile-wash); font-size: .75rem; }
.profile-selected-file > .material-icons[b-30t85huz4f] { font-size: 18px; color: var(--profile-blue); flex-shrink: 0; }
.profile-selected-file > span:not(.material-icons)[b-30t85huz4f] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.profile-selected-file small[b-30t85huz4f] { margin-left: auto; flex-shrink: 0; color: var(--profile-muted); }
.profile-remove-photo[b-30t85huz4f] { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 9px 12px; border: 1px solid var(--profile-danger-line); border-radius: 14px; background: color-mix(in srgb,var(--profile-danger) 5%,var(--profile-surface)); color: var(--profile-danger); font: inherit; font-size: .8rem; cursor: pointer; }
.profile-remove-photo:hover:enabled[b-30t85huz4f] { background: color-mix(in srgb,var(--profile-danger) 10%,var(--profile-surface)); }
.profile-remove-photo .material-icons[b-30t85huz4f] { font-size: 18px; }
.profile-photo-actions[b-30t85huz4f] { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding-top: 20px; border-top: 1px solid var(--profile-line); margin-top: 22px; }
.profile-photo-confirm-actions[b-30t85huz4f] { display: flex; flex-wrap: wrap; gap: 10px; margin-left: auto; }
.profile-photo-cancel[b-30t85huz4f], .profile-photo-save[b-30t85huz4f] { padding: 10px 16px; border: 1px solid var(--profile-line); border-radius: 14px; background: var(--profile-surface); color: var(--profile-ink); font: inherit; font-size: .85rem; cursor: pointer; }
.profile-photo-save[b-30t85huz4f] { background: var(--profile-blue); border-color: var(--profile-blue); color: #fff; }
.profile-photo-save[b-30t85huz4f] { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.profile-photo-save .material-icons[b-30t85huz4f] { font-size: 18px; }
.profile-photo-save:hover[b-30t85huz4f] { background: var(--profile-blue); }
.profile-photo-cancel:hover[b-30t85huz4f] { background: var(--profile-wash); }
.profile-photo-editor button:disabled[b-30t85huz4f], .profile-edit-photo:disabled[b-30t85huz4f] { opacity: .55; cursor: not-allowed; }
.profile-edit-photo:focus-visible[b-30t85huz4f], .profile-photo-editor button:focus-visible[b-30t85huz4f], .profile-photo-controls[b-30t85huz4f]  input:focus-visible { outline: 3px solid var(--profile-blue); outline-offset: 3px; }
.profile-photo-error[b-30t85huz4f] { color: var(--profile-danger); font-size: .8rem; line-height: 1.6; margin: 16px 0 0; padding: 12px 14px; border: 1px solid var(--profile-danger-line); border-radius: 14px; background: linear-gradient(145deg,var(--profile-surface),var(--profile-wash)); box-shadow: var(--profile-shadow); }
@container photo-editor (max-width: 520px) {
    .profile-photo-draft[b-30t85huz4f] { grid-template-columns: minmax(0,1fr); }
    .profile-photo-preview[b-30t85huz4f] { padding: 24px 16px 18px; }
    .profile-upload[b-30t85huz4f] { min-height: 180px; }
}

.profile-details[b-30t85huz4f] { padding: 26px 30px; }
.profile-details-heading[b-30t85huz4f] { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.profile-details-heading > div[b-30t85huz4f] { min-width: 0; flex: 1; }
.profile-details-heading > .profile-readonly[b-30t85huz4f] { margin-left: auto; }
.profile-details h2[b-30t85huz4f] { font-size: 1.1rem; margin: 0 0 6px; font-weight: 650; }
.profile-readonly[b-30t85huz4f] { display: inline-flex; align-items: center; gap: 5px; border-radius: 10px; background: var(--profile-wash); color: var(--profile-muted); font-size: .7rem; padding: 5px 8px; }
.profile-readonly .material-icons[b-30t85huz4f] { font-size: 14px; }
.profile-details-grid[b-30t85huz4f] { margin: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px 36px; }
.profile-details dt[b-30t85huz4f] { font-size: .75rem; color: var(--profile-muted); font-weight: 400; }
.profile-details dd[b-30t85huz4f] { font-size: .9rem; font-weight: 600; margin: 6px 0 0; overflow-wrap: anywhere; }
.profile-details-grid > div[b-30t85huz4f] { padding: 14px 16px; border: 1px solid var(--profile-line); border-radius: 14px; background: var(--profile-wash); }
.profile-details-note[b-30t85huz4f] { display: flex; align-items: flex-start; gap: 8px; border-top: 1px solid var(--profile-line); margin: 26px 0 0; padding-top: 18px; color: var(--profile-muted); font-size: .75rem; line-height: 1.6; }
.profile-details-note .material-icons[b-30t85huz4f] { flex-shrink: 0; font-size: 16px; margin-top: 2px; }
.profile-state[b-30t85huz4f] { padding: 48px 24px; text-align: center; }
.profile-state > .material-icons[b-30t85huz4f] { color: var(--profile-blue); font-size: 32px; margin-bottom: 12px; }
.profile-state h2[b-30t85huz4f] { font-size: 1.1rem; margin: 0 0 10px; }
.profile-state p[b-30t85huz4f] { color: var(--profile-muted); font-size: .85rem; margin: 0; }
.profile-retry[b-30t85huz4f] { margin-top: 20px; padding: 10px 16px; border: 1px solid var(--profile-blue); border-radius: 14px; background: var(--profile-blue); color: #fff; font-size: .85rem; cursor: pointer; }
.profile-retry:hover[b-30t85huz4f] { background: var(--profile-blue); }
.profile-retry:focus-visible[b-30t85huz4f] { outline: 3px solid var(--profile-blue); outline-offset: 3px; }

@media (max-width: 640px) {
    .profile-page[b-30t85huz4f] { padding: 0 0 24px; }
    .profile-intro[b-30t85huz4f] { padding: 18px; border-radius: 20px; }
    .profile-details-heading[b-30t85huz4f] { flex-wrap: wrap; }
    .profile-details-heading > .profile-readonly[b-30t85huz4f] { margin-left: 52px; }
    .profile-hero[b-30t85huz4f] { padding: 24px 20px; gap: 16px; flex-wrap: wrap; }
    .profile-avatar[b-30t85huz4f] { width: 70px; height: 70px; flex-basis: 70px; font-size: 1.4rem; }
    .profile-edit-photo[b-30t85huz4f] { margin-left: 0; }
    .profile-photo-editor[b-30t85huz4f] { padding: 22px 20px; }
    .profile-photo-draft[b-30t85huz4f] { grid-template-columns: minmax(0,1fr); gap: 14px; }
    .profile-photo-heading > .profile-photo-unsaved[b-30t85huz4f] { margin-left: 52px; }
    .profile-upload[b-30t85huz4f] { min-height: 180px; }
    .profile-photo-confirm-actions[b-30t85huz4f] { width: 100%; }
    .profile-photo-confirm-actions > button[b-30t85huz4f] { flex: 1; }
    .profile-details[b-30t85huz4f] { padding: 22px 20px; }
    .profile-details-grid[b-30t85huz4f] { grid-template-columns: minmax(0,1fr); gap: 26px; }
}
/* /Components/Features/Projects/Components/MemberPickerDialog.razor.rz.scp.css */
.picker-dialog[b-h5yfjmkef7] {
    padding: 24px;
    font-family: "Inter", Arial, sans-serif;
}



.picker-header[b-h5yfjmkef7] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}



    .picker-header h3[b-h5yfjmkef7] {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
    }



    .picker-header span[b-h5yfjmkef7] {
        color: #777;
        font-size: 13px;
    }



.picker-search[b-h5yfjmkef7] {
    width: 100%;
    margin-bottom: 18px;
}



:deep(.picker-search input)[b-h5yfjmkef7] {
    height: 44px;
    border-radius: 14px;
}






.picker-list[b-h5yfjmkef7] {
    max-height: 380px;
    overflow-y: auto;
}





.picker-item[b-h5yfjmkef7] {
    display: flex;
    align-items: center;
    margin-top: 8px;
    gap: 14px;
    padding: 12px;
    border-radius: 16px;
    cursor: pointer;
    transition: .2s;
}



    .picker-item:hover[b-h5yfjmkef7] {
        background: #f5f5f5;
    }



    .picker-item.selected[b-h5yfjmkef7] {
        background: #111;
        color: white;
    }



.member-avatar[b-h5yfjmkef7] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #222;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.picker-item.selected .member-avatar[b-h5yfjmkef7] {
    background: white;
    color: #111;
}




.picker-info[b-h5yfjmkef7] {
    flex: 1;
    display: flex;
    flex-direction: column;
}



    .picker-info small[b-h5yfjmkef7] {
        color: #888;
    }



.picker-item.selected small[b-h5yfjmkef7] {
    color: #ccc;
}

.picker-search[b-h5yfjmkef7] {
    width: 100%;
    margin-bottom: 24px;
}


.picker-list[b-h5yfjmkef7] {
    margin-top: 8px;
    padding-top: 4px;
    max-height: 380px;
    overflow-y: auto;
}




.picker-check[b-h5yfjmkef7] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    color: #111;
    font-weight: bold;
}





.picker-footer[b-h5yfjmkef7] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 20px;
}
/* /Components/Features/Projects/Components/PhasePickerDialog.razor.rz.scp.css */
.phase-picker-dialog[b-43lz6gxy9d] {
    padding: 24px;
    font-family: "Inter", "Segoe UI", sans-serif;
}



.phase-header[b-43lz6gxy9d] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}



    .phase-header h3[b-43lz6gxy9d] {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
    }



.phase-count[b-43lz6gxy9d] {
    color: #888;
    font-size: 13px;
}



:deep(.phase-search)[b-43lz6gxy9d] {
    width: 100%;
    margin-bottom: 24px;
}



.phase-list[b-43lz6gxy9d] {
    margin-top: 12px;
    max-height: 380px;
    overflow-y: auto;
}



.phase-item[b-43lz6gxy9d] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    border-radius: 16px;
    cursor: pointer;
    margin-bottom: 8px;
    transition: .2s ease;
}



    .phase-item:hover[b-43lz6gxy9d] {
        background: #f5f5f5;
    }



    .phase-item.selected[b-43lz6gxy9d] {
        background: #111;
        color: white;
    }



.phase-number[b-43lz6gxy9d] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #111;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}



.phase-item.selected .phase-number[b-43lz6gxy9d] {
    background: white;
    color: #111;
}



.phase-info[b-43lz6gxy9d] {
    flex: 1;
    display: flex;
    flex-direction: column;
}



    .phase-info small[b-43lz6gxy9d] {
        color: #888;
    }



.phase-item.selected .phase-info small[b-43lz6gxy9d] {
    color: #ccc;
}



.phase-check[b-43lz6gxy9d] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: white;
    color: #111;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}



.phase-footer[b-43lz6gxy9d] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
}



.phase-empty[b-43lz6gxy9d] {
    text-align: center;
    padding: 30px;
    color: #999;
}
/* /Components/Features/Projects/Components/ProjectForm.razor.rz.scp.css */
/* ==========================================
   PROJECT LENS
   PROJECT FORM DESIGN SYSTEM
   Nike / Apple Inspired
========================================== */



.pl-form[b-8m7zjbqi5c] {
    font-family: "Inter", "Plus Jakarta Sans", Arial, sans-serif;
    color: #111;
}




/* ==========================================
   HEADER
========================================== */



.pl-form-header[b-8m7zjbqi5c] {
    display: flex;
    gap: 22px;
    align-items: center;
    padding: 28px 30px 20px;
}




.pl-form-icon[b-8m7zjbqi5c] {
    width: 60px;
    height: 60px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111;
    color: white;
}



    .pl-form-icon span[b-8m7zjbqi5c] {
        font-size: 32px;
    }




.pl-form-eyebrow[b-8m7zjbqi5c] {
    display: block;
    font-size: 11px;
    letter-spacing: 2px;
    color: #777;
    font-weight: 700;
    margin-bottom: 8px;
}



.pl-form-header h2[b-8m7zjbqi5c] {
    margin: 0;
    font-size: 28px;
    letter-spacing: -1px;
    font-weight: 750;
}



.pl-form-header p[b-8m7zjbqi5c] {
    margin: 8px 0 0;
    color: #777;
}







/* ==========================================
   BODY
========================================== */



.pl-form-body[b-8m7zjbqi5c] {
    padding: 0 30px 20px;
}




.pl-form-section[b-8m7zjbqi5c] {
    margin-bottom: 28px;
}




    .pl-form-section label[b-8m7zjbqi5c],
    .pl-status-section label[b-8m7zjbqi5c] {
        display: block;
        font-size: 14px;
        font-weight: 650;
        margin-bottom: 10px;
    }





/* ==========================================
   INPUTS
========================================== */



.pl-input[b-8m7zjbqi5c] {
    width: 100%;
}



:deep(.pl-input .rz-inputtext)[b-8m7zjbqi5c],
:deep(.pl-input.rz-dropdown)[b-8m7zjbqi5c],
:deep(.pl-input .rz-dropdown-label)[b-8m7zjbqi5c],
:deep(.pl-input.rz-datepicker)[b-8m7zjbqi5c] {
    border-radius: 16px !important;
    min-height: 48px;
    border: 1px solid #e5e5e5 !important;
    background: #fafafa !important;
    transition: .25s ease;
}




:deep(.pl-input input)[b-8m7zjbqi5c] {
    padding: 0 16px;
    font-size: 15px;
}



:deep(.pl-input:hover)[b-8m7zjbqi5c],
:deep(.pl-input:focus-within)[b-8m7zjbqi5c] {
    border-color: #111 !important;
    background: white !important;
}







/* ==========================================
   DROPDOWN
========================================== */



:deep(.rz-dropdown-panel)[b-8m7zjbqi5c] {
    border-radius: 18px !important;
    box-shadow: 0 20px 50px rgba(0,0,0,.12) !important;
}



:deep(.rz-dropdown-item)[b-8m7zjbqi5c] {
    padding: 12px 16px !important;
}



:deep(.rz-dropdown-item:hover)[b-8m7zjbqi5c] {
    background: #f4f4f4 !important;
}



:deep(.rz-chip)[b-8m7zjbqi5c] {
    border-radius: 999px !important;
    background: #111 !important;
    color: white !important;
}

/* ==========================================
   COMPACT SELECTOR CARDS
========================================== */


.pl-selector[b-8m7zjbqi5c] {
    background: #fafafa;
    border: 1px solid #e8e8e8;
    border-radius: 20px;
    padding: 20px;
    transition: .25s ease;
}



    .pl-selector:hover[b-8m7zjbqi5c] {
        border-color: #d0d0d0;
        background: white;
    }






.pl-selector-header[b-8m7zjbqi5c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
}



    .pl-selector-header label[b-8m7zjbqi5c] {
        display: block;
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 5px;
    }



    .pl-selector-header small[b-8m7zjbqi5c] {
        color: #888;
        font-size: 13px;
    }







/* Manage button */


.pl-manage-btn[b-8m7zjbqi5c] {
    border-radius: 999px !important;
    padding: 8px 18px !important;
    font-weight: 600 !important;
    background: white !important;
    border: 1px solid #ddd !important;
    transition: .2s ease;
}



    .pl-manage-btn:hover[b-8m7zjbqi5c] {
        background: #111 !important;
        color: white !important;
        border-color: #111 !important;
    }






/* Selected member preview */


.pl-selected-preview[b-8m7zjbqi5c] {
    display: flex;
    align-items: center;
    gap: 8px;
}





.pl-avatar[b-8m7zjbqi5c] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #111;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}





.pl-more[b-8m7zjbqi5c] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #e5e5e5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
}






.pl-empty-text[b-8m7zjbqi5c] {
    color: #999;
    font-size: 14px;
}








/* Phase preview */


.pl-phase-preview[b-8m7zjbqi5c] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}



.pl-phase-pill[b-8m7zjbqi5c] {
    padding: 8px 16px;
    border-radius: 999px;
    background: #111;
    color: white;
    font-size: 13px;
    font-weight: 600;
}



    .pl-phase-pill.more[b-8m7zjbqi5c] {
        background: #e5e5e5;
        color: #111;
    }







/* ==========================================
   DATE SECTION
========================================== */



.pl-date-grid[b-8m7zjbqi5c] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}



    .pl-date-grid span[b-8m7zjbqi5c] {
        display: block;
        margin-bottom: 8px;
        font-size: 13px;
        color: #777;
    }





/* ==========================================
   STATUS
========================================== */



.pl-status-section[b-8m7zjbqi5c] {
    margin-top: 10px;
    padding: 22px;
    background: #f7f7f7;
    border-radius: 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}



    .pl-status-section p[b-8m7zjbqi5c] {
        margin: 5px 0 0;
        color: #777;
        font-size: 13px;
    }





.pl-status-toggle[b-8m7zjbqi5c] {
    background: white;
    border-radius: 999px;
    padding: 4px;
}





:deep(.rz-selectbar-item)[b-8m7zjbqi5c] {
    border-radius: 999px !important;
    padding: 8px 18px !important;
    font-weight: 600 !important;
}




:deep(.rz-selectbar-item.rz-state-active)[b-8m7zjbqi5c] {
    background: #111 !important;
    color: white !important;
}









/* ==========================================
   VALIDATION
========================================== */



.pl-error[b-8m7zjbqi5c] {
    color: #dc2626;
    font-size: 12px;
    margin-top: 8px;
}







/* ==========================================
   FOOTER
========================================== */



.pl-form-footer[b-8m7zjbqi5c] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 20px 30px 30px;
    border-top: 1px solid #eeeeee;
}




.pl-cancel[b-8m7zjbqi5c] {
    border-radius: 999px !important;
    padding: 0 24px !important;
}





.pl-save[b-8m7zjbqi5c] {
    height: 48px !important;
    padding: 0 32px !important;
    border-radius: 999px !important;
    background: #111 !important;
    border: none !important;
    font-weight: 650 !important;
    transition: .25s ease;
}



    .pl-save:hover[b-8m7zjbqi5c] {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(0,0,0,.18);
    }







/* ==========================================
   RADZEN DIALOG OVERRIDE
========================================== */



:deep(.rz-dialog)[b-8m7zjbqi5c] {
    border-radius: 28px !important;
    overflow: hidden;
    box-shadow: 0 40px 100px rgba(0,0,0,.18) !important;
}



:deep(.rz-dialog-titlebar)[b-8m7zjbqi5c] {
    display: none !important;
}



:deep(.rz-dialog-content)[b-8m7zjbqi5c] {
    padding: 0 !important;
}







/* ==========================================
   ANIMATION
========================================== */



.pl-form[b-8m7zjbqi5c] {
    animation: formAppear-b-8m7zjbqi5c .35s ease;
}



@keyframes formAppear-b-8m7zjbqi5c {


    from {
        opacity: 0;
        transform: translateY(20px) scale(.98);
    }



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







/* ==========================================
   RESPONSIVE
========================================== */


@media(max-width:700px) {


    .pl-form-header[b-8m7zjbqi5c] {
        align-items: flex-start;
    }



    .pl-date-grid[b-8m7zjbqi5c] {
        grid-template-columns: 1fr;
    }



    .pl-status-section[b-8m7zjbqi5c] {
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
    }
}


/* /Components/Features/Projects/Components/ProjectPhaseCustomFieldForm.razor.rz.scp.css */
.form-group[b-knhaerb68u] {
    margin-bottom: 20px;
}


    .form-group label[b-knhaerb68u] {
        display: block;
        margin-bottom: 8px;
        font-weight: 600;
        color: #374151;
    }


/* Radzen inputs */

[b-knhaerb68u] .rz-textbox,
[b-knhaerb68u] .rz-dropdown {
    width: 100%;
}

```css
.custom-field-form[b-knhaerb68u] {
    padding: 4px 2px;
}

/* ==========================================
   FORM GROUP
   ========================================== */

.form-group[b-knhaerb68u] {
    margin-bottom: 20px;
}

    .form-group .rz-label[b-knhaerb68u] {
        display: block;
        margin-bottom: 7px;
        font-size: 12px;
        font-weight: 650;
        color: #334155;
    }


/* ==========================================
   HELP TEXT
   ========================================== */

.form-help[b-knhaerb68u] {
    display: block;
    margin-top: 6px;
    color: #94a3b8;
    font-size: 10px;
    line-height: 1.5;
}


/* ==========================================
   CHECKBOX OPTIONS
   ========================================== */

.form-option[b-knhaerb68u] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
    padding: 12px;
    background: #f8fafc;
    border: 1px solid #edf0f4;
    border-radius: 10px;
    transition: border-color 0.15s ease, background 0.15s ease;
}

    .form-option:hover[b-knhaerb68u] {
        background: #f4f7fb;
        border-color: #dce3ec;
    }


/* ==========================================
   CHECKBOX TEXT
   ========================================== */

.form-option-text[b-knhaerb68u] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

    .form-option-text span[b-knhaerb68u] {
        color: #334155;
        font-size: 12px;
        font-weight: 650;
    }

    .form-option-text small[b-knhaerb68u] {
        color: #94a3b8;
        font-size: 10px;
        line-height: 1.4;
    }


/* ==========================================
   ACTIONS
   ========================================== */

.form-actions[b-knhaerb68u] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    margin-top: 25px;
    padding-top: 17px;
    border-top: 1px solid #edf0f4;
}


/* ==========================================
   RADZEN INPUTS
   ========================================== */

.custom-field-form .rz-textbox[b-knhaerb68u],
.custom-field-form .rz-dropdown[b-knhaerb68u] {
    border-radius: 8px;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 500px) {

    .custom-field-form[b-knhaerb68u] {
        padding: 2px;
    }

    .form-actions[b-knhaerb68u] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

        .form-actions .rz-button[b-knhaerb68u] {
            width: 100%;
        }
}

```[b-knhaerb68u]



 .rz-inputtext {
    border-radius: 10px;
}



/* Checkbox rows */

.form-group:has(.rz-chkbox)[b-knhaerb68u] {
    display: flex;
    align-items: center;
    gap: 10px;
}


    .form-group:has(.rz-chkbox) label[b-knhaerb68u] {
        margin: 0;
    }



/* Save button */

[b-knhaerb68u] .rz-button {
    border-radius: 10px;
    padding: 10px 25px;
}


/* Make dialog content cleaner */

[b-knhaerb68u] .rz-dialog-content {
    padding: 25px;
}
/* /Components/Features/Projects/Components/ProjectPhaseList.razor.rz.scp.css */
/* =========================================================
   PROJECT LENS — WORKFLOW PHASE PAGE
   ========================================================= */

.phase-page[b-n66rc5b3kf] {
    width: 100%;
    padding: 6px 4px 32px;
    color: #172033;
}


/* =========================================================
   HEADER
   ========================================================= */

.phase-header[b-n66rc5b3kf] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
}

.phase-header-content[b-n66rc5b3kf] {
    min-width: 0;
}

.phase-eyebrow[b-n66rc5b3kf] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 7px;
    color: #64748b;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

    .phase-eyebrow .material-symbols-outlined[b-n66rc5b3kf] {
        font-size: 17px;
    }

.phase-header h2[b-n66rc5b3kf] {
    margin: 0;
    color: #172033;
    font-size: 30px;
    line-height: 1.15;
    font-weight: 750;
    letter-spacing: -0.8px;
}

.phase-header p[b-n66rc5b3kf] {
    max-width: 650px;
    margin: 8px 0 0;
    color: #64748b;
    font-size: 14px;
    line-height: 1.6;
}


/* =========================================================
   SUMMARY CARD
   ========================================================= */

.phase-summary[b-n66rc5b3kf] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 145px;
    padding: 11px 15px;
    background: #ffffff;
    border: 1px solid #e7ebf1;
    border-radius: 14px;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.035);
}

.phase-summary-icon[b-n66rc5b3kf] {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #eff6ff;
}

    .phase-summary-icon .material-symbols-outlined[b-n66rc5b3kf] {
        color: #2563eb;
        font-size: 21px;
    }

.phase-summary span[b-n66rc5b3kf] {
    display: block;
    margin-bottom: 1px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 650;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.phase-summary strong[b-n66rc5b3kf] {
    display: block;
    color: #172033;
    font-size: 20px;
    font-weight: 750;
}


/* =========================================================
   PHASE GRID
   ========================================================= */

.phase-grid[b-n66rc5b3kf] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 18px;
}


/* =========================================================
   PHASE CARD
   ========================================================= */

.phase-card[b-n66rc5b3kf] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 330px;
    padding: 20px;
    background: #ffffff;
    border: 1px solid #e7ebf1;
    border-radius: 18px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.035);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

    .phase-card:hover[b-n66rc5b3kf] {
        transform: translateY(-3px);
        border-color: #d7e0ee;
        box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
    }


    /* subtle top accent */

    .phase-card[b-n66rc5b3kf]::before {
        content: "";
        position: absolute;
        top: 0;
        left: 22px;
        right: 22px;
        height: 2px;
        background: #2563eb;
        opacity: 0;
        border-radius: 0 0 4px 4px;
        transition: opacity 180ms ease;
    }

    .phase-card:hover[b-n66rc5b3kf]::before {
        opacity: 1;
    }


/* =========================================================
   CARD HEADER
   ========================================================= */

.phase-card-header[b-n66rc5b3kf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-right: 34px;
}

.phase-icon[b-n66rc5b3kf] {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #eff6ff;
    color: #2563eb;
}

    .phase-icon .material-symbols-outlined[b-n66rc5b3kf] {
        font-size: 24px;
    }

.phase-card-title[b-n66rc5b3kf] {
    min-width: 0;
}

    .phase-card-title h3[b-n66rc5b3kf] {
        overflow: hidden;
        margin: 0;
        color: #172033;
        font-size: 17px;
        line-height: 1.3;
        font-weight: 700;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .phase-card-title span[b-n66rc5b3kf] {
        display: block;
        margin-top: 3px;
        color: #94a3b8;
        font-size: 11px;
    }


/* =========================================================
   PHASE NUMBER
   ========================================================= */

.phase-number[b-n66rc5b3kf] {
    position: absolute;
    top: 17px;
    right: 18px;
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #f8fafc;
    color: #64748b;
    font-size: 10px;
    font-weight: 750;
    border: 1px solid #edf0f4;
}


/* =========================================================
   CUSTOM FIELDS SECTION
   ========================================================= */

.phase-fields[b-n66rc5b3kf] {
    margin-top: 23px;
}

.phase-fields-header[b-n66rc5b3kf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

    .phase-fields-header span[b-n66rc5b3kf] {
        color: #475569;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .phase-fields-header strong[b-n66rc5b3kf] {
        min-width: 25px;
        height: 25px;
        display: grid;
        place-items: center;
        padding: 0 6px;
        border-radius: 7px;
        background: #f1f5f9;
        color: #475569;
        font-size: 11px;
        font-weight: 750;
    }


/* =========================================================
   CUSTOM FIELD CHIPS
   ========================================================= */

.field-preview[b-n66rc5b3kf] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.field-chip[b-n66rc5b3kf] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    padding: 6px 9px;
    background: #f8fafc;
    border: 1px solid #edf0f4;
    border-radius: 8px;
    color: #475569;
    font-size: 11px;
    line-height: 1.2;
}

    .field-chip .material-symbols-outlined[b-n66rc5b3kf] {
        flex-shrink: 0;
        color: #64748b;
        font-size: 15px;
    }

    .field-chip span:not(.material-symbols-outlined)[b-n66rc5b3kf] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .field-chip b[b-n66rc5b3kf] {
        color: #ef4444;
        font-size: 12px;
    }


/* =========================================================
   MORE FIELDS
   ========================================================= */

.more-fields[b-n66rc5b3kf] {
    display: block;
    margin-top: 9px;
    color: #64748b;
    font-size: 10px;
    font-weight: 600;
}


/* =========================================================
   NO CUSTOM FIELDS
   ========================================================= */

.no-fields[b-n66rc5b3kf] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 12px;
    background: #fafbfc;
    border: 1px dashed #d9dee8;
    border-radius: 9px;
    color: #94a3b8;
    font-size: 11px;
}

    .no-fields .material-symbols-outlined[b-n66rc5b3kf] {
        font-size: 17px;
    }


/* =========================================================
   STANDARD FIELDS
   ========================================================= */

.standard-fields[b-n66rc5b3kf] {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #edf0f4;
}

.standard-fields-title[b-n66rc5b3kf] {
    display: block;
    margin-bottom: 9px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}

.standard-field-list[b-n66rc5b3kf] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

    .standard-field-list span[b-n66rc5b3kf] {
        padding: 4px 7px;
        background: #f8fafc;
        border: 1px solid #f0f2f5;
        border-radius: 6px;
        color: #64748b;
        font-size: 9px;
        font-weight: 550;
    }


/* =========================================================
   FOOTER
   ========================================================= */

.phase-card-footer[b-n66rc5b3kf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 17px;
    border-top: 1px solid #edf0f4;
}

.field-count[b-n66rc5b3kf] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #64748b;
    font-size: 10px;
    font-weight: 600;
}

    .field-count .material-symbols-outlined[b-n66rc5b3kf] {
        font-size: 16px;
    }


/* =========================================================
   RADZEN CONFIGURE BUTTON
   ========================================================= */

.phase-btn[b-n66rc5b3kf] {
    min-width: 108px;
    border-radius: 9px !important;
    font-size: 11px !important;
    font-weight: 650 !important;
}


/* =========================================================
   EMPTY STATE
   ========================================================= */

.phase-empty[b-n66rc5b3kf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 330px;
    padding: 50px 25px;
    text-align: center;
    background: #ffffff;
    border: 1px dashed #d9dee8;
    border-radius: 18px;
}

.phase-empty-icon[b-n66rc5b3kf] {
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    margin-bottom: 17px;
    border-radius: 17px;
    background: #eff6ff;
    color: #2563eb;
}

    .phase-empty-icon .material-symbols-outlined[b-n66rc5b3kf] {
        font-size: 28px;
    }

.phase-empty h3[b-n66rc5b3kf] {
    margin: 0 0 7px;
    color: #172033;
    font-size: 17px;
    font-weight: 700;
}

.phase-empty p[b-n66rc5b3kf] {
    max-width: 390px;
    margin: 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 900px) {

    .phase-header[b-n66rc5b3kf] {
        align-items: flex-start;
        flex-direction: column;
    }

    .phase-summary[b-n66rc5b3kf] {
        width: 100%;
    }

    .phase-grid[b-n66rc5b3kf] {
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    }
}


@media (max-width: 600px) {

    .phase-page[b-n66rc5b3kf] {
        padding: 0 0 25px;
    }

    .phase-header h2[b-n66rc5b3kf] {
        font-size: 25px;
    }

    .phase-grid[b-n66rc5b3kf] {
        grid-template-columns: 1fr;
    }

    .phase-card[b-n66rc5b3kf] {
        min-height: 0;
    }

    .phase-card-footer[b-n66rc5b3kf] {
        align-items: stretch;
        flex-direction: column;
    }

    .phase-btn[b-n66rc5b3kf] {
        width: 100%;
    }
}
/* /Components/Features/Projects/Components/ProjectPhases.razor.rz.scp.css */
.phase-page[b-lkvf6gjpd5] {
    padding: 25px;
}


/* Header */

.phase-header[b-lkvf6gjpd5] {
    margin-bottom: 30px;
}


.phase-eyebrow[b-lkvf6gjpd5] {
    font-size: 12px;
    letter-spacing: 2px;
    color: #6b7280;
    font-weight: 600;
}


.phase-header h2[b-lkvf6gjpd5] {
    margin: 8px 0;
    font-size: 30px;
    font-weight: 700;
}


.phase-header p[b-lkvf6gjpd5] {
    margin: 0;
    color: #6b7280;
}



/* Phase cards */

.phase-grid[b-lkvf6gjpd5] {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(300px,1fr));
    gap: 22px;
}



.phase-card[b-lkvf6gjpd5] {
    background: white;
    border-radius: 18px;
    border: 1px solid #e5e7eb;
    padding: 22px;
    transition: .2s;
}



    .phase-card:hover[b-lkvf6gjpd5] {
        transform: translateY(-4px);
        box-shadow: 0 12px 30px rgba(0,0,0,.08);
    }



/* Top */

.phase-card-top[b-lkvf6gjpd5] {
    display: flex;
    align-items: center;
    gap: 15px;
}



.phase-icon[b-lkvf6gjpd5] {
    width: 55px;
    height: 55px;
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #eef2ff;
}



    .phase-icon span[b-lkvf6gjpd5] {
        color: #4f46e5;
        font-size: 28px;
    }



.phase-card h3[b-lkvf6gjpd5] {
    margin: 0;
    font-size: 20px;
}



.phase-card-top span[b-lkvf6gjpd5] {
    font-size: 14px;
    color: #6b7280;
}



/* Footer */

.phase-card-footer[b-lkvf6gjpd5] {
    margin-top: 25px;
}



[b-lkvf6gjpd5] .phase-btn {
    width: 100%;
    border-radius: 12px;
}



/* Empty */

.phase-empty[b-lkvf6gjpd5] {
    text-align: center;
    padding: 50px;
    border: 1px dashed #d1d5db;
    border-radius: 18px;
}


    .phase-empty .material-symbols-outlined[b-lkvf6gjpd5] {
        font-size: 50px;
        color: #9ca3af;
    }
/* /Components/Features/Projects/Pages/PhaseConfiguration.razor.rz.scp.css */
/* =========================================================
   Project Phase — Custom Field Configuration
   Scoped stylesheet (::deep used for child/JS-rendered nodes)
   ========================================================= */

.pcf[b-x9rdfsblre] {
    --pcf-bg: #f6f8fb;
    --pcf-surface: #ffffff;
    --pcf-ink: #0f172a;
    --pcf-ink-soft: #64748b;
    --pcf-line: #e6ebf2;
    --pcf-brand: #2563eb;
    --pcf-brand-ink: #1d4ed8;
    --pcf-brand-soft: #eff5ff;
    --pcf-amber: #b45309;
    --pcf-amber-soft: #fff7ed;
    --pcf-green: #047857;
    --pcf-green-soft: #ecfdf5;
    --pcf-danger: #dc2626;
    --pcf-danger-soft: #fef2f2;
    --pcf-radius: 16px;
    --pcf-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px -12px rgba(15, 23, 42, .18);
    --pcf-shadow-lg: 0 24px 48px -24px rgba(15, 23, 42, .35);
    min-height: 100%;
    padding: 28px clamp(16px, 3vw, 40px) 64px;
    background: radial-gradient(1100px 420px at 88% -12%, #e6efff 0%, transparent 60%), radial-gradient(900px 380px at -5% -10%, #eef2ff 0%, transparent 55%), var(--pcf-bg);
    color: var(--pcf-ink);
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

    /* ---------- reveal animation ---------- */
    .pcf[b-x9rdfsblre]  .reveal,
    .pcf .reveal[b-x9rdfsblre] {
        opacity: 0;
        transform: translateY(10px);
    }

        .pcf .reveal.is-in[b-x9rdfsblre],
        .pcf[b-x9rdfsblre]  .reveal.is-in {
            opacity: 1;
            transform: none;
            transition: opacity .5s ease var(--d, 0ms), transform .5s cubic-bezier(.22,.85,.3,1) var(--d, 0ms);
        }

@media (prefers-reduced-motion: reduce) {
    .pcf .reveal[b-x9rdfsblre], .pcf[b-x9rdfsblre]  .reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* ---------- header ---------- */
.pcf-header[b-x9rdfsblre] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--pcf-line);
}

.pcf-header__text[b-x9rdfsblre] {
    max-width: 640px;
}

.pcf-eyebrow[b-x9rdfsblre] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--pcf-brand-ink);
    background: var(--pcf-brand-soft);
    border: 1px solid #dbe7ff;
    padding: 6px 12px;
    border-radius: 999px;
}

.pcf-eyebrow__dot[b-x9rdfsblre] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--pcf-brand);
    box-shadow: 0 0 0 0 rgba(37, 99, 235, .5);
    animation: pcf-pulse-b-x9rdfsblre 2.2s infinite;
}

@keyframes pcf-pulse-b-x9rdfsblre {
    70% {
        box-shadow: 0 0 0 8px rgba(37, 99, 235, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(37, 99, 235, 0);
    }
}

.pcf-title[b-x9rdfsblre] {
    margin: 14px 0 8px;
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 700;
    letter-spacing: -.025em;
    line-height: 1.15;
}

.pcf-subtitle[b-x9rdfsblre] {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--pcf-ink-soft);
}

/* ---------- buttons ---------- */
.pcf-btn[b-x9rdfsblre] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 20px;
    border: 0;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

    .pcf-btn .material-icons[b-x9rdfsblre] {
        font-size: 19px;
    }

.pcf-btn--primary[b-x9rdfsblre] {
    color: #fff;
    background: linear-gradient(180deg, #3b82f6, var(--pcf-brand));
    box-shadow: 0 10px 22px -12px rgba(37, 99, 235, .9);
}

    .pcf-btn--primary:hover[b-x9rdfsblre] {
        transform: translateY(-1px);
        box-shadow: 0 16px 28px -14px rgba(37, 99, 235, .95);
    }

    .pcf-btn--primary:active[b-x9rdfsblre] {
        transform: translateY(0);
    }

/* ---------- stats ---------- */
.pcf-stats[b-x9rdfsblre] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
    margin: 24px 0 22px;
}

.pcf-stat[b-x9rdfsblre] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    background: var(--pcf-surface);
    border: 1px solid var(--pcf-line);
    border-radius: var(--pcf-radius);
    box-shadow: var(--pcf-shadow);
    transition: transform .18s ease, box-shadow .18s ease;
}

    .pcf-stat:hover[b-x9rdfsblre] {
        transform: translateY(-2px);
        box-shadow: var(--pcf-shadow-lg);
    }

.pcf-stat__icon[b-x9rdfsblre] {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    flex: none;
}

    .pcf-stat__icon .material-icons[b-x9rdfsblre] {
        font-size: 21px;
    }

.pcf-stat__icon--total[b-x9rdfsblre] {
    background: var(--pcf-brand-soft);
    color: var(--pcf-brand-ink);
}

.pcf-stat__icon--grid[b-x9rdfsblre] {
    background: var(--pcf-green-soft);
    color: var(--pcf-green);
}

.pcf-stat__icon--req[b-x9rdfsblre] {
    background: var(--pcf-amber-soft);
    color: var(--pcf-amber);
}

.pcf-stat__label[b-x9rdfsblre] {
    margin: 0 0 2px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--pcf-ink-soft);
}

.pcf-stat__value[b-x9rdfsblre] {
    margin: 0;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

/* ---------- toolbar ---------- */
.pcf-toolbar[b-x9rdfsblre] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.pcf-search[b-x9rdfsblre] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 280px;
    max-width: 380px;
    height: 42px;
    padding: 0 12px;
    background: var(--pcf-surface);
    border: 1px solid var(--pcf-line);
    border-radius: 12px;
    box-shadow: var(--pcf-shadow);
    transition: border-color .16s ease, box-shadow .16s ease;
}

    .pcf-search:focus-within[b-x9rdfsblre] {
        border-color: #bfd4ff;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, .12);
    }

    .pcf-search .material-icons[b-x9rdfsblre] {
        font-size: 19px;
        color: var(--pcf-ink-soft);
    }

    .pcf-search input[b-x9rdfsblre] {
        flex: 1;
        border: 0;
        outline: 0;
        background: transparent;
        font-size: 14px;
        color: var(--pcf-ink);
    }

.pcf-search__clear[b-x9rdfsblre] {
    border: 0;
    background: transparent;
    cursor: pointer;
    display: grid;
    place-items: center;
    padding: 2px;
    border-radius: 6px;
    color: var(--pcf-ink-soft);
}

    .pcf-search__clear:hover[b-x9rdfsblre] {
        background: #f1f5f9;
    }

.pcf-filters[b-x9rdfsblre] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.pcf-chip[b-x9rdfsblre] {
    height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--pcf-line);
    background: var(--pcf-surface);
    color: var(--pcf-ink-soft);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all .16s ease;
}

    .pcf-chip:hover[b-x9rdfsblre] {
        color: var(--pcf-ink);
        border-color: #cfdaea;
    }

    .pcf-chip.is-active[b-x9rdfsblre] {
        color: #fff;
        background: var(--pcf-ink);
        border-color: var(--pcf-ink);
    }

/* ---------- list ---------- */
.pcf-list[b-x9rdfsblre] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pcf-card[b-x9rdfsblre] {
    position: relative;
    display: grid;
    grid-template-columns: 26px 46px 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: var(--pcf-surface);
    border: 1px solid var(--pcf-line);
    border-radius: var(--pcf-radius);
    box-shadow: var(--pcf-shadow);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

    .pcf-card[b-x9rdfsblre]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 14px;
        bottom: 14px;
        width: 3px;
        border-radius: 0 3px 3px 0;
        background: linear-gradient(180deg, #60a5fa, var(--pcf-brand));
        opacity: 0;
        transition: opacity .18s ease;
    }

    .pcf-card:hover[b-x9rdfsblre] {
        transform: translateY(-2px);
        border-color: #d7e3f5;
        box-shadow: var(--pcf-shadow-lg);
    }

        .pcf-card:hover[b-x9rdfsblre]::before {
            opacity: 1;
        }

    .pcf-card.pcf-dragging[b-x9rdfsblre] {
        opacity: .55;
        transform: scale(.99);
    }

    .pcf-card.pcf-drop-target[b-x9rdfsblre] {
        border-color: var(--pcf-brand);
        box-shadow: 0 0 0 3px rgba(37,99,235,.12);
    }

.pcf-card__handle[b-x9rdfsblre] {
    display: grid;
    place-items: center;
    color: #b6c2d3;
    cursor: grab;
    border-radius: 8px;
    height: 32px;
}

    .pcf-card__handle:active[b-x9rdfsblre] {
        cursor: grabbing;
    }

    .pcf-card__handle:hover[b-x9rdfsblre] {
        color: var(--pcf-ink-soft);
        background: #f4f7fb;
    }

.pcf-card__type[b-x9rdfsblre] {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    background: #f4f7fb;
    color: var(--pcf-ink-soft);
    border: 1px solid var(--pcf-line);
}

    .pcf-card__type .material-icons[b-x9rdfsblre] {
        font-size: 21px;
    }

    .pcf-card__type[data-type*="int"][b-x9rdfsblre],
    .pcf-card__type[data-type*="decimal"][b-x9rdfsblre],
    .pcf-card__type[data-type*="number"][b-x9rdfsblre] {
        background: var(--pcf-brand-soft);
        color: var(--pcf-brand-ink);
        border-color: #dbe7ff;
    }

    .pcf-card__type[data-type*="date"][b-x9rdfsblre] {
        background: #f5f3ff;
        color: #6d28d9;
        border-color: #e9e3ff;
    }

    .pcf-card__type[data-type*="bool"][b-x9rdfsblre] {
        background: var(--pcf-green-soft);
        color: var(--pcf-green);
        border-color: #d5f5e6;
    }

.pcf-card__titleRow[b-x9rdfsblre] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.pcf-card__name[b-x9rdfsblre] {
    margin: 0;
    font-size: 15.5px;
    font-weight: 650;
    letter-spacing: -.01em;
}

.pcf-datatype[b-x9rdfsblre] {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--pcf-ink-soft);
    background: #f4f7fb;
    border: 1px solid var(--pcf-line);
    border-radius: 6px;
    padding: 2px 8px;
}

.pcf-tags[b-x9rdfsblre] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.pcf-tag[b-x9rdfsblre] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 999px;
    background: #f4f7fb;
    color: var(--pcf-ink-soft);
    border: 1px solid var(--pcf-line);
}

    .pcf-tag .material-icons[b-x9rdfsblre] {
        font-size: 14px;
    }

.pcf-tag--required[b-x9rdfsblre] {
    background: var(--pcf-amber-soft);
    color: var(--pcf-amber);
    border-color: #fde6c8;
}

.pcf-tag--visible[b-x9rdfsblre] {
    background: var(--pcf-green-soft);
    color: var(--pcf-green);
    border-color: #d5f5e6;
}

.pcf-tag--unit[b-x9rdfsblre] {
    background: var(--pcf-brand-soft);
    color: var(--pcf-brand-ink);
    border-color: #dbe7ff;
}

.pcf-card__hint[b-x9rdfsblre] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--pcf-ink-soft);
    font-style: italic;
}

    .pcf-card__hint .material-icons[b-x9rdfsblre] {
        font-size: 15px;
        font-style: normal;
    }

.pcf-card__actions[b-x9rdfsblre] {
    display: flex;
    gap: 6px;
}

.pcf-icon-btn[b-x9rdfsblre] {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid var(--pcf-line);
    background: var(--pcf-surface);
    color: var(--pcf-ink-soft);
    cursor: pointer;
    transition: all .16s ease;
}

    .pcf-icon-btn .material-icons[b-x9rdfsblre] {
        font-size: 18px;
    }

    .pcf-icon-btn:hover[b-x9rdfsblre] {
        color: var(--pcf-brand-ink);
        background: var(--pcf-brand-soft);
        border-color: #dbe7ff;
    }

.pcf-icon-btn--danger:hover[b-x9rdfsblre] {
    color: var(--pcf-danger);
    background: var(--pcf-danger-soft);
    border-color: #fbdada;
}

.pcf-card__order[b-x9rdfsblre] {
    position: absolute;
    top: 10px;
    right: 14px;
    font-size: 11px;
    font-weight: 600;
    color: #c2cddb;
    font-variant-numeric: tabular-nums;
}

/* ---------- empty ---------- */
.pcf-empty[b-x9rdfsblre] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 64px 24px;
    background: var(--pcf-surface);
    border: 1px dashed #d8e1ee;
    border-radius: 20px;
    box-shadow: var(--pcf-shadow);
}

.pcf-empty__art[b-x9rdfsblre] {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 22px;
    background: linear-gradient(160deg, #eff5ff, #e6efff);
    color: var(--pcf-brand-ink);
    margin-bottom: 18px;
}

    .pcf-empty__art .material-icons[b-x9rdfsblre] {
        font-size: 34px;
    }

.pcf-empty h3[b-x9rdfsblre] {
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 700;
}

.pcf-empty p[b-x9rdfsblre] {
    margin: 0 0 20px;
    font-size: 14px;
    color: var(--pcf-ink-soft);
    max-width: 380px;
}

.pcf-empty--soft[b-x9rdfsblre] {
    padding: 46px 24px;
}

/* ---------- responsive ---------- */
@media (max-width: 720px) {
    .pcf-card[b-x9rdfsblre] {
        grid-template-columns: 26px 1fr;
        grid-template-areas:
            "handle type"
            "body body"
            "actions actions";
        row-gap: 12px;
    }

    .pcf-card__handle[b-x9rdfsblre] {
        grid-area: handle;
    }

    .pcf-card__type[b-x9rdfsblre] {
        grid-area: type;
        justify-self: start;
    }

    .pcf-card__body[b-x9rdfsblre] {
        grid-area: body;
    }

    .pcf-card__actions[b-x9rdfsblre] {
        grid-area: actions;
        justify-content: flex-end;
    }

    .pcf-header__actions[b-x9rdfsblre] {
        width: 100%;
    }

    .pcf-btn[b-x9rdfsblre] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Features/Projects/Pages/ProjectDetails.razor.rz.scp.css */
/* ProjectDetail.razor.css — scoped */

.pd-shell[b-7w4dwgri5l] {
    --pd-bg: #f6f7fb;
    --pd-surface: #ffffff;
    --pd-ink: #0f172a;
    --pd-muted: #64748b;
    --pd-line: #e6e9f2;
    --pd-brand: #4f46e5;
    --pd-brand-2: #06b6d4;
    --pd-ok: #10b981;
    --pd-shadow: 0 10px 30px -18px rgba(15, 23, 42, .45);
    --pd-radius: 18px;
    max-width: 1240px;
    margin: 0 auto;
    padding: -10px -10px 64px;
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
    color: var(--pd-ink);
}

/* ── HERO ───────────────────────────────────────────── */
.pd-hero[b-7w4dwgri5l] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    justify-content: space-between;
    align-items: center;
    padding: 34px 36px;
    border-radius: 26px;
    background: linear-gradient(135deg, #111827 0%, #1e1b4b 55%, #0f766e 130%);
    color: #fff;
    box-shadow: 0 24px 60px -32px rgba(30, 27, 75, .85);
}

.pd-hero__glow[b-7w4dwgri5l] {
    position: absolute;
    inset: -40% -10% auto auto;
    width: 460px;
    height: 460px;
    background: radial-gradient(circle, rgba(99, 102, 241, .55), transparent 62%);
    filter: blur(10px);
    animation: pd-float-b-7w4dwgri5l 9s ease-in-out infinite;
    pointer-events: none;
}

@keyframes pd-float-b-7w4dwgri5l {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(-26px, 22px, 0) scale(1.08);
    }
}

.pd-hero__main[b-7w4dwgri5l] {
    position: relative;
    z-index: 1;
    min-width: 260px;
}

.pd-hero__side[b-7w4dwgri5l] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 22px;
}

.pd-back[b-7w4dwgri5l] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .88);
    font-size: .82rem;
    font-weight: 500;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

    .pd-back:hover[b-7w4dwgri5l] {
        background: rgba(255, 255, 255, .2);
        transform: translateX(-3px);
    }

.pd-back__arrow[b-7w4dwgri5l] {
    transition: transform .2s ease;
}

.pd-back:hover .pd-back__arrow[b-7w4dwgri5l] {
    transform: translateX(-3px);
}

.pd-eyebrow[b-7w4dwgri5l] {
    display: block;
    margin: 20px 0 6px;
    font-size: .7rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .55);
}

.pd-title[b-7w4dwgri5l] {
    margin: 0;
    font-size: clamp(1.8rem, 3.4vw, 2.7rem);
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.1;
}

.pd-meta[b-7w4dwgri5l] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.pd-chip[b-7w4dwgri5l] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 500;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .16);
}

.pd-chip--ghost[b-7w4dwgri5l] {
    background: transparent;
    color: rgba(255, 255, 255, .7);
}

.pd-chip__dot[b-7w4dwgri5l] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--pd-brand-2);
}

.pd-status[b-7w4dwgri5l] {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 16px;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .2);
}

.pd-status__pulse[b-7w4dwgri5l] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #94a3b8;
}

.pd-status.is-active .pd-status__pulse[b-7w4dwgri5l] {
    background: var(--pd-ok);
    box-shadow: 0 0 0 0 rgba(16, 185, 129, .7);
    animation: pd-pulse-b-7w4dwgri5l 1.8s infinite;
}

@keyframes pd-pulse-b-7w4dwgri5l {
    70% {
        box-shadow: 0 0 0 10px rgba(16, 185, 129, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
    }
}

/* progress ring */
.pd-ring[b-7w4dwgri5l] {
    position: relative;
    width: 118px;
    height: 118px;
}

.pd-ring__svg[b-7w4dwgri5l] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.pd-ring__track[b-7w4dwgri5l],
.pd-ring__value[b-7w4dwgri5l] {
    fill: none;
    stroke-width: 9;
    stroke-linecap: round;
}

.pd-ring__track[b-7w4dwgri5l] {
    stroke: rgba(255, 255, 255, .14);
}

.pd-ring__value[b-7w4dwgri5l] {
    stroke: url(#pdGrad);
    stroke: #34d399;
    stroke-dasharray: 327;
    stroke-dashoffset: calc(327 - (327 * var(--pd-progress, 0) / 100));
    transition: stroke-dashoffset 1.4s cubic-bezier(.16, 1, .3, 1);
}

.pd-ring__label[b-7w4dwgri5l] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

    .pd-ring__label b[b-7w4dwgri5l] {
        font-size: 1.6rem;
        font-weight: 700;
    }

    .pd-ring__label i[b-7w4dwgri5l] {
        font-style: normal;
        font-size: .95rem;
        opacity: .8;
    }

    .pd-ring__label small[b-7w4dwgri5l] {
        margin-top: 5px;
        font-size: .62rem;
        letter-spacing: .14em;
        text-transform: uppercase;
        color: rgba(255, 255, 255, .55);
    }

/* ── STATS ──────────────────────────────────────────── */
.pd-stats[b-7w4dwgri5l] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
    gap: 16px;
    margin-top: 22px;
}

.pd-stat[b-7w4dwgri5l] {
    display: flex;
    gap: 14px;
    padding: 20px;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-radius: var(--pd-radius);
    box-shadow: var(--pd-shadow);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

    .pd-stat:hover[b-7w4dwgri5l] {
        transform: translateY(-4px);
        border-color: color-mix(in oklab, var(--pd-brand) 35%, var(--pd-line));
        box-shadow: 0 18px 40px -24px rgba(79, 70, 229, .6);
    }

.pd-stat__icon[b-7w4dwgri5l] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: none;
    border-radius: 12px;
    font-size: 1.05rem;
    background: linear-gradient(135deg, rgba(79, 70, 229, .12), rgba(6, 182, 212, .14));
}

.pd-stat__label[b-7w4dwgri5l] {
    margin: 0 0 4px;
    font-size: .72rem;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--pd-muted);
}

.pd-stat__value[b-7w4dwgri5l] {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -.02em;
}

.pd-stat__value--sm[b-7w4dwgri5l] {
    font-size: 1.05rem;
}

.pd-dash[b-7w4dwgri5l] {
    color: var(--pd-muted);
    margin: 0 4px;
}

.pd-stat__hint[b-7w4dwgri5l] {
    margin: 6px 0 0;
    font-size: .74rem;
    color: var(--pd-muted);
}

.pd-bar[b-7w4dwgri5l] {
    margin-top: 9px;
    height: 6px;
    border-radius: 999px;
    background: #eef1f7;
    overflow: hidden;
}

    .pd-bar > span[b-7w4dwgri5l] {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, var(--pd-brand), var(--pd-brand-2));
        transition: width 1.2s cubic-bezier(.16, 1, .3, 1);
    }

/* ── TABS ───────────────────────────────────────────── */
.pd-tabs[b-7w4dwgri5l] {
    position: relative;
    display: flex;
    gap: 4px;
    margin: 26px 0 18px;
    padding: 6px;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-radius: 999px;
    box-shadow: var(--pd-shadow);
    overflow-x: auto;
    scrollbar-width: none;
}

    .pd-tabs[b-7w4dwgri5l]::-webkit-scrollbar {
        display: none;
    }

.pd-tab[b-7w4dwgri5l] {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    padding: 10px 18px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--pd-muted);
    font-size: .88rem;
    font-weight: 600;
    cursor: pointer;
    transition: color .2s ease;
}

    .pd-tab:hover[b-7w4dwgri5l] {
        color: var(--pd-ink);
    }

    .pd-tab.active[b-7w4dwgri5l] {
        color: #fff;
    }

.pd-tab__icon[b-7w4dwgri5l] {
    font-size: .95rem;
    opacity: .85;
}

.pd-tabs__ink[b-7w4dwgri5l] {
    position: absolute;
    top: 6px;
    left: 0;
    height: calc(100% - 12px);
    border-radius: 999px;
    background: linear-gradient(135deg, var(--pd-brand), var(--pd-brand-2));
    box-shadow: 0 8px 20px -10px rgba(79, 70, 229, .9);
    transition: transform .35s cubic-bezier(.16, 1, .3, 1), width .35s cubic-bezier(.16, 1, .3, 1);
    pointer-events: none;
    width: 0;
}

/* ── PANEL ──────────────────────────────────────────── */
.pd-panel[b-7w4dwgri5l] {
    padding: 24px;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-radius: 22px;
    box-shadow: var(--pd-shadow);
    animation: pd-in-b-7w4dwgri5l .4s cubic-bezier(.16, 1, .3, 1) both;
}

@keyframes pd-in-b-7w4dwgri5l {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.pd-empty[b-7w4dwgri5l] {
    text-align: center;
    padding: 54px 20px;
    color: var(--pd-muted);
}

    .pd-empty h3[b-7w4dwgri5l] {
        margin: 18px 0 6px;
        color: var(--pd-ink);
        font-size: 1.05rem;
    }

    .pd-empty p[b-7w4dwgri5l] {
        margin: 0;
        font-size: .88rem;
    }

.pd-empty__orb[b-7w4dwgri5l] {
    width: 62px;
    height: 62px;
    margin: 0 auto;
    border-radius: 50%;
    background: conic-gradient(from 0deg, var(--pd-brand), var(--pd-brand-2), var(--pd-brand));
    opacity: .22;
    animation: pd-spin-b-7w4dwgri5l 6s linear infinite;
}

@keyframes pd-spin-b-7w4dwgri5l {
    to {
        transform: rotate(360deg);
    }
}

/* ── REVEAL ─────────────────────────────────────────── */
.reveal[b-7w4dwgri5l] {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .6s ease var(--d, 0s), transform .6s cubic-bezier(.16, 1, .3, 1) var(--d, 0s);
}

    .reveal.is-visible[b-7w4dwgri5l] {
        opacity: 1;
        transform: none;
    }

/* ── SKELETON ───────────────────────────────────────── */
.pd-skeleton[b-7w4dwgri5l],
.pd-skeleton-grid .card[b-7w4dwgri5l] {
    border-radius: 20px;
    background: linear-gradient(90deg, #eef1f7 25%, #f7f9fc 50%, #eef1f7 75%);
    background-size: 220% 100%;
    animation: pd-shimmer-b-7w4dwgri5l 1.3s linear infinite;
}

@keyframes pd-shimmer-b-7w4dwgri5l {
    to {
        background-position: -220% 0;
    }
}

.pd-skeleton.hero[b-7w4dwgri5l] {
    height: 190px;
}

.pd-skeleton-grid[b-7w4dwgri5l] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
    gap: 16px;
    margin: 22px 0;
}

    .pd-skeleton-grid .card[b-7w4dwgri5l] {
        height: 96px;
    }

.pd-skeleton.block[b-7w4dwgri5l] {
    height: 320px;
}

/* ── RESPONSIVE ─────────────────────────────────────── */
@media (max-width: 720px) {
    .pd-shell[b-7w4dwgri5l] {
        padding: 18px 14px 48px;
    }

    .pd-hero[b-7w4dwgri5l] {
        padding: 26px 22px;
    }

    .pd-hero__side[b-7w4dwgri5l] {
        width: 100%;
        justify-content: space-between;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pd-shell *[b-7w4dwgri5l],
    .pd-shell *[b-7w4dwgri5l]::before,
    .pd-shell *[b-7w4dwgri5l]::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }

    .reveal[b-7w4dwgri5l] {
        opacity: 1;
        transform: none;
    }
}
/* /Components/Features/Projects/Pages/ProjectList.razor.rz.scp.css */
/* ProjectList.razor.css — isolated ProjectLens portfolio presentation */
.project-list[b-zk5nftxx7s] {
    --pj-ink: #14243a;
    --pj-muted: #64748b;
    --pj-line: #e4e9f1;
    --pj-surface: #ffffff;
    --pj-soft: #f7f9fc;
    --pj-indigo: #4f46e5;
    --pj-teal: #0d9488;
    max-width: 1340px;
    margin: 0 auto;
    padding: 18px 8px 54px;
    color: var(--pj-ink);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
}

.pd-back[b-zk5nftxx7s] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .88);
    font-size: .82rem;
    font-weight: 500;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

    .pd-back:hover[b-zk5nftxx7s] {
        background: rgba(255, 255, 255, .2);
        transform: translateX(-3px);
    }

.pd-back__arrow[b-zk5nftxx7s] {
    transition: transform .2s ease;
}

.pd-back:hover .pd-back__arrow[b-zk5nftxx7s] {
    transform: translateX(-3px);
}

.pd-create[b-zk5nftxx7s] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .88);
    font-size: .82rem;
    font-weight: 500;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

    .pd-create:hover[b-zk5nftxx7s] {
        background: rgba(255, 255, 255, .2);
        transform: translateY(-2px);
    }

.pd-create__icon[b-zk5nftxx7s] {
    font-size: 1.1rem;
    line-height: 1;
}

.project-list__hero[b-zk5nftxx7s] {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    min-height: 198px;
    padding: 31px 36px 32px;
    overflow: hidden;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(115deg, #101b35 0%, #202958 62%, #17545e 140%);
    box-shadow: 0 18px 38px -30px rgba(16,27,53,.8);
}

.project-list__hero-copy[b-zk5nftxx7s], [b-zk5nftxx7s] .project-list__create {
    position: relative;
    z-index: 1;
}

.project-list__hero[b-zk5nftxx7s]::after {
    content: "";
    position: absolute;
    top: 0;
    right: 20%;
    bottom: 0;
    width: 1px;
    background: rgba(255,255,255,.055);
    transform: skewX(-32deg);
    box-shadow: 100px 0 rgba(255,255,255,.04), 200px 0 rgba(255,255,255,.035);
    pointer-events: none;
}

.project-list__hero-line[b-zk5nftxx7s] {
    position: absolute;
    inset: auto 0 0;
    height: 2px;
    background: linear-gradient(90deg, #4f46e5, #22c2b3, transparent);
}

.project-list__eyebrow[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #83d5d4;
    font-size: .69rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
}

    .project-list__eyebrow .material-icons[b-zk5nftxx7s] {
        font-size: 15px;
    }

.project-list__hero h1[b-zk5nftxx7s] {
    margin: 19px 0 6px;
    color: #fff;
    font-size: clamp(2rem, 3vw, 2.65rem);
    font-weight: 720;
    line-height: 1.12;
    letter-spacing: 0;
}

.project-list__hero p[b-zk5nftxx7s] {
    margin: 0;
    max-width: 510px;
    color: rgba(255,255,255,.7);
    font-size: .87rem;
    line-height: 1.55;
}

.project-list__create[b-zk5nftxx7s], [b-zk5nftxx7s] .project-list__empty-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 39px;
    padding-inline: 16px;
    border: 0;
    border-radius: 7px;
    color: #fff;
    background: #4f46e5;
    font: inherit;
    font-size: .8rem;
    font-weight: 700;
    box-shadow: 0 8px 18px -12px rgba(20,24,90,.8);
    white-space: nowrap;
    cursor: pointer;
}

    .project-list__create .material-icons[b-zk5nftxx7s] {
        font-size: 18px;
    }

    .project-list__create:hover[b-zk5nftxx7s], [b-zk5nftxx7s] .project-list__empty-cta:hover {
        background: #4338ca;
    }

    .project-list__create:focus-visible[b-zk5nftxx7s], [b-zk5nftxx7s] .project-list__empty-cta:focus-visible {
        outline: 3px solid #8de2df;
        outline-offset: 3px;
    }

.project-list__overview[b-zk5nftxx7s] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 35px;
}

.project-list__metric[b-zk5nftxx7s] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 108px;
    padding: 20px;
    border: 1px solid var(--pj-line);
    border-radius: 8px;
    background: var(--pj-surface);
    box-shadow: 0 10px 28px -27px #14243a;
}

.project-list__metric-icon[b-zk5nftxx7s] {
    display: grid;
    place-items: center;
    flex: 0 0 44px;
    height: 44px;
    border-radius: 8px;
}

    .project-list__metric-icon .material-icons[b-zk5nftxx7s] {
        font-size: 22px;
    }

.project-list__metric-icon--all[b-zk5nftxx7s] {
    color: var(--pj-indigo);
    background: #eeedff;
}

.project-list__metric-icon--active[b-zk5nftxx7s] {
    color: #087967;
    background: #e6f7f1;
}

.project-list__metric-icon--inactive[b-zk5nftxx7s] {
    color: #a66217;
    background: #fff3e3;
}

.project-list__metric > div[b-zk5nftxx7s] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.project-list__metric-label[b-zk5nftxx7s] {
    color: var(--pj-muted);
    font-size: .74rem;
    font-weight: 600;
}

.project-list__metric strong[b-zk5nftxx7s] {
    color: var(--pj-ink);
    font-size: 1.72rem;
    line-height: 1.2;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
}

.project-list__metric-index[b-zk5nftxx7s] {
    position: absolute;
    top: 17px;
    right: 17px;
    color: #b6c0cf;
    font-size: .63rem;
    font-weight: 700;
}

.project-list__main[b-zk5nftxx7s] {
    min-width: 0;
}

.project-list__section-head[b-zk5nftxx7s] {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.project-list__section-kicker[b-zk5nftxx7s] {
    color: var(--pj-teal);
    font-size: .64rem;
    font-weight: 750;
    letter-spacing: .09em;
}

.project-list__section-head h2[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 3px 0 0;
    font-size: 1.35rem;
    font-weight: 730;
}

    .project-list__section-head h2 span[b-zk5nftxx7s] {
        padding: 3px 7px;
        border-radius: 5px;
        color: var(--pj-muted);
        background: #edf1f6;
        font-size: .69rem;
    }

.project-list__section-head p[b-zk5nftxx7s] {
    margin: 0 0 3px;
    color: var(--pj-muted);
    font-size: .8rem;
}

.project-list__toolbar[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    border: 1px solid var(--pj-line);
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
    background: var(--pj-surface);
}

.project-list__search[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 1 1 280px;
    max-width: 390px;
    min-width: 160px;
    height: 39px;
    padding: 0 12px;
    border: 1px solid var(--pj-line);
    border-radius: 7px;
    color: #92a0b2;
    background: var(--pj-soft);
    transition: border-color .2s, box-shadow .2s;
}

    .project-list__search:focus-within[b-zk5nftxx7s] {
        border-color: var(--pj-indigo);
        box-shadow: 0 0 0 3px #eeedff;
    }

    .project-list__search .material-icons[b-zk5nftxx7s] {
        font-size: 19px;
    }

    .project-list__search input[b-zk5nftxx7s] {
        width: 100%;
        min-width: 0;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--pj-ink);
        font: inherit;
        font-size: .8rem;
    }

        .project-list__search input[b-zk5nftxx7s]::placeholder {
            color: #98a5b5;
        }

.project-list__refresh[b-zk5nftxx7s] {
    display: grid;
    place-items: center;
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    padding: 0;
    border: 1px solid var(--pj-line);
    border-radius: 7px;
    color: var(--pj-muted);
    background: var(--pj-surface);
    cursor: pointer;
}

    .project-list__refresh .material-icons[b-zk5nftxx7s] {
        font-size: 19px;
    }

    .project-list__refresh:hover[b-zk5nftxx7s] {
        color: var(--pj-indigo);
        background: var(--pj-soft);
    }

    .project-list__refresh:disabled[b-zk5nftxx7s] {
        opacity: .65;
        cursor: wait;
    }

.project-list__refreshing[b-zk5nftxx7s] {
    animation: project-list-spin-b-zk5nftxx7s .85s linear infinite;
}

.project-list__table-meta[b-zk5nftxx7s] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border: 1px solid var(--pj-line);
    border-bottom: 0;
    background: #fbfcfe;
    color: var(--pj-muted);
    font-size: .71rem;
    font-weight: 650;
}

    .project-list__table-meta > span:first-child[b-zk5nftxx7s] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--pj-ink);
        font-size: .63rem;
        font-weight: 800;
        letter-spacing: .065em;
    }

.project-list__table-meta-dot[b-zk5nftxx7s] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--pj-teal);
    box-shadow: 0 0 0 3px #e2f5f0;
}

.project-list__table-scroll[b-zk5nftxx7s] {
    min-width: 0;
    overflow-x: auto;
    border: 1px solid var(--pj-line);
    border-radius: 0 0 8px 8px;
    background: var(--pj-surface);
    transition: opacity .2s;
}

.project-list__table-scroll--refreshing[b-zk5nftxx7s] {
    opacity: .55;
    pointer-events: none;
}

[b-zk5nftxx7s] .project-list__grid {
    min-width: 870px;
    border: 0 !important;
    background: transparent !important;
    font-size: .79rem;
}

    [b-zk5nftxx7s] .project-list__grid .rz-grid-table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table thead th {
            height: 49px;
            padding: 12px 18px !important;
            border: 0 !important;
            border-bottom: 1px solid var(--pj-line) !important;
            background: #f3f6fa !important;
            color: #65768a !important;
            font-size: .64rem !important;
            font-weight: 800 !important;
            letter-spacing: .065em;
            white-space: nowrap;
        }

            [b-zk5nftxx7s] .project-list__grid .rz-grid-table thead th .rz-column-title {
                color: inherit !important;
                font-size: inherit !important;
                font-weight: inherit !important;
            }

            [b-zk5nftxx7s] .project-list__grid .rz-grid-table thead th .rz-sortable-column {
                cursor: pointer;
            }

            [b-zk5nftxx7s] .project-list__grid .rz-grid-table thead th .rzi {
                color: var(--pj-indigo);
            }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table tbody td {
            height: 78px;
            padding: 13px 18px !important;
            border: 0 !important;
            border-bottom: 1px solid #eaf0f5 !important;
            background: var(--pj-surface);
            vertical-align: middle;
            transition: background-color .18s;
        }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table tbody tr:nth-child(even) td {
            background: #fbfcfe;
        }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table tbody tr:hover td {
            background: #f1f8f7 !important;
        }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table tbody tr td:first-child {
            box-shadow: inset 3px 0 transparent;
            transition: box-shadow .18s, background-color .18s;
        }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table tbody tr:hover td:first-child {
            box-shadow: inset 3px 0 var(--pj-teal);
        }

        [b-zk5nftxx7s] .project-list__grid .rz-grid-table tbody tr:last-child td {
            border-bottom: 0 !important;
        }

    [b-zk5nftxx7s] .project-list__grid .rz-paginator {
        min-height: 64px;
        padding: 11px 18px;
        gap: 8px;
        border-top: 1px solid var(--pj-line);
        background: #fbfcfe;
        color: var(--pj-muted);
        font-size: .73rem;
    }

    [b-zk5nftxx7s] .project-list__grid .rz-paginator-page, [b-zk5nftxx7s] .project-list__grid .rz-paginator-element {
        min-width: 32px;
        height: 32px;
        border-radius: 5px !important;
    }

        [b-zk5nftxx7s] .project-list__grid .rz-paginator-page.rz-state-active {
            background: var(--pj-indigo) !important;
            color: #fff !important;
        }

        [b-zk5nftxx7s] .project-list__grid .rz-paginator-element:hover:not(.rz-state-disabled) {
            background: #eeedff;
            color: var(--pj-indigo);
        }

.project-list__identity[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 185px;
}

.project-list__folder[b-zk5nftxx7s] {
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    height: 40px;
    border: 1px solid #dcdafa;
    border-radius: 7px;
    color: var(--pj-indigo);
    background: #f2f1ff;
}

    .project-list__folder .material-icons[b-zk5nftxx7s] {
        font-size: 20px;
    }

.project-list__identity-text[b-zk5nftxx7s] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

    .project-list__identity-text strong[b-zk5nftxx7s] {
        overflow: hidden;
        color: var(--pj-ink);
        font-size: .83rem;
        font-weight: 750;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .project-list__identity-text small[b-zk5nftxx7s] {
        overflow: hidden;
        color: var(--pj-muted);
        font-size: .7rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.project-list__count[b-zk5nftxx7s] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 48px;
    padding: 6px 9px;
    border: 1px solid #e5eaf1;
    border-radius: 5px;
    background: #f8fafc;
    color: #405169;
    font-size: .76rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

    .project-list__count .material-icons[b-zk5nftxx7s] {
        color: #8295ab;
        font-size: 16px;
    }

.project-list__timeline[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #405169;
    font-size: .73rem;
    font-weight: 650;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.project-list__timeline-track[b-zk5nftxx7s] {
    position: relative;
    width: 24px;
    height: 1px;
    background: #bdd0d2;
}

    .project-list__timeline-track i[b-zk5nftxx7s] {
        position: absolute;
        top: -2px;
        right: 0;
        width: 5px;
        height: 5px;
        border-top: 1px solid var(--pj-teal);
        border-right: 1px solid var(--pj-teal);
        transform: rotate(45deg);
    }

.project-list__status[b-zk5nftxx7s] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    border-radius: 5px;
    font-size: .71rem;
    font-weight: 700;
    white-space: nowrap;
}

.project-list__status--active[b-zk5nftxx7s] {
    color: #087967;
    background: #e6f7f1;
}

.project-list__status--inactive[b-zk5nftxx7s] {
    color: #7a8799;
    background: #edf1f5;
}

.project-list__status-dot[b-zk5nftxx7s] {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: currentColor;
}

.project-list__actions[b-zk5nftxx7s] {
    display: flex;
    justify-content: center;
    gap: 6px;
}

[b-zk5nftxx7s] .project-list__action {
    display: grid;
    place-items: center;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    padding: 0;
    border: 1px solid #e4e9f1;
    border-radius: 5px;
    color: #64748b;
    background: #fff;
    cursor: pointer;
    transition: color .18s, background-color .18s, border-color .18s;
}

    [b-zk5nftxx7s] .project-list__action .material-icons {
        font-size: 18px;
    }

    [b-zk5nftxx7s] .project-list__action:hover {
        border-color: var(--pj-line) !important;
        color: var(--pj-indigo) !important;
        background: #f3f3ff !important;
    }

[b-zk5nftxx7s] .project-list__action--delete:hover {
    border-color: #fecaca !important;
    color: #b91c1c !important;
    background: #fef2f2 !important;
}

[b-zk5nftxx7s] .project-list__action:focus-visible, .project-list__refresh:focus-visible[b-zk5nftxx7s] {
    outline: 2px solid var(--pj-indigo);
    outline-offset: 2px;
}

.project-list__empty[b-zk5nftxx7s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 295px;
    padding: 35px 16px;
    border: 1px solid var(--pj-line);
    border-radius: 0 0 8px 8px;
    background: var(--pj-surface);
    text-align: center;
}

.project-list__empty-icon[b-zk5nftxx7s] {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    margin-bottom: 15px;
    border-radius: 8px;
    color: var(--pj-indigo);
    background: #eeedff;
}

    .project-list__empty-icon .material-icons[b-zk5nftxx7s] {
        font-size: 26px;
    }

.project-list__empty h3[b-zk5nftxx7s] {
    margin: 0 0 6px;
    font-size: 1rem;
}

.project-list__empty p[b-zk5nftxx7s] {
    margin: 0 0 18px;
    color: var(--pj-muted);
    font-size: .8rem;
}

.project-list__clear[b-zk5nftxx7s] {
    padding: 8px 12px;
    border: 1px solid var(--pj-line);
    border-radius: 6px;
    color: var(--pj-indigo);
    background: var(--pj-surface);
    font: inherit;
    font-size: .77rem;
    font-weight: 700;
    cursor: pointer;
}

    .project-list__clear:hover[b-zk5nftxx7s] {
        background: var(--pj-soft);
    }

.project-list__loading-icon[b-zk5nftxx7s] {
    margin-bottom: 15px;
    color: var(--pj-indigo);
    font-size: 27px;
    animation: project-list-spin-b-zk5nftxx7s 1s linear infinite;
}

.project-list__loading[b-zk5nftxx7s] {
    overflow: hidden;
    min-height: 353px;
    border: 1px solid var(--pj-line);
    border-radius: 0 0 8px 8px;
    background: var(--pj-surface);
}

.project-list__loading-head[b-zk5nftxx7s] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 90px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--pj-line);
    background: #fbfcfe;
}

.project-list__loading-emblem[b-zk5nftxx7s] {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    height: 42px;
    border: 1px solid #dcdafa;
    border-radius: 7px;
    color: var(--pj-indigo);
    background: #f2f1ff;
}

.project-list__loading-head > div[b-zk5nftxx7s] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.project-list__loading-head strong[b-zk5nftxx7s] {
    font-size: .84rem;
    color: var(--pj-ink);
}

.project-list__loading-head > div > span[b-zk5nftxx7s] {
    color: var(--pj-muted);
    font-size: .74rem;
}

.project-list__loading-pulse[b-zk5nftxx7s] {
    width: 8px;
    height: 8px;
    margin-left: auto;
    border-radius: 50%;
    background: var(--pj-teal);
    animation: project-list-pulse-b-zk5nftxx7s 1.4s ease-in-out infinite;
}

.project-list__skeleton-header[b-zk5nftxx7s], .project-list__skeleton-row[b-zk5nftxx7s] {
    display: grid;
    grid-template-columns: minmax(180px, 2.3fr) .8fr .8fr 1.65fr .7fr;
    align-items: center;
    gap: 28px;
    padding: 0 22px;
}

.project-list__skeleton-header[b-zk5nftxx7s] {
    height: 45px;
    background: #f3f6fa;
}

.project-list__skeleton-row[b-zk5nftxx7s] {
    position: relative;
    height: 67px;
    border-top: 1px solid #edf1f5;
}

    .project-list__skeleton-header i[b-zk5nftxx7s], .project-list__skeleton-row i[b-zk5nftxx7s] {
        display: block;
        width: 60%;
        height: 10px;
        border-radius: 3px;
        background: #e9eef5;
    }

    .project-list__skeleton-row i[b-zk5nftxx7s] {
        height: 12px;
        background: linear-gradient(90deg, #e9eef5 25%, #f6f8fb 50%, #e9eef5 75%);
        background-size: 200% 100%;
        animation: project-list-shimmer-b-zk5nftxx7s 1.7s linear infinite;
    }

        .project-list__skeleton-row i:first-of-type[b-zk5nftxx7s] {
            width: 70%;
            margin-left: 52px;
        }

        .project-list__skeleton-row i:nth-of-type(2)[b-zk5nftxx7s], .project-list__skeleton-row i:nth-of-type(3)[b-zk5nftxx7s] {
            width: 38%;
        }

.project-list__skeleton-folder[b-zk5nftxx7s] {
    position: absolute;
    left: 22px;
    width: 38px;
    height: 38px;
    border-radius: 6px;
    background: #eeedff;
}

@keyframes project-list-shimmer-b-zk5nftxx7s {
    to {
        background-position-x: -200%;
    }
}

@keyframes project-list-pulse-b-zk5nftxx7s {
    50% {
        opacity: .35;
        transform: scale(.75);
    }
}

@keyframes project-list-spin-b-zk5nftxx7s {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 800px) {
    .project-list__overview[b-zk5nftxx7s] {
        gap: 8px;
    }

    .project-list__metric[b-zk5nftxx7s] {
        padding: 14px;
    }

    .project-list__metric-index[b-zk5nftxx7s] {
        display: none;
    }

    .project-list__toolbar[b-zk5nftxx7s] {
        flex-wrap: wrap;
    }

    .project-list__search[b-zk5nftxx7s] {
        flex: 1 1 100%;
        max-width: none;
    }

    .project-list__refresh[b-zk5nftxx7s] {
        margin-left: auto;
    }
}

@media (max-width: 600px) {
    .project-list[b-zk5nftxx7s] {
        padding: 4px 0 34px;
    }

    .project-list__hero[b-zk5nftxx7s] {
        align-items: flex-start;
        flex-direction: column;
        min-height: auto;
        padding: 25px 22px;
    }

        .project-list__hero h1[b-zk5nftxx7s] {
            margin-top: 14px;
        }

    .project-list__overview[b-zk5nftxx7s] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin: 12px 0 25px;
    }

    .project-list__metric[b-zk5nftxx7s] {
        flex-direction: column;
        align-items: flex-start;
        gap: 9px;
        min-height: 115px;
        padding: 12px;
    }

    .project-list__metric-icon[b-zk5nftxx7s] {
        flex-basis: 30px;
        width: 30px;
        height: 30px;
    }

        .project-list__metric-icon .material-icons[b-zk5nftxx7s] {
            font-size: 17px;
        }

    .project-list__metric-label[b-zk5nftxx7s] {
        font-size: .66rem;
    }

    .project-list__metric strong[b-zk5nftxx7s] {
        font-size: 1.32rem;
    }

    .project-list__section-head p[b-zk5nftxx7s] {
        display: none;
    }

    .project-list__toolbar[b-zk5nftxx7s] {
        padding: 10px;
    }

    .project-list__skeleton-header[b-zk5nftxx7s], .project-list__skeleton-row[b-zk5nftxx7s] {
        min-width: 720px;
    }

    .project-list__skeleton-table[b-zk5nftxx7s] {
        overflow: hidden;
    }
}

@media (prefers-reduced-motion: reduce) {
    .project-list *[b-zk5nftxx7s], .project-list *[b-zk5nftxx7s]::before, .project-list *[b-zk5nftxx7s]::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }
}
/* /Components/Features/Projects/Pages/TaskCreate.razor.rz.scp.css */
/* TaskCreate.razor.css — scoped */
.tc-shell[b-tkmdfyme3l] {
    --tc-bg: #f5f7fb;
    --tc-surface: #ffffff;
    --tc-surface-soft: #f8fafc;
    --tc-ink: #0f172a;
    --tc-muted: #64748b;
    --tc-line: #e2e8f0;
    --tc-brand: #4f46e5;
    --tc-brand-2: #0891b2;
    --tc-success: #059669;
    --tc-danger: #dc2626;
    --tc-radius: 16px;
    --tc-shadow: 0 16px 40px -30px rgba(15, 23, 42, .45);
    max-width: 1180px;
    margin: 0 auto;
    padding: 28px 24px 120px;
    color: var(--tc-ink);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
}

.tc-field--error[b-tkmdfyme3l] {
    position: relative;
}

    .tc-field--error input[b-tkmdfyme3l],
    .tc-field--error textarea[b-tkmdfyme3l],
    .tc-field--error .rz-dropdown[b-tkmdfyme3l],
    .tc-field--error .rz-datepicker[b-tkmdfyme3l],
    .tc-field--error .rz-numeric[b-tkmdfyme3l] {
        border-color: #dc2626 !important;
    }

    .tc-field--error .rz-calendar-button[b-tkmdfyme3l] {
        border-color: #dc2626 !important;
    }

.tc-apply-all[b-tkmdfyme3l] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #d1d5db;
    background: #fff;
    color: #374151;
    border-radius: 7px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s ease;
}

    .tc-apply-all:hover[b-tkmdfyme3l] {
        background: #f3f4f6;
        border-color: #9ca3af;
    }

    .tc-apply-all .material-icons[b-tkmdfyme3l] {
        font-size: 16px;
    }


.tc-header[b-tkmdfyme3l] {
    position: relative;
    overflow: hidden;
    min-height: 220px;
    padding: 32px 36px;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(125deg, #0b1120 0%, #1e1b4b 58%, #0f766e 145%);
    box-shadow: 0 24px 56px -34px rgba(15, 23, 42, .9);
}

    .tc-header[b-tkmdfyme3l]::after {
        content: "";
        position: absolute;
        width: 360px;
        height: 360px;
        top: -220px;
        right: -40px;
        border-radius: 50%;
        border: 70px solid rgba(255,255,255,.045);
        pointer-events: none;
    }

.tc-back[b-tkmdfyme3l] {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border: 0;
    border-radius: 8px;
    color: rgba(255,255,255,.72);
    background: transparent;
    font: inherit;
    font-size: .82rem;
    font-weight: 600;
    cursor: pointer;
    transition: color .2s, background .2s, transform .2s;
}

    .tc-back:hover[b-tkmdfyme3l] {
        color: #fff;
        background: rgba(255,255,255,.09);
        transform: translateX(-2px);
    }

    .tc-back .material-icons[b-tkmdfyme3l] {
        font-size: 18px;
    }

.tc-heading[b-tkmdfyme3l] {
    position: relative;
    z-index: 1;
    margin-top: 27px;
    max-width: 680px;
}

.tc-eyebrow[b-tkmdfyme3l], .tc-step[b-tkmdfyme3l] {
    display: block;
    margin-bottom: 7px;
    color: #67e8f9;
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.tc-heading h1[b-tkmdfyme3l] {
    margin: 0;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.08;
    font-weight: 720;
    letter-spacing: 0;
}

.tc-heading p[b-tkmdfyme3l] {
    margin: 11px 0 0;
    max-width: 560px;
    color: rgba(255,255,255,.64);
    font-size: .95rem;
    line-height: 1.6;
}

.tc-header__summary[b-tkmdfyme3l] {
    position: absolute;
    z-index: 1;
    right: 36px;
    bottom: 34px;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 172px;
    padding: 14px 16px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 12px;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(8px);
}

    .tc-header__summary > .material-icons[b-tkmdfyme3l] {
        color: #67e8f9;
    }

    .tc-header__summary div[b-tkmdfyme3l] {
        display: flex;
        flex-direction: column;
    }

    .tc-header__summary strong[b-tkmdfyme3l] {
        font-size: 1.25rem;
        line-height: 1;
    }

    .tc-header__summary small[b-tkmdfyme3l] {
        margin-top: 4px;
        color: rgba(255,255,255,.58);
        font-size: .7rem;
    }

.tc-loading[b-tkmdfyme3l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 340px;
    margin-top: 22px;
    border: 1px solid var(--tc-line);
    border-radius: var(--tc-radius);
    background: var(--tc-surface);
    color: var(--tc-muted);
}

    .tc-loading strong[b-tkmdfyme3l] {
        margin: 14px 0 5px;
        color: var(--tc-ink);
    }

.tc-loading__icon[b-tkmdfyme3l] {
    color: var(--tc-brand);
    font-size: 34px;
    animation: tc-spin-b-tkmdfyme3l 1s linear infinite;
}

@keyframes tc-spin-b-tkmdfyme3l {
    to {
        transform: rotate(360deg);
    }
}

.tc-content[b-tkmdfyme3l] {
    display: grid;
    gap: 20px;
    margin-top: 22px;
}

.tc-section[b-tkmdfyme3l] {
    overflow: hidden;
    border: 1px solid var(--tc-line);
    border-radius: var(--tc-radius);
    background: var(--tc-surface);
    box-shadow: var(--tc-shadow);
}

.tc-section__head[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 22px 24px;
    border-bottom: 1px solid var(--tc-line);
}

.tc-section__head--split[b-tkmdfyme3l] {
    justify-content: space-between;
}

.tc-section__title[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.tc-section__icon[b-tkmdfyme3l] {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    color: var(--tc-brand);
    background: color-mix(in srgb, var(--tc-brand) 10%, white);
}

    .tc-section__icon .material-icons[b-tkmdfyme3l] {
        font-size: 21px;
    }

.tc-section h2[b-tkmdfyme3l] {
    margin: 0;
    font-size: 1.12rem;
    line-height: 1.3;
}

.tc-section__head p[b-tkmdfyme3l] {
    margin: 4px 0 0;
    color: var(--tc-muted);
    font-size: .81rem;
    line-height: 1.45;
}

.tc-step[b-tkmdfyme3l] {
    margin: 0 0 3px;
    color: var(--tc-brand);
    font-size: .58rem;
}

.tc-phase-count[b-tkmdfyme3l] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--tc-surface-soft);
    color: var(--tc-muted);
}

    .tc-phase-count strong[b-tkmdfyme3l] {
        color: var(--tc-ink);
    }

    .tc-phase-count span[b-tkmdfyme3l] {
        font-size: .74rem;
    }

.tc-name-field[b-tkmdfyme3l] {
    max-width: 680px;
    padding: 24px;
}

    .tc-field label[b-tkmdfyme3l], .tc-name-field > label[b-tkmdfyme3l] {
        display: flex;
        align-items: center;
        gap: 5px;
        margin-bottom: 7px;
        color: #334155;
        font-size: .76rem;
        font-weight: 650;
    }

        .tc-field label > span[b-tkmdfyme3l], .tc-name-field > label > span[b-tkmdfyme3l] {
            color: var(--tc-danger);
        }

        .tc-field label small[b-tkmdfyme3l] {
            margin-left: auto;
            color: var(--tc-muted);
            font-size: .67rem;
            font-weight: 500;
        }

.tc-validation[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 7px 0 0;
    color: var(--tc-danger);
    font-size: .75rem;
}

    .tc-validation .material-icons[b-tkmdfyme3l] {
        font-size: 16px;
    }

[b-tkmdfyme3l] .tc-shell .rz-textbox,
[b-tkmdfyme3l] .tc-shell .rz-textarea,
[b-tkmdfyme3l] .tc-shell .rz-dropdown,
[b-tkmdfyme3l] .tc-shell .rz-numeric,
[b-tkmdfyme3l] .tc-shell .rz-datepicker {
    border-color: #d8dee9;
    border-radius: 8px;
    box-shadow: none;
}

[b-tkmdfyme3l] .tc-shell .rz-textbox,
[b-tkmdfyme3l] .tc-shell .rz-textarea {
    padding: .67rem .78rem;
}

[b-tkmdfyme3l] .tc-shell .rz-dropdown {
    min-height: 42px;
}

[b-tkmdfyme3l] .tc-shell .rz-numeric, [b-tkmdfyme3l] .tc-shell .rz-datepicker {
    min-height: 42px;
}

    [b-tkmdfyme3l] .tc-shell .rz-textbox:focus,
    [b-tkmdfyme3l] .tc-shell .rz-textarea:focus,
    [b-tkmdfyme3l] .tc-shell .rz-dropdown:focus-within,
    [b-tkmdfyme3l] .tc-shell .rz-numeric:focus-within,
    [b-tkmdfyme3l] .tc-shell .rz-datepicker:focus-within {
        border-color: var(--tc-brand);
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--tc-brand) 12%, transparent);
    }

[b-tkmdfyme3l] .tc-non-working-day {
    color: var(--tc-danger) !important;
    background: #fef2f2 !important;
    font-weight: 700;
}

.tc-progress[b-tkmdfyme3l] {
    display: flex;
    gap: 0;
    overflow-x: auto;
    padding: 18px 24px;
    border-bottom: 1px solid var(--tc-line);
    background: var(--tc-surface-soft);
    scrollbar-width: thin;
}

.tc-progress__item[b-tkmdfyme3l] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 0 150px;
    gap: 8px;
    color: var(--tc-muted);
}

    .tc-progress__item:not(:last-child)[b-tkmdfyme3l]::after {
        content: "";
        height: 1px;
        flex: 1;
        margin-right: 10px;
        background: var(--tc-line);
    }

    .tc-progress__item > span[b-tkmdfyme3l] {
        display: grid;
        place-items: center;
        flex: 0 0 26px;
        height: 26px;
        border: 1px solid var(--tc-line);
        border-radius: 50%;
        background: var(--tc-surface);
        font-size: .69rem;
        font-weight: 700;
    }

    .tc-progress__item small[b-tkmdfyme3l] {
        overflow: hidden;
        max-width: 90px;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: .67rem;
        font-weight: 600;
    }

    .tc-progress__item.is-ready > span[b-tkmdfyme3l] {
        border-color: var(--tc-success);
        color: #fff;
        background: var(--tc-success);
    }

    .tc-progress__item.is-ready small[b-tkmdfyme3l] {
        color: var(--tc-success);
    }

.tc-phases[b-tkmdfyme3l] {
    display: grid;
    gap: 18px;
    padding: 22px;
    background: #f8fafc;
}

.tc-phase[b-tkmdfyme3l] {
    overflow: hidden;
    border: 1px solid var(--tc-line);
    border-radius: 13px;
    background: var(--tc-surface);
    box-shadow: 0 8px 28px -24px rgba(15,23,42,.55);
}

.tc-phase__head[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 17px 20px;
    border-bottom: 1px solid var(--tc-line);
}

.tc-phase__identity[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.tc-phase__number[b-tkmdfyme3l] {
    display: grid;
    place-items: center;
    flex: 0 0 34px;
    height: 34px;
    border-radius: 9px;
    color: #fff;
    background: linear-gradient(135deg, var(--tc-brand), var(--tc-brand-2));
    font-size: .8rem;
    font-weight: 750;
}

.tc-phase__identity h3[b-tkmdfyme3l] {
    overflow-wrap: anywhere;
    margin: 0;
    font-size: .98rem;
}

.tc-phase__identity p[b-tkmdfyme3l] {
    margin: 3px 0 0;
    color: var(--tc-muted);
    font-size: .69rem;
}

.tc-status[b-tkmdfyme3l] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border-radius: 7px;
    color: var(--tc-muted);
    background: var(--tc-surface-soft);
    font-size: .67rem;
    font-weight: 700;
}

    .tc-status .material-icons[b-tkmdfyme3l] {
        font-size: 15px;
    }

    .tc-status.is-ready[b-tkmdfyme3l] {
        color: var(--tc-success);
        background: #ecfdf5;
    }

.tc-phase__body[b-tkmdfyme3l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.tc-field-group[b-tkmdfyme3l] {
    padding: 20px;
    border-bottom: 1px solid var(--tc-line);
}

    .tc-field-group:nth-child(odd)[b-tkmdfyme3l] {
        border-right: 1px solid var(--tc-line);
    }

.tc-field-group__title[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    color: var(--tc-muted);
}

    .tc-field-group__title > .material-icons[b-tkmdfyme3l] {
        font-size: 17px;
        color: var(--tc-brand);
    }

    .tc-field-group__title h4[b-tkmdfyme3l] {
        margin: 0;
        color: var(--tc-ink);
        font-size: .78rem;
        text-transform: uppercase;
        letter-spacing: .08em;
    }

.tc-grid[b-tkmdfyme3l] {
    display: grid;
    gap: 15px;
}

.tc-grid--2[b-tkmdfyme3l] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tc-grid--3[b-tkmdfyme3l] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tc-field[b-tkmdfyme3l] {
    min-width: 0;
}

.tc-custom-fields[b-tkmdfyme3l] {
    grid-column: 1 / -1;
    border-right: 0 !important;
    background: #fbfdff;
}

.tc-custom-fields__head[b-tkmdfyme3l] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 15px;
}

    .tc-custom-fields__head .tc-field-group__title[b-tkmdfyme3l] {
        align-items: flex-start;
    }

    .tc-custom-fields__head p[b-tkmdfyme3l] {
        margin: 4px 0 0;
        color: var(--tc-muted);
        font-size: .72rem;
    }

.tc-field-count[b-tkmdfyme3l] {
    padding: 5px 8px;
    border: 1px solid var(--tc-line);
    border-radius: 6px;
    color: var(--tc-muted);
    background: var(--tc-surface);
    font-size: .65rem;
    white-space: nowrap;
}

.tc-switch-row[b-tkmdfyme3l] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 42px;
    margin: 0 !important;
}

    .tc-switch-row > span[b-tkmdfyme3l] {
        color: var(--tc-muted) !important;
    }

.tc-empty[b-tkmdfyme3l] {
    padding: 55px 24px;
    text-align: center;
    color: var(--tc-muted);
}

    .tc-empty > .material-icons[b-tkmdfyme3l] {
        font-size: 38px;
        color: #94a3b8;
    }

    .tc-empty h3[b-tkmdfyme3l] {
        margin: 10px 0 5px;
        color: var(--tc-ink);
        font-size: 1rem;
    }

    .tc-empty p[b-tkmdfyme3l] {
        margin: 0;
        font-size: .8rem;
    }

.tc-actions[b-tkmdfyme3l] {
    position: sticky;
    z-index: 10;
    bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--tc-line) 85%, transparent);
    border-radius: 13px;
    background: color-mix(in srgb, var(--tc-surface) 93%, transparent);
    box-shadow: 0 18px 46px -25px rgba(15,23,42,.55);
    backdrop-filter: blur(14px);
}

.tc-actions__right[b-tkmdfyme3l] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.tc-clear[b-tkmdfyme3l], .tc-cancel[b-tkmdfyme3l] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 39px;
    padding: 0 13px;
    border: 1px solid var(--tc-line);
    border-radius: 8px;
    color: var(--tc-muted);
    background: var(--tc-surface);
    font: inherit;
    font-size: .77rem;
    font-weight: 650;
    cursor: pointer;
}

.tc-clear[b-tkmdfyme3l] {
    border-color: transparent;
    background: transparent;
}

    .tc-clear .material-icons[b-tkmdfyme3l] {
        font-size: 17px;
    }

    .tc-clear:hover[b-tkmdfyme3l], .tc-cancel:hover[b-tkmdfyme3l] {
        color: var(--tc-ink);
        background: var(--tc-surface-soft);
    }

[b-tkmdfyme3l] .tc-save {
    min-height: 40px;
    padding-inline: 18px !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, var(--tc-brand), #4338ca) !important;
    box-shadow: 0 9px 20px -12px rgba(79,70,229,.85);
    font-weight: 700;
}

.reveal[b-tkmdfyme3l] {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .5s ease var(--delay, 0s), transform .5s cubic-bezier(.16,1,.3,1) var(--delay, 0s);
}

    .reveal.is-visible[b-tkmdfyme3l] {
        opacity: 1;
        transform: none;
    }

@media (max-width: 900px) {
    .tc-header__summary[b-tkmdfyme3l] {
        display: none;
    }

    .tc-phase__body[b-tkmdfyme3l] {
        grid-template-columns: 1fr;
    }

    .tc-field-group:nth-child(odd)[b-tkmdfyme3l] {
        border-right: 0;
    }

    .tc-grid--3[b-tkmdfyme3l] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .tc-shell[b-tkmdfyme3l] {
        padding: 14px 12px 95px;
    }

    .tc-header[b-tkmdfyme3l] {
        min-height: 210px;
        padding: 22px 20px;
        border-radius: 16px;
    }

    .tc-heading[b-tkmdfyme3l] {
        margin-top: 24px;
    }

    .tc-section__head[b-tkmdfyme3l], .tc-name-field[b-tkmdfyme3l] {
        padding: 18px;
    }

    .tc-section__head--split[b-tkmdfyme3l] {
        align-items: flex-start;
    }

    .tc-phase-count[b-tkmdfyme3l] {
        display: none;
    }

    .tc-progress[b-tkmdfyme3l] {
        padding-inline: 18px;
    }

    .tc-phases[b-tkmdfyme3l] {
        padding: 12px;
    }

    .tc-phase__head[b-tkmdfyme3l] {
        align-items: flex-start;
        padding: 15px;
    }

    .tc-status[b-tkmdfyme3l] {
        flex: 0 0 auto;
    }

    .tc-field-group[b-tkmdfyme3l] {
        padding: 17px 15px;
    }

    .tc-grid--2[b-tkmdfyme3l], .tc-grid--3[b-tkmdfyme3l] {
        grid-template-columns: 1fr;
    }

    .tc-actions[b-tkmdfyme3l] {
        bottom: 8px;
    }



    .tc-clear[b-tkmdfyme3l] {
        width: 39px;
        padding: 0;
        justify-content: center;
    }

        .tc-clear span:last-child[b-tkmdfyme3l] {
            display: none;
        }
}

@media (prefers-reduced-motion: reduce) {
    .tc-shell *[b-tkmdfyme3l], .tc-shell *[b-tkmdfyme3l]::before, .tc-shell *[b-tkmdfyme3l]::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }

    .reveal[b-tkmdfyme3l] {
        opacity: 1;
        transform: none;
    }
}
/* /Components/Features/Staff/Pages/StaffList.razor.rz.scp.css */
.staff-page[b-lemrrach6m] {
    --ink: #172033;
    --muted: #697386;
    --line: #e6eaf0;
    --brand: #4f46e5;
    color: var(--ink);
    display: grid;
    gap: 1.5rem;
    padding: .5rem 0 2rem;
}

.staff-hero[b-lemrrach6m] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.eyebrow[b-lemrrach6m] {
    color: var(--brand);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.staff-hero h1[b-lemrrach6m] {
    font-size: clamp(1.75rem,3vw,2.35rem);
    letter-spacing: -.04em;
    margin: .25rem 0;
}

.staff-hero p[b-lemrrach6m], .panel-header p[b-lemrrach6m] {
    color: var(--muted);
    margin: 0;
}

.primary-action[b-lemrrach6m] {
    border-radius: 10px !important;
    box-shadow: 0 8px 20px rgba(79,70,229,.2);
    font-weight: 700;
    padding: .75rem 1.1rem !important;
}

.metric-grid[b-lemrrach6m] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.metric-card[b-lemrrach6m] {
    background: #fff;
    border: 1px solid var(--line); 
    border-radius: 16px;
    box-shadow: 0 3px 14px rgba(30,41,59,.04);
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .8rem;
    padding: 1.1rem;
}

.metric-card > .metric-icon[b-lemrrach6m] {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 12px;
    background: #eef2ff;
    color: #4f46e5;
}

.metric-card > .metric-icon[b-lemrrach6m]  .rzi {
        display: block;
        width: 24px;
        height: 24px;
        margin: 0;
        padding: 0;
        font-size: 24px;
        line-height: 1;
        position: static;
    }

    .metric-icon.purple[b-lemrrach6m] {
        background: #f4eefe;
        color: #8b5cf6;
    }

    .metric-icon.green[b-lemrrach6m] {
        background: #eafaf3;
        color: #119c69
    }

    .metric-icon.amber[b-lemrrach6m] {
        background: #fff7e6;
        color: #d97706
    }

.metric-card strong[b-lemrrach6m], .metric-card span[b-lemrrach6m], .metric-card small[b-lemrrach6m] {
    display: block;
}

.metric-card strong[b-lemrrach6m] {
    font-size: 1.45rem;
    line-height: 1
}

.metric-card div span[b-lemrrach6m] {
    color: var(--muted);
    font-size: .78rem;
    margin-top: .35rem
}

.metric-card small[b-lemrrach6m] {
    color: #98a1b2;
    font-size: .7rem;
    grid-column: 2
}

.directory-panel[b-lemrrach6m] {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: 0 8px 30px rgba(30,41,59,.055);
    overflow: hidden;
}

.panel-header[b-lemrrach6m] {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    padding: 1.25rem 1.4rem;
}

    .panel-header h2[b-lemrrach6m] {
        font-size: 1.1rem;
        margin: 0 0 .2rem;
    }

    .panel-header p[b-lemrrach6m] {
        font-size: .78rem
    }

.filter-bar[b-lemrrach6m] {
    align-items: center;
    background: #fafbfc;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: .75rem;
    padding: 1rem 1.4rem;
}

.search-field[b-lemrrach6m] {
    align-items: center;
    background: #fff;
    border: 1px solid #dfe3e9;
    border-radius: 10px;
    display: flex;
    flex: 1;
    max-width: 460px;
    padding-left: .8rem;
}

    .search-field[b-lemrrach6m] >  .rz-icon {
        color: #8a94a6;
    }

    .search-field input[b-lemrrach6m] {
        background: transparent;
        border: 0;
        color: var(--ink);
        font: inherit;
        font-size: .82rem;
        outline: 0;
        padding: .68rem .75rem;
        width: 100%;
    }

        .search-field input[b-lemrrach6m]::placeholder {
            color: #929bad;
        }

    .search-field:focus-within[b-lemrrach6m] {
        border-color: #818cf8;
        box-shadow: 0 0 0 3px rgba(99,102,241,.12);
    }

.filter-select[b-lemrrach6m] {
    min-width: 170px
}

.clear-filter[b-lemrrach6m] {
    white-space: nowrap
}

.employee-grid[b-lemrrach6m] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3,minmax(0,1fr));
    padding: 1.25rem;
}

.employee-card[b-lemrrach6m] {
    border: 1px solid var(--line);
    border-radius: 15px;
    overflow: hidden;
    padding: 0 1.05rem 1rem;
    position: relative;
    transition: transform .2s ease,box-shadow .2s ease;
}

    .employee-card:hover[b-lemrrach6m] {
        box-shadow: 0 12px 28px rgba(30,41,59,.1);
        transform: translateY(-2px);
    }

.card-accent[b-lemrrach6m] {
    background: linear-gradient(90deg,#4f46e5,#8b5cf6);
    height: 3px;
    margin: 0 -1.05rem
}

.employee-card header[b-lemrrach6m] {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    padding-top: 1rem
}

.employee-avatar[b-lemrrach6m] {
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--line);
    height: 62px;
    object-fit: cover;
    width: 62px
}


.employee-identity h3[b-lemrrach6m] {
    font-size: 1rem;
    margin: .7rem 0 .15rem
}

.employee-identity p[b-lemrrach6m] {
    color: var(--muted);
    font-size: .8rem;
    margin: 0 0 .55rem
}

.status[b-lemrrach6m] {
    align-items: center;
    background: #eafaf3;
    border-radius: 999px;
    color: #087c55;
    display: inline-flex;
    font-size: .7rem;
    font-weight: 700;
    gap: .35rem;
    padding: .25rem .5rem
}

    .status i[b-lemrrach6m] {
        background: #12b981;
        border-radius: 50%;
        height: 6px;
        width: 6px
    }

.employee-meta[b-lemrrach6m] {
    border-bottom: 1px solid var(--line);
    border-top: 1px solid var(--line);
    display: grid;
    gap: .8rem;
    grid-template-columns: 1fr 1fr;
    margin: 1rem 0;
    padding: 1rem 0
}

    .employee-meta dt[b-lemrrach6m] {
        color: #98a1b2;
        font-size: .65rem;
        text-transform: uppercase
    }

    .employee-meta dd[b-lemrrach6m] {
        font-size: .77rem;
        font-weight: 650;
        margin: .2rem 0 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

.employee-card footer[b-lemrrach6m], .table-actions[b-lemrrach6m] {
    align-items: center;
    display: flex;
    justify-content: space-between
}

.table-shell[b-lemrrach6m] {
    overflow: auto;
    padding: 0 1.25rem 1.25rem
}

.staff-table[b-lemrrach6m] {
    border: 0 !important
}

.table-person[b-lemrrach6m] {
    align-items: center;
    display: flex;
    gap: .65rem
}

    .table-person strong[b-lemrrach6m], .table-person span[b-lemrrach6m] {
        display: block
    }

    .table-person span[b-lemrrach6m] {
        color: var(--muted);
        font-size: .7rem;
        margin-top: .15rem
    }

.table-avatar[b-lemrrach6m] {
    border-radius: 50%;
    flex: 0 0 38px;
    height: 38px;
    object-fit: cover;
    width: 38px;
}

.table-actions[b-lemrrach6m] {
    justify-content: flex-start
}

.empty-state[b-lemrrach6m], .loading-state[b-lemrrach6m] {
    text-align: center;
    padding: 4rem 1rem
}

    .empty-state > span[b-lemrrach6m] {
        align-items: center;
        background: #f1f3f8;
        border-radius: 50%;
        color: #738096;
        display: inline-flex;
        font-size: 2rem;
        height: 70px;
        justify-content: center;
        width: 70px
    }

    .empty-state h3[b-lemrrach6m] {
        margin: 1rem 0 .35rem
    }

    .empty-state p[b-lemrrach6m] {
        color: var(--muted);
        margin: 0 0 1rem
    }

.loading-state[b-lemrrach6m] {
    align-items: center;
    color: var(--brand);
    display: flex;
    flex-direction: column;
    gap: .55rem
}

    .loading-state strong[b-lemrrach6m] {
        color: var(--ink);
        margin-top: .35rem
    }

    .loading-state span[b-lemrrach6m] {
        color: var(--muted);
        font-size: .75rem
    }

@media(max-width:1100px) {
    .metric-grid[b-lemrrach6m] {
        grid-template-columns: repeat(2,1fr)
    }

    .employee-grid[b-lemrrach6m] {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:700px) {
    .staff-hero[b-lemrrach6m], .panel-header[b-lemrrach6m] {
        align-items: flex-start;
        flex-direction: column
    }

    .primary-action[b-lemrrach6m] {
        width: 100%
    }

    .metric-grid[b-lemrrach6m], .employee-grid[b-lemrrach6m] {
        grid-template-columns: 1fr
    }

    .filter-bar[b-lemrrach6m] {
        align-items: stretch;
        flex-direction: column
    }

    .search-field[b-lemrrach6m] {
        max-width: none
    }

    .filter-select[b-lemrrach6m] {
        width: 100%
    }

    .employee-grid[b-lemrrach6m] {
        padding: .85rem
    }
}
/* /Components/Features/Staff/Pages/StaffRegister.razor.rz.scp.css */
.register-page[b-gpoqsj1f0g] {
    --ink: #172033;
    --muted: #6b7485;
    --line: #e5e9ef;
    --brand: #4f46e5;
    color: var(--ink);
    padding: .5rem 0 2rem
}

.register-header[b-gpoqsj1f0g] {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem
}

.back-link[b-gpoqsj1f0g] {
    align-items: center;
    background: none;
    border: 0;
    color: #687387;
    cursor: pointer;
    display: flex;
    font-size: .78rem;
    gap: .35rem;
    margin: 0 0 .6rem;
    padding: 0
}

.register-header h1[b-gpoqsj1f0g] {
    font-size: clamp(1.7rem,3vw,2.2rem);
    letter-spacing: -.04em;
    margin: 0 0 .3rem
}

.register-header p[b-gpoqsj1f0g] {
    color: var(--muted);
    margin: 0
}

.secure-note[b-gpoqsj1f0g] {
    align-items: center;
    color: #7a8496;
    display: flex;
    font-size: .75rem;
    gap: .4rem
}

    .secure-note[b-gpoqsj1f0g]  .rz-icon {
        color: #11a36a
    }

.register-layout[b-gpoqsj1f0g] {
    align-items: start;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 280px minmax(0,1fr)
}

.register-aside[b-gpoqsj1f0g] {
    background: linear-gradient(150deg,#232760,#37348a);
    border-radius: 18px;
    color: #fff;
    overflow: hidden;
    padding: 1.5rem;
    position: sticky;
    top: 1rem
}

    .register-aside[b-gpoqsj1f0g]:after {
        background: rgba(255,255,255,.05);
        border-radius: 50%;
        content: "";
        height: 190px;
        position: absolute;
        right: -95px;
        top: -70px;
        width: 190px
    }

.aside-icon[b-gpoqsj1f0g] {
    align-items: center;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    display: flex;
    height: 44px;
    justify-content: center;
    width: 44px
}

.register-aside h2[b-gpoqsj1f0g] {
    font-size: 1.15rem;
    margin: 1rem 0 .45rem
}

.register-aside > p[b-gpoqsj1f0g] {
    color: #c9cbed;
    font-size: .78rem;
    line-height: 1.55;
    margin: 0
}

.register-aside ol[b-gpoqsj1f0g] {
    display: grid;
    gap: 1.25rem;
    list-style: none;
    margin: 1.6rem 0;
    padding: 0
}

.register-aside li[b-gpoqsj1f0g] {
    align-items: center;
    color: #aeb2dd;
    display: flex;
    gap: .7rem;
    position: relative
}

    .register-aside li:not(:last-child)[b-gpoqsj1f0g]:after {
        background: rgba(255,255,255,.15);
        content: "";
        height: 17px;
        left: 14px;
        position: absolute;
        top: 31px;
        width: 1px
    }

    .register-aside li > span[b-gpoqsj1f0g] {
        align-items: center;
        border: 1px solid #7277af;
        border-radius: 50%;
        display: flex;
        font-size: .7rem;
        height: 29px;
        justify-content: center;
        width: 29px
    }

    .register-aside li.active[b-gpoqsj1f0g] {
        color: #fff
    }

        .register-aside li.active > span[b-gpoqsj1f0g] {
            background: #fff;
            border-color: #fff;
            color: #39358e
        }

    .register-aside li strong[b-gpoqsj1f0g], .register-aside li small[b-gpoqsj1f0g] {
        display: block
    }

    .register-aside li strong[b-gpoqsj1f0g] {
        font-size: .76rem
    }

    .register-aside li small[b-gpoqsj1f0g] {
        font-size: .66rem;
        margin-top: .15rem
    }

.aside-tip[b-gpoqsj1f0g] {
    align-items: flex-start;
    background: rgba(255,255,255,.08);
    border-radius: 11px;
    color: #d5d7ef;
    display: flex;
    font-size: .68rem;
    gap: .55rem;
    line-height: 1.45;
    padding: .75rem
}

    .aside-tip strong[b-gpoqsj1f0g] {
        color: #fff;
        display: block
    }

.register-card[b-gpoqsj1f0g] {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(30,41,59,.055);
    overflow: hidden
}

.mode-tabs[b-gpoqsj1f0g] {
    background: #fafbfc;
    border-bottom: 1px solid var(--line);
    display: flex;
    padding: 0 1.5rem
}

    .mode-tabs button[b-gpoqsj1f0g] {
        align-items: center;
        background: transparent;
        border: 0;
        border-bottom: 2px solid transparent;
        color: #7d8798;
        cursor: pointer;
        display: flex;
        gap: .65rem;
        margin-bottom: -1px;
        padding: 1rem 1.25rem;
        text-align: left
    }

        .mode-tabs button.active[b-gpoqsj1f0g] {
            border-color: var(--brand);
            color: var(--brand)
        }

    .mode-tabs strong[b-gpoqsj1f0g], .mode-tabs small[b-gpoqsj1f0g] {
        display: block
    }

    .mode-tabs strong[b-gpoqsj1f0g] {
        font-size: .78rem
    }

    .mode-tabs small[b-gpoqsj1f0g] {
        font-size: .66rem;
        margin-top: .15rem
    }

.employee-form[b-gpoqsj1f0g] {
    display: block;
    padding: 1.5rem
}

.form-section-heading[b-gpoqsj1f0g] {
    align-items: center;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: .75rem;
    margin-inline: .5rem;
    padding-block: .35rem
}

    .form-section-heading > span[b-gpoqsj1f0g] {
        align-items: center;
        background: #eaf8f2;
        border-radius: 10px;
        color: #0d9663;
        display: flex;
        height: 38px;
        justify-content: center;
        width: 38px
    }

        .form-section-heading > span.purple[b-gpoqsj1f0g] {
            background: #f0efff;
            color: var(--brand)
        }

    .form-section-heading h2[b-gpoqsj1f0g] {
        font-size: .95rem;
        margin: 0 0 .2rem
    }

    .form-section-heading p[b-gpoqsj1f0g], .form-section-heading > small[b-gpoqsj1f0g] {
        color: #8992a2;
        font-size: .7rem;
        margin: 0
    }

.form-grid[b-gpoqsj1f0g] {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
    margin-top: 1.15rem;
    margin: 10px;
}

.field.full[b-gpoqsj1f0g] {
    grid-column: 1/-1
}

.field label[b-gpoqsj1f0g] {
    color: #465064;
    display: block;
    font-size: .72rem;
    font-weight: 700;
    margin: 0 0 .4rem
}

.field[b-gpoqsj1f0g]  .rz-textbox, .field[b-gpoqsj1f0g]  .rz-dropdown, .field[b-gpoqsj1f0g]  .rz-datepicker {
    border-color: #dfe3e9;
    border-radius: 9px;
    width: 100%
}

.section-divider[b-gpoqsj1f0g] {
    border-top: 1px solid var(--line);
    margin: 1.6rem 0
}

.form-actions[b-gpoqsj1f0g] {
    align-items: center;
    border-top: 1px solid var(--line);
    display: flex;
    gap: .5rem;
    justify-content: flex-end;
    margin: 1.5rem -1.5rem -1.5rem;
    padding: 1rem 1.5rem
}

.cancel-button[b-gpoqsj1f0g] {
    background: none;
    border: 0;
    color: #697386;
    cursor: pointer;
    margin-right: auto
}

.submit-button[b-gpoqsj1f0g] {
    border-radius: 9px !important;
    font-weight: 700;
    padding: .65rem 1rem !important
}

.import-panel[b-gpoqsj1f0g] {
    padding: 1.5rem
}

.upload-zone[b-gpoqsj1f0g] {
    background: #fafbff;
    border: 1.5px dashed #cdd3e6;
    border-radius: 14px;
    padding: 2.5rem 1rem;
    text-align: center
}

    .upload-zone > span[b-gpoqsj1f0g] {
        align-items: center;
        background: #eef0ff;
        border-radius: 50%;
        color: var(--brand);
        display: inline-flex;
        font-size: 1.5rem;
        height: 54px;
        justify-content: center;
        width: 54px
    }

    .upload-zone h2[b-gpoqsj1f0g] {
        font-size: 1rem;
        margin: 1rem 0 .3rem
    }

    .upload-zone p[b-gpoqsj1f0g] {
        color: var(--muted);
        font-size: .75rem;
        margin: 0 0 1rem
    }

.template-note[b-gpoqsj1f0g] {
    align-items: center;
    background: #f3f6fb;
    border-radius: 10px;
    color: #687387;
    display: flex;
    font-size: .72rem;
    gap: .5rem;
    margin-top: 1rem;
    padding: .8rem
}

.import-preview[b-gpoqsj1f0g] {
    margin-top: 1.25rem
}

.preview-heading[b-gpoqsj1f0g] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: .75rem
}

    .preview-heading h3[b-gpoqsj1f0g] {
        font-size: .95rem;
        margin: 0
    }

    .preview-heading p[b-gpoqsj1f0g] {
        color: var(--muted);
        font-size: .72rem;
        margin: .2rem 0 0
    }

.valid-badge[b-gpoqsj1f0g] {
    align-items: center;
    background: #eafaf3;
    border-radius: 999px;
    color: #087c55;
    display: flex;
    font-size: .68rem;
    font-weight: 700;
    gap: .3rem;
    padding: .3rem .55rem
}

.template-card[b-gpoqsj1f0g] {
    align-items: center;
    background: linear-gradient(135deg,#f8f9ff,#f2f5ff);
    border: 1px solid #dfe3f5;
    border-radius: 13px;
    display: grid;
    gap: .8rem;
    grid-template-columns: auto 1fr auto;
    margin-top: 1rem;
    padding: 1rem
}

.template-card-icon[b-gpoqsj1f0g] {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e5f3;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(79,70,229,.08);
    color: var(--brand);
    display: flex;
    height: 42px;
    justify-content: center;
    width: 42px
}

.template-card-copy strong[b-gpoqsj1f0g], .template-card-copy span[b-gpoqsj1f0g] {
    display: block
}

.template-card-copy strong[b-gpoqsj1f0g] {
    font-size: .78rem;
    margin-bottom: .2rem
}

.template-card-copy span[b-gpoqsj1f0g] {
    color: var(--muted);
    font-size: .69rem
}

.template-download[b-gpoqsj1f0g], .template-recovery button[b-gpoqsj1f0g] {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: .72rem;
    font-weight: 700;
    gap: .4rem;
    text-decoration: none
}

.template-download[b-gpoqsj1f0g] {
    background: #fff;
    border: 1px solid #d9ddef;
    color: var(--brand);
    padding: .62rem .8rem
}

    .template-download:hover[b-gpoqsj1f0g] {
        background: #f8f7ff;
        color: #3730a3
    }

.template-recovery[b-gpoqsj1f0g] {
    align-items: center;
    background: #fff8eb;
    border: 1px solid #f2d49d;
    border-radius: 12px;
    color: #875600;
    display: grid;
    gap: .75rem;
    grid-template-columns: auto 1fr auto;
    margin-top: 1rem;
    padding: .9rem
}

    .template-recovery > i[b-gpoqsj1f0g] {
        font-size: 1.25rem
    }

    .template-recovery strong[b-gpoqsj1f0g], .template-recovery span[b-gpoqsj1f0g] {
        display: block
    }

    .template-recovery strong[b-gpoqsj1f0g] {
        font-size: .76rem
    }

    .template-recovery span[b-gpoqsj1f0g] {
        font-size: .68rem;
        margin-top: .15rem
    }

    .template-recovery button[b-gpoqsj1f0g] {
        background: #875600;
        border: 0;
        color: #fff;
        cursor: pointer;
        padding: .58rem .72rem
    }

.file-picker[b-gpoqsj1f0g] {
    align-items: center;
    background: #4f46e5;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 700;
    gap: .4rem;
    padding: .65rem 1rem
}

    .file-picker input[b-gpoqsj1f0g] {
        display: none
    }

    .file-picker.disabled[b-gpoqsj1f0g] {
        cursor: wait;
        opacity: .65
    }

.status-badge[b-gpoqsj1f0g] {
    border-radius: 999px;
    display: inline-block;
    font-size: .65rem;
    font-weight: 700;
    padding: .25rem .5rem
}

    .status-badge.ready[b-gpoqsj1f0g] {
        background: #eafaf3;
        color: #087c55
    }

    .status-badge.update[b-gpoqsj1f0g] {
        background: #e8f1ff;
        color: #175cd3
    }

    .status-badge.skipped[b-gpoqsj1f0g] {
        background: #fff4dc;
        color: #966000
    }

    .status-badge.invalid[b-gpoqsj1f0g] {
        background: #ffebee;
        color: #b42318
    }

.validation-message[b-gpoqsj1f0g] {
    display: block;
    font-size: .68rem;
    line-height: 1.35;
    max-width: 280px;
    white-space: normal
}

    .validation-message.ready[b-gpoqsj1f0g] {
        color: #087c55
    }

    .validation-message.update[b-gpoqsj1f0g] {
        color: #175cd3
    }

    .validation-message.skipped[b-gpoqsj1f0g] {
        color: #966000
    }

    .validation-message.invalid[b-gpoqsj1f0g] {
        color: #b42318
    }



@media(max-width:900px) {
    .register-layout[b-gpoqsj1f0g] {
        grid-template-columns: 1fr
    }

    .register-aside[b-gpoqsj1f0g] {
        display: none
    }

    .register-header[b-gpoqsj1f0g] {
        align-items: flex-start;
        flex-direction: column;
        gap: .75rem
    }
}

@media(max-width:600px) {
    .mode-tabs[b-gpoqsj1f0g] {
        padding: 0
    }

        .mode-tabs button[b-gpoqsj1f0g] {
            flex: 1;
            padding: .85rem
        }

    .form-grid[b-gpoqsj1f0g] {
        grid-template-columns: 1fr
    }

    .field.full[b-gpoqsj1f0g] {
        grid-column: auto
    }

    .form-section-heading[b-gpoqsj1f0g] {
        grid-template-columns: auto 1fr;
    }

        .form-section-heading > small[b-gpoqsj1f0g] {
            display: none
        }

    .employee-form[b-gpoqsj1f0g], .import-panel[b-gpoqsj1f0g] {
        padding: 1rem
    }

    .form-actions[b-gpoqsj1f0g] {
        margin: 1.25rem -1rem -1rem;
        padding: 1rem;
        flex-wrap: wrap
    }

    .register-header[b-gpoqsj1f0g] {
        margin-bottom: 1rem
    }

    .template-card[b-gpoqsj1f0g], .template-recovery[b-gpoqsj1f0g] {
        grid-template-columns: auto 1fr
    }

        .template-download[b-gpoqsj1f0g], .template-recovery button[b-gpoqsj1f0g] {
            grid-column: 1/-1;
            justify-content: center
        }
}
/* /Components/Features/Tasks/Components/BooleanColumnFilter.razor.rz.scp.css */
.soft-filter[b-oy4za32jvi] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: min(300px, calc(100vw - 64px));
    max-width: 100%;
    padding: 12px;
    box-sizing: border-box;
}

.soft-filter[b-oy4za32jvi]  label {
    color: var(--rz-text-secondary-color);
    font-size: 13px;
    font-weight: 600;
    overflow-wrap: anywhere;
}
/* /Components/Features/Tasks/Components/DateRangeFilter.razor.rz.scp.css */
.soft-filter[b-p0qps26qtg] {
    --soft-surface: color-mix(in srgb, #7189a7 5%, var(--rz-base-background-color));
    --soft-fill: color-mix(in srgb, var(--rz-base-background-color) 75%, transparent);
    --soft-accent: color-mix(in srgb, #7189a7 70%, var(--rz-text-color));
    --soft-ring: color-mix(in srgb, var(--soft-accent) 14%, transparent);
    width: min(300px, calc(100vw - 64px));
    max-width: 100%;
    padding: 12px;
    box-sizing: border-box;
    background: color-mix(in srgb, var(--soft-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--rz-text-color) 12%, transparent);
    border-radius: 4px;
    backdrop-filter: blur(12px) saturate(110%);
    -webkit-backdrop-filter: blur(12px) saturate(110%);
    box-shadow: 0 2px 8px rgba(17, 24, 39, .04), inset 0 1px 0 rgba(255, 255, 255, .3);
}

.soft-label[b-p0qps26qtg] {
    display: block;
    min-width: 0;
    margin: 0 0 8px;
    color: var(--rz-text-secondary-color);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
}

.soft-icon[b-p0qps26qtg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--soft-accent);
}

.soft-icon[b-p0qps26qtg]  .rzi {
    color: inherit;
    font-size: 18px;
}

.soft-heading[b-p0qps26qtg] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    min-height: 28px;
}

.soft-heading .soft-label[b-p0qps26qtg] {
    flex: 1;
    margin: 0;
}

.soft-fields[b-p0qps26qtg] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.soft-field[b-p0qps26qtg] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.soft-field[b-p0qps26qtg]  .soft-range-label {
    color: var(--rz-text-secondary-color);
    font-size: 12px;
    font-weight: 500;
}

/* Set Radzen's state tokens to avoid its default purple focus borders. */
.soft-field[b-p0qps26qtg]  .soft-input {
    --rz-input-border: 1px solid transparent;
    --rz-input-border-block-end: var(--rz-input-border);
    --rz-input-hover-border: 1px solid transparent;
    --rz-input-hover-border-block-end: var(--rz-input-hover-border);
    --rz-input-focus-border: 1px solid var(--soft-accent);
    --rz-input-focus-border-block-end: var(--rz-input-focus-border);
    --rz-input-shadow: none;
    --rz-input-hover-shadow: none;
    --rz-input-focus-shadow: 0 0 0 2px var(--soft-ring);
    --rz-input-focus-outline: none;
    --rz-input-background-color: var(--soft-fill);
    --rz-input-hover-background-color: var(--soft-fill);
    --rz-input-focus-background-color: var(--soft-fill);
    --rz-input-border-radius: 8px;
    --rz-input-height: 40px;
    --rz-input-font-size: 14px;
    --rz-input-value-color: var(--rz-text-color);
    --rz-input-placeholder-color: var(--rz-text-secondary-color);
    --rz-datepicker-trigger-icon-color: var(--rz-text-secondary-color);
    --rz-datepicker-trigger-icon-hover-color: var(--rz-text-color);
    width: 100%;
    min-width: 0;
}

.soft-heading[b-p0qps26qtg]  .rz-button.soft-clear {
    flex-shrink: 0;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: var(--wbs-frost-button-border, none);
    border-radius: var(--wbs-frost-radius, 7px);
    background: var(--wbs-frost-background, transparent);
    color: var(--wbs-frost-neutral, var(--rz-text-secondary-color));
    box-shadow: var(--wbs-frost-shadow, none);
    backdrop-filter: var(--wbs-frost-backdrop, none);
    -webkit-backdrop-filter: var(--wbs-frost-backdrop, none);
}

.soft-heading[b-p0qps26qtg]  .rz-button.soft-clear:hover {
    background: var(--wbs-frost-hover-neutral, color-mix(in srgb, #7189a7 16%, var(--soft-surface)));
    color: var(--wbs-frost-neutral, var(--rz-text-color));
}

.soft-heading[b-p0qps26qtg]  .rz-button.soft-clear:focus-visible {
    outline: 2px solid var(--soft-accent);
    outline-offset: 2px;
}
/* /Components/Features/Tasks/Components/NumberRangeFilter.razor.rz.scp.css */
.soft-filter[b-4iqxfufp50] {
    --soft-surface: color-mix(in srgb, #7189a7 5%, var(--rz-base-background-color));
    --soft-fill: color-mix(in srgb, var(--rz-base-background-color) 75%, transparent);
    --soft-accent: color-mix(in srgb, #7189a7 70%, var(--rz-text-color));
    --soft-ring: color-mix(in srgb, var(--soft-accent) 14%, transparent);
    width: min(300px, calc(100vw - 64px));
    max-width: 100%;
    padding: 12px;
    box-sizing: border-box;
    background: color-mix(in srgb, var(--soft-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--rz-text-color) 12%, transparent);
    border-radius: 4px;
    backdrop-filter: blur(12px) saturate(110%);
    -webkit-backdrop-filter: blur(12px) saturate(110%);
    box-shadow: 0 2px 8px rgba(17, 24, 39, .04), inset 0 1px 0 rgba(255, 255, 255, .3);
}

.soft-label[b-4iqxfufp50] {
    display: block;
    min-width: 0;
    margin: 0 0 8px;
    color: var(--rz-text-secondary-color);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
}

.soft-icon[b-4iqxfufp50] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--soft-accent);
}

.soft-icon[b-4iqxfufp50]  .rzi {
    color: inherit;
    font-size: 18px;
}

.soft-heading[b-4iqxfufp50] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    min-height: 28px;
}

.soft-heading .soft-label[b-4iqxfufp50] {
    flex: 1;
    margin: 0;
}

.soft-fields[b-4iqxfufp50] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.soft-field[b-4iqxfufp50] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.soft-field[b-4iqxfufp50]  .soft-range-label {
    color: var(--rz-text-secondary-color);
    font-size: 12px;
    font-weight: 500;
}

/* Set Radzen's state tokens to avoid its default purple focus borders. */
.soft-field[b-4iqxfufp50]  .soft-input {
    --rz-input-border: 1px solid transparent;
    --rz-input-border-block-end: var(--rz-input-border);
    --rz-input-hover-border: 1px solid transparent;
    --rz-input-hover-border-block-end: var(--rz-input-hover-border);
    --rz-input-focus-border: 1px solid var(--soft-accent);
    --rz-input-focus-border-block-end: var(--rz-input-focus-border);
    --rz-input-shadow: none;
    --rz-input-hover-shadow: none;
    --rz-input-focus-shadow: 0 0 0 2px var(--soft-ring);
    --rz-input-focus-outline: none;
    --rz-input-background-color: var(--soft-fill);
    --rz-input-hover-background-color: var(--soft-fill);
    --rz-input-focus-background-color: var(--soft-fill);
    --rz-input-border-radius: 8px;
    --rz-input-height: 40px;
    --rz-input-font-size: 14px;
    --rz-input-value-color: var(--rz-text-color);
    --rz-input-placeholder-color: var(--rz-text-secondary-color);
    --rz-numeric-button-color: var(--rz-text-secondary-color);
    width: 100%;
    min-width: 0;
}

.soft-heading[b-4iqxfufp50]  .rz-button.soft-clear {
    flex-shrink: 0;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: var(--wbs-frost-button-border, none);
    border-radius: var(--wbs-frost-radius, 7px);
    background: var(--wbs-frost-background, transparent);
    color: var(--wbs-frost-neutral, var(--rz-text-secondary-color));
    box-shadow: var(--wbs-frost-shadow, none);
    backdrop-filter: var(--wbs-frost-backdrop, none);
    -webkit-backdrop-filter: var(--wbs-frost-backdrop, none);
}

.soft-heading[b-4iqxfufp50]  .rz-button.soft-clear:hover {
    background: var(--wbs-frost-hover-neutral, color-mix(in srgb, #7189a7 16%, var(--soft-surface)));
    color: var(--wbs-frost-neutral, var(--rz-text-color));
}

.soft-heading[b-4iqxfufp50]  .rz-button.soft-clear:focus-visible {
    outline: 2px solid var(--soft-accent);
    outline-offset: 2px;
}
/* /Components/Features/Tasks/Components/TaskStatusFilter.razor.rz.scp.css */
.soft-filter[b-8ygsj7tvmt] {
    --soft-surface: color-mix(in srgb, #7189a7 5%, var(--rz-base-background-color));
    --soft-fill: color-mix(in srgb, var(--rz-base-background-color) 75%, transparent);
    --soft-accent: color-mix(in srgb, #7189a7 70%, var(--rz-text-color));
    --soft-ring: color-mix(in srgb, var(--soft-accent) 14%, transparent);
    width: min(300px, calc(100vw - 64px));
    max-width: 100%;
    padding: 12px;
    box-sizing: border-box;
    background: color-mix(in srgb, var(--soft-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--rz-text-color) 12%, transparent);
    border-radius: 4px;
    backdrop-filter: blur(12px) saturate(110%);
    -webkit-backdrop-filter: blur(12px) saturate(110%);
    box-shadow: 0 2px 8px rgba(17, 24, 39, .04), inset 0 1px 0 rgba(255, 255, 255, .3);
}

.soft-label[b-8ygsj7tvmt] {
    display: block;
    min-width: 0;
    margin: 0 0 8px;
    color: var(--rz-text-secondary-color);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
}

.soft-icon[b-8ygsj7tvmt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--soft-accent);
}

.soft-icon[b-8ygsj7tvmt]  .rzi {
    color: inherit;
    font-size: 18px;
}

.soft-status-field[b-8ygsj7tvmt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: var(--soft-fill);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.soft-status-field:focus-within[b-8ygsj7tvmt] {
    border-color: var(--soft-accent);
    box-shadow: 0 0 0 2px var(--soft-ring);
}

/* The surrounding field owns the border, including hover and focus. */
.soft-status-field[b-8ygsj7tvmt]  .soft-status-input {
    --rz-input-border: none;
    --rz-input-border-block-end: none;
    --rz-input-hover-border: none;
    --rz-input-hover-border-block-end: none;
    --rz-input-focus-border: none;
    --rz-input-focus-border-block-end: none;
    --rz-input-shadow: none;
    --rz-input-hover-shadow: none;
    --rz-input-focus-shadow: none;
    --rz-input-focus-outline: none;
    --rz-input-background-color: transparent;
    --rz-input-hover-background-color: transparent;
    --rz-input-focus-background-color: transparent;
    --rz-input-height: 34px;
    --rz-input-font-size: 14px;
    --rz-input-value-color: var(--rz-text-color);
    --rz-input-placeholder-color: var(--rz-text-secondary-color);
    --rz-input-padding-inline: 0;
    flex: 1;
    width: 100%;
    min-width: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    color: var(--rz-text-color);
}

.soft-status-field[b-8ygsj7tvmt]  .rz-dropdown-trigger {
    color: var(--rz-text-secondary-color);
}
/* /Components/Features/Tasks/Components/TextAvatar.razor.rz.scp.css */
/* CSS for TextAvatar component */
.text-avatar[b-i2792t3zld] {
    width: 40px;
    height: 40px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    background-color: var(--avatar-bg);
}
/* /Components/Features/Tasks/Components/TextColumnFilter.razor.rz.scp.css */
.tlc-filter-root[b-g6cvkwku78] {
    --tlc-surface: color-mix(in srgb, #7189a7 5%, var(--rz-base-background-color));
    --tlc-accent: color-mix(in srgb, #7189a7 70%, var(--rz-text-color));
    width: min(300px, calc(100vw - 64px));
    max-width: 100%;
    padding: 12px;
    box-sizing: border-box;
    background: color-mix(in srgb, var(--tlc-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--rz-text-color) 12%, transparent);
    border-radius: 4px;
    backdrop-filter: blur(12px) saturate(110%);
    -webkit-backdrop-filter: blur(12px) saturate(110%);
    box-shadow: 0 2px 8px rgba(17, 24, 39, .04), inset 0 1px 0 rgba(255, 255, 255, .3);
}

.tlc-filter-label[b-g6cvkwku78] {
    display: block;
    max-width: 100%;
    margin: 0 0 8px;
    color: var(--rz-text-secondary-color);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
}

.tlc-filter-card[b-g6cvkwku78] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: color-mix(in srgb, var(--rz-base-background-color) 75%, transparent);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.tlc-filter-card:focus-within[b-g6cvkwku78] {
    border-color: var(--tlc-accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--tlc-accent) 14%, transparent);
}

.tlc-icon[b-g6cvkwku78] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--tlc-accent);
}

.tlc-icon[b-g6cvkwku78]  .rzi {
    color: inherit;
    font-size: 18px;
}

/* The card provides the border and focus ring for the whole input group. */
.tlc-filter-card[b-g6cvkwku78]  input.tlc-input {
    /* Radzen applies separate borders/shadows for hover and focus.
       Override those tokens as well as the resting state. */
    --rz-input-border: none;
    --rz-input-border-block-end: none;
    --rz-input-hover-border: none;
    --rz-input-hover-border-block-end: none;
    --rz-input-focus-border: none;
    --rz-input-focus-border-block-end: none;
    --rz-input-shadow: none;
    --rz-input-hover-shadow: none;
    --rz-input-focus-shadow: none;
    --rz-input-focus-outline: none;
    --rz-input-background-color: transparent;
    --rz-input-hover-background-color: transparent;
    --rz-input-focus-background-color: transparent;
    flex: 1;
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 4px 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    outline: none;
    color: var(--rz-text-color);
    font-size: 14px;
    font-weight: 400;
}

.tlc-filter-card[b-g6cvkwku78]  input.tlc-input::placeholder {
    color: var(--rz-text-secondary-color);
    opacity: 1;
}

.tlc-filter-card[b-g6cvkwku78]  .rz-button.tlc-clear {
    flex-shrink: 0;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: var(--wbs-frost-button-border, none);
    border-radius: var(--wbs-frost-radius, 7px);
    background: var(--wbs-frost-background, transparent);
    color: var(--wbs-frost-neutral, var(--rz-text-secondary-color));
    box-shadow: var(--wbs-frost-shadow, none);
    backdrop-filter: var(--wbs-frost-backdrop, none);
    -webkit-backdrop-filter: var(--wbs-frost-backdrop, none);
    transition: background-color .15s ease;
}

.tlc-filter-card[b-g6cvkwku78]  .rz-button.tlc-clear:hover {
    background: var(--wbs-frost-hover-neutral, color-mix(in srgb, #7189a7 16%, var(--tlc-surface)));
    color: var(--wbs-frost-neutral, var(--rz-text-color));
}

.tlc-filter-card[b-g6cvkwku78]  .rz-button.tlc-clear:focus-visible {
    outline: 2px solid var(--tlc-accent);
    outline-offset: 2px;
}
/* /Components/Features/Tasks/Components/WBSCellEditor.razor.rz.scp.css */
.wbs-custom-editor[b-43u63nymfh] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
}

.wbs-custom-editor-control[b-43u63nymfh] {
    flex: 1 1 auto;
    min-width: 0;
}

.wbs-required-badge[b-43u63nymfh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    padding-top: 4px;
    border: 1px solid color-mix(in srgb, var(--rz-danger) 25%, transparent);
    border-radius: 50%;
    background: color-mix(in srgb, var(--rz-danger) 10%, var(--rz-base-background-color));
    color: color-mix(in srgb, var(--rz-danger) 75%, var(--rz-text-title-color));
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    cursor: help;
}

.wbs-required-badge:focus-visible[b-43u63nymfh] {
    outline: 2px solid var(--rz-danger);
    outline-offset: 2px;
}
.wbs-cell-editor[b-43u63nymfh] {
    min-width: 0;
    border-radius: 6px;
    scroll-margin: 12px;
}

.wbs-cell-editor:focus-within[b-43u63nymfh] {
    outline: 2px solid color-mix(in srgb, var(--rz-primary) 65%, transparent);
    outline-offset: 3px;
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--rz-primary) 10%, transparent);
}
/* /Components/Features/Tasks/Components/WBSEmptyTemplate.razor.rz.scp.css */
/* CSS for WBSEmptyTemplate component */

/* designFlg = 0 */
.empty-state[b-dn2mpniyic] {
    min-height: 250px;
    height: calc(100vh - 350px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: linear-gradient( 135deg, rgba(37,99,235,0.07), rgba(124,58,237,0.04) );
    border: 1px solid rgba(37,99,235,0.12);
    border-radius: 12px;
}


.empty-icon-container[b-dn2mpniyic] {
    width: 85px;
    height: 85px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: linear-gradient( 135deg, #2563EB, #7C3AED );
    box-shadow: 0 4px 10px rgba(37,99,235,0.25);
    margin-bottom: 18px;
}


.empty-icon[b-dn2mpniyic] {
    font-size: 46px;
    color: white;
    font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 48;
}


.empty-title[b-dn2mpniyic] {
    font-family: 'Inter', sans-serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.3px;
    background: linear-gradient(90deg,#2563EB,#7C3AED);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}


.empty-message[b-dn2mpniyic] {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 450;
    color: var(--rz-text-secondary-color);
    letter-spacing: .25px;
}


/* designFlg = 1 */


.rz-datagrid-empty-message[b-dn2mpniyic] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: .5rem;
    padding: 24px;
    border-radius: 12px;
    border: 1px solid rgba(59,130,246,.20);
    background: rgba(59,130,246,.08);
    font-size: 1rem;
    font-weight: 500;
    opacity: .8;
}

/* Pin only the notice to the grid's horizontal scroll viewport.
   The full-width empty row and its background keep scrolling normally. */
.empty-notice[b-dn2mpniyic] {
    position: sticky;
    left: 24px;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    flex: 0 0 auto;
}
/* /Components/Features/Tasks/Components/WBSHeaderTemplate.razor.rz.scp.css */
.wbs-column-header[b-zwb42yeoj1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    overflow: visible;
}

.phase-metadata[b-zwb42yeoj1] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
}

.phase-badge[b-zwb42yeoj1] {
    --wbs-phase-ink: color-mix(in srgb, var(--wbs-phase-color) 20%, var(--rz-text-title-color));
    flex-shrink: 0;
    white-space: nowrap;
    padding: 3px 8px;
    border: 1px solid color-mix(in srgb, var(--wbs-phase-color) 24%, rgba(255, 255, 255, .75));
    border-radius: 999px;
    background: color-mix(in srgb, var(--wbs-phase-color) 16%, var(--rz-base-background-color));
    color: var(--wbs-phase-ink);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .5px;
    line-height: 18px;
    text-align: center;
}

.wbs-column-label[b-zwb42yeoj1] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
}

.wbs-column-title[b-zwb42yeoj1] {
    font-size: 14px;
    font-weight: 800;
    line-height: 21px;
    text-align: left;
}

.wbs-filter-indicator[b-zwb42yeoj1] {
    flex-shrink: 0;
    font-size: 15px;
    color: var(--rz-text-secondary-color);
}

.wbs-filter-indicator.is-filtered[b-zwb42yeoj1] {
    color: var(--rz-primary);
}

@media (prefers-reduced-transparency: reduce) {
    .phase-badge[b-zwb42yeoj1] {
        background: var(--rz-base-background-color);
    }
}

.custom-field-indicator[b-zwb42yeoj1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: color-mix(in srgb, #7189a7 16%, var(--rz-base-background-color));
    color: color-mix(in srgb, #7189a7 45%, var(--rz-text-title-color));
}

.custom-field-indicator .rzi[b-zwb42yeoj1] {
    font-size: 16px;
    width: 16px;
    height: 16px;
    line-height: 16px;
}
/* /Components/Features/Tasks/Components/WBSLoadingPage.razor.rz.scp.css */
.task-details-loading[b-3ztx803x8l] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    box-sizing: border-box;
    padding: 24px;
    background: var(--rz-base-background-color, #f8fafc);
    background: color-mix(in srgb, var(--rz-base-background-color, #f8fafc) 94%, transparent);
    color: var(--rz-text-color, #374151);
}

.task-loader[b-3ztx803x8l] {
    flex: 0 0 auto;
    box-sizing: border-box;
    width: 28px;
    height: 28px;
    border: 2px solid var(--rz-base-300, #dfe4ea);
    border-top-color: var(--rz-primary, #6366f1);
    border-radius: 50%;
    animation: loader-spin-b-3ztx803x8l .8s linear infinite;
}

.task-details-loading-text[b-3ztx803x8l] {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
}

@keyframes loader-spin-b-3ztx803x8l {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .task-loader[b-3ztx803x8l] { animation: none; }
}
/* /Components/Features/Tasks/Components/WBSPageTitle.razor.rz.scp.css */
.page-title[b-4rgnvpitum] {
    --title-accent: #7dd3fc;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    font-family: 'Inter', sans-serif;
}

.page-title-mark[b-4rgnvpitum] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(125, 211, 252, .28);
    border-radius: 14px;
    background: linear-gradient(140deg, rgba(56, 189, 248, .18), rgba(56, 189, 248, .04));
    color: var(--title-accent);
    box-shadow: inset 0 1px 0 rgba(224, 242, 254, .16), 0 3px 12px rgba(56, 189, 248, .08);
}

.page-title-mark[b-4rgnvpitum]  .rzi {
    font-size: 24px;
    color: inherit;
    text-shadow: 0 0 3px rgba(56, 189, 248, .2);
}

.page-title-copy[b-4rgnvpitum] {
    min-width: 0;
}

.page-title-text[b-4rgnvpitum] {
    margin: 0;
    color: #f5f9ff;
    font-size: clamp(28px, 2.5vw, 34px);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.7px;
}

.page-title-subtitle[b-4rgnvpitum] {
    margin: 4px 0 0;
    color: #a9bfd5;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: .035em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 480px) {
    .page-title[b-4rgnvpitum] {
        gap: 10px;
    }

    .page-title-mark[b-4rgnvpitum] {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }
}
/* /Components/Features/Tasks/Components/WBSProgressCounts.razor.rz.scp.css */
.wbs-progress-counts[b-deziwbm83u] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: 8px;
    margin-top: 10px;
}
.wbs-progress-count[b-deziwbm83u] {
    display: flex;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--wbs-summary-count-line, var(--wbs-summary-line));
    border-radius: 11px;
    background: var(--wbs-summary-count-fill, var(--wbs-summary-tile));
    box-shadow: var(--wbs-summary-count-shadow, inset 0 1px 0 color-mix(in srgb, var(--wbs-frost-shine) 35%, transparent));
    color: var(--wbs-summary-muted);
    font-size: 12px;
}
.wbs-progress-status-icon[b-deziwbm83u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border: 1px solid color-mix(in srgb, var(--wbs-summary-count-ink) 15%, transparent);
    border-radius: 50%;
    background: color-mix(in srgb, var(--wbs-summary-count-ink) 10%, transparent);
    color: var(--wbs-summary-count-ink);
}
.wbs-progress-status-icon[b-deziwbm83u]  .rzi { font-size: 20px; width: 20px; height: 20px; line-height: 20px; }
.wbs-progress-copy[b-deziwbm83u] { display: flex; flex-direction: column; min-width: 0; }
.wbs-progress-status-icon[b-deziwbm83u], .wbs-progress-copy[b-deziwbm83u] { position: relative; z-index: 1; }
.wbs-progress-wave[b-deziwbm83u] {
    position: absolute;
    z-index: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 24px;
    pointer-events: none;
}
.wbs-progress-wave-back[b-deziwbm83u] { fill: color-mix(in srgb, var(--wbs-summary-count-ink) 6%, transparent); }
.wbs-progress-wave-front[b-deziwbm83u] { fill: color-mix(in srgb, var(--wbs-summary-count-ink) 8%, transparent); }
.wbs-progress-value[b-deziwbm83u] {
    color: var(--wbs-summary-count-ink, var(--wbs-summary-ink, var(--rz-text-title-color)));
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
    font-variant-numeric: tabular-nums;
}
.is-completed .wbs-progress-value[b-deziwbm83u] { color: var(--wbs-summary-count-ink, var(--wbs-summary-success)); }
.is-overdue .wbs-progress-value[b-deziwbm83u] { color: var(--wbs-summary-count-ink, var(--wbs-summary-warning)); }
.is-compact[b-deziwbm83u] { display: flex; flex-wrap: wrap; gap: 7px 10px; }
.is-compact .wbs-progress-count[b-deziwbm83u] {
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    gap: 5px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.is-compact .wbs-progress-copy[b-deziwbm83u] { flex-direction: row; align-items: center; flex-wrap: nowrap; gap: 8px; }
.is-compact .wbs-progress-status-icon[b-deziwbm83u] {
    width: 14px;
    height: 14px;
    border: 0;
    background: transparent;
    align-self: center;
}
.is-compact .wbs-progress-status-icon[b-deziwbm83u]  .rzi { font-size: 14px; width: 14px; height: 14px; line-height: 14px; }
.is-compact .wbs-progress-value[b-deziwbm83u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-sizing: border-box;
    min-width: 26px;
    height: 22px;
    padding: 0 6px;
    border: 1px solid color-mix(in srgb, var(--wbs-summary-count-ink, var(--wbs-summary-muted)) 25%, var(--wbs-summary-line));
    border-radius: 7px;
    background: color-mix(in srgb, var(--wbs-summary-count-ink, var(--wbs-summary-muted)) 11%, var(--wbs-summary-tile));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--wbs-glass-shine, var(--wbs-frost-shine)) 30%, transparent);
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}
@media (max-width: 480px) {
    .wbs-progress-counts[b-deziwbm83u] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .wbs-progress-counts:not(.is-compact) .wbs-progress-count[b-deziwbm83u] { gap: 8px; padding: 10px; }
    .wbs-progress-counts:not(.is-compact) .wbs-progress-status-icon[b-deziwbm83u] { width: 28px; height: 28px; }
}
/* /Components/Features/Tasks/Components/WBSProgressOverruns.razor.rz.scp.css */
.wbs-progress-overruns[b-6utcs9par8] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.wbs-progress-overrun[b-6utcs9par8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    padding: 5px 8px;
    border: 1px solid color-mix(in srgb, var(--wbs-summary-line) 65%, transparent);
    border-radius: 9px;
    background: color-mix(in srgb, var(--wbs-overrun-accent) 9%, var(--wbs-glass-wash, var(--wbs-summary-tile)));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--wbs-glass-shine, var(--wbs-frost-shine)) 30%, transparent);
    color: var(--wbs-summary-ink, var(--rz-text-title-color));
    font-size: 12px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.is-hours[b-6utcs9par8] { --wbs-overrun-accent: var(--wbs-status-overdue, var(--rz-warning)); }
.is-deadline[b-6utcs9par8] { --wbs-overrun-accent: var(--wbs-status-deadline, var(--rz-danger)); }
.wbs-progress-overrun[b-6utcs9par8]  > .rzi { font-size: 17px; color: var(--wbs-overrun-accent); flex-shrink: 0; }
.wbs-progress-overrun > span[b-6utcs9par8] { min-width: 0; }
.wbs-progress-overrun strong[b-6utcs9par8] { font-weight: 600; font-variant-numeric: tabular-nums; }
.wbs-progress-overrun > strong[b-6utcs9par8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-sizing: border-box;
    min-width: 26px;
    height: 22px;
    padding: 0 6px;
    border: 1px solid var(--wbs-summary-line);
    border-radius: 7px;
    background: var(--wbs-summary-tile);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--wbs-glass-shine, var(--wbs-frost-shine)) 30%, transparent);
    color: var(--wbs-summary-ink, var(--rz-text-title-color));
    font-size: 12px;
    line-height: 1;
}
.wbs-progress-overrun.has-overrun > strong[b-6utcs9par8] {
    border-color: color-mix(in srgb, var(--wbs-overrun-accent) 25%, var(--wbs-summary-line));
    background: color-mix(in srgb, var(--wbs-overrun-accent) 11%, var(--wbs-glass-wash, var(--wbs-summary-tile)));
    color: var(--wbs-overrun-accent);
}
.wbs-overrun-info[b-6utcs9par8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--wbs-summary-muted);
    cursor: help;
}
.wbs-overrun-info[b-6utcs9par8]  .rzi { font-size: 15px; width: 15px; height: 15px; line-height: 15px; }
.wbs-overrun-info:hover[b-6utcs9par8] { color: var(--wbs-summary-ink, var(--rz-text-title-color)); }
.wbs-overrun-info:focus-visible[b-6utcs9par8] { outline: 2px solid var(--wbs-summary-accent); outline-offset: 2px; }
.wbs-progress-overruns.is-minimal[b-6utcs9par8] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 14px; }
.is-minimal .wbs-progress-overrun[b-6utcs9par8] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 22px;
    gap: 4px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: 11px;
    color: var(--wbs-summary-muted);
}
.is-minimal .wbs-progress-overrun[b-6utcs9par8]  > .rzi { display: none; }
.is-minimal .wbs-progress-overrun > span[b-6utcs9par8] { line-height: 1.4; }
.is-minimal .wbs-progress-overrun strong[b-6utcs9par8] { color: var(--wbs-summary-ink, var(--rz-text-title-color)); }
.is-minimal .has-overrun > span[b-6utcs9par8], .is-minimal .has-overrun strong[b-6utcs9par8] { color: var(--wbs-overrun-accent); font-weight: 600; }
@media (pointer: coarse) { .wbs-overrun-info[b-6utcs9par8] { width: 44px; height: 44px; } }
@media (pointer: coarse) { .is-minimal .wbs-progress-overrun[b-6utcs9par8] { grid-template-columns: minmax(0, 1fr) auto 44px; } }
/* /Components/Features/Tasks/Components/WBSProgressStatusInfo.razor.rz.scp.css */
.wbs-progress-card-info[b-p6xkez2t7c] {
    position: absolute;
    z-index: 2;
    top: 6px;
    right: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid var(--wbs-summary-count-line, var(--wbs-summary-line));
    border-radius: 50%;
    background: color-mix(in srgb, var(--wbs-frost-surface) 92%, var(--wbs-summary-count-ink));
    color: var(--wbs-summary-muted);
    cursor: pointer;
}
.wbs-progress-card-info[b-p6xkez2t7c]  .rzi { width: 14px; height: 14px; font-size: 14px; line-height: 14px; }
.wbs-progress-card-info.is-inline[b-p6xkez2t7c] { position: static; flex-shrink: 0; }
.wbs-progress-card-info:hover[b-p6xkez2t7c], .wbs-progress-card-info[aria-expanded="true"][b-p6xkez2t7c] {
    color: var(--wbs-summary-accent);
    border-color: var(--wbs-summary-accent);
    background: color-mix(in srgb, var(--wbs-summary-accent) 10%, var(--wbs-frost-surface));
}
.wbs-progress-card-info:focus-visible[b-p6xkez2t7c], .wbs-status-help-close:focus-visible[b-p6xkez2t7c] {
    outline: 2px solid var(--wbs-summary-accent, var(--wbs-status-in-progress));
    outline-offset: 2px;
}
.wbs-status-help-content[b-p6xkez2t7c] { padding: 14px; font-size: 13px; line-height: 1.5; }
.wbs-status-help-heading[b-p6xkez2t7c] { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; }
.wbs-status-help-heading[b-p6xkez2t7c]  .wbs-status-help-icon { font-size: 19px; }
.wbs-status-help-heading h4[b-p6xkez2t7c] { margin: 0; color: inherit; font-size: 14px; font-weight: 600; }
.wbs-status-help-close[b-p6xkez2t7c] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-left: auto;
    padding: 0;
    border: 1px solid var(--wbs-status-help-line);
    border-radius: 50%;
    background: var(--wbs-status-help-surface);
    color: var(--wbs-status-help-muted);
    cursor: pointer;
}
.wbs-status-help-close[b-p6xkez2t7c]  .rzi { font-size: 15px; width: 15px; height: 15px; line-height: 15px; }
.wbs-status-help-close:hover[b-p6xkez2t7c] { color: var(--wbs-status-in-progress); border-color: var(--wbs-status-in-progress); }
.wbs-status-help-section + .wbs-status-help-section[b-p6xkez2t7c] { margin-top: 10px; }
.wbs-status-help-section strong[b-p6xkez2t7c] { display: block; margin-bottom: 3px; color: var(--wbs-status-in-progress); font-size: 12px; font-weight: 600; }
.wbs-status-help-section p[b-p6xkez2t7c] { margin: 0; }
.wbs-status-help-example[b-p6xkez2t7c] {
    margin-top: 11px;
    padding: 9px 10px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--wbs-status-in-progress) 7%, var(--wbs-status-help-surface));
    color: var(--wbs-status-help-muted);
    font-size: 12px;
}
@media (pointer: coarse) {
    .wbs-progress-card-info[b-p6xkez2t7c]::after, .wbs-status-help-close[b-p6xkez2t7c]::after { content: ""; position: absolute; width: 44px; height: 44px; }
}
/* /Components/Features/Tasks/Components/WBSProgressSummary.razor.rz.scp.css */
.wbs-progress-summary[b-kde5rxm3l9] {
    --wbs-summary-line: color-mix(in srgb, #7189a7 24%, var(--wbs-frost-surface));
    --wbs-summary-tile: color-mix(in srgb, #7189a7 7%, var(--wbs-frost-surface));
    --wbs-summary-muted: var(--rz-text-secondary-color);
    --wbs-summary-success: color-mix(in srgb, var(--rz-success) 68%, var(--rz-text-title-color));
    --wbs-summary-warning: color-mix(in srgb, var(--rz-warning) 65%, var(--rz-text-title-color));
    --wbs-summary-accent: #70c8ff;
    --wbs-summary-tab-ink: var(--wbs-summary-accent);
    --wbs-summary-tab-active: linear-gradient(135deg,
        color-mix(in srgb, #278df0 18%, var(--wbs-frost-surface)),
        color-mix(in srgb, #278df0 9%, var(--wbs-frost-surface)));
    --wbs-summary-tab-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wbs-summary-accent) 65%, transparent),
        inset 0 1px 0 color-mix(in srgb, var(--wbs-summary-accent) 18%, transparent),
        0 2px 10px color-mix(in srgb, var(--wbs-summary-accent) 13%, transparent);
    padding-top: 12px;
    margin-top: 12px;
    border-top: 1px solid var(--wbs-summary-line);
    color: var(--wbs-summary-ink, var(--rz-text-title-color));
}
.wbs-progress-heading[b-kde5rxm3l9], .wbs-progress-title[b-kde5rxm3l9], .wbs-progress-footer[b-kde5rxm3l9], .wbs-progress-footer > span[b-kde5rxm3l9] {
    display: flex;
    align-items: center;
    gap: 7px;
}
.wbs-progress-heading[b-kde5rxm3l9] { justify-content: space-between; flex-wrap: wrap; margin-bottom: 8px; }
.wbs-progress-title[b-kde5rxm3l9] { gap: 9px; font-size: 15px; font-weight: 700; letter-spacing: .01em; }
.wbs-progress-title[b-kde5rxm3l9]  .rzi {
    font-size: 22px;
    color: var(--wbs-summary-accent);
    text-shadow: 0 0 5px color-mix(in srgb, var(--wbs-summary-accent) 24%, transparent);
}
.wbs-progress-scope[b-kde5rxm3l9], .wbs-progress-footer[b-kde5rxm3l9] { color: var(--wbs-summary-muted); font-size: 12px; }
.wbs-progress-state[b-kde5rxm3l9] { padding: 12px 0; color: var(--wbs-summary-muted); font-size: 13px; }
.wbs-progress-overview[b-kde5rxm3l9] {
    display: flex;
    align-items: center;
    gap: 12px 20px;
    flex-wrap: wrap;
}
.wbs-progress-at-a-glance[b-kde5rxm3l9] { display: flex; align-items: center; gap: 12px; min-width: 0; margin-right: auto; }
.wbs-progress-at-a-glance .wbs-progress-title[b-kde5rxm3l9] { font-size: 13px; white-space: nowrap; }
.wbs-progress-completion[b-kde5rxm3l9] { width: 230px; max-width: 100%; font-size: 12px; color: var(--wbs-summary-muted); }
.wbs-progress-split-bottom[b-kde5rxm3l9] { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding-top: 10px; margin-top: 12px; border-top: 1px solid var(--wbs-summary-line); }
.wbs-progress-assessment[b-kde5rxm3l9] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; font-size: 12px; color: var(--wbs-summary-muted); }
.wbs-progress-assessment strong[b-kde5rxm3l9] { color: var(--wbs-summary-ink); font-weight: 500; font-variant-numeric: tabular-nums; }
.wbs-phase-overruns[b-kde5rxm3l9] { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--wbs-summary-line); }
.wbs-phase-overruns[b-kde5rxm3l9]  .wbs-progress-overruns.is-minimal { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.wbs-phase-overruns[b-kde5rxm3l9]  .is-minimal .wbs-progress-overrun { display: inline-flex; gap: 8px; }
.wbs-phase-assessment[b-kde5rxm3l9] { display: flex; flex-direction: column; gap: 3px; margin-top: 8px; font-size: 11px; color: var(--wbs-summary-muted); }
.wbs-phase-assessment-label[b-kde5rxm3l9] { font-weight: 600; }
.wbs-phase-deadline-pending[b-kde5rxm3l9] { font-variant-numeric: tabular-nums; }
.wbs-phase-empty[b-kde5rxm3l9] { display: flex; align-items: center; gap: 7px; padding: 0 14px 12px; color: var(--wbs-summary-muted); font-size: 12px; }
.wbs-phase-empty[b-kde5rxm3l9]  .rzi { font-size: 18px; opacity: .65; }
.wbs-phase-completion[b-kde5rxm3l9] { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--wbs-summary-muted); }
.wbs-phase-completion > strong[b-kde5rxm3l9] { font-size: 20px; font-weight: 600; line-height: 1.2; color: var(--wbs-summary-success); font-variant-numeric: tabular-nums; }
.wbs-phase-completion > span strong[b-kde5rxm3l9] { color: var(--wbs-summary-ink, var(--rz-text-title-color)); font-weight: 600; }
.wbs-phase-progress .wbs-progress-track[b-kde5rxm3l9] { margin-top: 6px; }
.wbs-phase-statuses[b-kde5rxm3l9]  .wbs-progress-counts.is-compact { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 0; }
.wbs-phase-statuses[b-kde5rxm3l9]  .wbs-progress-count { gap: 7px; }
.wbs-phase-statuses[b-kde5rxm3l9]  .wbs-progress-copy { align-items: center; gap: 8px; }
.wbs-phase-statuses[b-kde5rxm3l9]  .wbs-progress-label { order: -1; font-size: 12px; }
.wbs-phase-statuses[b-kde5rxm3l9]  .wbs-progress-value { font-weight: 600; font-variant-numeric: tabular-nums; }
.wbs-progress-completion strong[b-kde5rxm3l9] { color: var(--wbs-summary-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.wbs-progress-completion .wbs-progress-track[b-kde5rxm3l9] { margin-top: 5px; }
.wbs-progress-details-toggle[b-kde5rxm3l9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-shrink: 0;
    min-height: 34px;
    padding: 5px 10px;
    border: 1px solid var(--wbs-glass-edge, var(--wbs-summary-line));
    border-radius: 10px;
    background: var(--wbs-glass-wash, var(--wbs-summary-tile));
    box-shadow: var(--wbs-glass-shadow, none);
    color: var(--wbs-summary-accent);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}
.wbs-progress-details-toggle[b-kde5rxm3l9]  .rzi { font-size: 18px; }
.wbs-progress-details-toggle:hover[b-kde5rxm3l9] { background: color-mix(in srgb, var(--wbs-summary-accent) 9%, var(--wbs-glass-wash, var(--wbs-summary-tile))); }
.wbs-progress-details-toggle:focus-visible[b-kde5rxm3l9] { outline: 2px solid var(--wbs-summary-accent); outline-offset: 3px; }
.wbs-progress-details[b-kde5rxm3l9] { margin-top: 10px; }
.wbs-progress-quick-counts[b-kde5rxm3l9]  .wbs-progress-counts.is-compact {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin-top: 8px;
}
.wbs-progress-quick-counts[b-kde5rxm3l9]  .wbs-progress-copy { flex-wrap: nowrap; }
.wbs-progress-refresh[b-kde5rxm3l9] { display: block; margin-top: 8px; font-size: 12px; }
@container wbs-progress (max-width: 760px) {
    .wbs-progress-at-a-glance[b-kde5rxm3l9] { flex-direction: column; align-items: flex-start; gap: 3px; }
}
@container wbs-progress (max-width: 480px) {
    .wbs-progress-overview[b-kde5rxm3l9] { flex-wrap: wrap; gap: 8px; }
    .wbs-progress-at-a-glance[b-kde5rxm3l9] { flex: 1; }
    .wbs-progress-completion[b-kde5rxm3l9] { order: 3; width: 100%; }
    .wbs-progress-quick-counts[b-kde5rxm3l9]  .wbs-progress-counts.is-compact { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 120px), 1fr)); gap: 7px 12px; }
}
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav {
    gap: 4px;
    padding: 4px;
    margin: 0;
    border: 1px solid var(--wbs-summary-line);
    border-radius: 11px;
    background: var(--wbs-summary-tile);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--wbs-frost-shine) 35%, transparent);
}
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li { flex: 1; border: 0; border-radius: 8px; margin: 0; background: transparent; transition: background-color .16s ease; }
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li button { width: 100%; justify-content: center; gap: 9px; padding: 8px 10px; font-size: 13px; font-weight: 500; letter-spacing: .025em; text-transform: none; color: var(--wbs-summary-muted); }
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li::after { display: none; }
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li.rz-tabview-selected {
    background: var(--wbs-summary-tab-active);
    box-shadow: var(--wbs-summary-tab-shadow);
}
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li.rz-tabview-selected button {
    color: var(--wbs-summary-tab-ink);
    font-weight: 700;
}
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li:not(.rz-tabview-selected):hover {
    background: color-mix(in srgb, var(--wbs-summary-accent) 6%, var(--wbs-frost-surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wbs-summary-accent) 20%, transparent);
}
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li button:focus-visible {
    outline: 2px solid var(--wbs-summary-accent);
    outline-offset: -3px;
    border-radius: 8px;
}
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav .rzi { font-size: 18px; color: inherit; }
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-panels { padding: 10px 0 0; border: 0; background: transparent; }
.wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-panel { padding: 0; }
.wbs-progress-hero[b-kde5rxm3l9] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
    border: 1px solid var(--wbs-summary-line);
    border-radius: 12px;
    background: var(--wbs-summary-hero, var(--wbs-summary-tile));
    box-shadow: var(--wbs-summary-card-shadow, inset 0 1px 0 color-mix(in srgb, var(--wbs-frost-shine) 35%, transparent));
}
.wbs-progress-total[b-kde5rxm3l9] { font-size: 30px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
.wbs-progress-hero-content[b-kde5rxm3l9] { flex: 1; min-width: 0; }
.wbs-progress-hero-content strong[b-kde5rxm3l9] { display: block; font-size: 13px; font-weight: 500; }
.wbs-progress-hero-content > span[b-kde5rxm3l9] { color: var(--wbs-summary-muted); font-size: 12px; }
.wbs-progress-hero.wbs-overall-progress[b-kde5rxm3l9] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 8px 14px; }
.wbs-overall-progress .wbs-progress-total[b-kde5rxm3l9] { line-height: 1; }
.wbs-overall-progress .wbs-progress-hero-content[b-kde5rxm3l9] { overflow-wrap: anywhere; }
.wbs-overall-progress-percentage[b-kde5rxm3l9] { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; font-size: 11px; color: var(--wbs-summary-muted); }
.wbs-overall-progress-percentage strong[b-kde5rxm3l9] { color: var(--wbs-summary-success); font-size: 22px; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.wbs-overall-progress > .wbs-progress-track[b-kde5rxm3l9] { grid-column: 1 / -1; margin-top: 0; }
@container wbs-progress (max-width: 480px) {
    .wbs-progress-hero.wbs-overall-progress[b-kde5rxm3l9] { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px 10px; }
    .wbs-overall-progress > .wbs-progress-info[b-kde5rxm3l9] { grid-column: 3; grid-row: 1; }
    .wbs-overall-progress-percentage[b-kde5rxm3l9] { grid-column: 1 / -1; grid-row: 2; flex-direction: row; align-items: baseline; gap: 5px; }
    .wbs-overall-progress > .wbs-progress-track[b-kde5rxm3l9] { grid-row: 3; }
}
.wbs-progress-track[b-kde5rxm3l9] { height: 5px; overflow: hidden; border-radius: 5px; background: var(--wbs-summary-track, color-mix(in srgb, #7189a7 20%, var(--wbs-frost-surface))); margin-top: 9px; }
.wbs-progress-track > span[b-kde5rxm3l9] { display: block; height: 100%; border-radius: inherit; background: var(--wbs-summary-success); }
.wbs-progress-info[b-kde5rxm3l9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    box-sizing: border-box;
    padding: 0;
    border: 1px solid var(--wbs-summary-line);
    border-radius: 50%;
    color: var(--wbs-summary-muted);
    background: var(--wbs-summary-tile);
    cursor: help;
}
.wbs-progress-info[b-kde5rxm3l9]  .rzi { width: 15px; height: 15px; font-size: 15px; line-height: 15px; overflow: hidden; }
.wbs-progress-info:hover[b-kde5rxm3l9] { background: color-mix(in srgb, #7189a7 18%, var(--wbs-frost-surface)); }
.wbs-progress-info:focus-visible[b-kde5rxm3l9] { outline: 2px solid var(--wbs-frost-primary); outline-offset: 2px; }
.wbs-phase-progress-list[b-kde5rxm3l9] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 360px;
    box-sizing: border-box;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: var(--wbs-summary-line) transparent;
    padding: 4px;
}
.wbs-phase-progress[b-kde5rxm3l9] { flex: 0 0 auto; min-width: 0; border: 1px solid var(--wbs-summary-line); border-radius: 12px; background: var(--wbs-summary-tile); box-shadow: var(--wbs-summary-card-shadow, none); }
.wbs-phase-disclosure[b-kde5rxm3l9] { border-radius: inherit; }
.wbs-phase-row-header[b-kde5rxm3l9] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 240px) 20px; align-items: center; gap: 12px; padding: 12px 14px; border-radius: inherit; list-style: none; cursor: pointer; }
.wbs-phase-row-header[b-kde5rxm3l9]::-webkit-details-marker { display: none; }
.wbs-phase-row-header:hover[b-kde5rxm3l9] { background: color-mix(in srgb, var(--wbs-summary-accent) 4%, transparent); }
.wbs-phase-row-header:focus-visible[b-kde5rxm3l9] { outline: 2px solid var(--wbs-summary-accent); outline-offset: -3px; }
.wbs-phase-row-header[b-kde5rxm3l9]  .wbs-phase-chevron { font-size: 20px; color: var(--wbs-summary-muted); }
.wbs-phase-disclosure[open] > .wbs-phase-row-header[b-kde5rxm3l9]  .wbs-phase-chevron { transform: rotate(180deg); }
.wbs-phase-row-details[b-kde5rxm3l9] { padding: 0 14px 12px; }
.wbs-phase-empty-heading[b-kde5rxm3l9] { padding: 12px 14px 8px; }
.wbs-phase-meter[b-kde5rxm3l9] { min-width: 0; }
.wbs-phase-alerts[b-kde5rxm3l9] { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.wbs-phase-disclosure[open] .wbs-phase-alerts[b-kde5rxm3l9] { display: none; }
.wbs-phase-progress-heading .wbs-phase-alert[b-kde5rxm3l9] { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 400; }
.wbs-phase-progress-heading .wbs-phase-alert strong[b-kde5rxm3l9] {
    justify-content: center;
    flex-shrink: 0;
    box-sizing: border-box;
    min-width: 26px;
    height: 22px;
    padding: 0 6px;
    border: 1px solid color-mix(in srgb, currentColor 25%, var(--wbs-summary-line));
    border-radius: 7px;
    background: color-mix(in srgb, currentColor 11%, var(--wbs-glass-wash, var(--wbs-summary-tile)));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--wbs-glass-shine, var(--wbs-frost-shine)) 30%, transparent);
    font-size: 12px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.wbs-phase-alert.is-hours[b-kde5rxm3l9] { color: var(--wbs-summary-warning); }
.wbs-phase-alert.is-deadline[b-kde5rxm3l9] { color: var(--wbs-status-deadline, var(--rz-danger)); }
.wbs-phase-alert[b-kde5rxm3l9]  .rzi { font-size: 15px; }
@container wbs-progress (max-width: 560px) {
    .wbs-phase-row-header[b-kde5rxm3l9] { grid-template-columns: minmax(0, 1fr) minmax(0, 140px) 18px; gap: 8px; }
    .wbs-phase-completion[b-kde5rxm3l9] { flex-wrap: wrap; gap: 3px 8px; }
}
@container wbs-progress (max-width: 360px) {
    .wbs-phase-row-header[b-kde5rxm3l9] { grid-template-columns: minmax(0, 1fr) 18px; }
    .wbs-phase-meter[b-kde5rxm3l9] { grid-column: 1 / -1; grid-row: 2; }
    .wbs-phase-row-header[b-kde5rxm3l9]  .wbs-phase-chevron { grid-column: 2; grid-row: 1; }
}
.wbs-phase-progress-heading[b-kde5rxm3l9] { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.wbs-phase-progress-heading strong[b-kde5rxm3l9] { display: inline-flex; align-items: center; gap: 7px; min-width: 0; max-width: 100%; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.wbs-phase-progress-dot[b-kde5rxm3l9] { display: inline-block; flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; }
.wbs-phase-progress-heading > span[b-kde5rxm3l9] { color: var(--wbs-summary-muted); font-size: 12px; }
.wbs-progress-footer[b-kde5rxm3l9] { flex-wrap: wrap; margin-top: 10px; }
.wbs-progress-footer[b-kde5rxm3l9]  .rzi { font-size: 14px; }
.wbs-progress-refresh[b-kde5rxm3l9] { margin-left: auto; color: var(--wbs-summary-warning); }
@media (max-width: 480px) {
    .wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li button { padding: 8px 5px; gap: 5px; font-size: 12px; }
    .wbs-progress-refresh[b-kde5rxm3l9] { margin-left: 0; }
}
@media (pointer: coarse) {
    .wbs-progress-details-toggle[b-kde5rxm3l9] { min-height: 44px; }
    .wbs-progress-info[b-kde5rxm3l9] { width: 44px; height: 44px; }
    .wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li button { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
    .wbs-progress-summary[b-kde5rxm3l9]  .wbs-progress-tabs .rz-tabview-nav li { transition: none; }
}
/* /Components/Features/Tasks/Pages/TaskDetails.razor.rz.scp.css */
.wbs-toolbar-shell[b-xr9btt4fib] {
    margin-bottom: 12px;
    container: wbs-toolbar / inline-size;
}

.wbs-header[b-xr9btt4fib] {
    position: relative;
    z-index: 1;
}

.wbs-header .wbs-bar[b-xr9btt4fib] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0;
    padding: 10px 68px 10px 14px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 28px;
    background: linear-gradient(110deg, #111827 0%, #1c2342 65%, #2b4364 100%);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 2px 10px rgba(0, 0, 0, .05);
}

.wbs-banner-title[b-xr9btt4fib] { flex: 0 1 auto; min-width: 0; }
.wbs-banner-actions[b-xr9btt4fib] { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; min-width: 0; }
.wbs-banner-actions[b-xr9btt4fib]  > * { flex-shrink: 0; }
.wbs-banner-actions[b-xr9btt4fib]  .rz-button { min-height: 40px; white-space: nowrap; }
.wbs-banner-actions[b-xr9btt4fib]  .rz-button-text { white-space: nowrap; }
.wbs-banner-actions[b-xr9btt4fib]  .wbs-photo-toggle { flex-wrap: nowrap; min-height: 40px; box-sizing: border-box; }
.wbs-banner-actions[b-xr9btt4fib]  .wbs-photo-label { white-space: nowrap; }
.wbs-header .wbs-banner-actions[b-xr9btt4fib]  .rz-button.rz-button-icon-only:not(.rz-splitbutton-menubutton) { width: 40px; min-width: 40px; height: 40px; padding: 0; }

@container wbs-toolbar (max-width: 1140px) {
    .wbs-banner-actions[b-xr9btt4fib] { gap: 8px; }
    .wbs-banner-actions[b-xr9btt4fib]  .wbs-photo-label,
    .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-action .rz-button-text,
    .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-export .rz-button-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .wbs-header .wbs-banner-actions[b-xr9btt4fib]  .rz-button.wbs-banner-action.rz-button-md,
    .wbs-header .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-export > .rz-button { width: 44px; min-width: 44px; height: 44px; padding: 0; }
    .wbs-header .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-export > .rz-splitbutton-menubutton { width: 28px; min-width: 28px; }
    .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-action .rz-button-box,
    .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-export .rz-button-box { gap: 0; }
    .wbs-banner-actions[b-xr9btt4fib]  .wbs-photo-toggle { padding: 8px 10px !important; gap: 8px !important; }
}

@media (pointer: coarse) {
    .wbs-header .wbs-banner-actions[b-xr9btt4fib]  .wbs-banner-export > .rz-splitbutton-menubutton { min-width: 44px; min-height: 44px; }
}

@container wbs-toolbar (max-width: 680px) {
    .wbs-header .wbs-bar[b-xr9btt4fib] { flex-direction: column; align-items: stretch; gap: 12px; padding: 12px 14px; border-radius: 22px; }
    .wbs-banner-title[b-xr9btt4fib] { padding-inline-end: 54px; }
    .wbs-banner-actions[b-xr9btt4fib] { justify-content: flex-start; }
    .wbs-header .wbs-settings-toggle[b-xr9btt4fib] { inset-block-start: 14px; inset-block-end: auto; inset-inline-end: 14px; }
}

.wbs-settings-toggle[b-xr9btt4fib] {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 16px;
    display: flex;
    align-items: center;
}

/* Override the generic icon-button dimensions so width and height stay equal. */
.wbs-settings-toggle[b-xr9btt4fib]  .rz-button.wbs-settings-button.rz-button-icon-only.rz-button-md {
    --wbs-settings-accent: #9ed9f1;
    --wbs-settings-glow: #38bdf8;
    box-sizing: border-box;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    aspect-ratio: 1;
    padding: 0;
    border-radius: 50%;
}

/* The icon provides a small state cue while the panel opens immediately. */
.wbs-settings-toggle[b-xr9btt4fib]  .wbs-settings-button .rzi {
    display: inline-block;
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform 160ms cubic-bezier(.22, .61, .36, 1);
}

.wbs-settings-toggle[b-xr9btt4fib]  .wbs-settings-button.is-open .rzi {
    transform: rotate(180deg);
    text-shadow: 0 0 2px color-mix(in srgb, var(--wbs-settings-glow) 45%, transparent),
        0 0 5px color-mix(in srgb, var(--wbs-settings-glow) 25%, transparent);
}

.wbs-settings-toggle[b-xr9btt4fib]  .wbs-settings-button.is-open {
    border-color: color-mix(in srgb, var(--wbs-settings-accent) 45%, var(--wbs-frost-line));
    color: var(--wbs-settings-accent);
    background: color-mix(in srgb, var(--wbs-settings-glow) 9%, var(--wbs-frost-surface));
}

.wbs-grid-shell[b-xr9btt4fib]  .wbs-task-photo {
    width: 40px;
    height: 40px;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    vertical-align: middle;
}

.wbs-grid-shell[b-xr9btt4fib]  .wbs-actions-cell,
.wbs-grid-shell[b-xr9btt4fib]  .wbs-actions-header {
    padding-inline: 4px;
}

.wbs-grid-shell[b-xr9btt4fib]  .wbs-actions-header .rz-column-title {
    padding-inline: 0;
}

.wbs-actions-header-icon[b-xr9btt4fib] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.wbs-header[b-xr9btt4fib]  .rz-switch {
    --rz-switch-background-color: #526078;
    --rz-switch-circle-background-color: #cbd5e1;
    --rz-switch-checked-background-color: #0e7490;
    --rz-switch-checked-circle-background-color: #67e8f9;
    --rz-switch-focus-outline: 2px solid #67e8f9;
}

.wbs-header[b-xr9btt4fib]  .rz-switch.rz-switch-checked .rz-switch-circle:hover:not(.rz-disabled):before {
    box-shadow: 0 0 0 5px rgba(103, 232, 249, .18);
}

/* Keep the grid's layout and interactions under Radzen's control.
   Mix slate into the active theme surface so both themes stay readable. */
/* Radzen clips table cells by default. The empty notice needs to reach
   the grid's scroll container for horizontal sticky positioning to work. */
.wbs-grid-shell[b-xr9btt4fib]  .wbs-data-grid .rz-grid-table td:has(.empty-notice) {
    overflow: visible;
}

.wbs-grid-shell[b-xr9btt4fib]  .wbs-data-grid {
    --wbs-grid-surface: var(--rz-base-background-color);
    --wbs-grid-tint: color-mix(in srgb, #405b7e 8%, var(--wbs-grid-surface));
    --wbs-grid-line: color-mix(in srgb, var(--rz-text-color) 16%, var(--wbs-grid-surface));
    --wbs-grid-hover: color-mix(in srgb, #7189a7 16%, var(--wbs-grid-surface));
    --rz-grid-background-color: var(--wbs-grid-surface);
    --rz-grid-border: 1px solid var(--wbs-grid-line);
    --rz-grid-border-radius: 14px;
    --rz-grid-shadow: 0 3px 12px rgba(17, 24, 39, .06);
    --rz-grid-header-background-color: var(--wbs-grid-tint);
    --rz-grid-header-color: var(--rz-text-title-color);
    --rz-grid-header-font-weight: 600;
    --rz-grid-header-sorted-background-color: var(--wbs-grid-hover);
    --rz-grid-header-cell-border: 1px solid var(--wbs-grid-line);
    --rz-grid-header-cell-border-bottom: 1px solid var(--wbs-grid-line);
    --rz-grid-cell-border: 1px solid var(--wbs-grid-line);
    --rz-grid-right-cell-border: 1px solid var(--wbs-grid-line);
    --rz-grid-bottom-cell-border: 1px solid var(--wbs-grid-line);
    --rz-grid-cell-color: var(--rz-text-color);
    --rz-grid-stripe-background-color: color-mix(in srgb, #405b7e 3%, var(--wbs-grid-surface));
    --rz-grid-stripe-odd-background-color: var(--wbs-grid-surface);
    --rz-grid-hover-background-color: var(--wbs-grid-hover);
    --rz-grid-hover-color: var(--rz-text-title-color);
    --rz-grid-frozen-cell-background-color: var(--wbs-grid-surface);
    --rz-grid-frozen-cell-border: 1px solid var(--wbs-grid-line);
    --rz-grid-frozen-stripe-background-color: var(--rz-grid-stripe-background-color);
    --rz-grid-frozen-stripe-odd-background-color: var(--rz-grid-stripe-odd-background-color);
    --rz-pager-background-color: var(--wbs-grid-tint);
    --rz-pager-border: 1px solid var(--wbs-grid-line);
    --rz-pager-button-border-radius: 8px;
    --rz-pager-numeric-button-hover-background-color: var(--wbs-grid-hover);
    --rz-pager-numeric-button-hover-color: var(--rz-text-title-color);
    --rz-pager-numeric-button-selected-background-color: color-mix(in srgb, #7189a7 14%, transparent);
    --rz-pager-numeric-button-selected-color: var(--rz-text-title-color);
    --rz-pager-numeric-button-selected-border: 1px solid color-mix(in srgb, #7189a7 32%, transparent);
}

.wbs-edit-notice[b-xr9btt4fib] {
    --edit-notice-accent: color-mix(in srgb, var(--rz-primary) 65%, var(--rz-text-title-color));
    display: flex;
    align-items: center;
    gap: 10px;
    box-sizing: border-box;
    min-height: 48px;
    margin-bottom: 8px;
    padding: 6px 12px;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 22%, var(--rz-base-background-color));
    border-inline-start: 3px solid var(--edit-notice-accent);
    border-radius: 10px;
    background: linear-gradient(110deg,
        color-mix(in srgb, var(--rz-primary) 8%, var(--rz-base-background-color)),
        var(--rz-base-background-color));
    color: var(--rz-text-color);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 2px 6px rgba(15, 23, 42, .05);
}

.wbs-edit-notice-icon[b-xr9btt4fib] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 18%, transparent);
    border-radius: 8px;
    background: color-mix(in srgb, var(--rz-primary) 10%, transparent);
    color: var(--edit-notice-accent);
}

.wbs-edit-notice-content[b-xr9btt4fib] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 10px;
    min-width: 0;
    line-height: 18px;
}

.wbs-edit-notice-title[b-xr9btt4fib] {
    display: block;
    color: var(--rz-text-title-color);
    font-size: 13px;
    font-weight: 600;
}

.wbs-edit-notice-instruction[b-xr9btt4fib] {
    margin: 0;
    font-size: 13px;
}

.wbs-edit-notice-instruction strong[b-xr9btt4fib] {
    color: var(--edit-notice-accent);
    font-weight: 600;
}

.wbs-edit-notice-detail[b-xr9btt4fib] {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--rz-text-secondary-color);
    font-size: 12px;
}

.wbs-validation-notice[b-xr9btt4fib] {
    margin-bottom: 10px;
}

.wbs-validation-summary[b-xr9btt4fib] {
    --validation-line: color-mix(in srgb, var(--wbs-frost-shine) 40%, var(--wbs-frost-line));
    border: 1px solid var(--validation-line);
    border-radius: 14px;
    background: linear-gradient(125deg, color-mix(in srgb, var(--rz-warning) 7%, transparent), transparent 65%),
        color-mix(in srgb, var(--wbs-frost-background) 88%, transparent);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--wbs-frost-shine) 60%, transparent),
        0 4px 16px rgba(15, 23, 42, 0.06);
    /* The surrounding smoky message owns its glass effect. */
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    color: var(--rz-text-color);
    overflow: hidden;
}

.wbs-validation-summary > summary[b-xr9btt4fib] {
    display: flex;
    align-items: center;
    gap: 10px;
    box-sizing: border-box;
    min-height: 48px;
    padding: 10px 12px;
    list-style: none;
    cursor: pointer;
}

.wbs-validation-summary > summary[b-xr9btt4fib]::-webkit-details-marker {
    display: none;
}

.wbs-validation-summary > summary:focus-visible[b-xr9btt4fib] {
    outline: 2px solid var(--rz-primary);
    outline-offset: -2px;
    border-radius: 13px;
}

.wbs-validation-warning-icon[b-xr9btt4fib] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    color: color-mix(in srgb, var(--rz-warning) 70%, var(--rz-text-title-color));
    background: color-mix(in srgb, var(--rz-warning) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--rz-warning) 20%, transparent);
    border-radius: 9px;
}

.wbs-validation-warning-icon[b-xr9btt4fib]  .rzi {
    font-size: 20px;
}

.wbs-validation-title[b-xr9btt4fib] {
    min-width: 0;
    color: var(--rz-text-title-color);
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.wbs-validation-toggle[b-xr9btt4fib] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: auto;
    flex-shrink: 0;
    color: var(--rz-text-secondary-color);
    font-size: 12px;
}

.wbs-validation-toggle[b-xr9btt4fib]  .rzi {
    font-size: 18px;
}

.wbs-validation-summary[open] .wbs-validation-toggle[b-xr9btt4fib]  .rzi {
    transform: rotate(180deg);
}

.wbs-validation-body[b-xr9btt4fib] {
    padding: 12px;
    border-top: 1px solid var(--validation-line);
    background: color-mix(in srgb, var(--wbs-frost-surface) 35%, transparent);
}

.wbs-validation-group + .wbs-validation-group[b-xr9btt4fib] {
    margin-top: 12px;
}

.wbs-validation-phase[b-xr9btt4fib] {
    margin-bottom: 6px;
    color: var(--rz-text-secondary-color);
    font-size: 12px;
    font-weight: 600;
}

.wbs-validation-list[b-xr9btt4fib] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.wbs-validation-list li[b-xr9btt4fib] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    font-size: 13px;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.wbs-validation-list li + li[b-xr9btt4fib] {
    border-top: 1px solid color-mix(in srgb, var(--validation-line) 45%, transparent);
}

.wbs-validation-message[b-xr9btt4fib] {
    flex: 1;
    min-width: 0;
}

.wbs-validation-list[b-xr9btt4fib]  .wbs-validation-locate {
    flex-shrink: 0;
    min-height: 28px;
    padding: 4px 10px;
    font-size: 11px;
}

.wbs-validation-list[b-xr9btt4fib]  .wbs-validation-locate .rzi {
    font-size: 15px;
}

.wbs-validation-item-icon[b-xr9btt4fib] {
    display: inline-flex;
    flex-shrink: 0;
    color: color-mix(in srgb, var(--rz-danger) 65%, var(--rz-text-title-color));
}

.wbs-validation-item-icon[b-xr9btt4fib]  .rzi {
    font-size: 16px;
}

.wbs-phase-add-fields[b-xr9btt4fib] {
    margin-bottom: 10px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--rz-primary) 20%, var(--rz-base-background-color));
    border-radius: 10px;
    background: var(--rz-base-background-color);
}

.wbs-phase-add-fields-title[b-xr9btt4fib] {
    margin-bottom: 8px;
    color: var(--rz-text-title-color);
    font-size: 13px;
    font-weight: 600;
}

.wbs-phase-add-fields-grid[b-xr9btt4fib] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    gap: 12px;
}

.wbs-phase-add-field label[b-xr9btt4fib] {
    display: block;
    margin-bottom: 4px;
    color: var(--rz-text-color);
    font-size: 12px;
}

.wbs-field-required[b-xr9btt4fib] {
    margin-inline-start: 4px;
    color: var(--rz-text-secondary-color);
    font-size: 11px;
}

.wbs-new-phase-cell[b-xr9btt4fib] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.wbs-new-phase-badge[b-xr9btt4fib] {
    padding: 2px 7px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--rz-primary) 12%, transparent);
    color: color-mix(in srgb, var(--rz-primary) 65%, var(--rz-text-title-color));
    font-size: 11px;
    font-weight: 600;
}

.wbs-phase-task-cell[b-xr9btt4fib] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.wbs-phase-task-name[b-xr9btt4fib] {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
}

.wbs-phase-removal-cell .wbs-phase-task-name[b-xr9btt4fib] {
    color: var(--rz-text-secondary-color);
    text-decoration: line-through;
}

.wbs-phase-removal-badge[b-xr9btt4fib] {
    padding: 2px 7px;
    border: 1px solid color-mix(in srgb, var(--rz-danger) 20%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--rz-danger) 9%, var(--rz-base-background-color));
    color: color-mix(in srgb, var(--rz-danger) 65%, var(--rz-text-title-color));
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.wbs-phase-removal-value[b-xr9btt4fib] {
    color: var(--rz-text-secondary-color);
}

.project-selector[b-xr9btt4fib] {
    --selector-surface: var(--rz-base-background-color);
    --selector-text: var(--rz-text-title-color);
    --selector-muted: var(--rz-text-secondary-color);
    --selector-border: color-mix(in srgb, var(--rz-text-color) 18%, var(--selector-surface));
    --selector-accent: color-mix(in srgb, #7189a7 55%, var(--selector-text));
    --selector-chip: color-mix(in srgb, #7189a7 18%, var(--selector-surface));
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-width: 0;
    gap: 12px;
    width: fit-content;
    max-width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--selector-border);
    border-radius: 14px;
    background: color-mix(in srgb, #7189a7 5%, var(--selector-surface) 95%);
    color: var(--selector-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 2px 5px rgba(17, 24, 39, .06);
}

.project-selector-icon[b-xr9btt4fib] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--selector-chip);
    color: var(--selector-accent);
}

.project-selector-icon[b-xr9btt4fib]  .rzi {
    color: color-mix(in srgb, #38bdf8 55%, var(--selector-text));
    text-shadow: 0 0 2px color-mix(in srgb, #38bdf8 38%, transparent),
        0 0 5px color-mix(in srgb, #38bdf8 20%, transparent);
}

.project-selector[b-xr9btt4fib]  .project-selector-dropdown {
    flex: 1 1 260px;
    width: 260px;
    min-width: 0;
    max-width: 360px;
    border: 1px solid var(--selector-border);
    border-radius: 9px;
    background: var(--selector-surface);
    color: var(--selector-text);
    font-weight: 600;
    box-shadow: none;
}

.project-selector[b-xr9btt4fib]  .project-selector-dropdown:not(.rz-state-disabled):hover {
    border-color: var(--selector-accent);
}

.project-selector[b-xr9btt4fib]  .project-selector-dropdown:focus-within {
    border-color: var(--selector-accent);
    outline: 2px solid color-mix(in srgb, var(--selector-accent) 35%, transparent);
    outline-offset: 2px;
}

.project-selector-summary[b-xr9btt4fib] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    padding: 6px 9px;
    border: 1px solid var(--selector-border);
    border-radius: 9px;
    background: color-mix(in srgb, #7189a7 8%, var(--selector-surface));
    box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 25%, transparent),
                0 1px 3px rgba(17, 24, 39, .05);
    color: var(--selector-muted);
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    white-space: nowrap;
}

.project-selector-count[b-xr9btt4fib] {
    color: color-mix(in srgb, #2563eb 65%, var(--selector-text));
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.phase-selector-alignment[b-xr9btt4fib] {
    display: flex;
    justify-content: flex-end;
    min-width: 0;
}

.phase-selector[b-xr9btt4fib]  .phase-selector-label {
    color: var(--selector-muted);
    font-size: 13px;
    font-weight: 600;
    flex-shrink: 0;
}

.phase-selector[b-xr9btt4fib]  .phase-selector-dropdown {
    width: 360px;
    max-width: 420px;
    --rz-chip-background-color: var(--selector-chip);
    --rz-chip-color: var(--selector-text);
    --rz-chip-border-radius: 7px;
    --rz-chip-font-weight: 600;
}

.phase-selector[b-xr9btt4fib]  .rz-chip {
    background: var(--selector-chip);
    color: var(--selector-text);
}

@media (max-width: 480px) {
    .project-selector[b-xr9btt4fib] {
        flex-wrap: wrap;
        width: 100%;
        box-sizing: border-box;
        gap: 8px;
    }

    .project-selector[b-xr9btt4fib]  .project-selector-dropdown {
        flex-basis: calc(100% - 44px);
        max-width: none;
    }

    .phase-selector[b-xr9btt4fib]  .phase-selector-dropdown {
        flex-basis: 100%;
    }

    .project-selector-summary[b-xr9btt4fib] {
        margin-inline-start: 38px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wbs-settings-toggle[b-xr9btt4fib]  .wbs-settings-button .rzi {
        transition: none;
    }
}
/* /Components/Layout/Footer.razor.rz.scp.css */
.projectlens-footer[b-n6cx5cxlij] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 4px 16px;
    min-height: 32px;
    padding: 6px 20px;
    background-color: #eef2f7;
    background-image: linear-gradient(115deg, rgba(255, 255, 255, .65), rgba(224, 231, 255, .18) 55%, rgba(207, 250, 254, .16));
    border-top: 1px solid rgba(148, 163, 184, .2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 -2px 12px rgba(15, 23, 42, .025);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
    line-height: 1.5;
}

.projectlens-footer__version[b-n6cx5cxlij] {
    display: inline-flex;
    align-items: center;
    padding: 0 7px;
    border: 1px solid rgba(100, 116, 139, .2);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .8), rgba(255, 255, 255, .35));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85);
    color: #526078;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: .6875rem;
    line-height: 16px;
}

.projectlens-footer__copyright[b-n6cx5cxlij] {
    color: #526078;
    font-size: .6875rem;
}

@supports ((backdrop-filter: blur(10px)) or (-webkit-backdrop-filter: blur(10px))) {
    .projectlens-footer[b-n6cx5cxlij] {
        background-color: rgba(238, 242, 247, .72);
        backdrop-filter: blur(10px) saturate(140%);
        -webkit-backdrop-filter: blur(10px) saturate(140%);
    }
}

@media (max-width: 480px) {
    .projectlens-footer[b-n6cx5cxlij] {
        gap: 4px 12px;
        padding: 6px 12px;
    }
}
/* /Components/Layout/Header.razor.rz.scp.css */
.pl-header[b-1cuqgjr7ld] {
    --pl-header-bg: rgba(9, 17, 31, 0.85);
    --pl-header-line: rgba(255, 255, 255, .09);
    --pl-header-text: rgba(255, 255, 255, .72);
    --pl-header-strong: #f8fafc;
    --pl-header-indigo: #6366f1;
    --pl-header-cyan: #22d3ee;
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    height: 76px;
    padding: 0 24px;
    background: var(--pl-header-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--pl-header-line);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
    color: var(--pl-header-text);
}

.pl-header__start[b-1cuqgjr7ld],
.pl-header__end[b-1cuqgjr7ld] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.pl-header__start[b-1cuqgjr7ld] { flex: 1 1 auto; }
.pl-header__end[b-1cuqgjr7ld] { flex: 0 1 auto; }

.pl-header__toggle[b-1cuqgjr7ld],
.pl-header__action-btn[b-1cuqgjr7ld] { flex-shrink: 0; }

.pl-header__toggle[b-1cuqgjr7ld] {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--pl-header-line);
    border-radius: 8px;
    background: rgba(255, 255, 255, .035);
    color: var(--pl-header-strong);
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease;
}

    .pl-header__toggle:hover[b-1cuqgjr7ld] {
        background: rgba(255, 255, 255, .08);
        border-color: rgba(99, 102, 241, .3);
    }

.pl-header__breadcrumb[b-1cuqgjr7ld] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .9rem;
    font-weight: 600;
    color: var(--pl-header-strong);
    min-width: 0;
}

.pl-header__breadcrumb-icon[b-1cuqgjr7ld] { flex-shrink: 0; }
.pl-header__breadcrumb-text[b-1cuqgjr7ld] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pl-header__breadcrumb-icon[b-1cuqgjr7ld] {
    color: var(--pl-header-cyan);
    font-size: 18px;
}

.pl-header__search[b-1cuqgjr7ld] {
    position: relative;
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--pl-header-line);
    border-radius: 8px;
    padding: 0 12px;
    height: 40px;
    width: 240px;
    transition: border-color .18s ease, width .2s ease;
}

    .pl-header__search:focus-within[b-1cuqgjr7ld] {
        width: 300px;
        border-color: var(--pl-header-cyan);
        background: rgba(255, 255, 255, .06);
    }

    .pl-header__search .material-icons[b-1cuqgjr7ld] {
        color: var(--pl-header-text);
        font-size: 18px;
        margin-right: 8px;
    }

    .pl-header__search input[b-1cuqgjr7ld] {
        background: transparent;
        border: none;
        outline: none;
        color: var(--pl-header-strong);
        font-size: .82rem;
        width: 100%;
    }

        .pl-header__search input[b-1cuqgjr7ld]::placeholder {
            color: rgba(255, 255, 255, .35);
        }

    .pl-header__search kbd[b-1cuqgjr7ld] {
        font-size: .65rem;
        background: rgba(255, 255, 255, .08);
        border: 1px solid rgba(255, 255, 255, .1);
        padding: 2px 6px;
        border-radius: 4px;
        color: var(--pl-header-text);
    }

.pl-header__action-btn[b-1cuqgjr7ld] {
    position: relative;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--pl-header-line);
    border-radius: 8px;
    background: rgba(255, 255, 255, .035);
    color: var(--pl-header-strong);
    cursor: pointer;
    transition: background .18s ease;
}

    .pl-header__action-btn:hover[b-1cuqgjr7ld] {
        background: rgba(255, 255, 255, .08);
    }

.pl-header__badge[b-1cuqgjr7ld] {
    position: absolute;
    top: 9px;
    right: 10px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--pl-header-cyan);
    box-shadow: 0 0 0 3px rgba(34, 211, 238, .2);
}

.pl-header__profile-wrapper[b-1cuqgjr7ld] {
    --pl-profile-ease: cubic-bezier(.22, 1, .36, 1);
    position: relative;
    min-width: 0;
    flex: 0 0 216px;
    width: 216px;
}

.pl-header__profile[b-1cuqgjr7ld] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    box-sizing: border-box;
    width: 100%;
    padding: 5px 10px 5px 6px;
    border-radius: 16px;
    border: 1px solid rgba(224, 239, 255, .22);
    cursor: pointer;
    font: inherit;
    color: var(--pl-header-strong);
    background: linear-gradient(135deg, rgba(255, 255, 255, .14), rgba(173, 209, 255, .04));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), inset 0 -1px 0 rgba(255, 255, 255, .04), 0 4px 14px rgba(2, 8, 23, .12);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    transition: background .24s ease, border-color .24s ease, box-shadow .24s ease, transform .24s var(--pl-profile-ease);
}

    .pl-header__profile:hover[b-1cuqgjr7ld],
    .is-open .pl-header__profile[b-1cuqgjr7ld] {
        background: linear-gradient(135deg, rgba(255, 255, 255, .2), rgba(122, 192, 255, .09));
        border-color: rgba(224, 239, 255, .38);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 6px 20px rgba(2, 8, 23, .2);
    }

.pl-header__profile:active[b-1cuqgjr7ld] { transform: scale(.98); }

.pl-header__profile:focus-visible[b-1cuqgjr7ld],
.pl-header__menu-item:focus-visible[b-1cuqgjr7ld],
.pl-header__logout:focus-visible[b-1cuqgjr7ld] {
    outline: 2px solid var(--pl-header-cyan);
    outline-offset: 3px;
}

.pl-header__profile-chevron[b-1cuqgjr7ld] {
    flex-shrink: 0;
}

.is-open .pl-header__profile-chevron[b-1cuqgjr7ld] { transform: rotate(180deg); }

.pl-header__dropdown[b-1cuqgjr7ld] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 216px;
    max-width: calc(100vw - 32px);
    padding: 7px;
    background: linear-gradient(145deg, rgba(235, 245, 255, .15), rgba(97, 160, 229, .04) 55%), rgba(23, 37, 57, .86);
    border: 1px solid rgba(224, 239, 255, .3);
    border-radius: 20px;
    box-shadow: 0 18px 44px rgba(2, 8, 23, .24), 0 4px 12px rgba(2, 8, 23, .12), inset 0 1px 0 rgba(255, 255, 255, .26), inset 0 -1px 0 rgba(255, 255, 255, .06);
    backdrop-filter: blur(24px) saturate(170%);
    -webkit-backdrop-filter: blur(24px) saturate(170%);
    z-index: 1000;
    display: none;
}

.is-open .pl-header__dropdown[b-1cuqgjr7ld] {
    display: block;
}

.pl-header__menu-divider[b-1cuqgjr7ld] {
    margin: 5px 0 0;
    padding-top: 5px;
    border-top: 1px solid rgba(224, 239, 255, .12);
}

.pl-header__logout-dialog[b-1cuqgjr7ld] {
    --pl-logout-ink: #152a42;
    --pl-logout-muted: #253b54;
    --pl-logout-focus: #315d8b;
    box-sizing: border-box;
    width: min(420px, calc(100vw - 32px));
    max-height: calc(100svh - 32px);
    margin: auto;
    padding: 28px;
    overflow: auto;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 28px;
    background: radial-gradient(ellipse at 0% 0%, rgba(255, 255, 255, .24), transparent 60%),
        linear-gradient(140deg, rgba(255, 255, 255, .22), rgba(255, 255, 255, .08) 48%, rgba(255, 255, 255, .04)),
        rgba(128, 146, 166, .22);
    color: var(--pl-logout-ink);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
    box-shadow: 0 24px 64px rgba(24, 36, 54, .22), 0 5px 16px rgba(24, 36, 54, .12),
        inset 0 1px 0 rgba(255, 255, 255, .72), inset 0 -1px 0 rgba(28, 44, 66, .2),
        inset 1px 0 0 rgba(255, 255, 255, .25), inset -1px 0 0 rgba(255, 255, 255, .08);
    backdrop-filter: blur(20px) saturate(110%);
    -webkit-backdrop-filter: blur(20px) saturate(110%);
}

html:has(#radzen-theme-link[href*="-dark"]) .pl-header__logout-dialog[b-1cuqgjr7ld] {
    --pl-logout-ink: #f5f8ff;
    --pl-logout-muted: #e0e8f4;
    --pl-logout-focus: #b8d8ff;
}

.pl-header__logout-dialog[open][b-1cuqgjr7ld] {
    animation: pl-logout-enter-b-1cuqgjr7ld .3s cubic-bezier(.22, 1, .36, 1) both;
}

.pl-header__logout-dialog[b-1cuqgjr7ld]::backdrop {
    background: rgba(31, 44, 65, .3);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    animation: pl-logout-backdrop-b-1cuqgjr7ld .2s ease both;
}

.pl-header__logout-dialog-icon[b-1cuqgjr7ld] {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    margin-bottom: 20px;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 17px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -1px 0 rgba(28, 44, 66, .16),
        0 3px 8px rgba(24, 36, 54, .08);
    color: var(--pl-logout-ink);
}

.pl-header__logout-dialog-icon .material-icons[b-1cuqgjr7ld] { font-size: 25px; }
.pl-header__logout-dialog h2[b-1cuqgjr7ld] {
    margin: 0 0 10px;
    color: var(--pl-logout-ink);
    font-size: 1.25rem;
    font-weight: 650;
    line-height: 1.35;
    letter-spacing: -.025em;
}

.pl-header__logout-dialog p[b-1cuqgjr7ld] {
    margin: 0;
    color: var(--pl-logout-muted);
    font-size: .875rem;
    line-height: 1.65;
}

.pl-header__logout-dialog-actions[b-1cuqgjr7ld] {
    display: flex;
    gap: 12px;
    margin-top: 26px;
}

.pl-header__logout-cancel[b-1cuqgjr7ld],
.pl-header__logout-confirm[b-1cuqgjr7ld] {
    display: inline-flex;
    flex: 1;
    justify-content: center;
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 46px;
    padding: 10px 16px;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -1px 0 rgba(28, 44, 66, .16),
        0 3px 8px rgba(24, 36, 54, .08);
    color: var(--pl-logout-ink);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, transform .2s cubic-bezier(.22, 1, .36, 1);
}

.pl-header__logout-confirm[b-1cuqgjr7ld] {
    border-color: rgba(255, 191, 183, .38);
    background: linear-gradient(145deg, rgba(167, 56, 57, .9), rgba(153, 50, 56, .94));
    color: #fff;
}

.pl-header__logout-confirm .material-icons[b-1cuqgjr7ld] { font-size: 18px; }
.pl-header__logout-cancel:hover[b-1cuqgjr7ld] { background: rgba(255, 255, 255, .23); border-color: rgba(255, 255, 255, .75); }
.pl-header__logout-confirm:hover[b-1cuqgjr7ld] { background: linear-gradient(145deg, rgba(151, 43, 48, .96), rgba(132, 35, 44, .98)); }
.pl-header__logout-cancel:active[b-1cuqgjr7ld],
.pl-header__logout-confirm:active[b-1cuqgjr7ld] { transform: scale(.97); }
.pl-header__logout-cancel:focus-visible[b-1cuqgjr7ld],
.pl-header__logout-confirm:focus-visible[b-1cuqgjr7ld] { outline: 2px solid var(--pl-logout-focus); outline-offset: 3px; }

@keyframes pl-logout-enter-b-1cuqgjr7ld {
    from { opacity: 0; transform: translateY(12px) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes pl-logout-backdrop-b-1cuqgjr7ld {
    from { opacity: 0; }
    to { opacity: 1; }
}

.pl-header__logout:hover[b-1cuqgjr7ld],
.pl-header__menu-item:hover[b-1cuqgjr7ld],
.pl-header__logout:focus-visible[b-1cuqgjr7ld],
.pl-header__menu-item:focus-visible[b-1cuqgjr7ld] {
    background: rgba(221, 240, 255, .12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}

.pl-header__logout:hover[b-1cuqgjr7ld] { color: #ffb7b2; }

.pl-header__logout .material-icons[b-1cuqgjr7ld],
.pl-header__menu-item .material-icons[b-1cuqgjr7ld] {
    font-size: 20px;
}

.pl-header__logout[b-1cuqgjr7ld],
.pl-header__menu-item[b-1cuqgjr7ld] {
    display: flex;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-height: 44px;
    padding: 11px 12px;
    border: none;
    border-radius: 13px;
    background: transparent;
    cursor: pointer;
    color: #edf5ff;
    font-family: inherit;
    font-size: .85rem;
    text-align: left;
    text-decoration: none;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.pl-header__avatar[b-1cuqgjr7ld] {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 12px;
    background: linear-gradient(135deg, var(--pl-header-indigo), var(--pl-header-cyan));
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(2, 8, 23, .15);
}

.pl-header__avatar:has(img)[b-1cuqgjr7ld] {
    background: #3b4553;
}

.pl-header__avatar img[b-1cuqgjr7ld] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pl-header__profile-info[b-1cuqgjr7ld] {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    min-width: 0;
    gap: 3px;
    line-height: 1.1;
    text-align: left;
}

    .pl-header__profile-info strong[b-1cuqgjr7ld] {
        color: var(--pl-header-strong);
        font-size: .8rem;
        font-weight: 600;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.pl-header__profile .material-icons[b-1cuqgjr7ld] {
    color: var(--pl-header-text);
    font-size: 18px;
}

@media (max-width: 768px) {
    .pl-header__search[b-1cuqgjr7ld] {
        display: none;
    }

    .pl-header[b-1cuqgjr7ld] {
        padding: 0 16px;
    }
}

@media (max-width: 480px) {
    .pl-header__profile-wrapper[b-1cuqgjr7ld] { flex-basis: 176px; width: 176px; }
    .pl-header__end[b-1cuqgjr7ld] { gap: 8px; }
    .pl-header__breadcrumb[b-1cuqgjr7ld] { display: none; }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .pl-header__dropdown[b-1cuqgjr7ld] { background: #203249; }
    .pl-header__logout-dialog[b-1cuqgjr7ld] { background: #bac6d2; }
    html:has(#radzen-theme-link[href*="-dark"]) .pl-header__logout-dialog[b-1cuqgjr7ld] { background: #48586b; }
}

@media (prefers-reduced-transparency: reduce) {
    .pl-header__profile[b-1cuqgjr7ld] { background: #26354a; backdrop-filter: none; -webkit-backdrop-filter: none; }
    .pl-header__dropdown[b-1cuqgjr7ld] { background: #203249; backdrop-filter: none; -webkit-backdrop-filter: none; }
    .pl-header__logout-dialog[b-1cuqgjr7ld] { background: #bac6d2; backdrop-filter: none; -webkit-backdrop-filter: none; }
    html:has(#radzen-theme-link[href*="-dark"]) .pl-header__logout-dialog[b-1cuqgjr7ld] { background: #48586b; }
    .pl-header__logout-dialog[b-1cuqgjr7ld]::backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; }
}

@media (prefers-reduced-motion: reduce) {
    .pl-header__profile[b-1cuqgjr7ld],
    .pl-header__profile-chevron[b-1cuqgjr7ld],
    .pl-header__dropdown[b-1cuqgjr7ld],
    .pl-header__menu-item[b-1cuqgjr7ld],
    .pl-header__logout[b-1cuqgjr7ld] { transition: none; }
    .pl-header__profile:active[b-1cuqgjr7ld] { transform: none; }
    .pl-header__logout-dialog[open][b-1cuqgjr7ld],
    .pl-header__logout-dialog[b-1cuqgjr7ld]::backdrop { animation: none; }
    .pl-header__logout-cancel[b-1cuqgjr7ld],
    .pl-header__logout-confirm[b-1cuqgjr7ld] { transition: none; }
    .pl-header__logout-cancel:active[b-1cuqgjr7ld],
    .pl-header__logout-confirm:active[b-1cuqgjr7ld] { transform: none; }
}


/* =========================================
   Atlas AI shortcut — dark navy header theme
   ========================================= */

.pl-header__atlas-link[b-1cuqgjr7ld] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    flex-shrink: 0;
    min-height: 40px;
    padding: 6px 12px;
    border: 1px solid var(--pl-header-line);
    border-radius: 9px;
    background: rgba(255, 255, 255, .035);
    color: var(--pl-header-strong);
    text-decoration: none;
    white-space: nowrap;
    font-size: .8rem;
    font-weight: 650;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

    .pl-header__atlas-link:hover[b-1cuqgjr7ld] {
        background: rgba(255, 255, 255, .085);
        border-color: rgba(34, 211, 238, .42);
        box-shadow: 0 0 0 1px rgba(34, 211, 238, .06), 0 4px 14px rgba(2, 8, 23, .18);
        color: var(--pl-header-strong);
        transform: translateY(-1px);
    }

    .pl-header__atlas-link:active[b-1cuqgjr7ld] {
        transform: translateY(0);
    }

    .pl-header__atlas-link:focus-visible[b-1cuqgjr7ld] {
        outline: 2px solid var(--pl-header-cyan);
        outline-offset: 3px;
    }

/* Atlas orbital logo */
.pl-header__atlas-mark[b-1cuqgjr7ld] {
    display: block;
    width: 27px;
    height: 27px;
    flex: 0 0 27px;
    color: var(--pl-header-strong);
}

.pl-header__atlas-orbit[b-1cuqgjr7ld] {
    stroke: var(--pl-header-cyan);
    fill: none;
}

.pl-header__atlas-node[b-1cuqgjr7ld] {
    fill: var(--pl-header-cyan);
}

/* Small cyan AI badge */
.pl-header__atlas-ai[b-1cuqgjr7ld] {
    padding: 2px 6px;
    border: 1px solid rgba(34, 211, 238, .2);
    border-radius: 5px;
    background: rgba(34, 211, 238, .10);
    color: var(--pl-header-cyan);
    font-size: 9px;
    font-weight: 750;
    line-height: 1.5;
    letter-spacing: .5px;
}

/* Mobile: compact logo-only shortcut */
@media (max-width: 760px) {
    .pl-header__atlas-link[b-1cuqgjr7ld] {
        gap: 0;
        min-height: 36px;
        padding: 5px;
        border-radius: 8px;
    }

    .pl-header__atlas-mark[b-1cuqgjr7ld] {
        width: 25px;
        height: 25px;
    }

    .pl-header__atlas-label[b-1cuqgjr7ld],
    .pl-header__atlas-ai[b-1cuqgjr7ld] {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-header__atlas-link[b-1cuqgjr7ld] {
        transition: none;
    }

        .pl-header__atlas-link:hover[b-1cuqgjr7ld],
        .pl-header__atlas-link:active[b-1cuqgjr7ld] {
            transform: none;
        }
}


/* /Components/Layout/LoginLayout.razor.rz.scp.css */
.login-layout[b-ywknrrv0s3] {
    --login-ink: #f5f7fc;
    --login-muted: #bac5d8;
    --login-line: rgba(255, 255, 255, .2);
    --login-accent: #3565dc;
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    min-height: 100svh;
    display: grid;
    grid-template-rows: auto 1fr;
    padding: 28px 38px 24px;
    background: radial-gradient(ellipse at 50% 56%, rgba(77, 101, 172, .21), transparent 58%),
        radial-gradient(ellipse at 3% 100%, rgba(70, 91, 152, .12), transparent 40%), #131c2e;
    color: var(--login-ink);
    color-scheme: dark;
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
}

.login-backdrop[b-ywknrrv0s3] {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}

.login-halo[b-ywknrrv0s3] {
    position: absolute;
    width: clamp(580px, 62vw, 820px);
    aspect-ratio: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-18deg);
    border: 1px solid rgba(164, 189, 246, .11);
    border-radius: 50%;
    background: radial-gradient(ellipse at 50% 5%, rgba(154, 181, 245, .08), transparent 52%);
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, .05);
}

.login-halo[b-ywknrrv0s3]::before,
.login-halo[b-ywknrrv0s3]::after {
    content: "";
    position: absolute;
    border-radius: 50%;
}

.login-halo[b-ywknrrv0s3]::before { inset: 34px; border: 1px solid rgba(164, 189, 246, .07); }
.login-halo[b-ywknrrv0s3]::after { inset: -57px; border: 1px solid rgba(164, 189, 246, .035); }

.login-header[b-ywknrrv0s3] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.login-brand[b-ywknrrv0s3] {
    display: flex;
    align-items: center;
    gap: 11px;
    font-size: 17px;
    font-weight: 650;
    letter-spacing: -.4px;
}

.login-brand-mark[b-ywknrrv0s3] {
    width: 35px;
    height: 35px;
    display: block;
    flex: 0 0 35px;
    object-fit: contain;
}

.login-content[b-ywknrrv0s3] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 48px 0;
}

@media (max-width: 580px) {
    .login-layout[b-ywknrrv0s3] { padding: 22px 20px; }
    .login-content[b-ywknrrv0s3] { padding: 36px 0; }
}

@media (prefers-reduced-transparency: reduce) {
    .login-halo[b-ywknrrv0s3] { display: none; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ── Layout shell ─────────────────────────────────────────────── */

.projectlens-layout[b-h9cwf648vs] {
    min-height: 100vh;
}

/* ── Header ───────────────────────────────────────────────────── */

.projectlens-header[b-h9cwf648vs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 70px;
    height: 70px;
    padding: 0 1.25rem;
    background-color: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

    .projectlens-header[b-h9cwf648vs]  .header-start {
        flex: 0 0 auto;
    }

    .projectlens-header[b-h9cwf648vs]  .header-end {
        flex: 0 0 auto;
    }

    .projectlens-header[b-h9cwf648vs]  .header-title {
        font-size: 1.375rem;
        font-weight: 600;
        color: #1e293b;
        font-style: normal;
    }

    .projectlens-header[b-h9cwf648vs]  .header-toggle {
        color: #475569;
    }

    .projectlens-header[b-h9cwf648vs]  .header-profile {
        min-width: auto;
    }

/* ── Sidebar container ───────────────────────────────────────── */

.projectlens-sidebar[b-h9cwf648vs] {
    --sidebar-blue: #1a56a8;
    --sidebar-blue-dark: #154278;
    --sidebar-blue-light: #2563b8;
    --sidebar-text: rgba(255, 255, 255, 0.88);
    --sidebar-text-muted: rgba(255, 255, 255, 0.55);
    --sidebar-active-bg: rgba(255, 255, 255, 0.16);
    --sidebar-hover-bg: rgba(255, 255, 255, 0.08);
    --sidebar-border: rgba(255, 255, 255, 0.1);
    background: linear-gradient(180deg, var(--sidebar-blue-light) 0%, var(--sidebar-blue) 45%, var(--sidebar-blue-dark) 100%) !important;
    border-right: 1px solid var(--sidebar-border) !important;
    transition: width 0.25s ease;
    overflow: hidden;
}

    .projectlens-sidebar.sidebar-expanded[b-h9cwf648vs] {
        width: 270px !important;
        min-width: 270px !important;
    }

    .projectlens-sidebar.sidebar-collapsed[b-h9cwf648vs] {
        width: 76px !important;
        min-width: 76px !important;
    }

.sidebar-inner[b-h9cwf648vs] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1rem 0 1.25rem;
}

/* ── Brand header ──────────────────────────────────────────────── */

.sidebar-brand[b-h9cwf648vs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0 1.25rem 1.5rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid var(--sidebar-border);
}

.sidebar-collapsed .sidebar-brand[b-h9cwf648vs] {
    justify-content: center;
    padding: 0 0.5rem 1.25rem;
}

.sidebar-brand-logo[b-h9cwf648vs] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

    .sidebar-brand-logo[b-h9cwf648vs]  .rz-icon {
        font-size: 1.5rem;
        color: var(--sidebar-blue);
    }

.sidebar-brand-text[b-h9cwf648vs] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.sidebar-brand-name[b-h9cwf648vs] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.sidebar-brand-tagline[b-h9cwf648vs] {
    font-size: 0.75rem;
    color: var(--sidebar-text-muted);
    line-height: 1.3;
    white-space: nowrap;
}

/* ── Panel menu ────────────────────────────────────────────────── */

.sidebar-menu[b-h9cwf648vs] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.5rem 0;
}

.projectlens-sidebar[b-h9cwf648vs]  .rz-panel-menu {
    background: transparent;
    border: none;
    box-shadow: none;
    width: 100%;
}

.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item {
    border: none;
    background: transparent;
}

.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-link {
    color: var(--sidebar-text);
    font-size: 0.9rem;
    font-weight: 500;
    padding: 0.65rem 1.25rem;
    border-radius: 0;
    transition: background-color 0.15s ease, color 0.15s ease;
}

    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-link:hover {
        background-color: var(--sidebar-hover-bg);
        color: #ffffff;
    }

.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-icon {
    color: var(--sidebar-text-muted);
    font-size: 1.25rem;
    margin-right: 0.75rem;
    transition: color 0.15s ease;
}

.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-link:hover .rz-navigation-item-icon {
    color: #ffffff;
}

.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-text {
    color: inherit;
}

/* Active / expanded parent item — pill highlight */
.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-wrapper-active > .rz-navigation-item-link,
.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-wrapper-expanded > .rz-navigation-item-link {
    background-color: var(--sidebar-active-bg);
    color: #ffffff;
    border-radius: 10px;
    margin: 0 0.75rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-wrapper-active > .rz-navigation-item-link .rz-navigation-item-icon,
    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-wrapper-expanded > .rz-navigation-item-link .rz-navigation-item-icon {
        color: #7dd3fc;
    }

/* Chevron arrows */
.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-toggle {
    color: var(--sidebar-text-muted);
}

.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-wrapper-active .rz-navigation-item-toggle,
.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-item-wrapper-expanded .rz-navigation-item-toggle {
    color: #7dd3fc;
}

/* Sub-menu items */
.projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu {
    background: transparent;
    border: none;
    padding: 0.25rem 0 0.5rem;
}

    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu .rz-navigation-item-link {
        font-size: 0.825rem;
        font-weight: 400;
        color: var(--sidebar-text-muted);
        padding: 0.5rem 1.25rem 0.5rem 2.75rem;
        margin: 0 0.75rem;
        border-radius: 8px;
    }

        .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu .rz-navigation-item-link::before {
            content: "—";
            position: absolute;
            left: 1.75rem;
            color: var(--sidebar-text-muted);
            font-weight: 300;
        }

    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu .rz-navigation-item-link {
        position: relative;
    }

        .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu .rz-navigation-item-link:hover {
            background-color: var(--sidebar-hover-bg);
            color: #ffffff;
        }

    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu .rz-navigation-item-wrapper-active > .rz-navigation-item-link {
        background-color: rgba(255, 255, 255, 0.1);
        color: #ffffff;
    }

    .projectlens-sidebar[b-h9cwf648vs]  .rz-navigation-menu .rz-navigation-item-icon {
        display: none;
    }

/* ── Collapsed (mini) sidebar ──────────────────────────────────── */

.sidebar-collapsed .sidebar-menu[b-h9cwf648vs] {
    padding: 0.5rem 0;
}

.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-item-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    margin: 0.25rem 0.65rem;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    min-width: 44px;
}

.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-item-icon {
    margin-right: 0;
    font-size: 1.35rem;
}

.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-item-text,
.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-item-toggle {
    display: none !important;
}

.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-item-wrapper-active > .rz-navigation-item-link,
.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-item-wrapper-expanded > .rz-navigation-item-link {
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    margin: 0.25rem auto;
    padding: 0.75rem;
}

.sidebar-collapsed[b-h9cwf648vs]  .rz-navigation-menu {
    display: none;
}

/* ── Sidebar footer buttons ────────────────────────────────────── */

.sidebar-footer[b-h9cwf648vs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem 0;
    margin-top: auto;
    border-top: 1px solid var(--sidebar-border);
}

.sidebar-collapsed .sidebar-footer[b-h9cwf648vs] {
    padding: 1rem 0.5rem 0;
}

.sidebar-footer-btn[b-h9cwf648vs] {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

    .sidebar-footer-btn[b-h9cwf648vs]  .rz-button-icon {
        font-size: 1.15rem;
    }

.sidebar-footer-btn-support[b-h9cwf648vs] {
    background-color: #0d9488 !important;
    color: #ffffff !important;
}

    .sidebar-footer-btn-support:hover[b-h9cwf648vs] {
        background-color: #0f766e !important;
    }

.sidebar-footer-btn-cart[b-h9cwf648vs] {
    background-color: #4ade80 !important;
    color: #14532d !important;
}

    .sidebar-footer-btn-cart:hover[b-h9cwf648vs] {
        background-color: #22c55e !important;
    }

/* ── Body & footer ─────────────────────────────────────────────── */

.projectlens-body[b-h9cwf648vs] {
    margin: 0.75rem;
    border-radius: 1rem;
    background-color: #f1f5f9;
}

/* ── Legacy (unused) ───────────────────────────────────────────── */

#blazor-error-ui[b-h9cwf648vs] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-h9cwf648vs] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.pl-main-layout[b-h9cwf648vs] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
    min-width: 0;
    overflow: hidden;
}

.pl-main-layout[b-h9cwf648vs]  .pl-header {
    flex: 0 0 auto;
}

#pl-shell[b-h9cwf648vs] {
    flex: 1 1 0;
    min-width: 0;
    min-height: 0;
}

#pl-shell[b-h9cwf648vs]  .pl-sidebar {
    flex-shrink: 0;
    height: 100%;
    max-height: 100%;
}

/* Wide page content must shrink inside the shell rather than widen it. */
#pl-content[b-h9cwf648vs] {
    flex: 1 1 0;
    min-width: 0;
    min-height: 0;
}

/* Scroll pages here so portaled Radzen popups use the full document viewport. */
#pl-content > main[b-h9cwf648vs] {
    min-width: 0;
    min-height: 0;
    overflow: auto;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-toj9zojx60] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-toj9zojx60] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-toj9zojx60] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-toj9zojx60] {
    font-size: 1.1rem;
}

.bi[b-toj9zojx60] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-toj9zojx60] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-toj9zojx60] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-toj9zojx60] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-toj9zojx60] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-toj9zojx60] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-toj9zojx60] {
        padding-bottom: 1rem;
    }

    .nav-item[b-toj9zojx60]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-toj9zojx60]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-toj9zojx60]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-toj9zojx60] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-toj9zojx60] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-toj9zojx60] {
        display: none;
    }

    .nav-scrollable[b-toj9zojx60] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-qq7cue92fg],
.components-reconnect-repeated-attempt-visible[b-qq7cue92fg],
.components-reconnect-failed-visible[b-qq7cue92fg],
.components-pause-visible[b-qq7cue92fg],
.components-resume-failed-visible[b-qq7cue92fg],
.components-rejoining-animation[b-qq7cue92fg] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-retrying[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-failed[b-qq7cue92fg],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-qq7cue92fg] {
    display: block;
}


#components-reconnect-modal[b-qq7cue92fg] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-qq7cue92fg 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-qq7cue92fg 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-qq7cue92fg 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-qq7cue92fg]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-qq7cue92fg 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-qq7cue92fg {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-qq7cue92fg {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-qq7cue92fg {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-qq7cue92fg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-qq7cue92fg] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-qq7cue92fg] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-qq7cue92fg] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-qq7cue92fg] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-qq7cue92fg] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-qq7cue92fg] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-qq7cue92fg 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-qq7cue92fg] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-qq7cue92fg {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Layout/Sidebar.razor.rz.scp.css */
.pl-sidebar[b-obau6msdev] {
    --pl-sidebar-wide: 264px;
    --pl-sidebar-narrow: 76px;
    --pl-sidebar-bg: #09111f;
    --pl-sidebar-bg-soft: #111b31;
    --pl-sidebar-panel: rgba(255, 255, 255, .055);
    --pl-sidebar-line: rgba(255, 255, 255, .09);
    --pl-sidebar-text: rgba(255, 255, 255, .72);
    --pl-sidebar-muted: rgba(255, 255, 255, .42);
    --pl-sidebar-strong: #f8fafc;
    --pl-sidebar-indigo: #6366f1;
    --pl-sidebar-cyan: #22d3ee;
    --pl-sidebar-success: #34d399;
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    width: var(--pl-sidebar-wide);
    min-width: var(--pl-sidebar-wide);
    height: 100vh;
    max-height: 100vh;
    overflow: hidden;
    color: var(--pl-sidebar-text);
    background: radial-gradient(circle at 12% 4%, rgba(99, 102, 241, .2), transparent 26%), linear-gradient(180deg, var(--pl-sidebar-bg) 0%, var(--pl-sidebar-bg-soft) 100%);
    border-right: 1px solid var(--pl-sidebar-line);
    box-shadow: 18px 0 42px -34px rgba(2, 6, 23, .95);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
    transition: width .24s cubic-bezier(.16, 1, .3, 1), min-width .24s cubic-bezier(.16, 1, .3, 1);
}

    .pl-sidebar[b-obau6msdev]::before {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 2px;
        background: linear-gradient(90deg, var(--pl-sidebar-indigo), var(--pl-sidebar-cyan));
    }

    .pl-sidebar.sidebar-collapsed[b-obau6msdev] {
        width: var(--pl-sidebar-narrow);
        min-width: var(--pl-sidebar-narrow);
    }

.pl-sidebar__brand[b-obau6msdev] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 76px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--pl-sidebar-line);
}

.pl-sidebar__mark[b-obau6msdev] {
    display: block;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.pl-sidebar__brand-copy[b-obau6msdev] {
    display: grid;
    min-width: 0;
    line-height: 1.2;
    white-space: nowrap;
}

    .pl-sidebar__brand-copy strong[b-obau6msdev] {
        color: var(--pl-sidebar-strong);
        font-size: .98rem;
        font-weight: 720;
    }

    .pl-sidebar__brand-copy small[b-obau6msdev] {
        margin-top: 4px;
        color: var(--pl-sidebar-muted);
        font-size: .67rem;
    }

.pl-sidebar__main[b-obau6msdev] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 18px 12px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .16) transparent;
}

.pl-sidebar__section-label[b-obau6msdev] {
    margin: 0 10px 9px;
    color: var(--pl-sidebar-muted);
    font-size: .61rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.pl-sidebar__nav[b-obau6msdev] {
    gap: 5px;
}

[b-obau6msdev] .pl-sidebar__link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 0 12px;
    overflow: visible;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--pl-sidebar-text);
    text-decoration: none;
    white-space: nowrap;
    transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}

    .pl-sidebar__link:hover[b-obau6msdev] {
        color: var(--pl-sidebar-strong);
        background: rgba(255, 255, 255, .065);
        border-color: rgba(255, 255, 255, .06);
        transform: translateX(2px);
    }

    .pl-sidebar__link:focus-visible[b-obau6msdev] {
        outline: 2px solid var(--pl-sidebar-cyan);
        outline-offset: 2px;
    }

    .pl-sidebar__link.is-active[b-obau6msdev] {
        color: var(--pl-sidebar-strong);
        border-color: rgba(99, 102, 241, .34);
        background: linear-gradient(90deg, rgba(99, 102, 241, .22), rgba(34, 211, 238, .08));
        box-shadow: inset 3px 0 0 var(--pl-sidebar-cyan);
    }

.pl-sidebar__icon[b-obau6msdev] {
    display: grid;
    place-items: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    color: rgba(255, 255, 255, .53);
}

    .pl-sidebar__icon .material-icons[b-obau6msdev] {
        font-size: 20px;
    }

.pl-sidebar__link:hover .pl-sidebar__icon[b-obau6msdev],
.pl-sidebar__link.is-active .pl-sidebar__icon[b-obau6msdev] {
    color: var(--pl-sidebar-cyan);
}

.pl-sidebar__text[b-obau6msdev] {
    overflow: hidden;
    flex: 1;
    text-overflow: ellipsis;
    font-size: .84rem;
    font-weight: 570;
}

.pl-sidebar__active-dot[b-obau6msdev] {
    width: 5px;
    height: 5px;
    flex: none;
    border-radius: 50%;
    background: var(--pl-sidebar-cyan);
    box-shadow: 0 0 0 4px rgba(34, 211, 238, .1);
}

.pl-sidebar__workspace[b-obau6msdev] {
    margin: 22px 2px 0;
    padding: 14px;
    border: 1px solid var(--pl-sidebar-line);
    border-radius: 8px;
    background: var(--pl-sidebar-panel);
}

.pl-sidebar__workspace-head[b-obau6msdev],
.pl-sidebar__workspace-meta[b-obau6msdev] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pl-sidebar__workspace-head[b-obau6msdev] {
    color: var(--pl-sidebar-strong);
    font-size: .75rem;
}

    .pl-sidebar__workspace-head .material-icons[b-obau6msdev] {
        color: var(--pl-sidebar-cyan);
        font-size: 17px;
    }

    .pl-sidebar__workspace-head strong[b-obau6msdev] {
        margin-right: auto;
    }

    .pl-sidebar__workspace-head span:last-child[b-obau6msdev] {
        color: var(--pl-sidebar-muted);
        font-size: .67rem;
    }

.pl-sidebar__progress[b-obau6msdev] {
    height: 5px;
    margin: 12px 0 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
}

    .pl-sidebar__progress span[b-obau6msdev] {
        display: block;
        width: 68%;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, var(--pl-sidebar-indigo), var(--pl-sidebar-cyan));
        transform-origin: left;
        animation: pl-sidebar-progress-b-obau6msdev .7s cubic-bezier(.16, 1, .3, 1) both;
    }

.pl-sidebar__workspace-meta[b-obau6msdev] {
    color: var(--pl-sidebar-muted);
    font-size: .65rem;
}

.pl-sidebar__footer[b-obau6msdev] {
    flex: none;
    padding: 13px 14px 16px;
    border-top: 1px solid var(--pl-sidebar-line);
}

.pl-sidebar__status[b-obau6msdev] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 0 10px;
    border-radius: 8px;
    color: var(--pl-sidebar-muted);
    background: rgba(255, 255, 255, .035);
    font-size: .69rem;
    white-space: nowrap;
}

.pl-sidebar__status-dot[b-obau6msdev] {
    width: 7px;
    height: 7px;
    flex: none;
    border-radius: 50%;
    background: var(--pl-sidebar-success);
    box-shadow: 0 0 0 4px rgba(52, 211, 153, .1);
}

.sidebar-collapsed .pl-sidebar__brand[b-obau6msdev] {
    justify-content: center;
    padding-inline: 0;
}

.sidebar-collapsed .pl-sidebar__brand-copy[b-obau6msdev],
.sidebar-collapsed .pl-sidebar__section-label[b-obau6msdev],
.sidebar-collapsed .pl-sidebar__text[b-obau6msdev],
.sidebar-collapsed .pl-sidebar__active-dot[b-obau6msdev],
.sidebar-collapsed .pl-sidebar__workspace[b-obau6msdev],
.sidebar-collapsed .pl-sidebar__status span:last-child[b-obau6msdev] {
    display: none;
}

.sidebar-collapsed .pl-sidebar__main[b-obau6msdev] {
    padding-inline: 10px;
}

.sidebar-collapsed .pl-sidebar__link[b-obau6msdev] {
    justify-content: center;
    padding: 0;
}

    .sidebar-collapsed .pl-sidebar__link:hover[b-obau6msdev] {
        transform: none;
    }

    .sidebar-collapsed .pl-sidebar__link[b-obau6msdev]::after {
        content: attr(data-label);
        position: absolute;
        z-index: 1000;
        left: calc(100% + 12px);
        top: 50%;
        padding: 7px 10px;
        border: 1px solid rgba(255, 255, 255, .1);
        border-radius: 6px;
        color: var(--pl-sidebar-strong);
        background: #111827;
        box-shadow: 0 10px 30px -14px rgba(2, 6, 23, .9);
        font-size: .72rem;
        font-weight: 600;
        pointer-events: none;
        opacity: 0;
        transform: translate(4px, -50%);
        transition: opacity .16s ease, transform .16s ease;
    }

    .sidebar-collapsed .pl-sidebar__link:hover[b-obau6msdev]::after,
    .sidebar-collapsed .pl-sidebar__link:focus-visible[b-obau6msdev]::after {
        opacity: 1;
        transform: translate(0, -50%);
    }

.sidebar-collapsed .pl-sidebar__footer[b-obau6msdev] {
    padding-inline: 10px;
}

.sidebar-collapsed .pl-sidebar__status[b-obau6msdev] {
    justify-content: center;
    padding: 0;
}

@keyframes pl-sidebar-progress-b-obau6msdev {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}

@media (max-width: 720px) {
    .pl-sidebar[b-obau6msdev] {
        --pl-sidebar-wide: 240px;
        --pl-sidebar-narrow: 68px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-sidebar[b-obau6msdev],
    .pl-sidebar *[b-obau6msdev],
    .pl-sidebar *[b-obau6msdev]::before,
    .pl-sidebar *[b-obau6msdev]::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }
}
/* /Components/Pages/Atlas.razor.rz.scp.css */
/* Collocated Blazor CSS. Place alongside CopilotTest.razor.
   The original sidebar palette is represented by semantic OKLCH tokens.
   If your app layout already includes a sidebar, hide .atlas-sidebar and set
   .atlas { grid-template-columns: minmax(0, 1fr); } to avoid duplicating it. */
.atlas[b-rekdf37oo7] {
    --atlas-bg: oklch(1 0 0);
    --atlas-fg: oklch(.235 .026 258);
    --atlas-muted: oklch(.505 .019 258);
    --atlas-subtle: oklch(.973 .004 258);
    --atlas-border: oklch(.915 .010 258);
    --atlas-primary: oklch(.177 .031 259);
    --atlas-primary-soft: oklch(.225 .043 265);
    --atlas-on-primary: oklch(.985 .004 258);
    --atlas-sidebar-muted: oklch(.66 .025 259);
    --atlas-sidebar-text: oklch(.84 .018 259);
    --atlas-cyan: oklch(.797 .133 211);
    --atlas-cyan-soft: oklch(.958 .027 211);
    --atlas-risk: oklch(.58 .133 57);
    --atlas-risk-soft: oklch(.97 .023 74);
    --atlas-note: oklch(.51 .095 160);
    --atlas-note-soft: oklch(.963 .020 160);
    --atlas-error: oklch(.51 .17 28);
    --atlas-error-soft: oklch(.973 .013 28);
    --atlas-focus: oklch(.62 .118 226);
    --atlas-shadow: 0 5px 25px oklch(.177 .031 259 / .045);
    --atlas-sidebar-line: oklch(.985 .004 258 / .10);
    --atlas-sidebar-panel: oklch(.985 .004 258 / .065);
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    width: 100%;
    height: calc(100dvh - var(--atlas-shell-height, 0px));
    min-height: 580px;
    overflow: hidden;
    background: var(--atlas-bg);
    color: var(--atlas-fg);
    font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0;
    -webkit-font-smoothing: antialiased;
}

    .atlas *[b-rekdf37oo7], .atlas *[b-rekdf37oo7]::before, .atlas *[b-rekdf37oo7]::after {
        box-sizing: border-box;
    }

    .atlas button[b-rekdf37oo7], .atlas textarea[b-rekdf37oo7] {
        font: inherit;
    }

    .atlas button[b-rekdf37oo7] {
        cursor: pointer;
    }

        .atlas button:disabled[b-rekdf37oo7] {
            cursor: not-allowed;
            opacity: .45;
        }

        .atlas button:focus-visible[b-rekdf37oo7], .atlas a:focus-visible[b-rekdf37oo7], .atlas-transcript:focus-visible[b-rekdf37oo7] {
            outline: 2px solid var(--atlas-focus);
            outline-offset: 4px;
        }

.atlas-icon[b-rekdf37oo7] {
    display: block;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.atlas-logo[b-rekdf37oo7] {
    display: block;
    width: 100%;
    height: 100%;
}

.atlas-logo-orbit[b-rekdf37oo7] {
    stroke: var(--atlas-cyan);
}

.atlas-logo-node[b-rekdf37oo7] {
    fill: var(--atlas-cyan);
}

.atlas-sidebar[b-rekdf37oo7] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 32px 18px 20px;
    background: var(--atlas-primary);
    color: var(--atlas-sidebar-text);
    border-right: 1px solid var(--atlas-sidebar-line);
}

.atlas-brand[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 10px;
    color: var(--atlas-on-primary);
    text-decoration: none;
}

.atlas-brand-mark[b-rekdf37oo7] {
    display: block;
    width: 42px;
    height: 42px;
}

.atlas-brand strong[b-rekdf37oo7] {
    display: block;
    font-size: 28px;
    font-weight: 650;
    line-height: 1.2;
}

.atlas-brand-dot[b-rekdf37oo7] {
    color: var(--atlas-cyan);
}

.atlas-brand small[b-rekdf37oo7] {
    display: block;
    margin-top: 3px;
    font-size: 9px;
    letter-spacing: 1.6px;
    color: var(--atlas-sidebar-muted);
}

.atlas-new-chat[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    margin: 38px 0 28px;
    padding: 12px 10px;
    border: 1px solid var(--atlas-sidebar-line);
    border-radius: 6px;
    color: var(--atlas-on-primary);
    background: var(--atlas-primary-soft);
    font-weight: 500;
    transition: background .2s, border-color .2s;
}

    .atlas-new-chat:hover:not(:disabled)[b-rekdf37oo7] {
        background: var(--atlas-sidebar-panel);
        border-color: var(--atlas-cyan);
    }

    .atlas-new-chat .atlas-icon[b-rekdf37oo7] {
        color: var(--atlas-cyan);
        width: 18px;
        height: 18px;
    }

.atlas-history[b-rekdf37oo7] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.atlas-section-label[b-rekdf37oo7] {
    margin: 0 12px 13px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.3px;
    color: var(--atlas-sidebar-muted);
}

.atlas-conversation[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px;
    margin-bottom: 5px;
    text-align: left;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: var(--atlas-sidebar-text);
}

    .atlas-conversation span[b-rekdf37oo7] {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 13px;
    }

    .atlas-conversation .atlas-icon[b-rekdf37oo7] {
        width: 17px;
        height: 17px;
        color: var(--atlas-sidebar-muted);
    }

    .atlas-conversation:hover:not(:disabled)[b-rekdf37oo7], .atlas-conversation.is-active[b-rekdf37oo7] {
        background: var(--atlas-sidebar-panel);
        color: var(--atlas-on-primary);
    }

        .atlas-conversation.is-active .atlas-icon[b-rekdf37oo7] {
            color: var(--atlas-cyan);
        }

.atlas-sidebar-footer[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 20px;
    padding: 20px 10px 0;
    border-top: 1px solid var(--atlas-sidebar-line);
}

.atlas-workspace-icon[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--atlas-sidebar-line);
    border-radius: 6px;
}

.atlas-sidebar-footer strong[b-rekdf37oo7] {
    display: block;
    font-size: 12px;
    color: var(--atlas-on-primary);
    font-weight: 500;
}

.atlas-sidebar-footer small[b-rekdf37oo7] {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    color: var(--atlas-sidebar-muted);
}

.atlas-main[b-rekdf37oo7] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.atlas-header[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    gap: 16px;
    min-height: 76px;
    padding: 18px 34px;
    border-bottom: 1px solid var(--atlas-border);
}

.atlas-header-title[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

    .atlas-header-title strong[b-rekdf37oo7] {
        font-size: 16px;
        font-weight: 650;
    }

    .atlas-header-title > span:last-child[b-rekdf37oo7] {
        font-size: 12px;
        color: var(--atlas-muted);
    }

.atlas-header-divider[b-rekdf37oo7] {
    width: 1px;
    height: 16px;
    background: var(--atlas-border);
}

.atlas-mobile-mark[b-rekdf37oo7] {
    display: none;
}

.atlas-status[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-shrink: 0;
    font-size: 11px;
    color: var(--atlas-muted);
}

    .atlas-status i[b-rekdf37oo7] {
        display: block;
        width: 6px;
        height: 6px;
        background: var(--atlas-note);
        border-radius: 50%;
    }

.atlas-transcript[b-rekdf37oo7] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--atlas-border) transparent;
    padding: 30px 36px;
}

.atlas-welcome[b-rekdf37oo7] {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    padding: 36px 0 22px;
    text-align: center;
}

.atlas-welcome-mark[b-rekdf37oo7] {
    display: block;
    width: 70px;
    height: 70px;
    padding: 10px;
    margin: 0 auto 22px;
    border: 1px solid var(--atlas-border);
    border-radius: 18px;
    background: var(--atlas-bg);
    color: var(--atlas-primary);
    box-shadow: var(--atlas-shadow);
}

.atlas-eyebrow[b-rekdf37oo7] {
    margin: 0 0 14px;
    color: var(--atlas-muted);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.7px;
}

.atlas-welcome h1[b-rekdf37oo7] {
    margin: 0;
    font-size: 44px;
    line-height: 1.19;
    font-weight: 600;
    letter-spacing: 0;
}

    .atlas-welcome h1 span[b-rekdf37oo7] {
        color: var(--atlas-muted);
    }

.atlas-welcome-description[b-rekdf37oo7] {
    margin: 20px 0 0;
    color: var(--atlas-muted);
    font-size: 14px;
}

.atlas-suggestions[b-rekdf37oo7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 38px;
    text-align: left;
}

.atlas-suggestion[b-rekdf37oo7] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
    padding: 19px 17px 32px;
    border: 1px solid var(--atlas-border);
    border-radius: 8px;
    background: var(--atlas-bg);
    color: var(--atlas-fg);
    text-align: left;
    transition: border-color .2s, box-shadow .2s;
}

    .atlas-suggestion:hover[b-rekdf37oo7] {
        border-color: var(--atlas-focus);
        box-shadow: var(--atlas-shadow);
    }

.atlas-suggestion-icon[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin-bottom: 7px;
    border-radius: 7px;
    color: var(--atlas-focus);
    background: var(--atlas-cyan-soft);
}

.atlas-suggestion-icon--risk[b-rekdf37oo7] {
    color: var(--atlas-risk);
    background: var(--atlas-risk-soft);
}

.atlas-suggestion-icon--note[b-rekdf37oo7] {
    color: var(--atlas-note);
    background: var(--atlas-note-soft);
}

.atlas-suggestion strong[b-rekdf37oo7] {
    font-weight: 600;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.atlas-suggestion > span:not(.atlas-suggestion-icon):not(.atlas-suggestion-arrow)[b-rekdf37oo7] {
    font-size: 11px;
    line-height: 1.6;
    color: var(--atlas-muted);
}

.atlas-suggestion-arrow[b-rekdf37oo7] {
    position: absolute;
    bottom: 14px;
    right: 15px;
    color: var(--atlas-muted);
}

    .atlas-suggestion-arrow .atlas-icon[b-rekdf37oo7] {
        width: 16px;
        height: 16px;
    }

.atlas-thread[b-rekdf37oo7] {
    max-width: 760px;
    margin: 0 auto;
}

.atlas-message[b-rekdf37oo7] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 24px 0;
}

    .atlas-message + .atlas-message[b-rekdf37oo7] {
        border-top: 1px solid var(--atlas-border);
    }

.atlas-avatar[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 1px solid var(--atlas-border);
    border-radius: 8px;
    color: var(--atlas-primary);
    background: var(--atlas-bg);
}

    .atlas-avatar .atlas-logo[b-rekdf37oo7] {
        width: 30px;
        height: 30px;
    }

.atlas-message-body[b-rekdf37oo7] {
    min-width: 0;
    flex: 1;
}

.atlas-message-head[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 5px 0 12px;
}

    .atlas-message-head strong[b-rekdf37oo7] {
        font-size: 13px;
        font-weight: 650;
    }

    .atlas-message-head time[b-rekdf37oo7] {
        font-size: 10px;
        color: var(--atlas-muted);
    }

.atlas-message-text[b-rekdf37oo7] {
    margin: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    line-height: 1.85;
    font-size: 14px;
}

.atlas-message--user .atlas-avatar[b-rekdf37oo7] {
    background: var(--atlas-subtle);
    color: var(--atlas-muted);
}

.atlas-message--user .atlas-message-text[b-rekdf37oo7] {
    display: block;
    width: fit-content;
    max-width: 100%;
    padding: 12px 16px;
    border-radius: 0 8px 8px 8px;
    background: var(--atlas-primary);
    color: var(--atlas-on-primary);
}

.atlas-message--error .atlas-message-text[b-rekdf37oo7] {
    color: var(--atlas-error);
}

.atlas-message-action[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 15px;
    padding: 5px 0;
    border: 0;
    background: transparent;
    color: var(--atlas-muted);
    font-size: 11px;
}

    .atlas-message-action:hover[b-rekdf37oo7] {
        color: var(--atlas-fg);
    }

    .atlas-message-action .atlas-icon[b-rekdf37oo7] {
        width: 14px;
        height: 14px;
        flex-basis: 14px;
    }

.atlas-pending[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--atlas-muted);
    font-size: 12px;
    min-height: 32px;
}

.atlas-dots[b-rekdf37oo7] {
    display: flex;
    gap: 4px;
}

    .atlas-dots i[b-rekdf37oo7] {
        width: 4px;
        height: 4px;
        background: var(--atlas-muted);
        border-radius: 50%;
        animation: atlas-pulse-b-rekdf37oo7 1.4s ease-in-out infinite;
    }

        .atlas-dots i:nth-child(2)[b-rekdf37oo7] {
            animation-delay: .16s;
        }

        .atlas-dots i:nth-child(3)[b-rekdf37oo7] {
            animation-delay: .32s;
        }

.atlas-compose-area[b-rekdf37oo7] {
    position: relative;
    flex-shrink: 0;
    width: 100%;
    max-width: 832px;
    padding: 16px 36px 10px;
    margin: 0 auto;
    background: var(--atlas-bg);
}

.atlas-composer[b-rekdf37oo7] {
    border: 1px solid var(--atlas-border);
    border-radius: 8px;
    background: var(--atlas-bg);
    box-shadow: var(--atlas-shadow);
    transition: border-color .2s;
    overflow: hidden;
}

    .atlas-composer:focus-within[b-rekdf37oo7] {
        border-color: var(--atlas-focus);
    }

    .atlas-composer textarea[b-rekdf37oo7] {
        display: block;
        width: 100%;
        min-height: 58px;
        max-height: 180px;
        padding: 18px 18px 10px;
        resize: none;
        outline: none;
        border: none;
        background: transparent;
        color: var(--atlas-fg);
        line-height: 1.6;
    }

        .atlas-composer textarea[b-rekdf37oo7]::placeholder {
            color: var(--atlas-muted);
        }

        .atlas-composer textarea:disabled[b-rekdf37oo7] {
            opacity: .6;
        }

.atlas-composer-footer[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 12px 12px 18px;
}

.atlas-composer-label[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 10px;
    color: var(--atlas-muted);
}

    .atlas-composer-label .atlas-icon[b-rekdf37oo7] {
        width: 14px;
        height: 14px;
        flex-basis: 14px;
    }

.atlas-send[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: none;
    border-radius: 6px;
    background: var(--atlas-primary);
    color: var(--atlas-on-primary);
    transition: background .2s;
}

    .atlas-send:hover:not(:disabled)[b-rekdf37oo7] {
        background: var(--atlas-primary-soft);
    }

    .atlas-send:disabled[b-rekdf37oo7] {
        opacity: 1;
        background: var(--atlas-subtle);
        color: var(--atlas-muted);
    }

    .atlas-send .atlas-icon[b-rekdf37oo7] {
        width: 18px;
        height: 18px;
    }

.atlas-disclaimer[b-rekdf37oo7] {
    margin: 12px 0 0;
    text-align: center;
    font-size: 10px;
    color: var(--atlas-muted);
}

.atlas-feedback[b-rekdf37oo7] {
    min-height: 18px;
    text-align: center;
    font-size: 10px;
    color: var(--atlas-note);
}

.atlas-scroll-bottom[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    position: absolute;
    top: -34px;
    left: calc(50% - 17px);
    width: 34px;
    height: 34px;
    border: 1px solid var(--atlas-border);
    border-radius: 50%;
    background: var(--atlas-bg);
    color: var(--atlas-fg);
    box-shadow: var(--atlas-shadow);
}

    .atlas-scroll-bottom[hidden][b-rekdf37oo7] {
        display: none;
    }

@keyframes atlas-pulse-b-rekdf37oo7 {
    0%, 80%, 100% {
        opacity: .35;
        transform: translateY(0);
    }

    40% {
        opacity: 1;
        transform: translateY(-3px);
    }
}

@media (min-height: 900px) and (min-width: 761px) {
    .atlas-welcome[b-rekdf37oo7] {
        padding-top: 100px;
    }
}

@media (max-width: 1100px) {
    .atlas[b-rekdf37oo7] {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .atlas-transcript[b-rekdf37oo7] {
        padding-inline: 24px;
    }

    .atlas-compose-area[b-rekdf37oo7] {
        padding-inline: 24px;
    }

    .atlas-suggestion[b-rekdf37oo7] {
        padding-inline: 12px;
    }
}

@media (max-width: 760px) {
    .atlas[b-rekdf37oo7] {
        grid-template-columns: minmax(0, 1fr);
        min-height: 480px;
    }

    .atlas-sidebar[b-rekdf37oo7] {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
        padding: 12px 18px;
        min-height: 65px;
    }

    .atlas-brand[b-rekdf37oo7] {
        padding: 0;
        gap: 8px;
    }

    .atlas-brand-mark[b-rekdf37oo7] {
        width: 30px;
        height: 30px;
    }

    .atlas-brand strong[b-rekdf37oo7] {
        font-size: 22px;
    }

    .atlas-brand small[b-rekdf37oo7] {
        display: none;
    }

    .atlas-new-chat[b-rekdf37oo7] {
        width: auto;
        margin: 0 0 0 auto;
        padding: 8px 10px;
        font-size: 11px;
    }

        .atlas-new-chat .atlas-icon[b-rekdf37oo7] {
            width: 16px;
            height: 16px;
            flex-basis: 16px;
        }

    .atlas-history[b-rekdf37oo7], .atlas-sidebar-footer[b-rekdf37oo7] {
        display: none;
    }

    .atlas[b-rekdf37oo7] {
        grid-template-rows: auto minmax(0, 1fr);
    }

    .atlas-header[b-rekdf37oo7] {
        min-height: 56px;
        padding: 14px 20px;
        gap: 8px;
    }

    .atlas-header-title[b-rekdf37oo7] {
        gap: 10px;
    }

        .atlas-header-title strong[b-rekdf37oo7] {
            font-size: 13px;
        }

        .atlas-header-title > span:last-child[b-rekdf37oo7] {
            font-size: 11px;
        }

    .atlas-status[b-rekdf37oo7] {
        font-size: 10px;
    }

    .atlas-transcript[b-rekdf37oo7] {
        padding: 20px;
    }

    .atlas-welcome[b-rekdf37oo7] {
        padding: 16px 0 10px;
    }

    .atlas-welcome-mark[b-rekdf37oo7] {
        width: 55px;
        height: 55px;
        margin-bottom: 18px;
        padding: 6px;
        border-radius: 14px;
    }

    .atlas-eyebrow[b-rekdf37oo7] {
        font-size: 9px;
        letter-spacing: 1.1px;
    }

    .atlas-welcome h1[b-rekdf37oo7] {
        font-size: 34px;
    }

    .atlas-welcome-description[b-rekdf37oo7] {
        font-size: 12px;
        margin-top: 15px;
    }

    .atlas-suggestions[b-rekdf37oo7] {
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
        margin-top: 24px;
    }

    .atlas-suggestion[b-rekdf37oo7] {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr) 16px;
        column-gap: 12px;
        row-gap: 2px;
        padding: 12px;
    }

    .atlas-suggestion-icon[b-rekdf37oo7] {
        grid-row: span 2;
        margin: 0;
    }

    .atlas-suggestion strong[b-rekdf37oo7] {
        font-size: 12px;
    }

    .atlas-suggestion > span:not(.atlas-suggestion-icon):not(.atlas-suggestion-arrow)[b-rekdf37oo7] {
        grid-column: 2;
        font-size: 10px;
    }

    .atlas-suggestion-arrow[b-rekdf37oo7] {
        position: static;
        grid-column: 3;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .atlas-compose-area[b-rekdf37oo7] {
        padding: 10px 16px max(5px, env(safe-area-inset-bottom));
    }

    .atlas-composer textarea[b-rekdf37oo7] {
        font-size: 16px;
        padding: 14px 14px 8px;
        min-height: 52px;
    }

    .atlas-composer-footer[b-rekdf37oo7] {
        padding-left: 14px;
    }

    .atlas-disclaimer[b-rekdf37oo7] {
        font-size: 9px;
        margin-top: 9px;
    }

    .atlas-message[b-rekdf37oo7] {
        gap: 10px;
        padding: 18px 0;
    }

    .atlas-message-text[b-rekdf37oo7] {
        font-size: 13px;
    }
}

@media (max-width: 380px) {
    .atlas-header-title > span:last-child[b-rekdf37oo7], .atlas-header-divider[b-rekdf37oo7] {
        display: none;
    }

    .atlas-welcome h1[b-rekdf37oo7] {
        font-size: 30px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .atlas *[b-rekdf37oo7], .atlas *[b-rekdf37oo7]::before, .atlas *[b-rekdf37oo7]::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}


/* =========================================
   Atlas task results — compact card layout
   ========================================= */

.atlas-task-list[b-rekdf37oo7] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    margin-top: 14px;
}

.atlas-task-card[b-rekdf37oo7] {
    min-width: 0;
    padding: 16px 18px;
    border: 1px solid var(--atlas-border);
    border-radius: 9px;
    background: var(--atlas-bg);
    box-shadow: 0 2px 8px oklch(.177 .031 259 / .035);
}

.atlas-task-card-header[b-rekdf37oo7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--atlas-border);
}

.atlas-task-label[b-rekdf37oo7] {
    display: block;
    margin-bottom: 3px;
    color: var(--atlas-muted);
    font-size: 9px;
    font-weight: 650;
    letter-spacing: 1.1px;
}

.atlas-task-card-header h3[b-rekdf37oo7] {
    margin: 0;
    color: var(--atlas-fg);
    font-size: 15px;
    line-height: 1.4;
    font-weight: 650;
    overflow-wrap: anywhere;
}

.atlas-task-phase[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 4px 9px;
    border: 1px solid var(--atlas-border);
    border-radius: 5px;
    background: var(--atlas-subtle);
    color: var(--atlas-muted);
    font-size: 11px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

/* Planned and actual dates */

.atlas-task-dates[b-rekdf37oo7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 13px 0;
    border-bottom: 1px solid var(--atlas-border);
}

    .atlas-task-dates > div[b-rekdf37oo7],
    .atlas-task-effort > div[b-rekdf37oo7] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        min-width: 0;
    }

        .atlas-task-dates > div > span[b-rekdf37oo7],
        .atlas-task-effort > div > span[b-rekdf37oo7] {
            color: var(--atlas-muted);
            font-size: 10px;
            line-height: 1.4;
        }

    .atlas-task-dates strong[b-rekdf37oo7] {
        color: var(--atlas-fg);
        font-size: 12px;
        line-height: 1.55;
        font-weight: 550;
        overflow-wrap: anywhere;
    }

/* Effort summary */

.atlas-task-effort[b-rekdf37oo7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid var(--atlas-border);
}

    .atlas-task-effort strong[b-rekdf37oo7] {
        color: var(--atlas-fg);
        font-size: 14px;
        line-height: 1.45;
        font-weight: 650;
        font-variant-numeric: tabular-nums;
        overflow-wrap: anywhere;
    }

    .atlas-task-effort .atlas-effort-over[b-rekdf37oo7] {
        color: var(--atlas-error);
    }

    .atlas-task-effort .atlas-effort-under[b-rekdf37oo7] {
        color: var(--atlas-note);
    }

    .atlas-task-effort .atlas-effort-neutral[b-rekdf37oo7] {
        color: var(--atlas-muted);
        font-weight: 550;
    }

/* Status and reviewer information */

.atlas-task-meta[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    padding-top: 12px;
    color: var(--atlas-muted);
    font-size: 10px;
}

    .atlas-task-meta > span[b-rekdf37oo7] {
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: 3px 8px;
        border: 1px solid var(--atlas-border);
        border-radius: 5px;
        background: var(--atlas-subtle);
        line-height: 1.4;
    }

    .atlas-task-meta > .atlas-task-status[b-rekdf37oo7] {
        border-color: transparent;
        font-weight: 600;
    }

.atlas-task-status.atlas-status-not-started[b-rekdf37oo7] {
    background: var(--atlas-subtle);
    color: var(--atlas-muted);
}

.atlas-task-status.atlas-status-in-progress[b-rekdf37oo7] {
    background: var(--atlas-cyan-soft);
    color: var(--atlas-focus);
}

.atlas-task-status.atlas-status-completed[b-rekdf37oo7] {
    background: var(--atlas-note-soft);
    color: var(--atlas-note);
}

.atlas-task-status.atlas-status-on-hold[b-rekdf37oo7] {
    background: var(--atlas-risk-soft);
    color: var(--atlas-risk);
}

.atlas-task-status.atlas-status-cancelled[b-rekdf37oo7],
.atlas-task-status.atlas-status-unknown[b-rekdf37oo7] {
    background: var(--atlas-error-soft);
    color: var(--atlas-error);
}

/* Schedule variance */

.atlas-task-variance[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    margin-top: 10px;
    padding: 5px 9px;
    border: 1px solid var(--atlas-border);
    border-radius: 5px;
    background: var(--atlas-subtle);
    color: var(--atlas-muted);
    font-size: 11px;
    line-height: 1.4;
    font-weight: 600;
}

/* Remarks */

.atlas-task-remark[b-rekdf37oo7] {
    margin-top: 10px;
    padding: 10px 12px;
    border-left: 3px solid var(--atlas-border);
    border-radius: 0 5px 5px 0;
    background: var(--atlas-subtle);
}

    .atlas-task-remark > span[b-rekdf37oo7] {
        display: block;
        margin-bottom: 3px;
        color: var(--atlas-muted);
        font-size: 9px;
        font-weight: 650;
        letter-spacing: .8px;
        text-transform: uppercase;
    }

    .atlas-task-remark p[b-rekdf37oo7] {
        margin: 0;
        color: var(--atlas-fg);
        font-size: 12px;
        line-height: 1.6;
        overflow-wrap: anywhere;
    }

.atlas-task-no-remark[b-rekdf37oo7] {
    margin: 10px 0 0;
    color: var(--atlas-muted);
    font-size: 11px;
    font-style: italic;
}

/* Keep the cards compact on phones */

@media (max-width: 760px) {
    .atlas-task-card[b-rekdf37oo7] {
        padding: 13px;
    }

    .atlas-task-card-header h3[b-rekdf37oo7] {
        font-size: 14px;
    }

    .atlas-task-dates[b-rekdf37oo7] {
        gap: 10px;
        padding: 11px 0;
    }

        .atlas-task-dates strong[b-rekdf37oo7] {
            font-size: 11px;
        }

    .atlas-task-effort[b-rekdf37oo7] {
        gap: 8px;
        padding: 11px 0;
    }

        .atlas-task-effort > div > span[b-rekdf37oo7] {
            font-size: 9px;
        }

        .atlas-task-effort strong[b-rekdf37oo7] {
            font-size: 12px;
        }
}


.atlas-task-custom-fields[b-rekdf37oo7] {
    display: grid;
    gap: 7px;
    margin-top: 12px;
    padding-top: 11px;
    border-top: 1px solid var(--atlas-border);
}

.atlas-task-custom-title[b-rekdf37oo7] {
    color: var(--atlas-muted);
    font-size: 10px;
    font-weight: 650;
    text-transform: uppercase;
    letter-spacing: .6px;
}

.atlas-task-custom-field[b-rekdf37oo7] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid var(--atlas-border);
    font-size: 11px;
}

    .atlas-task-custom-field > span[b-rekdf37oo7] {
        color: var(--atlas-muted);
    }

    .atlas-task-custom-field > strong[b-rekdf37oo7] {
        color: var(--atlas-fg);
        font-weight: 550;
        text-align: right;
        overflow-wrap: anywhere;
    }

    .atlas-task-custom-field small[b-rekdf37oo7] {
        color: var(--atlas-muted);
        font-weight: 400;
    }

.atlas-task-table-wrap[b-rekdf37oo7] {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--atlas-border);
    border-radius: 8px;
}

.atlas-task-table[b-rekdf37oo7] {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    text-align: left;
}

    .atlas-task-table th[b-rekdf37oo7],
    .atlas-task-table td[b-rekdf37oo7] {
        padding: 10px 12px;
        border-bottom: 1px solid var(--atlas-border);
        vertical-align: top;
    }

    .atlas-task-table th[b-rekdf37oo7] {
        background: var(--atlas-subtle);
        color: var(--atlas-muted);
        font-weight: 650;
        white-space: nowrap;
    }

    .atlas-task-table td[b-rekdf37oo7] {
        color: var(--atlas-fg);
    }

    .atlas-task-table tbody tr:last-child > td[b-rekdf37oo7] {
        border-bottom: 0;
    }

.atlas-table-custom-field[b-rekdf37oo7] {
    margin-bottom: 4px;
    min-width: 120px;
}

    .atlas-table-custom-field span[b-rekdf37oo7] {
        color: var(--atlas-muted);
    }

.atlas-task-details-button[b-rekdf37oo7],
.atlas-task-pagination button[b-rekdf37oo7] {
    padding: 6px 9px;
    border: 1px solid var(--atlas-border);
    border-radius: 5px;
    background: var(--atlas-bg);
    color: var(--atlas-fg);
    font-size: 11px;
    cursor: pointer;
}

    .atlas-task-details-button:hover[b-rekdf37oo7],
    .atlas-task-pagination button:hover:not(:disabled)[b-rekdf37oo7] {
        background: var(--atlas-subtle);
    }

.atlas-task-expanded[b-rekdf37oo7] {
    padding: 8px 4px;
    min-width: 240px;
}

    .atlas-task-expanded h4[b-rekdf37oo7] {
        margin: 12px 0 5px;
        font-size: 11px;
    }

.atlas-task-expanded-dates[b-rekdf37oo7] {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

    .atlas-task-expanded-dates > div[b-rekdf37oo7] {
        display: grid;
        gap: 4px;
    }

    .atlas-task-expanded-dates span[b-rekdf37oo7] {
        color: var(--atlas-muted);
        font-size: 10px;
    }

    .atlas-task-expanded-dates strong[b-rekdf37oo7] {
        font-size: 11px;
        font-weight: 550;
    }

.atlas-task-pagination[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    color: var(--atlas-muted);
    font-size: 11px;
}

    .atlas-task-pagination > div[b-rekdf37oo7] {
        display: flex;
        gap: 6px;
    }

    .atlas-task-pagination button:disabled[b-rekdf37oo7] {
        opacity: .45;
        cursor: not-allowed;
    }

@media (max-width: 760px) {
    .atlas-task-table[b-rekdf37oo7] {
        min-width: 760px;
    }

    .atlas-task-pagination[b-rekdf37oo7] {
        align-items: flex-start;
        flex-direction: column;
    }
}


@media (max-width: 380px) {
    .atlas-task-dates[b-rekdf37oo7] {
        grid-template-columns: minmax(0, 1fr);
    }

    .atlas-task-effort[b-rekdf37oo7] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* =========================================
   Atlas task results — visual refinement
   ========================================= */

/* Space the result caption from the task cards. */
.atlas-task-list[b-rekdf37oo7] {
    gap: 16px;
    margin-top: 16px;
}

/* Cleaner outer task card. */
.atlas-task-card[b-rekdf37oo7] {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--atlas-border);
    border-radius: 12px;
    background: var(--atlas-bg);
    box-shadow: 0 3px 14px oklch(.177 .031 259 / .045);
    transition: border-color .18s, box-shadow .18s;
}

    .atlas-task-card:hover[b-rekdf37oo7] {
        border-color: oklch(.84 .035 258);
        box-shadow: 0 5px 18px oklch(.177 .031 259 / .065);
    }

/* Task name and metadata. */
.atlas-task-card-header[b-rekdf37oo7] {
    align-items: center;
    gap: 12px;
    padding-bottom: 15px;
}

    .atlas-task-card-header > div[b-rekdf37oo7] {
        flex: 1;
        min-width: 0;
    }

.atlas-task-label[b-rekdf37oo7] {
    margin-bottom: 5px;
    font-size: 9px;
    letter-spacing: 1.4px;
}

.atlas-task-card-header h3[b-rekdf37oo7] {
    font-size: 16px;
    font-weight: 650;
    line-height: 1.4;
    letter-spacing: -.2px;
}

.atlas-task-card-header small[b-rekdf37oo7] {
    display: block;
    margin-top: 4px;
    color: var(--atlas-muted);
    font-size: 10px;
}

/* Phase count becomes a compact pill. */
.atlas-task-phase-count[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 5px 10px;
    border: 1px solid oklch(.89 .035 211);
    border-radius: 999px;
    background: var(--atlas-cyan-soft);
    color: var(--atlas-focus);
    font-size: 10px;
    font-weight: 600;
    white-space: nowrap;
}

/* Each phase gets its own subtle section. */
.atlas-task-phase-section[b-rekdf37oo7] {
    min-width: 0;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--atlas-border);
    border-radius: 9px;
    background: var(--atlas-subtle);
}

.atlas-task-phase-heading[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 2px;
}

    .atlas-task-phase-heading h4[b-rekdf37oo7] {
        min-width: 0;
        margin: 0;
        color: var(--atlas-fg);
        font-size: 13px;
        font-weight: 650;
        line-height: 1.5;
        overflow-wrap: anywhere;
    }

/* Consistent status badges. */
.atlas-task-status[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 4px 9px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

/* Dates and effort use clearer spacing. */
.atlas-task-dates[b-rekdf37oo7] {
    gap: 16px;
    padding: 14px 0;
}

    .atlas-task-dates > div[b-rekdf37oo7],
    .atlas-task-effort > div[b-rekdf37oo7] {
        gap: 5px;
    }

        .atlas-task-dates > div > span[b-rekdf37oo7],
        .atlas-task-effort > div > span[b-rekdf37oo7] {
            font-size: 10px;
            line-height: 1.5;
        }

    .atlas-task-dates strong[b-rekdf37oo7] {
        font-size: 12px;
        font-weight: 600;
        line-height: 1.6;
    }

.atlas-task-effort[b-rekdf37oo7] {
    gap: 12px;
    padding: 14px 0;
}

    .atlas-task-effort strong[b-rekdf37oo7] {
        font-size: 13px;
        font-weight: 650;
    }

/* Custom fields remain readable when values are long. */
.atlas-task-custom-fields[b-rekdf37oo7] {
    gap: 2px;
    margin-top: 14px;
    padding-top: 12px;
}

.atlas-task-custom-title[b-rekdf37oo7] {
    margin-bottom: 4px;
    font-size: 9px;
    letter-spacing: 1px;
}

.atlas-task-custom-field[b-rekdf37oo7] {
    gap: 14px;
    padding: 8px 0;
    font-size: 11px;
    line-height: 1.55;
}

    .atlas-task-custom-field > span[b-rekdf37oo7] {
        flex: 1;
        min-width: 0;
    }

    .atlas-task-custom-field > strong[b-rekdf37oo7] {
        flex: 1;
        min-width: 0;
        font-weight: 600;
        line-height: 1.55;
    }

/* Keep remarks visually distinct without adding heavy color. */
.atlas-task-remark[b-rekdf37oo7] {
    margin-top: 12px;
    padding: 11px 12px;
    border-left-width: 3px;
    border-radius: 0 7px 7px 0;
}

.atlas-task-no-remark[b-rekdf37oo7] {
    margin-top: 12px;
}

/* Smaller screens. */
@media (max-width: 760px) {
    .atlas-task-card[b-rekdf37oo7] {
        padding: 13px;
        border-radius: 10px;
    }

    .atlas-task-card-header h3[b-rekdf37oo7] {
        font-size: 14px;
    }

    .atlas-task-phase-section[b-rekdf37oo7] {
        margin-top: 11px;
        padding: 11px;
    }

    .atlas-task-phase-heading h4[b-rekdf37oo7] {
        font-size: 12px;
    }

    .atlas-task-phase-count[b-rekdf37oo7] {
        padding: 4px 8px;
    }

    .atlas-task-effort[b-rekdf37oo7] {
        gap: 8px;
    }

    .atlas-task-custom-field[b-rekdf37oo7] {
        gap: 8px;
    }
}

@media (max-width: 380px) {
    .atlas-task-dates[b-rekdf37oo7] {
        grid-template-columns: minmax(0, 1fr);
    }

    .atlas-task-effort[b-rekdf37oo7] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* =========================================
   GitHub Copilot connection panel
   ========================================= */

.atlas-github-connection[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px 20px;
    padding: 12px 36px;
    border-bottom: 1px solid var(--atlas-border);
    background: var(--atlas-subtle);
}

.atlas-github-identity[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.atlas-github-mark[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #17212f;
    color: #fff;
}

    .atlas-github-mark svg[b-rekdf37oo7] {
        display: block;
        width: 22px;
        height: 22px;
    }

.atlas-github-copy[b-rekdf37oo7] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

    .atlas-github-copy > strong[b-rekdf37oo7] {
        font-size: 12px;
        font-weight: 650;
    }

    .atlas-github-copy > span[b-rekdf37oo7] {
        color: var(--atlas-muted);
        font-size: 11px;
        overflow-wrap: anywhere;
    }

        .atlas-github-copy > span strong[b-rekdf37oo7] {
            color: var(--atlas-fg);
            font-weight: 600;
        }

.atlas-github-actions[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.atlas-github-status[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--atlas-muted);
    font-size: 11px;
}

    .atlas-github-status.is-connected[b-rekdf37oo7] {
        color: var(--atlas-note);
        font-weight: 600;
    }

    .atlas-github-status i[b-rekdf37oo7] {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: currentColor;
    }

.atlas-github-button[b-rekdf37oo7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid var(--atlas-primary);
    border-radius: 7px;
    background: var(--atlas-primary);
    color: var(--atlas-on-primary);
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background .18s ease, border-color .18s ease;
}

    .atlas-github-button:hover[b-rekdf37oo7] {
        background: var(--atlas-primary-soft);
        border-color: var(--atlas-primary-soft);
        color: var(--atlas-on-primary);
    }

.atlas-github-button--secondary[b-rekdf37oo7] {
    border-color: var(--atlas-border);
    background: var(--atlas-bg);
    color: var(--atlas-fg);
}

    .atlas-github-button--secondary:hover[b-rekdf37oo7] {
        border-color: var(--atlas-focus);
        background: var(--atlas-cyan-soft);
        color: var(--atlas-fg);
    }

.atlas-github-error[b-rekdf37oo7] {
    flex-basis: 100%;
    margin: 0;
    color: var(--atlas-error);
    font-size: 11px;
}

@media (max-width: 760px) {
    .atlas-github-connection[b-rekdf37oo7] {
        align-items: flex-start;
        padding: 12px 20px;
        gap: 12px;
    }

    .atlas-github-identity[b-rekdf37oo7] {
        flex: 1 1 180px;
    }

    .atlas-github-actions[b-rekdf37oo7] {
        width: 100%;
        justify-content: space-between;
    }
}

@media (prefers-reduced-motion: reduce) {
    .atlas-github-button[b-rekdf37oo7] {
        transition: none;
    }
}


/* GitHub disconnect action */
.atlas-github-disconnect-form[b-rekdf37oo7] {
    display: inline-flex;
    margin: 0;
}

.atlas-github-button--danger[b-rekdf37oo7] {
    border-color: var(--atlas-error);
    background: transparent;
    color: var(--atlas-error);
}

    .atlas-github-button--danger:hover[b-rekdf37oo7] {
        border-color: var(--atlas-error);
        background: var(--atlas-error-soft);
        color: var(--atlas-error);
    }

@media (max-width: 760px) {
    .atlas-github-actions[b-rekdf37oo7] {
        flex-wrap: wrap;
    }

    .atlas-github-disconnect-form[b-rekdf37oo7] {
        display: inline-flex;
    }
}

.atlas-connect-loading[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    flex: 1;
    min-height: 200px;
    padding: 24px;
    color: var(--atlas-muted);
    font-size: 12px;
}


/* =========================================
   Atlas GitHub connection notifications
   ========================================= */

.atlas-github-notice[b-rekdf37oo7] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 0 100%;
    min-width: 0;
    margin-top: 2px;
    padding: 11px 13px;
    border: 1px solid var(--atlas-border);
    border-radius: 9px;
    font-size: 12px;
    line-height: 1.6;
    animation: atlas-notice-enter-b-rekdf37oo7 .22s ease-out both;
}

    .atlas-github-notice.is-success[b-rekdf37oo7] {
        color: var(--atlas-note);
        background: var(--atlas-note-soft);
        border-color: oklch(.88 .055 160);
    }

    .atlas-github-notice.is-info[b-rekdf37oo7] {
        color: var(--atlas-focus);
        background: var(--atlas-cyan-soft);
        border-color: oklch(.88 .05 211);
    }

.atlas-github-notice-icon[b-rekdf37oo7] {
    flex: 0 0 auto;
    font-size: 19px;
}

.atlas-github-notice-text[b-rekdf37oo7] {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
}

.atlas-github-notice-close[b-rekdf37oo7] {
    display: grid;
    place-items: center;
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: inherit;
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
    opacity: .7;
}

    .atlas-github-notice-close:hover[b-rekdf37oo7] {
        background: oklch(.5 .02 258 / .08);
        opacity: 1;
    }

    .atlas-github-notice-close:focus-visible[b-rekdf37oo7] {
        outline: 2px solid currentColor;
        outline-offset: 2px;
    }

@keyframes atlas-notice-enter-b-rekdf37oo7 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

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

@media (prefers-reduced-motion: reduce) {
    .atlas-github-notice[b-rekdf37oo7] {
        animation: none;
    }
}




/* /Components/Pages/AtlasConnectWelcome.razor.rz.scp.css */

.atlas-connect-welcome[b-yyatukij72] {
    display: grid;
    place-items: center;
    flex: 1;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    padding: 40px 28px;
    background: radial-gradient( ellipse at 50% 15%, var(--atlas-cyan-soft), transparent 55% ), var(--atlas-bg);
}

.atlas-connect-content[b-yyatukij72] {
    width: 100%;
    max-width: 730px;
    margin: auto;
    text-align: center;
}

.atlas-connect-logo[b-yyatukij72] {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0 auto 22px;
    padding: 12px;
    border: 1px solid var(--atlas-border);
    border-radius: 21px;
    background: var(--atlas-bg);
    color: var(--atlas-primary);
    box-shadow: var(--atlas-shadow);
}

    .atlas-connect-logo svg[b-yyatukij72] {
        display: block;
        width: 100%;
        height: 100%;
    }

.atlas-connect-orbit[b-yyatukij72] {
    stroke: var(--atlas-cyan);
}

.atlas-connect-node[b-yyatukij72] {
    fill: var(--atlas-cyan);
}

.atlas-connect-eyebrow[b-yyatukij72] {
    color: var(--atlas-muted);
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 1.8px;
}

.atlas-connect-content h1[b-yyatukij72] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 15px 0 0;
    color: var(--atlas-fg);
    font-size: clamp(32px, 4vw, 45px);
    font-weight: 650;
    letter-spacing: -1.4px;
    line-height: 1.2;
}

    .atlas-connect-content h1 span[b-yyatukij72] {
        color: var(--atlas-muted);
        font-weight: 500;
    }

.atlas-connect-description[b-yyatukij72] {
    max-width: 530px;
    margin: 20px auto 0;
    color: var(--atlas-muted);
    font-size: 14px;
    line-height: 1.9;
}

.atlas-connect-button[b-yyatukij72] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 48px;
    margin-top: 28px;
    padding: 0 19px;
    border: 1px solid var(--atlas-primary);
    border-radius: 9px;
    background: var(--atlas-primary);
    color: var(--atlas-on-primary);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 5px 15px oklch(.177 .031 259 / .12);
    transition: background .18s ease, box-shadow .18s ease, transform .18s ease;
}

    .atlas-connect-button svg[b-yyatukij72] {
        width: 21px;
        height: 21px;
        flex-shrink: 0;
    }

    .atlas-connect-button:hover[b-yyatukij72] {
        background: var(--atlas-primary-soft);
        color: var(--atlas-on-primary);
        box-shadow: 0 7px 20px oklch(.177 .031 259 / .18);
        transform: translateY(-1px);
    }

    .atlas-connect-button:focus-visible[b-yyatukij72] {
        outline: 2px solid var(--atlas-focus);
        outline-offset: 4px;
    }

.atlas-connect-arrow[b-yyatukij72] {
    margin-left: 5px;
    color: var(--atlas-cyan);
    font-size: 18px;
}

.atlas-connect-note[b-yyatukij72] {
    max-width: 450px;
    margin: 13px auto 0;
    color: var(--atlas-muted);
    font-size: 10px;
    line-height: 1.7;
}

.atlas-connect-features[b-yyatukij72] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 42px;
    text-align: left;
}

    .atlas-connect-features > div[b-yyatukij72] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        min-width: 0;
        padding: 16px;
        border: 1px solid var(--atlas-border);
        border-radius: 10px;
        background: var(--atlas-bg);
    }

    .atlas-connect-features .material-icons[b-yyatukij72] {
        color: var(--atlas-focus);
        font-size: 21px;
    }

    .atlas-connect-features strong[b-yyatukij72] {
        color: var(--atlas-fg);
        font-size: 11px;
        font-weight: 650;
    }

    .atlas-connect-features > div > span:last-child[b-yyatukij72] {
        color: var(--atlas-muted);
        font-size: 10px;
        line-height: 1.7;
    }

@media (max-width: 760px) {
    .atlas-connect-welcome[b-yyatukij72] {
        padding: 28px 20px;
    }

    .atlas-connect-logo[b-yyatukij72] {
        width: 60px;
        height: 60px;
        margin-bottom: 18px;
        padding: 9px;
        border-radius: 17px;
    }

    .atlas-connect-description[b-yyatukij72] {
        font-size: 12px;
    }

    .atlas-connect-features[b-yyatukij72] {
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
        margin-top: 30px;
    }

        .atlas-connect-features > div[b-yyatukij72] {
            display: grid;
            grid-template-columns: 28px minmax(0, 1fr);
            gap: 3px 10px;
            padding: 12px;
        }

        .atlas-connect-features .material-icons[b-yyatukij72] {
            grid-row: span 2;
        }

        .atlas-connect-features > div > span:last-child[b-yyatukij72] {
            grid-column: 2;
        }
}

@media (prefers-reduced-motion: reduce) {
    .atlas-connect-button[b-yyatukij72] {
        transition: none;
    }

        .atlas-connect-button:hover[b-yyatukij72] {
            transform: none;
        }
}
/* /Components/Pages/ForgotPassword.razor.rz.scp.css */
.recovery-card[b-ah7m8as86o] {
    box-sizing: border-box;
    width: min(100%, 440px);
    padding: 32px;
    border: 1px solid var(--login-line);
    border-radius: 28px;
    background: radial-gradient(ellipse at 0 0, rgba(255, 255, 255, .1), transparent 65%),
        linear-gradient(135deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .018)), rgba(107, 122, 145, .18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(0, 0, 0, .14), 0 24px 70px rgba(0, 0, 0, .23);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    color: var(--login-ink);
    animation: recovery-enter-b-ah7m8as86o 160ms ease-out both;
}
.recovery-icon[b-ah7m8as86o] {
    display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 22px;
    border: 1px solid var(--login-line); border-radius: 15px;
    background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.03));
    color: #d7e2ff;
}
.recovery-icon .material-icons[b-ah7m8as86o] { font-size: 26px; }
.recovery-icon.is-complete[b-ah7m8as86o] { color: #a9e4c2; }
h1[b-ah7m8as86o] { margin: 0 0 10px; color: var(--login-ink); font-size: 28px; font-weight: 500; line-height: 1.25; letter-spacing: -.8px; }
.recovery-description[b-ah7m8as86o] { margin: 0 0 24px; color: var(--login-muted); font-size: 13px; line-height: 1.6; }
.recovery-steps[b-ah7m8as86o] { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 26px; padding: 0; list-style: none; }
.recovery-steps li[b-ah7m8as86o] { display: flex; align-items: center; gap: 7px; color: var(--login-muted); font-size: 12px; }
.recovery-steps li > span[b-ah7m8as86o] { display: grid; place-items: center; width: 25px; height: 25px; flex: 0 0 25px; border: 1px solid var(--login-line); border-radius: 50%; }
.recovery-steps .is-current[b-ah7m8as86o] { color: #fff; font-weight: 600; }
.recovery-steps .is-current > span[b-ah7m8as86o] { border-color: #a9bef4; background: rgba(172, 190, 231, .18); }
.recovery-steps .is-done[b-ah7m8as86o] { color: #a9e4c2; }
.recovery-steps .is-done > span[b-ah7m8as86o] { border-color: rgba(169,228,194,.45); }
.recovery-form[b-ah7m8as86o] { display: grid; gap: 18px; }
.recovery-field[b-ah7m8as86o] { min-width: 0; }
label[b-ah7m8as86o] { display: block; margin-bottom: 8px; color: var(--login-ink); font-size: 13px; font-weight: 500; }
.recovery-field input[b-ah7m8as86o] {
    box-sizing: border-box; width: 100%; min-width: 0; min-height: 52px; padding: 13px 14px;
    border: 1px solid var(--login-line); border-radius: 12px; background: rgba(12,21,38,.48);
    color: var(--login-ink); caret-color: var(--login-ink); font: inherit; font-size: 16px; line-height: 24px;
    transition: border-color 160ms ease, background 160ms ease;
}
.recovery-field input[b-ah7m8as86o]::placeholder { color: #a5b3ca; opacity: 1; font-size: 13px; }
.recovery-field input:focus[b-ah7m8as86o] { border-color: #8facff; outline: 2px solid rgba(143,172,255,.6); outline-offset: 2px; background: rgba(20,31,53,.7); }
.recovery-field input[aria-invalid="true"][b-ah7m8as86o] { border-color: #ffb7b1; }
.recovery-field input[aria-invalid="true"]:focus[b-ah7m8as86o] { outline-color: rgba(255,183,177,.6); }
.recovery-field input:disabled[b-ah7m8as86o] { opacity: .6; cursor: not-allowed; }
.recovery-field input:-webkit-autofill[b-ah7m8as86o] { -webkit-text-fill-color: var(--login-ink); -webkit-box-shadow: inset 0 0 0 1000px #25324a; caret-color: var(--login-ink); }
.recovery-field small[b-ah7m8as86o] { display: block; margin-top: 9px; color: var(--login-muted); font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.recovery-field .recovery-otp[b-ah7m8as86o] { text-align: center; font-size: 25px; font-variant-numeric: tabular-nums; letter-spacing: .3em; padding-left: calc(14px + .3em); }
.recovery-field .recovery-otp[b-ah7m8as86o]::placeholder { font-size: 25px; color: #7787a4; }
.recovery-primary[b-ah7m8as86o] {
    display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 13px 16px;
    border: 1px solid rgba(255,255,255,.21); border-radius: 12px;
    background: linear-gradient(155deg, #3d6de4, var(--login-accent));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 5px 18px rgba(36,83,211,.2);
    color: #fff; font: inherit; font-size: 14px; font-weight: 600; text-decoration: none; cursor: pointer;
}
.recovery-primary .material-icons[b-ah7m8as86o] { font-size: 18px; }
.recovery-primary:hover:not(:disabled)[b-ah7m8as86o] { border-color: rgba(255,255,255,.45); }
button:disabled[b-ah7m8as86o] { opacity: .55; cursor: not-allowed; }
.recovery-deadline[b-ah7m8as86o] { display: flex; justify-content: space-between; gap: 16px; margin: 0 0 20px; padding: 10px 0; border-block: 1px solid var(--login-line); color: var(--login-muted); font-size: 12px; }
.recovery-deadline strong[b-ah7m8as86o] { color: var(--login-ink); font-variant-numeric: tabular-nums; }
.recovery-resend[b-ah7m8as86o] { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: 15px; margin-top: 18px; text-align: center; }
.recovery-resend > p[b-ah7m8as86o] { flex-basis: 100%; margin: 0 0 5px; color: var(--login-muted); font-size: 12px; }
.recovery-text-button[b-ah7m8as86o], .recovery-show[b-ah7m8as86o] { padding: 9px 0; border: 0; background: transparent; color: #c4d4ff; font: inherit; font-size: 12px; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.recovery-show[b-ah7m8as86o] { justify-self: start; padding: 2px 0 4px; }
.recovery-back[b-ah7m8as86o] { display: flex; justify-content: center; align-items: center; gap: 7px; margin-top: 24px; padding: 7px; color: #c4d4ff; font-size: 13px; text-decoration: none; }
.recovery-back .material-icons[b-ah7m8as86o] { font-size: 17px; }
.recovery-back:hover[b-ah7m8as86o], .recovery-text-button:hover:not(:disabled)[b-ah7m8as86o], .recovery-show:hover[b-ah7m8as86o] { color: #fff; }
.recovery-card :is(button, a):focus-visible[b-ah7m8as86o] { outline: 2px solid #b8d8ff; outline-offset: 4px; border-radius: 6px; }
.recovery-feedback.pl-smoky-glass.pl-glass-message[b-ah7m8as86o] {
    --pl-glass-ink: #f5f8ff; --pl-glass-muted: #e0e8f4; --pl-glass-solid: #48586b;
    box-sizing: border-box; max-width: 100%; margin: 0 0 20px; padding: 14px; border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16); backdrop-filter: none; -webkit-backdrop-filter: none;
    font-size: 13px; line-height: 1.6; overflow-wrap: anywhere;
}
.recovery-feedback strong[b-ah7m8as86o] { display: block; margin-bottom: 4px; font-size: 13px; font-weight: 600; }
.recovery-feedback p[b-ah7m8as86o] { margin: 0; }
.recovery-feedback.is-error[b-ah7m8as86o] { border-color: rgba(255,183,177,.4); }
.recovery-feedback.is-error strong[b-ah7m8as86o] { color: #ffb7b1; }
.recovery-success strong[b-ah7m8as86o] { color: #a9e4c2; }
@keyframes recovery-enter-b-ah7m8as86o { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 580px) { .recovery-card[b-ah7m8as86o] { padding: 28px 22px; } h1[b-ah7m8as86o] { font-size: 26px; } .recovery-steps[b-ah7m8as86o] { gap: 8px; } }
@media (prefers-reduced-motion: reduce) { .recovery-card[b-ah7m8as86o] { animation: none; } .recovery-field input[b-ah7m8as86o] { transition: none; } }
@media (prefers-reduced-transparency: reduce) { .recovery-card[b-ah7m8as86o] { background: #344158; backdrop-filter: none; -webkit-backdrop-filter: none; } .recovery-feedback.pl-smoky-glass.pl-glass-message[b-ah7m8as86o] { background: #48586b; } }
@supports not (backdrop-filter: blur(1px)) { .recovery-card[b-ah7m8as86o] { background: #344158; } }
/* /Components/Pages/Login.razor.rz.scp.css */
.login-card[b-wp5hyg67yu] {
    --login-error: #ffb7b1;
    box-sizing: border-box;
    width: min(100%, 400px);
    padding: 36px 32px;
    border: 1px solid var(--login-line);
    border-radius: 28px;
    background: radial-gradient(ellipse at 0 0, rgba(255, 255, 255, .1), transparent 65%),
        linear-gradient(135deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .018)), rgba(107, 122, 145, .18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(0, 0, 0, .14),
        0 24px 70px rgba(0, 0, 0, .23);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    color: var(--login-ink);
    animation: login-enter-b-wp5hyg67yu 160ms ease-out both;
}

h1[b-wp5hyg67yu] {
    margin: 0 0 10px;
    color: var(--login-ink);
    font-size: 29px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -1px;
}

.login-subtitle[b-wp5hyg67yu] {
    margin: 0 0 26px;
    color: var(--login-muted);
    font-size: 13px;
    line-height: 1.6;
}

.login-form[b-wp5hyg67yu] { display: grid; gap: 19px; }
.login-field[b-wp5hyg67yu] { min-width: 0; }

.login-recovery-link[b-wp5hyg67yu] {
    justify-self: end;
    color: #c4d4ff;
    font-size: 13px;
    text-underline-offset: 4px;
}
.login-recovery-link:hover[b-wp5hyg67yu] { color: #fff; }
.login-recovery-link:focus-visible[b-wp5hyg67yu] { outline: 2px solid #b8d8ff; outline-offset: 4px; border-radius: 3px; }

label[b-wp5hyg67yu] {
    display: block;
    margin-bottom: 8px;
    color: var(--login-ink);
    font-size: 13px;
    font-weight: 500;
}

.login-input-wrap[b-wp5hyg67yu] { position: relative; }

.login-input-icon[b-wp5hyg67yu] {
    position: absolute;
    top: 17px;
    left: 14px;
    color: var(--login-muted);
    font-size: 18px;
    pointer-events: none;
}

.login-input-wrap input[b-wp5hyg67yu] {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 52px;
    padding: 13px 45px 13px 41px;
    border: 1px solid var(--login-line);
    border-radius: 12px;
    background: rgba(12, 21, 38, .48);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, .07);
    color: var(--login-ink);
    caret-color: var(--login-ink);
    font: inherit;
    font-size: 16px;
    line-height: 24px;
    transition: border-color 160ms ease, background 160ms ease;
}

.login-input-wrap input[b-wp5hyg67yu]::placeholder {
    color: #a5b3ca;
    opacity: 1;
    font-size: 14px;
}

.login-input-wrap input:focus[b-wp5hyg67yu] {
    border-color: #8facff;
    outline: 2px solid rgba(143, 172, 255, .6);
    outline-offset: 2px;
    background: rgba(20, 31, 53, .7);
}

.login-input-wrap input:-webkit-autofill[b-wp5hyg67yu] {
    -webkit-text-fill-color: var(--login-ink);
    -webkit-box-shadow: inset 0 0 0 1000px #25324a;
    caret-color: var(--login-ink);
}

.login-input-wrap--error input[b-wp5hyg67yu] {
    border-color: rgba(255, 183, 177, .7);
    background: rgba(46, 26, 40, .55);
}

.login-input-wrap--error input:focus[b-wp5hyg67yu] {
    border-color: var(--login-error);
    outline-color: rgba(255, 183, 177, .6);
    background: rgba(46, 26, 40, .68);
}

.login-input-wrap--error .login-input-icon[b-wp5hyg67yu] {
    color: var(--login-error);
}

.login-password-toggle[b-wp5hyg67yu] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--login-muted);
    cursor: pointer;
    transition: background 160ms ease;
}

.login-password-toggle .material-icons[b-wp5hyg67yu] { font-size: 19px; }
.login-password-toggle:hover[b-wp5hyg67yu] { background: rgba(140, 156, 185, .13); }

.login-password-toggle:focus-visible[b-wp5hyg67yu],
.login-submit:focus-visible[b-wp5hyg67yu] {
    outline: 2px solid #b8d8ff;
    outline-offset: 3px;
}

.login-submit[b-wp5hyg67yu] {
    min-height: 52px;
    margin-top: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 13px 18px;
    border: 1px solid rgba(255, 255, 255, .21);
    border-radius: 12px;
    background: linear-gradient(155deg, #3d6de4, var(--login-accent));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 5px 18px rgba(36, 83, 211, .2);
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.login-submit .material-icons[b-wp5hyg67yu] { font-size: 18px; }

/* Keep the hit area fixed: moving it on hover can flicker at the bottom edge. */
@media (hover: hover) and (pointer: fine) {
    .login-submit:hover[b-wp5hyg67yu] {
        border-color: rgba(255, 255, 255, .38);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 6px 20px rgba(36, 83, 211, .32);
    }
}

.login-submit:active[b-wp5hyg67yu] {
    box-shadow: inset 0 1px 2px rgba(12, 21, 38, .2), 0 2px 8px rgba(36, 83, 211, .16);
}

/* Reuse the shared smoky message surface without adding nested blur. */
.login-feedback.pl-smoky-glass.pl-glass-message[b-wp5hyg67yu] {
    --pl-glass-ink: #f5f8ff;
    --pl-glass-muted: #e0e8f4;
    --pl-glass-solid: #48586b;
    --pl-glass-danger: #ffb7b1;
    --pl-glass-success: #94d6b0;
    max-width: 100%;
    margin-bottom: 18px;
    padding: 12px;
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    font-size: 13px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.login-feedback.login-error[b-wp5hyg67yu] {
    display: flex;
    align-items: center;
    gap: 10px;
    border-color: rgba(255, 183, 177, .4);
    color: var(--pl-glass-danger);
}

.login-error-icon[b-wp5hyg67yu] {
    flex: 0 0 22px;
    font-size: 22px;
}

.login-error > span:last-child[b-wp5hyg67yu] { min-width: 0; }
.login-feedback.login-success[b-wp5hyg67yu] { color: var(--pl-glass-success); }
.login-success strong[b-wp5hyg67yu] { display: block; margin-bottom: 4px; font-weight: 600; }
.login-success p[b-wp5hyg67yu] { margin: 0; color: inherit; font-size: inherit; }

@keyframes login-enter-b-wp5hyg67yu {
    from { opacity: 0; transform: translateY(3px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 580px) {
    .login-card[b-wp5hyg67yu] { padding: 28px 24px; }
}

@media (prefers-reduced-motion: reduce) {
    .login-card[b-wp5hyg67yu] { animation: none; }
    .login-input-wrap input[b-wp5hyg67yu], .login-password-toggle[b-wp5hyg67yu], .login-submit[b-wp5hyg67yu] { transition: none; }
}

@media (prefers-reduced-transparency: reduce) {
    .login-card[b-wp5hyg67yu] { background: #344158; backdrop-filter: none; -webkit-backdrop-filter: none; }
}

@supports not (backdrop-filter: blur(1px)) {
    .login-card[b-wp5hyg67yu] { background: #344158; }
}