:root {
    --bg: #f4f6f8;
    --panel: #ffffff;
    --ink: #172033;
    --muted: #5c6878;
    --line: #d9e0ea;
    --blue: #183f75;
    --blue-2: #2e6fa7;
    --soft: #eef2f6;
    --accent: #d88a52;
    --green: #1f8f5f;
    --red: #b42318;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: var(--bg);
    color: var(--ink);
}

a {
    color: var(--blue);
    text-decoration: none;
}

button,
input,
select {
    font: inherit;
}

button,
.ghost {
    min-height: 40px;
    border: 0;
    border-radius: 7px;
    padding: 0 15px;
    font-weight: 800;
}

button {
    background: var(--blue);
    color: #fff;
}

.ghost {
    display: inline-flex;
    align-items: center;
    background: var(--soft);
    color: var(--ink);
}

input,
select {
    width: 100%;
    min-height: 42px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    padding: 9px 10px;
    background: #fff;
}

label {
    display: grid;
    gap: 7px;
    color: #526071;
    font-size: 0.92rem;
    font-weight: 750;
}

.guest {
    display: grid;
    place-items: center;
    padding: 24px;
}

.public {
    width: min(1020px, 100%);
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
    gap: 28px;
    align-items: stretch;
}

.wide {
    grid-column: 1 / -1;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 32px;
}

.landing,
.login,
.table-card,
.cards article,
.plan {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.07);
}

.landing,
.login {
    padding: 30px;
}

.logo {
    width: min(100%, 500px);
    height: auto;
    margin-bottom: 22px;
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--blue-2);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

h1,
h2 {
    margin: 0 0 14px;
}

h1 {
    font-size: clamp(2rem, 5vw, 3.25rem);
    line-height: 1.04;
}

.message,
.status,
.module-head p,
.table-card p,
.cards p,
.plan span {
    color: var(--muted);
    line-height: 1.55;
}

.status {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 18px;
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #f5a524;
    box-shadow: 0 0 0 5px rgba(245, 165, 36, 0.14);
}

.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.flash {
    grid-column: 1 / -1;
    padding: 12px 14px;
    margin-bottom: 14px;
    border-radius: 7px;
    background: #e8f3ff;
    border: 1px solid #b9d7f2;
    color: #173f70;
    font-weight: 750;
}

.plans {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 20px 0;
}

.plan {
    display: grid;
    gap: 10px;
    padding: 20px;
    cursor: pointer;
}

.plan input {
    width: auto;
    min-height: auto;
}

.plan strong {
    font-size: 1.35rem;
}

.plan em {
    color: var(--blue);
    font-style: normal;
    font-weight: 850;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

fieldset {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
}

fieldset label {
    display: flex;
    align-items: center;
    gap: 8px;
}

fieldset input {
    width: auto;
    min-height: auto;
}


.registration-legal {
    display: grid;
    gap: 16px;
    margin: 22px 0 18px;
    padding: 20px;
    border: 1px solid #c7d8ea;
    border-radius: 10px;
    background: #f7fbff;
}

.registration-legal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.registration-legal-head h2 {
    margin-bottom: 0;
    font-size: 1.25rem;
}

.registration-legal > p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.free-badge {
    flex: 0 0 auto;
    padding: 6px 10px;
    border-radius: 999px;
    background: #e7f6ee;
    color: #17633f;
    font-size: 0.78rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

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

.legal-document-card {
    display: grid;
    gap: 7px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
}

.legal-document-card:hover {
    border-color: #9dbbd6;
}

.legal-document-card span {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.45;
}

.legal-document-card em {
    color: var(--blue);
    font-size: 0.88rem;
    font-style: normal;
    font-weight: 850;
}

.legal-acceptance {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding-top: 4px;
    color: var(--ink);
}

.legal-acceptance input {
    width: auto;
    min-height: auto;
    margin-top: 3px;
}

.legal-warning {
    padding: 10px 12px;
    border-left: 3px solid #d88a52;
    background: #fff8f2;
    color: #6b4b34 !important;
    font-size: 0.9rem;
}

.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 286px minmax(0, 1fr);
    background: var(--bg);
}

.sidebar {
    position: sticky;
    top: 0;
    align-self: start;
    height: 100vh;
    overflow: hidden auto;
    background: #202b38;
    color: #fff;
    padding: 16px 12px;
}

.brand {
    display: grid;
    gap: 10px;
    padding: 4px 8px 16px;
    color: #fff;
}

.brand-mark {
    display: block;
    border-radius: 7px;
    background: #fff;
    padding: 8px;
}

.brand-mark img {
    display: block;
    width: 100%;
    max-width: 210px;
    height: auto;
}

.brand-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.brand-meta small {
    color: #cbd5e1;
    font-size: 0.75rem;
    font-weight: 700;
}

.module-nav {
    display: grid;
    gap: 3px;
}

.volt-app .sidebar {
    background: #202b38;
    box-shadow: 8px 0 24px rgba(15, 23, 42, 0.08);
}

.volt-app .main {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--bg);
}

.volt-app .main > .content-region {
    display: block !important;
    min-width: 0;
    width: min(100%, 1440px) !important;
    margin: 0 !important;
    padding: 24px clamp(18px, 3vw, 34px) 40px !important;
    position: relative;
    z-index: 1;
}

.volt-app .app-shell {
    display: grid !important;
    grid-template-columns: 286px minmax(0, 1fr) !important;
}

.sidebar-toggle {
    min-height: 30px;
    width: 30px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 5px;
    background: transparent;
    color: #fff;
    font-size: 1.25rem;
    line-height: 1;
}

.sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.12);
}

.sidebar-collapsed .app-shell {
    grid-template-columns: 76px minmax(0, 1fr);
}

.sidebar-collapsed.volt-app .app-shell {
    grid-template-columns: 76px minmax(0, 1fr) !important;
}

.sidebar-collapsed .sidebar {
    overflow-x: hidden;
    padding-left: 8px;
    padding-right: 8px;
}

.sidebar-collapsed .brand {
    padding-left: 0;
    padding-right: 0;
}

.sidebar-collapsed .brand-mark {
    width: 52px;
    height: 44px;
    padding: 6px;
    overflow: hidden;
    justify-self: center;
}

.sidebar-collapsed .brand-mark img {
    width: 150px;
    max-width: none;
    object-fit: cover;
    object-position: left;
}

.sidebar-collapsed .brand-meta small,
.sidebar-collapsed .subnav {
    display: none;
}

.sidebar-collapsed .sidebar-toggle {
    display: block;
    margin: 0 auto;
}

.volt-app .topbar {
    min-height: 72px;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
}

.volt-app .cards article,
.volt-app .table-card {
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.nav-group {
    border-radius: 8px;
}

.nav-group.is-active {
    background: rgba(255, 255, 255, 0.06);
}

.module-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    align-items: center;
    gap: 4px;
    min-height: 38px;
}

