/* /Components/Account/Pages/Manage/Passkeys.razor.rz.scp.css */
.mgmt-passkeys-intro[b-vrw7mu8sej] {
    font-size: 0.9rem;
    color: var(--mud-palette-text-secondary, #666);
    margin: -8px 0 22px;
    line-height: 1.55;
    max-width: 42rem;
}

.mgmt-passkey-list[b-vrw7mu8sej] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mgmt-passkey-item[b-vrw7mu8sej] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px 16px;
    padding: 16px 18px;
    border-radius: 12px;
    border: 1px solid var(--mud-palette-divider, rgba(0, 0, 0, 0.08));
    background: var(--mud-palette-background, rgba(0, 0, 0, 0.02));
}

.mgmt-passkey-item__main[b-vrw7mu8sej] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.mgmt-passkey-item__main .material-icons[b-vrw7mu8sej] {
    font-size: 22px;
    color: var(--mud-palette-primary, #5c6bc0);
    opacity: 0.85;
    flex-shrink: 0;
}

.mgmt-passkey-item__name[b-vrw7mu8sej] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary, #1a1a2e);
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mgmt-passkey-item__actions[b-vrw7mu8sej] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.mgmt-passkey-item__actions form[b-vrw7mu8sej] {
    display: contents;
}

.mgmt-passkeys-empty[b-vrw7mu8sej] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 28px 20px 8px;
    border-radius: 12px;
    border: 1px dashed var(--mud-palette-divider, rgba(0, 0, 0, 0.12));
    background: var(--mud-palette-background, rgba(0, 0, 0, 0.02));
    margin-bottom: 24px;
}

.mgmt-passkeys-empty .material-icons[b-vrw7mu8sej] {
    font-size: 40px;
    color: var(--mud-palette-text-disabled, #bbb);
    margin-bottom: 12px;
}

.mgmt-passkeys-empty p[b-vrw7mu8sej] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--mud-palette-text-secondary, #666);
    line-height: 1.5;
    max-width: 26rem;
}

.mgmt-passkeys-add[b-vrw7mu8sej] {
    margin-top: 8px;
    padding-top: 22px;
    border-top: 1px solid var(--mud-palette-divider, rgba(0, 0, 0, 0.06));
}

.mgmt-passkeys-add__title[b-vrw7mu8sej] {
    font-size: 0.76rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--mud-palette-text-secondary, #888);
    margin: 0 0 12px;
}

@media (max-width: 520px) {
    .mgmt-passkey-item[b-vrw7mu8sej] {
        flex-direction: column;
        align-items: stretch;
    }

    .mgmt-passkey-item__actions[b-vrw7mu8sej] {
        justify-content: flex-start;
    }
}
/* /Components/CommandPalette/CommandPalette.razor.rz.scp.css */
.cmd-overlay[b-wixsz353yu] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1400;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 15vh;
}

.cmd-palette[b-wixsz353yu] {
    background: var(--mud-palette-surface);
    border-radius: 10px;
    width: 560px;
    max-width: 94vw;
    overflow: hidden;
}

.cmd-search[b-wixsz353yu] {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.cmd-input[b-wixsz353yu] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 1rem;
    color: var(--mud-palette-text-primary);
}

.cmd-esc[b-wixsz353yu] {
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.7rem;
    opacity: 0.5;
}

.cmd-results[b-wixsz353yu] {
    max-height: 320px;
    overflow-y: auto;
}

.cmd-result[b-wixsz353yu] {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    cursor: pointer;
    transition: background 0.1s;
}

.cmd-result:hover[b-wixsz353yu],
.cmd-result--active[b-wixsz353yu] {
    background: var(--mud-palette-background);
}

.cmd-footer[b-wixsz353yu] {
    display: flex;
    gap: 16px;
    padding: 8px 16px;
    border-top: 1px solid var(--mud-palette-lines-default);
    opacity: 0.5;
    font-size: 0.75rem;
}

kbd[b-wixsz353yu] {
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 3px;
    padding: 1px 5px;
    font-size: 0.7rem;
    margin-right: 2px;
}
/* /Components/Layout/AccountMenu.razor.rz.scp.css */
.account-menu__button[b-7qplz9t3pz] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    padding: 6px 8px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: var(--mud-palette-drawer-text);
    text-align: left;
    cursor: pointer;
    transition: background-color 160ms ease, color 160ms ease;
}

.account-menu__button--compact[b-7qplz9t3pz] {
    justify-content: center;
    width: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 14px;
}

.account-menu__button:hover[b-7qplz9t3pz],
.account-menu__button:focus-visible[b-7qplz9t3pz] {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
    outline: none;
}

.account-menu__avatar[b-7qplz9t3pz] {
    width: 32px;
    height: 32px;
    font-size: 0.75rem;
    font-weight: 700;
    flex-shrink: 0;
}

.account-menu__button--compact .account-menu__avatar[b-7qplz9t3pz] {
    width: 34px;
    height: 34px;
}

.account-menu__avatar-img[b-7qplz9t3pz] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
    pointer-events: none;
}

.account-menu__identity[b-7qplz9t3pz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
    line-height: 1.1;
}

.account-menu__name[b-7qplz9t3pz],
.account-menu__hint[b-7qplz9t3pz] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-menu__name[b-7qplz9t3pz] {
    font-size: 0.86rem;
    font-weight: 700;
}

.account-menu__hint[b-7qplz9t3pz] {
    margin-top: 3px;
    font-size: 0.72rem;
    color: var(--mud-palette-text-secondary);
}

.account-menu__more[b-7qplz9t3pz] {
    color: var(--mud-palette-text-secondary);
    flex-shrink: 0;
}

.account-menu__logout-form[b-7qplz9t3pz] {
    margin: 0;
}

.account-menu__logout-button[b-7qplz9t3pz] {
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
    padding: 0;
    text-align: left;
}
/* /Components/Layout/AppShellTopBar.razor.rz.scp.css */
.app-shell-topbar[b-3yzndkr24l] {
    display: none;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    height: 40px;
    padding: 4px 8px 4px 10px;
    position: relative;
    z-index: 1300;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-divider) 75%, transparent);
    background: var(--mud-palette-surface);
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .app-shell-topbar[b-3yzndkr24l] {
        display: flex;
    }
}

.app-shell-topbar__leading[b-3yzndkr24l] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 88px;
}

.app-shell-topbar__brand[b-3yzndkr24l],
.app-shell-topbar__nav-toggle[b-3yzndkr24l] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
    padding: 0;
    transition: background-color 140ms ease, color 140ms ease;
}

.app-shell-topbar__brand[b-3yzndkr24l] {
    width: 30px;
    height: 30px;
}

.app-shell-topbar__brand:hover[b-3yzndkr24l],
.app-shell-topbar__brand:focus-visible[b-3yzndkr24l],
.app-shell-topbar__nav-toggle:hover[b-3yzndkr24l],
.app-shell-topbar__nav-toggle:focus-visible[b-3yzndkr24l] {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
    outline: none;
}

.app-shell-topbar__nav-toggle[b-3yzndkr24l] {
    width: 30px;
    height: 30px;
}

.app-shell-topbar__center[b-3yzndkr24l] {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
    min-width: 0;
}

/* One control: search row + timer on the right edge (matches reference command band). */
.app-shell-topbar__command-band[b-3yzndkr24l] {
    display: flex;
    align-items: stretch;
    width: 100%;
    max-width: min(520px, 42vw);
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 80%, transparent);
    border-radius: 7px;
    background: color-mix(in srgb, var(--mud-palette-background) 88%, var(--mud-palette-surface));
    overflow: visible;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.app-shell-topbar__command-band:hover[b-3yzndkr24l],
.app-shell-topbar__command-band:focus-within[b-3yzndkr24l] {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 45%, transparent);
    background: var(--mud-palette-surface);
}

.app-shell-topbar__command[b-3yzndkr24l] {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    margin: 0;
    min-height: 30px;
    padding: 5px 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    font: inherit;
    font-size: 0.86rem;
    text-align: left;
    cursor: pointer;
    transition: color 140ms ease;
}

.app-shell-topbar__command-band:hover .app-shell-topbar__command[b-3yzndkr24l],
.app-shell-topbar__command-band:focus-within .app-shell-topbar__command[b-3yzndkr24l] {
    color: var(--mud-palette-text-primary);
}

.app-shell-topbar__command:focus-visible[b-3yzndkr24l] {
    outline: none;
}

.app-shell-topbar__timer-slot[b-3yzndkr24l] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    border-left: 1px solid color-mix(in srgb, var(--mud-palette-divider) 70%, transparent);
    padding: 0 2px;
    color: var(--mud-palette-text-secondary);
}

.app-shell-topbar__timer-slot[b-3yzndkr24l]  .pomodoro-timer__btn {
    color: inherit;
    min-height: 30px !important;
    padding: 3px 7px !important;
    font-size: 0.78rem !important;
}

.app-shell-topbar__timer-slot[b-3yzndkr24l]  .pomodoro-panel {
    top: 48px;
}

.app-shell-topbar__right[b-3yzndkr24l] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    min-width: 0;
}

.app-shell-topbar__right[b-3yzndkr24l]  .notif-bell__button {
    width: 32px;
    height: 32px;
    padding: 4px;
    color: var(--mud-palette-text-secondary);
}

.app-shell-topbar__right[b-3yzndkr24l]  .account-menu__button--compact {
    width: 32px;
    min-height: 32px;
    border-radius: 7px;
}

.app-shell-topbar__right[b-3yzndkr24l]  .account-menu__button--compact .account-menu__avatar {
    width: 26px;
    height: 26px;
}

.app-shell-topbar__command-icon[b-3yzndkr24l] {
    opacity: 0.55;
    flex-shrink: 0;
}

.app-shell-topbar__command-placeholder[b-3yzndkr24l] {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-shell-topbar__kbd-wrap[b-3yzndkr24l] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
}

.app-shell-topbar__kbd[b-3yzndkr24l] {
    font-family: ui-monospace, monospace;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 3px 6px;
    border-radius: 5px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 90%, transparent);
    background: color-mix(in srgb, var(--mud-palette-surface) 75%, var(--mud-palette-background));
    color: var(--mud-palette-text-secondary);
    line-height: 1;
}

@media (max-width: 980px) {
    .app-shell-topbar__command-band[b-3yzndkr24l] {
        max-width: min(360px, 50vw);
    }

    .app-shell-topbar__command-placeholder[b-3yzndkr24l],
    .app-shell-topbar__kbd-wrap[b-3yzndkr24l] {
        display: none;
    }

    .app-shell-topbar__command[b-3yzndkr24l] {
        flex: 0 0 auto;
        width: 34px;
        justify-content: center;
        padding: 0;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-12bui6t30k] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-12bui6t30k] {
    flex: 1;
}

.sidebar[b-12bui6t30k] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-12bui6t30k] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-12bui6t30k]  a, .top-row[b-12bui6t30k]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-12bui6t30k]  a:hover, .top-row[b-12bui6t30k]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-12bui6t30k]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-12bui6t30k] {
        justify-content: space-between;
    }

    .top-row[b-12bui6t30k]  a, .top-row[b-12bui6t30k]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-12bui6t30k] {
        flex-direction: row;
    }

    .sidebar[b-12bui6t30k] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-12bui6t30k] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-12bui6t30k]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-12bui6t30k], article[b-12bui6t30k] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-12bui6t30k] {
    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-12bui6t30k] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/*
 * Critical shell layout rules (ticktick-layout, app-shell-body, app-shell__main,
 * drawer margins, tasks-view) are in wwwroot/app.css so they apply to MudLayout's
 * component root element without Blazor CSS isolation issues.
 */

.app-nav-drawer-shell.mud-drawer[b-12bui6t30k] {
    background: var(--mud-palette-drawer-background);
    border-right: 1px solid color-mix(in srgb, var(--mud-palette-divider) 55%, transparent);
}


.app-nav-drawer[b-12bui6t30k] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    padding: 10px 0 12px;
    box-sizing: border-box;
}

.ticktick-layout--nav-collapsed .app-nav-drawer[b-12bui6t30k] {
    overflow-x: hidden;
}

/* Collapsed rail: hide glance, secondary nav (child components need ::deep for their roots). */
.ticktick-layout--nav-collapsed .app-nav-drawer__glance[b-12bui6t30k] {
    display: none;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .sidebar-countdown {
    display: none !important;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .nav-menu-secondary {
    display: none !important;
}

/* Icon rail: compact primary links + count badges */
.ticktick-layout--nav-collapsed[b-12bui6t30k]  .ticktick-nav .mud-nav-link {
    justify-content: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 4px auto;
    width: 40px;
    min-width: 40px;
    position: relative;
    border-radius: 12px;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .ticktick-nav .mud-nav-link .mud-nav-link-text {
    display: none !important;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .nav-link-row > span:first-child {
    display: none;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .nav-link-row {
    justify-content: center;
    position: static;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .nav-count {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 16px;
    border-radius: 999px;
    background: #f4f4f5;
    color: #121214;
}

.ticktick-layout--nav-collapsed[b-12bui6t30k]  .ticktick-nav .mud-nav-link .mud-nav-link-icon {
    margin-inline: 0 !important;
}

@media (max-width: 767.98px) {
    .app-nav-drawer-shell.mud-drawer-mini.mud-drawer--closed[b-12bui6t30k] {
        width: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        border: none !important;
        pointer-events: none;
    }

    .app-shell__mobile-header[b-12bui6t30k] {
        grid-column: 1;
        grid-row: 1;
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: var(--app-shell-mobile-header-block);
        padding: env(safe-area-inset-top, 0px) 12px 0;
        border-bottom: 1px solid var(--mud-palette-divider);
        background: var(--mud-palette-surface);
        box-sizing: border-box;
        z-index: 20;
    }

    .app-shell__mobile-menu[b-12bui6t30k] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: none;
        border-radius: 8px;
        background: transparent;
        color: var(--mud-palette-text-primary);
        cursor: pointer;
    }
}

@media (min-width: 768px) {
    .app-shell__mobile-header[b-12bui6t30k] {
        display: none !important;
    }
}

.app-nav-drawer__glance[b-12bui6t30k] {
    padding: 0 12px 8px;
    flex-shrink: 0;
}

.app-nav-drawer__nav-scroll[b-12bui6t30k] {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

[b-12bui6t30k] .ticktick-appbar {
    height: 48px;
    min-height: 48px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

[b-12bui6t30k] .ticktick-appbar__avatar-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 50%;
    cursor: pointer;
}

[b-12bui6t30k] .ticktick-appbar__avatar {
    width: 32px;
    height: 32px;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
}

[b-12bui6t30k] .ticktick-appbar__avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
    pointer-events: none;
}

/* Narrow screens / phones: dynamic viewport (iOS Safari toolbar) */
.app-shell__mobile-search[b-12bui6t30k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--mud-palette-text-primary);
    cursor: pointer;
}

.app-shell__mobile-search:hover[b-12bui6t30k],
.app-shell__mobile-search:focus-visible[b-12bui6t30k] {
    background: var(--mud-palette-action-default-hover);
    outline: none;
}

/* Critical layout rules (.app-shell__main > * and > .tasks-view) are in app.css */
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-qqha7c65s6] {
    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-qqha7c65s6] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-qqha7c65s6] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-qqha7c65s6] {
    font-size: 1.1rem;
}

.bi[b-qqha7c65s6] {
    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-qqha7c65s6] {
    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-qqha7c65s6] {
    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-qqha7c65s6] {
    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");
}

.bi-lock-nav-menu[b-qqha7c65s6] {
    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 d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-qqha7c65s6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-qqha7c65s6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-qqha7c65s6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-qqha7c65s6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.nav-item[b-qqha7c65s6] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-qqha7c65s6] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-qqha7c65s6] {
        padding-bottom: 1rem;
    }

    .nav-item[b-qqha7c65s6]  .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-qqha7c65s6]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-qqha7c65s6]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-qqha7c65s6] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-qqha7c65s6] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-qqha7c65s6] {
        display: none;
    }

    .nav-scrollable[b-qqha7c65s6] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}

