.qsmm {
    --qs-navy-950: #14181d;
    --qs-navy-900: #1d242b;
    --qs-navy-800: #2d3740;
    --qs-blue-600: #bd4e0b;
    --qs-blue-500: #e66a16;
    --qs-cyan-400: #f4b942;
    --qs-orange-700: #9a3e08;
    --qs-orange-600: #bd4e0b;
    --qs-orange-500: #e66a16;
    --qs-safety-400: #f4b942;
    --qs-concrete-100: #eceeea;
    --qs-green-600: #118a66;
    --qs-green-100: #def7ed;
    --qs-amber-600: #b85b00;
    --qs-amber-100: #fff1d6;
    --qs-red-600: #c23a32;
    --qs-red-100: #fee8e6;
    --qs-violet-600: #7157c8;
    --qs-violet-100: #eee9ff;
    --qs-slate-900: #20262b;
    --qs-slate-700: #485158;
    --qs-slate-500: #737c82;
    --qs-slate-300: #c8cdca;
    --qs-slate-200: #dfe3df;
    --qs-slate-100: #eef0ed;
    --qs-slate-50: #f7f8f5;
    --qs-white: #ffffff;
    --qs-shadow-sm: 0 2px 8px rgba(25, 30, 35, .07);
    --qs-shadow-md: 0 12px 30px rgba(25, 30, 35, .12);
    --qs-shadow-lg: 0 24px 60px rgba(18, 22, 26, .18);
    color: var(--qs-slate-900);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.55;
}

.qsmm-stage {
    position: relative;
    left: 50%;
    display: grid;
    width: 100vw;
    min-height: calc(100vh - 32px);
    margin-left: -50vw;
    padding: clamp(14px, 2.2vw, 32px);
    overflow: hidden;
    background:
        radial-gradient(circle at 82% 4%, rgba(230, 106, 22, .16), transparent 31%),
        radial-gradient(circle at 18% 100%, rgba(244, 185, 66, .06), transparent 27%),
        #111518;
    isolation: isolate;
    place-items: start center;
    color-scheme: light;
}

.qsmm-stage::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
    background-position: center;
    background-size: 38px 38px;
    content: "";
    pointer-events: none;
}

.qsmm-stage > .qsmm-app {
    width: min(1580px, 100%);
    min-height: calc(100vh - clamp(28px, 4.4vw, 64px));
    margin: 0;
    border-color: rgba(255, 255, 255, .12);
    border-radius: 30px;
    box-shadow: 0 34px 90px rgba(0, 0, 0, .36);
    transform: none;
}

.admin-bar .qsmm-stage {
    min-height: calc(100vh - 32px);
}

.qsmm *,
.qsmm *::before,
.qsmm *::after {
    box-sizing: border-box;
}

.qsmm a {
    color: inherit;
    text-decoration: none;
}

.qsmm h1,
.qsmm h2,
.qsmm h3,
.qsmm p {
    margin-top: 0;
}

.qsmm h1,
.qsmm h2,
.qsmm h3 {
    color: var(--qs-navy-900);
    font-weight: 750;
    letter-spacing: -.025em;
    line-height: 1.2;
}

.qsmm h1 {
    margin-bottom: 6px;
    font-size: clamp(25px, 2vw, 34px);
}

.qsmm h2 {
    margin-bottom: 8px;
    font-size: clamp(19px, 1.5vw, 25px);
}

.qsmm h3 {
    margin-bottom: 7px;
    font-size: 17px;
}

.qsmm-app {
    position: relative;
    display: grid;
    grid-template-columns: 254px minmax(0, 1fr);
    width: min(1580px, calc(100vw - 30px));
    min-height: min(920px, calc(100vh - 42px));
    margin: 21px 0 21px 50%;
    overflow: hidden;
    background-color: #f3f4f1;
    background-image:
        linear-gradient(rgba(37, 45, 52, .028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 45, 52, .028) 1px, transparent 1px);
    background-size: 32px 32px;
    border: 1px solid rgba(203, 213, 225, .7);
    border-radius: 24px;
    box-shadow: var(--qs-shadow-lg);
    transform: translateX(-50%);
}