.module-link {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    min-width: 0;
    border-radius: 7px;
    padding: 8px !important;
    color: #f8fafc !important;
    font-weight: 700;
}

.module-icon {
    display: inline-grid;
    width: 22px;
    height: 22px;
    place-items: center;
    color: #75b8ef;
    font-size: 1.05rem;
    font-weight: 800;
}

.module-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.module-toggle {
    min-height: 30px;
    width: 30px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #cbd5e1;
    font-size: 1rem;
    transition: transform 0.15s ease, background 0.15s ease;
}

.module-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
}

.nav-group:not(.is-open) .module-toggle {
    transform: rotate(-90deg);
}

.sidebar a {
    color: #f8fafc;
    border-radius: 7px;
}

.sidebar a:hover {
    background: rgba(255, 255, 255, 0.09);
}

.subnav {
    display: none;
    gap: 2px;
    padding: 0 0 7px 37px;
}

.nav-group.is-open .subnav {
    display: grid;
}

.sidebar .sub {
    display: block;
    padding: 6px 8px;
    color: #dbe6f3;
    font-size: 0.9rem;
}

.sidebar .sub.is-active {
    background: rgba(117, 184, 239, 0.18);
    color: #fff;
    font-weight: 750;
}

.sidebar-collapsed .module-row {
    grid-template-columns: 1fr;
}

.sidebar-collapsed .module-link {
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 10px 4px !important;
}

.sidebar-collapsed .module-label,
.sidebar-collapsed .module-toggle {
    display: none;
}

.sidebar-collapsed .module-icon {
    margin: 0 auto;
}

.sidebar-collapsed .nav-group.is-active {
    background: rgba(117, 184, 239, 0.18);
}

.main {
    min-width: 0;
}

.topbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    align-items: center;
    min-height: 66px;
    padding: 12px 22px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.topbar .search {
    flex: 1 1 320px;
    max-width: 560px;
}

.topbar .user-menu {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    white-space: nowrap;
}

.tenant-switch {
    flex: 0 1 260px;
}

.tenant-switch label {
    gap: 4px;
}

.tenant-switch span {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.main main {
    padding: 24px;
}

.module-head {
    margin-bottom: 20px;
}

.volt-app .module-head h1 {
    font-size: clamp(1.8rem, 3vw, 2.5rem);
}

.dashboard-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 460px);
    gap: 18px;
    align-items: stretch;
}

.quick-task {
    display: grid;
    gap: 10px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.quick-task-row {
    display: grid;
    grid-template-columns: 1fr 0.8fr 1fr auto;
    gap: 8px;
}

.cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.kpi-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 16px;
}

.cards article,
.table-card {
    padding: 18px;
}

.cards span {
    display: block;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.cards strong {
    display: block;
    margin: 8px 0;
    font-size: 2rem;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.dashboard-panel {
    min-height: 240px;
}

.panel-head {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: baseline;
    margin-bottom: 14px;
}

.panel-head h2 {
    margin: 0;
    font-size: 1.05rem;
}

.panel-head span,
.panel-head a {
    color: var(--muted);
    font-size: 0.85rem;
    font-weight: 750;
}

.record-list,
.compact-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.record-list {
    list-style: none;
}

.compact-list {
    padding-left: 18px;
}

.record-list li {
    display: grid;
    gap: 3px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
}

.record-list li:last-child {
    border-bottom: 0;
}

.record-list strong {
    color: var(--ink);
}

.record-list span,
.empty-state {
    color: var(--muted);
    font-size: 0.92rem;
    line-height: 1.45;
}

.mood-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.mood-form .wide-label,
.mood-form button {
    grid-column: 1 / -1;
}

.filters {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 10px;
    border-bottom: 1px solid var(--line);
    text-align: left;
}

@media (max-width: 1180px) {
    .kpi-cards,
    .dashboard-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .public,
    .plans,
    .form-grid,
    fieldset,
    .legal-document-grid,
    .cards,
    .dashboard-hero,
    .dashboard-grid,
    .kpi-cards,
    .quick-task-row,
    .mood-form,
    .app-shell {
        grid-template-columns: 1fr;
    }

    .volt-app .app-shell,
    .sidebar-collapsed.volt-app .app-shell {
        grid-template-columns: 1fr !important;
    }

    .sidebar {
        position: static;
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .topbar {
        align-items: stretch;
    }

    .topbar .search,
    .tenant-switch,
    .topbar .user-menu {
        flex: 1 1 100%;
        max-width: none;
        margin-left: 0;
    }

    .topbar .user-menu {
        justify-content: flex-start;
    }

    .sidebar-collapsed .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar-collapsed .sidebar {
        padding: 18px 14px;
    }

    .sidebar-collapsed .brand {
        padding: 4px 8px 16px;
    }

    .sidebar-collapsed .brand-mark {
        width: auto;
        height: auto;
        padding: 8px;
        justify-self: stretch;
    }

    .sidebar-collapsed .brand-mark img {
        width: 100%;
        max-width: 210px;
    }

    .sidebar-collapsed .brand-meta small,
    .sidebar-collapsed .module-label,
    .sidebar-collapsed .module-toggle {
        display: initial;
    }

    .sidebar-collapsed .module-row {
        grid-template-columns: minmax(0, 1fr) 30px;
    }

    .sidebar-collapsed .module-link {
        grid-template-columns: 28px minmax(0, 1fr);
        justify-items: stretch;
        padding: 8px !important;
    }

    .sidebar-collapsed .nav-group.is-open .subnav {
        display: grid;
    }
}


textarea {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    padding: 9px 10px;
    background: #fff;
    font: inherit;
    resize: vertical;
}

.stack {
    display: grid;
    gap: 12px;
}

.small {
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.45;
}

.profile-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 18px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}

.profile-tabs a {
    padding: 8px 12px;
    border-radius: 6px;
    color: var(--muted);
    font-weight: 750;
}

.profile-tabs a.is-active {
    background: var(--blue);
    color: #fff;
}

.compact-check,
.quick-remind {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.compact-check input,
.quick-remind input {
    width: auto;
    min-height: auto;
}

.compact-quick-task {
    padding: 12px;
    align-self: start;
}

.quick-task-row.compact {
    grid-template-columns: minmax(132px, 1fr) minmax(104px, 0.78fr) auto auto;
    align-items: end;
}

.quick-datetime {
    display: grid;
    gap: 3px;
    margin: 0;
}

.quick-datetime span {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
}

.quick-datetime input {
    min-width: 0;
}

.quick-remind {
    min-height: 40px;
    margin: 0 2px 0 0;
    white-space: nowrap;
    font-size: 0.85rem;
}

.dashboard-settings-list {
    display: grid;
    gap: 8px;
}

.dashboard-setting-item {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
}

.dashboard-setting-item.dragging {
    opacity: 0.6;
}

.drag-handle {
    color: var(--muted);
    cursor: grab;
}

.dashboard-widget-toggle {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.dashboard-widget-toggle input {
    width: auto;
    min-height: auto;
}

.dashboard-widget-toggle span {
    display: grid;
    gap: 2px;
}

.dashboard-widget-toggle small {
    color: var(--muted);
    font-weight: 500;
}

@media (max-width: 860px) {
    .quick-task-row.compact {
        grid-template-columns: 1fr;
    }
}


.blueprint-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
}

.blueprint-filters a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-weight: 800;
}

.blueprint-filters a.is-active {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.blueprint-filters span {
    display: inline-grid;
    min-width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 999px;
    background: rgba(255,255,255,0.18);
    font-size: 0.78rem;
}

.blueprint-add {
    margin-bottom: 16px;
}

.blueprint-add summary {
    cursor: pointer;
    font-weight: 850;
}

.blueprint-add[open] summary {
    margin-bottom: 16px;
}

.blueprint-table {
    padding: 0;
    overflow: hidden;
}

.blueprint-table .table-shell {
    overflow-x: auto;
}

.blueprint-table table {
    min-width: 980px;
}

.blueprint-table th {
    white-space: nowrap;
    background: var(--soft);
}

.blueprint-table th a {
    color: var(--ink);
}

.blueprint-table td select {
    min-width: 110px;
    min-height: 34px;
    padding: 5px 7px;
}

.blueprint-table button.compact {
    min-height: 34px;
    padding: 0 10px;
}

.blueprint-check {
    width: 54px;
    text-align: center;
}

.blueprint-check input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-height: auto;
}

.blueprint-table tr.is-completed td {
    color: var(--muted);
    background: #f8fafc;
}

.blueprint-table tr.is-completed td:nth-child(4) {
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}


.upgrade-notice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid #d8dee9;
    border-radius: 8px;
    background: #fff;
}

.upgrade-notice > div {
    display: grid;
    gap: 2px;
}

.upgrade-notice strong {
    font-size: 0.95rem;
}

.upgrade-notice span {
    color: var(--muted);
    font-size: 0.86rem;
}

.upgrade-notice a,
.upgrade-install button {
    white-space: nowrap;
}

.upgrade-install,
.upgrade-current {
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}

.upgrade-current {
    font-weight: 800;
}

.upgrade-success {
    border-left: 4px solid #2f855a;
}

.upgrade-failure {
    border-left: 4px solid #b83232;
}

@media (max-width: 760px) {
    .upgrade-notice {
        align-items: flex-start;
        flex-direction: column;
    }
}


.workflow-section {
    margin-bottom: 18px;
}

.workflow-section > h2 {
    margin: 0 0 10px;
    font-size: 1.25rem;
}

.workflow-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.workflow-card {
    min-height: 0;
    padding: 14px;
}

.workflow-card .panel-head {
    margin-bottom: 8px;
}

.workflow-card .panel-head h2 {
    font-size: 1rem;
    line-height: 1.25;
}

.workflow-card p {
    margin: 6px 0;
}

.workflow-card form {
    margin-top: 10px;
}

.workflow-card button,
.button-link {
    padding: 7px 10px;
    font-size: 0.88rem;
}

.workflow-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
    color: var(--muted);
    font-size: 0.82rem;
}

