.work-hero{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    padding:26px;
    margin-bottom:18px;
    border:1px solid #dce5f1;
    border-radius:20px;
    background:linear-gradient(135deg,#fff,#f4f8ff)
}
.work-hero h2{
    margin:10px 0 6px;
    font-size:30px
}
.work-hero-actions,
.page-heading-actions,
.action-card-buttons,
.notification-center-actions{
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap
}
.work-columns{
    display:grid;
    grid-template-columns:1.25fr .95fr;
    gap:18px
}
.section-head,
.notification-center-head,
.action-card-top{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start
}
.work-list,
.notification-stack,
.notification-center-list{
    display:grid;
    gap:10px
}
.work-item{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:center;
    padding:15px;
    border:1px solid #e2e8f0;
    border-radius:14px
}
.work-item-main{
    display:flex;
    align-items:flex-start;
    gap:12px
}
.work-item p,
.notification-item p,
.notification-center-card p{
    margin:5px 0;
    color:#718096
}
.priority-dot{
    width:10px;
    height:10px;
    margin-top:7px;
    border-radius:50%;
    background:#8aa0bd
}
.priority-dot.priority-high{
    background:#d98900
}
.priority-dot.priority-urgent{
    background:#c92a2a
}
.priority-dot.priority-low{
    background:#5f8f73
}
.work-meta{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    color:#8591a3;
    font-size:12px
}
.work-meta span{
    padding-inline-end:8px;
    border-inline-end:1px solid #dfe5ed
}
.notification-item{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:14px;
    border:1px solid #e4e9f0;
    border-radius:14px
}
.notification-item.unread,
.notification-center-card.unread{
    border-color:#bdd0ff;
    background:#f8faff
}
.notification-title-row{
    display:flex;
    align-items:center;
    gap:8px
}
.severity{
    width:9px;
    height:9px;
    border-radius:50%;
    background:#6a8cd7
}
.severity-warning{
    background:#d98b00
}
.severity-danger{
    background:#cb3333
}
.severity-success{
    background:#168a54
}
.notification-actions{
    display:flex;
    gap:8px;
    align-items:center;
    flex-wrap:wrap
}
.mini-action{
    border:0;
    background:transparent;
    color:#245dd8;
    cursor:pointer;
    padding:0
}
.compact-button{
    white-space:nowrap
}
.segmented-tabs{
    display:flex;
    gap:6px;
    padding:5px;
    border:1px solid #dfe5ed;
    border-radius:12px;
    background:#fff
}
.segmented-tabs a{
    padding:8px 12px;
    border-radius:9px;
    text-decoration:none;
    color:#5d6c80
}
.segmented-tabs a.active{
    background:#eaf1ff;
    color:#1f57d4;
    font-weight:800
}
.action-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px
}
.action-card{
    padding:18px;
    border:1px solid #e0e6ef;
    border-radius:16px
}
.action-card h3{
    margin:9px 0 0
}
.action-priority,
.action-status,
.unread-pill{
    display:inline-flex;
    align-items:center;
    padding:5px 9px;
    border-radius:999px;
    font-size:12px;
    font-weight:800
}
.priority-label-normal{
    background:#edf2f7;
    color:#526173
}
.priority-label-low{
    background:#eaf6ee;
    color:#267347
}
.priority-label-high{
    background:#fff2d8;
    color:#9a6200
}
.priority-label-urgent{
    background:#ffe5e5;
    color:#a52424
}
.action-status{
    background:#eef3ff;
    color:#275ad4
}
.action-status.done{
    background:#eaf7ef;
    color:#207746
}
.action-card-meta{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin:14px 0;
    color:#7e8997;
    font-size:12px
}
.notification-center-card{
    display:grid;
    grid-template-columns:50px 1fr;
    gap:14px;
    padding:17px;
    border:1px solid #e0e6ef;
    border-radius:16px
}
.notification-center-icon{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:12px;
    font-weight:900
}
.severity-box-info{
    background:#eaf1ff;
    color:#2559d8
}
.severity-box-warning{
    background:#fff2d8;
    color:#9a6200
}
.severity-box-danger{
    background:#ffe6e6;
    color:#a52424
}
.severity-box-success{
    background:#e8f7ee;
    color:#207746
}
.notification-center-body h3{
    margin:0 0 6px
}
.unread-pill{
    background:#e8f0ff;
    color:#245bd6
}
@media(max-width:1050px){
    .work-columns,
    .action-grid{
        grid-template-columns:1fr
    }
}
@media(max-width:720px){
    .work-hero,
    .page-heading,
    .section-head,
    .notification-center-head,
    .action-card-top{
        flex-direction:column
    }
    .work-item,
    .notification-item{
        align-items:flex-start;
        flex-direction:column
    }
    .notification-center-card{
        grid-template-columns:1fr
    }
}


/* v0.17.1 hotfix */
.kpi-card strong{
    display:block;
    min-height:44px;
    line-height:1;
}
.kpi-card small{
    display:block;
    margin-top:8px;
}
.work-meta span:last-child{
    border-inline-end:0;
}