/* LANTERN reference: lupdYtaEcKujzV9UYEruLp, dashboard 1:3317.
   Shared presentation only; existing data, routes and controls stay in place.
   Reuse the project's lantern artwork and icon library. */




/* Shared row actions: opaque fills keep icons readable over glass and striped rows. */
html body .project-table-actions {
    gap: 8px;
}

html body .project-table-actions .btn {
    --row-action-bg: #245c78;
    --row-action-border: #91cce8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--row-action-border);
    border-radius: 8px;
    background: var(--row-action-bg);
    color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .18);
    font-size: 17px;
    line-height: 1;
    transition: filter .15s ease, box-shadow .15s ease;
}

html body .project-table-actions .btn-outline-success {
    --row-action-bg: #206044;
    --row-action-border: #8edbb3;
}

html body .project-table-actions .btn-outline-warning {
    --row-action-bg: #76500d;
    --row-action-border: #efd080;
}

html body .project-table-actions .btn-outline-danger {
    --row-action-bg: #923b46;
    --row-action-border: #f4a5af;
}

html body .project-table-actions .btn:not(:disabled):not(.disabled):hover {
    background: var(--row-action-bg);
    color: #fff;
    filter: brightness(1.18);
    box-shadow: 0 3px 8px rgba(0, 0, 0, .3);
}

html body .project-table-actions .btn:focus-visible {
    outline: 3px solid var(--body-color);
    outline-offset: 3px;
    box-shadow: 0 0 0 2px var(--surface-bg-strong);
}

html body .project-table-actions .btn:not(:disabled):not(.disabled):active {
    filter: brightness(.9);
    box-shadow: none;
}

html body .project-table-actions .btn:is(:disabled, .disabled) {
    opacity: .45;
    box-shadow: none;
}

@media (pointer: coarse) {
    html body .project-table-actions .btn {
        flex-basis: 44px;
        width: 44px;
        height: 44px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body .project-table-actions .btn {
        transition: none;
    }
}

body {
    background-attachment: fixed;
    background-position: center 16%;
}

body.bg-light {
    background: var(--body-bg) center 16% / cover fixed !important;
}

html body .main-content {
    margin: 0 auto;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    background: var(--workspace-bg) center 16% / cover fixed;
    min-height: calc(100vh - 48px);
}

/* Keep scrollable page content clear of the fixed workspace dock. */
html body .page-content {
    padding-bottom: 110px;
}

/* Common surfaces used by projects, tasks, reports, teams and administration. */
html body :is(.glass-card, .dashboard-card, .workspace-stat, .project-stat-card,
    .project-detail-hero, .project-detail-stat, .workspace-mobile-card,
    .settings-action-card, .user-work-panel, .user-detail-chart-card,
    .user-detail-task-list, .project-task-detail-panel, .project-detail-task-card) {
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-panel);
    color: var(--body-color);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), var(--shadow-lg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

html body :is(.workspace-page-header h1, .project-detail-hero h1) {
    font-size: clamp(23px, 2vw, 30px);
    font-weight: 500;
    letter-spacing: -.025em;
}

html body :is(.workspace-page-header p, .project-detail-hero p,
    .project-detail-stat span, .project-detail-stat small) {
    color: var(--text-muted);
}

html body .text-muted,
html body .text-secondary {
    color: var(--text-muted) !important;
}

html body .lantern-project-stats {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 20px;
}

html body .lantern-project-stats>div {
    width: auto;
    padding: 0;
    margin: 0;
}

html body .project-stat-card {
    display: grid;
    grid-template-columns: 1fr auto;
    width: 100%;
    min-height: 138px;
    padding: 12px;
    gap: 10px;
}

html body .project-stat-card p {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    color: var(--body-color);
    font-size: 12px;
    font-weight: 400;
}

html body .project-stat-card .stat-icon {
    grid-column: 2;
    grid-row: 1;
    width: 24px;
    height: 24px;
    font-size: 14px;
    border: 1px solid var(--surface-border);
    border-radius: 6px;
    background: var(--lantern-inset);
    color: var(--body-color);
}

html body .project-stat-card h2 {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: end;
    align-self: end;
    font-size: clamp(24px, 2.8vw, 40px);
    font-weight: 400;
    margin: 0;
    color: var(--body-color);
    overflow-wrap: anywhere;
}

html body .project-stat-card:hover {
    transform: translateY(-2px);
}

html body :is(.btn-primary-custom, .btn-secondary.results-pill) {
    background: var(--action-bg);
    color: var(--action-text);
    border: 1px solid rgba(167, 245, 228, .6);
    border-radius: 8px;
}

.workspace-page {
    gap: 18px;
}

.workspace-stat strong,
.project-stat-card h2,
.project-detail-stat strong {
    font-weight: 400;
    font-variant-numeric: tabular-nums;
}

html body :is(.workspace-list-row, .project-task-row, .user-task-row,
    .workspace-filter-panel, .project-detail-tabs, .workspace-department) {
    border-color: var(--surface-border);
    border-radius: 6px;
    background: var(--lantern-inset);
    color: var(--body-color);
}

html body :is(.form-control, .form-select) {
    border-color: var(--input-border);
    border-radius: 6px;
    background-color: var(--input-bg);
    color: var(--body-color);
}

html body :is(.form-control, .form-select):focus {
    background-color: var(--input-focus-bg);
    border-color: var(--primary-light);
    color: var(--body-color);
    box-shadow: 0 0 0 3px rgba(91, 210, 211, .18);
}

html body .form-control::placeholder {
    color: var(--text-muted);
    opacity: .85;
}

html body select option {
    background: var(--surface-bg-strong);
    color: var(--body-color);
}

html body :is(.btn-primary-custom, .btn-outline-custom) {
    border-radius: 6px;
    box-shadow: none;
}

html body .btn-outline-custom {
    background: var(--lantern-inset);
    border-color: var(--surface-border);
    color: var(--body-color);
}

html body :is(.modal-content, .workspace-modal-content, .profile-menu,
    .notification-panel, .tenant-search-panel, .workspace-picker-popover) {
    background: var(--surface-bg-strong);
    color: var(--body-color);
    border: 1px solid var(--surface-border);
    border-radius: 10px;
}

html body .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--body-color);
    --bs-table-hover-color: var(--body-color);
    --bs-table-hover-bg: var(--surface-hover);
    --bs-table-border-color: var(--surface-border);
    color: var(--body-color);
}

html body .table thead th {
    background: var(--lantern-inset);
    color: var(--text-light);
    font-weight: 500;
}

html body :is(.project-progress-cell, .task-progress-cell) progress::-webkit-progress-value {
    background: var(--lantern-progress);
}

html body :is(.project-progress-cell, .task-progress-cell) progress::-moz-progress-bar {
    background: var(--lantern-progress);
}

html body .workspace-meter-fill:not(.critical):not(.high) {
    background: var(--lantern-progress);
}

/* Floating header and footer retain the search, view switch and all menus. */
html body .top-navbar.glass-card {
    width: min(520px, calc(100vw - 32px));
    margin: 12px auto 22px;
    border-radius: 12px;
    overflow: visible;
    background: var(--lantern-panel);
}

html body .top-navbar:not(:has(.lantern-top-brand)) {
    width: min(860px, 100%);
}

html body .top-navbar:not(:has(.lantern-top-brand)) .search-wrapper {
    width: clamp(200px, 30vw, 360px);
}

html body .mobile-menu-toggle {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 6px;
}

@media (min-width: 992px) {
    html body .mobile-menu-toggle {
        display: none !important;
    }
}

html body .sidebar.show {
    left: 0;
    width: min(300px, 88vw);
    padding: 24px 18px;
    opacity: 1;
    pointer-events: auto;
    z-index: 10000;
    background: var(--surface-bg-strong);
}

html body :is(.lantern-footer-dock, .lantern-footer-links) {
    border-radius: 10px;
    background: var(--lantern-panel);
    border-color: var(--surface-border);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 6px 18px rgba(0, 0, 0, .14);
}

html body .lantern-footer-links {
    background: transparent;
    border: 0;
    box-shadow: none;
    gap: 5px;
}

html body .lantern-footer-links a {
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-panel);
    color: var(--body-color);
}

html body .lantern-footer-links a:hover {
    background: var(--surface-hover);
}

html body :is(.lantern-clock, .lantern-top-actions .btn-outline-custom) {
    color: var(--body-color);
}

html body .lantern-top-actions .btn-outline-custom {
    border-radius: 6px;
    background: var(--lantern-inset);
}

/* Dashboard proportions follow the reference while allowing real content to grow. */
html body .lantern-cockpit {
    width: min(100%, 1480px);
    min-height: 600px;
    padding: 12px 14px 48px;
    gap: 16px;
    border: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.lantern-cockpit::before {
    background: none;
}

html body :is(.lantern-panel, .lantern-mini-stat) {
    background: var(--lantern-panel);
    border-color: var(--surface-border);
    border-radius: 8px;
    color: var(--body-color);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
    backdrop-filter: blur(8px);
}

html body :is(.lantern-mini-stat span, .lantern-hold-panel span,
    .lantern-project-meter span, .lantern-panel h2, .lantern-calendar-link) {
    color: var(--body-color);
}

html body .lantern-mini-stat {
    min-height: 138px;
    padding: 12px 14px;
}

html body .lantern-mini-stat strong {
    font-size: clamp(32px, 3.4vw, 54px);
    font-weight: 400;
    color: var(--body-color);
}

html body .lantern-panel h2,
html body .lantern-mini-stat span {
    font-weight: 400;
}

html body .lantern-project-meter {
    grid-template-columns: 76px minmax(0, 1fr);
}

html body .lantern-main-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

html body .lantern-main-stats .lantern-mini-stat-wide {
    grid-column: auto;
}

html body .lantern-hold-panel {
    min-height: 138px;
}

html body .lantern-cockpit-separator {
    width: 5px;
    margin: 0;
    background: rgba(217, 217, 217, .4);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .4);
}