.workflow-metrics strong {
    color: var(--ink);
}

.workflow-updated {
    margin-top: 10px !important;
}

.status-pill {
    white-space: nowrap;
}

@media (max-width: 1180px) {
    .workflow-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .workflow-card-grid {
        grid-template-columns: 1fr;
    }
}


/* Workbench UI component layer: reusable Volt/Bootstrap interaction styling. */
.workflow-card-tools {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.ui-icon-button {
    display: inline-grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    color: var(--muted);
    font-weight: 800;
    line-height: 1;
}

.ui-icon-button:hover,
.ui-icon-button:focus {
    color: var(--blue);
    border-color: #9db9dc;
    background: #f8fbff;
}

.ui-action-menu .dropdown-menu {
    min-width: 180px;
    padding: 6px;
    border-color: var(--line);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14);
}

.ui-action-menu .dropdown-item {
    border-radius: 6px;
    padding: 7px 9px;
    font-size: 0.88rem;
}

.workflow-version,
.workflow-source {
    cursor: help;
    text-decoration: underline dotted;
    text-underline-offset: 3px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #eef2f7;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1;
}

.status-draft {
    background: #fff6df;
    color: #76540a;
}

.status-active {
    background: #e7f7ef;
    color: #17663b;
}

.status-retired {
    background: #f1f3f5;
    color: #667085;
}

.ui-detail-toggle {
    margin-top: 8px;
    padding: 5px 0;
    border: 0;
    background: transparent;
    color: var(--blue);
    font-size: 0.84rem;
    font-weight: 800;
}

.ui-detail-toggle::after {
    content: " ▾";
}

.ui-detail-toggle[aria-expanded="true"]::after {
    content: " ▴";
}

.workflow-detail {
    margin-top: 6px;
    padding: 8px 10px;
    border-left: 3px solid #d7e3f2;
    background: #f8fafc;
    border-radius: 0 6px 6px 0;
}

.workbench-toast-stack {
    z-index: 1095;
}

.workbench-toast {
    min-width: min(360px, calc(100vw - 32px));
    border: 1px solid var(--line);
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.18);
}

.workbench-toast .toast-header {
    background: #fff;
}

.profile-tabs {
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
}

.profile-tabs a:hover,
.profile-tabs a:focus {
    background: #eef4fb;
    color: var(--blue);
}

.modal-content {
    border: 1px solid var(--line);
    border-radius: 10px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.22);
}

.popover {
    max-width: 340px;
    border-color: var(--line);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.13);
}

.tooltip {
    font-size: 0.78rem;
}

@media (max-width: 760px) {
    .ui-action-menu .dropdown-menu {
        min-width: 200px;
    }

    .workbench-toast-stack {
        right: 8px !important;
        left: 8px !important;
        padding: 8px !important;
    }

    .workbench-toast {
        width: 100%;
        min-width: 0;
    }
}


/* Cyberstrike-style My Dashboard: compact command-center density. */
.compact-dashboard-hero {
    align-items: start;
    margin-bottom: 14px;
}

.compact-dashboard-hero h1 {
    margin-bottom: 2px;
}

.compact-dashboard-hero > div > p:last-child {
    margin-bottom: 0;
    color: var(--muted);
}