.nav-list-row[b-qqha7c65s6] {
    display: flex;
    align-items: center;
    position: relative;
    gap: 2px;
    min-width: 0;
}

.nav-list-row[b-qqha7c65s6]  .mud-nav-link {
    min-width: 0;
}

.nav-list-share-btn[b-qqha7c65s6] {
    flex-shrink: 0;
    opacity: 0.45 !important;
}

.nav-list-row:hover .nav-list-share-btn[b-qqha7c65s6] {
    opacity: 1 !important;
}

.nav-section-heading[b-qqha7c65s6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 34px;
    margin: 4px 4px 6px;
    padding: 0 4px 0 12px;
    border-radius: 16px;
    color: var(--mud-palette-text-secondary);
    background: transparent;
    transition: background-color 160ms ease, color 160ms ease;
}

.nav-section-heading:hover[b-qqha7c65s6],
.nav-section-heading:focus-within[b-qqha7c65s6] {
    color: var(--mud-palette-text-primary);
    background: var(--mud-palette-action-default-hover);
}

.nav-section-heading__label[b-qqha7c65s6] {
    appearance: none;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.01em;
    text-align: left;
}

.nav-section-heading__chevron[b-qqha7c65s6] {
    margin-left: -6px;
    opacity: 0.65;
}

.nav-section-heading__add[b-qqha7c65s6] {
    opacity: 0;
    color: currentColor !important;
    transition: opacity 140ms ease, color 160ms ease, background-color 160ms ease;
}

.nav-section-heading:hover .nav-section-heading__add[b-qqha7c65s6],
.nav-section-heading:focus-within .nav-section-heading__add[b-qqha7c65s6] {
    opacity: 0.7;
}

.nav-section-heading__add:hover[b-qqha7c65s6],
.nav-section-heading__add:focus-visible[b-qqha7c65s6] {
    opacity: 1 !important;
}

.nav-shared-heading[b-qqha7c65s6] {
    margin: 10px 12px 4px 16px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--mud-palette-text-secondary);
}

.nav-list-share-btn:hover[b-qqha7c65s6] {
    opacity: 1 !important;
}

/* Row inside nav link: label + count pushed to right */
.nav-link-row[b-qqha7c65s6] {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 4px;
}

.nav-link-row > span:first-child[b-qqha7c65s6] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-count[b-qqha7c65s6] {
    flex-shrink: 0;
    font-size: 0.7rem;
    background: rgba(128, 128, 128, 0.14);
    color: var(--mud-palette-text-secondary);
    padding: 1px 7px;
    border-radius: 10px;
    min-width: 20px;
    text-align: center;
}

.nav-account[b-qqha7c65s6] {
    display: none;
    padding: 2px 2px 0;
}

/* Collapsed rail: list shortcuts */
.nav-rail-lists[b-qqha7c65s6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 0 0 4px;
    width: 100%;
}

.nav-rail-lists__divider[b-qqha7c65s6] {
    width: 26px;
    height: 1px;
    background: var(--mud-palette-divider);
    margin: 4px 0 6px;
}

/* ::deep so styles reach NavLink's rendered <a> element */
[b-qqha7c65s6] .nav-rail-list-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    color: inherit;
    text-decoration: none;
    transition: background-color 140ms ease;
    margin: 1px 0;
}

[b-qqha7c65s6] .nav-rail-list-item:hover .nav-rail-list-glyph {
    background: color-mix(in srgb, var(--rail-list-color, #5C6BC0) 22%, var(--mud-palette-surface));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rail-list-color, #5C6BC0) 35%, transparent);
}

[b-qqha7c65s6] .nav-rail-list-item--active .nav-rail-list-glyph,
[b-qqha7c65s6] .nav-rail-list-item.active .nav-rail-list-glyph {
    background: color-mix(in srgb, var(--rail-list-color, #5C6BC0) 28%, var(--mud-palette-surface));
    box-shadow: inset 0 0 0 1.5px var(--rail-list-color, #5C6BC0);
}

[b-qqha7c65s6] .nav-rail-list-glyph {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--rail-list-color, #5C6BC0) 14%, var(--mud-palette-surface));
    font-size: 15px;
    line-height: 1;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    transition: background 140ms ease, box-shadow 140ms ease;
    flex-shrink: 0;
    user-select: none;
}

[b-qqha7c65s6] .ticktick-nav {
    padding: 8px 8px 10px;
}

[b-qqha7c65s6] .ticktick-nav.nav-menu-root {
    flex: 1;
    min-height: 0;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
}

[b-qqha7c65s6] .ticktick-nav .mud-nav-link {
    min-height: 36px;
    border-radius: 10px;
    margin: 2px 0;
    padding-left: 10px;
    padding-right: 8px;
    color: var(--mud-palette-drawer-text);
}

[b-qqha7c65s6] .ticktick-nav .mud-nav-link:hover {
    background: var(--mud-palette-action-default-hover);
}

[b-qqha7c65s6] .ticktick-nav .mud-nav-link.active {
    color: var(--mud-palette-drawer-text);
    background: color-mix(in srgb, var(--mud-palette-drawer-text) 12%, transparent);
    font-weight: 600;
}

[b-qqha7c65s6] .ticktick-nav .mud-nav-link .mud-nav-link-text {
    font-size: 0.875rem;
    width: 100%;
}

[b-qqha7c65s6] .ticktick-nav .mud-nav-link .mud-nav-link-icon {
    font-size: 18px;
}

@media (max-width: 767.98px) {
    .nav-section-heading[b-qqha7c65s6] {
        min-height: 44px;
        margin-top: 8px;
        padding-right: 2px;
    }

    .nav-section-heading__label[b-qqha7c65s6] {
        font-size: 0.94rem;
    }

    .nav-section-heading__add[b-qqha7c65s6] {
        opacity: 0.8;
    }

    [b-qqha7c65s6] .ticktick-nav .mud-nav-link {
        min-height: 48px;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    [b-qqha7c65s6] .ticktick-nav .mud-nav-link .mud-nav-link-text {
        font-size: 0.94rem;
    }

    [b-qqha7c65s6] .ticktick-nav .mud-nav-link .mud-nav-link-icon {
        font-size: 22px;
    }

    .nav-list-share-btn[b-qqha7c65s6] {
        opacity: 0.72 !important;
    }

    .nav-account[b-qqha7c65s6] {
        display: block;
    }

    [b-qqha7c65s6] .ticktick-nav .mud-button {
        min-height: 44px;
        font-size: 0.9rem !important;
    }
}
/* /Components/Layout/OngoingPill.razor.rz.scp.css */
.ongoing-pill[b-ucaqftjbdu] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 28px;
    padding: 0 10px 0 8px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 30%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    color: var(--mud-palette-text-primary);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    flex-shrink: 0;
    transition: background-color 120ms ease, border-color 120ms ease;
}

.ongoing-pill:hover[b-ucaqftjbdu] {
    background: color-mix(in srgb, var(--mud-palette-primary) 18%, transparent);
    border-color: color-mix(in srgb, var(--mud-palette-primary) 50%, transparent);
}

.ongoing-pill:focus-visible[b-ucaqftjbdu] {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}

.ongoing-pill__dot[b-ucaqftjbdu] {
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--mud-palette-primary);
    animation: ongoing-pulse-b-ucaqftjbdu 2s ease-in-out infinite;
}

@keyframes ongoing-pulse-b-ucaqftjbdu {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

.ongoing-pill__title[b-ucaqftjbdu] {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--mud-palette-text-primary);
}

.ongoing-pill__sep[b-ucaqftjbdu] {
    flex-shrink: 0;
    color: var(--mud-palette-text-secondary);
    opacity: 0.5;
}

.ongoing-pill__remain[b-ucaqftjbdu] {
    flex-shrink: 0;
    color: var(--mud-palette-primary);
    font-weight: 600;
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
}

/* At the narrow topbar breakpoint collapse to dot + time only */
@media (max-width: 980px) {
    .ongoing-pill__title[b-ucaqftjbdu],
    .ongoing-pill__sep[b-ucaqftjbdu] {
        display: none;
    }

    .ongoing-pill[b-ucaqftjbdu] {
        padding: 0 8px;
        gap: 5px;
    }
}
/* /Components/Layout/RailCountdownGlance.razor.rz.scp.css */
.rail-countdown-glance[b-egmhabv38f] {
    display: flex;
    justify-content: center;
    width: 100%;
}

.rail-countdown-glance__btn[b-egmhabv38f] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid transparent;
    border-radius: 15px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 4%, transparent);
    transition:
        background-color 0.18s ease,
        color 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.rail-countdown-glance__btn:hover[b-egmhabv38f],
.rail-countdown-glance__btn:focus-visible[b-egmhabv38f] {
    background: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-action-default-hover));
    border-color: color-mix(in srgb, var(--mud-palette-lines-default) 70%, var(--mud-palette-primary) 18%);
    color: var(--mud-palette-text-primary);
    box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 5%, transparent),
        0 4px 14px -6px color-mix(in srgb, var(--mud-palette-text-primary) 12%, transparent);
    outline: none;
}

.rail-countdown-glance__badge[b-egmhabv38f] {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text, #fff);
    font-size: 0.6rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 16px;
    text-align: center;
    pointer-events: none;
    box-shadow:
        0 0 0 2px var(--mud-palette-drawer-background),
        0 1px 2px color-mix(in srgb, var(--mud-palette-text-primary) 12%, transparent);
}

.rail-countdown-glance__btn--drawer[b-egmhabv38f] {
    width: 100%;
    max-width: 100%;
    min-height: 48px;
    height: auto;
    justify-content: flex-start;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 12px;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-31tpjbzc22],
.components-reconnect-repeated-attempt-visible[b-31tpjbzc22],
.components-reconnect-failed-visible[b-31tpjbzc22],
.components-pause-visible[b-31tpjbzc22],
.components-resume-failed-visible[b-31tpjbzc22],
.components-rejoining-animation[b-31tpjbzc22] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-retrying[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-failed[b-31tpjbzc22],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-31tpjbzc22] {
    display: block;
}


#components-reconnect-modal[b-31tpjbzc22] {
    background-color: var(--mud-palette-surface, #ffffff);
    color: var(--mud-palette-text-primary, #212121);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18), 0 1.5px 6px rgba(0, 0, 0, 0.12);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-31tpjbzc22 0.5s both;

    &[open] {
        animation: components-reconnect-modal-slideUp-b-31tpjbzc22 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-31tpjbzc22 0.5s ease-in-out 0.3s;
        animation-fill-mode: both;
    }
}

#components-reconnect-modal[b-31tpjbzc22]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-31tpjbzc22 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-31tpjbzc22 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-31tpjbzc22 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-31tpjbzc22 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-31tpjbzc22] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-31tpjbzc22] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-31tpjbzc22] {
    border: 0;
    background-color: var(--mud-palette-primary, #5C6BC0);
    color: var(--mud-palette-primary-contrast-text, #ffffff);
    padding: 6px 24px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s;
}

#components-reconnect-modal button:hover[b-31tpjbzc22] {
    opacity: 0.88;
}

#components-reconnect-modal button:active[b-31tpjbzc22] {
    opacity: 0.75;
}

.components-rejoining-animation[b-31tpjbzc22] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-31tpjbzc22] {
        position: absolute;
        border: 3px solid var(--mud-palette-primary, #5C6BC0);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-31tpjbzc22 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-31tpjbzc22] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-31tpjbzc22 {
    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/SidebarPinnedCountdown.razor.rz.scp.css */
/* Professional sidebar pin: single focal metric, soft wash */

.sidebar-countdown[b-cmxsw36gj0] {
    display: block;
    flex-shrink: 0;
    margin: 10px 10px 8px;
    padding: 14px 13px 12px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 85%, var(--sidebar-cd-accent) 8%);
    background:
        linear-gradient(
            165deg,
            color-mix(in srgb, var(--sidebar-cd-accent) 11%, var(--mud-palette-surface)) 0%,
            var(--mud-palette-surface) 48%,
            color-mix(in srgb, var(--mud-palette-surface) 92%, var(--mud-palette-background) 8%) 100%
        );
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 5%, transparent),
        0 4px 18px -6px color-mix(in srgb, var(--mud-palette-text-primary) 12%, transparent);
    text-decoration: none;
    color: inherit;
    transition:
        border-color 0.18s ease,
        box-shadow 0.22s ease,
        transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
    position: relative;
    overflow: hidden;
}

/* Inset ring (subtle depth, works in dark mode via variables) */
.sidebar-countdown[b-cmxsw36gj0]::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 6%, transparent);
    pointer-events: none;
}

.sidebar-countdown:hover[b-cmxsw36gj0] {
    border-color: color-mix(in srgb, var(--sidebar-cd-accent) 22%, var(--mud-palette-lines-default));
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 6%, transparent),
        0 8px 24px -8px color-mix(in srgb, var(--mud-palette-text-primary) 16%, transparent);
    transform: translateY(-1px);
}

.sidebar-countdown:focus-visible[b-cmxsw36gj0] {
    outline: 2px solid color-mix(in srgb, var(--sidebar-cd-accent) 55%, var(--mud-palette-primary));
    outline-offset: 2px;
}

.sidebar-countdown--past[b-cmxsw36gj0] {
    opacity: 0.9;
}

.sidebar-countdown__top[b-cmxsw36gj0] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 10px;
    padding-left: 2px;
    position: relative;
    z-index: 1;
}

.sidebar-countdown__icon-wrap[b-cmxsw36gj0] {
    width: 36px;
    height: 36px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--sidebar-cd-accent) 14%, transparent);
    flex-shrink: 0;
}

.sidebar-countdown__meta[b-cmxsw36gj0] {
    flex: 1;
    min-width: 0;
}

.sidebar-countdown__eyebrow[b-cmxsw36gj0] {
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: none;
    color: var(--mud-palette-text-secondary);
    opacity: 0.72;
    margin-bottom: 3px;
}