html body .lantern-project-meter b,
html body .lantern-task-strip b {
    background: var(--lantern-progress);
    box-shadow: none;
}

html body .lantern-task-stack {
    position: relative;
    width: min(100%, 760px);
    min-height: 0;
    margin: 0 auto;
    padding: 0;
    overflow: visible;
    border-color: transparent;
    background: none !important;
    border: 0 !important;
}

html body .lantern-stack-card {
    background: var(--lantern-panel);
    border-color: var(--surface-border);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .12);
}

html body .lantern-calendar-grid button {
    color: var(--body-color);
    background: var(--lantern-inset);
    border-color: var(--surface-border);
}

html body .lantern-calendar-grid button:is(.selected, :hover) {
    color: var(--body-color);
    background: var(--surface-hover);
}

html body .lantern-slide-controls button {
    min-width: 24px;
    min-height: 24px;
    color: var(--body-color);
}

html body .lantern-slide-controls .lantern-slide-dot {
    min-width: 10px;
    min-height: 10px;
}

.lantern-slide-controls {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.lantern-calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    color: var(--text-muted);
    font-size: 11px;
}

.lantern-due-summary {
    display: flex;
    justify-content: space-between;
    padding: 12px;
    font-size: 12px;
}

html body .lantern-log-panel {
    background: var(--lantern-panel);
    color: var(--body-color);
}

html body .lantern-log-panel h2 {
    color: var(--body-color);
}

.lantern-log-empty {
    padding: 12px;
    font-size: 12px;
    color: var(--text-muted);
}

.lantern-log-feed {
    overflow-y: auto;
}

/* Match the same quiet glass treatment on authentication screens. */
html body .auth-page {
    background: var(--workspace-bg) center 16% / cover;
}

html body .auth-page::before,
html body .auth-page::after {
    opacity: 0;
}

html body .auth-card {
    background: var(--lantern-panel);
    border-color: var(--surface-border);
    border-radius: 12px;
    color: var(--body-color);
}

html body .auth-card h2 {
    color: var(--body-color);
    font-weight: 500;
}

:is(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--primary-light);
    outline-offset: 3px;
}

@media (min-width: 960px) {
    html body.lantern-dashboard-page {
        overflow: auto;
    }

    html body.lantern-dashboard-page .main-content {
        height: auto;
        min-height: calc(100vh - 48px);
        overflow: visible;
    }

    html body.lantern-dashboard-page :is(.page-content, #app, .lantern-dashboard) {
        height: auto;
        overflow: visible;
    }

    html body.lantern-dashboard-page .page-content {
        padding-bottom: 110px;
    }

    html body.lantern-dashboard-page .lantern-cockpit {
        height: auto;
        min-height: max(570px, calc(100vh - 190px));
        grid-template-columns: minmax(180px, 1fr) 5px minmax(290px, 1.52fr) 5px minmax(180px, 1fr);
    }

    html body .lantern-cockpit-separator {
        width: 5px;
        height: auto;
    }

    html body .lantern-mini-stat {
        min-height: 138px;
    }

    html body .lantern-cockpit {
        padding: 12px 14px 30px;
    }

    html body .lantern-footer {
        bottom: 36px;
        gap: clamp(14px, 3vw, 44px);
    }
}

@media (max-width: 959px) {
    html body .lantern-project-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    html body .lantern-cockpit {
        min-height: 0;
        padding: 10px 0 30px;
    }

    html body .lantern-cockpit-separator {
        width: 100%;
        height: 4px;
    }

    html body .lantern-mini-stat {
        min-height: 110px;
    }

    html body .lantern-footer {
        width: calc(100vw - 24px);
        flex-direction: column;
        gap: 8px;
    }

    html body .lantern-footer-dock {
        width: min(520px, 100%);
    }

    html body .lantern-footer-links {
        justify-content: center;
    }

    html body .page-content {
        padding-bottom: 150px;
    }
}