.dashboard-kpis {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.dashboard-kpis article {
    padding: 12px 14px;
    min-height: 0;
}

.dashboard-kpis span {
    font-size: 0.7rem;
    letter-spacing: 0.06em;
}

.dashboard-kpis strong {
    margin: 3px 0 1px;
    font-size: 1.45rem;
    line-height: 1.1;
}

.dashboard-kpis p {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
}

.cyberstrike-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.cyberstrike-card {
    min-height: 0;
    padding: 13px 14px;
}

.cyberstrike-card .panel-head {
    align-items: center;
    margin-bottom: 7px;
}

.cyberstrike-card .panel-head h2 {
    font-size: 0.98rem;
}

.dashboard-widget-actions {
    margin-left: auto;
}

.dashboard-hide-form {
    margin: 0;
}

.dashboard-hide-form .dropdown-item {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
}

.compact-record-list {
    gap: 0;
}

.compact-record-list li {
    gap: 1px;
    padding: 6px 0;
}

.compact-record-list strong {
    font-size: 0.88rem;
    line-height: 1.25;
}

.compact-record-list span,
.cyberstrike-card .empty-state {
    font-size: 0.78rem;
    line-height: 1.3;
}

.compact-mood-form {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    align-items: end;
    gap: 6px;
}

.compact-mood-form label {
    font-size: 0.75rem;
}

.compact-mood-form select {
    min-height: 34px;
    padding: 5px 8px;
}

.compact-mood-form button {
    grid-column: auto;
    min-height: 34px;
    padding: 6px 10px;
}

.user-menu {
    position: relative;
}

.user-menu-trigger {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
    font-weight: 750;
}

.user-menu-trigger:hover,
.user-menu-trigger:focus {
    border-color: #9db9dc;
    background: #f8fbff;
}

.user-menu-name {
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-dropdown {
    min-width: 230px;
    padding: 6px;
    border-color: var(--line);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.14);
}

.user-dropdown .dropdown-header {
    padding: 8px 9px 6px;
    color: var(--ink);
    font-size: 0.84rem;
}

.user-dropdown .dropdown-item {
    padding: 7px 9px;
    border-radius: 6px;
    font-size: 0.9rem;
}

@media (max-width: 1280px) {
    .dashboard-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cyberstrike-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .dashboard-kpis,
    .cyberstrike-grid,
    .compact-mood-form {
        grid-template-columns: 1fr;
    }

    .compact-mood-form button {
        grid-column: 1;
    }

    .topbar .user-menu {
        flex: 0 0 auto;
    }
}


/* CR #51 Workspace + CalendarDog */
.workspace-view-tabs,
.workspace-view-switch {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}

.workspace-view-tabs a,
.workspace-view-switch a,
.workspace-view-switch span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 750;
}

.workspace-view-tabs a.is-active,
.workspace-view-switch a.is-active,
.workspace-view-switch span.is-active {
    border-color: var(--blue);
    background: var(--blue);
    color: #fff;
}

.workspace-create {
    margin-bottom: 12px;
    padding: 11px 13px;
}

.workspace-create summary {
    cursor: pointer;
    font-weight: 800;
}

.workspace-create[open] summary {
    margin-bottom: 10px;
}

.compact-form {
    gap: 8px 10px;
}

.compact-form input,
.compact-form select,
.compact-form textarea {
    min-height: 36px;
}

.workspace-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.workspace-card {
    min-height: 0;
    padding: 13px 14px;
}

.workspace-card .panel-head {
    align-items: center;
    margin-bottom: 7px;
}

.workspace-card .panel-head h2 {
    font-size: 1rem;
}

.workspace-card p {
    margin: 5px 0;
}

.workspace-card-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 9px;
    color: var(--muted);
    font-size: 0.78rem;
}

.workspace-card-stats strong {
    color: var(--ink);
}

.responsive-table {
    overflow-x: auto;
}

.kanban-project {
    margin-bottom: 18px;
}

.kanban-project > h2 {
    margin: 0 0 8px;
    font-size: 1.05rem;
}

.kanban-board {
    display: grid;
    grid-template-columns: repeat(6, minmax(210px, 1fr));
    gap: 9px;
    overflow-x: auto;
    padding-bottom: 8px;
}

.kanban-column {
    min-height: 180px;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
    transition: border-color .15s ease, background .15s ease;
}

.kanban-column.is-drop-target {
    border-color: var(--blue);
    background: #edf5ff;
}

.kanban-column-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
}

.kanban-column-head h3 {
    margin: 0;
    font-size: 0.88rem;
}

.kanban-column-head span {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.kanban-task {
    display: grid;
    gap: 4px;
    margin-bottom: 7px;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 2px 7px rgba(15,23,42,.04);
    cursor: grab;
}

.kanban-task.dragging {
    opacity: .55;
}

.kanban-task strong {
    font-size: 0.86rem;
}

.kanban-task > span {
    color: var(--muted);
    font-size: 0.75rem;
}

.kanban-move {
    margin: 0;
}

.kanban-move select {
    min-height: 30px;
    padding: 4px 7px;
    font-size: 0.76rem;
}

.gantt-shell {
    padding: 13px 14px;
}

.gantt-row {
    display: grid;
    grid-template-columns: minmax(180px, .7fr) minmax(320px, 1.3fr);
    gap: 12px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
}

.gantt-row:last-child {
    border-bottom: 0;
}

.gantt-row > div:first-child {
    display: grid;
    gap: 2px;
}

.gantt-row > div:first-child span {
    color: var(--muted);
    font-size: .76rem;
}

.gantt-bar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 7px;
    align-items: center;
    padding: 7px 9px;
    border-radius: 999px;
    background: #eef4fb;
    font-size: .76rem;
}

.calendardog-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.calendar-layer-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}

.calendar-layer-form.compact {
    display: grid;
    align-items: stretch;
    padding: 8px;
}

.calendar-layer-list {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 6px;
}

.calendar-layer {
    display: inline-grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 6px;
    align-items: center;
    margin: 0;
    padding: 5px 8px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #f8fafc;
    font-size: .76rem;
}

.calendar-layer input {
    width: auto;
    min-height: auto;
}

.calendar-layer span {
    display: grid;
    line-height: 1.1;
}

.calendar-layer small {
    color: var(--muted);
    font-size: .65rem;
}

.calendar-layer.derived {
    border-style: dashed;
}

.calendar-layer-form.compact .calendar-layer-list {
    gap: 4px;
}

.calendar-layer-form.compact .calendar-layer {
    padding: 4px 6px;
}

.calendar-layer-form.compact button {
    justify-self: start;
    padding: 5px 8px;
    font-size: .76rem;
}

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

.calendardog-agenda {
    padding: 13px 14px;
}

.calendardog-agenda-list li span {
    font-size: .78rem;
}