.sidebar-countdown__name[b-cmxsw36gj0] {
    font-size: 0.93rem;
    font-weight: 600;
    letter-spacing: -0.018em;
    line-height: 1.22;
    color: var(--mud-palette-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-countdown__chev[b-cmxsw36gj0] {
    color: var(--mud-palette-text-secondary);
    opacity: 0.45;
    flex-shrink: 0;
    margin-top: 3px;
}

.sidebar-countdown:hover .sidebar-countdown__chev[b-cmxsw36gj0] {
    opacity: 0.65;
}

.sidebar-countdown__metric-block[b-cmxsw36gj0] {
    position: relative;
    z-index: 1;
    padding-left: 2px;
}

.sidebar-countdown__primary[b-cmxsw36gj0] {
    font-size: 1.42rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.028em;
    line-height: 1.08;
    color: var(--sidebar-cd-accent);
}

.sidebar-countdown--past .sidebar-countdown__primary[b-cmxsw36gj0] {
    color: var(--mud-palette-text-secondary);
    font-weight: 600;
}

.sidebar-countdown__secondary[b-cmxsw36gj0] {
    font-size: 0.74rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    margin-top: 5px;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sidebar-countdown__more[b-cmxsw36gj0] {
    margin-top: 11px;
    font-size: 0.71rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--mud-palette-primary);
    padding-left: 2px;
    opacity: 0.88;
    position: relative;
    z-index: 1;
}

.sidebar-countdown--compact[b-cmxsw36gj0] {
    margin: 8px 8px 6px;
    padding: 12px 11px 11px;
    border-radius: 14px;
}

.sidebar-countdown--compact .sidebar-countdown__primary[b-cmxsw36gj0] {
    font-size: 1.28rem;
}

.sidebar-countdown--compact .sidebar-countdown__top[b-cmxsw36gj0] {
    margin-bottom: 8px;
}

@media (max-width: 767.98px) {
    .sidebar-countdown__secondary[b-cmxsw36gj0] {
        -webkit-line-clamp: 3;
    }
}
/* /Components/Notifications/NotificationsBell.razor.rz.scp.css */
/* Single stable root for Blazor (avoids multi-root fragment issues). Fixed panel stays inside. */
.notif-bell-host[b-ajfy9ry3xx] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.notif-bell[b-ajfy9ry3xx] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.notif-bell--rail[b-ajfy9ry3xx] {
    width: 44px;
    height: 44px;
}

[b-ajfy9ry3xx] .notif-bell__button--rail {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    color: var(--mud-palette-text-secondary);
}

[b-ajfy9ry3xx] .notif-bell__button--rail:hover {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
}

.notif-bell__badge[b-ajfy9ry3xx] {
    position: absolute;
    top: 6px;
    right: 6px;
    min-width: 15px;
    height: 15px;
    padding: 0 3px;
    border-radius: 8px;
    background: #EF5350;
    color: white;
    font-size: 0.6rem;
    font-weight: 700;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 1;
}

.notif-panel[b-ajfy9ry3xx] {
    position: fixed;
    top: calc(52px + env(safe-area-inset-top, 0px));
    right: 48px;
    width: 320px;
    max-height: 420px;
    overflow-y: auto;
    background: var(--mud-palette-surface);
    border-radius: 8px;
    z-index: 1200;
    display: flex;
    flex-direction: column;
}

.notif-panel--rail[b-ajfy9ry3xx] {
    top: auto;
    right: auto;
    bottom: 22px;
    left: 70px;
}

.notif-panel__header[b-ajfy9ry3xx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px 8px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    position: sticky;
    top: 0;
    background: var(--mud-palette-surface);
}

.notif-panel__header-actions[b-ajfy9ry3xx] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.notif-item[b-ajfy9ry3xx] {
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    transition: background 0.15s;
}

.notif-item:hover[b-ajfy9ry3xx] { background: var(--mud-palette-background); }
.notif-item:last-child[b-ajfy9ry3xx] { border-bottom: none; }

.notif-overlay[b-ajfy9ry3xx] {
    position: fixed;
    inset: 0;
    z-index: 1199;
}
/* /Components/Pages/CountdownsPage.razor.rz.scp.css */
.countdowns-page[b-tt8jl2rizm] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.countdowns-page__scroll[b-tt8jl2rizm] {
    flex: 1;
    overflow-y: auto;
}

.countdowns-page__header[b-tt8jl2rizm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    padding: 18px 22px !important;
}

.countdowns-page__header[b-tt8jl2rizm]  .mud-typography-h5 {
    font-weight: 600;
    letter-spacing: -0.022em;
    line-height: 1.2;
    color: var(--mud-palette-text-primary);
}

.countdowns-page__header[b-tt8jl2rizm]  .mud-typography-caption {
    opacity: 0.58;
    letter-spacing: 0.02em;
    margin-top: 5px;
    display: block;
    line-height: 1.35;
}

.countdowns-page__header[b-tt8jl2rizm]  .mud-button-root {
    text-transform: none;
    letter-spacing: 0;
    border-radius: 10px;
    font-weight: 500;
    padding: 6px 14px;
}

.countdowns-page__empty[b-tt8jl2rizm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 32px;
    gap: 4px;
}

.countdowns-grid[b-tt8jl2rizm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 18px;
    padding: 20px;
}

/* Section heading sits between owned and shared sections — quiet so it doesn't
   compete with the cards themselves. */
.countdowns-section-heading[b-tt8jl2rizm] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 22px 0;
    margin-top: 6px;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--mud-palette-text-secondary);
    opacity: 0.68;
}

/* "Shared by X · Editor" sub-line on borrowed cards. */
.countdown-card__shared-by[b-tt8jl2rizm] {
    display: flex;
    align-items: center;
    margin-top: 4px;
    font-size: 0.7rem;
    color: var(--mud-palette-text-secondary);
    opacity: 0.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ============ Card shell ============ */
.countdown-card[b-tt8jl2rizm] {
    --accent-tint: color-mix(in srgb, var(--accent) 14%, transparent);
    --accent-soft: color-mix(in srgb, var(--accent) 6%, transparent);
    --accent-line: color-mix(in srgb, var(--accent) 30%, transparent);

    position: relative;
    background: var(--mud-palette-surface);
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 90%, var(--accent) 5%);
    border-radius: 18px;
    padding: 22px 24px 18px;
    display: flex;
    flex-direction: column;
    gap: 17px;
    overflow: hidden;
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 5%, transparent),
        0 6px 22px -10px color-mix(in srgb, var(--mud-palette-text-primary) 14%, transparent);
    transition:
        transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1),
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

/* Subtle accent wash so the card carries the user's color without a harsh stripe. */
.countdown-card[b-tt8jl2rizm]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--accent-soft) 0%, transparent 55%);
    pointer-events: none;
}

/* Top accent — 2px to match sidebar pinned widget */
.countdown-card[b-tt8jl2rizm]::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--accent) 0%, color-mix(in srgb, var(--accent) 50%, transparent) 100%);
    opacity: 0.88;
}

.countdown-card:hover[b-tt8jl2rizm] {
    transform: translateY(-2px);
    border-color: var(--accent-line);
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 6%, transparent),
        0 14px 36px -12px color-mix(in srgb, var(--mud-palette-text-primary) 18%, transparent);
}

.countdown-card--past[b-tt8jl2rizm] {
    opacity: 0.6;
}

.countdown-card--past[b-tt8jl2rizm]::after {
    background: var(--mud-palette-text-secondary);
    opacity: 0.3;
}

/* ============ Header ============ */
.countdown-card__head[b-tt8jl2rizm] {
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
    z-index: 1;
}

.countdown-card__icon-wrap[b-tt8jl2rizm] {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--accent-tint);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.countdown-card__icon-wrap[b-tt8jl2rizm]  .mud-icon-root {
    font-size: 20px !important;
    width: 20px !important;
    height: 20px !important;
}

.countdown-card__title-block[b-tt8jl2rizm] {
    flex: 1;
    min-width: 0;
}

.countdown-card__title[b-tt8jl2rizm] {
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.2;
    color: var(--mud-palette-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.countdown-card__subtitle[b-tt8jl2rizm] {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--accent);
    opacity: 0.85;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.countdown-card--past .countdown-card__subtitle[b-tt8jl2rizm] {
    color: var(--mud-palette-text-secondary);
}

/* Hide actions until hover/focus so the card reads cleanly at a glance. */
.countdown-card__head-actions[b-tt8jl2rizm] {
    display: flex;
    gap: 0;
    flex-shrink: 0;
    opacity: 0;
    transform: translateX(4px);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.countdown-card:hover .countdown-card__head-actions[b-tt8jl2rizm],
.countdown-card:focus-within .countdown-card__head-actions[b-tt8jl2rizm] {
    opacity: 1;
    transform: translateX(0);
}

.countdown-card__head-actions[b-tt8jl2rizm]  .mud-button-root {
    padding: 4px;
    color: var(--mud-palette-text-secondary);
}

.countdown-card__head-actions[b-tt8jl2rizm]  .mud-button-root:hover {
    color: var(--mud-palette-text-primary);
    background: var(--mud-palette-action-default-hover);
}

/* ============ Number display (no boxes — typography + hairline dividers) ============ */
.countdown-card__display[b-tt8jl2rizm] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    padding: 6px 0 4px;
    position: relative;
    z-index: 1;
}

.countdown-card__display--allday[b-tt8jl2rizm] {
    grid-template-columns: repeat(3, 1fr);
}

.cd-unit[b-tt8jl2rizm] {
    text-align: center;
    padding: 2px 4px;
    position: relative;
}

/* Hairline vertical divider between adjacent units. */
.cd-unit + .cd-unit[b-tt8jl2rizm]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 18%;
    bottom: 18%;
    width: 1px;
    background: var(--mud-palette-lines-default);
    opacity: 0.6;
}

.cd-unit__num[b-tt8jl2rizm] {
    font-size: clamp(1.85rem, 7.2vw, 2.75rem);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    letter-spacing: -0.028em;
    color: var(--mud-palette-text-primary);
}

.cd-unit__label[b-tt8jl2rizm] {
    margin-top: 8px;
    font-size: 0.62rem;
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    opacity: 0.65;
}

/* ============ Footer ============ */
.countdown-card__foot[b-tt8jl2rizm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 12px;
    border-top: 1px solid var(--mud-palette-lines-default);
    font-size: 0.78rem;
    color: var(--mud-palette-text-secondary);
    position: relative;
    z-index: 1;
}

.countdown-card__target[b-tt8jl2rizm] {
    display: inline-flex;
    align-items: center;
}

.countdown-card__repeat[b-tt8jl2rizm] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--accent-tint);
    color: var(--accent);
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: lowercase;
    letter-spacing: 0.02em;
}

.countdown-card__notes[b-tt8jl2rizm] {
    margin-top: 2px;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--mud-palette-action-default-hover);
    font-size: 0.83rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.45;
    white-space: pre-wrap;
    position: relative;
    z-index: 1;
}

/* ============ Responsive ============ */
@media (max-width: 600px) {
    .countdowns-grid[b-tt8jl2rizm] {
        grid-template-columns: 1fr;
        padding: 14px;
        gap: 14px;
    }

    .countdown-card[b-tt8jl2rizm] {
        padding: 18px 18px 16px;
        border-radius: 16px;
    }

    .countdown-card__icon-wrap[b-tt8jl2rizm] {
        width: 34px;
        height: 34px;
    }

    .countdown-card__icon-wrap[b-tt8jl2rizm]  .mud-icon-root {
        font-size: 18px !important;
        width: 18px !important;
        height: 18px !important;
    }

    .countdown-card__title[b-tt8jl2rizm] {
        font-size: 1rem;
    }

    /* On mobile, always show actions — hover doesn't apply to touch. */
    .countdown-card__head-actions[b-tt8jl2rizm] {
        opacity: 0.85;
        transform: none;
        gap: 2px;
    }

    /* Bump the action-button hit area to ~40px so they're comfortably tappable
       without making the visible glyph any larger. Below the iOS 44px ideal but
       balances against the card's vertical density; pairs with full-card
       hit areas (the row itself doesn't navigate, only the icons). */
    .countdown-card__head-actions[b-tt8jl2rizm]  .mud-button-root {
        width: 40px !important;
        height: 40px !important;
        padding: 0 !important;
    }

    .cd-unit__label[b-tt8jl2rizm] {
        font-size: 0.58rem;
        letter-spacing: 0.1em;
    }

    .countdown-card__foot[b-tt8jl2rizm] {
        font-size: 0.74rem;
    }
}

/* Very narrow phones (≤ 360px): collapse the seconds-and-minutes pair into
   a 2×2 layout so each numeral keeps its breathing room. The all-day
   variant stays as 3 columns (only D/H/M anyway). */
@media (max-width: 360px) {
    .countdown-card__display:not(.countdown-card__display--allday)[b-tt8jl2rizm] {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 12px;
    }

    .countdown-card__display:not(.countdown-card__display--allday) .cd-unit + .cd-unit[b-tt8jl2rizm]::before {
        /* Drop hairlines on the wrapped 2×2 — they'd misalign across rows. */
        display: none;
    }

    .countdown-card__display:not(.countdown-card__display--allday) .cd-unit[b-tt8jl2rizm] {
        padding: 6px 0;
    }
}

@media (hover: none) and (pointer: coarse) {
    /* Touch devices: drop the lift hover (feels strange on tap). */
    .countdown-card:hover[b-tt8jl2rizm] {
        transform: none;
        box-shadow:
            0 1px 0 color-mix(in srgb, var(--mud-palette-text-primary) 5%, transparent),
            0 6px 22px -10px color-mix(in srgb, var(--mud-palette-text-primary) 14%, transparent);
    }

    .countdown-card__head-actions[b-tt8jl2rizm] {
        opacity: 0.85;
        transform: none;
    }
}

/* Dialog */
.cd-dialog-overlay[b-tt8jl2rizm] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.cd-dialog[b-tt8jl2rizm] {
    background: var(--mud-palette-surface);
    border-radius: 12px;
    padding: 20px 22px;
    width: 420px;
    max-width: 100%;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.cd-dialog__header[b-tt8jl2rizm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.cd-dialog__row[b-tt8jl2rizm] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cd-dialog__label[b-tt8jl2rizm] {
    font-size: 0.85rem;
    width: 60px;
    opacity: 0.7;
}

.cd-dialog__input[b-tt8jl2rizm] {
    flex: 1;
    background: var(--mud-palette-background);
    color: var(--mud-palette-text-primary);
    border: 1px solid var(--mud-palette-lines-inputs);
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 0.95rem;
    font-family: inherit;
    min-height: 40px;
    color-scheme: light dark;
}

.cd-dialog__input:focus[b-tt8jl2rizm] {
    outline: none;
    border-color: var(--mud-palette-primary);
}

.cd-dialog__switches[b-tt8jl2rizm] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cd-color-row[b-tt8jl2rizm] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.cd-color-swatch[b-tt8jl2rizm] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
    transition: transform 0.15s;
}

.cd-color-swatch:hover[b-tt8jl2rizm] { transform: scale(1.15); }

.cd-color-swatch--selected[b-tt8jl2rizm] {
    border-color: var(--mud-palette-text-primary);
    transform: scale(1.15);
}

.cd-icon-row[b-tt8jl2rizm] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.cd-icon-btn[b-tt8jl2rizm] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid transparent;
    background: var(--mud-palette-action-default-hover);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mud-palette-text-primary);
    padding: 0;
}

.cd-icon-btn:hover[b-tt8jl2rizm] {
    border-color: var(--mud-palette-primary);
}

.cd-icon-btn--selected[b-tt8jl2rizm] {
    border-color: var(--mud-palette-primary);
    background: var(--mud-palette-primary-hover);
}

.cd-dialog__footer[b-tt8jl2rizm] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

@media (max-width: 600px) {
    .cd-dialog[b-tt8jl2rizm] {
        padding: 16px;
        border-radius: 10px;
    }

    .cd-dialog__label[b-tt8jl2rizm] {
        width: 50px;
        font-size: 0.8rem;
    }

    .cd-dialog__input[b-tt8jl2rizm] {
        font-size: 16px; /* prevent iOS zoom on focus */
    }
}
/* /Components/Pages/HabitsPage.razor.rz.scp.css */
.habits-page[b-umzl13zxsn] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.habits-page__header[b-umzl13zxsn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.habits-page__empty[b-umzl13zxsn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.habits-page__list[b-umzl13zxsn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
}

.habit-card[b-umzl13zxsn] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--mud-palette-surface);
}

.habit-card__left[b-umzl13zxsn] {
    display: flex;
    align-items: center;
    flex: 1;
    padding-left: 8px;
}

.habit-card__check[b-umzl13zxsn] {
    margin-right: 4px;
}

.habit-card__info[b-umzl13zxsn] {
    flex: 1;
}

.habit-card__heatmap[b-umzl13zxsn] {
    display: flex;
    gap: 3px;
    align-items: center;
}

.habit-heatmap-cell[b-umzl13zxsn] {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    background: var(--mud-palette-lines-default);
    opacity: 0.6;
    transition: background 0.2s;
}

.habit-heatmap-cell--logged[b-umzl13zxsn] {
    opacity: 1;
}

/* Dialog */
.habit-dialog-overlay[b-umzl13zxsn] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 1300;
    display: flex;
    align-items: center;
    justify-content: center;
}

.habit-dialog[b-umzl13zxsn] {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 24px;
    width: 360px;
    max-width: 90vw;
}

.color-swatch[b-umzl13zxsn] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid transparent;
    transition: transform 0.15s;
}

.color-swatch:hover[b-umzl13zxsn] { transform: scale(1.15); }

.color-swatch--selected[b-umzl13zxsn] {
    border-color: var(--mud-palette-text-primary);
    transform: scale(1.15);
}
/* /Components/Pages/StatsPage.razor.rz.scp.css */
.stats-page[b-rgozn302dl] {
    max-width: 900px;
    margin: 0 auto;
}