@media (max-width: 640px) {
    html body .lantern-project-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    html body .main-content {
        width: calc(100% - 16px);
        margin: 8px auto;
        padding: 8px;
    }

    html body .top-navbar.glass-card {
        gap: 8px;
        padding: 6px 8px;
    }

    .lantern-top-brand {
        width: 80px;
        flex-basis: 80px;
    }

    .lantern-clock {
        min-width: 60px;
        font-size: 11px;
    }

    html body .lantern-main-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lantern-footer-brand {
        width: 84px;
        flex-basis: 84px;
    }

    .lantern-footer-dock {
        gap: 6px;
    }

    .lantern-view-select {
        width: 108px;
        flex-basis: 108px;
    }

    html body .page-content {
        padding-bottom: 150px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lantern-slide-track {
        transition: none;
    }

    .lantern-stack-stage *,
    .lantern-stack-stage {
        animation: none !important;
    }
}

/* PDF reference pages 10-17: setup navigation and composed page layouts. */
.lantern-project-overview {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(320px, 1.55fr) minmax(200px, 1fr);
    gap: var(--lantern-layout-gap);
    align-items: start;
}

.lantern-project-rail {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.lantern-detail-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

html body .lantern-detail-kpis .project-detail-stat {
    min-height: 112px;
    padding: 12px;
    justify-content: space-between;
}

.lantern-detail-kpis strong {
    align-self: flex-end;
    font-size: 32px;
}

.lantern-project-sheet {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px;
    border: 1px solid var(--surface-border);
    border-radius: var(--lantern-panel-radius);
    background: var(--lantern-panel);
    box-shadow: 0 8px 0 -2px rgba(217, 217, 217, .28), 0 17px 0 -5px rgba(217, 217, 217, .2), 0 27px 0 -9px rgba(217, 217, 217, .14);
}

.lantern-detail-block,
.lantern-reference-calendar {
    padding: 14px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
    min-width: 0;
}

.lantern-project-rail>.lantern-detail-block,
.lantern-reference-calendar {
    background: var(--lantern-panel);
}

.lantern-project-overview h2,
.lantern-reference-calendar h2 {
    font-size: 15px;
    font-weight: 400;
    margin: 0 0 10px;
}

.lantern-detail-block>small {
    display: block;
    margin-bottom: 8px;
    color: var(--text-muted);
}

.lantern-detail-dates {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.lantern-detail-dates small,
.lantern-detail-dates strong {
    display: block;
    font-size: 11px;
}

.lantern-detail-dates strong {
    font-weight: 400;
    margin-top: 6px;
}

.lantern-reference-progress {
    width: 100%;
    height: 10px;
    margin-top: 10px;
}

.lantern-reference-progress::-webkit-progress-bar,
.lantern-reference-tasks progress::-webkit-progress-bar {
    background: var(--lantern-inset);
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-reference-progress::-webkit-progress-value,
.lantern-reference-tasks progress::-webkit-progress-value {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-reference-progress::-moz-progress-bar,
.lantern-reference-tasks progress::-moz-progress-bar {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-detail-log {
    padding: 14px;
    border-radius: 8px;
    background: rgba(245, 245, 245, .85);
    color: #292929;
}

.lantern-detail-log>div {
    padding: 10px 0;
    border-top: 1px dotted #a1a6a4;
    font-size: 11px;
}

.lantern-detail-log p {
    margin: 4px 0;
    font-size: 12px;
}

html body .lantern-detail-log .btn {
    color: #292929;
    border-color: #8b9692;
}

.lantern-reference-tasks>button:not(.btn) {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    padding: 8px;
    margin-bottom: 6px;
    border: 1px solid var(--surface-border);
    border-radius: 4px;
    background: var(--lantern-inset);
    color: var(--body-color);
    text-align: left;
    font-size: 12px;
}

.lantern-reference-tasks progress {
    width: 100%;
    height: 8px;
}

.lantern-reference-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
    margin-top: 8px;
}

.lantern-reference-days :is(a, button) {
    display: grid;
    place-items: center;
    min-height: 28px;
    aspect-ratio: 1;
    border: 1px solid var(--surface-border);
    border-radius: 4px;
    background: var(--lantern-inset);
    font-size: 10px;
    color: var(--body-color);
    text-decoration: none;
    position: relative;
}

/* Owner navigation remains discoverable even though the desktop sidebar is a drawer. */
html body .owner-menu-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
    color: var(--body-color);
    font-size: 13px;
    font-weight: 600;
}

html body .owner-menu-toggle:hover,
html body .owner-menu-toggle:focus-visible {
    border-color: var(--primary-light);
    color: var(--primary-light);
}

html body .owner-brand-toggle {
    padding: 5px 10px;
}

html body .owner-brand-toggle img {
    display: block;
    width: auto;
    height: 26px;
    max-width: 156px;
    object-fit: contain;
}

@media (max-width: 640px) {
    html body .owner-menu-toggle span {
        display: none;
    }

    html body .owner-menu-toggle {
        width: 38px;
        justify-content: center;
        padding: 0;
    }

    html body .owner-brand-toggle {
        width: auto;
        padding: 5px 8px;
    }

    html body .owner-brand-toggle img {
        height: 22px;
        max-width: 130px;
    }
}

/* Keep the owner drawer and its brand mark constrained even when older
   global sidebar rules or cached styles are present. */
html body aside#sidebar.sidebar.show {
    box-sizing: border-box !important;
    width: min(320px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
    height: 100dvh !important;
    overflow-x: hidden !important;
}

html body aside#sidebar .sidebar-brand img {
    display: block !important;
    width: 170px !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
}

.lantern-reference-days :is(a, button).today {
    background: var(--lantern-selected);
    border-color: var(--primary-light);
}

.lantern-reference-calendar .workspace-section-title {
    flex-wrap: wrap;
    gap: 6px;
}

.lantern-reference-calendar .workspace-section-title span {
    font-size: 10px;
}

html body .user-detail-modal .modal-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(210px, .45fr);
    gap: 14px;
}

.user-detail-modal .user-detail-layout,
.user-detail-modal .user-detail-related-grid {
    display: contents;
}

.user-detail-modal .modal-body>*,
.user-detail-modal .user-detail-layout>section {
    grid-column: 1;
    margin-top: 0 !important;
    min-width: 0;
}

.user-detail-modal .user-detail-related-grid>section {
    grid-column: 1;
    min-width: 0;
}

.user-detail-modal .user-detail-related-grid>section:last-child {
    grid-column: 2;
    grid-row: 1 / span 5;
    align-self: start;
    position: sticky;
    top: 0;
}

.user-detail-modal .user-detail-layout>section:first-child {
    padding: 14px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
}

.user-detail-modal .user-contact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.user-detail-modal .user-contact-actions {
    gap: 6px;
    margin-top: 12px !important;
}

.user-detail-modal .user-contact-actions .btn {
    font-size: 12px;
    padding: 7px 10px;
}

.user-detail-modal .user-work-kpis>div {
    border-radius: 8px;
    background: var(--lantern-inset);
    border: 1px solid var(--surface-border);
}

.user-detail-modal .user-chart-row b {
    background: var(--lantern-progress);
}

.user-detail-modal .user-progress-ring-row {
    gap: 12px;
}

html body .lantern-task-detail {
    border-radius: var(--lantern-panel-radius);
}

.lantern-task-detail .task-detail-primary {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lantern-task-detail .task-detail-primary>div {
    padding: 14px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
}

.lantern-task-detail .task-detail-primary>div:nth-child(3) {
    order: -1;
}

.lantern-task-detail .task-detail-side {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lantern-task-detail .project-task-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lantern-team-editor .modal-body> :is(.row, .mb-3) {
    padding: 14px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
}

.lantern-team-editor .form-control,
.lantern-team-editor .form-select {
    min-height: 38px;
}

@media (max-width: 1100px) {
    .lantern-project-overview {
        grid-template-columns: minmax(180px, .65fr) minmax(0, 1fr);
    }

    .lantern-project-overview>.lantern-project-rail:last-child {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767px) {
    .lantern-project-overview {
        display: flex;
        flex-direction: column;
    }

    .lantern-project-overview>* {
        width: 100%;
    }

    .lantern-project-overview>.lantern-project-rail:last-child {
        display: flex;
    }

    html body .user-detail-modal .modal-body {
        display: flex;
        flex-direction: column;
    }

    .user-detail-modal .user-detail-related-grid>section:last-child {
        position: static;
    }
}

.lantern-setup-page {
    display: grid;
    grid-template-columns: var(--lantern-setup-rail) minmax(0, 1fr);
    align-items: start;
    gap: var(--lantern-layout-gap);
    max-width: 1480px;
    margin: 12px auto 0;
}

.lantern-setup-page> :not(.lantern-setup-nav):not(.modal) {
    grid-column: 2;
    min-width: 0;
    margin-bottom: 0 !important;
}

.lantern-setup-nav {
    grid-column: 1;
    grid-row: 1 / span 12;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    position: sticky;
    top: 24px;
}

.lantern-setup-tile {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 132px;
    padding: 14px;
    border: 1px solid var(--surface-border);
    border-radius: 12px;
    background: var(--lantern-panel);
    color: var(--body-color);
    text-decoration: none;
    backdrop-filter: blur(12px);
    font-size: 16px;
}

.lantern-setup-tile i {
    align-self: flex-end;
    display: grid;
    place-items: center;
    width: 46px;
    height: 52px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    font-size: 23px;
    background: var(--lantern-inset);
}

.lantern-setup-tile.active {
    background: var(--lantern-selected);
    box-shadow: inset 0 -3px 0 var(--primary-light);
}

.lantern-setup-tile:hover {
    color: var(--body-color);
    border-color: var(--primary-light);
}

.lantern-back-link {
    grid-column: 1 / -1;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    padding: 12px 0;
    color: var(--text-muted);
    font-size: 12px;
}

.lantern-setup-page>.d-flex,
.lantern-setup-page>.workspace-page-header {
    flex-wrap: wrap;
    gap: 14px;
}

.lantern-setup-page h1,
.lantern-setup-page h2.fw-bold {
    font-size: 24px;
    font-weight: 400 !important;
}

.lantern-setup-page p.text-secondary {
    font-size: 12px;
    margin: 6px 0 0;
}

html body .lantern-setup-page :is(.workspace-stat, .lantern-team-stats .dashboard-card) {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
    gap: 8px;
    padding: 14px;
    min-height: 126px;
    text-align: left;
    width: 100%;
}

.lantern-setup-page .workspace-stat strong,
.lantern-team-stats h2 {
    align-self: flex-end;
    font-size: 36px;
    font-weight: 400;
    margin: 0;
}

.lantern-setup-page .workspace-stat span,
.lantern-team-stats h6 {
    font-size: 13px;
    font-weight: 400;
}

.lantern-setup-page .workspace-stat small {
    font-size: 10px;
}

.lantern-setup-page .workspace-stat-icon {
    width: 24px;
    height: 24px;
    font-size: 14px;
    background: var(--lantern-inset);
    border-radius: 5px;
}

.lantern-role-editor {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 18px;
    background: var(--lantern-panel);
    border: 1px solid var(--surface-border);
    border-radius: var(--lantern-panel-radius);
}

.lantern-role-editor> :is(.col-lg-4, .col-lg-8) {
    width: 100%;
    padding: 0;
    margin: 0 !important;
}

html body .lantern-role-editor .glass-card {
    padding: 14px !important;
    background: var(--lantern-inset);
    box-shadow: none;
    backdrop-filter: none;
}

.lantern-role-editor h5 {
    font-size: 13px;
    font-weight: 400 !important;
    margin-bottom: 12px !important;
}

.lantern-role-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lantern-role-tab,
.lantern-permission-toggle {
    border: 1px solid var(--surface-border);
    border-radius: 6px;
    background: var(--lantern-inset);
    color: var(--body-color);
    padding: 10px 12px;
    text-align: left;
}

.lantern-role-tab {
    flex: 1 1 110px;
}

.lantern-role-tab small,
.lantern-permission-toggle small {
    display: block;
    font-size: 10px;
    overflow-wrap: anywhere;
}

.lantern-role-tab.active,
.lantern-permission-toggle.active {
    background: var(--lantern-selected);
    border-color: var(--primary-light);
}

.lantern-permission-group {
    padding: 14px;
    margin-bottom: 12px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-permission-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    height: 100%;
    font-size: 12px;
}

.lantern-permission-toggle:disabled {
    cursor: default;
}

.lantern-users-page .lantern-setup-nav {
    grid-row: 1 / span 2;
}

.lantern-users-page> :is(.glass-card, .responsive-card-list, .workspace-pagination-footer) {
    grid-column: 1 / -1;
}

html body .lantern-users-page .user-directory-table {
    border-radius: var(--lantern-panel-radius);
    padding: 14px !important;
}

.lantern-users-page .table tbody td {
    border-bottom: 1px solid var(--surface-border);
}

.lantern-team-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.lantern-team-stats>div {
    width: auto;
    padding: 0;
    margin: 0;
}

.lantern-team-cards {
    margin: 0;
    gap: 16px;
}

.lantern-team-cards>.col-md-6 {
    width: calc(50% - 8px);
    margin: 0;
    padding: 0;
}

.lantern-team-cards>.col-12 {
    padding: 0;
    margin: 0;
}

html body .lantern-team-card {
    border-radius: var(--lantern-panel-radius);
    padding: 18px;
}

.lantern-team-card h5 {
    font-size: 20px;
    font-weight: 400;
}

.lantern-team-card>.mb-2,
.lantern-team-card>.mb-3 {
    padding: 12px;
    border: 1px solid var(--surface-border);
    border-radius: 6px;
    background: var(--lantern-inset);
}

.lantern-team-card>.d-flex:last-child {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lantern-team-card .progress {
    height: 9px;
    border: 1px solid var(--surface-border);
    background: var(--lantern-inset);
}

.lantern-team-card .progress-bar {
    background: var(--lantern-progress);
}

.lantern-setup-page .modal-content {
    border-radius: var(--lantern-panel-radius);
}

.lantern-setup-page .modal-header,
.lantern-setup-page .modal-footer {
    border-color: var(--surface-border);
}

html body .lantern-profile-page {
    width: min(840px, 100%);
    margin: 28px auto 70px;
    padding: 26px;
    background: var(--lantern-panel);
    border: 1px solid var(--surface-border);
    border-radius: var(--lantern-panel-radius);
}

.lantern-profile-page .workspace-page-header {
    align-items: start;
}

.lantern-profile-page .workspace-page-header p {
    max-width: 450px;
    font-size: 12px;
}

.lantern-profile-layout {
    flex-direction: row-reverse;
    --bs-gutter-x: 24px;
}

html body .lantern-profile-layout .dashboard-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    padding: 0;
}

.lantern-profile-layout .profile-avatar-large,
.lantern-profile-layout .profile-avatar-placeholder {
    width: 94px;
    height: 94px;
    margin: 0 auto 16px;
    border: 1px solid var(--surface-border);
}

.lantern-profile-layout .profile-summary h2 {
    font-size: 16px;
    font-weight: 400;
    overflow-wrap: anywhere;
}

.lantern-profile-layout .profile-summary>span {
    font-size: 12px;
}

.lantern-profile-page .form-control {
    min-height: 38px;
    padding: 8px 10px;
    font-size: 13px;
}

.lantern-profile-page .form-label {
    font-size: 11px;
    margin-bottom: 4px;
}

.lantern-profile-page .workspace-section-title {
    flex-wrap: wrap;
    gap: 8px;
}

.lantern-profile-page .workspace-section-title h2 {
    font-size: 16px;
}

.lantern-profile-page .workspace-section-title span {
    font-size: 10px;
}

.lantern-rooms-page>.row.g-4 {
    margin: 0;
    gap: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, .6fr);
}

.lantern-rooms-page>.row.g-4>div {
    min-width: 0;
    width: auto;
    padding: 0;
    margin: 0;
}

.lantern-rooms-page>.row.g-4>div:first-child {
    grid-row: 1 / span 2;
}

html body .lantern-rooms-page .dashboard-card {
    border-radius: var(--lantern-panel-radius);
}

.lantern-rooms-page .workspace-stats-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

@media (max-width: 1100px) {
    .lantern-setup-page {
        grid-template-columns: 170px minmax(0, 1fr);
    }

    .lantern-setup-nav {
        gap: 8px;
    }

    .lantern-setup-tile {
        min-height: 112px;
        padding: 10px;
        font-size: 14px;
    }

    .lantern-setup-page .workspace-stats-grid,
    .lantern-team-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lantern-profile-identity {
        width: 30%;
    }

    .lantern-profile-fields {
        width: 70%;
    }
}

@media (max-width: 767px) {
    .lantern-setup-page {
        display: flex;
        flex-direction: column;
    }

    .lantern-setup-page>* {
        width: 100%;
    }

    .lantern-setup-nav {
        position: static;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .lantern-setup-tile {
        min-height: 76px;
        font-size: 12px;
        padding: 8px;
        gap: 10px;
    }

    .lantern-setup-tile i {
        width: 28px;
        height: 28px;
        font-size: 16px;
    }

    .lantern-back-link {
        padding: 4px 0;
    }

    .lantern-team-cards>.col-md-6 {
        width: 100%;
    }

    .lantern-profile-layout {
        flex-direction: column;
        gap: 22px;
    }

    .lantern-profile-identity,
    .lantern-profile-fields {
        width: 100%;
    }

    html body .lantern-profile-page {
        padding: 18px;
        margin-top: 8px;
    }

    .lantern-rooms-page>.row.g-4 {
        grid-template-columns: minmax(0, 1fr);
    }

    .lantern-rooms-page>.row.g-4>div:first-child {
        grid-row: auto;
    }
}

/* Reference page 15: team workspace, work summaries and assignment rail. */
.lantern-team-assignment {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lantern-team-assignment-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

html body .lantern-team-assignment-stats .dashboard-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 126px;
    padding: 14px;
}

.lantern-team-assignment-stats span {
    font-size: 13px;
}

.lantern-team-assignment-stats strong {
    align-self: flex-end;
    font-size: 36px;
    font-weight: 400;
}

.lantern-team-assignment h3 {
    font-size: 15px;
    font-weight: 400;
}

.lantern-available-member {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 0;
    border-top: 1px solid var(--surface-border);
    font-size: 13px;
}

.lantern-available-member small {
    color: var(--text-muted);
}

html body .lantern-team-card {
    padding: 16px;
    border-radius: 22px;
    cursor: pointer;
}

.lantern-team-card>.d-flex:first-child {
    flex-wrap: wrap;
    gap: 8px;
}

.lantern-team-card h5 {
    font-size: 17px;
    overflow-wrap: anywhere;
}

.lantern-team-card .lantern-team-description {
    margin: 12px 0;
    font-size: 12px;
}

.lantern-team-metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 10px 0;
}

.lantern-team-metrics>div {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    background: var(--lantern-inset);
}

.lantern-team-metrics span,
.lantern-team-lead small {
    font-size: 11px;
}

.lantern-team-metrics strong {
    align-self: flex-end;
    font-size: 26px;
    font-weight: 400;
}

.lantern-team-lead {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
}

.lantern-team-lead strong {
    font-size: 13px;
    font-weight: 400;
}

.lantern-team-work {
    padding: 12px;
    margin: 10px 0;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
}

.lantern-team-work h6 {
    font-size: 12px;
    font-weight: 400;
}

.lantern-team-progress {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) 20px;
    gap: 6px;
    align-items: center;
    margin: 6px 0;
    font-size: 10px;
}

.lantern-team-progress progress {
    width: 100%;
    height: 10px;
    appearance: none;
}

.lantern-team-progress progress::-webkit-progress-bar {
    background: var(--lantern-inset);
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-team-progress progress::-webkit-progress-value {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-team-progress progress::-moz-progress-bar {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-team-projects {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--surface-border);
}

.lantern-team-projects>small {
    width: 100%;
    font-size: 11px;
}

.lantern-team-projects a {
    padding: 5px 7px;
    font-size: 11px;
    color: var(--body-color);
    border: 1px solid var(--surface-border);
    border-radius: 5px;
    background: var(--lantern-inset);
    text-decoration: none;
}

.lantern-team-projects a:hover {
    border-color: var(--primary-light);
}

@media (min-width: 1400px) {
    .lantern-teams-page {
        grid-template-columns: 210px minmax(0, 1fr) 250px;
    }

    html body .lantern-setup-page.lantern-teams-page>.lantern-team-assignment {
        grid-column: 3;
        grid-row: 2 / span 4;
        padding-left: 18px;
        border-left: 4px double var(--surface-border);
        position: sticky;
        top: 24px;
    }

    .lantern-teams-page .lantern-team-stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Reference page 17: room details, snapshot and facilities grouped into one sheet. */
html body .lantern-room-editor {
    border-radius: var(--lantern-panel-radius);
}

.lantern-room-editor .modal-body>.row {
    margin: 0;
    padding: 4px;
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    background: var(--lantern-inset);
}

.lantern-room-editor .form-label,
.lantern-room-editor h6 {
    font-size: 12px;
    font-weight: 400;
}

.lantern-room-editor .form-control {
    min-height: 38px;
    font-size: 13px;
}

.lantern-room-snapshot {
    padding: 12px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-room-preview {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    min-height: 140px;
    padding: 18px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
}

.lantern-room-preview>i {
    font-size: 38px;
    color: var(--primary-light);
}

.lantern-room-preview>div {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    overflow-wrap: anywhere;
    min-width: 100px;
}

.lantern-room-preview strong {
    font-weight: 400;
}

.lantern-room-preview span {
    font-size: 12px;
}

.lantern-room-seats {
    padding: 8px 12px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-room-facilities {
    padding-bottom: 12px;
}

/* Reference page 1: yesterday, today and upcoming/completed work. */
.lantern-task-view-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}

.lantern-task-board {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr) minmax(0, 1fr);
    gap: var(--lantern-layout-gap);
    align-items: start;
}

.lantern-task-column {
    min-width: 0;
    border: 1px solid var(--surface-border);
    border-radius: var(--lantern-panel-radius);
    background: var(--lantern-panel);
    backdrop-filter: blur(12px);
    overflow: hidden;
}

.lantern-task-column>header {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding: 18px;
    border-bottom: 1px solid var(--surface-border);
}

.lantern-task-column h2 {
    font-size: 17px;
    font-weight: 400;
    margin: 0;
}

.lantern-task-column header>span {
    font-size: 14px;
}

.lantern-task-column header small {
    grid-column: 1 / -1;
    font-size: 11px;
    color: var(--text-muted);
}

.lantern-task-column-items {
    padding: 12px;
    min-height: 360px;
    max-height: 620px;
    overflow-y: auto;
}

.lantern-task-board-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 12px;
    padding: 14px;
    margin-bottom: 10px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-inset);
    color: var(--body-color);
    text-align: left;
}

.lantern-task-board-card:hover,
.lantern-task-board-card:focus-visible {
    border-color: var(--primary-light);
    background: var(--lantern-selected);
}

.lantern-task-board-card strong {
    font-size: 14px;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.lantern-task-board-project {
    font-size: 11px;
    color: var(--text-muted);
}

.lantern-task-board-meta {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 11px;
    text-transform: capitalize;
}

.lantern-task-board-card progress {
    width: 100%;
    height: 9px;
    appearance: none;
}

.lantern-task-board-card progress::-webkit-progress-bar {
    background: var(--lantern-inset);
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-task-board-card progress::-webkit-progress-value {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-task-board-card progress::-moz-progress-bar {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-task-board-empty {
    padding: 24px 8px;
    font-size: 12px;
    color: var(--text-muted);
}

@media (max-width: 767px) {
    .lantern-task-board {
        grid-template-columns: minmax(0, 1fr);
    }

    .lantern-task-column-items {
        min-height: 100px;
        max-height: none;
    }

    .lantern-tasks-page>.row.g-3 {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lantern-tasks-page>.row.g-3>div {
        width: 100%;
    }
}

/* Interactive surfaces share the same affordances for pointer and keyboard use. */
html body :is(button.workspace-stat, button.project-detail-stat, button.dashboard-card, .lantern-interactive-tile) {
    cursor: pointer;
    color: var(--body-color);
    text-align: left;
    font-family: inherit;
}

html body :is(a.lantern-mini-stat, a.lantern-panel, .lantern-project-meter, button.workspace-stat, button.project-detail-stat, button.dashboard-card, .lantern-interactive-tile):hover {
    border-color: var(--primary-light);
    box-shadow: inset 0 0 0 1px var(--primary-light);
}

html body :is(.lantern-interactive-tile, .workspace-stat, .lantern-mini-stat, .lantern-project-meter, .lantern-team-card, .lantern-setup-tile, .lantern-task-board-card, .dashboard-card, .lantern-reference-days a):focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 4px;
}

html body .lantern-interactive-tile[aria-pressed="true"] {
    background: var(--lantern-selected);
    border-color: var(--primary-light);
}

a.lantern-project-meter {
    color: inherit;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 5px;
    padding: 4px;
}

:is(#project-detail-sections, #project-members, #room-directory, #room-bookings, #team-results, #team-assignment-members) {
    scroll-margin-top: 24px;
}

/* One project per card; carousel controls follow the vertical stack direction. */
.lantern-vertical-carousel {
    position: relative;
    min-height: 330px;
}

.lantern-vertical-carousel .lantern-slide-head {
    padding-right: 40px;
}

.lantern-vertical-carousel .lantern-slide-controls {
    z-index: 10;
    position: absolute;
    right: 12px;
    top: 54px;
    bottom: 18px;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    overflow-y: auto;
    padding: 4px;
}

.lantern-vertical-carousel .lantern-slide-controls button {
    flex-shrink: 0;
}

.lantern-vertical-carousel .lantern-task-stack-list {
    padding-right: 44px;
}

.lantern-project-carousel .lantern-stack-stage {
    min-height: 260px;
}

html body .lantern-project-carousel .lantern-stack-card {
    padding: 0;
    min-height: 210px;
}

.lantern-project-stack-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 210px;
    padding: 16px;
    color: var(--body-color);
    text-decoration: none;
    border-radius: 5px;
}

.lantern-project-stack-card:hover {
    color: var(--body-color);
    background: var(--surface-hover);
}

.lantern-project-stack-card:focus-visible {
    outline: 3px solid var(--primary-light);
    outline-offset: 3px;
}

.lantern-project-stack-card>strong {
    font-size: 19px;
    font-weight: 500;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.lantern-project-card-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 6px 12px;
    font-size: 11px;
}

.lantern-project-card-team {
    font-size: 12px;
}

.lantern-project-stack-card progress {
    width: 100%;
    height: 11px;
    appearance: none;
}

.lantern-project-stack-card progress::-webkit-progress-bar {
    background: var(--lantern-inset);
    border: 1px solid var(--surface-border);
    border-radius: 8px;
}

.lantern-project-stack-card progress::-webkit-progress-value {
    background: var(--lantern-progress);
    border-radius: 8px;
}

.lantern-project-stack-card progress::-moz-progress-bar {
    background: var(--lantern-progress);
    border-radius: 8px;
}

html body .lantern-project-meter {
    grid-template-columns: 88px minmax(0, 1fr) auto;
}

.lantern-project-meter>small {
    font-size: 11px;
    min-width: 32px;
    text-align: right;
}

.lantern-activity-entry button.lantern-log-row {
    width: 100%;
    text-align: left;
    border: 0;
    border-bottom: 1px dotted #a1a6a4;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 8px 0;
}

.lantern-activity-entry button:hover {
    background: rgba(255, 255, 255, .25);
}

.lantern-activity-entry button:focus-visible {
    outline: 2px solid #267568;
    outline-offset: 2px;
}

.lantern-activity-detail {
    padding: 10px;
    font-size: 12px;
    background: rgba(255, 255, 255, .35);
    border-radius: 6px;
    overflow-wrap: anywhere;
}

.lantern-activity-detail p {
    margin-bottom: 6px;
}

a.lantern-due-summary {
    text-decoration: none;
    color: var(--body-color);
}

.lantern-filter-context {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    padding: 12px;
    margin-bottom: 16px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-panel);
    font-size: 13px;
}

.lantern-filter-context a {
    color: var(--body-color);
}

/* Task carousel uses one informational card for each task. */
.lantern-task-stack-card {
    min-height: 250px;
}

.lantern-slide-tasks .lantern-stack-stage {
    min-height: 300px;
}

.lantern-task-stack-card .lantern-project-card-meta {
    overflow-wrap: anywhere;
}

.lantern-setup-stack-card {
    min-height: 250px;
}

.lantern-slide-setup .lantern-stack-stage {
    min-height: 300px;
}

.lantern-setup-card-count {
    font-size: 32px;
    line-height: 1;
    font-weight: 400;
}

.lantern-setup-card-description {
    font-size: 12px;
    line-height: 1.5;
}

/* Audit: explicit loading feedback and comfortable touch targets. */
.lantern-load-message {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 12px 16px;
    margin-bottom: 12px;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: var(--lantern-panel);
}

.lantern-load-message[role="alert"] {
    border-color: #e4b8a6;
}

/* Theme parity: shared controls and pages outside the tenant dashboard. */
html body :is(.btn-primary-custom, .btn-secondary.results-pill):hover {
    background: var(--action-hover);
    color: var(--action-text);
}

html body .swal2-popup {
    background: var(--surface-bg-strong);
    color: var(--body-color);
}

html body .swal2-title {
    color: var(--body-color);
}

html body .swal2-html-container {
    color: var(--text-muted);
}

.auth-theme-toggle {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 1100;
    min-width: 44px;
    min-height: 44px;
    background: var(--surface-bg-strong) !important;
}

html body :is(.auth-card .form-label, .auth-card .small, .auth-card .text-muted,
    .auth-password-toggle, .setup-panel p, .setup-hint, .setup-checklist li) {
    color: var(--text-muted) !important;
}

html body :is(.auth-link, .auth-link:hover) {
    color: var(--primary);
}

html body :is(.auth-primary-btn, .setup-submit) {
    background: var(--action-bg);
    color: var(--action-text);
}

html body :is(.setup-card, .expired-card, .topbar) {
    background: var(--lantern-panel);
    color: var(--body-color);
    border-color: var(--surface-border);
}

html body :is(.setup-shell, .license-expired-page) {
    background: var(--workspace-bg) center / cover fixed;
    color: var(--body-color);
}

html body :is(.setup-panel, .license-box) {
    background: var(--surface-bg-strong);
    color: var(--body-color);
}

html body .setup-form .form-label {
    color: var(--body-color);
}

html[data-theme="light"] .btn-close-white,
html[data-theme="light"] .modal .btn-close {
    filter: none;
}

html[data-theme="light"] .text-light:not(.badge):not(.bg-secondary):not(.bg-dark) {
    color: var(--body-color) !important;
}

html[data-theme="light"] :is(.timesheet-hours, .timesheet-empty i) {
    color: var(--primary);
}

html[data-theme="light"] .timesheet-status.submitted {
    color: #754405;
}

html[data-theme="light"] .timesheet-status.approved {
    color: #065f46;
}

html[data-theme="light"] .timesheet-status.rejected {
    color: #991b1b;
}

.lantern-reference-days button.selected {
    outline: 2px solid var(--primary-light);
    outline-offset: 1px;
}

.lantern-reference-days button small {
    position: absolute;
    top: 1px;
    right: 2px;
    min-width: 11px;
    padding: 0 2px;
    border-radius: 8px;
    background: var(--primary);
    color: #fff;
    font-size: 8px;
    line-height: 11px;
}

.lantern-calendar-controls {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
    margin: -28px 0 5px;
}

.lantern-calendar-controls button {
    width: 24px;
    height: 24px;
    border: 1px solid var(--surface-border);
    border-radius: 4px;
    background: var(--lantern-inset);
    color: var(--body-color);
}

.lantern-calendar-markers {
    position: absolute;
    bottom: 2px;
    left: 50%;
    display: flex;
    gap: 2px;
    transform: translateX(-50%);
}

.lantern-calendar-markers b,
.lantern-calendar-marker {
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #52d5e1;
}

.lantern-calendar-marker.milestone,
.lantern-calendar-markers b.milestone {
    background: #f2c94c;
}

.lantern-calendar-marker.meeting,
.lantern-calendar-markers b.meeting {
    background: #c68cff;
}

.lantern-calendar-marker.timesheet,
.lantern-calendar-markers b.timesheet {
    background: #72dca2;
}

.lantern-reference-calendar-summary {
    display: grid;
    gap: 4px;
    min-height: 54px;
    padding: 8px 0;
    border-bottom: 1px solid var(--surface-border);
    font-size: 10px;
}

.lantern-reference-calendar-summary strong {
    font-size: 11px;
}

.lantern-reference-calendar-summary ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.lantern-reference-calendar-summary li {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 3px;
}

.lantern-reference-calendar-summary .lantern-calendar-marker {
    position: static;
    flex: 0 0 auto;
    transform: none;
}

.lantern-reference-calendar .lantern-calendar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 7px 0 3px;
    font-size: 9px;
}

.lantern-reference-calendar .lantern-calendar-legend span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

/* Native select menus otherwise retain dark-mode option colors in Chromium. */
html[data-theme="light"] .lantern-view-select {
    color-scheme: light !important;
    background: #176f68 !important;
    color: #ffffff !important;
}

html[data-theme="light"] .lantern-view-select option {
    color-scheme: light !important;
    background: #ffffff !important;
    color: #10232b !important;
}

html[data-theme="light"] .lantern-view-select option:checked {
    background: #dff3ee !important;
    color: #10232b !important;
}

/* Project-list labels used fixed pale blue values intended for dark surfaces. */
html[data-theme="light"] :is(.project-filter-field > span, .project-filter-status,
    .project-filter-summary, .project-filter-summary span, .project-table thead th,
    .project-table th, .task-table th) {
    color: #36515c !important;
}

html[data-theme="light"] :is(.project-table td, .task-table td) :is(.text-secondary,
    .text-muted, small) {
    color: #4b6470 !important;
}

/* Notification copy was still using its dark-surface palette on a light panel. */
html[data-theme="light"] .notification-panel {
    background: #ffffff !important;
    color: #10232b !important;
}

html[data-theme="light"] :is(.notification-header, .notification-title) {
    color: #10232b !important;
}

html[data-theme="light"] .notification-action-btn {
    border-color: #b9cbd2;
    background: #f5fafb;
    color: #173847;
}

html[data-theme="light"] .push-status-panel {
    border-color: #c7e4e3;
    background: #eaf8f7;
    color: #174f52;
}

html[data-theme="light"] .push-status-panel i {
    color: #087f83;
}

html[data-theme="light"] .push-status-panel button {
    color: #ffffff;
    background: #176f68;
}

html[data-theme="light"] .notification-copy small {
    color: #456372;
}

html[data-theme="light"] .notification-copy span,
html[data-theme="light"] .notification-empty {
    color: #5d737c;
}

html[data-theme="light"] .auth-alert.error {
    color: #8b2020;
    background: #fbe7e7;
}

html[data-theme="light"] .auth-alert.success {
    color: #065f46;
    background: #ddf5ea;
}

@media (pointer: coarse) {
    html body .lantern-vertical-carousel .lantern-slide-controls button {
        min-width: 32px;
        min-height: 32px;
    }

    html body .lantern-vertical-carousel .lantern-slide-controls .lantern-slide-dot {
        background-clip: content-box;
        padding: 10px;
        border-color: transparent;
    }
}

/* Nested glass must not accumulate white layers behind light text. */
html body .project-task-detail-panel {
    background: var(--surface-bg-strong);
    color: var(--body-color);
}

html body .project-task-detail-grid div {
    background: var(--lantern-inset);
    border-color: var(--surface-border);
}

html body :is(.project-task-detail-head h3, .project-task-detail-grid strong,
    .project-task-subtasks strong) {
    color: var(--body-color);
}

html body :is(.project-description, .project-task-detail-panel p,
    .project-task-detail-grid span, .project-task-detail-progress span,
    .project-task-subtasks span, .project-task-subtasks small,
    .project-task-detail-foot, .project-back-link, .project-detail-tabs button) {
    color: var(--text-muted);
}

html body .project-task-subtasks div.done :is(strong, i) {
    color: var(--status-success-text);
}

html body .project-task-subtasks div:not(.d-flex) {
    border-color: var(--surface-border);
}

html body .project-detail-tabs button:is(.active, :hover) {
    color: var(--body-color);
    background: var(--lantern-selected);
}

/* Project sections sit beside the work, directly under the project heading. */
html body .project-detail-page {
    gap: 16px;
}

html body .project-detail-page .project-detail-hero {
    padding: 18px 20px;
    margin-bottom: 0;
}

html body .project-detail-page .project-detail-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    padding: 6px;
    margin: -8px 0 0;
    background: var(--surface-bg-strong);
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    overflow-x: auto;
    scrollbar-width: thin;
}

html body .project-detail-page .project-detail-tabs button {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 7px;
    white-space: nowrap;
}

html body .project-detail-page .project-detail-tabs button.active {
    background: var(--action-bg);
    color: var(--action-text);
}

html body .main-content:has(.project-detail-page) .lantern-footer {
    position: static;
    transform: none;
    width: 100%;
    margin: 20px auto;
    padding: 0 12px;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

html body .main-content:has(.project-detail-page) .page-content {
    padding-bottom: 12px;
}

/* LANTERN planning workspace: fixed labels, quiet grid and solid color bars. */
html body .lantern-gantt {
    --gantt-task: #8dd8d0;
    --gantt-stage: #b8b5eb;
    --gantt-milestone: #e9d783;
    gap: 16px;
    color: var(--body-color);
}

html body .lantern-gantt .project-gantt-toolbar {
    padding: 18px;
    border: 1px solid var(--surface-border);
    border-radius: 14px;
    background: var(--lantern-panel);
    backdrop-filter: blur(12px);
    gap: 16px;
}

html body .lantern-gantt .project-gantt-heading h3 {
    font-size: 21px;
    font-weight: 600;
    color: var(--body-color);
}

html body .lantern-gantt .project-gantt-heading>span {
    background: var(--lantern-inset);
    color: var(--primary);
    border-radius: 12px;
}

html body .lantern-gantt :is(.project-gantt-heading small, .project-gantt-row-label small, .project-gantt-scale span, .project-gantt-inspector small, .project-gantt-inspector p, .project-gantt-inspector-meta strong) {
    color: var(--text-muted);
}

html body .lantern-gantt :is(.project-gantt-zoom, .workspace-segmented) {
    padding: 4px;
    gap: 3px;
    border: 1px solid var(--surface-border);
    border-radius: 9px;
    background: var(--lantern-inset);
}

html body .lantern-gantt :is(.project-gantt-zoom button, .workspace-segmented button, .project-gantt-fullscreen-button, .workspace-chip-list button) {
    min-height: 36px;
    border-radius: 6px;
    background: transparent;
    color: var(--body-color);
    box-shadow: none;
}

html body .lantern-gantt .project-gantt-zoom-value {
    color: var(--body-color) !important;
}

html body .lantern-gantt :is(.workspace-segmented button.active, .workspace-chip-list button.active) {
    background: var(--action-bg);
    color: var(--action-text);
    border-color: var(--primary);
}

html body .lantern-gantt .project-gantt-toolbar-filters {
    padding-top: 14px;
    border-top: 1px solid var(--surface-border);
    gap: 10px;
}

html body .lantern-gantt .project-gantt-search {
    flex: 1 1 240px;
    background: var(--input-bg);
    border: 1px solid var(--input-border);
    border-radius: 8px;
}

html body .lantern-gantt .project-gantt-search input {
    color: var(--body-color);
}

html body .lantern-gantt .project-gantt-search input::placeholder {
    color: var(--text-muted);
}

html body .lantern-gantt .project-gantt-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(220px, 1.5fr);
    gap: 10px;
    padding: 0;
    border: 0;
    background: transparent;
}

html body .lantern-gantt .project-gantt-summary>span {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    padding: 14px 16px;
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    color: var(--text-muted);
    background: var(--lantern-inset);
}

html body .lantern-gantt .project-gantt-summary strong {
    color: var(--body-color);
    font-size: 20px;
    font-weight: 600;
}

html body .lantern-gantt .project-gantt-summary>span:last-child strong {
    font-size: 13px;
}

html body .lantern-gantt .project-gantt-scroll {
    max-height: 65vh;
    overflow: auto;
    border: 1px solid var(--surface-border);
    border-radius: 12px;
    background: var(--lantern-inset);
    scrollbar-width: thin;
}

html body .lantern-gantt :is(.project-gantt-header, .project-gantt-label-head, .project-gantt-row-label, .project-gantt-group-label) {
    background: var(--surface-bg-strong);
    color: var(--body-color);
    border-color: var(--surface-border);
}

html body .lantern-gantt .project-gantt-label-head {
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}

html body .lantern-gantt .project-gantt-scale span {
    text-align: center;
    border-color: var(--surface-border);
    font-weight: 500;
}

html body .lantern-gantt .project-gantt-row {
    min-height: 64px;
    color: var(--body-color);
    border-color: var(--surface-border);
}

html body .lantern-gantt .project-gantt-track {
    min-height: 64px;
    background-image: linear-gradient(90deg, var(--surface-border) 1px, transparent 1px);
}

html body .lantern-gantt .project-gantt-row-label {
    border-right: 1px solid var(--surface-border);
    box-shadow: 5px 0 12px rgba(0, 0, 0, .06);
}

html body .lantern-gantt .project-gantt-row-label strong {
    font-size: 13px;
    font-weight: 600;
}

html body .lantern-gantt .project-gantt-row:is(:hover, .selected) {
    background: var(--surface-hover);
}

html body .lantern-gantt .project-gantt-row.selected .project-gantt-row-label {
    box-shadow: inset 3px 0 var(--primary);
}

html body .lantern-gantt .project-gantt-row:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
}

html body .lantern-gantt :is(.project-gantt-group-label, .project-gantt-group-track) {
    background: var(--surface-bg-strong);
    border-color: var(--surface-border);
    min-height: 36px;
}

html body .lantern-gantt .project-gantt-group-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

html body .lantern-gantt .project-gantt-bar {
    height: 26px;
    border-radius: 6px;
    background: var(--gantt-stage);
    border: 1px solid rgba(0, 0, 0, .14);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
}

html body .lantern-gantt .project-gantt-bar.task {
    background: var(--gantt-task);
}

html body .lantern-gantt .project-gantt-bar:is(.done, .completed) {
    background: #a5d8b6;
}

html body .lantern-gantt .project-gantt-bar.blocked {
    background: #edb3ac;
}

html body .lantern-gantt .project-gantt-bar.late {
    border: 2px dashed #943e36;
}

html body .lantern-gantt .project-gantt-bar i {
    background: rgba(0, 0, 0, .14);
    border-radius: 0;
}

html body .lantern-gantt .project-gantt-bar b {
    color: #162c2a;
    font-size: 10px;
    text-shadow: none;
}

html body .lantern-gantt .project-gantt-bar.milestone {
    height: 18px;
    border-radius: 3px;
    background: var(--gantt-milestone);
}

html body .lantern-gantt .project-gantt-dot {
    background: var(--gantt-stage);
}

html body .lantern-gantt .project-gantt-dot.task {
    background: var(--gantt-task);
    border-radius: 3px;
}

html body .lantern-gantt .project-gantt-dot.milestone {
    background: var(--gantt-milestone);
    border-radius: 2px;
    transform: rotate(45deg);
}

html body .lantern-gantt .project-gantt-today {
    background: var(--primary);
    width: 1px;
    pointer-events: none;
}

html body .lantern-gantt .project-gantt-today>span {
    background: var(--action-bg);
    color: var(--action-text);
    border-radius: 4px;
}

html body .lantern-gantt .project-gantt-inspector {
    padding: 20px;
    border: 1px solid var(--surface-border);
    border-left: 3px solid var(--primary);
    border-radius: 12px;
    background: var(--surface-bg-strong);
    color: var(--body-color);
}

html body .lantern-gantt .project-gantt-inspector h6 {
    color: var(--body-color);
    font-size: 18px;
}

html body .lantern-gantt .project-gantt-inspector-meta span {
    background: var(--lantern-inset);
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    color: var(--body-color);
}

html body .lantern-gantt.is-fullscreen {
    background: var(--body-bg);
    padding: 20px;
}

html body .lantern-gantt.is-fullscreen .project-gantt-scroll {
    max-height: none;
}

@media (max-width: 767px) {
    html body .lantern-gantt .project-gantt-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    html body .lantern-gantt .project-gantt-toolbar {
        padding: 12px;
    }

    html body .lantern-gantt .project-gantt-toolbar-controls {
        width: 100%;
        flex-wrap: wrap;
    }

    html body .lantern-gantt .project-gantt-zoom {
        flex-wrap: wrap;
    }

    html body .lantern-gantt .project-gantt-summary>span {
        padding: 10px;
    }

    html body .lantern-gantt.is-fullscreen {
        padding: 10px;
    }
}

/* Reserve a single vertical control rail; never overlay it on card content. */
html body .lantern-vertical-carousel .lantern-slide-controls {
    width: 40px;
    flex-wrap: nowrap;
    right: 8px;
    gap: 4px;
    overflow-x: hidden;
}

html body .lantern-vertical-carousel .lantern-stack-stage {
    width: calc(100% - 48px);
    margin-right: 48px;
}

html body .lantern-vertical-carousel .lantern-slide-controls button {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
}

html body .lantern-vertical-carousel .lantern-slide-controls .lantern-slide-dot {
    padding: 11px;
    border: 0;
    background-clip: content-box;
    box-shadow: none;
}

@media (max-width: 640px) {
    html body .main-content {
        width: calc(100% - 12px);
        padding: 6px;
        margin: 6px auto;
    }

    html body .page-content {
        padding: 0 0 182px;
        min-width: 0;
    }

    /* Footer logo provides tenant navigation on phones. */
    html body .top-navbar .mobile-menu-toggle {
        display: none !important;
    }

    html body .lantern-cockpit {
        grid-template-columns: minmax(0, 1fr);
        padding: 8px 0 20px;
        min-height: 0;
    }

    html body :is(.lantern-cockpit-left, .lantern-cockpit-main, .lantern-cockpit-right) {
        min-width: 0;
        width: 100%;
    }

    html body :is(.lantern-mini-stat-row, .lantern-main-stats) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    html body .lantern-main-stats .lantern-mini-stat:last-child {
        grid-column: 1 / -1;
    }

    html body .lantern-mini-stat {
        min-height: 100px;
        padding: 12px;
    }

    html body .lantern-mini-stat span {
        font-size: 12px;
        overflow-wrap: anywhere;
    }

    html body .lantern-mini-stat strong {
        font-size: 32px;
    }

    html body .lantern-slide-panel {
        padding: 12px 8px 24px;
    }

    html body .lantern-slide-head h2 {
        font-size: 16px;
    }

    html body .lantern-project-stack-card {
        padding: 12px;
        gap: 10px;
    }

    html body .lantern-project-stack-card>strong {
        font-size: 17px;
    }

    html body .lantern-project-card-meta {
        font-size: 11px;
        overflow-wrap: anywhere;
    }

    html body .lantern-stack-layer {
        max-width: calc(100% - 48px);
    }

    html body .lantern-footer {
        position: fixed;
        left: 50%;
        bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 8px));
        transform: translateX(-50%);
        width: calc(100vw - 12px);
        margin: 0;
        padding: 0;
        gap: 8px;
    }

    html body .lantern-footer-dock {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(128px, 1.3fr);
        width: 100%;
        padding: 8px;
        gap: 8px;
    }

    html body .lantern-footer-brand {
        width: 84px;
        height: 30px;
    }

    html body .lantern-footer-search {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
    }

    html body .lantern-footer-search .form-control {
        height: 40px;
        min-height: 40px;
    }

    html body .lantern-view-select {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        height: 38px;
        min-width: 0;
    }

    html body .lantern-footer-links {
        display: flex;
        width: 100%;
        gap: 5px;
        padding: 0 2px;
        overflow-x: auto;
        overflow-y: hidden;
        justify-content: flex-start;
        scrollbar-width: none;
    }

    html body .lantern-footer-links::-webkit-scrollbar {
        display: none;
    }

    html body .lantern-footer-links a {
        flex: 0 0 auto;
        min-height: 44px;
        padding: 0 14px;
        font-size: 12px;
        white-space: nowrap;
    }

    html body .lantern-footer-profile {
        flex: 0 0 44px;
    }

    html body .lantern-orb-btn {
        width: 44px;
        min-width: 44px;
        height: 44px;
        padding: 0;
    }

    body>#footerProfileMenu.lantern-footer-menu {
        left: 12px !important;
        right: 12px !important;
        bottom: 166px !important;
        width: auto !important;
        max-height: min(360px, calc(100dvh - 190px));
        z-index: 1001;
    }

    html body .top-navbar.glass-card {
        width: 100%;
        min-width: 0;
        flex-wrap: wrap;
        justify-content: center;
        margin: 4px auto 12px;
    }
}