@media (max-width: 1180px) {
    .workspace-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calendardog-create-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .workspace-card-grid,
    .gantt-row {
        grid-template-columns: 1fr;
    }

    .calendar-layer-form {
        display: grid;
        align-items: stretch;
    }

    .calendardog-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* CalendarDog first working dashboard widget */
.calendar-layer-groups {
    display: grid;
    flex: 1 1 auto;
    gap: 8px;
}

.calendar-layer-groups > div > strong {
    display: block;
    margin-bottom: 5px;
    font-size: .72rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--muted);
}

.calendar-layer.category {
    background: #fff;
}

.calendardog-source-card {
    margin-bottom: 12px;
    padding: 12px 14px;
}

.calendardog-source-card p {
    margin: 6px 0;
}

.inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
    margin-top: 9px;
}

.inline-actions form {
    margin: 0;
}

.secondary-button {
    background: #fff;
    color: var(--muted);
    border: 1px solid var(--line);
}

.secondary-button:hover,
.secondary-button:focus {
    color: var(--ink);
    border-color: #9db9dc;
}

.calendar-layer-form.compact .calendar-layer-groups {
    gap: 6px;
}

.calendar-layer-form.compact .calendar-layer-list {
    max-height: 110px;
    overflow-y: auto;
}

.calendardog-agenda-list li strong::before {
    display: inline-block;
    margin-right: 5px;
    color: var(--muted);
}

@media (max-width: 760px) {
    .inline-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .inline-actions form,
    .inline-actions button {
        width: 100%;
    }
}


/* Cyberstrike operational dashboard */
.project-status-list,
.workflow-status-list {
    display: grid;
    gap: 4px;
}

.project-status-row {
    display: grid;
    grid-template-columns: minmax(130px, 1.35fr) 18px minmax(120px, 1fr) minmax(92px, 0.8fr);
    gap: 10px;
    align-items: center;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
    color: var(--ink);
}

.project-status-row:last-child,
.workflow-status-row:last-child {
    border-bottom: 0;
}

.project-status-name,
.workflow-status-name {
    min-width: 0;
    overflow: hidden;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-signal,
.activity-signal i {
    display: inline-block;
    width: 11px;
    height: 11px;
    border: 1px solid rgba(15, 23, 42, 0.18);
    border-radius: 50%;
    background: #94a3b8;
}

.status-signal.green,
.activity-signal.green i {
    background: #22c55e;
}

.status-signal.amber,
.activity-signal.amber i {
    background: #f59e0b;
}

.status-signal.red,
.activity-signal.red i {
    background: #ef4444;
}

.project-progress {
    display: grid;
    grid-template-columns: minmax(70px, 1fr) 38px;
    gap: 7px;
    align-items: center;
}

.project-progress > span {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #e2e8f0;
}

.project-progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #3b82f6;
}

.project-progress small,
.activity-signal small,
.workflow-status-row small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
}

.activity-signal {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    white-space: nowrap;
}

.workflow-status-row {
    display: grid;
    grid-template-columns: minmax(130px, 1.15fr) minmax(150px, 1.6fr) minmax(80px, 0.7fr);
    gap: 10px;
    align-items: center;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
    color: var(--ink);
}

.workflow-state-strip {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(8px, 1fr);
    gap: 3px;
}

.workflow-state-cell {
    height: 12px;
    border-radius: 2px;
    background: #cbd5e1;
}

.workflow-state-cell.complete {
    background: #22c55e;
}

.workflow-state-cell.current {
    background: #f59e0b;
}

.workflow-state-cell.failed {
    background: #ef4444;
}

.content-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}

.content-summary a {
    display: grid;
    gap: 2px;
    padding: 8px 9px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--soft);
}

.content-summary strong {
    color: var(--ink);
    font-size: 1rem;
}

.content-summary span {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 750;
}

.content-attention {
    margin: 8px 0 6px;
    color: #9a3412;
    font-size: 0.82rem;
}

.content-attention.is-clear {
    color: var(--muted);
}

.content-kind {
    display: inline-block;
    margin-right: 5px;
    padding: 2px 5px;
    border-radius: 4px;
    background: #e2e8f0;
    color: #475569;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.notification-menu {
    position: relative;
}

.notification-trigger {
    position: relative;
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
    font-size: 1.05rem;
}

.notification-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    display: inline-grid;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 900;
}

.notification-dropdown {
    width: min(360px, 85vw);
}

.notification-menu-item {
    display: grid;
    gap: 2px;
    white-space: normal;
}

.notification-menu-item strong {
    font-size: 0.84rem;
}

.notification-menu-item small {
    color: var(--muted);
}

.calendardog-week-card {
    margin-top: 16px;
}

.calendardog-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(105px, 1fr));
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 8px;
}

.calendardog-day {
    min-height: 220px;
    padding: 0 8px 8px;
    border-right: 1px solid var(--line);
    background: #fff;
}

.calendardog-day:last-child {
    border-right: 0;
}

.calendardog-day > header {
    position: sticky;
    top: 0;
    display: grid;
    gap: 1px;
    margin: 0 -8px 8px;
    padding: 7px 8px;
    border-bottom: 1px solid var(--line);
    background: var(--soft);
    z-index: 1;
}

.calendardog-day > header strong {
    font-size: 0.78rem;
    text-transform: uppercase;
}

.calendardog-day > header span {
    color: var(--muted);
    font-size: 0.7rem;
}

.week-empty {
    margin: 14px 0;
    color: #cbd5e1;
    text-align: center;
}

.week-item {
    display: grid;
    gap: 2px;
    margin: 0 0 6px;
    padding: 6px 7px;
    border-left: 3px solid #3b82f6;
    border-radius: 5px;
    background: #f8fafc;
}

.week-item small {
    color: var(--muted);
    font-size: 0.67rem;
}

.week-item strong {
    font-size: 0.76rem;
    line-height: 1.2;
}

.week-item-reminder {
    border-left-color: #f59e0b;
}

.week-item-task,
.week-item-milestone {
    border-left-color: #22c55e;
}

.week-item-activity {
    border-left-color: #8b5cf6;
}

@media (max-width: 860px) {
    .project-status-row {
        grid-template-columns: minmax(120px, 1fr) 18px minmax(105px, 1fr);
    }

    .project-status-row .activity-signal {
        grid-column: 1 / -1;
        padding-left: 2px;
    }

    .workflow-status-row {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .content-summary {
        grid-template-columns: 1fr;
    }
}


/* Cyberstrike To-Do + compact Calendar */
.compact-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 720px;
}

.cyber-todo-list {
    display: grid;
}

.cyber-todo-row {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto auto;
    gap: 9px;
    align-items: center;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
    color: var(--ink);
}

.cyber-todo-row:last-child {
    border-bottom: 0;
}

.cyber-todo-box {
    width: 14px;
    height: 14px;
    border: 2px solid #94a3b8;
    border-radius: 3px;
    background: #fff;
}