.stats-cards[b-rgozn302dl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
}

.stat-card[b-rgozn302dl] {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.stat-card .mud-icon-root[b-rgozn302dl] {
    font-size: 2rem;
}

.stats-chart-card[b-rgozn302dl] {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 20px;
}
/* /Components/Pomodoro/PomodoroTimer.razor.rz.scp.css */
.pomodoro-timer[b-ny2wepgklo] {
    display: flex;
    align-items: center;
    position: relative;
}

.pomodoro-timer__btn[b-ny2wepgklo] {
    font-variant-numeric: tabular-nums;
}

.pomodoro-panel[b-ny2wepgklo] {
    position: fixed;
    top: 52px;
    right: 8px;
    width: 280px;
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 16px;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pomodoro-panel__header[b-ny2wepgklo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pomodoro-panel__modes[b-ny2wepgklo] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.pomodoro-panel__display[b-ny2wepgklo] {
    text-align: center;
}

.pomodoro-panel__time[b-ny2wepgklo] {
    font-size: 3rem;
    font-weight: 300;
    font-variant-numeric: tabular-nums;
    letter-spacing: 2px;
    line-height: 1;
    margin-bottom: 8px;
}

.pomodoro-panel__progress[b-ny2wepgklo] {
    height: 4px;
    background: var(--mud-palette-lines-default);
    border-radius: 2px;
    overflow: hidden;
}

.pomodoro-panel__progress-bar[b-ny2wepgklo] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.9s linear;
}

.pomodoro-panel__controls[b-ny2wepgklo] {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.pomodoro-panel__sessions[b-ny2wepgklo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}

@media (max-width: 767.98px) {
    .pomodoro-panel[b-ny2wepgklo] {
        top: calc(52px + env(safe-area-inset-top, 0px) + 8px);
        left: max(8px, env(safe-area-inset-left, 0px));
        right: max(8px, env(safe-area-inset-right, 0px));
        width: auto;
        max-width: none;
        padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
    }

    .pomodoro-panel__modes[b-ny2wepgklo] {
        justify-content: center;
    }

    .pomodoro-panel__modes[b-ny2wepgklo]  .mud-chip {
        min-height: 40px;
    }

    .pomodoro-panel__controls[b-ny2wepgklo]  .mud-button-root {
        min-height: 44px;
    }
}
/* /Components/Sharing/CountdownShareDialog.razor.rz.scp.css */
.share-dialog-overlay[b-wam71r851o] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 1300;
    display: flex;
    align-items: center;
    justify-content: center;
}

.share-dialog[b-wam71r851o] {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 24px;
    width: 460px;
    max-width: 92vw;
    max-height: 80vh;
    overflow-y: auto;
}

.share-member-row[b-wam71r851o] {
    display: flex;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.share-member-row:last-child[b-wam71r851o] {
    border-bottom: none;
}
/* /Components/Sharing/ShareDialog.razor.rz.scp.css */
.share-dialog-overlay[b-yoke987blg] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 1300;
    display: flex;
    align-items: center;
    justify-content: center;
}

.share-dialog[b-yoke987blg] {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 24px;
    width: 460px;
    max-width: 92vw;
    max-height: 80vh;
    overflow-y: auto;
}

.share-member-row[b-yoke987blg] {
    display: flex;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.share-member-row:last-child[b-yoke987blg] {
    border-bottom: none;
}
/* /Components/Tasks/DueDateEditorPopover.razor.rz.scp.css */
.due-date-editor-wrap[b-jtfy9fqbow] {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

/* Wraps popover content + sub-panels so reminder/repeat render in the MudPopoverProvider layer
   (above mobile task sheet z-index 1200). */
.date-popover-portal-inner[b-jtfy9fqbow] {
    position: relative;
    isolation: isolate;
}

.date-popover-dismiss[b-jtfy9fqbow] {
    position: fixed;
    inset: 0;
    z-index: 1390;
    background: transparent;
}
/*
 * Date UI: full overlay over the task body. Fully theme-aware — light in light mode, dark in dark mode.
 */
.date-popover[b-jtfy9fqbow] {
    --popover-accent: #4a8ae8;

    margin: 0;
    padding: 0;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    border: 1px solid var(--mud-palette-divider);
    background: var(--mud-palette-surface);
    overflow-x: hidden;
    overflow-y: auto;
    flex-shrink: 0;
    width: min(428px, calc(100vw - 32px));
    max-height: calc(100vh - 120px);
    max-width: 340px;
    align-self: flex-start;
}

.date-popover__tabs[b-jtfy9fqbow] {
    display: flex;
    margin: 12px 14px 0;
    padding: 4px;
    gap: 2px;
    border-radius: 10px;
    background: var(--mud-palette-background);
    box-sizing: border-box;
}

.date-popover__tab[b-jtfy9fqbow] {
    flex: 1;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    font-family: Roboto, -apple-system, sans-serif;
    cursor: pointer;
    background: transparent;
    color: var(--mud-palette-text-secondary);
}

.date-popover__tab--active[b-jtfy9fqbow] {
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
}

.date-popover__quick[b-jtfy9fqbow] {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding: 10px 14px 6px;
}

.date-popover__quick-btn[b-jtfy9fqbow] {
    color: var(--mud-palette-text-secondary) !important;
    border-radius: 10px !important;
}

.date-popover__quick-btn:hover[b-jtfy9fqbow] {
    background: var(--mud-palette-action-default-hover) !important;
}

.date-popover__quick-btn--week[b-jtfy9fqbow] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 36px;
    min-width: 36px;
    margin: 0;
    padding: 0 6px;
    border: none;
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
    color: var(--mud-palette-text-secondary);
}

.date-popover__quick-btn--week:hover[b-jtfy9fqbow] {
    background: var(--mud-palette-action-default-hover);
}

.date-popover__quick-week-icon[b-jtfy9fqbow] {
    color: var(--mud-palette-text-secondary) !important;
}

.date-popover__quick-plus[b-jtfy9fqbow] {
    font-size: 0.68rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
    line-height: 1;
    margin-left: -2px;
    transform: translateY(1px);
}

.date-popover__calendar[b-jtfy9fqbow] {
    background: transparent !important;
    width: 100%;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-static,
.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-inline-paper,
.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-content,
.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar-container,
.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-datepicker {
    width: 100% !important;
    max-width: none !important;
    box-shadow: none !important;
    background: transparent !important;
    background-color: transparent !important;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar-header {
    padding-left: 8px;
    padding-right: 8px;
}

/* Calendar month header + weekdays */
.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar-header-switch .mud-button-root.mud-icon-button {
    color: var(--mud-palette-text-primary) !important;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar-header-switch .mud-button-root:hover {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar-header-transition .mud-typography {
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
    color: var(--mud-palette-text-primary) !important;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar-header-day .mud-day-label {
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em;
    color: var(--mud-palette-text-secondary) !important;
}

/* Adjacent-month cells: show as muted */
.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar .mud-day.mud-hidden {
    opacity: 0.38 !important;
    pointer-events: auto !important;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar .mud-day:not(.mud-selected) .mud-typography {
    color: var(--mud-palette-text-primary);
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar .mud-day.mud-current:not(.mud-selected) {
    border-radius: 50% !important;
}

.date-popover__calendar[b-jtfy9fqbow]  .mud-picker-calendar .mud-day.mud-selected {
    border-radius: 50% !important;
    font-weight: 600 !important;
}

.date-popover__row[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    gap: 12px;
    padding: 12px 16px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: Roboto, -apple-system, sans-serif;
    text-align: left;
    border-top: 1px solid var(--mud-palette-divider);
}

.date-popover__row--submenu[b-jtfy9fqbow] {
    min-height: 48px;
}

.date-popover__row-icon[b-jtfy9fqbow] {
    flex-shrink: 0;
}

.date-popover__row--submenu[b-jtfy9fqbow] (.date-popover__row-icon) {
    color: var(--mud-palette-text-secondary) !important;
    opacity: 1 !important;
}

.date-popover__row--submenu[b-jtfy9fqbow] (.date-popover__row-icon--accent) {
    color: var(--popover-accent, #4a8ae8) !important;
    opacity: 1 !important;
}

.date-popover__row--active[b-jtfy9fqbow] {
    background: rgba(74, 138, 232, 0.06);
}

.date-popover__row--active:hover[b-jtfy9fqbow] {
    background: rgba(74, 138, 232, 0.12);
}

.date-popover__row-center[b-jtfy9fqbow] {
    flex: 1;
    min-width: 0;
    text-align: center;
    font-size: 0.9rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

.date-popover__row-center--accent[b-jtfy9fqbow] {
    color: var(--popover-accent, #4a8ae8);
}

.date-popover__row-center--muted[b-jtfy9fqbow] {
    color: var(--mud-palette-text-secondary);
}

.date-popover__row-center--white[b-jtfy9fqbow] {
    color: var(--mud-palette-text-primary);
}

.date-popover__row-chevron[b-jtfy9fqbow] {
    flex-shrink: 0;
}

.date-popover__row--submenu[b-jtfy9fqbow] (.date-popover__row-chevron) {
    color: var(--mud-palette-text-secondary) !important;
    opacity: 1 !important;
}

.date-popover__row--submenu[b-jtfy9fqbow] (.date-popover__row-chevron--accent) {
    color: var(--popover-accent, #4a8ae8) !important;
    opacity: 1 !important;
}

.date-popover__time-wrap[b-jtfy9fqbow] {
    padding: 8px 16px 14px;
    border-top: 1px solid var(--mud-palette-divider);
    background: var(--mud-palette-background);
}

/* List-style time picker */
.time-slot-picker[b-jtfy9fqbow] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.time-slot-picker__field[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 12px;
    border-radius: 12px;
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-divider);
}

.time-slot-picker__field-icon[b-jtfy9fqbow] {
    flex-shrink: 0;
    opacity: 0.55;
    color: var(--mud-palette-text-secondary) !important;
}

.time-slot-picker__field-value[b-jtfy9fqbow] {
    flex: 1;
    min-width: 0;
    font-size: 0.95rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--popover-accent, #4a8ae8);
    letter-spacing: 0.02em;
}

.time-slot-picker__field-placeholder[b-jtfy9fqbow] {
    flex: 1;
    font-size: 0.95rem;
    opacity: 0.35;
    color: var(--mud-palette-text-secondary);
}

.time-slot-picker__field-input[b-jtfy9fqbow] {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.95rem;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-secondary);
    letter-spacing: 0.02em;
    caret-color: var(--popover-accent, #4a8ae8);
}

.time-slot-picker__field-input--set[b-jtfy9fqbow] {
    font-weight: 500;
    color: var(--popover-accent, #4a8ae8);
}

.time-slot-picker__field-input[b-jtfy9fqbow]::placeholder {
    color: var(--mud-palette-text-secondary);
    font-weight: 400;
    opacity: 0.35;
}

.time-slot-picker__clear[b-jtfy9fqbow] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-left: auto;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
}

.time-slot-picker__clear:hover[b-jtfy9fqbow] {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
}

.time-slot-picker__list[b-jtfy9fqbow] {
    max-height: 220px;
    overflow-y: auto;
    padding: 6px;
    border-radius: 12px;
    background: var(--mud-palette-background);
    border: 1px solid var(--mud-palette-divider);
}

.time-slot-picker__item[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 10px;
    padding: 10px 12px;
    border: none;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-secondary);
    text-align: left;
}

.time-slot-picker__item:hover[b-jtfy9fqbow] {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
}

.time-slot-picker__item--selected[b-jtfy9fqbow] {
    color: var(--popover-accent, #4a8ae8);
}

.time-slot-picker__item--selected:hover[b-jtfy9fqbow] {
    color: var(--popover-accent, #4a8ae8);
}

.time-slot-picker__check[b-jtfy9fqbow] {
    flex-shrink: 0;
    color: var(--popover-accent, #4a8ae8) !important;
    opacity: 1 !important;
}

.date-popover__footer[b-jtfy9fqbow] {
    display: flex;
    gap: 12px;
    padding: 14px 16px 16px;
    border-top: 1px solid var(--mud-palette-divider);
}

.date-popover__footer-btn[b-jtfy9fqbow] {
    flex: 1;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 10px;
    font-family: Roboto, -apple-system, sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, filter 0.15s ease;
}

.date-popover__footer-btn--clear[b-jtfy9fqbow] {
    border: 1px solid var(--mud-palette-divider);
    background: transparent;
    color: var(--mud-palette-text-primary);
}

.date-popover__footer-btn--clear:hover[b-jtfy9fqbow] {
    border-color: var(--mud-palette-text-secondary);
    background: var(--mud-palette-action-default-hover);
}

.date-popover__footer-btn--ok[b-jtfy9fqbow] {
    border: none;
    background: var(--popover-accent, #4a8ae8);
    color: #fff;
    box-shadow: none;
}

.date-popover__footer-btn--ok:hover[b-jtfy9fqbow] {
    filter: brightness(1.06);
}

.date-popover__footer-btn--ok:active[b-jtfy9fqbow] {
    filter: brightness(0.97);
}

/* Duration tab: live block preview (read-only) */
.date-popover__duration-wrap[b-jtfy9fqbow] {
    padding: 12px 14px max(18px, env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
}

.duration-preview-card[b-jtfy9fqbow] {
    --duration-accent: #34d399;
    --duration-accent-dim: rgba(52, 211, 153, 0.35);
    --duration-track: rgba(255, 255, 255, 0.12);
    --duration-text: rgba(255, 255, 255, 0.92);
    --duration-muted: rgba(255, 255, 255, 0.55);
    --duration-border: rgba(148, 163, 184, 0.28);

    border-radius: 14px;
    padding: 14px 14px 16px;
    border: 1px solid var(--duration-border);
    background: linear-gradient(115deg, #2d1f4e 0%, #15121f 48%, #0c0c10 100%);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    max-width: 100%;
    min-width: 0;
}

.duration-preview-card--empty[b-jtfy9fqbow] {
    background: linear-gradient(115deg, #262038 0%, #14141a 100%);
}

.duration-preview-card--ended[b-jtfy9fqbow] {
    --duration-accent: rgba(148, 163, 184, 0.55);
    --duration-accent-dim: rgba(148, 163, 184, 0.25);
}

.duration-preview-card__header[b-jtfy9fqbow] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px 14px;
    flex-wrap: wrap;
}

.duration-preview-card__header--solo[b-jtfy9fqbow] {
    margin-bottom: 0;
}

.duration-preview-card__status[b-jtfy9fqbow] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--duration-text);
    font-family: Roboto, -apple-system, sans-serif;
}

.duration-preview-card__meta[b-jtfy9fqbow] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--duration-muted);
    font-variant-numeric: tabular-nums;
    text-align: right;
    max-width: 100%;
    line-height: 1.35;
}

.duration-preview-card__divider[b-jtfy9fqbow] {
    height: 1px;
    margin: 12px 0 14px;
    background: rgba(255, 255, 255, 0.08);
}

.duration-preview-card__body[b-jtfy9fqbow] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
    min-width: 0;
}

.duration-preview-card__check[b-jtfy9fqbow] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    border-radius: 5px;
    border: 2px solid var(--duration-muted);
    box-sizing: border-box;
}

.duration-preview-card__title[b-jtfy9fqbow] {
    flex: 1;
    min-width: 0;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--duration-text);
    font-family: Roboto, -apple-system, sans-serif;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.duration-preview-card__track-wrap[b-jtfy9fqbow] {
    margin-bottom: 8px;
}

.duration-preview-card__track[b-jtfy9fqbow] {
    height: 6px;
    border-radius: 999px;
    background: var(--duration-track);
    overflow: hidden;
}

.duration-preview-card__fill[b-jtfy9fqbow] {
    height: 100%;
    border-radius: 999px;
    min-width: 0;
    background: linear-gradient(90deg, #4ade80 0%, var(--duration-accent) 55%, #22c55e 100%);
    box-shadow: 0 0 12px var(--duration-accent-dim);
    transition: width 0.25s ease;
}

.duration-preview-card--ended .duration-preview-card__fill[b-jtfy9fqbow] {
    box-shadow: none;
    background: var(--duration-accent);
}

.duration-preview-card__times[b-jtfy9fqbow] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--duration-muted);
    font-variant-numeric: tabular-nums;
    font-family: Roboto, -apple-system, sans-serif;
}

.duration-preview-card__empty-text[b-jtfy9fqbow] {
    margin: 0 0 4px;
    font-size: 0.85rem;
    line-height: 1.45;
    color: var(--duration-muted);
    font-family: Roboto, -apple-system, sans-serif;
    text-align: left;
}

/* ── Reminder sub-panel ─────────────────────────────── */
.reminder-overlay[b-jtfy9fqbow] {
    position: fixed;
    inset: 0;
    z-index: 1500;
}

.reminder-panel[b-jtfy9fqbow] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1510;
    width: 300px;
    border-radius: 12px;
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-divider);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.reminder-panel__header[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px 12px;
}

.reminder-panel__header-icon[b-jtfy9fqbow] {
    flex-shrink: 0;
    color: var(--mud-palette-text-secondary) !important;
    opacity: 0.7;
}

.reminder-panel__title[b-jtfy9fqbow] {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-primary);
    letter-spacing: 0.01em;
}

.reminder-panel__close[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.15s, background 0.15s;
}

.reminder-panel__close:hover[b-jtfy9fqbow] {
    opacity: 1;
    background: var(--mud-palette-action-default-hover);
}

.reminder-panel__divider[b-jtfy9fqbow] {
    height: 1px;
    background: var(--mud-palette-divider);
}

.reminder-panel__option[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 13px 16px;
    border: none;
    background: transparent;
    font-size: 0.875rem;
    font-family: Roboto, -apple-system, sans-serif;
    font-weight: 400;
    color: var(--mud-palette-text-primary);
    cursor: pointer;
    text-align: left;
    transition: background 0.12s;
}

.reminder-panel__option:hover[b-jtfy9fqbow] {
    background: var(--mud-palette-action-default-hover);
}

.reminder-panel__option--selected[b-jtfy9fqbow] {
    color: var(--popover-accent, #4a8ae8);
    font-weight: 500;
}

.reminder-panel__check[b-jtfy9fqbow] {
    flex-shrink: 0;
    color: var(--popover-accent, #4a8ae8) !important;
}

.reminder-panel__custom-row[b-jtfy9fqbow] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px 12px;
}

.reminder-panel__custom-input[b-jtfy9fqbow] {
    width: 80px;
    padding: 8px 10px;
    border: 1px solid var(--mud-palette-divider);
    border-radius: 8px;
    background: var(--mud-palette-background);
    color: var(--mud-palette-text-primary);
    font-size: 0.9rem;
    font-family: Roboto, -apple-system, sans-serif;
    font-variant-numeric: tabular-nums;
    outline: none;
    transition: border-color 0.15s;
}

.reminder-panel__custom-input:focus[b-jtfy9fqbow] {
    border-color: var(--popover-accent, #4a8ae8);
}

.reminder-panel__custom-label[b-jtfy9fqbow] {
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    font-family: Roboto, -apple-system, sans-serif;
}

.reminder-panel__footer[b-jtfy9fqbow] {
    display: flex;
    gap: 10px;
    padding: 12px 16px 14px;
}

.reminder-panel__btn[b-jtfy9fqbow] {
    flex: 1;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 8px;
    font-family: Roboto, -apple-system, sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, filter 0.15s;
}

.reminder-panel__btn--cancel[b-jtfy9fqbow] {
    border: 1px solid var(--mud-palette-divider);
    background: transparent;
    color: var(--mud-palette-text-primary);
}

.reminder-panel__btn--cancel:hover[b-jtfy9fqbow] {
    background: var(--mud-palette-action-default-hover);
}

.reminder-panel__btn--ok[b-jtfy9fqbow] {
    border: none;
    background: var(--popover-accent, #4a8ae8);
    color: #fff;
}

.reminder-panel__btn--ok:hover[b-jtfy9fqbow] {
    filter: brightness(1.07);
}

@media (max-width: 767.98px) {
        .date-popover[b-jtfy9fqbow] {
            max-height: calc(100dvh - 100px);
            width: min(428px, calc(100vw - 20px));
        }
    
        .reminder-panel[b-jtfy9fqbow] {
            padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
        }
}
/* /Components/Tasks/QuickAddBar.razor.rz.scp.css */
.quick-add-bar[b-fgx097wnxt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-top: 1px solid rgba(0,0,0,0.06);
}

.quick-add-bar__icon[b-fgx097wnxt] {
    opacity: 0.4;
    flex-shrink: 0;
}

.quick-add-bar__input[b-fgx097wnxt] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.9rem;
    font-family: Roboto, sans-serif;
    color: inherit;
}

.quick-add-bar__input[b-fgx097wnxt]::placeholder {
    opacity: 0.4;
}
/* /Components/Tasks/TaskDetailPanel.razor.rz.scp.css */
.detail-panel[b-hb2euz04w1] {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
}

/* Top meta — calendar icon + single date line; flag + close */
.detail-panel__meta[b-hb2euz04w1] {
    --detail-meta-accent: #6d7f9e;

    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    min-height: 38px;
    padding: 6px 10px 6px 16px;
    gap: 12px;
    border-bottom: 1px solid var(--mud-palette-divider);
}

.detail-panel__meta-due-wrap[b-hb2euz04w1] {
    position: relative;
    display: flex;
    flex: 1;
    min-width: 0;
}

.detail-panel__meta-due[b-hb2euz04w1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 0 1 auto;
    margin: 0;
    padding: 3px 5px;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    font: inherit;
    border-radius: 6px;
    outline: none;
    box-sizing: border-box;
    width: auto;
    max-width: 100%;
}

.detail-panel__meta-due:focus-visible[b-hb2euz04w1] {
    box-shadow: 0 0 0 2px rgba(109, 127, 158, 0.3);
}

.detail-panel__meta-due:hover[b-hb2euz04w1] {
    background: var(--mud-palette-action-default-hover);
}

.detail-panel__meta-due-icon[b-hb2euz04w1] {
    flex-shrink: 0;
    opacity: 0.45;
    color: var(--detail-meta-accent) !important;
}

.detail-panel__meta-due-text[b-hb2euz04w1] {
    font-size: 0.78rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    font-family: Roboto, -apple-system, sans-serif;
    letter-spacing: 0.01em;
}

.detail-panel__meta-due--empty[b-hb2euz04w1] {
    opacity: 0.7;
}

.detail-panel__meta-due--empty .detail-panel__meta-due-text[b-hb2euz04w1] {
    opacity: 0.55;
    font-weight: 400;
}

.detail-panel__meta-due--empty .detail-panel__meta-due-icon[b-hb2euz04w1] {
    opacity: 0.4;
    color: var(--mud-palette-text-secondary) !important;
}

.detail-panel__meta-right[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 2px;
}

.detail-panel__priority-menu[b-hb2euz04w1]  .mud-icon-root {
    color: var(--priority-flag-color) !important;
}

.detail-panel__priority-button[b-hb2euz04w1]  .mud-icon-root {
    color: var(--priority-flag-color) !important;
}

.detail-panel__close[b-hb2euz04w1] {
    opacity: 0.65;
}

/* Hide close only on desktop split-pane (769px+); sheet overlay needs close */
@media (min-width: 769px) {
    .detail-panel__close[b-hb2euz04w1] {
        display: none;
    }
}

/* Week calendar bar length (detail panel, esp. touch) */
.detail-panel__calendar-block[b-hb2euz04w1] {
    flex-shrink: 0;
    padding: 8px 16px 10px;
    border-bottom: 1px solid var(--mud-palette-divider);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.detail-panel__calendar-block-label[b-hb2euz04w1] {
    opacity: 0.75;
    letter-spacing: 0.02em;
}

.detail-panel__calendar-block-select[b-hb2euz04w1] {
    max-width: 280px;
}

.detail-panel__picker-wrap[b-hb2euz04w1] {
    padding: 0 14px 10px;
    flex-shrink: 0;
}

/* Title, scroll, toolbar — date picker covers this whole region while open */
.detail-panel__main[b-hb2euz04w1] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    position: relative;
}


/* Title + more */
.detail-panel__title-row[b-hb2euz04w1] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    padding: 18px 10px 18px 16px;
    flex-shrink: 0;
}

.detail-panel__title-input[b-hb2euz04w1] {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 1.02rem;
    font-weight: 700;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-primary);
    line-height: 1.35;
    letter-spacing: -0.01em;
}

.detail-panel__title-input[b-hb2euz04w1]::placeholder {
    opacity: 0.28;
    font-weight: 600;
}

/* Scroll region — fills remaining space; content stacks from top (no huge gap) */
.detail-panel__scroll[b-hb2euz04w1] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0 16px 12px;
}

.detail-panel__section[b-hb2euz04w1] {
    margin-bottom: 10px;
}

.detail-panel__section--checklist[b-hb2euz04w1] {
    margin-bottom: 6px;
}

.detail-panel__section--comments[b-hb2euz04w1] {
    margin-top: 4px;
    margin-bottom: 0;
}

.detail-panel__check-placeholder[b-hb2euz04w1] {
    opacity: 0.35;
    flex-shrink: 0;
}

/* Notes */
.detail-panel__notes[b-hb2euz04w1] {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.82rem;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-secondary);
    resize: none;
    line-height: 1.5;
    min-height: 2.6rem;
    max-height: 6rem;
}

.detail-panel__notes[b-hb2euz04w1]::placeholder {
    opacity: 0.5;
}

/* Subtasks */
.detail-panel__subtask-row[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 0;
}

.detail-subtask--done[b-hb2euz04w1] {
    text-decoration: line-through;
    opacity: 0.4;
}

.detail-panel__add-subtask-row[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 3px 0 4px;
    border-bottom: 1px solid var(--mud-palette-divider);
    opacity: 0.62;
    transition: opacity 0.15s;
}

.detail-panel__add-subtask-row:focus-within[b-hb2euz04w1] {
    opacity: 1;
}

.detail-panel__subtask-input[b-hb2euz04w1] {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.82rem;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-secondary);
}

.detail-panel__subtask-input[b-hb2euz04w1]::placeholder {
    opacity: 0.85;
}

/* Comments */
.detail-panel__section--comments[b-hb2euz04w1] {
    border-top: 1px solid var(--mud-palette-divider);
    padding-top: 10px;
    margin-top: 10px;
}

.detail-panel__comments-list[b-hb2euz04w1] {
    max-height: 110px;
    overflow-y: auto;
    margin-bottom: 4px;
}

.detail-panel__comments-label[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    opacity: 0.5;
    margin-bottom: 8px;
}

.detail-panel__comments-count[b-hb2euz04w1] {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0;
    padding: 1px 6px;
    border-radius: 10px;
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-secondary);
}

.detail-panel__comment-icon[b-hb2euz04w1] {
    flex-shrink: 0;
    opacity: 0.4;
    color: var(--mud-palette-text-secondary) !important;
}

.detail-panel__comment-row[b-hb2euz04w1] {
    display: flex;
    align-items: flex-start;
    padding: 5px 0;
    gap: 0;
}

.detail-panel__add-comment-row[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    margin-top: 4px;
    border-radius: 8px;
    background: var(--mud-palette-action-default-hover);
    border: 1px solid var(--mud-palette-divider);
    transition: border-color 0.12s, background 0.12s;
}

.detail-panel__add-comment-row:focus-within[b-hb2euz04w1] {
    border-color: rgba(92, 107, 192, 0.4);
    background: var(--mud-palette-action-default-hover);
}

.detail-panel__comment-input[b-hb2euz04w1] {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.84rem;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-primary);
}

.detail-panel__comment-input[b-hb2euz04w1]::placeholder {
    opacity: 0.4;
}

/* List picker section */
.detail-panel__section--list-picker[b-hb2euz04w1] {
    border-top: 1px solid var(--mud-palette-divider);
    padding-top: 10px;
    margin-top: 6px;
    margin-bottom: 4px;
}

.detail-panel__list-picker-label[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    opacity: 0.5;
    margin-bottom: 8px;
}

.detail-panel__list-picker-icon[b-hb2euz04w1] {
    flex-shrink: 0;
    color: var(--mud-palette-text-secondary) !important;
}

.detail-panel__list-chips[b-hb2euz04w1] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.detail-panel__list-chip[b-hb2euz04w1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px 5px 8px;
    border: 1px solid var(--mud-palette-divider);
    border-radius: 20px;
    background: transparent;
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 500;
    font-family: Roboto, -apple-system, sans-serif;
    color: var(--mud-palette-text-secondary);
    transition: background 0.12s, border-color 0.12s, color 0.12s;
    white-space: nowrap;
    max-width: 140px;
}

.detail-panel__list-chip:hover[b-hb2euz04w1] {
    background: var(--mud-palette-action-default-hover);
    border-color: var(--mud-palette-text-disabled);
    color: var(--mud-palette-text-primary);
}

.detail-panel__list-chip--active[b-hb2euz04w1] {
    border-color: var(--chip-accent, rgba(92, 107, 192, 0.5));
    background: color-mix(in srgb, var(--chip-accent, #5c6bc0) 12%, transparent);
    color: var(--chip-accent, var(--mud-palette-primary));
    font-weight: 600;
}

.detail-panel__list-chip--active:hover[b-hb2euz04w1] {
    background: color-mix(in srgb, var(--chip-accent, #5c6bc0) 18%, transparent);
}

.detail-panel__list-chip-dot[b-hb2euz04w1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.detail-panel__list-chip-icon[b-hb2euz04w1] {
    flex-shrink: 0;
    opacity: 0.7;
    color: inherit !important;
    font-size: 0.9rem !important;
}

.detail-panel__list-chip-name[b-hb2euz04w1] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Bottom toolbar */
.detail-panel__toolbar[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    min-height: 38px;
    padding: 5px 10px;
    border-top: 1px solid var(--mud-palette-divider);
    flex-shrink: 0;
    gap: 6px;
    background: var(--mud-palette-surface);
}

.detail-panel__toolbar-item[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    min-width: 0;
}


.detail-panel__toolbar-actions[b-hb2euz04w1] {
    display: flex;
    align-items: center;
    gap: 2px;
}

.detail-panel__toolbar-chat[b-hb2euz04w1] {
    position: relative;
    display: flex;
    align-items: center;
}

.detail-panel__toolbar-badge[b-hb2euz04w1] {
    position: absolute;
    top: 2px;
    right: 2px;
    font-size: 0.6rem;
    line-height: 1;
    padding: 1px 4px;
    border-radius: 6px;
    background: rgba(92, 107, 192, 0.35);
    color: var(--mud-palette-primary);
    pointer-events: none;
}

.detail-panel__toolbar-ghost[b-hb2euz04w1] {
    opacity: 0.55;
}


/* ── Phone / touch: full-screen detail sheet ───────────────────────────── */
@media (max-width: 767.98px) {
    .detail-panel__meta[b-hb2euz04w1] {
        min-height: 52px;
        padding: 12px 14px 12px 16px;
        gap: 10px;
        align-items: flex-start;
    }

    .detail-panel__meta-due[b-hb2euz04w1] {
        min-height: 48px;
        padding: 10px 12px;
        border-radius: 10px;
    }

    .detail-panel__meta-due-text[b-hb2euz04w1] {
        font-size: 0.9rem;
        white-space: normal;
        line-height: 1.35;
    }

    .detail-panel__meta-right[b-hb2euz04w1] {
        gap: 2px;
        align-items: flex-start;
    }

    .detail-panel__meta-right[b-hb2euz04w1]  .mud-icon-button,
    .detail-panel__title-row[b-hb2euz04w1]  .mud-icon-button {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
    }

    .detail-panel__title-row[b-hb2euz04w1] {
        padding: 20px 12px 18px 16px;
        gap: 8px;
        align-items: center;
    }

    .detail-panel__title-input[b-hb2euz04w1] {
        font-size: 1.2rem;
        line-height: 1.3;
    }

    .detail-panel__scroll[b-hb2euz04w1] {
        padding: 8px 18px max(24px, env(safe-area-inset-bottom, 0px));
    }

    .detail-panel__section[b-hb2euz04w1] {
        margin-bottom: 18px;
    }

    .detail-panel__section--checklist[b-hb2euz04w1] {
        margin-bottom: 14px;
    }

    .detail-panel__subtask-row[b-hb2euz04w1] {
        min-height: 52px;
        padding: 12px 0;
        gap: 14px;
        align-items: center;
    }

    .detail-panel__subtask-row > span[b-hb2euz04w1] {
        font-size: 1rem;
        line-height: 1.45;
    }

    .detail-panel__add-subtask-row[b-hb2euz04w1] {
        min-height: 52px;
        padding: 14px 0 16px;
    }

    .detail-panel__subtask-input[b-hb2euz04w1] {
        font-size: 16px;
    }

    .detail-panel__notes[b-hb2euz04w1] {
        font-size: 16px;
        min-height: 5rem;
        max-height: 14rem;
        line-height: 1.55;
        padding: 6px 0;
    }

    .detail-panel__section--comments[b-hb2euz04w1] {
        padding-top: 18px;
        margin-top: 18px;
    }

    .detail-panel__comments-label[b-hb2euz04w1],
    .detail-panel__list-picker-label[b-hb2euz04w1] {
        font-size: 0.72rem;
        margin-bottom: 12px;
    }

    .detail-panel__comments-list[b-hb2euz04w1] {
        max-height: min(42vh, 260px);
    }

    .detail-panel__comment-row[b-hb2euz04w1] {
        padding: 10px 0;
    }

    .detail-panel__add-comment-row[b-hb2euz04w1] {
        min-height: 52px;
        padding: 12px 14px;
        gap: 12px;
        border-radius: 12px;
        align-items: center;
    }

    .detail-panel__comment-input[b-hb2euz04w1] {
        font-size: 16px;
        line-height: 1.45;
    }

    .detail-panel__comment-send:disabled[b-hb2euz04w1] {
        opacity: 0.35;
    }

    .detail-panel__section--list-picker[b-hb2euz04w1] {
        padding-top: 18px;
        margin-top: 14px;
        margin-bottom: max(12px, env(safe-area-inset-bottom, 0px));
    }

    .detail-panel__list-chips[b-hb2euz04w1] {
        gap: 10px;
    }

    .detail-panel__list-chip[b-hb2euz04w1] {
        min-height: 48px;
        padding: 12px 16px 12px 14px;
        font-size: 0.92rem;
        border-radius: 24px;
        max-width: none;
        flex: 1 1 calc(50% - 5px);
        justify-content: center;
        box-sizing: border-box;
    }

    .detail-panel__toolbar[b-hb2euz04w1] {
        min-height: 52px;
        padding: 10px 12px max(12px, env(safe-area-inset-bottom, 0px));
        gap: 8px;
    }

    .detail-panel__toolbar-actions[b-hb2euz04w1]  .mud-icon-button {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
    }

}

/* Live countdown block (only shown for tasks with both DueDate + DueTime). */
.detail-panel__countdown[b-hb2euz04w1] {
    --cd-surface: var(--mud-palette-action-default-hover);
    --cd-bar: var(--countdown-accent);
    --cd-digit: var(--countdown-accent);
    --cd-label: color-mix(in srgb, var(--countdown-accent) 55%, var(--mud-palette-text-secondary));
    --cd-foot: var(--countdown-accent);
    --cd-border: transparent;

    margin: 12px 20px 8px;
    padding: 18px 22px 16px;
    border-radius: 14px;
    border: 1px solid var(--cd-border);
    border-left: 5px solid var(--cd-bar);
    background: var(--cd-surface);
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-sizing: border-box;
}

/* Past due — pale rose card, dark red accent bar, coral type (matches reference UI). */
.detail-panel__countdown--overdue[b-hb2euz04w1] {
    --cd-surface: #fff5f5;
    --cd-bar: #c62828;
    --cd-digit: #e57373;
    --cd-label: #ef9a9a;
    --cd-foot: #e57373;
    --cd-border: rgba(198, 40, 40, 0.07);
}

.detail-panel__countdown--soon[b-hb2euz04w1] {
    --cd-surface: #fff8e1;
    --cd-bar: #f57c00;
    --cd-digit: #fb8c00;
    --cd-label: rgba(251, 140, 0, 0.82);
    --cd-foot: #f57c00;
    --cd-border: rgba(245, 124, 0, 0.1);
}

.detail-panel__countdown--future[b-hb2euz04w1] {
    --cd-surface: color-mix(in srgb, var(--countdown-accent) 10%, var(--mud-palette-background));
    --cd-bar: var(--countdown-accent);
    --cd-digit: var(--countdown-accent);
    --cd-label: color-mix(in srgb, var(--countdown-accent) 52%, var(--mud-palette-text-secondary));
    --cd-foot: var(--countdown-accent);
    --cd-border: color-mix(in srgb, var(--countdown-accent) 12%, transparent);
}

.detail-panel__countdown-grid[b-hb2euz04w1] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 10px;
    text-align: center;
    align-items: start;
}

.cd-unit-sm[b-hb2euz04w1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 6px 2px 2px;
    min-width: 0;
}

.cd-unit-sm__num[b-hb2euz04w1] {
    /* Scales down when the detail column is narrow (split layout or phone) — same 4-column grid at all widths. */
    font-size: clamp(1rem, 0.85rem + 1.1vw, 2rem);
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    color: var(--cd-digit);
    letter-spacing: 0.04em;
    font-family: Roboto, -apple-system, BlinkMacSystemFont, sans-serif;
}

.cd-unit-sm__label[b-hb2euz04w1] {
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--cd-label);
    font-family: Roboto, -apple-system, BlinkMacSystemFont, sans-serif;
}

.detail-panel__countdown-foot[b-hb2euz04w1] {
    font-size: 0.82rem;
    color: var(--cd-foot);
    text-align: center;
    font-weight: 500;
    font-family: Roboto, -apple-system, BlinkMacSystemFont, sans-serif;
    letter-spacing: 0.01em;
}
/* /Components/Tasks/TaskRow.razor.rz.scp.css */
.task-row[b-otcbfytzxa] {
    display: flex;
    align-items: center;
    padding: 5px 12px;
    cursor: pointer;
    transition: background 0.14s ease;
    gap: 8px;
    min-height: 38px;
    border-radius: 10px;
    margin: 1px 6px;
}

.task-row__schedule-drag[b-otcbfytzxa] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    color: var(--mud-palette-text-disabled);
    cursor: grab;
    touch-action: none;
}

.task-row__schedule-drag:active[b-otcbfytzxa] {
    cursor: grabbing;
}

.task-row:hover[b-otcbfytzxa] {
    background: rgba(92, 107, 192, 0.06);
}

.task-row--selected[b-otcbfytzxa] {
    background: rgba(92, 107, 192, 0.12);
}

.task-row--completed[b-otcbfytzxa] {
    opacity: 0.5;
}

.task-row--completed .task-row__title[b-otcbfytzxa] {
    text-decoration: line-through;
    text-decoration-color: rgba(0, 0, 0, 0.35);
}

/* Rounded-square checkbox */
.task-row__check[b-otcbfytzxa] {
    flex-shrink: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 8px;
    transition: background 0.12s;

    --check-color: rgba(120, 120, 130, 0.55);
    --check-bg: var(--mud-palette-primary, #5C6BC0);
}

.task-row__check:hover[b-otcbfytzxa] {
    background: rgba(128, 128, 128, 0.12);
}

.task-row__check-box[b-otcbfytzxa] {
    width: 18px;
    height: 18px;
    border-radius: 6px;
    border: 1.5px solid var(--check-color);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, border-color 0.15s ease;
    background: transparent;
}

.task-row__check:hover .task-row__check-box[b-otcbfytzxa] {
    border-color: var(--check-bg);
}

.task-row__check-box--checked[b-otcbfytzxa] {
    background: var(--check-bg);
    border-color: var(--check-bg);
}

.task-row__check-tick[b-otcbfytzxa] {
    color: #fff;
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
}

/* Priority accents */
.task-row__check--high[b-otcbfytzxa] {
    --check-color: #ef5350;
    --check-bg: #ef5350;
}

.task-row__check--medium[b-otcbfytzxa] {
    --check-color: #ffa726;
    --check-bg: #ffa726;
}

.task-row__check--low[b-otcbfytzxa] {
    --check-color: #42a5f5;
    --check-bg: #42a5f5;
}

/* Body */
.task-row__body[b-otcbfytzxa] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.task-row__title[b-otcbfytzxa] {
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
}

.task-row__subtask-badge[b-otcbfytzxa] {
    font-size: 0.7rem;
    flex-shrink: 0;
    background: rgba(128, 128, 128, 0.12);
    color: var(--mud-palette-text-secondary);
    padding: 1px 7px;
    border-radius: 999px;
    line-height: 1.5;
}

/* Right side */
.task-row__right[b-otcbfytzxa] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.task-row__list-chip[b-otcbfytzxa] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.task-row__list-dot[b-otcbfytzxa] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.task-row__list-name[b-otcbfytzxa] {
    font-size: 0.78rem;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
}

.task-row__reminder[b-otcbfytzxa] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.75rem;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
}

.task-row__date[b-otcbfytzxa] {
    font-size: 0.78rem;
    white-space: nowrap;
}

.task-row__time-left[b-otcbfytzxa] {
    font-size: 0.7rem;
    font-variant-numeric: tabular-nums;
    padding: 2px 7px;
    border-radius: 999px;
    background: rgba(128, 128, 128, 0.14);
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
    line-height: 1.5;
}

.task-row__time-left--soon[b-otcbfytzxa] {
    color: var(--mud-palette-warning);
    background: color-mix(in srgb, var(--mud-palette-warning) 22%, transparent);
}

.task-row__time-left--overdue[b-otcbfytzxa] {
    color: var(--mud-palette-error);
    background: color-mix(in srgb, var(--mud-palette-error) 22%, transparent);
    font-weight: 600;
}

/* Delete action — only visible on hover */
.task-row__actions[b-otcbfytzxa] {
    opacity: 0;
    transition: opacity 0.12s;
    flex-shrink: 0;
}

.task-row:hover .task-row__actions[b-otcbfytzxa] {
    opacity: 1;
}

@media (hover: none) and (pointer: coarse) {
    .task-row__actions[b-otcbfytzxa] {
        opacity: 1;
    }

    .task-row__schedule-drag[b-otcbfytzxa] {
        display: none !important;
    }
}

@media (max-width: 600px) {
    /* Hide chip on narrow phones — the existing date label still shows.
       Avoids cramped two-line task rows. */
    .task-row__time-left[b-otcbfytzxa] {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .task-row[b-otcbfytzxa] {
        min-height: 48px;
        padding: 10px 14px;
    }

    .task-row__check[b-otcbfytzxa] {
        padding: 8px;
        margin: -4px;
    }

    .task-row__check-box[b-otcbfytzxa] {
        width: 22px;
        height: 22px;
    }

    .task-row__title[b-otcbfytzxa] {
        font-size: 0.97rem;
    }

    .task-row__actions[b-otcbfytzxa]  .mud-icon-button {
        width: 40px !important;
        height: 40px !important;
    }
}
/* /Components/Tasks/TasksView.razor.rz.scp.css */
.tasks-view[b-d8w3u239jr] {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1 1 0%;
    min-height: 0;
    overflow: hidden;
    background: var(--mud-palette-background);
}

/* Header — title, count, and list/calendar tools in one row (TickTick-style) */
.tasks-view__header[b-d8w3u239jr] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    padding: 14px 24px 10px;
    gap: 8px 12px;
}

.tasks-view__header-left[b-d8w3u239jr] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
    width: 100%;
}

.tasks-view__title-block[b-d8w3u239jr] {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.tasks-view__date-prefix[b-d8w3u239jr] {
    font-size: 1.15rem;
    font-weight: 400;
    color: var(--mud-palette-text-secondary);
}

.tasks-view__title[b-d8w3u239jr] {
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.tasks-view__task-count[b-d8w3u239jr] {
    font-size: 0.72rem;
    background: rgba(128, 128, 128, 0.12);
    color: var(--mud-palette-text-secondary);
    padding: 2px 9px;
    border-radius: 999px;
    font-weight: 500;
}

.tasks-view__header-tools[b-d8w3u239jr] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    padding-left: 16px;
}

.tasks-view__shell-toggle[b-d8w3u239jr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 140ms ease, color 140ms ease;
}

.tasks-view__shell-toggle:hover[b-d8w3u239jr],
.tasks-view__shell-toggle:focus-visible[b-d8w3u239jr] {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
    outline: none;
}

.tasks-view__view-switcher[b-d8w3u239jr] {
    display: flex;
    align-items: center;
    gap: 2px;
    padding-left: 4px;
}

@media (max-width: 767.98px) {
    .tasks-view__shell-toggle[b-d8w3u239jr] {
        display: none;
    }
}

/* Layout — list stack fills main; with detail on desktop, grid splits list | detail */
.tasks-view__layout[b-d8w3u239jr] {
    display: flex;
    flex-direction: column;
    flex: 1 1 0%;
    align-items: stretch;
    overflow: hidden;
    position: relative;
    min-height: 0;
}

.tasks-view__list-stack[b-d8w3u239jr] {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.tasks-view__week-pane[b-d8w3u239jr] {
    display: none;
}

@media (min-width: 1200px) {
    /* List column capped so the week calendar sits beside tasks — avoid a wide empty band. */
    .tasks-view__layout--week-pane:not(.tasks-view__layout--with-detail)[b-d8w3u239jr] {
        display: grid;
        grid-template-columns: minmax(260px, min(400px, 36vw)) minmax(280px, 1fr);
        grid-template-rows: 1fr;
        align-items: stretch;
        justify-content: stretch;
        width: 100%;
        column-gap: 0;
    }

    .tasks-view__layout--week-pane:not(.tasks-view__layout--with-detail) .tasks-view__list-stack[b-d8w3u239jr] {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
        max-width: 100%;
        width: 100%;
        overflow: hidden;
    }

    .tasks-view__layout--week-pane:not(.tasks-view__layout--with-detail) .tasks-view__week-pane[b-d8w3u239jr] {
        display: flex;
        flex-direction: column;
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        border-left: 1px solid color-mix(in srgb, var(--mud-palette-divider) 65%, transparent);
    }
}

@media (min-width: 1200px) {
    .tasks-view__layout--week-pane.tasks-view__layout--with-detail[b-d8w3u239jr] {
        display: grid;
        grid-template-columns: minmax(240px, min(360px, 30vw)) minmax(220px, 1fr) clamp(260px, 28vw, 420px);
        grid-template-rows: 1fr;
        align-items: stretch;
        justify-content: stretch;
        width: 100%;
        column-gap: 0;
    }

    .tasks-view__layout--week-pane.tasks-view__layout--with-detail .tasks-view__list-stack[b-d8w3u239jr] {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
        max-width: 100%;
        width: 100%;
        overflow: hidden;
    }

    .tasks-view__layout--week-pane.tasks-view__layout--with-detail .tasks-view__week-pane[b-d8w3u239jr] {
        display: flex;
        flex-direction: column;
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        border-left: 1px solid color-mix(in srgb, var(--mud-palette-divider) 65%, transparent);
    }

    .tasks-view__layout--week-pane.tasks-view__layout--with-detail .tasks-view__detail-col[b-d8w3u239jr] {
        grid-column: 3;
        grid-row: 1;
    }
}

@media (min-width: 769px) {
    .tasks-view__layout--with-detail:not(.tasks-view__layout--week-pane)[b-d8w3u239jr] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) clamp(320px, 36vw, 520px);
        grid-template-rows: 1fr;
        align-items: stretch;
    }

    .tasks-view__layout--with-detail:not(.tasks-view__layout--week-pane) .tasks-view__list-stack[b-d8w3u239jr] {
        grid-column: 1;
        grid-row: 1;
        min-height: 0;
        overflow: hidden;
    }

    .tasks-view__layout--with-detail:not(.tasks-view__layout--week-pane) .tasks-view__detail-col[b-d8w3u239jr] {
        grid-column: 2;
        grid-row: 1;
    }
}

/* Task list pane */
.tasks-view__list-col[b-d8w3u239jr] {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: min(260px, 100%);
    min-height: 0;
}

.tasks-view__list-scroll[b-d8w3u239jr] {
    flex: 1 1 0;
    overflow-y: auto;
    min-height: 0;
    padding-bottom: 16px;
}


/* MudDropZone can collapse to 0 height when flex parents use auto basis — keep a floor for hit-testing */
.tasks-view__drop-zone[b-d8w3u239jr] {
    min-height: 48px;
}

/* Add task row — rounded pill. Renders as a <form> so iOS soft-keyboard
   "return" submits via the native form-submit path (more reliable than
   listening for Enter on keydown when autocorrect is in flight). */
.tasks-view__add-row[b-d8w3u239jr] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    margin: 4px 16px 12px;
    background: rgba(128, 128, 128, 0.07);
    border-radius: 10px;
    cursor: text;
    transition: background 0.14s ease, box-shadow 0.14s ease;
}

.tasks-view__add-row:hover[b-d8w3u239jr] {
    background: rgba(128, 128, 128, 0.11);
}

.tasks-view__add-row:focus-within[b-d8w3u239jr] {
    background: var(--mud-palette-surface);
    box-shadow: 0 0 0 1.5px var(--mud-palette-primary, #5C6BC0) inset;
}

.tasks-view__add-icon[b-d8w3u239jr] {
    opacity: 0.45;
    flex-shrink: 0;
}

.tasks-view__add-input[b-d8w3u239jr] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.88rem;
    font-family: inherit;
    color: var(--mud-palette-text-primary);
}

.tasks-view__add-input[b-d8w3u239jr]::placeholder {
    color: var(--mud-palette-text-secondary);
    opacity: 0.7;
}

.tasks-view__add-due[b-d8w3u239jr] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    margin: 0;
    padding: 4px 6px 4px 8px;
    border: none;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    transition: background 0.12s ease, color 0.12s ease;
    -webkit-appearance: none;
    appearance: none;
}

.tasks-view__add-due:hover[b-d8w3u239jr] {
    background: rgba(128, 128, 128, 0.12);
}

.tasks-view__add-due--set[b-d8w3u239jr] {
    color: var(--mud-palette-primary, #5C6BC0);
}

.tasks-view__add-due--set .tasks-view__add-due-icon[b-d8w3u239jr],
.tasks-view__add-due--set .tasks-view__add-due-chevron[b-d8w3u239jr] {
    color: var(--mud-palette-primary, #5C6BC0);
}

.tasks-view__add-due-icon[b-d8w3u239jr],
.tasks-view__add-due-chevron[b-d8w3u239jr] {
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
    opacity: 0.85;
}

.tasks-view__add-due-chevron[b-d8w3u239jr] {
    opacity: 0.65;
    margin-left: -2px;
}

.tasks-view__add-due-label[b-d8w3u239jr] {
    white-space: nowrap;
}

/* Submit button — gives touch users a tap target alongside the keyboard's return key.
   Hidden visually until there's something to submit, but always present in the form
   so iOS treats Enter as an implicit submit. */
.tasks-view__add-submit[b-d8w3u239jr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 8px;
    background: var(--mud-palette-primary, #5C6BC0);
    color: #fff;
    cursor: pointer;
    transition: background 0.12s ease, opacity 0.12s ease, transform 0.08s ease;
    -webkit-appearance: none;
    appearance: none;
    opacity: 0;
    pointer-events: none;
}

.tasks-view__add-row:focus-within .tasks-view__add-submit[b-d8w3u239jr],
.tasks-view__add-submit:not(:disabled)[b-d8w3u239jr] {
    opacity: 1;
    pointer-events: auto;
}

.tasks-view__add-submit:disabled[b-d8w3u239jr] {
    opacity: 0;
    pointer-events: none;
}

.tasks-view__add-submit:hover:not(:disabled)[b-d8w3u239jr] {
    background: var(--mud-palette-primary-darken, #4a59ad);
}

.tasks-view__add-submit:active:not(:disabled)[b-d8w3u239jr] {
    transform: scale(0.95);
}

.tasks-view__add-submit .mud-icon-root[b-d8w3u239jr] {
    color: #fff;
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
}

/* Touch devices: enlarge the submit hit area to Apple's 44pt guideline. */
@media (hover: none) and (pointer: coarse) {
    .tasks-view__add-submit[b-d8w3u239jr] {
        width: 40px;
        height: 40px;
    }
}

/* Group headers — quiet, no sticky border */
.tasks-view__group-header[b-d8w3u239jr] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 14px 22px 6px;
    cursor: pointer;
    user-select: none;
    background: transparent;
    transition: opacity 0.12s;
}

.tasks-view__group-header:hover[b-d8w3u239jr] {
    opacity: 0.85;
}

.tasks-view__group-header--overdue .tasks-view__group-label[b-d8w3u239jr] {
    color: #ef5350;
}

.tasks-view__group-chevron[b-d8w3u239jr] {
    opacity: 0.35;
    flex-shrink: 0;
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
}

.tasks-view__group-label[b-d8w3u239jr] {
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.005em;
}

.tasks-view__group-count[b-d8w3u239jr] {
    font-size: 0.7rem;
    color: var(--mud-palette-text-secondary);
    padding: 0 4px;
    font-weight: 500;
    opacity: 0.7;
}

.tasks-view__postpone-btn[b-d8w3u239jr] {
    font-size: 0.75rem;
    color: var(--mud-palette-primary, #5C6BC0);
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 6px;
    transition: background 0.12s;
}

.tasks-view__postpone-btn:hover[b-d8w3u239jr] {
    background: rgba(92, 107, 192, 0.12);
}

/* Empty state */
.tasks-view__empty[b-d8w3u239jr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    opacity: 0.6;
}

/* Right-hand detail panel — in-flow column on desktop; full-screen sheet on small screens */
.tasks-view__detail-col[b-d8w3u239jr] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    flex: none;
    border-left: 1px solid var(--mud-palette-divider);
    overflow: hidden;
    background: var(--mud-palette-surface);
}

.tasks-view__detail-col > *[b-d8w3u239jr] {
    flex: 1 1 auto;
    min-height: 0;
}

@media (max-width: 768px) {
    .tasks-view__layout--with-detail[b-d8w3u239jr] {
        flex: 1;
        min-height: 0;
    }

    .tasks-view__detail-col[b-d8w3u239jr] {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        max-width: none;
        min-width: 0;
        height: auto;
        z-index: 1200;
        border-left: none;
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    .tasks-view__backdrop[b-d8w3u239jr] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0, 0, 0.35);
        z-index: 1199;
    }

    .tasks-view__list-col[b-d8w3u239jr] {
        min-width: 0;
    }
}

@media (min-width: 769px) {
    .tasks-view__backdrop[b-d8w3u239jr] {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .tasks-view__add-input[b-d8w3u239jr] {
        font-size: 16px;
    }
}
/* /Components/Tasks/Views/CalendarView.razor.rz.scp.css */
.calendar-view[b-sti16xnyft] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.calendar-view__nav[b-sti16xnyft] {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    gap: 4px;
}

.calendar-view__month-label[b-sti16xnyft] {
    min-width: 160px;
    text-align: center;
    font-weight: 500;
}

.calendar-view__grid[b-sti16xnyft] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    flex: 1;
    overflow-y: auto;
    border-top: 1px solid var(--mud-palette-divider);
}

.calendar-view__dow[b-sti16xnyft] {
    padding: 6px 8px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    opacity: 0.5;
    text-align: center;
    border-bottom: 1px solid var(--mud-palette-divider);
}

.calendar-view__day[b-sti16xnyft] {
    min-height: 90px;
    padding: 4px 6px;
    border-right: 1px solid var(--mud-palette-divider);
    border-bottom: 1px solid var(--mud-palette-divider);
    overflow: hidden;
}

.calendar-view__day--empty[b-sti16xnyft] {
    background: transparent;
}

.calendar-view__day--today[b-sti16xnyft] {
    background: rgba(92, 107, 192, 0.05);
}

.calendar-view__day-num[b-sti16xnyft] {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 500;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    border-radius: 50%;
    margin-bottom: 2px;
}

.calendar-view__day-num--today[b-sti16xnyft] {
    background: #5C6BC0;
    color: #fff;
}

.calendar-view__chip[b-sti16xnyft] {
    font-size: 0.72rem;
    padding: 1px 6px;
    border-radius: 4px;
    margin-bottom: 2px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: rgba(92, 107, 192, 0.15);
    color: inherit;
    border-left: 3px solid #5C6BC0;
    transition: opacity 0.15s;
}

.calendar-view__chip:hover[b-sti16xnyft] { opacity: 0.75; }

.calendar-view__chip--high[b-sti16xnyft] { border-left-color: #ef5350; background: rgba(239, 83, 80, 0.1); }
.calendar-view__chip--medium[b-sti16xnyft] { border-left-color: #ffa726; background: rgba(255, 167, 38, 0.1); }
.calendar-view__chip--low[b-sti16xnyft] { border-left-color: #42a5f5; background: rgba(66, 165, 245, 0.1); }

.calendar-view__chip--recurring[b-sti16xnyft] {
    border-left-style: dashed;
}

.calendar-view__chip-repeat[b-sti16xnyft] {
    display: inline-block;
    margin-right: 3px;
    font-size: 0.65rem;
    opacity: 0.75;
    vertical-align: middle;
}

.calendar-view__more[b-sti16xnyft] {
    font-size: 0.68rem;
    opacity: 0.5;
    padding-left: 2px;
}
/* /Components/Tasks/Views/KanbanView.razor.rz.scp.css */
.kanban-view[b-mn1nd9dsmz] {
    height: 100%;
    overflow: hidden;
}

.kanban-view__board[b-mn1nd9dsmz] {
    display: flex;
    gap: 16px;
    height: 100%;
    padding: 16px;
    overflow-x: auto;
}

.kanban-view__col[b-mn1nd9dsmz] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 260px;
    max-width: 340px;
    background: var(--mud-palette-background-grey);
    border-radius: 10px;
    overflow: hidden;
}

.kanban-view__col-header[b-mn1nd9dsmz] {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    border-bottom: 1px solid var(--mud-palette-divider);
    gap: 8px;
}

.kanban-view__zone[b-mn1nd9dsmz] {
    flex: 1;
    padding: 8px;
    overflow-y: auto;
    min-height: 200px;
}

.kanban-card[b-mn1nd9dsmz] {
    background: var(--mud-palette-surface);
    border-radius: 8px;
    padding: 10px 12px;
    margin-bottom: 8px;
    cursor: pointer;
    border-left: 4px solid transparent;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    transition: box-shadow 0.15s, transform 0.1s;
}

.kanban-card:hover[b-mn1nd9dsmz] {
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
    transform: translateY(-1px);
}

.kanban-card--high[b-mn1nd9dsmz]    { border-left-color: #ef5350; }
.kanban-card--medium[b-mn1nd9dsmz]  { border-left-color: #ffa726; }
.kanban-card--low[b-mn1nd9dsmz]     { border-left-color: #42a5f5; }

.kanban-card__title[b-mn1nd9dsmz] {
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 6px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.kanban-card__due[b-mn1nd9dsmz],
.kanban-card__subtasks[b-mn1nd9dsmz] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.72rem;
    opacity: 0.6;
    margin-top: 4px;
}

.kanban-card__due--overdue[b-mn1nd9dsmz] {
    color: #ef5350;
    opacity: 1;
}
/* /Components/Tasks/Views/MatrixView.razor.rz.scp.css */
.matrix-view[b-lsmptnxcfh] {
    height: 100%;
    overflow: auto;
    padding: 16px;
}

.matrix-view__grid[b-lsmptnxcfh] {
    display: grid;
    grid-template-columns: 36px 1fr 1fr;
    grid-template-rows: 36px 1fr 1fr;
    gap: 12px;
    min-height: calc(100% - 32px);
}

.matrix-view__corner[b-lsmptnxcfh] {
    grid-column: 1;
    grid-row: 1;
}

.matrix-view__axis[b-lsmptnxcfh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    opacity: 0.7;
}

.matrix-view__axis--side[b-lsmptnxcfh] {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    justify-content: center;
}

.matrix-view__quadrant[b-lsmptnxcfh] {
    border-radius: 12px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.matrix-view__q1[b-lsmptnxcfh] { background: rgba(239, 83, 80, 0.08); border: 1px solid rgba(239,83,80,0.2); }
.matrix-view__q2[b-lsmptnxcfh] { background: rgba(92, 107, 192, 0.08); border: 1px solid rgba(92,107,192,0.2); }
.matrix-view__q3[b-lsmptnxcfh] { background: rgba(255, 167, 38, 0.08); border: 1px solid rgba(255,167,38,0.2); }
.matrix-view__q4[b-lsmptnxcfh] { background: rgba(0,0,0,0.03); border: 1px solid var(--mud-palette-divider); }

.matrix-view__q-header[b-lsmptnxcfh] {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}

.matrix-view__q-label[b-lsmptnxcfh] {
    font-size: 0.85rem;
    font-weight: 600;
}

.matrix-view__q-sub[b-lsmptnxcfh] {
    font-size: 0.68rem;
    opacity: 0.5;
}

.matrix-view__q-items[b-lsmptnxcfh] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.matrix-view__empty[b-lsmptnxcfh] {
    font-size: 0.75rem;
    opacity: 0.3;
    font-style: italic;
}

.matrix-chip[b-lsmptnxcfh] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    padding: 4px 8px;
    border-radius: 6px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: opacity 0.15s;
}

.matrix-chip:hover[b-lsmptnxcfh] { opacity: 0.7; }

.matrix-chip--q1[b-lsmptnxcfh] { background: rgba(239,83,80,0.15); }
.matrix-chip--q2[b-lsmptnxcfh] { background: rgba(92,107,192,0.15); }
.matrix-chip--q3[b-lsmptnxcfh] { background: rgba(255,167,38,0.15); }
.matrix-chip--q4[b-lsmptnxcfh] { background: rgba(0,0,0,0.06); }
/* /Components/Tasks/Views/TimelineView.razor.rz.scp.css */
:root[b-jog7sm6e3o] {
    --tl-col-w: 36px;
    --tl-row-h: 38px;
    --tl-label-w: 180px;
}

.timeline-view[b-jog7sm6e3o] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.timeline-view__nav[b-jog7sm6e3o] {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    gap: 4px;
    flex-shrink: 0;
}

.timeline-view__month-label[b-jog7sm6e3o] {
    min-width: 160px;
    text-align: center;
    font-weight: 500;
}

.timeline-view__scroll-wrap[b-jog7sm6e3o] {
    flex: 1;
    overflow: auto;
    position: relative;
}

/* Header row */
.timeline-view__header[b-jog7sm6e3o] {
    display: flex;
    align-items: stretch;
    border-bottom: 2px solid var(--mud-palette-divider);
    position: sticky;
    top: 0;
    background: var(--mud-palette-surface);
    z-index: 2;
}

.timeline-view__label-col[b-jog7sm6e3o] {
    width: var(--tl-label-w);
    flex-shrink: 0;
    border-right: 1px solid var(--mud-palette-divider);
}

.timeline-view__day-header[b-jog7sm6e3o] {
    width: var(--tl-col-w);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px 0;
    font-size: 0.65rem;
    border-right: 1px solid var(--mud-palette-divider);
}

.timeline-view__day-header--weekend[b-jog7sm6e3o] { background: rgba(0,0,0,0.025); }
.timeline-view__day-header--today[b-jog7sm6e3o] { background: rgba(92,107,192,0.08); }

.timeline-view__day-dow[b-jog7sm6e3o] { opacity: 0.5; font-weight: 600; text-transform: uppercase; }

.timeline-view__day-num[b-jog7sm6e3o] {
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 500;
    margin-top: 2px;
}

.timeline-view__day-num--today[b-jog7sm6e3o] {
    background: #5C6BC0;
    color: #fff;
}

/* Today vertical line */
.timeline-view__today-line[b-jog7sm6e3o] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(92,107,192,0.4);
    pointer-events: none;
    z-index: 1;
}

/* Task rows */
.timeline-view__row[b-jog7sm6e3o] {
    display: flex;
    align-items: center;
    height: var(--tl-row-h);
    border-bottom: 1px solid var(--mud-palette-divider);
    cursor: pointer;
    transition: background 0.1s;
}

.timeline-view__row:hover[b-jog7sm6e3o] { background: rgba(0,0,0,0.02); }

.timeline-view__row--undated[b-jog7sm6e3o] { opacity: 0.65; }

.timeline-view__label[b-jog7sm6e3o] {
    width: var(--tl-label-w);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px;
    overflow: hidden;
    border-right: 1px solid var(--mud-palette-divider);
}

.timeline-view__priority-dot[b-jog7sm6e3o] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.priority-high[b-jog7sm6e3o]    { background: #ef5350; }
.priority-medium[b-jog7sm6e3o]  { background: #ffa726; }
.priority-low[b-jog7sm6e3o]     { background: #42a5f5; }
.priority-none[b-jog7sm6e3o]    { background: #bdbdbd; }

.timeline-view__task-name[b-jog7sm6e3o] {
    font-size: 0.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.timeline-view__track[b-jog7sm6e3o] {
    display: flex;
    align-items: center;
}

.timeline-view__track--undated[b-jog7sm6e3o] {
    padding-left: 8px;
}

.timeline-view__cell[b-jog7sm6e3o] {
    width: var(--tl-col-w);
    height: var(--tl-row-h);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid rgba(0,0,0,0.04);
    position: relative;
}

.timeline-view__cell--due[b-jog7sm6e3o] { background: rgba(92,107,192,0.06); }
.timeline-view__cell--overdue[b-jog7sm6e3o] { background: rgba(239,83,80,0.06); }

.timeline-view__milestone[b-jog7sm6e3o] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}

.timeline-view__milestone--high[b-jog7sm6e3o]     { background: #ef5350; }
.timeline-view__milestone--medium[b-jog7sm6e3o]   { background: #ffa726; }
.timeline-view__milestone--low[b-jog7sm6e3o]      { background: #42a5f5; }
.timeline-view__milestone--default[b-jog7sm6e3o]  { background: #5C6BC0; }
.timeline-view__milestone--overdue[b-jog7sm6e3o]  { background: #ef5350; border: 2px solid #b71c1c; }

.timeline-view__section-header[b-jog7sm6e3o] {
    padding: 12px 16px 4px;
    background: var(--mud-palette-background-grey);
    border-bottom: 1px solid var(--mud-palette-divider);
}

.timeline-view__empty[b-jog7sm6e3o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
}
/* /Components/Tasks/Views/WeekCalendarStrip.razor.rz.scp.css */
.week-cal[b-v8hf5zyha3] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    height: 100%;
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
}

.week-cal__toolbar[b-v8hf5zyha3] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    flex-shrink: 0;
    padding: 8px 10px 6px;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-divider) 65%, transparent);
}

.week-cal__nav[b-v8hf5zyha3] {
    display: flex;
    align-items: center;
    gap: 0;
}

.week-cal__icon-btn[b-v8hf5zyha3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--mud-palette-text-secondary);
    cursor: pointer;
}

.week-cal__icon-btn:hover[b-v8hf5zyha3],
.week-cal__icon-btn:focus-visible[b-v8hf5zyha3] {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
    outline: none;
}

.week-cal__title[b-v8hf5zyha3] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    flex: 1 1 120px;
    padding-left: 4px;
}

.week-cal__touch-hint[b-v8hf5zyha3] {
    flex: 1 1 100%;
    order: 10;
    font-size: 0.68rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    line-height: 1.25;
    padding: 2px 0 0;
}

.week-cal__title-main[b-v8hf5zyha3] {
    font-size: 0.92rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.week-cal__title-wk[b-v8hf5zyha3] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
    opacity: 0.85;
}

.week-cal__today-text[b-v8hf5zyha3] {
    border: 0;
    background: transparent;
    color: var(--mud-palette-primary);
    font: inherit;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: none;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 8px;
}

.week-cal__today-text:hover[b-v8hf5zyha3],
.week-cal__today-text:focus-visible[b-v8hf5zyha3] {
    background: var(--mud-palette-action-default-hover);
    outline: none;
}

.week-cal__header-row[b-v8hf5zyha3] {
    display: grid;
    grid-template-columns: 44px repeat(7, minmax(0, 1fr));
    flex-shrink: 0;
    padding: 4px 0 2px;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-divider) 50%, transparent);
}

.week-cal__corner[b-v8hf5zyha3] {
    min-width: 0;
}

.week-cal__dow-cell[b-v8hf5zyha3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-width: 0;
    padding: 4px 2px;
}

.week-cal__dow-name[b-v8hf5zyha3] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--mud-palette-text-secondary);
}

.week-cal__dow-num[b-v8hf5zyha3] {
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.2;
}

.week-cal__dow-num--badge[b-v8hf5zyha3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text, #fff);
}

.week-cal__dow-cell--today .week-cal__dow-name[b-v8hf5zyha3] {
    color: var(--mud-palette-primary);
}

.week-cal__allday[b-v8hf5zyha3] {
    display: grid;
    grid-template-columns: 44px repeat(7, minmax(0, 1fr));
    flex-shrink: 0;
    min-height: 36px;
    max-height: 120px;
    overflow-y: auto;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-divider) 50%, transparent);
    font-size: 0.7rem;
}

.week-cal__allday-label[b-v8hf5zyha3] {
    padding: 6px 4px;
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mud-palette-text-secondary);
    align-self: start;
}

.week-cal__allday-col[b-v8hf5zyha3] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 4px 3px;
    min-width: 0;
    border-left: 1px solid color-mix(in srgb, var(--mud-palette-divider) 40%, transparent);
}

/* All-day row: full-width card + drag grip (grip stays outside <button> for valid HTML). */
.week-cal__allday-item[b-v8hf5zyha3] {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
    min-width: 0;
    width: 100%;
    border-radius: 6px;
    border-left: 3px solid var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 20%, var(--mud-palette-surface));
    color: var(--mud-palette-text-primary);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: filter 0.12s ease, box-shadow 0.12s ease;
}

.week-cal__allday-item:hover[b-v8hf5zyha3] {
    filter: brightness(1.04);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.mud-theme-dark .week-cal__allday-item[b-v8hf5zyha3] {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.28);
}

.week-cal__allday-item--done[b-v8hf5zyha3] {
    opacity: 0.45;
    border-left-color: var(--mud-palette-text-disabled);
    background: color-mix(in srgb, var(--mud-palette-text-disabled) 10%, var(--mud-palette-surface));
}

.week-cal__allday-item--done .week-cal__allday-chip[b-v8hf5zyha3] {
    text-decoration: line-through;
}

.week-cal__chip-grip[b-v8hf5zyha3] {
    flex: 0 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1px;
    cursor: grab;
    color: var(--mud-palette-text-disabled);
    user-select: none;
    touch-action: none;
    opacity: 0.55;
    transition: opacity 0.12s ease, background 0.12s ease;
}

.week-cal__chip-grip:hover[b-v8hf5zyha3] {
    opacity: 0.95;
    background: color-mix(in srgb, var(--mud-palette-text-primary) 6%, transparent);
}

.week-cal__chip-grip:active[b-v8hf5zyha3] {
    cursor: grabbing;
}

.week-cal__chip-grip[b-v8hf5zyha3]  .mud-icon-root {
    font-size: 14px !important;
}

.week-cal__allday-chip[b-v8hf5zyha3] {
    display: block;
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: 5px 8px 5px 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 0.72rem;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    line-height: 1.25;
}

.week-cal__allday-chip:hover[b-v8hf5zyha3] {
    filter: none;
}

.week-cal__more[b-v8hf5zyha3] {
    font-size: 0.65rem;
    color: var(--mud-palette-text-secondary);
    padding-left: 2px;
}

.week-cal__body[b-v8hf5zyha3] {
    flex: 1 1 0;
    min-height: 0;
    position: relative;
    display: grid;
    grid-template-columns: 44px repeat(7, minmax(0, 1fr));
    overflow-y: auto;
    --week-cal-hours: 16;
}

.week-cal__times[b-v8hf5zyha3] {
    position: relative;
    border-right: 1px solid color-mix(in srgb, var(--mud-palette-divider) 40%, transparent);
}

.week-cal__time-label[b-v8hf5zyha3] {
    position: absolute;
    right: 4px;
    transform: translateY(-50%);
    font-size: 0.62rem;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
}

.week-cal__day-col[b-v8hf5zyha3] {
    position: relative;
    border-left: 1px solid color-mix(in srgb, var(--mud-palette-divider) 35%, transparent);
    min-width: 0;
}

.week-cal__grid-lines[b-v8hf5zyha3] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.week-cal__hour-line[b-v8hf5zyha3] {
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    border-top: 1px solid color-mix(in srgb, var(--mud-palette-divider) 35%, transparent);
}

/* Timed block: vertical span in the grid; row = grip + body; resize strips on top/bottom. */
.week-cal__block-wrap[b-v8hf5zyha3] {
    position: absolute;
    left: 1px;
    right: 1px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    border-radius: 6px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 35%, transparent);
    border-left: 3px solid var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 14%, var(--mud-palette-surface));
    color: var(--mud-palette-text-primary);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    z-index: 0;
    transition: filter 0.12s ease, box-shadow 0.12s ease;
}

.mud-theme-dark .week-cal__block-wrap[b-v8hf5zyha3] {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}

.week-cal__block-wrap:hover[b-v8hf5zyha3] {
    filter: brightness(1.02);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    z-index: 2;
}

.week-cal__block-wrap--done[b-v8hf5zyha3] {
    opacity: 0.4;
    border-left-color: var(--mud-palette-text-disabled);
    border-color: color-mix(in srgb, var(--mud-palette-text-disabled) 25%, transparent);
    background: color-mix(in srgb, var(--mud-palette-text-disabled) 8%, var(--mud-palette-surface));
}

.week-cal__block-wrap--done:hover[b-v8hf5zyha3] {
    opacity: 0.65;
}

.week-cal__block-wrap--done .week-cal__block-title[b-v8hf5zyha3] {
    text-decoration: line-through;
}

.week-cal__block-wrap--resizing[b-v8hf5zyha3] {
    z-index: 6;
    filter: none;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    transition: none;
}

/* Real block hidden while JS shows a non-Blazor ghost (see week-cal-resize.js). */
.week-cal__block-wrap[data-slate-resize-active="1"][b-v8hf5zyha3] {
    opacity: 0 !important;
}

.mud-theme-dark .week-cal__block-wrap--resizing[b-v8hf5zyha3] {
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
}

/* Invisible hit strips; subtle tint only on hover / active resize (no purple bars). */
.week-cal__block-resize[b-v8hf5zyha3] {
    position: absolute;
    left: 0;
    right: 0;
    height: 9px;
    z-index: 4;
    cursor: ns-resize;
    touch-action: none;
    background: transparent;
}

.week-cal__block-resize--top[b-v8hf5zyha3] {
    top: 0;
    border-radius: 6px 6px 0 0;
}

.week-cal__block-resize--bottom[b-v8hf5zyha3] {
    bottom: 0;
    border-radius: 0 0 6px 6px;
}

.week-cal__block-resize--top:hover[b-v8hf5zyha3] {
    background: linear-gradient(
        to bottom,
        color-mix(in srgb, var(--mud-palette-text-primary) 14%, transparent),
        transparent
    );
}

/* While dragging, do not tint strips (reads as a purple "spot" on a thin block). */
.week-cal__block-wrap--resizing .week-cal__block-resize--top[b-v8hf5zyha3],
.week-cal__block-wrap--resizing .week-cal__block-resize--bottom[b-v8hf5zyha3] {
    background: transparent !important;
}

.week-cal__block-resize--bottom:hover[b-v8hf5zyha3] {
    background: linear-gradient(
        to top,
        color-mix(in srgb, var(--mud-palette-text-primary) 14%, transparent),
        transparent
    );
}

.week-cal__block-row[b-v8hf5zyha3] {
    flex: 1 1 0;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    min-height: 0;
    padding: 4px 0;
}

.week-cal__block-wrap--dense[b-v8hf5zyha3] {
    border-radius: 4px;
}

.week-cal__block-wrap--dense .week-cal__block-resize[b-v8hf5zyha3] {
    left: 6px;
    right: 6px;
    height: 6px;
}

.week-cal__block-wrap--dense .week-cal__block-row[b-v8hf5zyha3] {
    flex: 1 1 0;
    padding: 2px 4px;
    align-items: center;
    min-height: 0;
}

.week-cal__block--dense-move[b-v8hf5zyha3] {
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 3px 5px !important;
}

.week-cal__block--dense-move .week-cal__block-title[b-v8hf5zyha3] {
    flex: 0 0 auto;
    min-width: 0;
    font-size: 0.68rem;
    line-height: 1.15;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.week-cal__block--dense-move .week-cal__block-time[b-v8hf5zyha3] {
    flex-shrink: 0;
    font-size: 0.58rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    opacity: 0.95;
    color: color-mix(in srgb, var(--mud-palette-primary) 58%, var(--mud-palette-text-secondary));
}

.week-cal__block-grip[b-v8hf5zyha3] {
    flex: 0 0 18px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 2px;
    cursor: grab;
    color: var(--mud-palette-text-disabled);
    user-select: none;
    touch-action: none;
    opacity: 0.5;
    transition: opacity 0.12s ease, background 0.12s ease;
}

.week-cal__block-grip:hover[b-v8hf5zyha3] {
    opacity: 0.95;
    background: color-mix(in srgb, var(--mud-palette-text-primary) 5%, transparent);
}

.week-cal__block-grip:active[b-v8hf5zyha3] {
    cursor: grabbing;
}

.week-cal__block-grip[b-v8hf5zyha3]  .mud-icon-root {
    font-size: 14px !important;
}

.week-cal__block[b-v8hf5zyha3] {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    height: auto;
    align-self: stretch;
    margin: 0;
    padding: 2px 6px 2px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 2px;
    line-height: 1.2;
}

.week-cal__block-title[b-v8hf5zyha3] {
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.week-cal__block-time[b-v8hf5zyha3] {
    font-size: 0.66rem;
    font-weight: 600;
    opacity: 0.95;
    font-variant-numeric: tabular-nums;
    width: 100%;
    white-space: nowrap;
    color: color-mix(in srgb, var(--mud-palette-primary) 38%, var(--mud-palette-text-secondary));
}

.week-cal__p-high[b-v8hf5zyha3] {
    border-left-color: #f87171 !important;
    background: color-mix(in srgb, #f87171 18%, var(--mud-palette-surface)) !important;
}

.week-cal__p-medium[b-v8hf5zyha3] {
    border-left-color: #fbbf24 !important;
    background: color-mix(in srgb, #fbbf24 15%, var(--mud-palette-surface)) !important;
}

.week-cal__p-low[b-v8hf5zyha3] {
    border-left-color: #34d399 !important;
    background: color-mix(in srgb, #34d399 13%, var(--mud-palette-surface)) !important;
}

/* Touch / coarse pointer: edge-resize and list-style drag grips are unreliable; hide (see detail panel + hint). */
@media (hover: none) and (pointer: coarse) {
    .week-cal__block-resize[b-v8hf5zyha3] {
        display: none !important;
    }

    .week-cal__block-grip[b-v8hf5zyha3] {
        display: none !important;
    }
}