/* Footer search opens above the dock, within the visible viewport. */
html body :is(.lantern-footer-dock, .lantern-footer-profile) {
    position: relative;
}

html body button.lantern-footer-brand {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

html body .lantern-footer-menu {
    top: auto;
    bottom: calc(100% + 12px);
    right: 0;
    width: min(270px, calc(100vw - 40px));
    max-height: min(460px, 60dvh);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 6px;
    pointer-events: auto;
}

html body .lantern-navigation-menu {
    left: 0;
    right: auto;
}

html body .lantern-footer-menu a {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    min-height: 44px;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--body-color);
    font-size: 14px;
    box-shadow: none;
}

html body .lantern-footer-menu a:is(:hover, :focus-visible, .active) {
    background: var(--surface-hover);
}

html body .lantern-footer-search .tenant-search-panel {
    top: auto;
    bottom: calc(100% + 8px);
    max-height: min(420px, 65dvh);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

/* Larger centered cards with a compact, independently scrolling control rail. */
html body .lantern-vertical-carousel .lantern-stack-stage {
    width: calc(100% - 56px);
    margin: 0 auto;
    min-height: 0;
    padding-bottom: 56px;
}

html body .lantern-vertical-carousel .lantern-task-stack-list {
    padding-right: 0;
}

html body .lantern-vertical-carousel .lantern-slide-head {
    padding: 0 28px;
}

html body .lantern-project-carousel .lantern-stack-card {
    min-height: 300px;
}

html body .lantern-project-stack-card {
    min-height: 300px;
    padding: clamp(18px, 2vw, 28px);
    gap: 18px;
    justify-content: space-between;
}

html body .lantern-project-stack-card>strong {
    font-size: clamp(21px, 1.7vw, 28px);
}

html body .lantern-project-card-team {
    font-size: 14px;
}

html body .lantern-project-card-meta {
    font-size: 12px;
}

html body .lantern-vertical-carousel .lantern-stack-layers {
    top: auto;
    bottom: 0;
    height: 60px;
    left: 0;
    right: 0;
}

html body .lantern-vertical-carousel .lantern-stack-layer {
    max-width: none;
}

html body .lantern-vertical-carousel .lantern-slide-controls {
    right: 4px;
    top: 54px;
    bottom: 64px;
    width: 24px;
    padding: 2px;
    gap: 3px;
    scrollbar-width: none;
}

html body .lantern-vertical-carousel .lantern-slide-controls::-webkit-scrollbar {
    display: none;
}

html body .lantern-vertical-carousel .lantern-slide-controls button {
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
    font-size: 9px;
}

html body .lantern-vertical-carousel .lantern-slide-controls .lantern-slide-dot {
    padding: 7px;
}

@media (max-width: 640px) {
    html body .lantern-slide-panel {
        padding-left: 0;
        padding-right: 0;
    }

    html body .lantern-vertical-carousel .lantern-stack-stage {
        width: calc(100% - 48px);
    }

    html body .lantern-project-stack-card {
        padding: 16px;
        gap: 14px;
    }

    html body .lantern-project-stack-card>strong {
        font-size: 21px;
    }

    html body .lantern-vertical-carousel .lantern-slide-head {
        padding: 0 24px;
    }

    html body .lantern-vertical-carousel .lantern-slide-controls {
        right: 0;
    }
}

/* Compact dashboard calendar: markers denote event starts, matching the full calendar. */
html body .lantern-calendar-grid button {
    position: relative;
    grid-template-rows: 1fr 10px;
    gap: 2px;
    padding: 6px 2px 4px;
    min-height: 40px;
    font-size: 12px;
}

html body .lantern-calendar-grid button.today {
    border: 2px solid var(--primary-light);
    font-weight: 700;
}

html body .lantern-calendar-grid button.selected {
    background: var(--action-bg);
    color: var(--action-text);
    box-shadow: inset 0 0 0 1px var(--primary-light);
}

.lantern-calendar-markers,
.lantern-calendar-legend,
.lantern-calendar-legend>span {
    display: flex;
    align-items: center;
    gap: 4px;
}

.lantern-calendar-markers {
    justify-content: center;
    min-height: 8px;
}

.lantern-calendar-marker {
    display: inline-block;
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border: 1px solid rgba(0, 0, 0, .55);
    border-radius: 50%;
    background: #60d5ef;
}

.lantern-calendar-marker.milestone {
    background: #ffda79;
    border-radius: 1px;
}

.lantern-calendar-marker.meeting {
    background: #d4b2ff;
    border-radius: 2px;
    transform: rotate(45deg);
}

.lantern-calendar-legend {
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 12px;
    font-size: 11px;
    color: var(--body-color);
}

.lantern-calendar-today-key {
    width: 9px;
    height: 9px;
    border: 2px solid var(--primary-light);
    border-radius: 2px;
}

.lantern-calendar-summary {
    border-top: 1px solid var(--surface-border);
    margin-top: 12px;
    padding-top: 12px;
    font-size: 12px;
}

.lantern-calendar-summary strong {
    font-size: 12px;
    font-weight: 600;
}

.lantern-calendar-summary ul {
    list-style: none;
    padding: 0;
    margin: 8px 0 0;
}

.lantern-calendar-summary li {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.lantern-calendar-summary li>span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

.lantern-calendar-summary p {
    margin: 8px 0 0;
    color: var(--text-muted);
}

/* Theme-aware dashboard details; legacy glass fills used fixed light colors. */
html body :is(.lantern-stack-layer, .lantern-task-strip, .lantern-log-row,
    .lantern-activity-detail) {
    background: var(--lantern-inset);
    border-color: var(--surface-border);
    color: var(--body-color);
}

html body :is(.lantern-log-row small, .lantern-task-strip small,
    .lantern-calendar-weekdays, .lantern-footer-search > i) {
    color: var(--text-muted);
}

html body :is(.lantern-log-row, .lantern-task-strip):hover {
    background: var(--surface-hover);
    color: var(--body-color);
}

html body .lantern-log-feed {
    background-image: none;
}

html body :is(.lantern-project-meter i, .lantern-task-strip i) {
    background: var(--lantern-inset);
    border-color: var(--surface-border);
}

html body .lantern-view-select {
    background: var(--action-bg);
    color: var(--action-text);
    border-color: var(--primary);
}

html body .lantern-view-select:hover {
    background: var(--action-hover);
}

html body .lantern-slide-controls button {
    background: var(--lantern-inset);
    border-color: var(--surface-border);
}

html body .lantern-slide-controls button:hover {
    background: var(--surface-hover);
}

html body .lantern-slide-controls .lantern-slide-dot {
    background-color: var(--text-muted);
}

html body .lantern-slide-controls .lantern-slide-dot.active {
    background-color: var(--primary);
}

/* Dedicated chat: quiet, theme-aware surfaces with independent scrolling. */
html body .teams-style-chat-page .teams-chat-shell {
    grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
    height: max(380px, calc(100dvh - 310px));
    min-height: 0;
    max-height: none;
    margin: 0;
    border: 1px solid var(--surface-border);
    border-radius: 16px;
    box-shadow: var(--shadow-lg);
}

html body .teams-style-chat-page :is(.team-chat-rail, .team-chat-main) {
    background: var(--surface-bg-strong);
    color: var(--body-color);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

html body .teams-style-chat-page .team-chat-rail {
    padding: 18px 12px;
    border-right: 1px solid var(--surface-border);
    gap: 14px;
}

html body .teams-style-chat-page .team-chat-rail-header {
    padding: 0 6px 4px;
    font-size: 16px;
}

html body .teams-style-chat-page :is(.team-chat-rail-header, .team-chat-thread, .team-chat-main-header h6, .team-chat-empty strong) {
    color: var(--body-color);
}

html body .teams-style-chat-page :is(.team-chat-thread-copy small, .team-chat-main-header small, .team-chat-search i, .team-chat-empty, .chat-bubble > small, .chat-composer-hint) {
    color: var(--text-muted);
}

html body .teams-style-chat-page .team-chat-switcher {
    padding: 4px;
    gap: 4px;
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    background: var(--lantern-inset);
}

html body .teams-style-chat-page .team-chat-switcher button {
    min-height: 38px;
    border: 0;
    background: transparent;
    color: var(--text-muted);
    box-shadow: none;
}

html body .teams-style-chat-page .team-chat-switcher button.active {
    background: var(--action-bg);
    color: var(--action-text);
}

html body .teams-style-chat-page .team-chat-thread {
    min-height: 76px;
    border-radius: 10px;
}

html body .teams-style-chat-page .team-chat-thread:hover {
    background: var(--surface-hover);
}

html body .teams-style-chat-page .team-chat-thread.active {
    background: var(--lantern-selected);
    border-color: var(--primary);
}

html body .teams-style-chat-page :is(.team-chat-main-header, .team-chat-composer) {
    background: var(--surface-bg-strong);
    border-color: var(--surface-border);
    padding: 16px 22px;
}

html body .teams-style-chat-page .team-chat-main-header h6 {
    font-size: 16px;
    font-weight: 600;
}

html body .teams-style-chat-page .chat-profile-trigger {
    overflow: hidden;
}

html body .teams-style-chat-page .team-chat-main-header small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 40vw;
}

html body .teams-style-chat-page .team-chat-panel {
    min-height: 0;
    max-height: none;
    padding: 24px;
    background: var(--body-bg);
}

html body .teams-style-chat-page .chat-message {
    margin-bottom: 18px;
}

html body .teams-style-chat-page .chat-bubble {
    max-width: min(620px, 82%);
    padding: 12px 16px;
    border: 1px solid var(--surface-border);
    border-radius: 4px 14px 14px;
    background: var(--surface-bg-strong);
    color: var(--body-color);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
    font-size: 14px;
    line-height: 1.6;
}

html body .teams-style-chat-page .chat-bubble::before {
    display: none;
}

html body .teams-style-chat-page .chat-sender {
    color: var(--primary);
    font-weight: 600;
}

html body .teams-style-chat-page .chat-message.mine .chat-bubble {
    background: var(--action-bg);
    color: var(--action-text);
    border-color: var(--action-bg);
    border-radius: 14px 4px 14px 14px;
}

html body .teams-style-chat-page .chat-message.mine :is(.chat-sender, .chat-bubble > small, .chat-mention-token) {
    color: var(--action-text);
}

html body .teams-style-chat-page :is(.chat-attachment.file, .chat-deleted) {
    color: inherit;
}

html body .teams-style-chat-page .chat-mention-token {
    color: var(--primary);
}

html body .teams-style-chat-page .chat-bubble>small {
    margin-top: 8px;
    font-size: 11px;
}

html body .teams-style-chat-page .team-chat-empty {
    min-height: 100%;
    padding: 24px;
}

html body .teams-style-chat-page .team-chat-empty i {
    padding: 18px;
    border-radius: 20px;
    background: var(--surface-hover);
    color: var(--primary);
}

html body .teams-style-chat-page .team-chat-composer textarea.form-control {
    border-radius: 10px;
    background: var(--input-bg);
    min-height: 46px;
}

html body .teams-style-chat-page :is(.chat-icon-btn, .chat-details-button, .chat-details-header button) {
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    background: var(--lantern-inset);
    color: var(--body-color);
    flex-shrink: 0;
}

html body .teams-style-chat-page .chat-icon-btn.primary {
    background: var(--action-bg);
    color: var(--action-text);
    border-color: var(--action-bg);
}

html body .teams-style-chat-page .chat-icon-btn:disabled {
    opacity: .45;
    cursor: not-allowed;
}

html body .teams-style-chat-page .chat-composer-hint {
    display: block;
    padding: 8px 52px 0;
    font-size: 11px;
}

html body .teams-style-chat-page :is(.chat-details-panel, .chat-mention-list) {
    background: var(--surface-bg-strong);
    border-color: var(--surface-border);
    color: var(--body-color);
}

html body .teams-style-chat-page :is(.chat-details-header, .chat-details-hero h3, .chat-details-section p, .chat-details-list dd, .chat-mention-list button) {
    color: var(--body-color);
}

html body .teams-style-chat-page :is(.chat-details-hero > span, .chat-details-section small, .chat-details-list dt, .chat-mention-list small) {
    color: var(--text-muted);
}

html body .teams-style-chat-page :is(.chat-details-section h4, .team-chat-rail-header small) {
    color: var(--primary);
}

html body .teams-style-chat-page .chat-details-tags>span {
    color: var(--body-color);
    background: var(--surface-hover);
}

@media (max-width: 767px) {
    html body .teams-style-chat-page .teams-chat-shell {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 260px minmax(420px, 1fr);
        height: auto;
    }

    html body .teams-style-chat-page .team-chat-rail {
        border-right: 0;
        border-bottom: 1px solid var(--surface-border);
        padding: 12px;
        gap: 8px;
    }

    html body .teams-style-chat-page .team-chat-main {
        height: 65dvh;
        min-height: 420px;
    }

    html body .teams-style-chat-page :is(.team-chat-main-header, .team-chat-composer, .team-chat-panel) {
        padding: 12px;
    }

    html body .teams-style-chat-page .chat-bubble {
        max-width: 92%;
    }

    html body .teams-style-chat-page .chat-composer-hint {
        padding-left: 0;
    }
}

button#ownerMenuToggle img {
    width: 150px;
    background: none;
}

button#ownerMenuToggle {
    background: transparent;
    border: none;
}