.cyber-todo-title {
    overflow: hidden;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cyber-todo-priority {
    min-width: 58px;
    padding: 3px 6px;
    border-radius: 999px;
    background: #e2e8f0;
    color: #475569;
    font-size: 0.67rem;
    font-weight: 800;
    text-align: center;
}

.cyber-todo-priority.priority-urgent {
    background: #fee2e2;
    color: #991b1b;
}

.cyber-todo-priority.priority-high {
    background: #fef3c7;
    color: #92400e;
}

.cyber-todo-due {
    color: var(--muted);
    font-size: 0.72rem;
    white-space: nowrap;
}

.dashboard-calendar-week .calendardog-week-grid {
    grid-template-columns: repeat(7, minmax(78px, 1fr));
    border: 0;
}

.dashboard-calendar-week .calendardog-day {
    min-height: 150px;
    padding: 0 5px 5px;
}

.dashboard-calendar-week .calendardog-day > header {
    margin: 0 -5px 5px;
    padding: 5px;
}

.dashboard-calendar-week .week-item {
    padding: 4px 5px;
}

.dashboard-calendar-week .week-item strong {
    font-size: 0.7rem;
}

.dashboard-calendar-week .week-item small {
    font-size: 0.62rem;
}

@media (max-width: 860px) {
    .compact-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cyber-todo-row {
        grid-template-columns: 18px minmax(0, 1fr) auto;
    }

    .cyber-todo-due {
        grid-column: 2 / -1;
    }
}


.messenger-boundary-note {
    margin-bottom: 16px;
    padding: 12px 14px;
}

.messenger-boundary-note p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.45;
}


/* Legacy Cyberstrike To-Do pattern */
.cyber-todo-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
    margin: -2px 0 8px;
    font-size: 0.78rem;
}

.cyber-todo-toolbar span {
    color: var(--muted);
}

.cyber-todo-section {
    display: flex;
    gap: 7px;
    align-items: center;
    margin: 12px 0 5px;
    font-size: 0.82rem;
    font-weight: 850;
}

.cyber-todo-section.unfinished {
    color: #b45309;
}

.cyber-todo-section.finished {
    color: #15803d;
}