.qsmm-app::after {
    position: absolute;
    z-index: 60;
    right: 0;
    bottom: 0;
    left: 0;
    height: 7px;
    background: repeating-linear-gradient(135deg, #e66a16 0 22px, #20262b 22px 44px);
    content: "";
    pointer-events: none;
}

.qsmm-sidebar {
    position: relative;
    z-index: 30;
    display: flex;
    min-width: 0;
    padding: 22px 16px 18px;
    color: rgba(255, 255, 255, .80);
    background:
        radial-gradient(circle at 6% 0%, rgba(230, 106, 22, .22), transparent 32%),
        linear-gradient(165deg, #252d34, #12161a);
    border-right: 3px solid var(--qs-orange-500);
    flex-direction: column;
}

.qsmm-brand {
    display: flex;
    min-height: 54px;
    margin: 0 7px 20px;
    align-items: center;
    gap: 11px;
}

.qsmm-brand-mark {
    display: inline-grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    position: relative;
    color: #231f19;
    background: linear-gradient(135deg, var(--qs-safety-400), var(--qs-orange-500));
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 12px 12px 9px 9px;
    box-shadow: 0 8px 22px rgba(230, 106, 22, .27);
    font-size: 14px;
    font-weight: 850;
    letter-spacing: -.03em;
    place-items: center;
}

.qsmm-brand-mark .dashicons {
    width: 22px;
    height: 22px;
    font-size: 22px;
}

.qsmm-brand strong,
.qsmm-brand small {
    display: block;
}

.qsmm-brand strong {
    color: #fff;
    font-size: 14px;
    letter-spacing: -.01em;
}

.qsmm-brand small {
    margin-top: 1px;
    color: rgba(255, 255, 255, .52);
    font-size: 11px;
}

.qsmm-nav {
    display: grid;
    overflow: auto;
    padding-right: 2px;
    gap: 17px;
    scrollbar-color: rgba(255, 255, 255, .15) transparent;
}

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

.qsmm-nav-label {
    padding: 0 12px 5px;
    color: rgba(255, 255, 255, .38);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.qsmm-nav-item {
    display: flex;
    min-height: 40px;
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 11px;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 620;
    transition: color .18s ease, background .18s ease, transform .18s ease;
}

.qsmm-nav-item .dashicons {
    width: 18px;
    height: 18px;
    color: rgba(255, 255, 255, .46);
    font-size: 18px;
}

.qsmm-nav-item:hover {
    color: #fff;
    background: rgba(255, 255, 255, .07);
    transform: translateX(2px);
}

.qsmm-nav-item.is-active {
    color: #fff;
    background: linear-gradient(90deg, rgba(230, 106, 22, .28), rgba(230, 106, 22, .10));
    border-color: rgba(244, 185, 66, .20);
    box-shadow: inset 3px 0 var(--qs-safety-400);
}

.qsmm-nav-item.is-active .dashicons {
    color: var(--qs-safety-400);
}

.qsmm-user {
    display: grid;
    margin-top: auto;
    padding: 15px 8px 0;
    border-top: 1px solid rgba(255, 255, 255, .09);
    grid-template-columns: 36px minmax(0, 1fr) 25px;
    align-items: center;
    gap: 9px;
}

.qsmm-avatar {
    display: inline-grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    color: #1a5674;
    background: #dff7fb;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(15, 35, 58, .09);
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    place-items: center;
}

.qsmm-user strong,
.qsmm-user small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qsmm-user strong {
    color: #fff;
    font-size: 12px;
}

.qsmm-user small {
    color: rgba(255, 255, 255, .42);
    font-size: 10px;
}

.qsmm-user > a {
    color: rgba(255, 255, 255, .45);
}

.qsmm-user > a:hover {
    color: #fff;
}

.qsmm-main {
    min-width: 0;
    background:
        radial-gradient(circle at 100% 0%, rgba(230, 106, 22, .09), transparent 27%),
        #f5f6f3;
}

.qsmm-topbar {
    display: flex;
    min-height: 120px;
    padding: 26px clamp(22px, 3.3vw, 48px) 21px;
    background: rgba(251, 251, 248, .90);
    border-bottom: 1px solid var(--qs-slate-200);
    box-shadow: inset 0 -3px 0 rgba(230, 106, 22, .05);
    backdrop-filter: blur(12px);
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.qsmm-topbar p:last-child {
    margin-bottom: 0;
    color: var(--qs-slate-500);
    font-size: 13px;
}

.qsmm-eyebrow,
.qsmm-kicker {
    display: block;
    margin-bottom: 5px;
    color: var(--qs-blue-600);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.qsmm-content {
    display: grid;
    padding: clamp(20px, 3vw, 42px);
    gap: 24px;
}

.qsmm-menu-button {
    display: none;
}

.qsmm-sidebar-scrim {
    display: none;
}

.qsmm-btn,
.qsmm .button,
.qsmm input[type="submit"] {
    display: inline-flex;
    min-height: 40px;
    padding: 9px 15px;
    color: var(--qs-navy-800);
    background: #fff;
    border: 1px solid var(--qs-slate-300);
    border-radius: 10px;
    box-shadow: none;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 760;
    line-height: 1.1;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.qsmm-btn:hover,
.qsmm .button:hover,
.qsmm input[type="submit"]:hover {
    border-color: #a9b8c9;
    box-shadow: var(--qs-shadow-sm);
    transform: translateY(-1px);
}

.qsmm-btn .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.qsmm-btn-primary,
.qsmm .button-primary,
.qsmm input[type="submit"].button-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--qs-orange-600), var(--qs-orange-700));
    border-color: var(--qs-orange-600);
    box-shadow: 0 6px 16px rgba(189, 78, 11, .22);
}

.qsmm-btn-primary:hover,
.qsmm .button-primary:hover {
    color: #fff;
    background: linear-gradient(135deg, var(--qs-orange-500), var(--qs-orange-600));
    border-color: var(--qs-orange-500);
}

.qsmm-btn-secondary {
    color: var(--qs-orange-700);
    background: #fff3e8;
    border-color: #f1c49f;
}

.qsmm-btn-success {
    color: #fff;
    background: linear-gradient(135deg, #17835f, #0f684d);
    border-color: #0f7254;
    box-shadow: 0 6px 16px rgba(15, 114, 84, .2);
}

.qsmm-btn-danger {
    color: #fff;
    background: linear-gradient(135deg, #c94c43, #9f332d);
    border-color: #a93a33;
    box-shadow: 0 6px 16px rgba(169, 58, 51, .2);
}

.qsmm-btn-ghost {
    color: var(--qs-slate-700);
    background: transparent;
    border-color: transparent;
}

.qsmm-text-link {
    color: var(--qs-blue-600);
    font-size: 12px;
    font-weight: 760;
}

.qsmm-text-link:hover {
    color: var(--qs-orange-700);
}

.qsmm-hero {
    position: relative;
    display: grid;
    overflow: hidden;
    padding: clamp(24px, 3vw, 38px);
    color: var(--qs-slate-700);
    background:
        radial-gradient(circle at 92% 8%, rgba(230, 106, 22, .13), transparent 30%),
        linear-gradient(135deg, #fff 0%, #fbfaf6 100%);
    border: 1px solid var(--qs-slate-200);
    border-radius: 22px;
    box-shadow: var(--qs-shadow-md);
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 28px;
}

.qsmm-hero::before {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(45, 55, 64, .026) 1px, transparent 1px),
        linear-gradient(90deg, rgba(45, 55, 64, .026) 1px, transparent 1px);
    background-size: 28px 28px;
    content: "";
    pointer-events: none;
}

.qsmm-hero::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 6px;
    background: repeating-linear-gradient(135deg, var(--qs-orange-500) 0 18px, var(--qs-navy-900) 18px 36px);
    content: "";
    pointer-events: none;
}

.qsmm-hero > * {
    position: relative;
    z-index: 1;
}

.qsmm-hero h2 {
    max-width: 650px;
    margin-bottom: 9px;
    color: var(--qs-navy-900);
    font-size: clamp(25px, 3vw, 39px);
}

.qsmm-hero p {
    max-width: 620px;
    margin-bottom: 0;
    color: var(--qs-slate-500);
}

.qsmm-hero .qsmm-kicker {
    color: var(--qs-orange-600);
}

.qsmm-hero-side {
    display: grid;
    min-width: 190px;
    justify-items: end;
    gap: 16px;
}

.qsmm-secure-pill {
    display: inline-flex;
    min-height: 34px;
    padding: 7px 12px;
    color: #08775b;
    background: #e3f6ef;
    border: 1px solid #c2eadc;
    border-radius: 999px;
    align-items: center;
    gap: 7px;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.qsmm-secure-pill .dashicons {
    width: 17px;
    height: 17px;
    font-size: 17px;
}

.qsmm-quick-actions {
    display: grid;
    min-width: 180px;
    gap: 7px;
}

.qsmm-quick-actions a {
    display: flex;
    padding: 9px 12px;
    color: var(--qs-navy-800);
    background: rgba(255, 255, 255, .88);
    border: 1px solid var(--qs-slate-200);
    border-radius: 10px;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 680;
}

.qsmm-quick-actions a:hover {
    color: var(--qs-orange-700);
    background: #fff;
    box-shadow: var(--qs-shadow-sm);
}

.qsmm-quick-actions .dashicons {
    width: 16px;
    height: 16px;
    color: var(--qs-orange-500);
    font-size: 16px;
}

.qsmm-metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
    gap: 13px;
}

.qsmm-metric {
    display: flex;
    min-width: 0;
    min-height: 94px;
    padding: 17px;
    background: #fff;
    border: 1px solid var(--qs-slate-200);
    border-radius: 15px;
    box-shadow: var(--qs-shadow-sm);
    align-items: center;
    gap: 13px;
    transition: transform .18s ease, box-shadow .18s ease;
}

a.qsmm-metric:hover {
    box-shadow: var(--qs-shadow-md);
    transform: translateY(-2px);
}

.qsmm-metric-icon {
    display: inline-grid;
    width: 41px;
    height: 41px;
    flex: 0 0 41px;
    background: #e9f3ff;
    border-radius: 12px;
    font-size: 20px;
    place-items: center;
}

.qsmm-metric small,
.qsmm-metric strong {
    display: block;
}

.qsmm-metric small {
    margin-bottom: 3px;
    color: var(--qs-slate-500);
    font-size: 9px;
    font-weight: 780;
    letter-spacing: .06em;
    line-height: 1.3;
    text-transform: uppercase;
}

.qsmm-metric strong {
    overflow: hidden;
    color: var(--qs-navy-900);
    font-size: clamp(18px, 1.6vw, 24px);
    letter-spacing: -.025em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qsmm-tone-blue .qsmm-metric-icon { color: var(--qs-orange-600); background: #fff0e3; }
.qsmm-tone-green .qsmm-metric-icon { color: var(--qs-green-600); background: var(--qs-green-100); }
.qsmm-tone-amber .qsmm-metric-icon { color: var(--qs-amber-600); background: var(--qs-amber-100); }
.qsmm-tone-red .qsmm-metric-icon { color: var(--qs-red-600); background: var(--qs-red-100); }
.qsmm-tone-violet .qsmm-metric-icon { color: var(--qs-violet-600); background: var(--qs-violet-100); }
.qsmm-tone-navy .qsmm-metric-icon { color: var(--qs-navy-800); background: #e7edf3; }
.qsmm-tone-slate .qsmm-metric-icon { color: var(--qs-slate-500); background: var(--qs-slate-100); }

.qsmm-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(260px, .8fr) minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 18px;
}

.qsmm-span-2 {
    grid-column: span 2;
}

.qsmm-panel,
.qsmm-section {
    min-width: 0;
}

.qsmm-panel {
    padding: clamp(19px, 2.2vw, 28px);
    background: #fff;
    border: 1px solid var(--qs-slate-200);
    border-radius: 17px;
    box-shadow: var(--qs-shadow-sm);
    scroll-margin-top: 24px;
}

.qsmm-panel::selection,
.qsmm-section::selection {
    background: rgba(244, 185, 66, .35);
}

.qsmm-section {
    display: grid;
    gap: 17px;
}

.qsmm-section-heading,
.qsmm-panel-heading,
.qsmm-heading-row {
    display: flex;
    margin-bottom: 18px;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.qsmm-section-heading {
    margin-bottom: 0;
    align-items: end;
}

.qsmm-section-heading p,
.qsmm-panel-heading p {
    max-width: 720px;
    margin-bottom: 0;
    color: var(--qs-slate-500);
    font-size: 12px;
}

.qsmm-section-heading h2,
.qsmm-panel-heading h2 {
    margin-bottom: 5px;
}

.qsmm-count,
.qsmm-headcount {
    display: inline-grid;
    min-width: 33px;
    height: 33px;
    padding: 0 9px;
    color: var(--qs-navy-800);
    background: var(--qs-slate-100);
    border: 1px solid var(--qs-slate-200);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
    place-items: center;
}

.qsmm-site-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
}

.qsmm-client-groups {
    display: grid;
    gap: 17px;
}

.qsmm-client-group {
    display: grid;
    padding-top: 15px;
    border-top: 1px solid var(--qs-slate-200);
    gap: 11px;
}

.qsmm-client-group:first-child {
    padding-top: 0;
    border-top: 0;
}

.qsmm-client-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.qsmm-client-heading small,
.qsmm-client-heading > span > strong {
    display: block;
}

.qsmm-client-heading small {
    color: var(--qs-slate-500);
    font-size: 8px;
    font-weight: 820;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.qsmm-client-heading > span > strong {
    color: var(--qs-navy-900);
    font-size: 14px;
}

.qsmm-client-total {
    color: var(--qs-slate-500);
    font-size: 9px;
}

.qsmm-client-total strong {
    color: var(--qs-blue-600);
    font-size: 13px;
}

.qsmm-site-card {
    min-width: 0;
    padding: 15px;
    background:
        linear-gradient(90deg, var(--qs-orange-500) 0 4px, transparent 4px),
        var(--qs-slate-50);
    border: 1px solid var(--qs-slate-200);
    border-radius: 13px;
}

.qsmm-site-card-head {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
}

.qsmm-site-icon {
    display: inline-grid;
    width: 34px;
    height: 34px;
    color: var(--qs-orange-700);
    background: #fff0e3;
    border-radius: 10px;
    font-size: 17px;
    place-items: center;
}

.qsmm-site-card-head small,
.qsmm-site-card-head strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qsmm-site-card-head small {
    color: var(--qs-slate-500);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.qsmm-site-card-head strong {
    color: var(--qs-navy-900);
    font-size: 13px;
}

.qsmm-worker-chips {
    display: flex;
    margin-top: 13px;
    flex-wrap: wrap;
    gap: 6px;
}

.qsmm-worker-chips span {
    display: inline-flex;
    max-width: 100%;
    padding: 4px 7px 4px 4px;
    overflow: hidden;
    color: var(--qs-slate-700);
    background: #fff;
    border: 1px solid var(--qs-slate-200);
    border-radius: 999px;
    align-items: center;
    gap: 5px;
    font-size: 9px;
    font-weight: 680;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qsmm-worker-chips b {
    overflow: hidden;
    font-weight: 700;
    text-overflow: ellipsis;
}

.qsmm-worker-chips em {
    margin-left: 2px;
    padding: 2px 5px;
    color: var(--qs-orange-700);
    background: #fff1e5;
    border-radius: 999px;
    font-size: 8px;
    font-style: normal;
    font-weight: 850;
}

.qsmm-worker-chips i {
    display: inline-grid;
    width: 20px;
    height: 20px;
    color: #713007;
    background: #ffe0c6;
    border-radius: 50%;
    font-size: 8px;
    font-style: normal;
    font-weight: 850;
    place-items: center;
}

.qsmm-site-payroll {
    display: flex;
    margin: 12px 0 0;
    padding: 9px 10px;
    color: var(--qs-slate-500);
    background: #fff;
    border: 1px dashed #e5b489;
    border-radius: 9px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    font-size: 9px;
    font-weight: 720;
}

.qsmm-site-payroll strong {
    color: var(--qs-orange-700);
    font-size: 13px;
}

.qsmm-site-payroll small {
    font-size: 8px;
}

.qsmm-site-payroll > span {
    display: grid;
    min-width: 105px;
    flex: 1 1 0;
    gap: 2px;
}

.qsmm-site-payroll > span:nth-child(2) {
    text-align: center;
}

.qsmm-site-payroll > span:last-child {
    text-align: right;
}

.qsmm-person-list {
    display: grid;
    gap: 3px;
}

.qsmm-person {
    display: grid;
    min-width: 0;
    padding: 9px 4px;
    border-bottom: 1px solid var(--qs-slate-100);
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
}

.qsmm-person:last-child {
    border-bottom: 0;
}

.qsmm-person strong,
.qsmm-person small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qsmm-person strong {
    color: var(--qs-navy-900);
    font-size: 12px;
}

.qsmm-person small {
    color: var(--qs-slate-500);
    font-size: 9px;
}

.qsmm-icon-btn {
    display: inline-grid;
    width: 32px;
    height: 32px;
    padding: 0;
    color: var(--qs-slate-700);
    background: #fff;
    border: 1px solid var(--qs-slate-200);
    border-radius: 9px;
    cursor: pointer;
    place-items: center;
    transition: background .15s ease, color .15s ease, transform .15s ease;
}

.qsmm-icon-btn:hover {
    color: var(--qs-blue-600);
    background: #eef6ff;
    transform: translateY(-1px);
}

.qsmm-icon-btn .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.qsmm-icon-btn.is-primary { color: var(--qs-blue-600); background: #edf5ff; border-color: #cde2ff; }
.qsmm-icon-btn.is-success { color: var(--qs-green-600); background: var(--qs-green-100); border-color: #bcebd9; }
.qsmm-icon-btn.is-danger { color: var(--qs-red-600); background: var(--qs-red-100); border-color: #f6cac6; }

.qsmm-empty-state {
    display: grid;
    min-height: 130px;
    padding: 24px;
    color: var(--qs-slate-500);
    background: var(--qs-slate-50);
    border: 1px dashed var(--qs-slate-300);
    border-radius: 13px;
    text-align: center;
    place-content: center;
    justify-items: center;
}

.qsmm-empty-state > .dashicons {
    width: 30px;
    height: 30px;
    margin-bottom: 8px;
    color: var(--qs-blue-600);
    font-size: 30px;
}

.qsmm-empty-state strong {
    color: var(--qs-navy-800);
    font-size: 13px;
}

.qsmm-empty-state p {
    margin: 3px 0 0;
    font-size: 11px;
}

.qsmm-table-toolbar {
    display: flex;
    margin-bottom: 13px;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
}

.qsmm-search,
.qsmm-filter {
    position: relative;
    display: flex;
    align-items: center;
}

.qsmm-search {
    min-width: min(310px, 100%);
}

.qsmm-search .dashicons,
.qsmm-filter .dashicons {
    position: absolute;
    left: 11px;
    z-index: 1;
    width: 16px;
    height: 16px;
    color: var(--qs-slate-500);
    font-size: 16px;
    pointer-events: none;
}

.qsmm-search input,
.qsmm-filter select {
    min-height: 39px;
    margin: 0;
    padding: 8px 12px 8px 35px;
    color: var(--qs-slate-700);
    background: var(--qs-slate-50);
    border: 1px solid var(--qs-slate-200);
    border-radius: 10px;
    font-family: inherit;
    font-size: 11px;
}

.qsmm-search input {
    width: 100%;
}

.qsmm-results {
    margin-left: auto;
    color: var(--qs-slate-500);
    font-size: 10px;
}

.qsmm-results strong {
    color: var(--qs-navy-800);
}

.qsmm-table-wrap {
    width: 100%;
    overflow: auto;
    border: 1px solid var(--qs-slate-200);
    border-radius: 12px;
}

.qsmm table {
    width: 100%;
    margin: 0;
    background: #fff;
    border: 0;
    border-collapse: collapse;
    table-layout: auto;
}

.qsmm th,
.qsmm td {
    padding: 12px 13px;
    border: 0;
    border-bottom: 1px solid var(--qs-slate-100);
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

.qsmm th {
    color: var(--qs-slate-500);
    background: var(--qs-slate-50);
    font-size: 9px;
    font-weight: 820;
    letter-spacing: .065em;
    text-transform: uppercase;
}

.qsmm td {
    color: var(--qs-slate-700);
    font-size: 11px;
}

.qsmm tbody tr:last-child td {
    border-bottom: 0;
}

.qsmm tbody tr:hover td {
    background: #fbfdff;
}

.qsmm td strong {
    color: var(--qs-navy-900);
    font-size: 11px;
}

.qsmm-cell-subtitle {
    display: block;
    max-width: 180px;
    overflow: hidden;
    color: var(--qs-slate-500);
    font-size: 9px;
    text-overflow: ellipsis;
}

.qsmm-row-actions {
    width: 1%;
}

.qsmm-actions,
.qsmm-inline,
.qsmm-export {
    display: flex;
    margin: 0;
    align-items: center;
    flex-wrap: nowrap;
    gap: 5px;
}

.qsmm-actions .qsmm-inline input[type="hidden"] {
    display: none;
}

.qsmm-badge {
    display: inline-flex;
    padding: 4px 8px;
    color: #3f556b;
    background: #edf2f7;
    border: 1px solid #dde6ee;
    border-radius: 999px;
    align-items: center;
    font-size: 8px;
    font-weight: 820;
    letter-spacing: .025em;
    line-height: 1.2;
    text-transform: uppercase;
}

.qsmm-badge-active,
.qsmm-badge-current,
.qsmm-badge-open,
.qsmm-badge-approved,
.qsmm-badge-paid {
    color: #0f7254;
    background: var(--qs-green-100);
    border-color: #bcebd9;
}

.qsmm-badge-needs-site,
.qsmm-badge-planned,
.qsmm-badge-submitted,
.qsmm-badge-pending,
.qsmm-badge-draft,
.qsmm-badge-overdue {
    color: #965000;
    background: var(--qs-amber-100);
    border-color: #f2d8a6;
}

.qsmm-badge-inactive,
.qsmm-badge-ended,
.qsmm-badge-rejected,
.qsmm-badge-void {
    color: #9c312b;
    background: var(--qs-red-100);
    border-color: #f6cac6;
}

.qsmm-badge-sent,
.qsmm-badge-partial,
.qsmm-badge-contract,
.qsmm-badge-identification,
.qsmm-badge-insurance,
.qsmm-badge-certification,
.qsmm-badge-tax,
.qsmm-badge-other {
    color: #315e9c;
    background: #e7f2ff;
    border-color: #cbe2ff;
}

.qsmm-money {
    color: var(--qs-navy-800);
    font-weight: 730;
    font-variant-numeric: tabular-nums;
}

.qsmm-negative {
    color: var(--qs-red-600);
}

.qsmm-muted {
    color: var(--qs-slate-500) !important;
}

.qsmm-no-results {
    margin-top: 12px;
    padding: 14px;
    color: var(--qs-slate-500);
    background: var(--qs-slate-50);
    border-radius: 10px;
    font-size: 11px;
    text-align: center;
}

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

.qsmm-form > label {
    display: grid;
    min-width: 0;
    gap: 6px;
}

.qsmm-form > label:has(textarea),
.qsmm-form-intro,
.qsmm-form-actions,
.qsmm-form > .submit {
    grid-column: 1 / -1;
}

.qsmm-form-intro {
    display: grid;
    gap: 4px;
    padding: 13px 15px;
    color: var(--qs-slate-700);
    background: var(--qs-slate-50);
    border: 1px solid var(--qs-slate-200);
    border-left: 4px solid var(--qs-orange-500);
    border-radius: 11px;
}

.qsmm-form-intro strong {
    color: var(--qs-slate-900);
    font-size: 13px;
}

.qsmm-form-intro small {
    font-size: 10px;
    line-height: 1.5;
}

.qsmm-form label > span {
    color: var(--qs-slate-700);
    font-size: 10px;
    font-weight: 760;
}

.qsmm-form input,
.qsmm-form select,
.qsmm-form textarea {
    width: 100%;
    max-width: none;
    min-height: 43px;
    margin: 0;
    padding: 9px 11px;
    color: var(--qs-slate-900);
    background: #fff;
    border: 1px solid var(--qs-slate-300);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 35, 58, .03);
    font-family: inherit;
    font-size: 12px;
    line-height: 1.4;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.qsmm-form textarea {
    min-height: 88px;
    resize: vertical;
}

.qsmm-form input:focus,
.qsmm-form select:focus,
.qsmm-form textarea:focus,
.qsmm-search input:focus,
.qsmm-filter select:focus {
    border-color: var(--qs-blue-500);
    box-shadow: 0 0 0 3px rgba(230, 106, 22, .14);
    outline: none;
}

.qsmm-form small {
    color: var(--qs-slate-500);
    font-size: 9px;
}

.qsmm-form-actions {
    display: flex;
    padding-top: 5px;
    justify-content: flex-end;
    gap: 8px;
}

.qsmm-calculation-preview {
    display: flex;
    grid-column: 1 / -1;
    padding: 13px 15px;
    color: var(--qs-slate-700);
    background: #fff4ea;
    border: 1px solid #f0c59f;
    border-radius: 11px;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.qsmm-calculation-preview span {
    font-size: 10px;
    font-weight: 700;
}

.qsmm-calculation-preview strong {
    color: var(--qs-blue-600);
    font-size: 17px;
}

.qsmm-editor {
    border-top: 3px solid var(--qs-blue-600);
    box-shadow: var(--qs-shadow-md);
}

.qsmm-rate-preview {
    display: flex;
    grid-column: 1 / -1;
    min-height: 58px;
    padding: 12px 15px;
    color: var(--qs-slate-700);
    background:
        linear-gradient(90deg, rgba(230, 106, 22, .12), transparent 42%),
        #fffaf5;
    border: 1px solid #edc39f;
    border-left: 4px solid var(--qs-orange-500);
    border-radius: 11px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 15px;
}

.qsmm-rate-preview > span {
    display: grid;
    min-width: 0;
    flex: 1 1 190px;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
}

.qsmm-rate-preview .dashicons {
    grid-row: 1 / span 2;
    color: var(--qs-orange-600);
}

.qsmm-rate-preview small {
    color: var(--qs-slate-700);
    font-size: 10px;
    font-weight: 760;
}

.qsmm-rate-preview strong {
    grid-column: 2;
    color: var(--qs-orange-700);
    font-size: 19px;
    letter-spacing: -.025em;
}

.qsmm-hourly-rate {
    display: inline-flex;
    padding: 4px 8px;
    color: #713007;
    background: #fff0e2;
    border: 1px solid #f0c49e;
    border-radius: 8px;
    align-items: baseline;
    gap: 2px;
    font-weight: 850;
    white-space: nowrap;
}

.qsmm-hourly-rate small {
    font-size: 8px;
    font-weight: 760;
}

.qsmm-time-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.qsmm-time-form label:has(textarea) {
    grid-column: 1 / -1;
}

.qsmm-toast {
    display: flex;
    padding: 13px 15px;
    background: #fff;
    border: 1px solid var(--qs-slate-200);
    border-left: 4px solid var(--qs-green-600);
    border-radius: 11px;
    box-shadow: var(--qs-shadow-sm);
    align-items: center;
    gap: 9px;
    font-size: 11px;
    font-weight: 650;
}

.qsmm-toast .dashicons {
    color: var(--qs-green-600);
}

.qsmm-toast-error {
    border-left-color: var(--qs-red-600);
}

.qsmm-toast-error .dashicons {
    color: var(--qs-red-600);
}

.qsmm-export-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}

.qsmm-export-card {
    display: flex;
    min-width: 0;
    padding: 13px;
    background: var(--qs-slate-50);
    border: 1px solid var(--qs-slate-200);
    border-radius: 11px;
    align-items: center;
    gap: 10px;
    transition: border-color .15s ease, transform .15s ease, background .15s ease;
}

.qsmm-export-card:hover {
    background: #f1f7ff;
    border-color: #bad8ff;
    transform: translateY(-1px);
}

.qsmm-export-card > .dashicons {
    display: inline-grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    color: var(--qs-blue-600);
    background: #e3f0ff;
    border-radius: 9px;
    font-size: 17px;
    place-items: center;
}

.qsmm-export-card strong,
.qsmm-export-card small {
    display: block;
}

.qsmm-export-card strong {
    color: var(--qs-navy-800);
    font-size: 11px;
}

.qsmm-export-card small {
    color: var(--qs-slate-500);
    font-size: 9px;
}

.qsmm-connection {
    display: flex;
    gap: 11px;
}

.qsmm-connection > .dashicons {
    width: 28px;
    height: 28px;
    font-size: 28px;
}

.qsmm-connection.is-connected > .dashicons { color: var(--qs-green-600); }
.qsmm-connection.is-offline > .dashicons { color: var(--qs-amber-600); }
.qsmm-connection p { margin: 3px 0 0; color: var(--qs-slate-500); font-size: 10px; }

.qsmm-worker-hero {
    display: flex;
    padding: clamp(22px, 3vw, 34px);
    background:
        linear-gradient(90deg, rgba(230, 106, 22, .11), transparent 56%),
        #fffaf5;
    border: 1px solid #edc9a8;
    border-radius: 17px;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.qsmm-worker-hero h2 {
    margin-bottom: 5px;
    font-size: clamp(23px, 2.5vw, 34px);
}

.qsmm-worker-hero p {
    margin-bottom: 0;
    color: var(--qs-slate-500);
    font-size: 12px;
}

.qsmm-assignment-card {
    display: flex;
    padding: 15px;
    background: linear-gradient(90deg, #fff4e9, var(--qs-slate-50));
    border: 1px solid var(--qs-slate-200);
    border-radius: 12px;
    align-items: center;
    gap: 11px;
}

.qsmm-assignment-card > .dashicons {
    display: inline-grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: var(--qs-blue-600);
    background: #ffe3cc;
    border-radius: 10px;
    font-size: 19px;
    place-items: center;
}

.qsmm-assignment-card small,
.qsmm-assignment-card strong {
    display: block;
}

.qsmm-assignment-card small {
    color: var(--qs-slate-500);
    font-size: 9px;
    text-transform: uppercase;
}

.qsmm-assignment-card strong {
    color: var(--qs-navy-900);
    font-size: 13px;
}

.qsmm-own-wage {
    margin-left: auto;
    padding-left: 14px;
    border-left: 1px solid var(--qs-slate-200);
    text-align: right;
}

.qsmm-own-wage strong {
    color: var(--qs-orange-700);
    font-size: 15px;
}

.qsmm-assignment-detailed {
    display: block;
    padding: 0;
    overflow: hidden;
}

.qsmm-assignment-main {
    display: flex;
    padding: 15px;
    align-items: center;
    gap: 11px;
}

.qsmm-assignment-main > .dashicons {
    display: inline-grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: var(--qs-blue-600);
    background: #ffe3cc;
    border-radius: 10px;
    font-size: 19px;
    place-items: center;
}

.qsmm-worker-schedule-grid {
    display: grid;
    padding: 13px 15px;
    background: #fff;
    border-top: 1px solid var(--qs-slate-200);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.qsmm-worker-schedule-grid > span {
    min-width: 0;
}

.qsmm-worker-schedule-grid small,
.qsmm-worker-schedule-grid strong {
    display: block;
}

.qsmm-worker-schedule-grid small {
    margin-bottom: 3px;
    color: var(--qs-slate-500);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.qsmm-worker-schedule-grid strong {
    color: var(--qs-navy-800);
    font-size: 11px;
}

.qsmm-clock-state {
    display: grid;
    min-height: 122px;
    padding: 20px;
    background: var(--qs-slate-50);
    border: 1px solid var(--qs-slate-200);
    border-radius: 14px;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
}

.qsmm-clock-state.is-running {
    background: linear-gradient(90deg, rgba(24, 151, 108, .1), #f9fffc);
    border-color: #b7e7d6;
}

.qsmm-clock-state.is-complete {
    background: linear-gradient(90deg, rgba(230, 106, 22, .08), #fffaf5);
    border-color: #edc9a8;
}

.qsmm-clock-icon {
    display: inline-grid;
    width: 52px;
    height: 52px;
    color: #fff;
    background: var(--qs-green-600);
    border-radius: 14px;
    font-size: 25px;
    place-items: center;
}

.qsmm-clock-state.is-complete .qsmm-clock-icon {
    background: var(--qs-orange-600);
}

.qsmm-clock-state small,
.qsmm-clock-state strong {
    display: block;
}

.qsmm-clock-state small {
    color: var(--qs-slate-500);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.qsmm-clock-state strong {
    margin: 3px 0;
    color: var(--qs-navy-900);
    font-size: 16px;
}

.qsmm-clock-state p {
    margin: 0;
    color: var(--qs-slate-600);
    font-size: 11px;
}

.qsmm-clock-form {
    grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.2fr);
}

.qsmm-login-card {
    width: min(460px, calc(100% - 30px));
    margin: 70px auto;
    padding: 42px;
    background: #fff;
    border: 1px solid var(--qs-slate-200);
    border-radius: 22px;
    box-shadow: var(--qs-shadow-lg);
    text-align: center;
}

.qsmm-login-card .qsmm-brand-mark {
    width: 52px;
    height: 52px;
    margin-bottom: 18px;
}

.qsmm-login-card > .dashicons {
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
    color: var(--qs-amber-600);
    font-size: 44px;
}

.qsmm-login-card p {
    color: var(--qs-slate-500);
}

.qsmm .screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
}

@media (max-width: 1180px) {
    .qsmm-app {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .qsmm-dashboard-grid {
        grid-template-columns: minmax(240px, .85fr) minmax(0, 1fr);
    }

    .qsmm-dashboard-grid > .qsmm-span-2 {
        grid-column: span 1;
    }

    .qsmm-dashboard-grid > :last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
}

@media (max-width: 860px) {
    .qsmm-stage {
        min-height: 100vh;
        padding: 0;
    }

    .qsmm-app {
        display: block;
        width: 100%;
        min-height: 100vh;
        margin: 0;
        border: 0;
        border-radius: 0;
        transform: none;
    }

    .qsmm-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        width: min(280px, 84vw);
        box-shadow: 18px 0 45px rgba(7, 18, 31, .30);
        transform: translateX(-105%);
        transition: transform .22s ease;
    }

    .qsmm-app.is-menu-open .qsmm-sidebar {
        transform: translateX(0);
    }

    .qsmm-sidebar-scrim {
        position: fixed;
        z-index: 20;
        inset: 0;
        background: rgba(7, 18, 31, .52);
        opacity: 0;
        pointer-events: none;
        transition: opacity .22s ease;
    }

    .qsmm-app.is-menu-open .qsmm-sidebar-scrim {
        display: block;
        opacity: 1;
        pointer-events: auto;
    }

    .qsmm-menu-button {
        position: fixed;
        z-index: 19;
        top: 14px;
        left: 14px;
        display: inline-grid;
        width: 40px;
        height: 40px;
        padding: 0;
        color: #fff;
        background: var(--qs-navy-900);
        border: 0;
        border-radius: 11px;
        box-shadow: var(--qs-shadow-md);
        place-items: center;
    }

    .qsmm-topbar {
        min-height: 105px;
        padding: 18px 18px 18px 70px;
    }

    .qsmm-topbar > .qsmm-btn {
        display: none;
    }

    .qsmm-content {
        padding: 18px;
    }

    .qsmm-hero {
        grid-template-columns: 1fr;
    }

    .qsmm-hero-side {
        min-width: 0;
        justify-items: stretch;
    }

    .qsmm-secure-pill {
        justify-self: start;
    }

    .qsmm-quick-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .qsmm-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .qsmm-dashboard-grid > *,
    .qsmm-dashboard-grid > .qsmm-span-2,
    .qsmm-dashboard-grid > :last-child:nth-child(odd) {
        grid-column: 1;
    }
}

@media (max-width: 680px) {
    .qsmm-content {
        gap: 16px;
    }

    .qsmm-panel {
        padding: 17px;
        border-radius: 14px;
    }

    .qsmm-hero {
        padding: 23px 19px;
        border-radius: 15px;
    }

    .qsmm-quick-actions {
        grid-template-columns: 1fr;
    }

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

    .qsmm-metric {
        min-height: 82px;
        padding: 13px;
    }

    .qsmm-metric-icon {
        width: 35px;
        height: 35px;
        flex-basis: 35px;
        font-size: 17px;
    }

    .qsmm-section-heading,
    .qsmm-panel-heading,
    .qsmm-heading-row {
        flex-direction: column;
        gap: 10px;
    }

    .qsmm-section-heading .qsmm-btn,
    .qsmm-panel-heading .qsmm-btn {
        width: 100%;
    }

    .qsmm-section-heading > .qsmm-actions {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .qsmm-form,
    .qsmm-time-form {
        grid-template-columns: 1fr;
    }

    .qsmm-form > label:has(textarea),
    .qsmm-form-actions,
    .qsmm-calculation-preview,
    .qsmm-rate-preview,
    .qsmm-time-form label:has(textarea) {
        grid-column: 1;
    }

    .qsmm-rate-preview {
        align-items: flex-start;
        flex-direction: column;
    }

    .qsmm-search,
    .qsmm-filter,
    .qsmm-search input,
    .qsmm-filter select {
        width: 100%;
    }

    .qsmm-results {
        width: 100%;
        margin-left: 0;
    }

    .qsmm-table-wrap {
        overflow: visible;
        border: 0;
        border-radius: 0;
    }

    .qsmm-data-table,
    .qsmm-data-table tbody,
    .qsmm-data-table tr,
    .qsmm-data-table td {
        display: block;
        width: 100%;
    }

    .qsmm-data-table thead {
        display: none;
    }

    .qsmm-data-table tbody {
        display: grid;
        gap: 10px;
    }

    .qsmm-data-table tr {
        padding: 7px 12px;
        background: #fff;
        border: 1px solid var(--qs-slate-200);
        border-radius: 12px;
        box-shadow: 0 2px 6px rgba(15, 35, 58, .04);
    }

    .qsmm-data-table td {
        display: grid;
        min-height: 31px;
        padding: 7px 0;
        border-bottom: 1px solid var(--qs-slate-100);
        grid-template-columns: minmax(85px, .8fr) minmax(0, 1.2fr);
        align-items: center;
        gap: 12px;
        text-align: right;
        white-space: normal;
    }

    .qsmm-data-table td::before {
        color: var(--qs-slate-500);
        content: attr(data-label);
        font-size: 8px;
        font-weight: 800;
        letter-spacing: .06em;
        text-align: left;
        text-transform: uppercase;
    }

    .qsmm-data-table td:last-child {
        border-bottom: 0;
    }

    .qsmm-row-actions {
        display: flex !important;
        width: 100% !important;
        justify-content: flex-end;
    }

    .qsmm-row-actions::before {
        content: "Actions" !important;
        margin-right: auto;
    }

    .qsmm-cell-subtitle {
        margin-left: auto;
    }

    .qsmm-worker-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .qsmm-assignment-card {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .qsmm-assignment-main {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .qsmm-worker-schedule-grid {
        grid-template-columns: 1fr;
    }

    .qsmm-clock-state {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .qsmm-clock-state form {
        grid-column: 1 / -1;
    }

    .qsmm-clock-state .qsmm-btn {
        width: 100%;
    }

    .qsmm-clock-icon {
        width: 44px;
        height: 44px;
        font-size: 21px;
    }

    .qsmm-own-wage {
        width: 100%;
        margin-left: 49px;
        padding: 9px 0 0;
        border-top: 1px solid var(--qs-slate-200);
        border-left: 0;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .qsmm *,
    .qsmm *::before,
    .qsmm *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}
.qsmm .qsmm-invoice-edit {
    width: auto;
    min-width: 76px;
    padding: 0 12px;
    gap: 6px;
    border-color: #c8d3f4;
    background: #f4f6ff;
    color: #294ab8;
    font-weight: 750;
}

.qsmm .qsmm-invoice-edit:hover {
    border-color: #3157d5;
    background: #3157d5;
    color: #fff;
}

.qsmm .qsmm-invoice-items {
    grid-column: 1 / -1;
    display: grid;
    gap: 14px;
    padding: 20px;
    border: 1px solid #d8e0ec;
    border-radius: 16px;
    background: #f8faff;
}

.qsmm .qsmm-invoice-items-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.qsmm .qsmm-invoice-items-heading strong {
    display: block;
    color: #17243a;
    font-size: 16px;
}

.qsmm .qsmm-invoice-items-heading small,
.qsmm .qsmm-invoice-subtotal small {
    display: block;
    margin-top: 4px;
    color: #69758a;
    line-height: 1.4;
}

.qsmm .qsmm-invoice-item-list {
    display: grid;
    gap: 10px;
}

.qsmm .qsmm-invoice-item {
    display: grid;
    grid-template-columns: 88px minmax(170px, 2fr) 82px 95px 105px 38px;
    gap: 10px;
    align-items: end;
    padding: 14px;
    border: 1px solid #dce4f0;
    border-radius: 13px;
    background: #fff;
}

.qsmm .qsmm-invoice-item label {
    display: grid;
    gap: 6px;
    margin: 0;
}

.qsmm .qsmm-invoice-item label > span,
.qsmm .qsmm-invoice-line-total > span,
.qsmm .qsmm-invoice-subtotal > span {
    color: #526078;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.qsmm .qsmm-invoice-item input,
.qsmm .qsmm-invoice-item select,
.qsmm .qsmm-invoice-item textarea {
    width: 100%;
    min-height: 42px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid #cbd5e2;
    border-radius: 9px;
    background: #fff;
    color: #17243a;
    font: inherit;
}

.qsmm .qsmm-invoice-item textarea {
    min-height: 58px;
    resize: vertical;
}

.qsmm .qsmm-invoice-line-total {
    display: grid;
    gap: 9px;
    min-height: 58px;
    align-content: center;
    padding: 8px 10px;
    border-radius: 9px;
    background: #eef2ff;
    text-align: right;
}

.qsmm .qsmm-invoice-line-total strong {
    color: #294ab8;
    font-size: 15px;
}

.qsmm .qsmm-invoice-item-remove {
    margin-bottom: 8px;
}

.qsmm .qsmm-invoice-subtotal {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(150px, 1fr) minmax(160px, 220px);
    gap: 7px 16px;
    align-items: center;
    justify-self: end;
    margin-left: auto;
    text-align: right;
}

.qsmm .qsmm-invoice-subtotal input {
    grid-column: 2;
    grid-row: 1;
    font-weight: 800;
    text-align: right;
}

.qsmm .qsmm-invoice-subtotal small {
    grid-column: 1 / -1;
}

.qsmm .qsmm-invoice-workspace {
    display: block;
    margin: 0;
}

.qsmm .qsmm-invoice-workspace-bar,
.qsmm .qsmm-invoice-page-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.qsmm .qsmm-invoice-workspace-bar {
    margin: -4px 0 20px;
    padding: 15px 18px;
    border: 1px solid #d9e1ec;
    border-radius: 13px;
    background: #f8faff;
}

.qsmm .qsmm-invoice-workspace-bar strong,
.qsmm .qsmm-invoice-workspace-bar small {
    display: block;
}

.qsmm .qsmm-invoice-workspace-bar strong {
    margin-top: 2px;
    color: #14243b;
    font-size: 18px;
}

.qsmm .qsmm-invoice-workspace-bar small {
    margin-top: 3px;
    color: #69758b;
}

.qsmm .qsmm-invoice-save-state {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 999px;
    background: #eaf0ff;
    color: #294ab8;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.qsmm .qsmm-invoice-workspace-grid {
    display: grid;
    grid-template-columns: minmax(530px, 1.08fr) minmax(450px, .92fr);
    gap: 22px;
    align-items: start;
}

.qsmm .qsmm-invoice-builder {
    display: grid;
    min-width: 0;
    gap: 14px;
}

.qsmm .qsmm-invoice-form-section {
    display: grid;
    gap: 16px;
    padding: 20px;
    border: 1px solid #dce4ef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(20, 36, 59, .035);
}

.qsmm .qsmm-invoice-form-section > header {
    display: flex;
    align-items: center;
    gap: 11px;
    padding-bottom: 13px;
    border-bottom: 1px solid #e8edf4;
}

.qsmm .qsmm-invoice-form-section > header > .dashicons {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 10px;
    background: #edf1ff;
    color: #3157d5;
    font-size: 20px;
}

.qsmm .qsmm-invoice-form-section > header strong,
.qsmm .qsmm-invoice-form-section > header small {
    display: block;
}

.qsmm .qsmm-invoice-form-section > header strong {
    color: #17243a;
    font-size: 15px;
}

.qsmm .qsmm-invoice-form-section > header small {
    margin-top: 2px;
    color: #69758b;
    line-height: 1.35;
}

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

.qsmm .qsmm-invoice-field-grid-single {
    grid-template-columns: 1fr;
}

.qsmm .qsmm-invoice-field-grid label {
    min-width: 0;
    margin: 0;
}

.qsmm .qsmm-invoice-items {
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(20, 36, 59, .035);
}

.qsmm .qsmm-invoice-primary-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 0 0;
}

.qsmm .qsmm-invoice-primary-actions > span {
    color: #69758b;
    font-size: 12px;
}

.qsmm .qsmm-invoice-preview-pane {
    position: sticky;
    top: 24px;
    min-width: 0;
    padding: 14px;
    border: 1px solid #d9e1eb;
    border-radius: 16px;
    background: #eef1f5;
}

.qsmm .qsmm-preview-pane-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 2px 12px;
    color: #4c596d;
    font-size: 12px;
    font-weight: 800;
}

.qsmm .qsmm-preview-pane-heading > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.qsmm .qsmm-preview-pane-heading small {
    color: #7a8596;
    font-weight: 600;
}

.qsmm .qsmm-invoice-paper {
    overflow: hidden;
    min-height: 690px;
    border: 1px solid #dfe4eb;
    background: #fff;
    color: #17243a;
    box-shadow: 0 8px 25px rgba(20, 36, 59, .12);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.qsmm .qsmm-paper-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 24px 26px;
    background: #14243b;
    color: #fff;
}

.qsmm .qsmm-paper-brand {
    display: flex;
    align-items: center;
    gap: 10px;
}

.qsmm .qsmm-paper-brand > span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 9px;
    background: #3157d5;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}

.qsmm .qsmm-paper-brand strong,
.qsmm .qsmm-paper-brand small {
    display: block;
}

.qsmm .qsmm-paper-brand strong {
    color: #fff;
    font-size: 13px;
    letter-spacing: .06em;
}

.qsmm .qsmm-paper-brand small {
    margin-top: 3px;
    color: #c8d2e1;
    font-size: 8px;
}

.qsmm .qsmm-paper-title {
    text-align: right;
}

.qsmm .qsmm-paper-title h2 {
    margin: 0 0 4px;
    color: #fff;
    font-size: 25px;
    letter-spacing: .09em;
}

.qsmm .qsmm-paper-title strong,
.qsmm .qsmm-paper-title span {
    display: block;
}

.qsmm .qsmm-paper-title strong {
    color: #dce5f2;
    font-size: 10px;
}

.qsmm .qsmm-paper-title span {
    width: max-content;
    margin: 7px 0 0 auto;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-size: 7px;
    font-weight: 800;
    text-transform: uppercase;
}

.qsmm .qsmm-paper-company {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 26px;
    border-bottom: 1px solid #e3e8ef;
    color: #657187;
    font-size: 8px;
    line-height: 1.45;
}

.qsmm .qsmm-paper-company p {
    margin: 0;
}

.qsmm .qsmm-paper-company p:last-child {
    text-align: right;
}

.qsmm .qsmm-paper-company strong {
    color: #17243a;
}

.qsmm .qsmm-paper-address {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 24px;
    padding: 22px 26px;
}

.qsmm .qsmm-paper-address small,
.qsmm .qsmm-paper-note > small {
    display: block;
    margin-bottom: 6px;
    color: #778297;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .08em;
}

.qsmm .qsmm-paper-address > div > strong {
    display: block;
    font-size: 11px;
}

.qsmm .qsmm-paper-address p {
    margin: 4px 0 0;
    color: #5d687b;
    font-size: 8px;
    line-height: 1.5;
    white-space: pre-line;
}

.qsmm .qsmm-paper-address dl,
.qsmm .qsmm-paper-summary dl {
    margin: 0;
}

.qsmm .qsmm-paper-address dl > div,
.qsmm .qsmm-paper-summary dl > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 3px 0;
}

.qsmm .qsmm-paper-address dt,
.qsmm .qsmm-paper-summary dt {
    color: #6a7588;
    font-size: 8px;
}

.qsmm .qsmm-paper-address dd,
.qsmm .qsmm-paper-summary dd {
    margin: 0;
    color: #17243a;
    font-size: 8px;
    font-weight: 750;
    text-align: right;
}

.qsmm .qsmm-paper-table-wrap {
    overflow-x: auto;
    padding: 0 26px;
}

.qsmm .qsmm-paper-table {
    width: 100%;
    border-collapse: collapse;
    border: 0;
}

.qsmm .qsmm-paper-table th {
    padding: 8px;
    border: 0;
    background: #14243b;
    color: #fff;
    font-size: 7px;
    letter-spacing: .06em;
    text-align: right;
    text-transform: uppercase;
}

.qsmm .qsmm-paper-table th:first-child,
.qsmm .qsmm-paper-table td:first-child {
    width: 58%;
    text-align: left;
}

.qsmm .qsmm-paper-table td {
    padding: 9px 8px;
    border: 0;
    border-bottom: 1px solid #e5e9ef;
    color: #303d51;
    font-size: 8px;
    text-align: right;
    vertical-align: top;
}

.qsmm .qsmm-paper-table td strong,
.qsmm .qsmm-paper-table td small {
    display: block;
}

.qsmm .qsmm-paper-table td small {
    margin-top: 3px;
    color: #7a8597;
    font-size: 7px;
}

.qsmm .qsmm-paper-summary {
    display: grid;
    grid-template-columns: 1fr minmax(180px, .75fr);
    gap: 22px;
    padding: 22px 26px;
}

.qsmm .qsmm-paper-note p {
    margin: 0;
    color: #5d687b;
    font-size: 8px;
    line-height: 1.5;
    white-space: pre-line;
}

.qsmm .qsmm-paper-summary dl > div {
    padding: 5px 8px;
}

.qsmm .qsmm-paper-total {
    margin-top: 3px;
    border-top: 2px solid #17243a;
}

.qsmm .qsmm-paper-total dt,
.qsmm .qsmm-paper-total dd {
    color: #17243a;
    font-size: 10px;
    font-weight: 850;
}

.qsmm .qsmm-paper-balance {
    margin-top: 3px;
    background: #14243b;
}

.qsmm .qsmm-paper-balance dt,
.qsmm .qsmm-paper-balance dd {
    color: #fff;
    font-size: 10px;
    font-weight: 850;
}

.qsmm .qsmm-invoice-paper footer {
    margin: 8px 26px 0;
    padding: 12px 0 18px;
    border-top: 1px solid #e5e9ef;
    color: #778297;
    font-size: 7px;
    text-align: center;
}

.qsmm .qsmm-invoice-delivery {
    display: grid;
    gap: 18px;
    margin-top: 22px;
    padding: 22px;
    border: 1px solid #cfdaf5;
    border-radius: 15px;
    background: linear-gradient(135deg, #f8faff, #fff);
}

.qsmm .qsmm-invoice-delivery-heading,
.qsmm .qsmm-invoice-delivery-heading > div,
.qsmm .qsmm-invoice-document-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.qsmm .qsmm-invoice-delivery-heading {
    justify-content: space-between;
}

.qsmm .qsmm-invoice-delivery-heading > div > .dashicons {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 11px;
    background: #3157d5;
    color: #fff;
    font-size: 21px;
}

.qsmm .qsmm-invoice-delivery h3 {
    margin: 1px 0 3px;
    color: #17243a;
}

.qsmm .qsmm-invoice-delivery p {
    margin: 0;
    color: #69758b;
}

.qsmm .qsmm-delivery-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #16734b;
    font-size: 12px;
    font-weight: 750;
}

.qsmm .qsmm-invoice-document-actions {
    flex-wrap: wrap;
}

.qsmm .qsmm-invoice-email-form {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 12px;
    align-items: end;
}

.qsmm .qsmm-invoice-email-form label {
    display: grid;
    gap: 6px;
    color: #465269;
    font-weight: 700;
}

.qsmm .qsmm-invoice-email-form input,
.qsmm .qsmm-invoice-email-form textarea {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid #cbd5e2;
    border-radius: 9px;
    background: #fff;
    color: #17243a;
    font: inherit;
}

.qsmm .qsmm-email-message {
    grid-column: 1 / 3;
}

.qsmm .qsmm-invoice-email-form button {
    grid-column: 3;
    grid-row: 1 / 3;
    align-self: end;
}

.qsmm .qsmm-invoice-page-heading {
    margin-bottom: 20px;
}

.qsmm .qsmm-invoice-page-heading h1 {
    margin: 3px 0 6px;
    color: #14243b;
    font-size: 30px;
}

.qsmm .qsmm-invoice-page-heading p {
    margin: 0;
    color: #69758b;
}

@media (max-width: 1250px) {
    .qsmm .qsmm-invoice-workspace-grid {
        grid-template-columns: 1fr;
    }

    .qsmm .qsmm-invoice-preview-pane {
        position: static;
        max-width: 720px;
        margin: 0 auto;
    }
}

@media (max-width: 780px) {
    .qsmm .qsmm-invoice-workspace-bar,
    .qsmm .qsmm-invoice-page-heading,
    .qsmm .qsmm-invoice-delivery-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .qsmm .qsmm-invoice-field-grid,
    .qsmm .qsmm-paper-address,
    .qsmm .qsmm-paper-summary,
    .qsmm .qsmm-invoice-email-form {
        grid-template-columns: 1fr;
    }

    .qsmm .qsmm-email-message,
    .qsmm .qsmm-invoice-email-form button {
        grid-column: 1;
        grid-row: auto;
    }

    .qsmm .qsmm-invoice-primary-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .qsmm .qsmm-invoice-paper {
        min-height: 0;
    }

    .qsmm .qsmm-paper-header,
    .qsmm .qsmm-paper-company,
    .qsmm .qsmm-paper-address,
    .qsmm .qsmm-paper-summary {
        padding-right: 17px;
        padding-left: 17px;
    }

    .qsmm .qsmm-paper-table-wrap {
        padding: 0 17px;
    }
}

@media (max-width: 1050px) {
    .qsmm .qsmm-invoice-item {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .qsmm .qsmm-invoice-item-description {
        grid-column: span 2;
    }
}

@media (max-width: 650px) {
    .qsmm .qsmm-invoice-items {
        padding: 14px;
    }

    .qsmm .qsmm-invoice-items-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .qsmm .qsmm-invoice-item {
        grid-template-columns: 1fr 1fr;
    }

    .qsmm .qsmm-invoice-item-description,
    .qsmm .qsmm-invoice-line-total {
        grid-column: 1 / -1;
    }

    .qsmm .qsmm-invoice-item-remove {
        width: 100%;
        margin: 0;
    }

    .qsmm .qsmm-invoice-subtotal {
        grid-template-columns: 1fr;
        width: 100%;
        justify-self: stretch;
        text-align: left;
    }

    .qsmm .qsmm-invoice-subtotal input,
    .qsmm .qsmm-invoice-subtotal small {
        grid-column: 1;
        grid-row: auto;
    }
}

.qsmm .qsmm-badge-overdue { background: #fee2e2; color: #b42318; }
.qsmm .qsmm-badge-outstanding { background: #fff1cc; color: #875d00; }
.qsmm .qsmm-badge-partial { background: #e8edff; color: #294ab8; }
.qsmm .qsmm-badge-repaid { background: #dcfce7; color: #18723a; }

.qsmm .qsmm-ai-hero {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    margin-bottom: 22px;
    padding: 30px;
    border-radius: 20px;
    background: linear-gradient(135deg, #14243b, #3157d5);
    color: #fff;
}
.qsmm .qsmm-ai-hero h2 { margin: 4px 0 8px; color: #fff; font-size: 30px; }
.qsmm .qsmm-ai-hero p { max-width: 720px; margin: 0; color: #dfe7ff; }
.qsmm .qsmm-ai-hero > .dashicons { width: 54px; height: 54px; font-size: 54px; }
.qsmm .qsmm-ai-form { display: grid; gap: 14px; }
.qsmm .qsmm-ai-form > label { font-size: 16px; font-weight: 800; color: #14243b; }
.qsmm .qsmm-ai-form textarea { min-height: 150px; width: 100%; padding: 16px; resize: vertical; border: 1px solid #cbd5e2; border-radius: 12px; font: inherit; }
.qsmm .qsmm-ai-prompts { display: flex; flex-wrap: wrap; gap: 8px; }
.qsmm .qsmm-ai-prompts button { padding: 8px 11px; border: 1px solid #d8e0f4; border-radius: 999px; background: #f5f7ff; color: #294ab8; cursor: pointer; font-weight: 700; }
.qsmm .qsmm-ai-response { line-height: 1.72; white-space: normal; color: #25324a; }
.qsmm .qsmm-ai-answer { border-left: 4px solid #3157d5; }
.qsmm .qsmm-ai-answer.is-error { border-left-color: #b42318; }
.qsmm .qsmm-account-option { padding: 14px; border: 1px solid #d8e0f4; border-radius: 10px; background: #f7f9ff; }
.qsmm .qsmm-account-linked { display: flex; align-items: center; gap: 10px; padding: 14px; border-radius: 10px; background: #ecfdf3; color: #18723a; }
.qsmm .qsmm-account-linked small { display: block; color: #4f6f5a; }

.qsmm .qsmm-map-link {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 12px 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: #f4f7ff;
    color: #294ab8;
    text-decoration: none;
}
.qsmm .qsmm-map-link:hover { background: #e9eeff; color: #173898; }
.qsmm .qsmm-map-link > span:nth-child(2) { flex: 1; color: #42506a; }
.qsmm .qsmm-map-link strong { white-space: nowrap; font-size: 12px; }
.qsmm .qsmm-map-link-compact { min-width: 230px; margin: 0; padding: 7px 9px; }
.qsmm .qsmm-company-directories { display: grid; grid-template-columns: 1fr; gap: 20px; }
.qsmm .qsmm-company-directories .qsmm-panel { border-top: 4px solid #3157d5; }
.qsmm .qsmm-company-directories .qsmm-panel:first-child { border-top-color: #d38a13; }
.qsmm .qsmm-payment-action { display: inline-flex; gap: 5px; align-items: center; }
.qsmm .qsmm-payment-action input[type="number"] { width: 92px; min-height: 34px; padding: 5px 7px; border: 1px solid #cbd5e2; border-radius: 8px; }
.qsmm .qsmm-payment-action .qsmm-icon-btn { width: auto; min-width: 36px; padding: 0 9px; gap: 5px; }
.qsmm .qsmm-invite-notice { display: block; margin: 14px 0; padding: 14px 16px; border-radius: 12px; }
.qsmm .qsmm-copy-link { display: flex; gap: 8px; align-items: center; }
.qsmm .qsmm-copy-link input { flex: 1; min-width: 0; padding: 9px 11px; border: 1px solid #cbd5e2; border-radius: 8px; background: #fff; }
.qsmm .qsmm-language-form { margin-left: auto; }
.qsmm .qsmm-language-form label { display: flex; align-items: center; gap: 7px; }
.qsmm .qsmm-language-form select { min-height: 38px; padding: 5px 28px 5px 10px; border: 1px solid #d5deeb; border-radius: 9px; background: #fff; color: #26344d; font-weight: 700; }
.qsmm .qsmm-placement-request-form { display: grid; gap: 10px; max-width: 560px; margin: 16px auto 0; }
.qsmm .qsmm-placement-request-form textarea { min-height: 84px; padding: 10px; border: 1px solid #cbd5e2; border-radius: 9px; }
.qsmm .qsmm-placement-requested { border-color: #8ed8aa; background: #f0fdf4; }
.qsmm-notification-bell{position:relative;display:inline-grid;place-items:center;width:42px;height:42px;border:1px solid #dbe3ee;border-radius:12px;background:#fff;color:#23324d;text-decoration:none}.qsmm-notification-bell b{position:absolute;right:-5px;top:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:20px;background:#dc2626;color:#fff;font-size:11px;line-height:20px;text-align:center}.qsmm-notification-list{display:grid;gap:10px}.qsmm-notification{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start;padding:16px;border:1px solid #e3e9f2;border-radius:14px;background:#fff}.qsmm-notification.is-unread{border-left:4px solid #335cff;background:#f7f9ff}.qsmm-notification h3{margin:0 0 4px}.qsmm-notification p{margin:0 0 6px}.qsmm-notification small{color:#69758a}.qsmm-notification-actions{display:flex;gap:8px;align-items:center}.qsmm-worker-notifications{margin-bottom:18px}.qsmm-map-link{display:flex;gap:5px;align-items:center;margin-top:7px;color:#2558d9;font-size:13px;font-weight:600;text-decoration:none}.qsmm-map-link:hover{text-decoration:underline}@media(max-width:700px){.qsmm-notification{grid-template-columns:auto 1fr}.qsmm-notification-actions,.qsmm-notification>form{grid-column:2}.qsmm-map-link{align-items:flex-start}}
.qsmm-worker-chip{flex-wrap:wrap}.qsmm-mini-clock{display:inline-flex;align-items:center;gap:4px;border:0;border-radius:8px;padding:6px 9px;font-weight:700;cursor:pointer}.qsmm-mini-clock.is-in{background:#dcfce7;color:#166534}.qsmm-mini-clock.is-out{background:#fee2e2;color:#991b1b}.qsmm-time-editor{width:100%;padding-top:7px;border-top:1px solid #e5e7eb}.qsmm-time-editor summary{cursor:pointer;color:#2854c5;font-weight:700}.qsmm-time-editor-form{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr)) auto;gap:8px;align-items:end;margin-top:9px}.qsmm-time-editor-form label{display:grid;gap:3px;font-size:11px}.qsmm-time-editor-form input,.qsmm-time-editor-form select{min-height:36px;border:1px solid #cfd8e5;border-radius:8px;padding:5px 7px}@media(max-width:800px){.qsmm-time-editor-form{grid-template-columns:1fr 1fr}.qsmm-time-editor-form .qsmm-btn{grid-column:1/-1}}
.qsmm-whatsapp-btn{background:#dcfce7!important;color:#08783e!important;border-color:#86efac!important}.qsmm-whatsapp-btn:hover{background:#bbf7d0!important}

.qsmm .qsmm-push-permission {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    margin: 0 0 20px;
    padding: 22px;
    border: 1px solid #cdd9f8;
    border-radius: 18px;
    background: linear-gradient(135deg, #f6f8ff 0%, #fff7ed 100%);
    box-shadow: 0 10px 28px rgba(31, 45, 73, .07);
}
.qsmm .qsmm-push-permission.is-compact { padding: 15px 18px; border-radius: 14px; }
.qsmm .qsmm-push-icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 15px;
    background: #f58220;
    color: #fff;
    font-size: 26px;
}
.qsmm .qsmm-push-permission h2 { margin: 2px 0 5px; color: #17243a; font-size: 20px; }
.qsmm .qsmm-push-permission p { margin: 0; color: #43506a; line-height: 1.45; }
.qsmm .qsmm-push-permission small { display: block; margin-top: 7px; color: #68758a; line-height: 1.4; }
.qsmm .qsmm-push-permission .qsmm-push-error { color: #b42318; font-weight: 700; }
.qsmm .qsmm-push-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.qsmm .qsmm-push-actions .qsmm-btn { white-space: nowrap; }
.qsmm .qsmm-day-options { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 7px; }
.qsmm .qsmm-day-options label { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border: 1px solid #d8e0eb; border-radius: 9px; background: #fff; }
.qsmm .qsmm-day-options input { margin: 0; }

@media (max-width: 780px) {
    .qsmm .qsmm-push-permission { grid-template-columns: auto 1fr; align-items: start; }
    .qsmm .qsmm-push-actions { grid-column: 1 / -1; justify-content: stretch; }
    .qsmm .qsmm-push-actions .qsmm-btn { flex: 1 1 180px; }
}

/* Construction operations */
.qsmm-ops-panel { margin-bottom: 24px; }
.qsmm-ops-wide { grid-column: 1 / -1; }
.qsmm-ops-inline { display:flex; gap:8px; flex-wrap:wrap; }
.qsmm-ops-form h3 { margin:0; }
.qsmm-location-status { font-size:13px; line-height:1.5; color:#475569; max-width:480px; }
.qsmm-ops-panel [hidden] { display:none !important; }
.qsmm-ops-panel .qsmm-data-table td { max-width:360px; overflow-wrap:anywhere; }
.qsmm-ops-panel .qsmm-form-actions { grid-column:1/-1; }
@media print {
 body.qsmm-print-supplier * { visibility:hidden; }
 body.qsmm-print-supplier .qsmm-ops-print, body.qsmm-print-supplier .qsmm-ops-print * { visibility:visible; }
 body.qsmm-print-supplier .qsmm-ops-print { position:absolute; inset:0 auto auto 0; width:100%; color:#000; }
 body.qsmm-print-supplier .qsmm-ops-print button, body.qsmm-print-supplier .qsmm-ops-print form { display:none; }
 body.qsmm-print-supplier .qsmm-table-wrap { overflow:visible; }
}

/* Subcontract bids, measurements and payment applications. */
.qsmm-sc-tabs,.qsmm-sc-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.qsmm-sc-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.qsmm-sc-line{display:grid;grid-template-columns:1.8fr 1fr .8fr 1fr 1fr auto;gap:10px;align-items:end;padding:18px 0;border-bottom:1px solid #dfe3df}
.qsmm-sc-line label{min-width:0}.qsmm-sc-line input,.qsmm-sc-line select{width:100%;min-width:0}
.qsmm-sc-total{padding:18px 0;font-size:18px}.qsmm-sc-total small{font-size:12px;color:#64706a}
.qsmm-sc-bid [hidden]{display:none!important}
@media(max-width:1100px){.qsmm-sc-line{grid-template-columns:repeat(3,minmax(0,1fr))}.qsmm-sc-line>label:first-child{grid-column:span 2}}
@media(max-width:640px){.qsmm-sc-fields,.qsmm-sc-line{grid-template-columns:1fr}.qsmm-sc-line>label:first-child{grid-column:auto}.qsmm-sc-tabs .qsmm-btn{flex:1 1 130px}.qsmm-sc-line{background:#f7f8f5;padding:18px;border-radius:10px;margin:12px 0}.qsmm-sc-tabs{gap:8px}}
@media print{.qsmm-sc-tabs,.qsmm-sc-actions,.qsmm-ops-print form,.qsmm-ops-print button{display:none!important}}

/* Public home-screen installer; usable without signing in or enabling push. */
.qsmm.qsmm-install-card { box-sizing: border-box; width: 100%; margin: 0 0 24px; padding: 26px; border: 1px solid #dfe3db; border-radius: 20px; background: #fff; color: #202725; text-align: left; }
.qsmm-install-card .qsmm-install-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.qsmm-install-card .qsmm-install-heading img { width: 56px; height: 56px; flex: 0 0 56px; border-radius: 14px; }
.qsmm-install-card .qsmm-install-heading h2 { margin: 0 0 3px; font-size: 24px; letter-spacing: -.7px; color: #202725; }
.qsmm-install-card .qsmm-install-heading p { margin: 0; color: #5d6862; font-size: 13px; }
.qsmm-install-card > p { margin: 0 0 18px; font-size: 14px; line-height: 1.65; color: #5d6862; }
.qsmm-install-card .qsmm-install-options { display: grid; gap: 10px; margin: 18px 0; }
.qsmm-install-card details { border: 1px solid #dfe3db; border-radius: 12px; overflow: hidden; background: #fafbf8; }
.qsmm-install-card summary { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; cursor: pointer; font-size: 15px; font-weight: 700; color: #202725; list-style: none; }
.qsmm-install-card summary::-webkit-details-marker { display: none; }
.qsmm-install-card summary span { font-size: 20px; font-weight: 400; transition: transform .15s; }
.qsmm-install-card details[open] summary span { transform: rotate(45deg); }
.qsmm-install-card summary:hover { background: #f1f4ec; }
.qsmm-install-card summary:focus-visible { outline: 3px solid #b44a23; outline-offset: -3px; }
.qsmm-install-card .qsmm-install-steps { padding: 0 18px 18px; }
.qsmm-install-card ol { margin: 8px 0 14px; padding-left: 22px; font-size: 14px; color: #43504a; line-height: 1.65; }
.qsmm-install-card li { margin: 0 0 8px; padding-left: 3px; }
.qsmm-install-card .qsmm-install-steps p { font-size: 13px; color: #5d6862; line-height: 1.65; }
.qsmm-install-card .qsmm-install-status { font-size: 12px; margin: 0 0 15px; }
.qsmm-install-card .qsmm-install-open { color: #9d3d1b; font-size: 14px; font-weight: 700; text-decoration: none; }
.qsmm-install-card .qsmm-install-open:hover { text-decoration: underline; }
.qsmm-stage > .qsmm-install-card { max-width: 600px; margin: 0 auto 35px; }
.qsmm-brand-mark img { width: 100%; height: 100%; border-radius: inherit; }
.qsmm .qsmm-push-permission[data-push-state="error"], .qsmm .qsmm-push-permission[data-push-state="configuration"] { border-color: #f1aaa0; }
.qsmm .qsmm-push-permission[data-push-state="enabled"] { border-color: #9acfb0; }
.qsmm[hidden], .qsmm [hidden] { display: none !important; }
@media (max-width: 600px) { .qsmm.qsmm-install-card { padding: 20px; } .qsmm-install-card summary { padding: 15px; font-size: 14px; } }

/* First-login tour */
.qsmm.qsmm-tour-overlay { position: fixed; inset: 0; z-index: 100100; display: grid; place-items: center; padding: 20px; background: #172320ad; backdrop-filter: blur(3px); }
.qsmm .qsmm-tour-dialog { box-sizing: border-box; width: min(540px,100%); max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); overflow: auto; padding: 30px; background: #fff; border-radius: 22px; box-shadow: 0 28px 90px #0f191b4d; color: #202725; text-align: left; outline: none; }
.qsmm .qsmm-tour-top { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.qsmm .qsmm-tour-brand { font-size: 19px; letter-spacing: -.6px; font-weight: 800; }
.qsmm .qsmm-tour-brand span { display: block; margin-top: 4px; font-size: 9px; letter-spacing: 1.8px; font-weight: 650; color: #8c4928; }
.qsmm .qsmm-tour-skip { background: none; border: 0; padding: 10px; font-size: 12px; color: #59665d; cursor: pointer; }
.qsmm .qsmm-tour-progress { height: 4px; background: #eef0ea; border-radius: 4px; margin: 26px 0 22px; overflow: hidden; }
.qsmm .qsmm-tour-progress span { display: block; height: 100%; background: #f58220; transition: width .15s; }
.qsmm .qsmm-tour-step { margin: 0 0 12px; font-size: 10px; color: #7a6756; letter-spacing: 1.3px; font-weight: 700; }
.qsmm .qsmm-tour-dialog h2 { margin: 0 0 17px; font-size: 29px; line-height: 1.15; letter-spacing: -.8px; color: #202725; }
.qsmm .qsmm-tour-dialog > p:not(.qsmm-tour-step):not(.qsmm-tour-error) { font-size: 15px; line-height: 1.65; color: #526059; }
.qsmm .qsmm-tour-dialog .qsmm-tour-tip { padding: 16px; margin: 22px 0 0; border-radius: 12px; background: #f5f6f1; font-size: 13px !important; }
.qsmm .qsmm-tour-error { font-size: 12px; line-height: 1.5; color: #a43f20; margin: 10px 0 0; }
.qsmm .qsmm-tour-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 26px; }
.qsmm .qsmm-tour-highlight { outline: 3px solid #f58220; outline-offset: 4px; }
.qsmm .qsmm-tutorial-button { white-space: nowrap; }
@media(max-width:600px) { .qsmm.qsmm-tour-overlay { padding: 14px; } .qsmm .qsmm-tour-dialog { padding: 24px; border-radius: 18px; } .qsmm .qsmm-tour-dialog h2 { font-size: 26px; } }
@media(prefers-reduced-motion:reduce) { .qsmm .qsmm-tour-progress span { transition: none; } }