.cyber-todo-items {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cyber-todo-items li {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
}

.cyber-todo-items li:last-child {
    border-bottom: 0;
}

.cyber-todo-items li > div {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.cyber-todo-items strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 750;
    line-height: 1.3;
    text-overflow: ellipsis;
}

.cyber-todo-items small {
    color: var(--muted);
    font-size: 0.68rem;
}

.cyber-todo-items.finished strong {
    color: var(--muted);
    text-decoration: line-through;
}

.cyber-todo-complete {
    margin: 0;
}

.cyber-todo-check {
    display: inline-grid;
    width: 16px;
    height: 16px;
    min-width: 16px;
    min-height: 16px;
    padding: 0;
    place-items: center;
    border: 1.5px solid #94a3b8;
    border-radius: 3px;
    background: #fff;
}

.cyber-todo-check:hover {
    border-color: #2563eb;
    background: #eff6ff;
}

.cyber-todo-check.is-checked {
    border-color: #22c55e;
    background: #22c55e;
    color: #fff;
    font-size: 0.65rem;
    line-height: 1;
}


/* Cyberstrike complete dashboard */
.ui-svg-icon {
    display: block;
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.dashboard-widget-configure,
.notification-trigger {
    color: #334155;
}

.dashboard-widget-configure:hover,
.notification-trigger:hover {
    color: var(--blue);
    background: #f8fafc;
}

.cyber-calendar-list {
    display: grid;
    border-top: 1px solid var(--line);
}

.cyber-calendar-day {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    min-height: 42px;
    border-bottom: 1px solid var(--line);
}

.cyber-calendar-day > header {
    display: grid;
    align-content: center;
    gap: 1px;
    padding: 7px 9px;
    background: #f8fafc;
    border-right: 1px solid var(--line);
}

.cyber-calendar-day > header strong {
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cyber-calendar-day > header span {
    color: var(--muted);
    font-size: 0.68rem;
}

.cyber-calendar-items {
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 5px 8px;
}

.cyber-calendar-empty {
    color: #94a3b8;
    font-size: 0.72rem;
}

.cyber-calendar-item {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);
    gap: 7px;
    align-items: baseline;
    padding: 3px 0 3px 7px;
    border-left: 3px solid #3b82f6;
}

.cyber-calendar-item.reminder {
    border-left-color: #f59e0b;
}

.cyber-calendar-item time {
    color: var(--muted);
    font-size: 0.68rem;
    font-variant-numeric: tabular-nums;
}

.cyber-calendar-item strong {
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    font-size: 0.76rem;
    font-weight: 750;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-stoplight {
    display: inline-flex;
    gap: 3px;
    align-items: center;
    padding: 3px 5px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #f8fafc;
}

.project-stoplight i {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    opacity: 0.18;
}

.project-stoplight i.red {
    background: #ef4444;
}

.project-stoplight i.amber {
    background: #f59e0b;
}

.project-stoplight i.green {
    background: #22c55e;
}

.project-stoplight i.is-active {
    opacity: 1;
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.08);
}

@media (max-width: 860px) {
    .cyber-calendar-day {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .cyber-calendar-item {
        grid-template-columns: 40px minmax(0, 1fr);
    }
}


/* Dashboard Settings: touch-first reordering */
.dashboard-settings-card {
    padding: 12px;
}

.dashboard-settings-list {
    display: grid;
    gap: 8px;
}

.dashboard-setting-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    min-height: 78px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: opacity 120ms ease, border-color 120ms ease, background 120ms ease;
}

.dashboard-setting-item.is-hidden {
    background: #f8fafc;
    opacity: 0.72;
}

.dashboard-setting-item.is-dragging {
    border-color: #94a3b8;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.18);
    opacity: 0.98;
    transform: scale(1.01);
}

.dashboard-setting-placeholder {
    border: 2px dashed #93c5fd;
    border-radius: 8px;
    background: #eff6ff;
}

.dashboard-drag-handle,
.dashboard-move-button {
    display: inline-grid;
    place-items: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    color: #64748b;
    touch-action: none;
}

.dashboard-drag-handle {
    cursor: grab;
}

.dashboard-drag-handle:active {
    cursor: grabbing;
}

.dashboard-drag-handle:hover,
.dashboard-move-button:hover:not(:disabled) {
    border-color: var(--line);
    background: #f8fafc;
    color: var(--blue);
}

.dashboard-drag-handle svg,
.dashboard-move-button svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.dashboard-widget-toggle {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin: 0;
    cursor: pointer;
}

.dashboard-widget-toggle input {
    width: 22px;
    min-height: 22px;
    height: 22px;
    margin: 0;
}

.dashboard-widget-toggle > span {
    display: grid;
    gap: 3px;
}

.dashboard-widget-toggle strong {
    color: var(--ink);
    font-size: 0.95rem;
}

.dashboard-widget-toggle small {
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.35;
}

.dashboard-order-buttons {
    display: inline-flex;
    gap: 2px;
}

.dashboard-move-button:disabled {
    opacity: 0.25;
    cursor: default;
}

.dashboard-settings-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
    padding: 2px;
}

body.dashboard-reordering {
    user-select: none;
    -webkit-user-select: none;
    overflow: hidden;
}

@media (max-width: 720px) {
    .dashboard-setting-item {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .dashboard-order-buttons {
        grid-column: 2;
        justify-self: end;
    }
}


/* Notification preference master controls */
.notification-master-card {
    margin-bottom: 16px;
    padding: 14px;
}

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

.notification-master-grid label {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
}

.notification-master-grid label > span {
    display: grid;
    gap: 3px;
}

.notification-master-grid label strong {
    color: var(--ink);
}

.notification-master-grid label small {
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.35;
}

.notification-master-grid input {
    width: 24px;
    height: 24px;
    min-height: 24px;
}

.is-channel-muted {
    opacity: 0.5;
}

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


/* M1 security gate */
.security-gate-status {
    margin: 16px 0;
}

.security-gate-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.security-gate-grid > div {
    display: grid;
    gap: 6px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
}

.security-gate-grid small {
    color: var(--muted);
    line-height: 1.35;
}

.dropdown-logout-form {
    margin: 0;
}

.dropdown-logout-form button {
    width: 100%;
    text-align: left;
}

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


/* Cron operations and platform warnings */
.saas-cron-action {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.saas-cron-action small {
    color: var(--muted);
}
.ops-warning {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid var(--line);
}
.ops-warning-yellow {
    background: #fff8db;
    border-color: #e4c75c;
    color: #5c4a00;
}
.ops-warning-yellow a {
    color: inherit;
    font-weight: 700;
}


/* M2 timezone and cron-result polish */
.cron-run-result {
    margin: 0 0 16px;
}
.cron-metrics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.cron-metrics-grid > div {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
}
.cron-metrics-grid strong {
    font-size: 1.2rem;
}
.cron-metrics-grid span {
    color: var(--muted);
    font-size: .86rem;
}
.timezone-field {
    display: flex;
    gap: 8px;
    align-items: center;
}
.timezone-field input {
    flex: 1 1 auto;
}
.button-secondary {
    white-space: nowrap;
}
@media (max-width: 760px) {
    .cron-metrics-grid {
        grid-template-columns: 1fr 1fr;
    }
    .timezone-field {
        align-items: stretch;
        flex-direction: column;
    }
}


/* M3 Cyberstrike / Workspace completion */
.kanban-task.is-dragging {
    opacity: .55;
}
.kanban-column.is-drop-target {
    outline: 2px dashed #3568a8;
    outline-offset: -4px;
    background: #f4f8fd;
}
.gantt-shell {
    overflow-x: auto;
}
.gantt-axis {
    display: grid;
    grid-template-columns: 220px 1fr 80px;
    gap: 12px;
    padding: 0 0 8px;
    color: var(--muted);
    font-size: .78rem;
}
.gantt-axis span:nth-child(2) {
    text-align: center;
}
.gantt-axis span:last-child {
    text-align: right;
}
.gantt-row {
    display: grid;
    grid-template-columns: minmax(180px, 220px) minmax(420px, 1fr);
    gap: 12px;
    align-items: center;
    padding: 8px 0;
    border-top: 1px solid var(--line);
}
.gantt-label {
    display: grid;
    gap: 2px;
}
.gantt-label span {
    color: var(--muted);
    font-size: .8rem;
}
.gantt-track {
    position: relative;
    height: 34px;
    border-radius: 6px;
    background:
        repeating-linear-gradient(
            to right,
            transparent 0,
            transparent calc(12.5% - 1px),
            rgba(100,116,139,.15) calc(12.5% - 1px),
            rgba(100,116,139,.15) 12.5%
        ),
        #f8fafc;
    overflow: hidden;
}
.gantt-task-bar {
    position: absolute;
    top: 6px;
    height: 22px;
    min-width: 18px;
    border-radius: 5px;
    background: #315f96;
    color: #fff;
    padding: 2px 6px;
    overflow: hidden;
    white-space: nowrap;
}
.gantt-task-bar small {
    font-size: .72rem;
}
@media (max-width: 760px) {
    .gantt-row {
        grid-template-columns: 150px minmax(360px, 1fr);
    }
    .gantt-axis {
        grid-template-columns: 150px 1fr 60px;
    }
}


/* M5 Financial Core */
.finance-nav {
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.finance-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.finance-kpi {
    display: grid;
    gap: 4px;
}
.finance-kpi strong {
    font-size: 1.45rem;
}
.finance-kpi small {
    color: var(--muted);
}
.finance-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    align-items: end;
}
.finance-form label {
    display: grid;
    gap: 5px;
}
.finance-form button {
    justify-self: start;
}
.compact-form-card {
    margin-bottom: 16px;
}
.two-column-grid,
.three-column-grid {
    display: grid;
    gap: 14px;
    align-items: start;
}
.two-column-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.three-column-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cashflow-widget {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.cashflow-widget > div {
    display: grid;
    gap: 2px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #f8fafc;
}
.cashflow-widget span {
    color: var(--muted);
    font-size: .78rem;
}
.cashflow-widget strong {
    font-size: 1.05rem;
}
.search-results {
    display: grid;
    gap: 12px;
}
.search-page-form {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}
.search-page-form input {
    flex: 1 1 auto;
}
@media (max-width: 980px) {
    .finance-kpis,
    .three-column-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 700px) {
    .finance-kpis,
    .two-column-grid,
    .three-column-grid,
    .finance-form {
        grid-template-columns: 1fr;
    }
}


/* Workspace portfolio and project control polish */
.workspace-filter-bar,
.workspace-toolbar,
.workspace-project-tabs,
.workspace-task-filters,
.workspace-filter-tabs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.workspace-filter-bar,
.workspace-toolbar {
    justify-content: space-between;
    margin: 14px 0;
}
.workspace-filter-tabs a,
.workspace-project-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    text-decoration: none;
}
.workspace-filter-tabs a.is-active,
.workspace-project-tabs a.is-active {
    background: var(--brand, #1f4f88);
    color: #fff;
    border-color: transparent;
}
.workspace-search-form {
    display: flex;
    gap: 8px;
    min-width: min(420px, 100%);
}
.workspace-search-form input,
.workspace-filter-search input {
    min-width: 220px;
}
.workspace-task-filters label {
    display: grid;
    gap: 4px;
    font-size: .78rem;
    color: var(--muted);
}
.workspace-progress {
    display: grid;
    gap: 5px;
}
.workspace-progress > span {
    display: block;
    width: 100%;
    height: 7px;
    border-radius: 999px;
    background: #e7ebf0;
    overflow: hidden;
}
.workspace-progress > span > i {
    display: block;
    height: 100%;
    background: #2f9e63;
}
.workspace-progress.compact {
    min-width: 110px;
}
.workspace-project-tabs {
    margin: 0 0 14px;
}
@media (max-width: 900px) {
    .workspace-filter-bar,
    .workspace-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .workspace-task-filters,
    .workspace-search-form {
        width: 100%;
    }
    .workspace-search-form input,
    .workspace-filter-search input {
        min-width: 0;
        width: 100%;
    }
}


/* M5 final operational finance parity */
.finance-document-actions,
.document-toolbar,
.finance-totals {
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap;
}
.finance-document-actions { margin: 0 0 14px; }
.finance-document-actions form { margin:0; }
.finance-totals { justify-content:flex-end; margin-top:16px; }
.finance-totals span { min-width:140px; text-align:right; }
.button-link,
.document-toolbar a {
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:8px 14px;
    border-radius:8px;
    border:1px solid var(--line);
    text-decoration:none;
    background:#fff;
}
.business-document {
    max-width:960px;
    margin:0 auto;
    background:#fff;
    padding:40px;
    border:1px solid var(--line);
    border-radius:12px;
}
.business-document header,
.document-meta {
    display:flex;
    justify-content:space-between;
    gap:24px;
}
.business-document header { align-items:flex-start; margin-bottom:36px; }
.document-brand { display:block; font-size:1.15rem; }
.business-document header span,
.document-meta p { display:block; color:var(--muted); }
.document-title { text-align:right; }
.document-title h1 { margin:0; }
.document-meta { margin-bottom:28px; }
.document-lines,
.document-payments { width:100%; border-collapse:collapse; }
.document-lines th,.document-lines td,
.document-payments th,.document-payments td { padding:10px; border-bottom:1px solid var(--line); text-align:left; }
.document-lines th:last-child,.document-lines td:last-child,
.document-payments th:last-child,.document-payments td:last-child { text-align:right; }
.document-totals { margin:24px 0 32px auto; max-width:360px; }
.document-totals p { display:flex; justify-content:space-between; gap:20px; margin:7px 0; }
.statement-ending { text-align:right; font-size:1.05rem; }
@media print {
    .sidebar,.topbar,.finance-nav,.module-head,.no-print,.workspace-view-switch { display:none !important; }
    .app-shell,.main,.content-region { display:block !important; margin:0 !important; padding:0 !important; width:100% !important; }
    body { background:#fff !important; }
    .business-document,.table-card { border:0 !important; box-shadow:none !important; }
    .business-document { max-width:none; padding:12mm; }
}


/* Weekly timesheet */
.weekly-timesheet-form .finance-form {
    margin-bottom: 12px;
}
.weekly-entry-grid input[type="number"] {
    width: 74px;
    min-width: 64px;
}
.weekly-entry-grid th,
.weekly-entry-grid td {
    text-align: center;
    vertical-align: middle;
}
.weekly-entry-grid th:first-child,
.weekly-entry-grid td:first-child {
    text-align: left;
    min-width: 190px;
}
.weekly-details {
    display: grid;
    gap: 8px;
    padding-top: 8px;
}
@media (max-width: 800px) {
    .weekly-entry-grid {
        min-width: 760px;
    }
}


/* CalendarDog linear year view */
.calendardog-linear-card { overflow: hidden; }
.calendardog-linear {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.linear-month {
    border-top: 1px solid var(--line);
}
.linear-month:first-child { border-top: 0; }
.linear-month > summary {
    cursor: pointer;
    padding: 12px 4px;
    font-family: var(--font-family, inherit);
    font-weight: 700;
    font-size: 1rem;
}
.linear-month-days {
    display: grid;
}
.linear-day {
    display: grid;
    grid-template-columns: 64px 48px minmax(0, 1fr);
    align-items: center;
    min-height: 34px;
    border-top: 1px solid rgba(148,163,184,.18);
    gap: 6px;
    padding: 2px 4px;
}
.linear-day.is-today {
    background: rgba(31,79,136,.08);
    box-shadow: inset 3px 0 0 var(--brand, #1f4f88);
}
.linear-day time {
    display: flex;
    align-items: baseline;
    gap: 7px;
    white-space: nowrap;
}
.linear-day time strong {
    min-width: 20px;
    text-align: right;
    font-size: .9rem;
}
.linear-day time span {
    color: var(--muted);
    font-size: .72rem;
    text-transform: uppercase;
}
.linear-thread-space {
    display: flex;
    align-items: center;
    gap: 3px;
    min-height: 18px;
}
.linear-thread {
    display: block;
    width: 6px;
    height: 18px;
    border-radius: 999px;
}
.linear-thread-1 { background:#7c3aed; }
.linear-thread-2 { background:#2563eb; }
.linear-thread-3 { background:#059669; }
.linear-thread-4 { background:#d97706; }
.linear-thread-5 { background:#dc2626; }
.linear-thread-6 { background:#0891b2; }
.linear-highlights {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    overflow: hidden;
}
.linear-highlight {
    display: inline-block;
    max-width: 32ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .78rem;
}
.linear-highlight + .linear-highlight::before {
    content: "·";
    margin-right: 8px;
    color: var(--muted);
}
.linear-reminder::before { content:"⏰ "; }
.linear-task::before { content:"✓ "; }
.linear-milestone::before { content:"◆ "; }
.linear-activity::before { content:"• "; }
.linear-empty { color: var(--muted); opacity:.5; }

@media (max-width: 720px) {
    .linear-day {
        grid-template-columns: 54px 36px minmax(0,1fr);
        gap:4px;
    }
    .linear-highlight { max-width: 24ch; }
    .linear-highlights { gap:4px; }
}


/* Weekly timesheet multi-allocation + approval */
.allocation-meta {
    display:grid;
    gap:6px;
    min-width:220px;
}
.allocation-meta select,
.allocation-meta input {
    width:100%;
}
.weekly-entry-grid .allocation-row td:last-child {
    width:44px;
}
.weekly-timesheet-form .inline-actions {
    margin-top:12px;
}


/* M6 MessengerDog acceptance */
.m6-acceptance-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 16px;
    margin-top: 12px;
}
.m6-acceptance-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
}
.m6-acceptance-item strong {
    flex: 0 0 auto;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: .72rem;
}
@media (max-width: 760px) {
    .m6-acceptance-grid { grid-template-columns: 1fr; }
}
